<template>
  <div>
    <base-page
      ref="basePage"
      :searchParams="searchParams"
      :tableParams="tableParams"
      :tableUrl="tableUrl"
      :delUrl="delUrl"
      :delMultipleUrl="delMultipleUrl"
      :delAuth="delAuth"
      :infoUrl="infoUrl"
      :exportUrl="exportUrl"
      :editParams="editParams"
      :editElseRules="editElseRules"
      :editBtnName="(item) => (!item.latitude ? '待完善' : '修改')"
      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:editOperateSup="{ id, info }">
        <h3>对比信息</h3>
        <el-table
          :data="cookInfo(info)"
          style="width: 100%"
          :row-class-name="tableRowClassName"
        >
          <el-table-column prop="resiinfo" label="对比信息" width="180">
          </el-table-column>
          <el-table-column prop="result" label="结果">
            <template slot-scope="scope">
              <i class="el-icon-time"></i>
              <span style="margin-left: 10px">{{ scope.row.date }}</span>
            </template>
          </el-table-column>
        </el-table>
      </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" },
        { field: "手机", keyName: "mobile", type: "text" },
        { field: "性别", keyName: "gender", type: "text" },
        { field: "民族", keyName: "mz", type: "text" },
        { field: "家庭住址", keyName: "address", type: "text" },
        { field: "残疾类别", keyName: "cjlb", type: "text" },
        { field: "残疾等级", keyName: "cardNum", type: "text" },
        { field: "残疾证号", keyName: "cjzk", type: "text" },
        { field: "监护人", keyName: "guardian", type: "text" },
        { field: "状态", keyName: "dealStatus", 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: "gender", type: "input" },
        { field: "民族", keyName: "mz", type: "input" },
        { field: "家庭住址", keyName: "address", type: "input" },
        { field: "残疾类别", keyName: "cjlb", type: "input" },
        { field: "残疾等级", keyName: "cardNum", type: "input" },
        { field: "残疾证号", keyName: "cjzk", type: "input" },
        { field: "监护人", keyName: "guardian", type: "input" },
        { field: "状态", keyName: "dealStatus", 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: "gender", type: "text" },
        { field: "民族", keyName: "mz", type: "text" },
        { field: "家庭住址", keyName: "address", type: "text" },
        { field: "残疾类别", keyName: "cjlb", type: "text" },
        { field: "残疾等级", keyName: "cardNum", type: "text" },
        { field: "残疾证号", keyName: "cjzk", type: "text" },
        { field: "监护人", keyName: "guardian", type: "text" },
      ];
      return arr.map((item) => {
        return {
          resiinfo: item.field + "：" + info.resiinfo[item.keyName],
          result:
            info.resiinfo[item.keyName] == info[item.keyName]
              ? "一致"
              : "不一致",
        };
      });
    },

    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>
.el-table .z-stress {
  background: #f0f9eb;
}
</style>
