| | |
| | | <div class="message-status"> |
| | | <span>短信回执:</span> |
| | | <el-select v-model="messageStatus" placeholder="请选择"> |
| | | <el-option |
| | | v-for="item in statusList" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.label" |
| | | > |
| | | <el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.label"> |
| | | </el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="find"> |
| | | <el-button type="primary" icon="el-icon-search" @click="getTableData" |
| | | >查询 |
| | | </el-button |
| | | > |
| | | <el-button icon="el-icon-delete-solid" @click="handleReset" |
| | | >重置 |
| | | </el-button |
| | | > |
| | | <el-button type="primary" icon="el-icon-search" @click="getTableData">查询 |
| | | </el-button> |
| | | <el-button icon="el-icon-delete-solid" @click="handleReset">重置 |
| | | </el-button> |
| | | </div> |
| | | </div> |
| | | </header> |
| | |
| | | <div class="mainContent"> |
| | | <div class="main-nav"> |
| | | <span>数据列表</span> |
| | | <el-button |
| | | class="button-addition" |
| | | type="primary" |
| | | icon="el-icon-plus" |
| | | @click="isShowDialog = true" |
| | | >添加 |
| | | </el-button |
| | | > |
| | | <el-button class="button-addition" type="primary" icon="el-icon-plus" @click="isShowDialog = true">添加 |
| | | </el-button> |
| | | </div> |
| | | <!-- 数据展示 --> |
| | | <el-table |
| | | ref="multipleTable" |
| | | :header-cell-style="{ |
| | | <el-table ref="multipleTable" :header-cell-style="{ |
| | | // background: '#06122c', |
| | | 'font-size': '12px', |
| | | color: '#606266', |
| | | 'font-weight': '650', |
| | | 'line-height': '45px', |
| | | }" |
| | | :data="tableData" |
| | | style="width: 100%" |
| | | :row-class-name="tableRowClassName" |
| | | @selection-change="tableChange" |
| | | > |
| | | }" :data="tableData" style="width: 100%" :row-class-name="tableRowClassName" @selection-change="tableChange"> |
| | | <el-table-column type="selection" min-width="5"></el-table-column> |
| | | <el-table-column label="ID" min-width="5" prop="id"> |
| | | <template slot-scope="scope">{{ scope.row.id }}</template> |
| | |
| | | <el-table-column prop="operation" label="操作" min-width="15"> |
| | | <template slot-scope="scope"> |
| | | <div class="operation"> |
| | | <el-link |
| | | class="leftPx" |
| | | icon="el-icon-delete-solid" |
| | | :underline="false" |
| | | @click="handleDelete([scope.row.id])" |
| | | >删除 |
| | | </el-link |
| | | > |
| | | <el-link |
| | | icon="el-icon-edit" |
| | | class="leftPx" |
| | | :underline="false" |
| | | @click="resend(scope.row)" |
| | | >重新发送 |
| | | </el-link |
| | | > |
| | | <el-link class="leftPx" icon="el-icon-view" :underline="false" @click="handleView(scope.row)">查看 |
| | | </el-link> |
| | | <el-link class="leftPx" icon="el-icon-delete-solid" :underline="false" |
| | | @click="handleDelete([scope.row.id])">删除 |
| | | </el-link> |
| | | <el-link icon="el-icon-edit" class="leftPx" :underline="false" @click="resend(scope.row)">重新发送 |
| | | </el-link> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <!-- 新建消息 --> |
| | | <el-dialog |
| | | title="新建消息" |
| | | :destroy-on-close="true" |
| | | :key="dialogType" |
| | | :visible.sync="isShowDialog" |
| | | width="80%" |
| | | :before-close="handleConfirmClose" |
| | | > |
| | | <el-dialog title="新建消息" :destroy-on-close="true" :key="dialogType" :visible.sync="isShowDialog" width="80%" |
| | | :before-close="handleConfirmClose"> |
| | | <MyCreate @closeMyDialog="closeDialog" :type="dialogType"></MyCreate> |
| | | </el-dialog> |
| | | <el-dialog :destroy-on-close="true" :key="dialogType" title="查看消息" :visible.sync="isViewDialog" width="50%" |
| | | :before-close="handleConfirmClose"> |
| | | |
| | | <div class="mainContent1"> |
| | | <el-form ref="user" label-width="140px" autoComplete="on" :model="role" |
| | | label-position="right" disabled=false> |
| | | <!-- 提醒方式 |
| | | <el-form-item class="optionItem" label="提醒方式:" prop="channelCode"> |
| | | <el-radio-group v-model="role.channelCode"> |
| | | <el-radio label="01">站内信</el-radio> |
| | | <el-radio label="03">邮件</el-radio> |
| | | </el-radio-group> |
| | | <span class="message-tip">(短信可用数: 1000条)</span> |
| | | </el-form-item> --> |
| | | <!-- 消息栏目 --> |
| | | <!-- <el-form-item v-if="role.channelCode === '01'" class="optionItem" label="消息栏目:" prop="messageType"> |
| | | <div class="message-item"> |
| | | <div class="message-item__left"> |
| | | <el-select v-model="role.messageType" placeholder="请选择消息栏目"> |
| | | <el-option v-for="item in colList" :key="item.id" :label="item.columnName" :value="item.id"> |
| | | </el-option> |
| | | </el-select> |
| | | </div> |
| | | <span class="message-add" @click="dialogCreate = true"> |
| | | 添加栏目</span> |
| | | </div> |
| | | </el-form-item> --> |
| | | <!-- 消息标题 --> |
| | | <el-form-item class="optionItems" label="消息标题:" prop="head"> |
| | | <div class="message-item__left"> |
| | | <el-input v-model="role.head" placeholder="请选择消息标题"></el-input> |
| | | </div> |
| | | </el-form-item> |
| | | <!-- 接收对象 --> |
| | | <!-- <el-form-item class="optionItem" label="接收对象:" prop="targetTo"> |
| | | <div class="message-item__left"> |
| | | <el-select v-model="role.targetTo" placeholder="请选择接收对象"> |
| | | <el-option :value="role.targetTo"> |
| | | <el-tree ref="tree" :data="departList" :props="defaultProps" show-checkbox @check="handleCheck" |
| | | default-expand-all :default-checked-keys="checkedList" node-key="id"> |
| | | </el-tree> |
| | | </el-option> |
| | | </el-select> |
| | | </div> |
| | | </el-form-item> --> |
| | | <!-- 消息内容 --> |
| | | <el-form-item class="optionItems" label="消息内容:" prop="body" > |
| | | <el-input type="textarea" v-model="role.body" ></el-input> |
| | | </el-form-item> |
| | | <el-form-item class="optionItems" label="发送账号:" prop="head"> |
| | | <div class="message-item__left"> |
| | | <el-input v-model="role.targetFrom"></el-input> |
| | | </div> |
| | | </el-form-item> |
| | | <el-form-item class="optionItems" label="发送时间:" prop="head"> |
| | | <div class="message-item__left"> |
| | | <el-input v-model="role.sendTime"></el-input> |
| | | </div> |
| | | </el-form-item> |
| | | <el-form-item class="optionItems" label="发送号码:" prop="head"> |
| | | <div class="message-item__left"> |
| | | <el-input v-model="role.head"></el-input> |
| | | </div> |
| | | </el-form-item> |
| | | <el-form-item class="optionItems" label="接受手机号:" prop="head"> |
| | | <div class="message-item__left"> |
| | | <el-input v-model="role.phoneNumber"></el-input> |
| | | </div> |
| | | </el-form-item> <el-form-item class="optionItems" label="回执状态:" prop="head"> |
| | | <div class="message-item__left"> |
| | | <el-input v-model="role.respondResult"></el-input> |
| | | </div> |
| | | </el-form-item> |
| | | </el-form> |
| | | </div> |
| | | |
| | | |
| | | </el-dialog> |
| | | <div class="tools"> |
| | | <div class="funs"> |
| | | <div class="funsItem funs-sp"> |
| | | <el-checkbox v-model="all" @change="selectAll()" |
| | | >全选 |
| | | </el-checkbox |
| | | > |
| | | <el-checkbox v-model="all" @change="selectAll()">全选 |
| | | </el-checkbox> |
| | | </div> |
| | | <div class="funsItem funs-sp"> |
| | | <el-checkbox v-model="unsame" @change="disSame(tableData)" |
| | | >反选 |
| | | </el-checkbox |
| | | > |
| | | <el-checkbox v-model="unsame" @change="disSame(tableData)">反选 |
| | | </el-checkbox> |
| | | </div> |
| | | <div class="funsItem"> |
| | | <el-select |
| | | v-model="myIdx" |
| | | placeholder="批量操作" |
| | | @change="selectChange" |
| | | > |
| | | <el-option |
| | | v-for="item in options" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | > |
| | | <el-select v-model="myIdx" placeholder="批量操作" @change="selectChange"> |
| | | <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> |
| | | </el-option> |
| | | </el-select> |
| | | </div> |
| | | </div> |
| | | <div class="pagination"> |
| | | <el-pagination |
| | | background |
| | | :current-page="currentPage" |
| | | layout="prev, pager, next" |
| | | :total="totalNum" |
| | | :page-size="pageSize" |
| | | @current-change="changeCurrentPage" |
| | | > |
| | | <el-pagination background :current-page="currentPage" layout="prev, pager, next" :total="totalNum" |
| | | :page-size="pageSize" @current-change="changeCurrentPage"> |
| | | </el-pagination> |
| | | </div> |
| | | </div> |
| | |
| | | <script> |
| | | import helper from "@/utils/mydate"; |
| | | import MyCreate from "./createSms"; |
| | | import MyEditor from "@/components/edit"; |
| | | |
| | | import { |
| | | getMessageList, |
| | | deleteMessage, |
| | |
| | | |
| | | export default { |
| | | components: { |
| | | MyCreate, |
| | | MyCreate,MyEditor |
| | | }, |
| | | data() { |
| | | return { |
| | | role: {}, |
| | | tableData: [], |
| | | context: null, |
| | | isShowDialog: false, |
| | | isViewDialog: false, |
| | | totalNum: null, |
| | | pageSize: 10, |
| | | currentPage: 1, |
| | |
| | | this.getTableData(); |
| | | }, |
| | | methods: { |
| | | handleView(val) { |
| | | this.isViewDialog = true |
| | | this.role = val; |
| | | }, |
| | | // 重置 |
| | | handleReset() { |
| | | this.context = null; |
| | |
| | | //&::v-deep .el-switch .el-switch__label { |
| | | // width: 50px !important; |
| | | //} |
| | | |
| | | .mainContent1 { |
| | | display: flex; |
| | | justify-content: center; |
| | | padding-top: 50px; |
| | | &:deep(.el-dialog__title) { |
| | | //color: #4b9bb7; |
| | | } |
| | | &::v-deep .el-form-item__label { |
| | | //color: #4b9bb7; |
| | | } |
| | | |
| | | &::v-deep .el-input__inner { |
| | | width: 400px; |
| | | //background-color: #09152f; |
| | | //border: 1px solid #17324c; |
| | | } |
| | | |
| | | .message-item__left { |
| | | width: 400px; |
| | | } |
| | | |
| | | .message-add { |
| | | &:hover { |
| | | cursor: pointer; |
| | | } |
| | | } |
| | | |
| | | .el-form-item__content :deep(.el-select) { |
| | | width: 400px; |
| | | } |
| | | |
| | | :deep(.el-input) { |
| | | width: 400px; |
| | | } |
| | | |
| | | .message-item { |
| | | display: flex; |
| | | |
| | | span { |
| | | margin-left: 20px; |
| | | color: #606266; |
| | | } |
| | | } |
| | | |
| | | .message-tip { |
| | | margin-left: 20px; |
| | | } |
| | | |
| | | :deep(.el-input--suffix) { |
| | | width: 400px; |
| | | } |
| | | |
| | | // &::v-deep .el-textarea__inner { |
| | | // //background-color: #09152f; |
| | | // //border: 1px solid #17324c; |
| | | // } |
| | | |
| | | .el-form-item__content { |
| | | width: 400px; |
| | | |
| | | .el-select { |
| | | width: 100%; |
| | | } |
| | | } |
| | | |
| | | .optionHandleSp { |
| | | display: flex; |
| | | |
| | | .areaNumber, |
| | | .moreNumber { |
| | | flex: 1; |
| | | } |
| | | |
| | | .telNumber { |
| | | flex: 2; |
| | | } |
| | | } |
| | | |
| | | .optionBtn { |
| | | display: flex; |
| | | margin-top: 20px; |
| | | |
| | | .btn { |
| | | padding: 12px 50px; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | |
| | | //&::v-deep .el-dialog__header, |