feat: customer pool config

apps/web-antd/src/views/crm/customer/poolConfig/index.vue

@@ -1,38 +1,147 @@
 <script lang="ts" setup>
+import type { CrmCustomerPoolConfigApi } from '#/api/crm/customer/poolConfig';
+
+import { onMounted, ref } from 'vue';
+
 import { Page } from '@vben/common-ui';
 
-import { Button } from 'ant-design-vue';
+import { Card, message } from 'ant-design-vue';
 
-import { DocAlert } from '#/components/doc-alert';
+import { useVbenForm } from '#/adapter/form';
+import {
+  getCustomerPoolConfig,
+  saveCustomerPoolConfig,
+} from '#/api/crm/customer/poolConfig';
+import { $t } from '#/locales';
+
+const emit = defineEmits(['success']);
+const formData = ref<CrmCustomerPoolConfigApi.CustomerPoolConfig>();
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    // 所有表单项
+    labelClass: 'w-2/6',
+  },
+  layout: 'horizontal',
+  wrapperClass: 'grid-cols-1',
+  actionWrapperClass: 'text-center',
+  schema: [
+    {
+      component: 'RadioGroup',
+      fieldName: 'enabled',
+      label: '客户公海规则设置',
+      componentProps: {
+        options: [
+          { label: '开启', value: true },
+          { label: '关闭', value: false },
+        ],
+      },
+    },
+    {
+      component: 'InputNumber',
+      fieldName: 'contactExpireDays',
+      componentProps: {
+        min: 0,
+        precision: 0,
+      },
+      renderComponentContent: () => ({
+        addonAfter: () => '天不跟进或',
+      }),
+      dependencies: {
+        triggerFields: ['enabled'],
+        show: (value) => value.enabled,
+      },
+    },
+    {
+      component: 'InputNumber',
+      fieldName: 'dealExpireDays',
+      renderComponentContent: () => ({
+        addonBefore: () => '或',
+        addonAfter: () => '天未成交',
+      }),
+      componentProps: {
+        min: 0,
+        precision: 0,
+      },
+      dependencies: {
+        triggerFields: ['enabled'],
+        show: (value) => value.enabled,
+      },
+    },
+    {
+      component: 'RadioGroup',
+      fieldName: 'notifyEnabled',
+      label: '提前提醒设置',
+      componentProps: {
+        options: [
+          { label: '开启', value: true },
+          { label: '关闭', value: false },
+        ],
+      },
+      dependencies: {
+        triggerFields: ['enabled'],
+        show: (value) => value.enabled,
+      },
+      defaultValue: false,
+    },
+    {
+      component: 'InputNumber',
+      fieldName: 'notifyDays',
+      componentProps: {
+        min: 0,
+        precision: 0,
+      },
+      renderComponentContent: () => ({
+        addonBefore: () => '提前',
+        addonAfter: () => '天提醒',
+      }),
+      dependencies: {
+        triggerFields: ['notifyEnabled'],
+        show: (value) => value.enabled && value.notifyEnabled,
+      },
+    },
+  ],
+  // 提交函数
+  handleSubmit: onSubmit,
+});
+
+async function onSubmit() {
+  const { valid } = await formApi.validate();
+  if (!valid) {
+    return;
+  }
+  // 提交表单
+  const data =
+    (await formApi.getValues()) as CrmCustomerPoolConfigApi.CustomerPoolConfig;
+  formApi.setState({ commonConfig: { disabled: true } });
+  try {
+    await saveCustomerPoolConfig(data);
+    // 关闭并提示
+    emit('success');
+    message.success($t('ui.actionMessage.operationSuccess'));
+  } finally {
+    formApi.setState({ commonConfig: { disabled: false } });
+  }
+}
+
+async function getConfigInfo() {
+  try {
+    const res = await getCustomerPoolConfig();
+    formData.value = res;
+  } catch (error) {
+    console.error(error);
+  }
+}
+
+onMounted(() => {
+  getConfigInfo();
+});
 </script>
 
 <template>
-  <Page>
-    <DocAlert
-      title="【客户】客户管理、公海客户"
-      url="https://doc.iocoder.cn/crm/customer/"
-    />
-    <DocAlert
-      title="【通用】数据权限"
-      url="https://doc.iocoder.cn/crm/permission/"
-    />
-    <Button
-      danger
-      type="link"
-      target="_blank"
-      href="https://github.com/yudaocode/yudao-ui-admin-vue3"
-    >
-      该功能支持 Vue3 + element-plus 版本！
-    </Button>
-    <br />
-    <Button
-      type="link"
-      target="_blank"
-      href="https://github.com/yudaocode/yudao-ui-admin-vue3/blob/master/src/views/crm/customer/poolConfig/index"
-    >
-      可参考
-      https://github.com/yudaocode/yudao-ui-admin-vue3/blob/master/src/views/crm/customer/poolConfig/index
-      代码，pull request 贡献给我们！
-    </Button>
+  <Page auto-content-height>
+    <Card title="客户公海规则设置">
+      <Form class="w-1/4" />
+    </Card>
   </Page>
 </template>