<route lang="yaml">
    name: contractTemplateManagement
    </route>

<script lang="ts" setup name="contractTemplateManagement">
import { ref } from 'vue';
import TableTools from "@/components/Tools/table_tools.vue";
import {
  getContractTemplatePageList,
  copyContractTemplate,
  deleteContractTemplate,
  updateContractTemplateState
} from "@/api/modules/dataSmartContract"
import useDataSmartContract from "@/store/modules/dataSmartContract";
import { commonPageConfig } from '@/utils/enum';
import { useValidator } from "@/hooks/useValidator";

const router = useRouter();
const route = useRoute();
const { proxy } = getCurrentInstance() as any;
const dataSmartContractStore = useDataSmartContract();
const { required } = useValidator();

const searchItemList = ref([
  {
    type: "input",
    label: "",
    field: "templateName",
    default: "",
    placeholder: "合约模板名称",
    maxlength: 50,
    clearable: true,
  },
  {
    type: 'select',
    label: '',
    field: 'bizStatus',
    default: '',
    placeholder: '启用状态',
    options: [
      { label: '启用', value: 'Y' },
      { label: '停用', value: 'N' },
    ],
    filterable: true,
    clearable: true
  }
]);

const tableFields = ref([
  { label: "序号", type: "index", width: 56, align: "center" },
  { label: "合约模板名称", field: "templateName", width: 220, },
  { label: "版本号", field: "version", width: 100 },
  { label: '启用状态', width: 96, field: 'bizStatus', type: 'switch', activeText: '启用', inactiveText: '停用', activeValue: 'Y', inactiveValue: 'N', align: 'center' },
  { label: "合约模板编号", field: "templateId", width: 190 },
  { label: "修改人", field: "updateUserName", width: 130 },
  { label: "修改时间", field: "updateTime", width: 170 },
]);

const page = ref({
  ...commonPageConfig,
  templateName: '',
  bizStatus: ''
});
const currTableData: any = ref({});
const tableInfo = ref({
  id: 'contract-template-table',
  rowKey: 'guid',
  loading: false,
  fields: tableFields.value,
  data: [],
  page: {
    type: "normal",
    rows: 0,
    ...page.value,
  },
  actionInfo: {
    label: "操作",
    type: "btn",
    width: 140,
    btns: (scope) => {
      let row = scope.row;
      return [{
        value: 'edit', label: '编辑', click: (scope) => {
          router.push({
            name: 'contractTemplateCreate',
            query: {
              guid: scope.row.guid,
              name: scope.row.templateName
            }
          });
        }
      }, {
        value: 'copy', label: '复制', click: copyTemplate
      }, {
        value: 'delete', label: '删除', click: (scope) => {
          proxy.$openMessageBox("此操作将永久删除, 是否继续?", () => {
            deleteContractTemplate([scope.row.guid]).then((res: any) => {
              if (res?.code == proxy.$passCode) {
                page.value.curr = 1;
                getTableData();
                proxy.$ElMessage.success('删除成功');
              } else {
                res?.msg && proxy.$ElMessage.error(res?.msg);
              }
            });
          }, () => {
            proxy.$ElMessage.info("已取消");
          })
        }
      }]
    }
  }
});

const tableSwitchBeforeChange = (scope, field, callback) => {
  const msg = `确定${scope.row[field] == 'Y' ? '停用' : '启用'}【${scope.row.templateName}】?`
  proxy.$openMessageBox(msg, () => {
    const state = scope.row[field] == 'Y' ? 'N' : 'Y'
    const result = tableSwitchChange(state, scope, field)
    callback(result)
  }, () => {
    callback(false)
  });
}

const tableSwitchChange = (val, scope, field) => {
  return new Promise((resolve, reject) => {
    let params = {
      guid: scope.row.guid,
      bizStatus: val
    }
    updateContractTemplateState(params).then((res: any) => {
      if (res?.code == proxy.$passCode && res.data) {
        getTableData();
        proxy.$ElMessage({
          type: "success",
          message: `【${scope.row.templateName}】${val == 'Y' ? '启用' : '停用'}成功`,
        });
        resolve(true)
      } else {
        res?.msg && proxy.$ElMessage.error(res?.msg)
        reject(false)
      }
    }).catch(() => {
      reject(false)
    })
  })
}


const copyTemplate = (scope) => {
  currTableData.value = scope.row;
  copyFormItems.value[0].default = scope.row.templateName + '_copy';
  copyDialogInfo.value.formInfo.items = copyFormItems.value;
  copyDialogInfo.value.visible = true;
}

const toSearch = (val: any, clear: boolean = false) => {
  if (clear) {
    searchItemList.value.map((item) => (item.default = ""));
    page.value.templateName = '';
    page.value.bizStatus = "";
  } else {
    page.value.templateName = val.templateName;
    page.value.bizStatus = val.bizStatus;
  }
  getTableData();
};

const getTableData = () => {
  tableInfo.value.loading = true
  getContractTemplatePageList({
    pageIndex: page.value.curr,
    pageSize: page.value.limit,
    templateName: page.value.templateName,
    bizStatus: page.value.bizStatus
  }).then((res: any) => {
    tableInfo.value.loading = false
    if (res?.code == proxy.$passCode) {
      const data = res.data || {}
      tableInfo.value.data = data.records || []
      tableInfo.value.page.limit = data.pageSize
      tableInfo.value.page.curr = data.pageIndex
      tableInfo.value.page.rows = data.totalRows
    } else {
      res?.msg && proxy.$ElMessage.error(res?.msg)
    }
  }).catch(() => {
    tableInfo.value.loading = false
  })
};

const tablePageChange = (info) => {
  page.value.curr = Number(info.curr);
  page.value.limit = Number(info.limit);
  tableInfo.value.page.curr = page.value.curr;
  tableInfo.value.page.limit = page.value.limit;
  getTableData();
};

const newCreate = () => {
  router.push({
    name: 'contractTemplateCreate'
  });
}

onActivated(() => {
  if (dataSmartContractStore.isRefresh) {//如果是首次加载，则不需要调用
    page.value.curr = 1;
    getTableData();
    dataSmartContractStore.set(false);
  }
})

onBeforeMount(() => {
  !dataSmartContractStore.isRefresh && toSearch({})
})

/** -------------- 复制功能 -------------------  */
const copyFormItems = ref([{
  type: 'input',
  label: '合约模板名称',
  field: 'templateName',
  default: '',
  block: true,
  placeholder: '请输入',
  maxlength: 50,
  clearable: true,
  required: true
}]);

const copyFormRules = ref({
  templateName: [required("请填写合约模板名称")],
});

const copyDialogInfo = ref({
  visible: false,
  size: 480,
  title: "复制合约模板",
  type: 'add',
  formInfo: {
    id: 'copy-form',
    items: copyFormItems.value,
    rules: copyFormRules.value
  },
  btns: {
    submit: (btn, info) => {
      info.guid = currTableData.value.guid;
      copyDialogInfo.value.submitBtnLoading = true;
      copyContractTemplate(info).then((res: any) => {
        copyDialogInfo.value.submitBtnLoading = false;
        if (res.code == proxy.$passCode) {
          page.value.curr = 1;
          getTableData();
          proxy.$ElMessage({
            type: 'success',
            message: `【${info.templateName}】复制成功`
          })
          copyDialogInfo.value.visible = false;
        } else {
          proxy.$ElMessage.error(res.msg);
        }
      })
    },
    cancel: () => {
      copyDialogInfo.value.visible = false;
    }
  },
  submitBtnLoading: false
});


</script>

<template>
  <div class="container_wrap">
    <div class="table_tool_wrap">
      <TableTools :searchItems="searchItemList" :searchId="'settle-asset-search'" @search="toSearch" :init="false" />
      <div class="tools_btns">
        <el-button type="primary" @click="newCreate">新增</el-button>
      </div>
    </div>
    <div class="table_panel_wrap">
      <Table :tableInfo="tableInfo" @tablePageChange="tablePageChange"
        @tableSwitchBeforeChange="tableSwitchBeforeChange" />
    </div>
    <!-- 复制对话框 -->
    <Dialog_form :dialogConfigInfo="copyDialogInfo" />
  </div>
</template>

<style lang="scss" scoped>
.container_wrap {
  padding: 0px 16px;
}
</style>