zhanghua
2023-01-09 076a425a64e01b6e24ebde8fb1902fae17ee2797
src/views/operate/sms/smsIndex/index.vue
@@ -12,24 +12,15 @@
        <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>
@@ -37,30 +28,17 @@
      <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>
@@ -76,76 +54,120 @@
          <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>
@@ -156,6 +178,8 @@
<script>
import helper from "@/utils/mydate";
import MyCreate from "./createSms";
import MyEditor from "@/components/edit";
import {
  getMessageList,
  deleteMessage,
@@ -164,13 +188,15 @@
export default {
  components: {
    MyCreate,
    MyCreate,MyEditor
  },
  data() {
    return {
      role: {},
      tableData: [],
      context: null,
      isShowDialog: false,
      isViewDialog: false,
      totalNum: null,
      pageSize: 10,
      currentPage: 1,
@@ -235,6 +261,10 @@
    this.getTableData();
  },
  methods: {
    handleView(val) {
      this.isViewDialog = true
      this.role = val;
    },
    // 重置
    handleReset() {
      this.context = null;
@@ -602,6 +632,94 @@
    //&::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,