<template>
  <div class="box-main">
    <MomTable
      ref="MomTable"
      row-key="id"
      :row-selection="rowSelection"
      :columns="tableColumns"
      :data-source="tableData"
      :query-param="queryForm"
      :query-param-item="queryFormItem"
      :total="total"
      :page.sync="page"
      :action-buttons="actionButtons"
      :mega-extend="{
        rowAction: {
          width: 120,
        },
      }"
      @beforeSearch="beforeSearch"
      @search="searchPageData"
      @edit="handleEdit"
      @delete="handleDelete"
      @reset="handleReset"
    >
      <a-row slot="toolbar" class="button-top-table">
        <a-button
          v-if="hasAuth('INTERNATIONAL_MANAGEMENT:ADD')"
          icon="plus"
          @click="handleAdd"
        >
          {{ $t("ADD") }}
        </a-button>
        <a-button
          v-if="hasAuth('INTERNATIONAL_MANAGEMENT:ADD')"
          class="btn__blue-5"
          @click="handleBatchAddition()"
        >
          <Icon type="icon-cur-medicinebox" :size="16" />
          {{ $t("BATCH_ADDITION") }}
        </a-button>
        <a-button
          v-if="hasAuth('INTERNATIONAL_MANAGEMENT:AUDIT')"
          class="btn__orange-1"
          @click="handleBatchAudit()"
        >
          <Icon type="icon-cur-t-piliangshenhe" :size="16" />
          {{ $t("BATCH_AUDIT") }}
        </a-button>
        <a-button class="btn__blue-3" @click="handleBatchCopyJson()">
          <Icon type="icon-cur-t-copyjson" :size="16" />
          {{ $t("COPY_JSON") }}
        </a-button>
        <a-button
          v-if="hasAuth('INTERNATIONAL_MANAGEMENT:EXPORT')"
          class="btn__green-1"
          icon="to-top"
          :disabled="!tableData.length"
          @click="handleExportExcel"
        >
          {{ $t("EXPORT") }}
        </a-button>
        <MomImportButton
          v-if="hasAuth('INTERNATIONAL_MANAGEMENT:IMPORT')"
          object-name="CORE_SYSTEM_I18N"
        />
        <a-button
          v-if="hasAuth('INTERNATIONAL_MANAGEMENT:BATCH_DELETE')"
          type="danger"
          icon="delete"
          @click="handDelete"
        >
          {{ $t("BATCH_DELETE") }}
        </a-button>
      </a-row>
      <span slot="type" slot-scope="text">
        {{ getAttrValue(typeList, text) }}
      </span>
      <span
        slot="status"
        slot-scope="text"
        :class="[text === 'PASS' ? 'text-success' : 'text-error']"
      >
        {{ getAttrValue(statusList, text) }}
      </span>
    </MomTable>
    <MegaDrawer
      :visible="drawerVisible"
      :title="
        isBatchAdd === true
          ? $t('BATCH_ADDITION')
          : form.id
          ? $t('EDIT')
          : $t('ADD')
      "
      width="520"
      @close="handleCloseDrawer"
    >
      <template slot="main">
        <a-form-model
          ref="addForm"
          layout="vertical"
          :model="form"
          :rules="rules"
        >
          <a-row>
            <a-col :span="24">
              <a-form-model-item
                :label="$t('MOM_VERSION')"
                prop="clientTypeName"
              >
                <a-input v-model="form.clientTypeName" disabled />
              </a-form-model-item>
            </a-col>
            <a-col v-if="isBatchAdd === false" :span="24">
              <a-form-model-item :label="$t('CODE')" prop="i18nCode">
                <a-input v-model="form.i18nCode" />
              </a-form-model-item>
            </a-col>
            <a-col :span="24">
              <a-form-model-item :label="$t('TYPE')" prop="type">
                <a-select v-model="form.type">
                  <a-select-option
                    v-for="item in typeList"
                    :key="item.value"
                    :value="item.value"
                  >
                    {{ item.label }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <template v-if="!isBatchAdd">
              <a-col v-for="lang in languages" :key="lang.value" :span="24">
                <a-form-model-item :label="lang.label" :prop="lang.value">
                  <a-input v-model="form[lang.value]" />
                </a-form-model-item>
              </a-col>
            </template>
            <a-col v-if="isBatchAdd === true" :span="24">
              <a-form-model-item :label="$t('I18N')" prop="i18n">
                <a-textarea
                  v-model="form.i18n"
                  :rows="6"
                  :placeholder="$t('I18N_OPERATION_TIPS')"
                />
              </a-form-model-item>
            </a-col>
            <a-col v-if="isBatchAdd === false" :span="24">
              <a-form-model-item :label="$t('PROMPTING')" prop="actionI18nCode">
                <a-select v-model="form.actionI18nCode">
                  <a-select-option
                    v-for="(item, index) in actionI18nCodeList"
                    :key="index"
                    :value="item.i18nCode"
                  >
                    {{ item.i18nCode }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </template>
      <footer slot="footer">
        <a-button type="primary" @click="handleSave()">
          <Icon type="icon-cur-save_1" :size="18" />{{ $t("SAVE") }}
        </a-button>
        <a-button
          v-if="isBatchAdd === false"
          type="primary"
          @click="handleSave('next')"
        >
          <Icon type="icon-cur-save_1" :size="18" />{{
            $t("SAVE_AND_ADD_NEXT")
          }}
        </a-button>
        <a-button @click="handleCloseDrawer">
          <Icon type="icon-dir-f-rollback" :size="18" />{{ $t("CANCEL") }}
        </a-button>
      </footer>
    </MegaDrawer>
    <MegaModal
      :visible="modalVisible"
      :centered="true"
      :mask-closable="false"
      :title="$t('AUDIT')"
      @cancel="handleCloseConfigDrawer"
      @ok="modalVisible = false"
    >
      <a-form-model
        ref="auditForm"
        :model="auditForm"
        :rules="rulesAudit"
        :label-col="{ span: 4 }"
        :wrapper-col="{ span: 20 }"
      >
        <a-row>
          <a-col :span="24">
            <a-form-model-item :label="$t('STATUS')" prop="status">
              <a-radio-group
                v-model="auditForm.status"
                @change="changeStatus()"
              >
                <a-radio
                  v-for="item in statusList"
                  :key="item.value"
                  :value="item.value"
                  >{{ item.label }}</a-radio
                >
              </a-radio-group>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="24">
            <a-form-model-item :label="$t('AUDIT_OPINION')" prop="checkOpinion">
              <a-textarea v-model="auditForm.checkOpinion" :rows="4" />
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
      <template slot="footer">
        <MegaButton type="primary" @click="handleSure()">{{
          $t("CONFIRM")
        }}</MegaButton>
        <MegaButton @click="handleCloseConfigDrawer()">{{
          $t("CANCEL")
        }}</MegaButton>
      </template>
    </MegaModal>
    <!-- 导入弹框 -->
    <MegaDrawer
      width="520"
      :title="$t('IMPORT')"
      :visible.sync="megaDrawerVisible"
      @close="megaDrawerVisible = false"
      @ok="handleImportSave"
      @cancel="handleImportCancel"
    >
      <a-form-model
        slot="main"
        ref="importDrawerForm"
        :model="form"
        :label-col="{ span: 5 }"
        :wrapper-col="{ span: 19 }"
      >
        <a-form-model-item :label="$t('TYPE')" prop="objectName">
          <a-select
            v-model="formImport.objectName"
            filterable
            allow-clear
            disabled
            :placeholder="$t('PLACESELECT')"
          >
            <a-select-option
              v-for="item in typeOptions"
              :key="item.value"
              :value="item.value"
            >
              {{ item.label }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item :label="$t('DATA_FILE')" prop="fileName">
          <a-input
            v-model="formImport.fileName"
            style="display: none"
          ></a-input>
          <MegaUploader
            ref="upload"
            :options="options"
            @fileSuccess="uploadChange"
          >
            <a-button size="small" type="primary">
              {{ $t("UPLOAD") }}
            </a-button>
            <span style="color: #666; font-size: 12px"
              >{{ $t("UPLOAD_ONLY") }}500kb</span
            >
          </MegaUploader>
        </a-form-model-item>
      </a-form-model>
    </MegaDrawer>
  </div>
</template>

<script>
import { uniqBy } from "lodash";
import {
  Modal as MegaModal,
  Drawer as MegaDrawer,
  Uploader as MegaUploader,
  Button as MegaButton,
  Icon,
} from "@mega-design/ui-vue";
import Vue from "vue";
import VueClipBoard from "vue-clipboard2";
import ApiConstant from "@/api/ApiConstant";
import { exportExcel } from "@/utils";
import MomImportButton from "@/components/MomImportButton";

Vue.use(VueClipBoard);
export default {
  components: {
    MegaModal,
    MegaButton,
    MegaDrawer,
    MegaUploader,
    MomImportButton,
    Icon,
  },
  data() {
    return {
      tableData: [],
      page: 1, // 页码
      total: 0, // 每页个数
      title: "", // 弹框的标题
      drawerVisible: false, // 弹框的显示 隐藏
      modalVisible: false, // 审核意见弹框的显示 隐藏
      megaDrawerVisible: false,
      // 新增或修改的表单配置项
      form: {
        id: "",
        i18nCode: "",
        actionI18nCode: "",
        i18n: "",
        objectName: "",
        clientType: "",
        clientTypeName: "",
      },
      formImport: {
        objectName: "",
        fileName: "",
      },
      // 审核表单
      auditForm: {
        idList: [],
        status: "",
        checkOpinion: "",
      },
      rulesAudit: {
        status: [
          {
            required: true,
            message: this.$t("PLACESELECT"),
            trigger: "change",
          },
        ],
        checkOpinion: [
          {
            required: false,
            message: this.$t("PLACESELECT"),
            trigger: "change",
          },
        ],
      },

      itemList: [],
      statusList: [],
      typeList: [],
      actionI18nCodeList: [],
      isEdit: false,
      queryForm: {
        // 查询的表单的配置项
        clientType: "",
        type: "",
        keyword: "",
        status: "",
      },
      actionButtons: [
        (h, { record }) => (
          <span
            class="text-primary cursor-pointer"
            title={this.$t("COPY_JSON")}
            onClick={() => this.handleCopyJson(record)}>
            <Icon type="icon-cur-t-copyjson" size={14} />
          </span>
        ),
        (h, { record }) =>
          this.hasAuth("INTERNATIONAL_MANAGEMENT:AUDIT") && (
            <span
              class="text-primary cursor-pointer"
              title={this.$t("AUDIT")}
              onClick={() => this.handleAudit(record)}>
              <Icon type="icon-cur-t-piliangshenhe" size={14} />
            </span>
          ),
        this.hasAuth("INTERNATIONAL_MANAGEMENT:EDIT") && "edit",
        this.hasAuth("INTERNATIONAL_MANAGEMENT:DELETE") && "delete",
      ],
      // 表格的配置项
      tableColumns: [
        {
          dataIndex: "type",
          align: "left",
          sorter: false,
          width: 65,
          title: () => this.$t("TYPE"), // 类型
          scopedSlots: { customRender: "type" },
        },
        {
          dataIndex: "i18nCode",
          align: "left",
          width: 220,
          sorter: false,
          ellipsis: true,
          title: () => this.$t("CODE"), // 编码
        },
        {
          dataIndex: "itemValue",
          align: "left",
          title: () => this.$t("I18N"), // 国际化
          ellipsis: true,
          sorter: false,
        },
        {
          dataIndex: "status",
          align: "left",
          sorter: false,
          width: 150,
          title: () => this.$t("STATUS"), // 类型
          scopedSlots: { customRender: "status" },
        },
        {
          dataIndex: "updateBy", // 更新人员
          title: () => this.$t("UPDATE_BY"),
          ellipsis: true,
          sorter: false,
          width: 150,
        },
        {
          dataIndex: "updateTime", // 更新时间
          title: () => this.$t("UPDATE_TIME"),
          width: 180,
          sorter: false,
        },
      ],
      selectedRowKeys: [], // 选中行 key 数据
      selectedRows: [], // 选中行 数据
      isBatchAdd: false, // 是否为批量新增
      typeOptions: [],
      options: {
        target: `${ApiConstant.PREFIX_CORE}/api/sys/file/upload/chunk`,
        headers: {
          Authorization: this.$auth.getToken("local"),
          tenantId:
            this.$store.state.app.systemConfig.TENANT_OPEN === "true"
              ? this.$store.state.account.tenantId
              : "",
        },
        testChunks: true,
        chunkSize: 10 * 1024 * 1024,
        singleFile: true,
        showUploadList: true,
      },
      fileFormData: null,
      fileList: [],
    };
  },
  computed: {
    languages() {
      return this.$store.state.app.languages || [];
    },
    rowSelection() {
      return {
        selectedRowKeys: this.selectedRowKeys,
        onChange: (selectedRowKeys, selectedRows) => {
          this.selectedRowKeys = selectedRowKeys;
          if (this.selectedRowKeys.length) {
            this.selectedRows = uniqBy(this.selectedRows.concat(selectedRows));
          } else {
            this.selectedRows = selectedRows;
          }
        },
      };
    },
    locale() {
      return this.$store.state.app.locale;
    },
    // 表格搜索配置项
    queryFormItem() {
      return {
        clientType: {
          itemType: "select",
          label: () => this.$t("MOM_VERSION"),
          labelWidth: 60,
          allowClear: false,
          options: [],
          optionsProps: {
            label: "label",
            value: "value",
          },
          on: {
            change: () => {
              this.form.clientType = this.queryForm.clientType;
              this.$refs.MomTable?.search();
            },
          },
        },
        type: {
          itemType: "select",
          label: () => this.$t("TYPE"),
          labelWidth: 60,
          options: [],
          optionsProps: {
            label: "label",
            value: "value",
          },
        },
        keyword: {
          label: () => this.$t("KEYWORD"), // 编码
          itemType: "input",
        },
        status: {
          itemType: "select",
          label: () => this.$t("STATUS"),
          labelWidth: 60,
          options: [],
          optionsProps: {
            label: "label",
            value: "value",
          },
        },
      };
    },
    rules() {
      return {
        i18nCode: [
          {
            max: 128,
            required: true,
            message: this.$t("PLACEENTER"),
            trigger: "blur",
          },
        ],
        type: [
          {
            required: true,
            message: this.$t("PLACESELECT"),
            trigger: "change",
          },
        ],
        ...this.languages.reduce((result, item) => {
          // eslint-disable-next-line no-param-reassign
          result[item.value] = [
            {
              required: true,
              message: this.$t("PLACEENTER"),
              trigger: "blur",
            },
          ];
          return result;
        }, {}),
      };
    },
  },
  created() {
    this.getDictByCode("DIC:CORE:I18N_LANGUAGE").then((res) => {
      this.$store.commit(
        "app/SET_LANGUAGES",
        (res.data.data || []).map((item) => ({
          label: item.label,
          value: item.value,
        }))
      );
    });
  },
  methods: {
    // 查询数据字典
    beforeSearch() {
      return Promise.all([
        this.getDictByCode("DIC:CORE:MOM_VERSION"),
        this.getDictByCode("DIC:CORE:I18N_STATUS"),
        this.getDictByCode("DIC:CORE:I18N_TYPE"),
        this.getDictByCode("DIC:CORE:DATA_IMPORT_TYPE"),
      ]).then(([momVersionRes, statusRes, typeRes, importRes, actionRes]) => {
        this.queryFormItem.clientType.options = momVersionRes.data.data;
        if (momVersionRes.data.data && momVersionRes.data.data.length > 0) {
          this.queryForm.clientType = momVersionRes.data.data[0].value;
          this.form.clientType = momVersionRes.data.data[0].value;
          this.form.clientTypeName = momVersionRes.data.data[0].label;
        }
        this.statusList = statusRes.data.data;
        this.queryFormItem.status.options = statusRes.data.data;
        this.typeList = typeRes.data.data;
        this.queryFormItem.type.options = typeRes.data.data;
        this.typeOptions = importRes.data.data;
      });
    },
    // 重置
    handleReset() {
      if (
        this.queryFormItem.clientType.options &&
        this.queryFormItem.clientType.options.length > 0
      ) {
        this.queryForm.clientType =
          this.queryFormItem.clientType.options[0].value;
        this.form.clientType = this.queryFormItem.clientType.options[0].value;
        this.form.clientTypeName =
          this.queryFormItem.clientType.options[0].label;
      }
      this.$refs.MomTable?.search();
    },
    getActionList() {
      this.$axios
        .get(
          `${ApiConstant.PREFIX_CORE}/api/sys/i18n/list-action/${this.queryForm.clientType}`
        )
        .then((res) => {
          this.actionI18nCodeList = res.data?.data;
        });
    },
    // 下载模板
    handleDownload() {
      const a = document.createElement("a");
      a.href = "/template/I18N_DATA.xlsx";
      a.click();
    },
    // 批量导入
    handleBatchImport() {
      this.formImport.objectName = "CORE_SYSTEM_I18N";
      this.megaDrawerVisible = true;
    },
    uploadChange(file) {
      this.formImport.fileName = file.name;
      this.fileFormData = file;
    },
    handleImportSave() {
      this.$refs.importDrawerForm.validate((valid) => {
        if (valid) {
          this.$axios
            .put(
              `${ApiConstant.PREFIX_CORE}/api/sys/file/merge-chunks/${this.fileFormData?.name}/${this.fileFormData?.size}`
            )
            .then((res) => {
              this.$axios
                .post(`${ApiConstant.PREFIX_CORE}/api/data-import`, {
                  objectName: this.formImport.objectName,
                  fileCode: res.data.data.fileCode,
                  fileUrl: res.data.data.fileUrl,
                  language:
                    (this.currentLang && this.currentLang.lang) || "zh_CN",
                })
                .then(() => {
                  this.$message.success(this.$t("ADD_SUCCESS"));
                  this.$refs.MomTable?.query();
                  this.handleImportCancel();
                });
            });
        }
      });
    },
    // 导入弹框取消
    handleImportCancel() {
      this.$refs.upload?.sFileList.forEach((file) => {
        this.$refs.upload.handleRemove(file);
      });
      this.$refs.upload?.uploader.fileList.forEach((file) => {
        file.cancel();
      });
      this.megaDrawerVisible = false;
      this.fileList = [];
    },
    // 同步
    handleSynchronization() {},
    // 导出
    handleExportExcel() {
      const params = {
        page: this.page,
        size: this.$store.state.pagination.pageSize,
        ...this.queryForm,
      };
      this.$axios({
        url: `${ApiConstant.PREFIX_CORE}/api/sys/i18n/export`,
        method: "get",
        params,
        responseType: "blob",
      }).then((res) => {
        exportExcel(res.data, `${this.$t("INTERNATIONAL_MANAGEMENT")}.xls`);
      });
    },
    formatData(data, curItem) {
      const result = data.find((item) => item.value === curItem.toString());
      return result ? result.label : "";
    },
    // 后台分页查询
    searchPageData(params) {
      this.$axios
        .get(`${ApiConstant.PREFIX_CORE}/api/sys/i18n/search`, { params })
        .then((res) => {
          this.tableData = res.data.data.records;
          this.total = parseFloat(res.data.data.total);
          this.loading = false;
        });
    },
    // 点击新增
    handleAdd() {
      this.getActionList();
      this.clearData();
      this.languages.forEach((lang) => {
        this.$set(this.form, lang.value, undefined);
      });
      this.$set(this, "form", {
        id: "",
        i18nCode: "",
      });
      this.form.clientType = this.queryForm.clientType;
      const index = this.queryFormItem.clientType.options?.findIndex(
        (item) => item.value === this.queryForm.clientType
      );
      if (index !== -1) {
        this.form.clientTypeName =
          this.queryFormItem.clientType.options[index].label;
      }
      this.drawerVisible = true;
      this.isEdit = false;
      this.isBatchAdd = false;
    },
    // 点击表格行内的编辑
    handleEdit(row) {
      this.$axios
        .get(`${ApiConstant.PREFIX_CORE}/api/sys/i18n/get-by-id/${row.id}`)
        .then(({ data }) => {
          if (data?.data?.items && data?.data?.items.length > 0) {
            data.data.items.forEach((code) => {
              this.$set(this.form, code.languageCode, code.dataValue);
            });
          }
          this.$set(this.form, "id", row.id);
          this.$set(this.form, "clientType", row.clientType);
          this.$set(this.form, "type", row.type);
          this.$set(this.form, "i18nCode", row.i18nCode);
          this.$set(this.form, "actionI18nCode", row.actionI18nCode);
          const index = this.queryFormItem.clientType.options?.findIndex(
            (item) => item.value === row.clientType
          );
          if (index !== -1) {
            this.form.clientTypeName =
              this.queryFormItem.clientType.options[index].label;
          }
          this.drawerVisible = true;
          this.isEdit = true;
          this.isBatchAdd = false;
          this.getActionList();
        });
    },

    // 点击弹框的保存
    handleSave(status) {
      const {
        id,
        i18nCode,
        clientType,
        type,
        actionI18nCode,
        i18n,
        clientTypeName,
      } = this.form;
      this.$refs.addForm.validate((valid) => {
        if (valid) {
          if (this.isBatchAdd === false) {
            const params = {
              i18nCode,
              clientType,
              type,
              actionI18nCode,
              // systemCode: this.queryForm.systemCode,
              items: this.languages.map((item) => {
                const { label, value } = item;
                return {
                  dataValue: this.form[value],
                  i18nCode,
                  languageCode: value,
                  languageName: label,
                };
              }),
            };
            if (id) {
              this.$axios
                .put(`${ApiConstant.PREFIX_CORE}/api/sys/i18n`, {
                  id,
                  ...params,
                })
                .then(() => {
                  this.$refs.addForm.clearValidate();
                  this.$message.success(this.$t("EDIT_SUCCESS"));
                  this.$refs.MomTable?.query();
                  if (status !== "next") {
                    this.drawerVisible = false;
                  } else {
                    this.form = {
                      clientTypeName,
                      clientType: this.queryForm.clientType,
                      id: "",
                      i18nCode: "",
                      actionI18nCode: "",
                      i18n: "",
                      objectName: "",
                      en: "",
                      zh_CN: "",
                      zh_TW: "",
                    };
                  }
                });
            } else {
              this.$axios
                .post(`${ApiConstant.PREFIX_CORE}/api/sys/i18n`, params)
                .then(() => {
                  this.$refs.addForm.clearValidate();
                  this.form = {
                    clientTypeName,
                    clientType: this.queryForm.clientType,
                    id: "",
                    i18nCode: "",
                    actionI18nCode: "",
                    i18n: "",
                    objectName: "",
                    en: "",
                    zh_CN: "",
                    zh_TW: "",
                  };
                  this.$refs.MomTable?.query();
                  if (status !== "next") {
                    this.drawerVisible = false;
                  }
                });
            }
          } else {
            const params = {
              clientType,
              type,
              i18n,
            };
            this.$axios
              .post(
                `${ApiConstant.PREFIX_CORE}/api/sys/i18n/create-batch`,
                params
              )
              .then(() => {
                this.$refs.addForm.clearValidate();
                this.$message.success(this.$t("ADD_SUCCESS"));
                this.selectedRowKeys = [];
                this.selectedRows = [];
                this.$refs.MomTable?.query();
                if (status !== "next") {
                  this.drawerVisible = false;
                }
              });
          }
        }
      });
    },
    handDelete() {
      if (this.selectedRowKeys.length > 0) {
        this.$confirm({
          title: this.$t("DELETE"),
          content: this.$t("DELETE_INFO"),
          okType: "warning",
          okText: this.$t("CONFIRM"),
          cancelText: this.$t("CANCEL"),
          centered: false,
          icon: "close-circle",
          onOk: () => {
            this.$axios
              .delete(`${ApiConstant.PREFIX_CORE}/api/sys/i18n/batch-delete`, {
                params: {
                  ids: this.selectedRowKeys.join(","),
                },
              })
              .then((res) => {
                this.$message.success(this.$t("DELETE_SUCCESS"));
                this.$refs.MomTable?.query();
              });
          },
        });
      } else {
        this.$message.error(this.$t("SELECT_ONE_DATA"));
      }
    },
    // 点击表格行内的删除
    handleDelete({ id }) {
      this.$confirm({
        title: this.$t("DELETE"),
        content: this.$t("DELETE_INFO"),
        okType: "warning",
        okText: this.$t("CONFIRM"),
        cancelText: this.$t("CANCEL"),
        centered: false,
        icon: "close-circle",
        onOk: () => {
          this.$axios
            .delete(`${ApiConstant.PREFIX_CORE}/api/sys/i18n/${id}`)
            .then((res) => {
              this.$message.success(this.$t("DELETE_SUCCESS"));
              this.$refs.MomTable?.query();
            });
        },
      });
    },
    // 批量新增
    handleBatchAddition() {
      this.form.clientType = this.queryForm.clientType;
      const index = this.queryFormItem.clientType.options?.findIndex(
        (item) => item.value === this.queryForm.clientType
      );
      if (index !== -1) {
        this.form.clientTypeName =
          this.queryFormItem.clientType.options[index].label;
      }
      this.drawerVisible = true;
      this.isBatchAdd = true;
      this.form.i18n = "";
    },
    // 批量审核
    handleBatchAudit() {
      if (this.selectedRowKeys.length < 1) {
        this.$message.warning(this.$t("SELECT_ONE_DATA"));
        return;
      }
      this.auditForm.idList = this.selectedRowKeys;
      this.auditForm.status = "PASS";
      this.auditForm.checkOpinion = "";
      this.modalVisible = true;
    },
    // 审核
    handleAudit(record) {
      const { id } = record;
      this.auditForm.idList = [id];
      this.auditForm.status = "PASS";
      this.auditForm.checkOpinion = "";
      this.modalVisible = true;
    },
    // 改变审核状态
    changeStatus() {
      this.rulesAudit.checkOpinion[0].required =
        this.auditForm.status === "WAIT_CHECK";
    },
    // 批量复制JSON
    handleBatchCopyJson() {
      if (this.selectedRowKeys.length < 1) {
        this.$message.warning(this.$t("SELECT_ONE_DATA"));
        return;
      }
      const idList = this.selectedRowKeys.join(",");
      const params = {
        idList,
      };
      this.$axios
        .get(`${ApiConstant.PREFIX_CORE}/api/sys/i18n/copy-json-batch`, {
          params,
        })
        .then((res) => {
          const tempStr = res.data?.data;
          tempStr.replace(/[\\]/g, "");
          this.$copyText(tempStr).then(() => {
            this.$message.success(this.$t("COPY_SUCCESS"));
          });
        });
    },
    // 复制JSON
    handleCopyJson(record) {
      const { id } = record;
      const params = {
        id,
      };
      this.$axios
        .get(`${ApiConstant.PREFIX_CORE}/api/sys/i18n/copy-json`, { params })
        .then((res) => {
          const tempStr = res.data?.data;
          if (tempStr) {
            tempStr.replace(/[\\]/g, "");
            this.$copyText(tempStr).then(() => {
              this.$message.success(this.$t("COPY_SUCCESS"));
            });
          }
        });
    },
    // 确定
    handleSure() {
      const params = { ...this.auditForm };
      this.$refs.auditForm.validate((valid) => {
        if (valid) {
          this.$axios
            .post(`${ApiConstant.PREFIX_CORE}/api/sys/i18n/check`, params)
            .then((res) => {
              this.$message.success(this.$t("OPERATION_SUCCESS"));
              this.$refs.MomTable?.query();
            });
          this.selectedRowKeys = [];
          this.selectedRows = [];
          this.modalVisible = false;
        }
      });
    },
    // 关闭弹框
    handleCloseDrawer() {
      this.$refs.addForm.clearValidate();
      this.drawerVisible = false;
    },
    // 关闭弹框
    handleCloseConfigDrawer() {
      this.$refs.auditForm.clearValidate();
      this.modalVisible = false;
    },
    // 清除数据
    clearData() {
      this.form.id = "";
      this.form.i18nCode = "";
      this.form.actionI18nCode = "";
      this.i18n = "";
    },
  },
};
</script>
<style lang="less" scoped>
/deep/ .cursor-pointer {
  cursor: pointer;
}
</style>
