feat: 设置-合同设置-合同条款设置

src/views/setting/system/contract-settings/drawer/contract-terms-form-drawer.vue

@@ -25,38 +25,100 @@
       </a-form-item>
       <!-- 条款类别 -->
       <a-form-item label="条款类别" field="type" required>
-        <a-select v-model="form.type">
+        <a-select v-model="form.type" @change="onChangeFeeType">
           <a-option
-            v-for="item in termsType"
-            :key="item.type"
-            :value="item.type"
-            >{{ item.text }}</a-option
+            v-for="item in feeTypeList"
+            :key="item.value"
+            :value="item.value"
+            >{{ item.label }}</a-option
           >
         </a-select>
       </a-form-item>
       <!-- 条款项配置 -->
-      <a-form-item label="条款项配置" required> </a-form-item>
+      <a-form-item label="条款项配置" required>
+        <a-space direction="vertical">
+          <a-checkbox
+            :model-value="form.is_fee === 1"
+            @change="(val) => onCheckChange('is_fee', val)"
+            >条款费项</a-checkbox
+          >
+          <a-space>
+            <a-select
+              v-model="form.finance_fee_id"
+              :style="{ width: '200px' }"
+              placeholder="请选择..."
+            >
+              <a-option
+                v-for="item in financeFeeList"
+                :key="item.id"
+                :value="item.id"
+                >{{ item.name }}</a-option
+              >
+            </a-select>
+            <a-select
+              v-model="form.finance_fee_periodicity"
+              :style="{ width: '200px' }"
+              :options="financeFeeFeriodicityList"
+              placeholder="请选择..."
+            />
+          </a-space>
+          <a-checkbox
+            style="margin-top: 10px"
+            :model-value="form.is_bond === 1"
+            @change="(val) => onCheckChange('is_bond', val)"
+            >保证金项</a-checkbox
+          >
+          <a-select v-model="form.finance_bond_fee_id" placeholder="请选择...">
+            <a-option
+              v-for="item in financeBondFeeList"
+              :key="item.id"
+              :value="item.id"
+              >{{ item.name }}</a-option
+            >
+          </a-select>
+          <a-checkbox
+            style="margin-top: 10px"
+            :model-value="form.is_incremental === 1"
+            @change="(val) => onCheckChange('is_incremental', val)"
+            >递增项</a-checkbox
+          >
+          <a-checkbox
+            :model-value="form.is_discount === 1"
+            @change="(val) => onCheckChange('is_discount', val)"
+            >优惠项</a-checkbox
+          >
+          <a-checkbox
+            :model-value="form.is_late_fee === 1"
+            @change="(val) => onCheckChange('is_late_fee', val)"
+            >滞纳金</a-checkbox
+          >
+        </a-space>
+      </a-form-item>
     </a-form>
   </a-drawer>
 </template>
 
 <script lang="ts" setup>
-  import { ref, watch, reactive } from 'vue';
+  import { ref, watch, reactive, onMounted } from 'vue';
   import type { FormInstance } from '@arco-design/web-vue';
   import { Message } from '@arco-design/web-vue';
-  import { createCodeSetting, updateCodeSetting } from '@/api/setting';
+  import {
+    createTermsSetting,
+    updateTermsSetting,
+    getUseFeeList,
+  } from '@/api/setting';
+  import { feeTypeList, financeFeeFeriodicityList } from '@/utils/constant';
+  import {
+    FeeManagementType,
+    CreateTermSettingParam,
+    FeeManagement,
+  } from '@/types/setting';
 
   const props = defineProps<{
     visible: boolean;
     isEdit: boolean;
     record?: any | null;
   }>();
-  const termsType = [
-    { text: '租赁类', type: 1 },
-    { text: '物业类', type: 2 },
-    { text: '特殊类', type: 3 },
-    { text: '其他类', type: 4 },
-  ];
   const emit = defineEmits<{
     (e: 'update:visible', val: boolean): void;
     (e: 'submitted'): void;
@@ -64,15 +126,25 @@
 
   //  表单数据
   const formRef = ref<FormInstance>();
-  const defaultForm: any = {
-    name: '',
-    type: 1,
+  const defaultForm: CreateTermSettingParam = {
+    name: '', // 名称
+    type: 1, // 条款类型：1租赁类，2物业类，3特殊类，4其他类
+    is_fee: 1, // 是否勾选费项：1是，2否
+    finance_fee_id: null, // 财务费项id（除保证金外
+    finance_fee_periodicity: 1, // 周期性：1周期性付款，2一次性付款
+    is_bond: 2, // 是否勾选保证金：1是，2否
+    finance_bond_fee_id: null, // 财务保证金费项id
+    is_incremental: 2, // 是否勾选递增项：1是，2否
+    is_discount: 2, // 是否勾选优惠项：1是，2否
+    is_late_fee: 2, // 是否勾选滞纳金：1是，2否
   };
+  const financeFeeList = ref<FeeManagement[]>([]);
+  const financeBondFeeList = ref<FeeManagement[]>([]);
   const form = reactive<any>({ ...defaultForm });
   //  校验规则
   const rules = reactive({
-    name: [{ required: true, message: '请输入合同编号' }],
-    type: [{ required: true, message: '请选择编号回收规则' }],
+    name: [{ required: true, message: '请输入条款名称' }],
+    type: [{ required: true, message: '请选择条款类别' }],
   });
 
   watch(
@@ -80,9 +152,7 @@
     (val) => {
       if (val) {
         if (props.isEdit && props.record) {
-          Object.assign(form, { ...props.record, ecycling: [] });
-          if (props.record.cancelCodeRecycling === 1) form.ecycling.push(1);
-          if (props.record.delCodeRecycling === 1) form.ecycling.push(2);
+          Object.assign(form, props.record);
         } else {
           Object.assign(form, defaultForm);
         }
@@ -90,22 +160,50 @@
     },
     { immediate: true }
   );
+  const onCheckChange = (field: string, value: boolean) => {
+    form[field] = value ? 1 : 2;
+  };
+  const getUseFeeListData = async () => {
+    const param = {
+      fee_attribute: 1 as FeeManagementType,
+      fee_type: form.type,
+    };
+    const { code, data } = await getUseFeeList(param);
+    if (code === 200 && data) {
+      const { list } = data;
+      financeFeeList.value = list.filter((i) => i.isBond === 2);
+      financeBondFeeList.value = list.filter((i) => i.isBond === 1);
+      if (financeFeeList.value.length) {
+        form.finance_fee_id = financeFeeList.value[0]?.id;
+      } else {
+        form.finance_fee_id = null;
+      }
+    }
+  };
+  const onChangeFeeType = () => {
+    getUseFeeListData();
+  };
+
   const handleOk = async () => {
     try {
       const valid = await formRef.value.validate();
       if (valid) return;
-      // 同步编号排序
-
-      const params = {
-        ...form,
-        cancel_code_recycling: form.ecycling.includes(1) ? 1 : 0,
-        del_code_recycling: form.ecycling.includes(2) ? 1 : 0,
-      };
-      delete params.ecycling;
-      console.log('提交参数：', params);
+      const { is_bond, is_fee, finance_bond_fee_id, finance_fee_id } = form;
+      if (is_bond === 2 && is_fee === 2) {
+        Message.info('请先选择条款类型（条款费项或者保证金项）');
+        return;
+      }
+      if (is_fee === 1 && finance_fee_id === null) {
+        Message.info('请先选择条款费项');
+        return;
+      }
+      if (is_bond === 1 && finance_bond_fee_id === null) {
+        Message.info('请先选择保证金项');
+        return;
+      }
       const res = props?.isEdit
-        ? await updateCodeSetting(params)
-        : await createCodeSetting(params);
+        ? await updateTermsSetting(form)
+        : await createTermsSetting(form);
       if (res?.code === 200) {
         Message.success(res?.message);
         emit('submitted');
@@ -119,6 +217,9 @@
   const handleCancel = () => {
     emit('update:visible', false);
   };
+  onMounted(() => {
+    getUseFeeListData();
+  });
 </script>
 
 <style lang="less" scoped>