gcs-ui-lib 1.0.1

package/packages/Trade/src/components/pendingEvent/index.vue

@@ -0,0 +1,934 @@
+/* 待处理 */
+<template>
+  <cl-page style="height: 100%">
+    <template slot="header">
+      <div class="flex-box flex-lr flex-v">
+        <div class="flex-box flex-v">
+          <cl-secondary-tab
+            :init.sync="name"
+            :data="tabList"
+            @click="tabClick"
+          />
+        </div>
+        <div>
+          <el-button
+            icon="n20-icon-shuaxin"
+            plain
+            onlyicon
+            size="mini"
+            @click="filterFn"
+          />
+          <el-button
+            icon="n20-icon-iconfontshaixuan "
+            plain
+            onlyicon
+            size="mini"
+            class="m-l-s"
+            @click="multiple = !multiple"
+          />
+          <el-button
+            v-hasG="pageRelaNo.cancel"
+            class="m-l-s"
+            plain
+            size="mini"
+            :disabled="cancelDisabled"
+            @click="cancelFn"
+            >{{ $t("common_t_0002") }}</el-button
+          >
+          <el-button
+            v-hasG="pageRelaNo.del"
+            class="m-l-s"
+            plain
+            size="mini"
+            :disabled="removeDisabled"
+            @click="removeFn"
+            >{{ $t("common_t_0003") }}</el-button
+          >
+          <el-button
+            v-if="showShowColumn"
+            class="m-l-s"
+            plain
+            size="mini"
+            @click="dialogVisible = true"
+            >{{ $t("common_t_0004") }}</el-button
+          >
+
+          <cl-show-column
+            ref="showColumn"
+            :dialog-visible.sync="dialogVisible"
+            :check-columns="checkColumns"
+            :columns="originColumn"
+            label-key="label"
+            @setColumns="setChange"
+          />
+        </div>
+      </div>
+      <div class="flex-box flex-lr flex-v">
+        <!-- <div> -->
+        <cl-advanced-filter
+          :visible.sync="multiple"
+          :filterId="filterId"
+          onlyKey="id"
+          ref="cl-filters"
+          :model="searchObj"
+          :filter-list="filterList"
+          @clear="clearFn"
+          @search="filterFn"
+          @enter="filterFn"
+        >
+          <cl-date-picker-por
+            slot="startTime"
+            :start-date.sync="searchObj.startTime"
+            :end-date.sync="searchObj.endTime"
+            type="daterange"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            :defaultTime="['00:00:00', '23:59:59']"
+          />
+        </cl-advanced-filter>
+        <!-- </div> -->
+      </div>
+    </template>
+    <div class="table-wrap" style="height: 100%">
+      <div class="table-content">
+        <cl-table-pro
+          ref="vTable"
+          :sort-config="{ remote: false, sortMethod }"
+          height="100%"
+          :data="tableDate"
+          :clearSelect="false"
+          :columns="tableCloumn"
+          :row-config="{ useRowKey: 'businessId', keyField: 'businessId' }"
+          :checkbox-config="{
+            reserve: true,
+          }"
+          @selection-change-method="selectionChange"
+        >
+          <vxe-column
+            slot="businessId"
+            slot-scope="{ column }"
+            v-bind="column"
+            :class-name="column.wrap && 'vxe-table-custom-wrap'"
+            :field="column.prop"
+            :title="column.label"
+          >
+            <el-link
+              slot-scope="{ row }"
+              :underline="false"
+              type="primary"
+              class="text-ellipsis"
+              style="display: block"
+              @click="seeFn(row)"
+              >{{ row.businessId }}</el-link
+            >
+          </vxe-column>
+          <vxe-column
+            slot="state"
+            slot-scope="{ column }"
+            :class-name="column.wrap && 'vxe-table-custom-wrap'"
+            v-bind="column"
+            :field="column.prop"
+            :title="column.label"
+          >
+            <span slot-scope="{ row }">{{ stateF(row.state) }}</span>
+          </vxe-column>
+          <vxe-column
+            v-if="stateSomeGo == '3'"
+            slot="suggestion"
+            slot-scope="{ column }"
+            :class-name="column.wrap && 'vxe-table-custom-wrap'"
+            v-bind="column"
+            :field="column.prop"
+            :title="column.label"
+          >
+            <span slot-scope="{ row }">{{ row.suggestion }}</span>
+          </vxe-column>
+          <cl-table-pro-operate-column
+            slot="operate"
+            :btn-list="btnList"
+            :label="$t('common_t_0005')"
+            width="180"
+            fixed="right"
+            align="center"
+            @click="(row) => dealFn(row)"
+            @del="(row) => removeFn([row])"
+            @cancel="(row) => cancelFn([row])"
+          />
+        </cl-table-pro>
+      </div>
+    </div>
+    <div slot="footer" class="flex-box flex-v m-t-s">
+      <cl-statis :page-sum="selectRows.length" :total-sun="pageObj.totalSize" />
+
+      <cl-pagination
+        :page-sizes="pageSizes"
+        class="m-l-auto"
+        :page-obj="pageObj"
+        :page-key="{ no: 'pageNo', size: 'pageSize', total: 'totalSize' }"
+        @change="getTableData"
+      />
+    </div>
+  </cl-page>
+</template>
+
+<script>
+import dCloumn from "../getDCloumn.js";
+import dynamicColumnMixin from "../dynamicColumnMixin.js";
+import unitName from "../setUnitName.js";
+import {
+  Pagination,
+  Statis,
+  TablePro,
+  TableProOperateColumn,
+  ShowColumn,
+  SecondaryTab,
+  AdvancedFilter,
+  DatePickerPor,
+  Page,
+} from "n20-common-lib";
+import { pendingEventPath, rplsToDeal } from "../specialHandle.js";
+import { appUrl } from "../server-config.js";
+export default {
+  props: {
+    appNo: {
+      type: String,
+      required: true,
+    },
+    filterId: {
+      type: String,
+      required: true,
+    },
+    tabList: {
+      type: Array,
+      required: true,
+    },
+    pageRelaNo: {
+      type: Object,
+      required: true,
+    },
+  },
+  components: {
+    ClPage: Page,
+    ClPagination: Pagination,
+    ClStatis: Statis,
+    ClTablePro: TablePro,
+    ClTableProOperateColumn: TableProOperateColumn,
+    ClShowColumn: ShowColumn,
+    ClSecondaryTab: SecondaryTab,
+    ClAdvancedFilter: AdvancedFilter,
+    ClDatePickerPor: DatePickerPor,
+  },
+  mixins: [dynamicColumnMixin],
+  data(vm) {
+    return {
+      name: vm.$t("common_t_0001"),
+      showShowColumn: false,
+      appUrl,
+      multiple: true,
+      promptType: 1,
+      active: true,
+      verifyMsg: {
+        checkFlowVoList: [],
+      },
+      defaultProps: {
+        children: "children",
+        label: "label",
+      },
+      pageSizes: [20, 50, 100],
+      // eslint-disable-next-line vue/no-reserved-keys
+      _typeCodesOptions: [],
+      appCodeOptions: [],
+      typeCodesOptions: [],
+      dialogVisible: false,
+      checkColumns: [],
+      btnDisabled: false,
+      searchObj: {
+        typeCodes: []
+      },
+      size: "small",
+      sizeBind: undefined,
+      isShowCard: false,
+      cardData: [],
+      btnList: [
+        {
+          label: vm.$t("common_t_0009"),
+          command: "click",
+          isHas: (row) =>
+            row.typeCode !== "resetPassword" &&
+            this.$hasG(this.pageRelaNo.eidit),
+        },
+        {
+          label: vm.$t("common_t_0002"), //作废
+          command: "cancel",
+          isHas: (row) =>
+            row.typeCode !== "resetPassword" &&
+            this.$hasG(this.pageRelaNo.cancel) &&
+            (row.state == "3" || row.state == "2"),
+        },
+        {
+          label: vm.$t("common_t_0003"), //删除
+          command: "del",
+          isHas: (row) =>
+            row.typeCode !== "resetPassword" &&
+            this.$hasG(this.pageRelaNo.del) &&
+            row.state == "1",
+        },
+      ],
+      filterList: [
+        {
+          id: "typeCodes",
+          label: vm.$t("common_t_0010"), //交易类型
+          type: "select",
+          value: "typeCodes",
+          props: {
+            multiple: true,
+          },
+          isDefault: true,
+          options: [],
+        },
+        {
+          id: "businessId",
+          label: vm.$t("common_t_0011"), //业务流水号
+          type: "text",
+          value: "businessId",
+          isDefault: true,
+        },
+        {
+          id: "states",
+          label: vm.$t("common_t_0014"), //交易状态
+          type: "select",
+          value: "states",
+          options: [
+            { label: vm.$t("common_t_0006"), value: "1" },
+            { label: vm.$t("common_t_0007"), value: "2" },
+            { label: vm.$t("common_t_0008"), value: "3" },
+          ],
+          isDefault: true,
+          props: {
+            multiple: true,
+          },
+        },
+        {
+          id: "minAmount",
+          label: vm.$t("common_t_0013"), //金额
+          type: "numberrange",
+          startValue: "minAmount",
+          endValue: "maxAmount",
+          isDefault: true,
+        },
+        {
+          id: "dataMember",
+          label: vm.$t("common_t_0012"), //单位名称
+          type: "text",
+          value: "dataMember",
+          isDefault: true,
+        },
+        {
+          id: "applyUserName",
+          label: vm.$t("common_t_0015"), //发起人
+          type: "text",
+          value: "applyUserName",
+          isDefault: false,
+        },
+        {
+          slotName: "startTime",
+          id: "startTime",
+          label: vm.$t("common_t_0016"), //发起时间
+          type: "daterange",
+          startDate: "startTime",
+          endDate: "endTime",
+          props: {
+            valueFormat: "yyyy-MM-dd HH:mm:ss",
+            defaultTime: ["00:00:00", "23:59:59"],
+          },
+          isDefault: false,
+        },
+      ],
+      pageObj: {
+        pageNo: 1, // 接口需要的页码
+        pageSize: 50, // 接口需要的请求条数
+        totalSize: 0, // 接口返回的总条数
+      },
+      tableDate: [],
+      currentAmount: 0,
+      totalAmount: 0,
+      staticCloumn: [
+        {
+          type: "checkbox",
+          width: "56",
+          align: "center",
+          static: "pre", // 静态不被"显示列"显示的,且最终会被拼接到"显示列"排序后的表格的"前面"
+        },
+        {
+          type: "seq",
+          label: vm.$t("common_t_0017"), //序号
+          width: "56",
+          align: "center",
+          static: "pre",
+        },
+        {
+          label: vm.$t("common_t_0011"), //业务流水号
+          slotName: "businessId",
+          "minWidth": "180",
+          "show-overflow-tooltip": true,
+          prop: "businessId",
+          checked: true,
+          isDefault: true,
+        },
+        {
+          label: vm.$t("common_t_0010"), //交易类型
+          align: "center",
+          "minWidth": "120",
+          "show-overflow-tooltip": true,
+          prop: "typeName",
+          isDefault: true,
+        },
+        {
+          label: vm.$t("common_t_0012"), //单位名称
+          align: "left",
+          "minWidth": "240",
+          "show-overflow-tooltip": true,
+          prop: "dataMember",
+          isDefault: true,
+        },
+        {
+          label: vm.$t("common_t_0018"), //币种
+          "minWidth": "113",
+          "show-overflow-tooltip": true,
+          prop: "currencyName",
+          isDefault: true,
+        },
+        {
+          label: vm.$t("common_t_0013"), //金额
+          "show-overflow-tooltip": true,
+          prop: "amount",
+          "minWidth": "190",
+          align: "right",
+          formatter: "formatAmount", // 金额格式化
+          isDefault: true,
+        },
+        {
+          label: vm.$t("common_t_0014"), //交易状态
+          "minWidth": "100",
+          prop: "state",
+          slotName: "state",
+          isDefault: true,
+        },
+        {
+          label: vm.$t("common_t_0019"), //驳回原因
+          prop: "rejmessage",
+          align: "left",
+          "minWidth": "180",
+          "show-overflow-tooltip": true,
+          isDefault: true,
+        },
+        {
+          label: vm.$t("common_t_0016"), //发起时间
+          "minWidth": "180",
+          prop: "createTime",
+          sortable: true,
+          isDefault: true,
+        },
+        {
+          label: vm.$t("common_t_0020"), //更新时间
+          "minWidth": "180",
+          prop: "updateTime",
+          sortable: true,
+          isDefault: true,
+        },
+        {
+          label: vm.$t("common_t_0015"), //发起人
+          "minWidth": "120",
+          "show-overflow-tooltip": true,
+          prop: "applyUserName",
+          isDefault: true,
+        },
+        {
+          slotName: "operate",
+          width: "180",
+          static: "next", // 静态不被"显示列"显示的,且最终会被拼接到"显示列"排序后的表格的"后面"
+        },
+      ], // 静态列
+      dynamicCloumn: [], // 动态列
+      selectRows: [],
+      selectAmoubt: 0,
+      stateSomeGo: "",
+      isG20: true,
+      typeTree: [],
+      isFlowWhether: false,
+      flowOptions: [],
+      reasonSelect: "",
+      reason: "",
+    };
+  },
+  computed: {
+    tableCloumn() {
+      return this.checkColumns.length
+        ? this.checkColumns
+        : [...this.staticCloumn, ...this.dynamicCloumn];
+    },
+    originColumn() {
+      return [...this.staticCloumn, ...this.dynamicCloumn];
+    },
+    isSingleSlt() {
+      let typeNames = new Set(this.selectRows.map((r) => r.typeName));
+      return typeNames.size === 1;
+    },
+    removeDisabled() {
+      if (this.isSingleSlt) {
+        return !!this.selectRows.some((r) => r.state !== 1);
+      } else {
+        return true;
+      }
+    },
+    cancelDisabled() {
+      if (this.isSingleSlt) {
+        return !!this.selectRows.some((r) => r.state == 1);
+      } else {
+        return true;
+      }
+    },
+  },
+  watch: {
+    stateSomeGo() {
+      this.$nextTick(() => {
+        this.$refs.tableRef?.doLayout();
+      });
+    },
+  },
+  created() {
+    const { id } = this.$route.query;
+    if (id) {
+      this.$set(this.searchObj, "typeCodes", [id]);
+      this.getDynamicColumn(id, "2");
+    }
+  },
+  activated() {
+    this.name = this.$t("common_t_0001");
+    this.clearSelection();
+    this.init();
+  },
+  deactivated() {},
+  mounted() {
+    // this.init();
+  },
+  methods: {
+    clearSelection() {
+      this.$refs.vTable?.clearSelection();
+      this.$refs.vTable?.$refs?.[`vxeTable`]?.clearCheckboxRow();
+      this.$refs.vTable?.$refs?.[`vxeTable`]?.clearCheckboxReserve();
+      this.$nextTick(() => {
+        this.selectRows = [];
+      });
+    },
+    stateF(state) {
+      switch (state + "") {
+        case "1":
+          return this.$t("common_t_0006"); //已保存
+        case "2":
+          return this.$t("common_t_0007"); //已撤回
+        case "3":
+          return this.$t("common_t_0008"); //已驳回
+        default:
+          return "-";
+      }
+    },
+    tabClick(item) {
+      this.$emit("tabChange", item.path);
+    },
+    setTreeData(data = []) {
+      const typeCodeMap = {};
+      data.forEach((item) => {
+        if (!typeCodeMap[item.appCode]) {
+          typeCodeMap[item.appCode] = {
+            value: item.appCode,
+            label: item.appName,
+            level: 1,
+            _item: item,
+            children: [],
+          };
+        }
+        typeCodeMap[item.appCode].children.push({
+          level: 2,
+          _item: item,
+          value: item.typeCode,
+          label: item.typeName,
+        });
+      });
+      this.typeTree = Object.values(typeCodeMap);
+      this.typeTree.unshift({
+        label: "全部审批",
+        value: "",
+        level: 1,
+      });
+    },
+    setChange(list) {
+      const index = list.findIndex((res) => res.isNew && !res.children);
+      if (index !== -1) return this.$message.warning(`新增字段必须包含子级！`);
+      let dto = {
+        approvalType: "2",
+        typeCode: this.searchObj.typeCodes?.join() || null,
+        sortColumn: JSON.stringify(list),
+      };
+      this.saveDynamicColumn(dto);
+      this.dialogVisible = false;
+      this.timer = setTimeout(() => {
+        this.getDynamicColumn(this.searchObj.typeCodes?.join(), "2");
+      }, 300);
+    },
+    /**
+     * @description 获取业务类型
+     */
+    async getAppCode() {
+      const { data, code } = await this.$axios.post(
+        "/bems/activiti/online/list/appnos",
+        null,
+        { loading: false }
+      );
+      if (code === 200) {
+        this.appCodeOptions = data?.map((d) => ({
+          label: d.appName,
+          value: d.appno,
+        }));
+      }
+    },
+    async getTypeCodes() {
+      this.$refs?.["cl-filters"]?.setOptions("typeCodes", []);
+      const { data, code } = await this.$axios.get(
+        "/bems/prod_1.0/activiti/temporaryStorage/typeList/1",
+        null,
+        {
+          loading: false,
+        }
+      );
+      if (code === 200) {
+        const excludes= ['CTMS_FM001', 'CTMS_FM012']
+        this.typeCodesOptions = this._typeCodesOptions = data
+          ?.map((d) => ({
+            label: d.typeName,
+            value: d.typeCode,
+            appCode: d.appCode,
+          }))
+          .filter((item) => {
+            if (item.appCode === 'CTMS' && this.appNo === 'CTMS'){
+              return !excludes.includes(item.value)
+            }
+            return item.appCode === this.appNo
+          });
+
+        // this.setTreeData(data);
+        this.$refs["cl-filters"].setOptions("typeCodes", this.typeCodesOptions);
+      }
+    },
+
+    init() {
+      // this.getAppCode();
+      this.getTypeCodes();
+      this.getCloumn();
+      this.getTableData();
+    },
+    reFresh() {
+      this.pageObj.pageNo = 1;
+      this.clearSelection();
+      this.getTableData();
+    },
+    async clearFn() {
+      this.searchObj = {};
+      this.pageObj.pageNo = 1;
+      this.checkColumns = [];
+      // this.filterFn();
+    },
+    async filterFn() {
+      this.pageObj.pageNo = 1;
+      this.clearSelection();
+      await this.getCloumn();
+      if (this.searchObj.typeCodes?.length > 0) {
+        this.getDynamicColumn(this.searchObj.typeCodes.join(), "2");
+      }
+      await this.getTableData();
+    },
+    async getCloumn() {
+      if (this.searchObj.typeCodes?.length === 1) {
+        let { data } = await this.$axios.post(
+          "/bems/prod_1.0/activiti/importantInfo/setting/audit/analysis/list",
+          {
+            typeCode: this.searchObj.typeCodes[0],
+          }
+        );
+        data || (data = []);
+        // 有些业务动态列有单位名称，需要过滤掉
+        this.dynamicCloumn = data.filter(item=>item.name!='单位名称' && item.name!='unitName').map((d) => ({
+          label: d.name,
+          prop: d.column,
+          // sortable: true,
+          "minWidth": "120",
+          "show-overflow-tooltip": true,
+        }));
+        this.showShowColumn = true;
+      } else {
+        this.dynamicCloumn = [];
+        this.checkColumns = [];
+        this.showShowColumn = false;
+      }
+    },
+    async getTableData() {
+      let specialCodes = []
+      if (this.appNo === 'CTMS') {
+        specialCodes = [
+          'CTMS_FM002',
+          'CTMS_FM003',
+          'CTMS_FM004',
+          'CTMS_FM005',
+          'CTMS_FM007',
+          'CTMS_FM008',
+          'CTMS_FM009',
+          'CTMS_FM010',
+          'CTMS_FM011',
+        ]
+      }
+      let { data } = await this.$axios.post(
+        "/bems/prod_1.0/activiti/temporaryStorage/todoTask",
+        {
+          ...this.searchObj,
+          ...this.pageObj,
+          typeCodes: this.appNo === 'CTMS'
+              ? (this.searchObj.typeCodes.length ? this.searchObj.typeCodes : specialCodes)
+              : this.searchObj.typeCodes,
+          appCode: this.appNo,
+        }
+      );
+      this.stateSomeGo = this.searchObj.states;
+      this.tableDate = data.list ? data.list.map(unitName) : [];
+      console.log(this.tableCloumn, "tableCloumn");
+      this.currentAmount = data.currentAmount;
+      this.totalAmount = data.totalAmount;
+      this.pageObj.totalSize = data.totalSize;
+      // if (!this.tableDate?.length) {
+      //   this.searchObj.typeCodes = [];
+      // }
+    },
+    selectionChange(val) {
+      this.selectRows = val;
+      let num = 0;
+      for (var i = 0; i < this.selectRows.length; i++) {
+        num += this.selectRows[i].amount;
+      }
+      this.selectAmoubt = Number(num.toFixed(6));
+    },
+    /* XXX: 要求在specialHandle.js文件里添加业务的特殊处理 */
+    async dealFn(row) {
+      // const { appUrl = {} } = await getJsonc("../server-config.jsonc");
+      if (
+        row.appCode === "RPLS" &&
+        [this.$t("common_t_0022"), this.$t("common_t_0023")].includes(
+          row.typeName
+        )
+      ) {
+        rplsToDeal(row, this.reFresh);
+        return;
+      }
+      if (this.appUrl[row.appCode]) {
+        let path =
+          pendingEventPath(row, this.appUrl) ||
+          this.appUrl[row.appCode] + "/pending/" + row.typeCode;
+        this.$linkPush(path, {
+          orderId: row.businessId,
+          processInstanceId: row.procInstId,
+          typeCode: row.typeCode,
+          state: row.state,
+          title: row.typeName,
+          appNo: row.appCode,
+          ...dCloumn(row),
+          isTodo: row.appCode === "CFB" ? 1 : undefined,
+        });
+      } else {
+        this.$message.warning(this.$t("common_t_0024"));
+      }
+    },
+    async seeFn(row) {
+      // const { appUrl = {} } = await getJsonc("../server-config.jsonc");
+      if (this.appUrl[row.appCode]) {
+        let path =
+          pendingEventPath(row, this.appUrl) ||
+          this.appUrl[row.appCode] + "/" + row.typeCode;
+        console.log(path, "pathpath");
+        if (["GWMS"].includes(row.appCode)) {
+          path = path.replace("/pending/", "/");
+        }
+
+        let orderIdKey = "orderId";
+        if (this.isG20 && !["USER"].includes(row.appCode)) orderIdKey = "fmId";
+
+        this.$linkPush(path, {
+          [orderIdKey]: row.businessId,
+          processInstanceId: row.procInstId,
+          typeCode: row.typeCode,
+          state: row.state,
+          title: row.typeName,
+          appNo: row.appCode,
+          parent: this.$t("common_t_0025"),
+          isTodo: row.appCode === "CFB" ? 0 : undefined,
+          habtn: true,
+          show: false,
+          ...dCloumn(row),
+        });
+      } else {
+        this.$message.warning(this.$t("common_t_0024"));
+      }
+    },
+    async _submitFn(formData) {
+      let { data } = await this.$axios.post(
+        "/bems/prod_1.0/activiti/temporaryStorage/tempAdvance",
+        formData
+      );
+
+      if (data.failCount > 0) {
+        let templateTitle = `<div>${this.$t("common_t_0041")}${
+          data.successCount
+        }${this.$t("common_t_0042")}${data.failCount}${this.$t(
+          "common_t_0043"
+        )}</div><div>${this.$t("common_t_0044")}</div>`;
+        let message = data.failList
+          .map((f) => `<div>${f.message}</div>`)
+          .join(" ");
+
+        this.$msgboxPor({
+          message: templateTitle + message,
+          dangerouslyUseHTMLString: true,
+          showConfirmButton: true,
+          showCancelButton: false,
+          confirmButtonText: this.$t("common_a_0001"),
+        });
+      } else {
+        // 驳回流程的
+        try {
+          this.$message.success(this.$t("common_t_0026"));
+          this.reFresh();
+        } catch (e) {
+          console.info("未配置驳回消息提示");
+          this.reFresh();
+        }
+      }
+    },
+    removeFn(arr) {
+      const selectRows = arr.length ? arr : this.selectRows;
+      if (selectRows.length === 0) {
+        this.$message.warning(this.$t("common_t_0027"));
+        return;
+      }
+
+      let flag =
+        new Set(selectRows.map((s) => s.appCode + s.typeCode)).size === 1;
+      if (!flag) {
+        this.$message.warning(this.$t("common_t_0028"));
+        return;
+      }
+      this.$msgboxPor({
+        title: this.$t("common_t_0029"),
+        message: this.$t("common_t_0030"),
+        type: "warning",
+        customClass: "question",
+        confirmButtonText: this.$t("common_a_0001"),
+        cancelButtonText: this.$t("common_a_0002"),
+      }).then(() => {
+        // 调用接口删除
+        this.temporarydto = selectRows.map((v) => ({
+          businessId: v.businessId,
+          typeCode: v.typeCode,
+          state: 6,
+        }));
+
+        let formData = {
+          temporarydto: this.temporarydto,
+          plainText: "",
+          signText: "",
+          reason: this.reason,
+        };
+
+        this._submitFn(formData);
+      });
+    },
+
+    cancelFn(arr) {
+      const selectRows = arr.length ? arr : this.selectRows;
+      if (selectRows.length === 0) {
+        this.$message.warning(this.$t("common_t_0027"));
+        return;
+      }
+
+      let flag =
+        new Set(selectRows.map((s) => s.appCode + s.typeCode)).size === 1;
+      if (!flag) {
+        this.$message.warning(this.$t("common_t_0028"));
+        return;
+      }
+      this.$msgboxPor({
+        title: this.$t("common_t_0031"),
+        message: this.$t("common_t_0032"),
+        type: "warning",
+        customClass: "question",
+        confirmButtonText: this.$t("common_a_0001"),
+        cancelButtonText: this.$t("common_a_0002"),
+      }).then(() => {
+        // 调用接口作废
+
+        this.temporarydto = selectRows.map((v) => ({
+          businessId: v.businessId,
+          typeCode: v.typeCode,
+          state: 4,
+        }));
+
+        let formData = {
+          temporarydto: this.temporarydto,
+          plainText: "",
+          signText: "",
+          reason: this.reason,
+        };
+
+        this._submitFn(formData);
+      });
+    },
+  },
+};
+</script>
+<style lang="less">
+.el-range-separator {
+  box-sizing: content-box;
+}
+
+.el-table {
+  .caret-wrapper {
+    height: 23px;
+  }
+
+  .sort-caret.ascending {
+    top: -3px;
+  }
+
+  .sort-caret.descending {
+    bottom: 2px;
+  }
+}
+
+//处理被 flex: 1 的情况下，表格被内容挤开的场景
+.table-wrap {
+  flex: 1 !important;
+  position: relative;
+  height: 100%;
+
+  .table-content {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+  }
+}
+
+.n20-page-content {
+  overflow-y: hidden;
+  display: flex;
+  flex-direction: column;
+}
+
+.n20-advanced-filter {
+  padding: 0 !important;
+}
+</style>