zhanghua
2023-02-21 fb1d57f4bce31fe4f8147a144f8ef4afbca0a4cd
src/views/operate/viewEvent/index.vue
@@ -1,7 +1,7 @@
<template>
  <div class="userList">
    <header>
      <div class="headerTitle">运营管理 >> 案卷查询</div>
<!--      <div class="headerTitle">运营管理 >> 案卷查询</div>-->
      <div class="headerContent">
        <div class="contentItem">
          <div style="width: 80px">按编号:</div>
@@ -37,7 +37,7 @@
          </div>
        </div>
        <div class="btn">
          <el-button type="primary" @click="getList">搜索</el-button>
          <el-button type="primary" @click="getList">查询</el-button>
        </div>
      </div>
      <div class="headerContent">
@@ -75,7 +75,9 @@
          :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 prop="code" label="事件编号" min-width="18">
            <template slot-scope="scope">
              <el-link @click="handleView(scope.row)">{{ scope.row.code }}</el-link>
@@ -158,6 +160,34 @@
        </el-dialog>
        <!-- tools -->
        <div class="tools">
          <div class="funs">
            <div class="funsItem">
              <el-checkbox v-model="all" @change="selectAll()"
              >全选</el-checkbox
              >
            </div>
            <div class="funsItem">
              <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"
                    :disabled="item.disabled"
                >
                </el-option>
              </el-select>
            </div>
          </div>
          <div class="pagination">
            <el-pagination
              background
@@ -197,6 +227,28 @@
  },
  data() {
    return {
      all: false,
      unsame: false,
      myIdx: 0,
      options: [
        {
          value: 0,
          label: "批量操作",
          disabled: true,
        },
        {
          value: 1,
          label: "批量启用",
        },
        {
          value: 2,
          label: "批量禁用",
        },
        {
          value: 3,
          label: "批量删除",
        },
      ],
      datepick: null,
      tableData: [],
      dialogExamine: false,
@@ -229,6 +281,40 @@
    this.getCommunityOptions();
  },
  methods: {
    // 批量删除
    mulDelete(idArr) {},
    // 执行下拉框操作
    selectChange(val) {
      let ids = [];
      this.tempList.forEach((item) => {
        ids.push(item.number);
      });
      if (ids.length !== 0) {
        if (val === 3) {
          this.mulDelete(ids);
        }
      } else {
        this.$message({
          type: "warning",
          message: "您还没选中任何数据",
        });
      }
    },
    // 监听表格选中状态
    tableChange(list) {
      this.tempList = list;
      this.all = list.length === this.tableData.length;
    },
    // 全选
    selectAll() {
      this.$refs.multipleTable.toggleAllSelection();
    },
    // 反选
    disSame(list) {
      list.forEach((row) => {
        this.$refs.multipleTable.toggleRowSelection(row);
      });
    },
    // 获取列表
    getList() {
      const searchData = Object.assign({}, this.searchData);
@@ -345,7 +431,7 @@
  }
  main {
    background-color: #fff;
    //background-color: #fff;
    margin-top: 20px;
    padding-bottom: 50px;
@@ -370,6 +456,7 @@
          line-height: 28px;
          display: flex;
          align-items: center;
          border: 1px solid #ccc;
          border-radius: 4px;
          font-size: 12px;
          margin-left: 10px;