feat: 设置->合同设置->合同文档模板设置

src/views/setting/system/contract-settings/contract-file.vue

@@ -0,0 +1,230 @@
+<template>
+  <a-card title="合同文档模板设置">
+    <template #extra>
+      <a-button type="primary" @click="handleAddContractNumber"
+        ><icon-plus />新增</a-button
+      >
+    </template>
+    <DataTable
+      :data="renderData"
+      :columns="projectColumn"
+      :loading="loading"
+      :total="total"
+      :current="current"
+      :page-size="pageSize"
+      pagination
+      @page-change="onPageChange"
+      @page-size-change="onPageSizeChange"
+    >
+      <template #realname="{ record }">
+        <span>{{ record.realname }}</span>
+        <icon-idcard v-if="record.isManager === 1" />
+      </template>
+      <template #status="{ record }">
+        <a-tag :color="record.status == 1 ? 'green' : 'red'">
+          {{ record.status == 1 ? $t('enable') : $t('disable') }}</a-tag
+        >
+      </template>
+      <template #operate="{ record }">
+        <a-space>
+          <a-button type="primary" @click="handleEditContractNumber(record.id)">
+            {{ $t('edit') }}</a-button
+          >
+          <a-popover trigger="click" position="bottom">
+            <a-button>{{ $t('more') }}</a-button>
+            <template #content>
+              <a-space direction="vertical">
+                <a-button @click="handleToggleStatus(record.id, record.status)">
+                  {{ record.status == 1 ? $t('disable') : $t('enable') }}
+                </a-button>
+                <a-button status="danger" @click="handleDel(record.id)">
+                  {{ $t('delete') }}
+                </a-button>
+              </a-space>
+            </template>
+          </a-popover>
+        </a-space>
+      </template>
+    </DataTable>
+    <contractFileForm
+      v-model:visible="showModal"
+      :department-list-data="departmentListData"
+      :is-edit="isEdit"
+      @submitted="getWordSettingListData"
+    />
+  </a-card>
+</template>
+
+<script lang="ts" setup>
+  import { ref, onMounted } from 'vue';
+  import type { TableColumnData } from '@arco-design/web-vue';
+  import { Message } from '@arco-design/web-vue';
+  import useDataTable from '@/composables/useDataTable';
+  import {
+    getWordSettingFromId,
+    delWordSetting,
+    getWordSettingList,
+    disableWordSetting,
+    getDepartmentList,
+  } from '@/api/setting';
+  import { ContractWordItem, DepartmentItem } from '@/types/setting';
+  import { UserStatus } from '@/types/comm';
+  import { camelToSnake } from '@/utils/caseConvert';
+  // import contractNumberFormDrawer from './drawer/contract-number-form-drawer.vue';
+  import contractFileForm from './modal/contract-file-form.vue';
+
+  const {
+    data: renderData,
+    columns: projectColumn,
+    loading,
+    total,
+    current,
+    pageSize,
+    setData,
+    setColumns,
+    setLoading,
+    setTotal,
+    setCurrent,
+    setPageSize,
+  } = useDataTable({
+    initialPage: 1,
+    initialPageSize: 10,
+    pageSizeOptions: [10, 20, 50, 100],
+  });
+
+  const contractWordList = ref<ContractWordItem[]>([]);
+  const departmentListData = ref<DepartmentItem[]>([]);
+  const showModal = ref<boolean>(false);
+  const isEdit = ref<boolean>(false);
+  const currentNumberInfo = ref<any>(null);
+  // 列配置
+  const columns: TableColumnData[] = [
+    {
+      title: '模板名称',
+      dataIndex: 'name',
+      key: 'name',
+      width: 120,
+      ellipsis: true,
+    },
+    {
+      title: '适用范围',
+      dataIndex: 'departmentName',
+      key: 'departmentName',
+      render: ({ record }) => record.departmentName || '-',
+    },
+    {
+      title: '适用项目',
+      dataIndex: 'projectName',
+      key: 'projectName',
+      render: ({ record }) => record.projectName || '-',
+    },
+    {
+      title: '状态',
+      dataIndex: 'status',
+      key: 'status',
+      slotName: 'status',
+    },
+    {
+      title: '操作',
+      key: 'operate',
+      slotName: 'operate',
+      width: 200,
+    },
+  ];
+
+  // 获取列表数据
+  const getWordSettingListData = async () => {
+    const params = {
+      page: current.value,
+      page_size: pageSize.value,
+    };
+    setLoading(true);
+    const { code, data } = await getWordSettingList(params);
+    if (code === 200 && data) {
+      const { contractWordSetting, page } = data;
+      contractWordList.value = Array.isArray(contractWordSetting)
+        ? contractWordSetting
+        : [];
+      setData(contractWordList.value);
+      if (page?.total) setTotal(page?.total);
+    }
+    setLoading(false);
+  };
+  // 部门列表
+  const getDepartmentListData = async () => {
+    try {
+      const { code, data } = await getDepartmentList();
+      if (code === 200) {
+        departmentListData.value = data.departmentList;
+      }
+    } catch (error) {
+      // console.error('获取部门列表失败:', error);
+    }
+  };
+  // 分页事件处理
+  const onPageChange = (page: number) => {
+    setCurrent(page);
+    current.value = page;
+    getWordSettingListData();
+  };
+  const onPageSizeChange = (size: number) => {
+    setPageSize(size);
+    pageSize.value = size;
+    getWordSettingListData();
+  };
+  const handleToggleStatus = async (id: number, currentStatus: UserStatus) => {
+    try {
+      const status: UserStatus = currentStatus === 1 ? 2 : 1;
+      const param = { id, status };
+      const { code, message } = await disableWordSetting(param);
+      if (code === 200) {
+        Message.success(message);
+        getWordSettingListData();
+      } else {
+        Message.error(message);
+      }
+    } catch (error) {
+      // 处理错误
+    }
+  };
+  const handleDel = async (id: number) => {
+    try {
+      const { code, message } = await delWordSetting(id);
+      if (code === 200) {
+        Message.success(message);
+        getWordSettingListData();
+      } else {
+        Message.error(message);
+      }
+    } catch (error) {
+      // 处理错误
+    }
+  };
+  const getWordSettingFromIdData = async (id: number) => {
+    const { code, data } = await getWordSettingFromId(id);
+    if (code === 200 && data) {
+      const { contractCodeSetting } = data;
+      currentNumberInfo.value = contractCodeSetting || null;
+      currentNumberInfo.value.arrange = camelToSnake(
+        currentNumberInfo.value.arrange
+      );
+    }
+  };
+  const handleAddContractNumber = () => {
+    // currentNumberInfo.value = null;
+    isEdit.value = false;
+    showModal.value = true;
+  };
+  const handleEditContractNumber = async (id: number) => {
+    await getWordSettingFromIdData(id);
+    isEdit.value = true;
+    // currentNumberInfo.value = info
+    showModal.value = true;
+  };
+  // 初始化数据
+  onMounted(() => {
+    setColumns(columns);
+    getWordSettingListData();
+    getDepartmentListData();
+  });
+</script>