epmet-oper-gov/src/views/modules/shujuduibi/canji.vue

<template>
  <div>
    <base-page
      ref="basePage"
      :searchParams="searchParams"
      :tableParams="tableParams"
      :tableUrl="tableUrl"
      :delMultipleUrl="delMultipleUrl"
      :infoUrl="infoUrl"
      :exportUrl="exportUrl"
      :editParams="editParams"
      :editParamsDiv="5"
      idName="id"
    >
      <template v-slot:listBtn="{ multipleSelection }">
        <el-button @click="handleSyncMultiple(multipleSelection)" size="small"
          >批量更新</el-button
        >
      </template>

      <template v-slot:listBtnSup="{ item }">
        <el-button type="text" @click="handleSync(item)" size="small"
          >全部更新</el-button
        >
      </template>

      <template v-slot:editBottomSup="{ id, info }">
        <div class="m-duibi">
          <h3>对比信息</h3>
          <el-table
            :data="cookInfo(info)"
            style="width: 100%"
            :row-class-name="tableRowClassName"
          >
            <el-table-column prop="resiInfo" label="数据库信息">
            </el-table-column>
            <el-table-column prop="result" label="结果"></el-table-column>
          </el-table>
        </div>
      </template>
    </base-page>
  </div>
</template>

<script>
import basePage from "@/views/modules/cpts/base/index";
import { requestPost } from "@/js/dai/request";

export default {
  props: {},

  data() {
    return {
      searchParams: [
        { field: "姓名", keyName: "name", type: "input" },
        { field: "证件号", keyName: "idCard", type: "input" },
        { field: "手机", keyName: "mobile", type: "input" },
      ],

      tableParams: [
        { field: "选择框", keyName: "", type: "selection" },
        { field: "序号", keyName: "", type: "no" },
        { field: "姓名", keyName: "name", type: "text" },
        { field: "证件号", keyName: "idCard", type: "text", width: 200 },
        { field: "手机", keyName: "mobile", type: "text", width: 120 },
        { field: "性别", keyName: "genderCn", type: "text" },
        { field: "民族", keyName: "mzCn", type: "text" },
        { field: "家庭住址", keyName: "address", type: "text" },
        { field: "残疾类别", keyName: "cjlbCn", type: "text" },
        { field: "残疾等级", keyName: "cjzkCn", type: "text" },
        { field: "残疾证号", keyName: "cardNum", type: "text", width: 200 },
        { field: "监护人", keyName: "guardian", type: "text" },
        { field: "状态", keyName: "dealStatusName", type: "text" },
        { field: "失败原因", keyName: "dealResult", type: "text" },
      ],

      tableUrl: "/epmetuser/dataSyncRecordDisability/page",
      delMultipleUrl: "/epmetuser/dataSyncRecordDisability/delete",

      infoUrl: "/epmetuser/dataSyncRecordDisability/detail/",
      //   delUrl: "/gov/org/icDangerousChemicals/del",
      exportUrl: "/epmetuser/dataSyncRecordDisability/export",

      editParams: [
        { field: "姓名", keyName: "name", type: "input" },
        { field: "证件号", keyName: "idCard", type: "input" },
        { field: "手机", keyName: "mobile", type: "input" },
        { field: "性别", keyName: "genderCn", type: "input" },
        { field: "民族", keyName: "mzCn", type: "input" },
        { field: "家庭住址", keyName: "address", type: "input" },
        { field: "残疾类别", keyName: "cjlbCn", type: "input" },
        { field: "残疾等级", keyName: "cjzkCn", type: "input" },
        { field: "残疾证号", keyName: "cardNum", type: "input" },
        { field: "监护人", keyName: "guardian", type: "input" },
        { field: "状态", keyName: "dealStatusName", type: "input" },
        { field: "失败原因", keyName: "dealResult", type: "input" },
      ],
    };
  },
  components: { basePage },
  computed: {},
  watch: {},

  async mounted() {},

  methods: {
    cookInfo(info) {
      let arr = [
        { field: "姓名", keyName: "name", type: "text" },
        { field: "证件号", keyName: "idCard", type: "text" },
        { field: "手机", keyName: "mobile", type: "text" },
        { field: "性别", keyName: "genderCn", type: "text" },
        { field: "民族", keyName: "mzCn", type: "text" },
        { field: "家庭住址", keyName: "address", type: "text" },
        { field: "残疾类别", keyName: "cjlbCn", type: "text" },
        { field: "残疾等级", keyName: "cjzkCn", type: "text" },
        { field: "残疾证号", keyName: "cardNum", type: "text" },
        { field: "监护人", keyName: "guardian", type: "text" },
      ];
      return arr.map((item) => {
        let val = (info && info[item.keyName]) || "--";
        let resiVal =
          (info && info.resiInfo && info.resiInfo[item.keyName]) || "--";

        return {
          resiInfo: item.field + "：" + resiVal,
          result: resiVal == val ? "一致" : "不一致",
        };
      });
    },

    tableRowClassName({ row }) {
      if (row.result === "不一致") {
        return "z-stress";
      }
      return "";
    },

    async handleSync(item) {
      const { data, code, msg } = await requestPost(
        "/epmetuser/dataSyncRecordDisability/batchUpdate",
        [item["id"]]
      );

      if (code === 0) {
        this.$message.success("更新成功！");
        this.$refs.basePage.getTableData();
      } else {
        this.$message.error("操作失败！");
      }
    },

    async handleSyncMultiple(multipleSelection) {
      const { data, code, msg } = await requestPost(
        "/epmetuser/dataSyncRecordDisability/batchUpdate",
        [...multipleSelection.map((item) => item["id"])]
      );

      if (code === 0) {
        this.$message.success("批量更新成功！");
        this.$refs.basePage.getTableData();
      } else {
        this.$message.error("操作失败！");
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.m-duibi {
  padding: 10px;
}

::v-deep .el-table .z-stress {
  background: oldlace;
}
</style>