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

2025-08-26 23:13:34 +08:00
parent ddb35b10f1
commit fc07ed06d5
16 changed files with 1348 additions and 95 deletions
@@ -0,0 +1,112 @@
+<template>
+  <a-modal
+    :visible="visible"
+    :title="isEdit ? '编辑创建合同模板' : '新增创建合同模板'"
+    unmount-on-close
+    @ok="handleSubmit"
+    @cancel="handleCancel"
+  >
+    <a-form
+      ref="formRef"
+      :model="form"
+      :rules="rules"
+      auto-label-width
+      layout="vertical"
+    >
+      <!-- 模版名称 -->
+      <a-form-item label="模版名称" field="name" required>
+        <a-input v-model="form.name" placeholder="请输入模板名称" />
+      </a-form-item>
+      <!-- 适用范围（部门） -->
+      <a-form-item label="适用范围" field="user_id">
+        <a-tree-select
+          v-model="form.departmentId"
+          :data="props.departmentListData"
+          :field-names="{ key: 'id', title: 'name', children: 'children' }"
+          placeholder="请选择适用范围"
+          allow-clear
+        />
+      </a-form-item>
+    </a-form>
+  </a-modal>
+</template>
+
+<script setup lang="ts">
+  import { ref, reactive, watch } from 'vue';
+  import type { FormInstance } from '@arco-design/web-vue';
+  import { createTemplateSetting, updateTemplateSetting } from '@/api/setting';
+  import { DepartmentItem, CreateTemplateSettingParam } from '@/types/setting';
+  import { Message } from '@arco-design/web-vue';
+
+  interface TreeNode {
+    id: string | number;
+    name: string;
+    children?: TreeNode[];
+  }
+  const props = defineProps<{
+    visible: boolean;
+    isEdit: boolean;
+    record?: DepartmentItem | null;
+    departmentListData: TreeNode[]; // 修复类型
+  }>();
+
+  const emit = defineEmits<{
+    (e: 'update:visible', val: boolean): void;
+    (e: 'submitted'): void;
+  }>();
+
+  //  表单数据
+  const formRef = ref<FormInstance>();
+  const form = reactive<CreateTemplateSettingParam>({
+    name: '',
+    departmentId: null,
+    // id: undefined,
+  });
+
+  //  校验规则
+  const rules = {
+    name: [{ required: true, message: '请输入模板名称' }],
+    departmentId: [{ required: true, message: '请选择适用范围' }],
+  };
+
+  //  Watch 弹窗控制 & 初始化
+  watch(
+    () => props.visible,
+    (val) => {
+      if (val) {
+        if (props.record) {
+          // form.id = props.record?.id;
+          // form.name = props.record?.name;
+          // form.parent_id = props.record?.parentId ?? '';
+          // form.user_id = props.record?.UserId ?? '';
+          // form.remark = props.record?.remark ?? '';
+          // Object.assign(form, props.record);
+        } else {
+          Object.assign(form, {
+            id: undefined,
+            name: '',
+            departmentId: null,
+          });
+        }
+      }
+    },
+    { immediate: true }
+  );
+
+  //  表单事件
+  const handleCancel = () => {
+    emit('update:visible', false);
+  };
+  const handleSubmit = async () => {
+    await formRef.value?.validate();
+    const { code, message } = props.isEdit
+      ? await updateTemplateSetting(form)
+      : await createTemplateSetting(form);
+    if (code === 200) {
+      Message.success(message);
+      handleCancel();
+      // 通知父组件更新部门列表数据
+      emit('submitted');
+    }
+  };
+</script>