fix: merge 解决冲突

apps/web-antd/src/api/crm/operateLog/index.ts

@@ -1,10 +1,12 @@
-import type { PageParam, PageResult } from '@vben/request';
+import type { PageResult } from '@vben/request';
+
+import type { SystemOperateLogApi } from '#/api/system/operate-log';
 
 import { requestClient } from '#/api/request';
 
 export namespace CrmOperateLogApi {
   /** 操作日志查询参数 */
-  export interface OperateLogQuery extends PageParam {
+  export interface OperateLogQuery {
     bizType: number;
     bizId: number;
   }
@@ -24,7 +26,7 @@ export namespace CrmOperateLogApi {
 
 /** 获得操作日志 */
 export function getOperateLogPage(params: CrmOperateLogApi.OperateLogQuery) {
-  return requestClient.get<PageResult<CrmOperateLogApi.OperateLog>>(
+  return requestClient.get<PageResult<SystemOperateLogApi.OperateLog>>(
     '/crm/operate-log/page',
     { params },
   );

apps/web-antd/src/api/crm/permission/index.ts

@@ -1,12 +1,11 @@
-import type { PageParam, PageResult } from '@vben/request';
-
 import { requestClient } from '#/api/request';
 
 export namespace CrmPermissionApi {
   /** 数据权限信息 */
   export interface Permission {
     id?: number; // 数据权限编号
-    userId: number; // 用户编号
+    ids?: number[];
+    userId?: number; // 用户编号
     bizType: number; // Crm 类型
     bizId: number; // Crm 类型数据编号
     level: number; // 权限级别
@@ -15,7 +14,6 @@ export namespace CrmPermissionApi {
     nickname?: string; // 用户昵称
     postNames?: string[]; // 岗位名称数组
     createTime?: Date;
-    ids?: number[];
   }
 
   /** 数据权限转移请求 */
@@ -26,33 +24,38 @@ export namespace CrmPermissionApi {
     toBizTypes?: number[]; // 转移客户时，需要额外有【联系人】【商机】【合同】的 checkbox 选择
   }
 
-  /**
+  export interface PermissionListReq {
-   * CRM 业务类型枚举
+    bizId: number; // 模块数据编号
-   */
+    bizType: number; // 模块类型
-  export enum BizType {
-    CRM_BUSINESS = 4, // 商机
-    CRM_CLUE = 1, // 线索
-    CRM_CONTACT = 3, // 联系人
-    CRM_CONTRACT = 5, // 合同
-    CRM_CUSTOMER = 2, // 客户
-    CRM_PRODUCT = 6, // 产品
-    CRM_RECEIVABLE = 7, // 回款
-    CRM_RECEIVABLE_PLAN = 8, // 回款计划
-  }
-
-  /**
-   * CRM 数据权限级别枚举
-   */
-  export enum PermissionLevel {
-    OWNER = 1, // 负责人
-    READ = 2, // 只读
-    WRITE = 3, // 读写
   }
 }
 
+/**
+ * CRM 业务类型枚举
+ */
+export enum BizTypeEnum {
+  CRM_BUSINESS = 4, // 商机
+  CRM_CLUE = 1, // 线索
+  CRM_CONTACT = 3, // 联系人
+  CRM_CONTRACT = 5, // 合同
+  CRM_CUSTOMER = 2, // 客户
+  CRM_PRODUCT = 6, // 产品
+  CRM_RECEIVABLE = 7, // 回款
+  CRM_RECEIVABLE_PLAN = 8, // 回款计划
+}
+
+/**
+ * CRM 数据权限级别枚举
+ */
+export enum PermissionLevelEnum {
+  OWNER = 1, // 负责人
+  READ = 2, // 只读
+  WRITE = 3, // 读写
+}
+
 /** 获得数据权限列表（查询团队成员列表） */
-export function getPermissionList(params: PageParam) {
+export function getPermissionList(params: CrmPermissionApi.PermissionListReq) {
-  return requestClient.get<PageResult<CrmPermissionApi.Permission>>(
+  return requestClient.get<CrmPermissionApi.Permission[]>(
     '/crm/permission/list',
     { params },
   );

apps/web-antd/src/components/operate-log/index.ts

@@ -0,0 +1,3 @@
+export { default as OperateLog } from './operate-log.vue';
+
+export type { OperateLogProps } from './typing';

apps/web-antd/src/components/operate-log/operate-log.vue

@@ -0,0 +1,46 @@
+<script setup lang="ts">
+import type { OperateLogProps } from './typing';
+
+import { Timeline } from 'ant-design-vue';
+
+import { DICT_TYPE, getDictLabel, getDictObj } from '#/utils';
+
+defineOptions({ name: 'OperateLogV2' });
+
+withDefaults(defineProps<OperateLogProps>(), {
+  logList: () => [],
+});
+
+function getUserTypeColor(userType: number) {
+  const dict = getDictObj(DICT_TYPE.USER_TYPE, userType);
+  switch (dict?.colorType) {
+    case 'danger': {
+      return '#F56C6C';
+    }
+    case 'info': {
+      return '#909399';
+    }
+    case 'success': {
+      return '#67C23A';
+    }
+    case 'warning': {
+      return '#E6A23C';
+    }
+  }
+  return '#409EFF';
+}
+</script>
+<template>
+  <div>
+    <Timeline>
+      <Timeline.Item
+        v-for="log in logList"
+        :key="log.id"
+        :color="getUserTypeColor(log.userType)"
+      >
+        <p>{{ log.createTime }}</p>
+        <p>{{ getDictLabel(DICT_TYPE.USER_TYPE, log.userType)[0] }}</p>
+      </Timeline.Item>
+    </Timeline>
+  </div>
+</template>

apps/web-antd/src/components/operate-log/typing.ts

@@ -0,0 +1,5 @@
+import type { SystemOperateLogApi } from '#/api/system/operate-log';
+
+export interface OperateLogProps {
+  logList: SystemOperateLogApi.OperateLog[]; // 操作日志列表
+}

apps/web-antd/src/components/simple-process-design/components/nodes-config/condition-node-config.vue

@@ -20,6 +20,7 @@ import Condition from './modules/condition.vue';
 defineOptions({
   name: 'ConditionNodeConfig',
 });
+
 const props = defineProps({
   conditionNode: {
     type: Object as () => SimpleFlowNode,
@@ -58,7 +59,7 @@ const conditionRef = ref();
 const fieldOptions = useFormFieldsAndStartUser(); // 流程表单字段和发起人字段
 
 /** 保存配置 */
-const saveConfig = async () => {
+async function saveConfig() {
   if (!currentNode.value.conditionSetting?.defaultFlow) {
     // 校验表单
     const valid = await conditionRef.value.validate();
@@ -89,14 +90,14 @@ const saveConfig = async () => {
   }
   drawerApi.close();
   return true;
-};
+}
 
 const [Drawer, drawerApi] = useVbenDrawer({
   title: currentNode.value.name,
   onConfirm: saveConfig,
 });
 
-const open = () => {
+function open() {
   // 使用三元表达式代替 if-else，解决 linter 警告
   condition.value = currentNode.value.conditionSetting
     ? cloneDeep(currentNode.value.conditionSetting)
@@ -121,7 +122,7 @@ const open = () => {
       };
 
   drawerApi.open();
-};
+}
 
 watch(
   () => props.conditionNode,
@@ -130,11 +131,12 @@ watch(
   },
 );
 
-const clickIcon = () => {
+function clickIcon() {
   showInput.value = true;
-};
+}
+
 // 输入框失去焦点
-const blurEvent = () => {
+function blurEvent() {
   showInput.value = false;
   currentNode.value.name =
     currentNode.value.name ||
@@ -142,7 +144,7 @@ const blurEvent = () => {
       props.nodeIndex,
       currentNode.value?.conditionSetting?.defaultFlow,
     );
-};
+}
 
 defineExpose({ open }); // 提供 open 方法，用于打开弹窗
 </script>

apps/web-antd/src/components/simple-process-design/components/nodes-config/copy-task-node-config.vue

@@ -44,12 +44,14 @@ import {
 } from '../../helpers';
 
 defineOptions({ name: 'CopyTaskNodeConfig' });
+
 const props = defineProps({
   flowNode: {
     type: Object as () => SimpleFlowNode,
     required: true,
   },
 });
+
 const deptLevelLabel = computed(() => {
   let label = '部门负责人来源';
   label =
@@ -59,6 +61,7 @@ const deptLevelLabel = computed(() => {
       : `${label}(发起人部门向上)`;
   return label;
 });
+
 // 抽屉配置
 const [Drawer, drawerApi] = useVbenDrawer({
   header: true,
@@ -68,14 +71,18 @@ const [Drawer, drawerApi] = useVbenDrawer({
     saveConfig();
   },
 });
+
 // 当前节点
 const currentNode = useWatchNode(props);
+
 // 节点名称
 const { nodeName, showInput, clickIcon, blurEvent } = useNodeName(
   NodeType.COPY_TASK_NODE,
 );
+
 // 激活的 Tab 标签页
 const activeTabName = ref('user');
+
 // 表单字段权限配置
 const {
   formType,
@@ -83,16 +90,20 @@ const {
   formFieldOptions,
   getNodeConfigFormFields,
 } = useFormFieldsPermission(FieldPermissionType.READ);
+
 // 表单内用户字段选项, 必须是必填和用户选择器
 const userFieldOnFormOptions = computed(() => {
   return formFieldOptions.filter((item) => item.type === 'UserSelect');
 });
+
 // 表单内部门字段选项, 必须是必填和部门选择器
 const deptFieldOnFormOptions = computed(() => {
   return formFieldOptions.filter((item) => item.type === 'DeptSelect');
 });
+
 // 抄送人表单配置
 const formRef = ref(); // 表单 Ref
+
 // 表单校验规则
 const formRules: Record<string, Rule[]> = reactive({
   candidateStrategy: [
@@ -127,6 +138,7 @@ const {
   handleCandidateParam,
   parseCandidateParam,
 } = useNodeForm(NodeType.COPY_TASK_NODE);
+
 const configForm = tempConfigForm as Ref<CopyTaskFormType>;
 // 抄送人策略， 去掉发起人自选 和 发起人自己
 const copyUserStrategies = computed(() => {
@@ -134,8 +146,9 @@ const copyUserStrategies = computed(() => {
     (item) => item.value !== CandidateStrategy.START_USER,
   );
 });
+
 // 改变抄送人设置策略
-const changeCandidateStrategy = () => {
+function changeCandidateStrategy() {
   configForm.value.userIds = [];
   configForm.value.deptIds = [];
   configForm.value.roleIds = [];
@@ -144,9 +157,10 @@ const changeCandidateStrategy = () => {
   configForm.value.deptLevel = 1;
   configForm.value.formUser = '';
   configForm.value.formDept = '';
-};
+}
+
 // 保存配置
-const saveConfig = async () => {
+async function saveConfig() {
   activeTabName.value = 'user';
   if (!formRef.value) return false;
   const valid = await formRef.value.validate();
@@ -160,9 +174,10 @@ const saveConfig = async () => {
   currentNode.value.fieldsPermission = fieldsPermissionConfig.value;
   drawerApi.close();
   return true;
-};
+}
+
 // 显示抄送节点配置， 由父组件传过来
-const showCopyTaskNodeConfig = (node: SimpleFlowNode) => {
+function showCopyTaskNodeConfig(node: SimpleFlowNode) {
   nodeName.value = node.name;
   // 抄送人设置
   configForm.value.candidateStrategy = node.candidateStrategy!;
@@ -171,10 +186,10 @@ const showCopyTaskNodeConfig = (node: SimpleFlowNode) => {
   getNodeConfigFormFields(node.fieldsPermission);
 
   drawerApi.open();
-};
+}
 
 /** 批量更新权限 */
-const updatePermission = (type: string) => {
+function updatePermission(type: string) {
   fieldsPermissionConfig.value.forEach((field) => {
     if (type === 'READ') {
       field.permission = FieldPermissionType.READ;
@@ -184,7 +199,7 @@ const updatePermission = (type: string) => {
       field.permission = FieldPermissionType.NONE;
     }
   });
-};
+}
 
 // 在组件初始化时对表单字段进行处理
 onMounted(() => {

apps/web-antd/src/components/simple-process-design/components/nodes-config/delay-timer-node-config.vue

@@ -33,6 +33,7 @@ import { useNodeName, useWatchNode } from '../../helpers';
 import { convertTimeUnit } from './utils';
 
 defineOptions({ name: 'DelayTimerNodeConfig' });
+
 const props = defineProps({
   flowNode: {
     type: Object as () => SimpleFlowNode,
@@ -48,6 +49,7 @@ const { nodeName, showInput, clickIcon, blurEvent } = useNodeName(
 );
 // 抄送人表单配置
 const formRef = ref(); // 表单 Ref
+
 // 表单校验规则
 const formRules: Record<string, Rule[]> = reactive({
   delayType: [
@@ -60,6 +62,7 @@ const formRules: Record<string, Rule[]> = reactive({
     { required: true, message: '延迟时间不能为空', trigger: 'change' },
   ],
 });
+
 // 配置表单数据
 const configForm = ref({
   delayType: DelayTypeEnum.FIXED_TIME_DURATION,
@@ -69,7 +72,7 @@ const configForm = ref({
 });
 
 // 获取显示文本
-const getShowText = (): string => {
+function getShowText(): string {
   let showText = '';
   if (configForm.value.delayType === DelayTypeEnum.FIXED_TIME_DURATION) {
     showText = `延迟${configForm.value.timeDuration}${TIME_UNIT_TYPES?.find((item) => item.value === configForm.value.timeUnit)?.label}`;
@@ -78,10 +81,10 @@ const getShowText = (): string => {
     showText = `延迟至${configForm.value.dateTime.replace('T', ' ')}`;
   }
   return showText;
-};
+}
 
 // 获取ISO时间格式
-const getIsoTimeDuration = () => {
+function getIsoTimeDuration() {
   let strTimeDuration = 'PT';
   if (configForm.value.timeUnit === TimeUnitType.MINUTE) {
     strTimeDuration += `${configForm.value.timeDuration}M`;
@@ -93,10 +96,10 @@ const getIsoTimeDuration = () => {
     strTimeDuration += `${configForm.value.timeDuration}D`;
   }
   return strTimeDuration;
-};
+}
 
 // 保存配置
-const saveConfig = async () => {
+async function saveConfig() {
   if (!formRef.value) return false;
   const valid = await formRef.value.validate();
   if (!valid) return false;
@@ -118,7 +121,7 @@ const saveConfig = async () => {
   }
   drawerApi.close();
   return true;
-};
+}
 
 const [Drawer, drawerApi] = useVbenDrawer({
   title: nodeName.value,
@@ -126,7 +129,7 @@ const [Drawer, drawerApi] = useVbenDrawer({
 });
 
 // 显示延迟器节点配置，由父组件调用
-const openDrawer = (node: SimpleFlowNode) => {
+function openDrawer(node: SimpleFlowNode) {
   nodeName.value = node.name;
   if (node.delaySetting) {
     configForm.value.delayType = node.delaySetting.delayType;
@@ -144,7 +147,7 @@ const openDrawer = (node: SimpleFlowNode) => {
     }
   }
   drawerApi.open();
-};
+}
 
 defineExpose({ openDrawer }); // 暴露方法给父组件
 </script>
@@ -242,4 +245,3 @@ defineExpose({ openDrawer }); // 暴露方法给父组件
     </div>
   </Drawer>
 </template>
-<style lang="scss" scoped></style>

apps/web-antd/src/components/simple-process-design/components/nodes-config/modules/condition-dialog.vue

@@ -50,15 +50,16 @@ const [Modal, modalApi] = useVbenModal({
   },
 });
 
-const open = (conditionObj: any | undefined) => {
+// TODO: jason  open 在 useVbenModal 中 onOpenChange 方法
+function open(conditionObj: any | undefined) {
   if (conditionObj) {
     conditionData.value.conditionType = conditionObj.conditionType;
     conditionData.value.conditionExpression = conditionObj.conditionExpression;
     conditionData.value.conditionGroups = conditionObj.conditionGroups;
   }
   modalApi.open();
-};
+}
-
+// TODO: jason  不需要暴露expose，直接使用modalApi.setData(formSetting).open()
 defineExpose({ open });
 </script>
 <template>
@@ -66,5 +67,3 @@ defineExpose({ open });
     <Condition ref="conditionRef" v-model="conditionData" />
   </Modal>
 </template>
-
-<style lang="scss" scoped></style>

apps/web-antd/src/components/simple-process-design/components/nodes-config/modules/condition.vue

@@ -38,13 +38,16 @@ import { useFormFieldsAndStartUser } from '../../../helpers';
 defineOptions({
   name: 'Condition',
 });
+
 const props = defineProps({
   modelValue: {
     type: Object,
     required: true,
   },
 });
+
 const emit = defineEmits(['update:modelValue']);
+
 const condition = computed({
   get() {
     return props.modelValue;
@@ -81,35 +84,37 @@ const formRules: Record<string, Rule[]> = reactive({
     },
   ],
 });
+
 const formRef = ref(); // 表单 Ref
 
 /** 切换条件配置方式 */
-const changeConditionType = () => {
+function changeConditionType() {
   if (
     condition.value.conditionType === ConditionType.RULE &&
     !condition.value.conditionGroups
   ) {
     condition.value.conditionGroups = cloneDeep(DEFAULT_CONDITION_GROUP_VALUE);
   }
-};
+}
-const deleteConditionGroup = (conditions: any, index: number) => {
+
+function deleteConditionGroup(conditions: any, index: number) {
   conditions.splice(index, 1);
-};
+}
 
-const deleteConditionRule = (condition: any, index: number) => {
+function deleteConditionRule(condition: any, index: number) {
   condition.rules.splice(index, 1);
-};
+}
 
-const addConditionRule = (condition: any, index: number) => {
+function addConditionRule(condition: any, index: number) {
   const rule = {
     opCode: '==',
     leftSide: undefined,
     rightSide: '',
   };
   condition.rules.splice(index + 1, 0, rule);
-};
+}
 
-const addConditionGroup = (conditions: any) => {
+function addConditionGroup(conditions: any) {
   const condition = {
     and: true,
     rules: [
@@ -121,12 +126,12 @@ const addConditionGroup = (conditions: any) => {
     ],
   };
   conditions.push(condition);
-};
+}
 
-const validate = async () => {
+async function validate() {
   if (!formRef.value) return false;
   return await formRef.value.validate();
-};
+}
 
 defineExpose({ validate });
 </script>

apps/web-antd/src/components/simple-process-design/components/nodes-config/modules/http-request-param-setting.vue

@@ -42,18 +42,18 @@ const props = defineProps({
 const formFieldOptions = useFormFieldsAndStartUser();
 
 /** 添加请求配置项 */
-const addHttpRequestParam = (arr: HttpRequestParam[]) => {
+function addHttpRequestParam(arr: HttpRequestParam[]) {
   arr.push({
     key: '',
     type: BpmHttpRequestParamTypeEnum.FIXED_VALUE,
     value: '',
   });
-};
+}
 
 /** 删除请求配置项 */
-const deleteHttpRequestParam = (arr: HttpRequestParam[], index: number) => {
+function deleteHttpRequestParam(arr: HttpRequestParam[], index: number) {
   arr.splice(index, 1);
-};
+}
 </script>
 <template>
   <FormItem
@@ -225,4 +225,3 @@ const deleteHttpRequestParam = (arr: HttpRequestParam[], index: number) => {
     </Button>
   </FormItem>
 </template>
-<style lang="scss" scoped></style>

apps/web-antd/src/components/simple-process-design/components/nodes-config/modules/http-request-setting.vue

@@ -33,8 +33,11 @@ const props = defineProps({
     required: true,
   },
 });
+
 const emits = defineEmits(['update:setting']);
+
 const { setting } = toRefs(props);
+
 watch(
   () => setting,
   (val) => {
@@ -46,20 +49,20 @@ watch(
 const formFields = useFormFields();
 
 /** 添加 HTTP 请求返回值设置项 */
-const addHttpResponseSetting = (responseSetting: Record<string, string>[]) => {
+function addHttpResponseSetting(responseSetting: Record<string, string>[]) {
   responseSetting.push({
     key: '',
     value: '',
   });
-};
+}
 
 /** 删除 HTTP 请求返回值设置项 */
-const deleteHttpResponseSetting = (
+function deleteHttpResponseSetting(
   responseSetting: Record<string, string>[],
   index: number,
-) => {
+) {
   responseSetting.splice(index, 1);
-};
+}
 </script>
 <template>
   <FormItem>
@@ -171,4 +174,3 @@ const deleteHttpResponseSetting = (
     </FormItem>
   </div>
 </template>
-<style lang="scss" scoped></style>

apps/web-antd/src/components/simple-process-design/components/nodes-config/modules/user-task-listener.vue

@@ -23,8 +23,11 @@ const props = defineProps({
     required: true,
   },
 });
+
 const emit = defineEmits(['update:modelValue']);
+
 const listenerFormRef = ref();
+
 const configForm = computed({
   get() {
     return props.modelValue;
@@ -33,6 +36,7 @@ const configForm = computed({
     emit('update:modelValue', newValue);
   },
 });
+
 const taskListener = ref([
   {
     name: '创建任务',
@@ -48,10 +52,10 @@ const taskListener = ref([
   },
 ]);
 
-const validate = async () => {
+async function validate() {
   if (!listenerFormRef.value) return false;
   return await listenerFormRef.value.validate();
-};
+}
 
 defineExpose({ validate });
 </script>

apps/web-antd/src/components/simple-process-design/components/nodes-config/router-node-config.vue

@@ -26,12 +26,14 @@ import { useNodeName, useWatchNode } from '../../helpers';
 import Condition from './modules/condition.vue';
 
 defineOptions({ name: 'RouterNodeConfig' });
+
 const props = defineProps({
   flowNode: {
     type: Object as () => SimpleFlowNode,
     required: true,
   },
 });
+
 const processNodeTree = inject<Ref<SimpleFlowNode>>('processNodeTree');
 
 /** 当前节点 */
@@ -46,7 +48,7 @@ const conditionRef = ref<any[]>([]);
 const formRef = ref();
 
 /** 校验节点配置 */
-const validateConfig = async () => {
+async function validateConfig() {
   // 校验路由分支选择
   const routeIdValid = await formRef.value.validate().catch(() => false);
   if (!routeIdValid) {
@@ -68,10 +70,10 @@ const validateConfig = async () => {
   if (!showText) return false;
 
   return true;
-};
+}
 
 /** 保存配置 */
-const saveConfig = async () => {
+async function saveConfig() {
   // 校验配置
   if (!(await validateConfig())) {
     return false;
@@ -82,7 +84,7 @@ const saveConfig = async () => {
   currentNode.value.routerGroups = routerGroups.value;
   drawerApi.close();
   return true;
-};
+}
 
 const [Drawer, drawerApi] = useVbenDrawer({
   title: nodeName.value,
@@ -90,7 +92,7 @@ const [Drawer, drawerApi] = useVbenDrawer({
 });
 
 /** 打开路由节点配置抽屉，由父组件调用 */
-const openDrawer = (node: SimpleFlowNode) => {
+function openDrawer(node: SimpleFlowNode) {
   nodeOptions.value = [];
   getRouterNode(processNodeTree?.value);
   routerGroups.value = [];
@@ -99,10 +101,10 @@ const openDrawer = (node: SimpleFlowNode) => {
     routerGroups.value = node.routerGroups;
   }
   drawerApi.open();
-};
+}
 
 /** 获取显示文本 */
-const getShowText = () => {
+function getShowText() {
   if (
     !routerGroups.value ||
     !Array.isArray(routerGroups.value) ||
@@ -135,10 +137,10 @@ const getShowText = () => {
     }
   }
   return `${routerGroups.value.length}条路由分支`;
-};
+}
 
 /** 添加路由分支 */
-const addRouterGroup = () => {
+function addRouterGroup() {
   routerGroups.value.push({
     nodeId: undefined,
     conditionType: ConditionType.RULE,
@@ -159,15 +161,15 @@ const addRouterGroup = () => {
       ],
     },
   });
-};
+}
 
 /** 删除路由分支 */
-const deleteRouterGroup = (index: number) => {
+function deleteRouterGroup(index: number) {
   routerGroups.value.splice(index, 1);
-};
+}
 
 /** 递归获取所有节点 */
-const getRouterNode = (node: any) => {
+function getRouterNode(node: any) {
   // TODO 最好还需要满足以下要求
   // 并行分支、包容分支内部节点不能跳转到外部节点
   // 条件分支节点可以向上跳转到外部节点
@@ -192,7 +194,7 @@ const getRouterNode = (node: any) => {
     }
     node = node.childNode;
   }
-};
+}
 
 defineExpose({ openDrawer }); // 暴露方法给父组件
 </script>

apps/web-antd/src/components/simple-process-design/components/nodes-config/start-user-node-config.vue

@@ -37,12 +37,14 @@ import {
 } from '../../helpers';
 
 defineOptions({ name: 'StartUserNodeConfig' });
+
 const props = defineProps({
   flowNode: {
     type: Object as () => SimpleFlowNode,
     required: true,
   },
 });
+
 // 可发起流程的用户编号
 const startUserIds = inject<Ref<any[]>>('startUserIds');
 // 可发起流程的部门编号
@@ -59,10 +61,12 @@ const { nodeName, showInput, clickIcon, blurEvent } = useNodeName(
 );
 // 激活的 Tab 标签页
 const activeTabName = ref('user');
+
 // 表单字段权限配置
 const { formType, fieldsPermissionConfig, getNodeConfigFormFields } =
   useFormFieldsPermission(FieldPermissionType.WRITE);
-const getUserNicknames = (userIds: number[]): string => {
+
+function getUserNicknames(userIds: number[]): string {
   if (!userIds || userIds.length === 0) {
     return '';
   }
@@ -74,9 +78,9 @@ const getUserNicknames = (userIds: number[]): string => {
     }
   });
   return nicknames.join(',');
-};
+}
 
-const getDeptNames = (deptIds: number[]): string => {
+function getDeptNames(deptIds: number[]): string {
   if (!deptIds || deptIds.length === 0) {
     return '';
   }
@@ -88,7 +92,7 @@ const getDeptNames = (deptIds: number[]): string => {
     }
   });
   return deptNames.join(',');
-};
+}
 
 // 使用 VbenDrawer
 const [Drawer, drawerApi] = useVbenDrawer({
@@ -103,7 +107,7 @@ const [Drawer, drawerApi] = useVbenDrawer({
 });
 
 // 保存配置
-const saveConfig = async () => {
+async function saveConfig() {
   activeTabName.value = 'user';
   currentNode.value.name = nodeName.value!;
   currentNode.value.showText = '已设置';
@@ -113,18 +117,18 @@ const saveConfig = async () => {
   currentNode.value.buttonsSetting = START_USER_BUTTON_SETTING;
   drawerApi.setState({ isOpen: false });
   return true;
-};
+}
 
 // 显示发起人节点配置，由父组件传过来
-const showStartUserNodeConfig = (node: SimpleFlowNode) => {
+function showStartUserNodeConfig(node: SimpleFlowNode) {
   nodeName.value = node.name;
   // 表单字段权限
   getNodeConfigFormFields(node.fieldsPermission);
   drawerApi.open();
-};
+}
 
 /** 批量更新权限 */
-const updatePermission = (type: string) => {
+function updatePermission(type: string) {
   fieldsPermissionConfig.value.forEach((field) => {
     if (type === 'READ') {
       field.permission = FieldPermissionType.READ;
@@ -134,7 +138,7 @@ const updatePermission = (type: string) => {
       field.permission = FieldPermissionType.NONE;
     }
   });
-};
+}
 
 /**
  * 暴露方法给父组件
@@ -289,4 +293,3 @@ defineExpose({ showStartUserNodeConfig });
     </Tabs>
   </Drawer>
 </template>
-<style lang="scss" scoped></style>

apps/web-antd/src/components/simple-process-design/components/nodes-config/trigger-node-config.vue

@@ -76,6 +76,7 @@ const { nodeName, showInput, clickIcon, blurEvent } = useNodeName(
 );
 // 触发器表单配置
 const formRef = ref(); // 表单 Ref
+
 // 表单校验规则
 const formRules: Record<string, Rule[]> = reactive({
   type: [{ required: true, message: '触发器类型不能为空', trigger: 'change' }],
@@ -83,6 +84,7 @@ const formRules: Record<string, Rule[]> = reactive({
     { required: true, message: '请求地址不能为空', trigger: 'blur' },
   ],
 });
+
 // 触发器配置表单数据
 const configForm = ref<TriggerSetting>({
   type: TriggerTypeEnum.HTTP_REQUEST,
@@ -115,7 +117,7 @@ const optionalUpdateFormFields = computed(() => {
 let originalSetting: TriggerSetting | undefined;
 
 /** 触发器类型改变了 */
-const changeTriggerType = () => {
+function changeTriggerType() {
   if (configForm.value.type === TriggerTypeEnum.HTTP_REQUEST) {
     configForm.value.httpRequestSetting =
       originalSetting?.type === TriggerTypeEnum.HTTP_REQUEST &&
@@ -176,44 +178,48 @@ const changeTriggerType = () => {
           ];
     configForm.value.httpRequestSetting = undefined;
   }
-};
+}
 
 /** 添加新的修改表单设置 */
-const addFormSetting = () => {
+function addFormSetting() {
   configForm.value.formSettings!.push({
     conditionGroups: cloneDeep(DEFAULT_CONDITION_GROUP_VALUE),
     updateFormFields: {},
     deleteFields: [],
   });
-};
+}
 
 /** 删除修改表单设置 */
-const deleteFormSetting = (index: number) => {
+function deleteFormSetting(index: number) {
   configForm.value.formSettings!.splice(index, 1);
-};
+}
 
 /** 添加条件配置 */
-const addFormSettingCondition = (
+function addFormSettingCondition(
   index: number,
   formSetting: FormTriggerSetting,
-) => {
+) {
   const conditionDialog = proxy.$refs[`condition-${index}`][0];
+  // TODO: jason Modal 使用 useVbenModal 初始化，弹出使用modalApi.setData(formSetting).open()
   conditionDialog.open(formSetting);
-};
+}
+
 /** 删除条件配置 */
-const deleteFormSettingCondition = (formSetting: FormTriggerSetting) => {
+function deleteFormSettingCondition(formSetting: FormTriggerSetting) {
   formSetting.conditionType = undefined;
-};
+}
+
 /** 打开条件配置弹窗 */
-const openFormSettingCondition = (
+function openFormSettingCondition(
   index: number,
   formSetting: FormTriggerSetting,
-) => {
+) {
   const conditionDialog = proxy.$refs[`condition-${index}`][0];
   conditionDialog.open(formSetting);
-};
+}
+
 /** 处理条件配置保存 */
-const handleConditionUpdate = (index: number, condition: any) => {
+function handleConditionUpdate(index: number, condition: any) {
   if (configForm.value.formSettings![index]) {
     configForm.value.formSettings![index].conditionType =
       condition.conditionType;
@@ -222,50 +228,48 @@ const handleConditionUpdate = (index: number, condition: any) => {
     configForm.value.formSettings![index].conditionGroups =
       condition.conditionGroups;
   }
-};
+}
 // 包含发起人字段的表单字段
 const includeStartUserFormFields = useFormFieldsAndStartUser();
 /** 条件配置展示 */
-const showConditionText = (formSetting: FormTriggerSetting) => {
+function showConditionText(formSetting: FormTriggerSetting) {
   return getConditionShowText(
     formSetting.conditionType,
     formSetting.conditionExpression,
     formSetting.conditionGroups,
     includeStartUserFormFields,
   );
-};
+}
 
 /** 添加修改字段设置项 */
-const addFormFieldSetting = (formSetting: FormTriggerSetting) => {
+function addFormFieldSetting(formSetting: FormTriggerSetting) {
   if (!formSetting) return;
   if (!formSetting.updateFormFields) {
     formSetting.updateFormFields = {};
   }
   formSetting.updateFormFields[''] = undefined;
-};
+}
+
 /** 更新字段 KEY */
-const updateFormFieldKey = (
+function updateFormFieldKey(
   formSetting: FormTriggerSetting,
   oldKey: string,
   newKey: SelectValue,
-) => {
+) {
   if (!formSetting?.updateFormFields || !newKey) return;
   const value = formSetting.updateFormFields[oldKey];
   delete formSetting.updateFormFields[oldKey];
   formSetting.updateFormFields[String(newKey)] = value;
-};
+}
 
 /** 删除修改字段设置项 */
-const deleteFormFieldSetting = (
+function deleteFormFieldSetting(formSetting: FormTriggerSetting, key: string) {
-  formSetting: FormTriggerSetting,
-  key: string,
-) => {
   if (!formSetting?.updateFormFields) return;
   delete formSetting.updateFormFields[key];
-};
+}
 
 /** 保存配置 */
-const saveConfig = async () => {
+async function saveConfig() {
   if (!formRef.value) return false;
   const valid = await formRef.value.validate();
   if (!valid) return false;
@@ -302,10 +306,10 @@ const saveConfig = async () => {
   currentNode.value.triggerSetting = configForm.value;
   drawerApi.close();
   return true;
-};
+}
 
 /** 获取节点展示内容 */
-const getShowText = (): string => {
+function getShowText(): string {
   let showText = '';
   switch (configForm.value.type) {
     case TriggerTypeEnum.FORM_DELETE: {
@@ -342,10 +346,10 @@ const getShowText = (): string => {
     // No default
   }
   return showText;
-};
+}
 
 /** 显示触发器节点配置， 由父组件传过来 */
-const showTriggerNodeConfig = (node: SimpleFlowNode) => {
+function showTriggerNodeConfig(node: SimpleFlowNode) {
   nodeName.value = node.name;
   originalSetting = node.triggerSetting
     ? cloneDeep(node.triggerSetting)
@@ -369,7 +373,7 @@ const showTriggerNodeConfig = (node: SimpleFlowNode) => {
     };
   }
   drawerApi.open();
-};
+}
 
 // 暴露方法给父组件
 defineExpose({ showTriggerNodeConfig });

apps/web-antd/src/components/simple-process-design/components/nodes-config/user-task-node-config.vue

@@ -70,15 +70,18 @@ import UserTaskListener from './modules/user-task-listener.vue';
 import { convertTimeUnit, getApproveTypeText } from './utils';
 
 defineOptions({ name: 'UserTaskNodeConfig' });
+
 const props = defineProps({
   flowNode: {
     type: Object as () => SimpleFlowNode,
     required: true,
   },
 });
+
 const emits = defineEmits<{
   findReturnTaskNodes: [nodeList: SimpleFlowNode[]];
 }>();
+
 const deptLevelLabel = computed(() => {
   let label = '部门负责人来源';
   if (
@@ -95,6 +98,7 @@ const deptLevelLabel = computed(() => {
   }
   return label;
 });
+
 // 监控节点的变化
 const currentNode = useWatchNode(props);
 // 抽屉配置
@@ -106,12 +110,15 @@ const [Drawer, drawerApi] = useVbenDrawer({
     saveConfig();
   },
 });
+
 // 节点名称配置
 const { nodeName, showInput, clickIcon, blurEvent } = useNodeName(
   NodeType.USER_TASK_NODE,
 );
+
 // 激活的 Tab 标签页
 const activeTabName = ref('user');
+
 // 表单字段权限设置
 const {
   formType,
@@ -119,10 +126,12 @@ const {
   formFieldOptions,
   getNodeConfigFormFields,
 } = useFormFieldsPermission(FieldPermissionType.READ);
+
 // 表单内用户字段选项, 必须是必填和用户选择器
 const userFieldOnFormOptions = computed(() => {
   return formFieldOptions.filter((item) => item.type === 'UserSelect');
 });
+
 // 表单内部门字段选项, 必须是必填和部门选择器
 const deptFieldOnFormOptions = computed(() => {
   return formFieldOptions.filter((item) => item.type === 'DeptSelect');
@@ -135,7 +144,9 @@ const {
   changeBtnDisplayName,
   btnDisplayNameBlurEvent,
 } = useButtonsSetting();
+
 const approveType = ref(ApproveType.USER);
+
 // 审批人表单设置
 const formRef = ref(); // 表单 Ref
 // 表单校验规则
@@ -197,7 +208,7 @@ const {
 const configForm = tempConfigForm as Ref<UserTaskFormType>;
 
 // 改变审批人设置策略
-const changeCandidateStrategy = () => {
+function changeCandidateStrategy() {
   configForm.value.userIds = [];
   configForm.value.deptIds = [];
   configForm.value.roleIds = [];
@@ -207,16 +218,16 @@ const changeCandidateStrategy = () => {
   configForm.value.formUser = '';
   configForm.value.formDept = '';
   configForm.value.approveMethod = ApproveMethodType.SEQUENTIAL_APPROVE;
-};
+}
 
 /** 审批方式改变 */
-const approveMethodChanged = () => {
+function approveMethodChanged() {
   configForm.value.rejectHandlerType = RejectHandlerType.FINISH_PROCESS;
   if (configForm.value.approveMethod === ApproveMethodType.APPROVE_BY_RATIO) {
     configForm.value.approveRatio = 100;
   }
   formRef.value.clearValidate('approveRatio');
-};
+}
 // 审批拒绝 可退回的节点
 const returnTaskList = ref<SimpleFlowNode[]>([]);
 // 审批人超时未处理设置
@@ -238,7 +249,7 @@ const nodeTypeName = computed(() => {
 });
 
 /** 校验节点配置 */
-const validateConfig = async () => {
+async function validateConfig() {
   if (!formRef.value) return false;
   if (!userTaskListenerRef.value) return false;
 
@@ -262,9 +273,10 @@ const validateConfig = async () => {
   if (!showText) return false;
 
   return true;
-};
+}
+
 /** 保存配置 */
-const saveConfig = async () => {
+async function saveConfig() {
   // 如果不是人工审批，不执行校验，直接返回
   if (approveType.value !== ApproveType.USER) {
     currentNode.value.name = nodeName.value!;
@@ -347,10 +359,10 @@ const saveConfig = async () => {
   currentNode.value.showText = getShowText();
   drawerApi.close();
   return true;
-};
+}
 
 /** 显示审批节点配置， 由父组件传过来 */
-const showUserTaskNodeConfig = (node: SimpleFlowNode) => {
+function showUserTaskNodeConfig(node: SimpleFlowNode) {
   nodeName.value = node.name;
   // 1 审批类型
   approveType.value =
@@ -429,7 +441,7 @@ const showUserTaskNodeConfig = (node: SimpleFlowNode) => {
   configForm.value.reasonRequire = node?.reasonRequire ?? false;
 
   drawerApi.open();
-};
+}
 
 defineExpose({ showUserTaskNodeConfig }); // 暴露方法给父组件
 
@@ -541,7 +553,7 @@ function useTimeoutHandler() {
 }
 
 /** 批量更新权限 */
-const updatePermission = (type: string) => {
+function updatePermission(type: string) {
   fieldsPermissionConfig.value.forEach((field) => {
     if (type === 'READ') {
       field.permission = FieldPermissionType.READ;
@@ -551,7 +563,8 @@ const updatePermission = (type: string) => {
       field.permission = FieldPermissionType.NONE;
     }
   });
-};
+}
+
 // 在组件初始化时记录初始位置
 onMounted(() => {
   // 固定添加发起人ID字段

apps/web-antd/src/components/simple-process-design/components/nodes-config/utils.ts

@@ -1,29 +1,29 @@
 import { APPROVE_TYPE, ApproveType, TimeUnitType } from '../../consts';
 
 /** 获取条件节点默认的名称 */
-export const getDefaultConditionNodeName = (
+export function getDefaultConditionNodeName(
   index: number,
   defaultFlow: boolean | undefined,
-): string => {
+): string {
   if (defaultFlow) {
     return '其它情况';
   }
   return `条件${index + 1}`;
-};
+}
 
 /** 获取包容分支条件节点默认的名称 */
-export const getDefaultInclusiveConditionNodeName = (
+export function getDefaultInclusiveConditionNodeName(
   index: number,
   defaultFlow: boolean | undefined,
-): string => {
+): string {
   if (defaultFlow) {
     return '其它情况';
   }
   return `包容条件${index + 1}`;
-};
+}
 
 /** 转换时间单位字符串为枚举值 */
-export const convertTimeUnit = (strTimeUnit: string) => {
+export function convertTimeUnit(strTimeUnit: string) {
   if (strTimeUnit === 'M') {
     return TimeUnitType.MINUTE;
   }
@@ -34,10 +34,10 @@ export const convertTimeUnit = (strTimeUnit: string) => {
     return TimeUnitType.DAY;
   }
   return TimeUnitType.HOUR;
-};
+}
 
 /** 根据审批类型获取对应的文本描述 */
-export const getApproveTypeText = (approveType: ApproveType): string => {
+export function getApproveTypeText(approveType: ApproveType): string {
   let approveTypeText = '';
   APPROVE_TYPE.forEach((item) => {
     if (item.value === approveType) {
@@ -45,4 +45,4 @@ export const getApproveTypeText = (approveType: ApproveType): string => {
     }
   });
   return approveTypeText;
-};
+}

apps/web-antd/src/components/simple-process-design/components/nodes/copy-task-node.vue

@@ -37,18 +37,18 @@ const { showInput, blurEvent, clickTitle } = useNodeName2(
 
 const nodeSetting = ref();
 // 打开节点配置
-const openNodeConfig = () => {
+function openNodeConfig() {
   if (readonly) {
     return;
   }
   nodeSetting.value.showCopyTaskNodeConfig(currentNode.value);
   nodeSetting.value.openDrawer();
-};
+}
 
 // 删除节点。更新当前节点为孩子节点
-const deleteNode = () => {
+function deleteNode() {
   emits('update:flowNode', currentNode.value.childNode);
-};
+}
 </script>
 <template>
   <div class="node-wrapper">
@@ -115,4 +115,3 @@ const deleteNode = () => {
     />
   </div>
 </template>
-<style lang="scss" scoped></style>

apps/web-antd/src/components/simple-process-design/components/nodes/delay-timer-node.vue

@@ -35,17 +35,17 @@ const { showInput, blurEvent, clickTitle } = useNodeName2(
 
 const nodeSetting = ref();
 // 打开节点配置
-const openNodeConfig = () => {
+function openNodeConfig() {
   if (readonly) {
     return;
   }
   nodeSetting.value.openDrawer(currentNode.value);
-};
+}
 
 // 删除节点。更新当前节点为孩子节点
-const deleteNode = () => {
+function deleteNode() {
   emits('update:flowNode', currentNode.value.childNode);
-};
+}
 </script>
 <template>
   <div class="node-wrapper">
@@ -112,4 +112,3 @@ const deleteNode = () => {
     />
   </div>
 </template>
-<style lang="scss" scoped></style>

apps/web-antd/src/components/simple-process-design/components/nodes/end-event-node.vue

@@ -22,7 +22,7 @@ const processInstance = inject<Ref<any>>('processInstance', ref({}));
 
 const processInstanceInfos = ref<any[]>([]); // 流程的审批信息
 
-const nodeClick = () => {
+function nodeClick() {
   if (readonly && processInstance && processInstance.value) {
     console.warn(
       'TODO 只读模式，弹窗显示审批信息',
@@ -30,7 +30,7 @@ const nodeClick = () => {
       processInstanceInfos.value,
     );
   }
-};
+}
 </script>
 <template>
   <div class="end-node-wrapper">
@@ -44,4 +44,3 @@ const nodeClick = () => {
   </div>
   <!-- TODO 审批信息 -->
 </template>
-<style lang="scss" scoped></style>

apps/web-antd/src/components/simple-process-design/components/nodes/exclusive-node.vue

@@ -20,12 +20,14 @@ import ProcessNodeTree from '../process-node-tree.vue';
 import NodeHandler from './node-handler.vue';
 
 defineOptions({ name: 'ExclusiveNode' });
+
 const props = defineProps({
   flowNode: {
     type: Object as () => SimpleFlowNode,
     required: true,
   },
 });
+
 // 定义事件，更新父组件
 const emits = defineEmits<{
   findParentNode: [nodeList: SimpleFlowNode[], nodeType: number];
@@ -36,10 +38,12 @@ const emits = defineEmits<{
   ];
   'update:modelValue': [node: SimpleFlowNode | undefined];
 }>();
+
 const { proxy } = getCurrentInstance() as any;
 // 是否只读
 const readonly = inject<Boolean>('readonly');
 const currentNode = ref<SimpleFlowNode>(props.flowNode);
+
 watch(
   () => props.flowNode,
   (newValue) => {
@@ -48,8 +52,9 @@ watch(
 );
 
 const showInputs = ref<boolean[]>([]);
+
 // 失去焦点
-const blurEvent = (index: number) => {
+function blurEvent(index: number) {
   showInputs.value[index] = false;
   const conditionNode = currentNode.value.conditionNodes?.at(
     index,
@@ -60,23 +65,23 @@ const blurEvent = (index: number) => {
       index,
       conditionNode.conditionSetting?.defaultFlow,
     );
-};
+}
 
 // 点击条件名称
-const clickEvent = (index: number) => {
+function clickEvent(index: number) {
   showInputs.value[index] = true;
-};
+}
 
-const conditionNodeConfig = (nodeId: string) => {
+function conditionNodeConfig(nodeId: string) {
   if (readonly) {
     return;
   }
   const conditionNode = proxy.$refs[nodeId][0];
   conditionNode.open();
-};
+}
 
 // 新增条件
-const addCondition = () => {
+function addCondition() {
   const conditionNodes = currentNode.value.conditionNodes;
   if (conditionNodes) {
     const len = conditionNodes.length;
@@ -96,10 +101,10 @@ const addCondition = () => {
     };
     conditionNodes.splice(lastIndex, 0, conditionData);
   }
-};
+}
 
 // 删除条件
-const deleteCondition = (index: number) => {
+function deleteCondition(index: number) {
   const conditionNodes = currentNode.value.conditionNodes;
   if (conditionNodes) {
     conditionNodes.splice(index, 1);
@@ -109,10 +114,10 @@ const deleteCondition = (index: number) => {
       emits('update:modelValue', childNode);
     }
   }
-};
+}
 
 // 移动节点
-const moveNode = (index: number, to: number) => {
+function moveNode(index: number, to: number) {
   // -1 ：向左  1： 向右
   if (
     currentNode.value.conditionNodes &&
@@ -125,13 +130,14 @@ const moveNode = (index: number, to: number) => {
         currentNode.value.conditionNodes[index],
       )[0] as SimpleFlowNode;
   }
-};
+}
+
 // 递归从父节点中查询匹配的节点
-const recursiveFindParentNode = (
+function recursiveFindParentNode(
   nodeList: SimpleFlowNode[],
   node: SimpleFlowNode,
   nodeType: number,
-) => {
+) {
   if (!node || node.type === NodeType.START_USER_NODE) {
     return;
   }
@@ -140,7 +146,7 @@ const recursiveFindParentNode = (
   }
   // 条件节点 (NodeType.CONDITION_NODE) 比较特殊。需要调用其父节点条件分支节点（NodeType.EXCLUSIVE_NODE) 继续查找
   emits('findParentNode', nodeList, nodeType);
-};
+}
 </script>
 <template>
   <div class="branch-node-wrapper">
@@ -274,4 +280,3 @@ const recursiveFindParentNode = (
     />
   </div>
 </template>
-<style lang="scss" scoped></style>

apps/web-antd/src/components/simple-process-design/components/nodes/inclusive-node.vue

@@ -25,12 +25,14 @@ import NodeHandler from './node-handler.vue';
 defineOptions({
   name: 'InclusiveNode',
 });
+
 const props = defineProps({
   flowNode: {
     type: Object as () => SimpleFlowNode,
     required: true,
   },
 });
+
 // 定义事件，更新父组件
 const emits = defineEmits<{
   findParentNode: [nodeList: SimpleFlowNode[], nodeType: number];
@@ -41,6 +43,7 @@ const emits = defineEmits<{
   ];
   'update:modelValue': [node: SimpleFlowNode | undefined];
 }>();
+
 const { proxy } = getCurrentInstance() as any;
 // 是否只读
 const readonly = inject<Boolean>('readonly');
@@ -56,7 +59,7 @@ watch(
 
 const showInputs = ref<boolean[]>([]);
 // 失去焦点
-const blurEvent = (index: number) => {
+function blurEvent(index: number) {
   showInputs.value[index] = false;
   const conditionNode = currentNode.value.conditionNodes?.at(
     index,
@@ -67,23 +70,23 @@ const blurEvent = (index: number) => {
       index,
       conditionNode.conditionSetting?.defaultFlow,
     );
-};
+}
 
 // 点击条件名称
-const clickEvent = (index: number) => {
+function clickEvent(index: number) {
   showInputs.value[index] = true;
-};
+}
 
-const conditionNodeConfig = (nodeId: string) => {
+function conditionNodeConfig(nodeId: string) {
   if (readonly) {
     return;
   }
   const conditionNode = proxy.$refs[nodeId][0];
   conditionNode.open();
-};
+}
 
 // 新增条件
-const addCondition = () => {
+function addCondition() {
   const conditionNodes = currentNode.value.conditionNodes;
   if (conditionNodes) {
     const len = conditionNodes.length;
@@ -103,10 +106,10 @@ const addCondition = () => {
     };
     conditionNodes.splice(lastIndex, 0, conditionData);
   }
-};
+}
 
 // 删除条件
-const deleteCondition = (index: number) => {
+function deleteCondition(index: number) {
   const conditionNodes = currentNode.value.conditionNodes;
   if (conditionNodes) {
     conditionNodes.splice(index, 1);
@@ -116,10 +119,10 @@ const deleteCondition = (index: number) => {
       emits('update:modelValue', childNode);
     }
   }
-};
+}
 
 // 移动节点
-const moveNode = (index: number, to: number) => {
+function moveNode(index: number, to: number) {
   // -1 ：向左  1： 向右
   if (
     currentNode.value.conditionNodes &&
@@ -132,13 +135,14 @@ const moveNode = (index: number, to: number) => {
         currentNode.value.conditionNodes[index],
       )[0] as SimpleFlowNode;
   }
-};
+}
+
 // 递归从父节点中查询匹配的节点
-const recursiveFindParentNode = (
+function recursiveFindParentNode(
   nodeList: SimpleFlowNode[],
   node: SimpleFlowNode,
   nodeType: number,
-) => {
+) {
   if (!node || node.type === NodeType.START_USER_NODE) {
     return;
   }
@@ -147,7 +151,7 @@ const recursiveFindParentNode = (
   }
   // 条件节点 (NodeType.CONDITION_NODE) 比较特殊。需要调用其父节点条件分支节点（NodeType.INCLUSIVE_BRANCH_NODE) 继续查找
   emits('findParentNode', nodeList, nodeType);
-};
+}
 </script>
 <template>
   <div class="branch-node-wrapper">
@@ -279,4 +283,3 @@ const recursiveFindParentNode = (
     />
   </div>
 </template>
-<style lang="scss" scoped></style>

apps/web-antd/src/components/simple-process-design/components/nodes/node-handler.vue

@@ -33,11 +33,12 @@ const props = defineProps({
     required: true,
   },
 });
+
 const emits = defineEmits(['update:childNode']);
 const popoverShow = ref(false);
 const readonly = inject<Boolean>('readonly'); // 是否只读
 
-const addNode = (type: number) => {
+function addNode(type: number) {
   // 校验：条件分支、包容分支后面，不允许直接添加并行分支
   if (
     type === NodeType.PARALLEL_BRANCH_NODE &&
@@ -238,7 +239,7 @@ const addNode = (type: number) => {
     };
     emits('update:childNode', data);
   }
-};
+}
 </script>
 <template>
   <div class="node-handler-wrapper">
@@ -334,5 +335,3 @@ const addNode = (type: number) => {
     </div>
   </div>
 </template>
-
-<style lang="scss" scoped></style>

apps/web-antd/src/components/simple-process-design/components/nodes/parallel-node.vue

@@ -14,12 +14,14 @@ import ProcessNodeTree from '../process-node-tree.vue';
 import NodeHandler from './node-handler.vue';
 
 defineOptions({ name: 'ParallelNode' });
+
 const props = defineProps({
   flowNode: {
     type: Object as () => SimpleFlowNode,
     required: true,
   },
 });
+
 // 定义事件，更新父组件
 const emits = defineEmits<{
   findParnetNode: [nodeList: SimpleFlowNode[], nodeType: number];
@@ -30,6 +32,7 @@ const emits = defineEmits<{
   ];
   'update:modelValue': [node: SimpleFlowNode | undefined];
 }>();
+
 const currentNode = ref<SimpleFlowNode>(props.flowNode);
 // 是否只读
 const readonly = inject<Boolean>('readonly');
@@ -42,22 +45,23 @@ watch(
 );
 
 const showInputs = ref<boolean[]>([]);
+
 // 失去焦点
-const blurEvent = (index: number) => {
+function blurEvent(index: number) {
   showInputs.value[index] = false;
   const conditionNode = currentNode.value.conditionNodes?.at(
     index,
   ) as SimpleFlowNode;
   conditionNode.name = conditionNode.name || `并行${index + 1}`;
-};
+}
 
 // 点击条件名称
-const clickEvent = (index: number) => {
+function clickEvent(index: number) {
   showInputs.value[index] = true;
-};
+}
 
 // 新增条件
-const addCondition = () => {
+function addCondition() {
   const conditionNodes = currentNode.value.conditionNodes;
   if (conditionNodes) {
     const len = conditionNodes.length;
@@ -72,10 +76,10 @@ const addCondition = () => {
     };
     conditionNodes.splice(lastIndex, 0, conditionData);
   }
-};
+}
 
 // 删除条件
-const deleteCondition = (index: number) => {
+function deleteCondition(index: number) {
   const conditionNodes = currentNode.value.conditionNodes;
   if (conditionNodes) {
     conditionNodes.splice(index, 1);
@@ -85,14 +89,14 @@ const deleteCondition = (index: number) => {
       emits('update:modelValue', childNode);
     }
   }
-};
+}
 
 // 递归从父节点中查询匹配的节点
-const recursiveFindParentNode = (
+function recursiveFindParentNode(
   nodeList: SimpleFlowNode[],
   node: SimpleFlowNode,
   nodeType: number,
-) => {
+) {
   if (!node || node.type === NodeType.START_USER_NODE) {
     return;
   }
@@ -101,7 +105,7 @@ const recursiveFindParentNode = (
   }
   // 条件节点 (NodeType.CONDITION_NODE) 比较特殊。需要调用其父节点并行节点（NodeType.PARALLEL_NODE) 继续查找
   emits('findParnetNode', nodeList, nodeType);
-};
+}
 </script>
 <template>
   <div class="branch-node-wrapper">

apps/web-antd/src/components/simple-process-design/components/nodes/router-node.vue

@@ -20,10 +20,12 @@ const props = defineProps({
     required: true,
   },
 });
+
 // 定义事件，更新父组件
 const emits = defineEmits<{
   'update:flowNode': [node: SimpleFlowNode | undefined];
 }>();
+
 // 是否只读
 const readonly = inject<Boolean>('readonly');
 // 监控节点的变化
@@ -36,17 +38,17 @@ const { showInput, blurEvent, clickTitle } = useNodeName2(
 
 const nodeSetting = ref();
 // 打开节点配置
-const openNodeConfig = () => {
+function openNodeConfig() {
   if (readonly) {
     return;
   }
   nodeSetting.value.openDrawer(currentNode.value);
-};
+}
 
 // 删除节点。更新当前节点为孩子节点
-const deleteNode = () => {
+function deleteNode() {
   emits('update:flowNode', currentNode.value.childNode);
-};
+}
 </script>
 <template>
   <div class="node-wrapper">
@@ -112,4 +114,3 @@ const deleteNode = () => {
     />
   </div>
 </template>
-<style lang="scss" scoped></style>

apps/web-antd/src/components/simple-process-design/components/nodes/start-user-node.vue

@@ -15,17 +15,20 @@ import StartUserNodeConfig from '../nodes-config/start-user-node-config.vue';
 import NodeHandler from './node-handler.vue';
 
 defineOptions({ name: 'StartUserNode' });
+
 const props = defineProps({
   flowNode: {
     type: Object as () => SimpleFlowNode,
     default: () => null,
   },
 });
+
 // 定义事件，更新父组件。
-// eslint-disable-next-line unused-imports/no-unused-vars, no-unused-vars
+// const emits = defineEmits<{
-const emits = defineEmits<{
+defineEmits<{
   'update:modelValue': [node: SimpleFlowNode | undefined];
 }>();
+
 const readonly = inject<Boolean>('readonly'); // 是否只读
 const tasks = inject<Ref<any[]>>('tasks', ref([]));
 // 监控节点变化
@@ -41,7 +44,7 @@ const nodeSetting = ref();
 // 任务的弹窗显示，用于只读模式
 const selectTasks = ref<any[] | undefined>([]); // 选中的任务数组
 
-const nodeClick = () => {
+function nodeClick() {
   if (readonly) {
     // 只读模式，弹窗显示任务信息
     if (tasks && tasks.value) {
@@ -58,7 +61,7 @@ const nodeClick = () => {
     );
     nodeSetting.value.showStartUserNodeConfig(currentNode.value);
   }
-};
+}
 </script>
 <template>
   <div class="node-wrapper">
@@ -116,4 +119,3 @@ const nodeClick = () => {
   />
   <!-- 审批记录  TODO -->
 </template>
-<style lang="scss" scoped></style>

apps/web-antd/src/components/simple-process-design/components/nodes/trigger-node.vue

@@ -22,10 +22,12 @@ const props = defineProps({
     required: true,
   },
 });
+
 // 定义事件，更新父组件
 const emits = defineEmits<{
   'update:flowNode': [node: SimpleFlowNode | undefined];
 }>();
+
 // 是否只读
 const readonly = inject<Boolean>('readonly');
 // 监控节点的变化
@@ -38,17 +40,17 @@ const { showInput, blurEvent, clickTitle } = useNodeName2(
 
 const nodeSetting = ref();
 // 打开节点配置
-const openNodeConfig = () => {
+function openNodeConfig() {
   if (readonly) {
     return;
   }
   nodeSetting.value.showTriggerNodeConfig(currentNode.value);
-};
+}
 
 // 删除节点。更新当前节点为孩子节点
-const deleteNode = () => {
+function deleteNode() {
   emits('update:flowNode', currentNode.value.childNode);
-};
+}
 </script>
 <template>
   <div class="node-wrapper">
@@ -115,4 +117,3 @@ const deleteNode = () => {
     />
   </div>
 </template>
-<style lang="scss" scoped></style>

apps/web-antd/src/components/simple-process-design/components/nodes/user-task-node.vue

@@ -22,6 +22,7 @@ const props = defineProps({
     required: true,
   },
 });
+
 const emits = defineEmits<{
   findParentNode: [nodeList: SimpleFlowNode[], nodeType: NodeType];
   'update:flowNode': [node: SimpleFlowNode | undefined];
@@ -39,7 +40,7 @@ const { showInput, blurEvent, clickTitle } = useNodeName2(
 );
 const nodeSetting = ref();
 
-const nodeClick = () => {
+function nodeClick() {
   if (readonly) {
     if (tasks && tasks.value) {
       // 只读模式，弹窗显示任务信息 TODO 待实现
@@ -49,18 +50,18 @@ const nodeClick = () => {
     // 编辑模式，打开节点配置、把当前节点传递给配置组件
     nodeSetting.value.showUserTaskNodeConfig(currentNode.value);
   }
-};
+}
 
-const deleteNode = () => {
+function deleteNode() {
   emits('update:flowNode', currentNode.value.childNode);
-};
+}
 // 查找可以驳回用户节点
-const findReturnTaskNodes = (
+function findReturnTaskNodes(
   matchNodeList: SimpleFlowNode[], // 匹配的节点
-) => {
+) {
   // 从父节点查找
   emits('findParentNode', matchNodeList, NodeType.USER_TASK_NODE);
-};
+}
 
 // const selectTasks = ref<any[] | undefined>([]); // 选中的任务数组
 </script>
@@ -135,4 +136,3 @@ const findReturnTaskNodes = (
   />
   <!--  TODO 审批记录 -->
 </template>
-<style lang="scss" scoped></style>

apps/web-antd/src/components/simple-process-design/components/process-node-tree.vue

@@ -15,6 +15,7 @@ import TriggerNode from './nodes/trigger-node.vue';
 import UserTaskNode from './nodes/user-task-node.vue';
 
 defineOptions({ name: 'ProcessNodeTree' });
+
 const props = defineProps({
   parentNode: {
     type: Object as () => SimpleFlowNode,
@@ -25,6 +26,7 @@ const props = defineProps({
     default: () => null,
   },
 });
+
 const emits = defineEmits<{
   recursiveFindParentNode: [
     nodeList: SimpleFlowNode[],
@@ -47,11 +49,11 @@ const findParentNode = (nodeList: SimpleFlowNode[], nodeType: number) => {
 };
 
 // 递归从父节点中查询匹配的节点
-const recursiveFindParentNode = (
+function recursiveFindParentNode(
   nodeList: SimpleFlowNode[],
   findNode: SimpleFlowNode,
   nodeType: number,
-) => {
+) {
   if (!findNode) {
     return;
   }
@@ -64,7 +66,7 @@ const recursiveFindParentNode = (
     nodeList.push(findNode);
   }
   emits('recursiveFindParentNode', nodeList, props.parentNode, nodeType);
-};
+}
 </script>
 <template>
   <!-- 发起人节点 -->
@@ -148,4 +150,3 @@ const recursiveFindParentNode = (
     :flow-node="currentNode"
   />
 </template>
-<style lang="scss" scoped></style>

apps/web-antd/src/components/simple-process-design/components/simple-process-designer.vue

@@ -120,7 +120,7 @@ const [ErrorModal, errorModalApi] = useVbenModal({
 });
 
 // 添加更新模型的方法
-const updateModel = () => {
+function updateModel() {
   if (!processNodeTree.value) {
     processNodeTree.value = {
       name: '发起人',
@@ -136,11 +136,11 @@ const updateModel = () => {
     // 初始化时也触发一次保存
     saveSimpleFlowModel(processNodeTree.value);
   }
-};
+}
 
-const saveSimpleFlowModel = async (
+async function saveSimpleFlowModel(
   simpleModelNode: SimpleFlowNode | undefined,
-) => {
+) {
   if (!simpleModelNode) {
     return;
   }
@@ -151,16 +151,15 @@ const saveSimpleFlowModel = async (
   } catch (error) {
     console.error('保存失败:', error);
   }
-};
+}
 
 /**
- * 校验节点设置。 暂时以 showText 为空 未节点错误配置
+ * 校验节点设置。 暂时以 showText 为空作为节点错误配置的判断条件
  */
-
+function validateNode(
-const validateNode = (
   node: SimpleFlowNode | undefined,
   errorNodes: SimpleFlowNode[],
-) => {
+) {
   if (node) {
     const { type, showText, conditionNodes } = node;
     if (type === NodeType.END_EVENT_NODE) {
@@ -185,7 +184,7 @@ const validateNode = (
       validateNode(node.childNode, errorNodes);
     }
   }
-};
+}
 
 onMounted(async () => {
   try {

apps/web-antd/src/components/simple-process-design/components/simple-process-model.vue

@@ -49,22 +49,22 @@ const currentY = ref(0);
 const initialX = ref(0);
 const initialY = ref(0);
 
-const setGrabCursor = () => {
+function setGrabCursor() {
   document.body.style.cursor = 'grab';
-};
+}
 
-const resetCursor = () => {
+function resetCursor() {
   document.body.style.cursor = 'default';
-};
+}
 
-const startDrag = (e: MouseEvent) => {
+function startDrag(e: MouseEvent) {
   isDragging.value = true;
   startX.value = e.clientX - currentX.value;
   startY.value = e.clientY - currentY.value;
   setGrabCursor(); // 设置小手光标
-};
+}
 
-const onDrag = (e: MouseEvent) => {
+function onDrag(e: MouseEvent) {
   if (!isDragging.value) return;
   e.preventDefault(); // 禁用文本选择
 
@@ -73,44 +73,44 @@ const onDrag = (e: MouseEvent) => {
     currentX.value = e.clientX - startX.value;
     currentY.value = e.clientY - startY.value;
   });
-};
+}
 
-const stopDrag = () => {
+function stopDrag() {
   isDragging.value = false;
   resetCursor(); // 重置光标
-};
+}
 
-const zoomIn = () => {
+function zoomIn() {
   if (scaleValue.value === MAX_SCALE_VALUE) {
     return;
   }
   scaleValue.value += 10;
-};
+}
 
-const zoomOut = () => {
+function zoomOut() {
   if (scaleValue.value === MIN_SCALE_VALUE) {
     return;
   }
   scaleValue.value -= 10;
-};
+}
 
-const processReZoom = () => {
+function processReZoom() {
   scaleValue.value = 100;
-};
+}
 
-const resetPosition = () => {
+function resetPosition() {
   currentX.value = initialX.value;
   currentY.value = initialY.value;
-};
+}
 
 /** 校验节点设置 */
 const errorDialogVisible = ref(false);
 let errorNodes: SimpleFlowNode[] = [];
 
-const validateNode = (
+function validateNode(
   node: SimpleFlowNode | undefined,
   errorNodes: SimpleFlowNode[],
-) => {
+) {
   if (node) {
     const { type, showText, conditionNodes } = node;
     if (type === NodeType.END_EVENT_NODE) {
@@ -146,10 +146,10 @@ const validateNode = (
       validateNode(node.childNode, errorNodes);
     }
   }
-};
+}
 
 /** 获取当前流程数据 */
-const getCurrentFlowData = async () => {
+async function getCurrentFlowData() {
   try {
     errorNodes = [];
     validateNode(processNodeTree.value, errorNodes);
@@ -162,26 +162,26 @@ const getCurrentFlowData = async () => {
     console.error('获取流程数据失败:', error);
     return undefined;
   }
-};
+}
 
 defineExpose({
   getCurrentFlowData,
 });
 
 /** 导出 JSON */
-const exportJson = () => {
+function exportJson() {
   downloadFileFromBlob({
     fileName: 'model.json',
     source: new Blob([JSON.stringify(processNodeTree.value)]),
   });
-};
+}
 
 /** 导入 JSON */
 const refFile = ref();
-const importJson = () => {
+function importJson() {
   refFile.value.click();
-};
+}
-const importLocalFile = () => {
+function importLocalFile() {
   const file = refFile.value.files[0];
   file.text().then((result: any) => {
     if (isString(result)) {
@@ -189,7 +189,7 @@ const importLocalFile = () => {
       emits('save', processNodeTree.value);
     }
   });
-};
+}
 
 // 在组件初始化时记录初始位置
 onMounted(() => {
@@ -267,4 +267,3 @@ onMounted(() => {
     </template>
   </Modal>
 </template>
-<style lang="scss" scoped></style>

apps/web-antd/src/components/simple-process-design/helpers.ts

@@ -43,7 +43,7 @@ export function useWatchNode(props: {
 }
 
 // 解析 formCreate 所有表单字段, 并返回
-const parseFormCreateFields = (formFields?: string[]) => {
+function parseFormCreateFields(formFields?: string[]) {
   const result: Array<Record<string, any>> = [];
   if (formFields) {
     formFields.forEach((fieldStr: string) => {
@@ -51,7 +51,7 @@ const parseFormCreateFields = (formFields?: string[]) => {
     });
   }
   return result;
-};
+}
 
 /**
  * 解析表单组件的  field, title 等字段（递归，如果组件包含子组件）
@@ -109,20 +109,20 @@ export function useFormFieldsPermission(
 
   const formFields = inject<Ref<string[]>>('formFields', ref([])); // 流程表单字段
 
-  const getNodeConfigFormFields = (
+  function getNodeConfigFormFields(
     nodeFormFields?: Array<Record<string, string>>,
-  ) => {
+  ) {
     nodeFormFields = toRaw(nodeFormFields);
     fieldsPermissionConfig.value =
       !nodeFormFields || nodeFormFields.length === 0
         ? getDefaultFieldsPermission(unref(formFields))
         : mergeFieldsPermission(nodeFormFields, unref(formFields));
-  };
+  }
   // 合并已经设置的表单字段权限，当前流程表单字段 (可能新增，或删除了字段)
-  const mergeFieldsPermission = (
+  function mergeFieldsPermission(
     formFieldsPermisson: Array<Record<string, string>>,
     formFields?: string[],
-  ) => {
+  ) {
     let mergedFieldsPermission: Array<Record<string, any>> = [];
     if (formFields) {
       mergedFieldsPermission = parseFormCreateFields(formFields).map((item) => {
@@ -137,10 +137,10 @@ export function useFormFieldsPermission(
       });
     }
     return mergedFieldsPermission;
-  };
+  }
 
   // 默认的表单权限： 获取表单的所有字段，设置字段默认权限为只读
-  const getDefaultFieldsPermission = (formFields?: string[]) => {
+  function getDefaultFieldsPermission(formFields?: string[]) {
     let defaultFieldsPermission: Array<Record<string, any>> = [];
     if (formFields) {
       defaultFieldsPermission = parseFormCreateFields(formFields).map(
@@ -154,7 +154,7 @@ export function useFormFieldsPermission(
       );
     }
     return defaultFieldsPermission;
-  };
+  }
 
   // 获取表单的所有字段，作为下拉框选项
   const formFieldOptions = parseFormCreateFields(unref(formFields));
@@ -268,7 +268,6 @@ export function useNodeForm(nodeType: NodeType) {
   const formFields = inject<Ref<string[]>>('formFields', ref([])); // 流程表单字段
   const configForm = ref<any | CopyTaskFormType | UserTaskFormType>();
 
-  // eslint-disable-next-line unicorn/prefer-ternary
   if (
     nodeType === NodeType.USER_TASK_NODE ||
     nodeType === NodeType.TRANSACTOR_NODE
@@ -286,13 +285,12 @@ export function useNodeForm(nodeType: NodeType) {
       maxRemindCount: 1, // 默认 提醒 1次
       buttonsSetting: [],
     };
-  } else {
-    configForm.value = {
-      candidateStrategy: CandidateStrategy.USER,
-    };
   }
+  configForm.value = {
+    candidateStrategy: CandidateStrategy.USER,
+  };
 
-  const getShowText = (): string => {
+  function getShowText(): string {
     let showText = '';
     // 指定成员
     if (
@@ -428,12 +426,12 @@ export function useNodeForm(nodeType: NodeType) {
       showText = `流程表达式：${configForm.value.expression}`;
     }
     return showText;
-  };
+  }
 
   /**
    *  处理候选人参数的赋值
    */
-  const handleCandidateParam = () => {
+  function handleCandidateParam() {
     let candidateParam: string | undefined;
     if (!configForm.value) {
       return candidateParam;
@@ -495,14 +493,14 @@ export function useNodeForm(nodeType: NodeType) {
       }
     }
     return candidateParam;
-  };
+  }
   /**
    *  解析候选人参数
    */
-  const parseCandidateParam = (
+  function parseCandidateParam(
     candidateStrategy: CandidateStrategy,
     candidateParam: string | undefined,
-  ) => {
+  ) {
     if (!configForm.value || !candidateParam) {
       return;
     }
@@ -578,7 +576,7 @@ export function useNodeForm(nodeType: NodeType) {
         break;
       }
     }
-  };
+  }
   return {
     configForm,
     roleOptions,
@@ -599,13 +597,13 @@ export function useDrawer() {
   // 抽屉配置是否可见
   const settingVisible = ref(false);
   // 关闭配置抽屉
-  const closeDrawer = () => {
+  function closeDrawer() {
     settingVisible.value = false;
-  };
+  }
   // 打开配置抽屉
-  const openDrawer = () => {
+  function openDrawer() {
     settingVisible.value = true;
-  };
+  }
   return {
     settingVisible,
     closeDrawer,
@@ -622,15 +620,15 @@ export function useNodeName(nodeType: NodeType) {
   // 节点名称输入框
   const showInput = ref(false);
   // 点击节点名称编辑图标
-  const clickIcon = () => {
+  function clickIcon() {
     showInput.value = true;
-  };
+  }
   // 节点名称输入框失去焦点
-  const blurEvent = () => {
+  function blurEvent() {
     showInput.value = false;
     nodeName.value =
       nodeName.value || (NODE_DEFAULT_NAME.get(nodeType) as string);
-  };
+  }
   return {
     nodeName,
     showInput,
@@ -643,15 +641,15 @@ export function useNodeName2(node: Ref<SimpleFlowNode>, nodeType: NodeType) {
   // 显示节点名称输入框
   const showInput = ref(false);
   // 节点名称输入框失去焦点
-  const blurEvent = () => {
+  function blurEvent() {
     showInput.value = false;
     node.value.name =
       node.value.name || (NODE_DEFAULT_NAME.get(nodeType) as string);
-  };
+  }
   // 点击节点标题进行输入
-  const clickTitle = () => {
+  function clickTitle() {
     showInput.value = true;
-  };
+  }
   return {
     showInput,
     clickTitle,
@@ -722,40 +720,40 @@ export function getConditionShowText(
 }
 
 /** 获取表单字段名称*/
-const getFormFieldTitle = (
+function getFormFieldTitle(
   fieldOptions: Array<Record<string, any>>,
   field: string,
-) => {
+) {
   const item = fieldOptions.find((item) => item.field === field);
   return item?.title;
-};
+}
 
 /** 获取操作符名称 */
-const getOpName = (opCode: string): string | undefined => {
+function getOpName(opCode: string): string | undefined {
   const opName = COMPARISON_OPERATORS.find(
     (item: any) => item.value === opCode,
   );
   return opName?.label;
-};
+}
 
 /** 获取条件节点默认的名称 */
-export const getDefaultConditionNodeName = (
+export function getDefaultConditionNodeName(
   index: number,
   defaultFlow: boolean | undefined,
-): string => {
+): string {
   if (defaultFlow) {
     return '其它情况';
   }
   return `条件${index + 1}`;
-};
+}
 
 /** 获取包容分支条件节点默认的名称 */
-export const getDefaultInclusiveConditionNodeName = (
+export function getDefaultInclusiveConditionNodeName(
   index: number,
   defaultFlow: boolean | undefined,
-): string => {
+): string {
   if (defaultFlow) {
     return '其它情况';
   }
   return `包容条件${index + 1}`;
-};
+}

apps/web-antd/src/views/bpm/model/form/modules/simple-model-design.vue

@@ -42,4 +42,3 @@ defineExpose({ validateConfig });
     />
   </ContentWrap>
 </template>
-<style lang="scss" scoped></style>

apps/web-antd/src/views/bpm/processInstance/detail/modules/operation-button.vue

@@ -1389,4 +1389,3 @@ defineExpose({ loadTodoTask });
   <!-- 签名弹窗 -->
   <Signature ref="signRef" @success="handleSignFinish" />
 </template>
-<style lang="scss" scoped></style>

apps/web-antd/src/views/crm/business/modules/detail-info.vue

@@ -1,7 +1,4 @@
 <script lang="ts" setup></script>
-
 <template>
-  <div>
+  <div>businessInfo</div>
-    <p>待完成</p>
-  </div>
 </template>

apps/web-antd/src/views/crm/business/modules/detail-list.vue

@@ -0,0 +1,4 @@
+<script lang="ts" setup></script>
+<template>
+  <div>businessList</div>
+</template>

apps/web-antd/src/views/crm/clue/modules/detail.vue

@@ -5,16 +5,18 @@ import { defineAsyncComponent, onMounted, ref } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 
 import { Page, useVbenModal } from '@vben/common-ui';
+import { useTabs } from '@vben/hooks';
 import { ArrowLeft } from '@vben/icons';
 
 import { Button, Card, Modal, Tabs } from 'ant-design-vue';
 
 import { getClue, transformClue } from '#/api/crm/clue';
+import { BizTypeEnum } from '#/api/crm/permission';
 import { useDescription } from '#/components/description';
+import { PermissionList, TransferForm } from '#/views/crm/permission';
 
 import { useDetailSchema } from '../data';
 import ClueForm from './form.vue';
-import TransferForm from './transfer.vue';
 
 const ClueDetailsInfo = defineAsyncComponent(() => import('./detail-info.vue'));
 
@@ -22,6 +24,7 @@ const loading = ref(false);
 
 const route = useRoute();
 const router = useRouter();
+const tabs = useTabs();
 
 const clueId = ref(0);
 
@@ -58,6 +61,7 @@ async function loadClueDetail() {
 
 /** 返回列表页 */
 function handleBack() {
+  tabs.closeCurrentTab();
   router.push('/crm/clue');
 }
 
@@ -68,7 +72,7 @@ function handleEdit() {
 
 /** 转移线索 */
 function handleTransfer() {
-  transferModalApi.setData({ id: clueId }).open();
+  transferModalApi.setData({ bizType: BizTypeEnum.CRM_CLUE }).open();
 }
 
 /** 转化为客户 */
@@ -141,7 +145,13 @@ onMounted(async () => {
           <ClueDetailsInfo :clue="clue" />
         </Tabs.TabPane>
         <Tabs.TabPane tab="团队成员" key="3">
-          <div>团队成员</div>
+          <PermissionList
+            ref="permissionListRef"
+            :biz-id="clue.id!"
+            :biz-type="BizTypeEnum.CRM_CLUE"
+            :show-action="true"
+            @quit-team="handleBack"
+          />
         </Tabs.TabPane>
         <Tabs.TabPane tab="操作日志" key="4">
           <div>操作日志</div>

apps/web-antd/src/views/crm/contact/modules/detail-info.vue

@@ -0,0 +1,4 @@
+<script lang="ts" setup></script>
+<template>
+  <div>contactInfo</div>
+</template>

apps/web-antd/src/views/crm/contact/modules/detail-list.vue

@@ -0,0 +1,4 @@
+<script lang="ts" setup></script>
+<template>
+  <div>contactList</div>
+</template>

apps/web-antd/src/views/crm/contract/data.ts

@@ -146,73 +146,73 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       title: '合同编号',
       field: 'no',
-      width: 150,
+      minWidth: 150,
       fixed: 'left',
     },
     {
       title: '合同名称',
       field: 'name',
-      width: 150,
+      minWidth: 150,
       fixed: 'left',
       slots: { default: 'name' },
     },
     {
       title: '客户名称',
       field: 'customerName',
-      width: 150,
+      minWidth: 150,
       slots: { default: 'customerName' },
     },
     {
       title: '商机名称',
       field: 'businessName',
-      width: 150,
+      minWidth: 150,
       slots: { default: 'businessName' },
     },
     {
       title: '合同金额（元）',
       field: 'totalPrice',
-      width: 150,
+      minWidth: 150,
       formatter: 'formatNumber',
     },
     {
       title: '下单时间',
       field: 'orderDate',
-      width: 150,
+      minWidth: 150,
       formatter: 'formatDateTime',
     },
     {
       title: '合同开始时间',
       field: 'startTime',
-      width: 150,
+      minWidth: 150,
       formatter: 'formatDateTime',
     },
     {
       title: '合同结束时间',
       field: 'endTime',
-      width: 150,
+      minWidth: 150,
       formatter: 'formatDateTime',
     },
     {
       title: '客户签约人',
       field: 'signContactName',
-      width: 150,
+      minWidth: 150,
       slots: { default: 'signContactName' },
     },
     {
       title: '公司签约人',
       field: 'signUserName',
-      width: 150,
+      minWidth: 150,
     },
     {
       title: '已回款金额（元）',
       field: 'totalReceivablePrice',
-      width: 150,
+      minWidth: 150,
       formatter: 'formatNumber',
     },
     {
       title: '未回款金额（元）',
       field: 'unpaidPrice',
-      width: 150,
+      minWidth: 150,
       formatter: ({ row }) => {
         return floatToFixed2(row.totalPrice - row.totalReceivablePrice);
       },
@@ -220,46 +220,46 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       title: '最后跟进时间',
       field: 'contactLastTime',
-      width: 150,
+      minWidth: 150,
       formatter: 'formatDateTime',
     },
     {
       title: '负责人',
       field: 'ownerUserName',
-      width: 150,
+      minWidth: 150,
     },
     {
       title: '所属部门',
       field: 'ownerUserDeptName',
-      width: 150,
+      minWidth: 150,
     },
     {
       title: '更新时间',
       field: 'updateTime',
-      width: 150,
+      minWidth: 150,
       formatter: 'formatDateTime',
     },
     {
       title: '创建时间',
       field: 'createTime',
-      width: 150,
+      minWidth: 150,
       formatter: 'formatDateTime',
     },
     {
       title: '创建人',
       field: 'creatorName',
-      width: 150,
+      minWidth: 150,
     },
     {
       title: '备注',
       field: 'remark',
-      width: 150,
+      minWidth: 150,
     },
     {
       title: '合同状态',
       field: 'auditStatus',
       fixed: 'right',
-      width: 100,
+      minWidth: 100,
       cellRender: {
         name: 'CellDict',
         props: { type: DICT_TYPE.CRM_AUDIT_STATUS },

apps/web-antd/src/views/crm/contract/modules/detail-info.vue

@@ -0,0 +1,4 @@
+<script lang="ts" setup></script>
+<template>
+  <div>contractInfo</div>
+</template>

apps/web-antd/src/views/crm/contract/modules/detail-list.vue

@@ -0,0 +1,4 @@
+<script lang="ts" setup></script>
+<template>
+  <div>contractList</div>
+</template>

apps/web-antd/src/views/crm/customer/modules/detail-info.vue

@@ -1,7 +1,5 @@
 <script lang="ts" setup></script>
 
 <template>
-  <div>
+  <div>detail-info</div>
-    <p>待完成</p>
-  </div>
 </template>

apps/web-antd/src/views/crm/customer/modules/detail-list.vue

@@ -0,0 +1,4 @@
+<script lang="ts" setup></script>
+<template>
+  <div>customerList</div>
+</template>

apps/web-antd/src/views/crm/customer/modules/detail.vue

@@ -1,7 +1,209 @@
-<script lang="ts" setup></script>
+<script setup lang="ts">
+import type { CrmCustomerApi } from '#/api/crm/customer';
+import type { SystemOperateLogApi } from '#/api/system/operate-log';
+
+import { defineAsyncComponent, onMounted, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+
+import { Page } from '@vben/common-ui';
+
+import { Button, Card, Modal, Tabs } from 'ant-design-vue';
+
+import { getCustomer, updateCustomerDealStatus } from '#/api/crm/customer';
+import { getOperateLogPage } from '#/api/crm/operateLog';
+import { BizTypeEnum } from '#/api/crm/permission';
+import { useDescription } from '#/components/description';
+import { OperateLog } from '#/components/operate-log';
+
+import { useDetailSchema } from '../data';
+
+const CustomerDetailsInfo = defineAsyncComponent(
+  () => import('./detail-info.vue'),
+);
+
+const loading = ref(false);
+
+const route = useRoute();
+const router = useRouter();
+
+const customerId = ref(0);
+
+const customer = ref<CrmCustomerApi.Customer>({} as CrmCustomerApi.Customer);
+const permissionListRef = ref(); // 团队成员列表 Ref
+
+const [Description] = useDescription({
+  componentProps: {
+    bordered: false,
+    column: 4,
+    class: 'mx-4',
+  },
+  schema: useDetailSchema(),
+});
+
+/** 加载详情 */
+async function loadCustomerDetail() {
+  loading.value = true;
+  customerId.value = Number(route.params.id);
+  const data = await getCustomer(customerId.value);
+  await getOperateLog();
+  customer.value = data;
+  loading.value = false;
+}
+
+/** 编辑 */
+function handleEdit() {
+  // formModalApi.setData({ id: clueId }).open();
+}
+
+/** 转移线索 */
+function handleTransfer() {
+  // transferModalApi.setData({ id: clueId }).open();
+}
+
+/** 锁定客户 */
+function handleLock() {
+  // transferModalApi.setData({ id: clueId }).open();
+}
+
+/** 解锁客户 */
+function handleUnlock() {
+  // transferModalApi.setData({ id: clueId }).open();
+}
+
+/** 领取客户 */
+function handleReceive() {
+  // transferModalApi.setData({ id: clueId }).open();
+}
+
+/** 分配客户 */
+function handleDistributeForm() {
+  // transferModalApi.setData({ id: clueId }).open();
+}
+
+/** 客户放入公海 */
+function handlePutPool() {
+  // transferModalApi.setData({ id: clueId }).open();
+}
+
+/** 更新成交状态操作 */
+async function handleUpdateDealStatus() {
+  const dealStatus = !customer.value.dealStatus;
+  try {
+    await Modal.confirm({
+      title: '提示',
+      content: `确定更新成交状态为【${dealStatus ? '已成交' : '未成交'}】吗？`,
+    });
+    await updateCustomerDealStatus(customerId.value, dealStatus);
+    Modal.success({
+      title: '成功',
+      content: '更新成交状态成功',
+    });
+    await loadCustomerDetail();
+  } catch {
+    // 用户取消操作
+  }
+}
+
+/** 获取操作日志 */
+const logList = ref<SystemOperateLogApi.OperateLog[]>([]); // 操作日志列表
+async function getOperateLog() {
+  if (!customerId.value) {
+    return;
+  }
+  const data = await getOperateLogPage({
+    bizType: BizTypeEnum.CRM_CUSTOMER,
+    bizId: customerId.value,
+  });
+  logList.value = data.list;
+}
+
+// 加载数据
+onMounted(async () => {
+  await loadCustomerDetail();
+});
+</script>
 
 <template>
-  <div>
+  <Page auto-content-height :title="customer?.name" :loading="loading">
-    <p>待完成</p>
+    <template #extra>
-  </div>
+      <div class="flex items-center gap-2">
+        <Button
+          v-if="permissionListRef?.validateWrite"
+          type="primary"
+          @click="handleEdit"
+          v-access:code="['crm:customer:update']"
+        >
+          {{ $t('ui.actionTitle.edit') }}
+        </Button>
+        <Button
+          v-if="permissionListRef?.validateOwnerUser"
+          type="primary"
+          @click="handleTransfer"
+        >
+          转移
+        </Button>
+        <Button
+          v-if="permissionListRef?.validateWrite"
+          @click="handleUpdateDealStatus"
+        >
+          更改成交状态
+        </Button>
+        <Button
+          v-if="customer.lockStatus && permissionListRef?.validateOwnerUser"
+          @click="handleUnlock"
+        >
+          解锁
+        </Button>
+        <Button
+          v-if="!customer.lockStatus && permissionListRef?.validateOwnerUser"
+          @click="handleLock"
+        >
+          锁定
+        </Button>
+        <Button v-if="!customer.ownerUserId" @click="handleReceive">
+          领取
+        </Button>
+        <Button v-if="!customer.ownerUserId" @click="handleDistributeForm">
+          分配
+        </Button>
+        <Button
+          v-if="customer.ownerUserId && permissionListRef?.validateOwnerUser"
+          @click="handlePutPool"
+        >
+          放入公海
+        </Button>
+      </div>
+    </template>
+    <Card>
+      <Description :data="customer" />
+    </Card>
+    <Card class="mt-4">
+      <Tabs>
+        <Tabs.TabPane tab="跟进记录" key="1">
+          <div>跟进记录</div>
+        </Tabs.TabPane>
+        <Tabs.TabPane tab="基本信息" key="2">
+          <CustomerDetailsInfo />
+        </Tabs.TabPane>
+        <Tabs.TabPane tab="联系人" key="3">
+          <div>联系人</div>
+        </Tabs.TabPane>
+        <Tabs.TabPane tab="团队成员" key="4">
+          <div>团队成员</div>
+        </Tabs.TabPane>
+        <Tabs.TabPane tab="商机" key="5">
+          <div>商机</div>
+        </Tabs.TabPane>
+        <Tabs.TabPane tab="合同" key="6">
+          <div>合同</div>
+        </Tabs.TabPane>
+        <Tabs.TabPane tab="回款" key="7">
+          <div>回款</div>
+        </Tabs.TabPane>
+        <Tabs.TabPane tab="操作日志" key="8">
+          <OperateLog :log-list="logList" />
+        </Tabs.TabPane>
+      </Tabs>
+    </Card>
+  </Page>
 </template>

apps/web-antd/src/views/crm/customer/pool/data.ts

@@ -57,14 +57,14 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       title: '客户名称',
       field: 'name',
-      width: 160,
+      minWidth: 160,
       fixed: 'left',
       slots: { default: 'name' },
     },
     {
       title: '客户来源',
       field: 'source',
-      width: 100,
+      minWidth: 100,
       cellRender: {
         name: 'CellDict',
         props: { type: DICT_TYPE.CRM_CUSTOMER_SOURCE },
@@ -73,22 +73,22 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       title: '手机',
       field: 'mobile',
-      width: 120,
+      minWidth: 120,
     },
     {
       title: '电话',
       field: 'telephone',
-      width: 120,
+      minWidth: 120,
     },
     {
       title: '邮箱',
       field: 'email',
-      width: 140,
+      minWidth: 140,
     },
     {
       title: '客户级别',
       field: 'level',
-      width: 135,
+      minWidth: 135,
       cellRender: {
         name: 'CellDict',
         props: { type: DICT_TYPE.CRM_CUSTOMER_LEVEL },
@@ -97,7 +97,7 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       title: '客户行业',
       field: 'industryId',
-      width: 100,
+      minWidth: 100,
       cellRender: {
         name: 'CellDict',
         props: { type: DICT_TYPE.CRM_CUSTOMER_INDUSTRY },
@@ -106,18 +106,18 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       title: '下次联系时间',
       field: 'contactNextTime',
-      width: 180,
+      minWidth: 180,
       formatter: 'formatDateTime',
     },
     {
       title: '备注',
       field: 'remark',
-      width: 200,
+      minWidth: 200,
     },
     {
       title: '成交状态',
       field: 'dealStatus',
-      width: 80,
+      minWidth: 80,
       cellRender: {
         name: 'CellDict',
         props: { type: DICT_TYPE.INFRA_BOOLEAN_STRING },
@@ -126,30 +126,30 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       title: '最后跟进时间',
       field: 'contactLastTime',
-      width: 180,
+      minWidth: 180,
       formatter: 'formatDateTime',
     },
     {
       title: '最后跟进记录',
       field: 'contactLastContent',
-      width: 200,
+      minWidth: 200,
     },
     {
       title: '更新时间',
       field: 'updateTime',
-      width: 180,
+      minWidth: 180,
       formatter: 'formatDateTime',
     },
     {
       title: '创建时间',
       field: 'createTime',
-      width: 180,
+      minWidth: 180,
       formatter: 'formatDateTime',
     },
     {
       title: '创建人',
       field: 'creatorName',
-      width: 100,
+      minWidth: 100,
     },
   ];
 }

apps/web-antd/src/views/crm/followup/index.vue

@@ -0,0 +1,205 @@
+<script lang="ts" setup>
+import type { FollowUpRecordApi, FollowUpRecordVO } from '@/api/crm/followup';
+
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+
+import { useRouter } from 'vue-router';
+
+import { Page, useVbenModal } from '@vben/common-ui';
+
+import { BizTypeEnum } from '@/api/crm/permission';
+import { DICT_TYPE } from '@/utils/dict';
+import { Button, message } from 'ant-design-vue';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { $t } from '#/locales';
+
+import FollowUpRecordForm from './modules/form.vue';
+
+/** 跟进记录列表 */
+defineOptions({ name: 'FollowUpRecord' });
+
+const props = defineProps<{
+  bizId: number;
+  bizType: number;
+}>();
+
+const { push } = useRouter();
+
+/** 刷新表格 */
+function onRefresh() {
+  gridApi.query();
+}
+
+/** 添加跟进记录 */
+function handleCreate() {
+  formModalApi.setData(null).open();
+}
+
+/** 删除跟进记录 */
+async function handleDelete(row: FollowUpRecordVO) {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting', [row.id]),
+    key: 'action_key_msg',
+  });
+  try {
+    await FollowUpRecordApi.deleteFollowUpRecord(row.id);
+    message.success({
+      content: $t('ui.actionMessage.deleteSuccess', [row.id]),
+      key: 'action_key_msg',
+    });
+    onRefresh();
+  } catch {
+    hideLoading();
+  }
+}
+
+/** 打开联系人详情 */
+function openContactDetail(id: number) {
+  push({ name: 'CrmContactDetail', params: { id } });
+}
+
+/** 打开商机详情 */
+function openBusinessDetail(id: number) {
+  push({ name: 'CrmBusinessDetail', params: { id } });
+}
+
+const [FormModal, formModalApi] = useVbenModal({
+  connectedComponent: FollowUpRecordForm,
+  destroyOnClose: true,
+});
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    columns: [
+      {
+        field: 'createTime',
+        title: '创建时间',
+        width: 180,
+        formatter: 'formatDateTime',
+      },
+      { field: 'creatorName', title: '跟进人' },
+      {
+        field: 'type',
+        title: '跟进类型',
+        cellRender: {
+          name: 'CellDict',
+          props: { type: DICT_TYPE.CRM_FOLLOW_UP_TYPE },
+        },
+      },
+      { field: 'content', title: '跟进内容' },
+      {
+        field: 'nextTime',
+        title: '下次联系时间',
+        width: 180,
+        formatter: 'formatDateTime',
+      },
+      {
+        field: 'contacts',
+        title: '关联联系人',
+        visible: props.bizType === BizTypeEnum.CRM_CUSTOMER,
+        slots: {
+          default: ({ row }) =>
+            row.contacts?.map((contact) =>
+              h(
+                Button,
+                {
+                  type: 'link',
+                  onClick: () => openContactDetail(contact.id),
+                },
+                () => contact.name,
+              ),
+            ),
+        },
+      },
+      {
+        field: 'businesses',
+        title: '关联商机',
+        visible: props.bizType === BizTypeEnum.CRM_CUSTOMER,
+        slots: {
+          default: ({ row }) =>
+            row.businesses?.map((business) =>
+              h(
+                Button,
+                {
+                  type: 'link',
+                  onClick: () => openBusinessDetail(business.id),
+                },
+                () => business.name,
+              ),
+            ),
+        },
+      },
+      {
+        field: 'actions',
+        title: '操作',
+        width: 100,
+        slots: { default: 'actions' },
+      },
+    ],
+    height: 'auto',
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }) => {
+          return await FollowUpRecordApi.getFollowUpRecordPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            bizType: props.bizType,
+            bizId: props.bizId,
+          });
+        },
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+    },
+    toolbarConfig: {
+      refresh: { code: 'query' },
+    },
+  } as VxeTableGridOptions<FollowUpRecordVO>,
+});
+
+watch(
+  () => props.bizId,
+  () => {
+    gridApi.query();
+  },
+);
+</script>
+
+<template>
+  <Page auto-content-height>
+    <Grid table-title="跟进记录列表">
+      <template #toolbar-tools>
+        <TableAction
+          :actions="[
+            {
+              label: '写跟进',
+              type: 'primary',
+              icon: ACTION_ICON.EDIT,
+              onClick: handleCreate,
+            },
+          ]"
+        />
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: $t('common.delete'),
+              type: 'link',
+              danger: true,
+              icon: ACTION_ICON.DELETE,
+              popConfirm: {
+                title: $t('ui.actionMessage.deleteConfirm', [row.name]),
+                confirm: handleDelete.bind(null, row),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+    <FormModal @success="onRefresh" />
+  </Page>
+</template>

apps/web-antd/src/views/crm/followup/modules/form.vue

@@ -0,0 +1,87 @@
+<script lang="ts" setup>
+import type { CrmFollowUpRecordApi } from '#/api/crm/followup';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { message } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import {
+  createFollowUpRecord,
+  getFollowUpRecord,
+  updateFollowUpRecord,
+} from '#/api/crm/followup';
+import { $t } from '#/locales';
+
+const emit = defineEmits(['success']);
+const formData = ref<CrmFollowUpRecordApi.FollowUpRecord>();
+const getTitle = computed(() => {
+  return formData.value?.id
+    ? $t('ui.actionTitle.edit', ['跟进记录'])
+    : $t('ui.actionTitle.create', ['跟进记录']);
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 120,
+  },
+  layout: 'horizontal',
+  schema: [],
+  showDefaultActions: false,
+});
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data =
+      (await formApi.getValues()) as CrmFollowUpRecordApi.FollowUpRecord;
+    try {
+      await (formData.value?.id
+        ? updateFollowUpRecord(data)
+        : createFollowUpRecord(data));
+      // 关闭并提示
+      await modalApi.close();
+      emit('success');
+      message.success($t('ui.actionMessage.operationSuccess'));
+    } finally {
+      modalApi.unlock();
+    }
+  },
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      formData.value = undefined;
+      return;
+    }
+    // 加载数据
+    const data = modalApi.getData<CrmFollowUpRecordApi.FollowUpRecord>();
+    if (!data || !data.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getFollowUpRecord(data.id as number);
+      // 设置到 values
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal :title="getTitle" class="w-[40%]">
+    <Form class="mx-4" />
+  </Modal>
+</template>

apps/web-antd/src/views/crm/permission/components/PermissionList.vue

@@ -1,15 +0,0 @@
-<script lang="ts" setup>
-defineOptions({ name: 'CrmPermissionList' });
-
-defineProps<{
-  bizId: number | undefined; // 模块数据编号
-  bizType: number; // 模块类型
-  showAction: boolean; // 是否展示操作按钮
-}>();
-</script>
-
-<template>
-  <div>
-    <p>待完成</p>
-  </div>
-</template>

apps/web-antd/src/views/crm/permission/index.ts

@@ -0,0 +1,2 @@
+export { default as PermissionList } from './modules/permission-list.vue';
+export { default as TransferForm } from './modules/transfer-form.vue';

apps/web-antd/src/views/crm/permission/modules/permission-form.vue

@@ -0,0 +1,163 @@
+<script lang="ts" setup>
+import type { CrmPermissionApi } from '#/api/crm/permission';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { message } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import {
+  BizTypeEnum,
+  createPermission,
+  PermissionLevelEnum,
+  updatePermission,
+} from '#/api/crm/permission';
+import { getSimpleUserList } from '#/api/system/user';
+import { $t } from '#/locales';
+import { DICT_TYPE, getDictOptions } from '#/utils';
+
+const emit = defineEmits(['success']);
+const formData = ref<CrmPermissionApi.Permission>();
+const getTitle = computed(() => {
+  return formData.value?.ids
+    ? $t('ui.actionTitle.edit', ['团队成员'])
+    : $t('ui.actionTitle.create', ['团队成员']);
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 80,
+  },
+  layout: 'horizontal',
+  schema: [
+    {
+      fieldName: 'ids',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'userId',
+      label: '选择人员',
+      component: 'ApiSelect',
+      componentProps: {
+        api: getSimpleUserList,
+        labelField: 'nickname',
+        valueField: 'id',
+      },
+      dependencies: {
+        triggerFields: ['ids'],
+        show: (values) => {
+          return values.ids === undefined;
+        },
+      },
+    },
+    {
+      fieldName: 'level',
+      label: '权限级别',
+      component: 'RadioGroup',
+      componentProps: {
+        options: getDictOptions(
+          DICT_TYPE.CRM_PERMISSION_LEVEL,
+          'number',
+        ).filter((dict) => dict.value !== PermissionLevelEnum.OWNER),
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'toBizTypes',
+      label: '同时添加至',
+      component: 'CheckboxGroup',
+      componentProps: {
+        options: [
+          {
+            label: '联系人',
+            value: BizTypeEnum.CRM_CONTACT,
+          },
+          {
+            label: '商机',
+            value: BizTypeEnum.CRM_BUSINESS,
+          },
+          {
+            label: '合同',
+            value: BizTypeEnum.CRM_CONTRACT,
+          },
+        ],
+      },
+      dependencies: {
+        triggerFields: ['ids', 'bizType'],
+        show: (values) => {
+          return (
+            values.ids === undefined &&
+            formData.value?.bizType === BizTypeEnum.CRM_CUSTOMER
+          );
+        },
+      },
+    },
+  ],
+  showDefaultActions: false,
+});
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    let data = (await formApi.getValues()) as CrmPermissionApi.Permission;
+    data = Object.assign(data, formData.value);
+    try {
+      await (formData.value?.ids
+        ? updatePermission(data)
+        : createPermission(data));
+      // 关闭并提示
+      await modalApi.close();
+      emit('success');
+      message.success($t('ui.actionMessage.operationSuccess'));
+    } finally {
+      modalApi.unlock();
+    }
+  },
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      formData.value = undefined;
+      return;
+    }
+    // 加载数据
+    const data = modalApi.getData();
+    if (!data || !data.bizType || !data.bizId) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = {
+        ids: data.ids || [data.id] || undefined,
+        userId: undefined,
+        bizType: data.bizType,
+        bizId: data.bizId,
+        level: data.level,
+      };
+      // 设置到 values
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal class="w-[600px]" :title="getTitle">
+    <Form class="mx-4" />
+  </Modal>
+</template>

apps/web-antd/src/views/crm/permission/modules/permission-list.vue

@@ -0,0 +1,288 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { CrmPermissionApi } from '#/api/crm/permission';
+
+import { ref, watch } from 'vue';
+
+import { confirm, useVbenModal } from '@vben/common-ui';
+import { useUserStore } from '@vben/stores';
+
+import { message } from 'ant-design-vue';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  deletePermissionBatch,
+  deleteSelfPermission,
+  getPermissionList,
+  PermissionLevelEnum,
+} from '#/api/crm/permission';
+import { $t } from '#/locales';
+import { DICT_TYPE } from '#/utils';
+
+import Form from './permission-form.vue';
+
+defineOptions({ name: 'CrmPermissionList' });
+
+const props = defineProps<{
+  bizId: number; // 模块数据编号
+  bizType: number; // 模块类型
+  showAction: boolean; // 是否展示操作按钮
+}>();
+
+const emits = defineEmits<{
+  (e: 'quitTeam'): void;
+}>();
+
+const gridData = ref<CrmPermissionApi.Permission[]>([]);
+
+const [FormModal, formModalApi] = useVbenModal({
+  connectedComponent: Form,
+  destroyOnClose: true,
+});
+
+// 校验负责人权限和编辑权限
+const validateOwnerUser = ref(false);
+const validateWrite = ref(false);
+const isPool = ref(false);
+
+/** 刷新表格 */
+function onRefresh() {
+  gridApi.query();
+}
+
+const checkedIds = ref<CrmPermissionApi.Permission[]>([]);
+function setCheckedIds({
+  records,
+}: {
+  records: CrmPermissionApi.Permission[];
+}) {
+  checkedIds.value = records;
+}
+
+function handleCreate() {
+  formModalApi
+    .setData({
+      bizType: props.bizType,
+      bizId: props.bizId,
+    })
+    .open();
+}
+
+function handleEdit() {
+  if (checkedIds.value.length === 0) {
+    message.error('请先选择团队成员后操作！');
+    return;
+  }
+  if (checkedIds.value.length > 1) {
+    message.error('只能选择一个团队成员进行编辑！');
+    return;
+  }
+  formModalApi
+    .setData({
+      bizType: props.bizType,
+      bizId: props.bizId,
+      id: checkedIds.value[0]?.id,
+      level: checkedIds.value[0]?.level,
+    })
+    .open();
+}
+
+function handleDelete() {
+  if (checkedIds.value.length === 0) {
+    message.error('请先选择团队成员后操作！');
+    return;
+  }
+  return new Promise((resolve, reject) => {
+    confirm({
+      content: `你要将${checkedIds.value.map((item) => item.nickname).join(',')}移出团队吗？`,
+    })
+      .then(async () => {
+        // 更新用户状态
+        const res = await deletePermissionBatch(
+          checkedIds.value.map((item) => item.id as number),
+        );
+        if (res) {
+          // 提示并返回成功
+          message.success($t('ui.actionMessage.operationSuccess'));
+          resolve(true);
+        } else {
+          reject(new Error('移出失败'));
+        }
+      })
+      .catch(() => {
+        reject(new Error('取消操作'));
+      });
+  });
+}
+
+const userStore = useUserStore();
+
+async function handleQuit() {
+  const permission = gridApi.grid
+    .getData()
+    .find(
+      (item) =>
+        item.id === userStore.userInfo?.id &&
+        item.level === PermissionLevelEnum.OWNER,
+    );
+  if (permission) {
+    message.warning('负责人不能退出团队！');
+    return;
+  }
+
+  const userPermission = gridApi.grid
+    .getData()
+    .find((item) => item.id === userStore.userInfo?.id);
+  if (!userPermission) {
+    message.warning('你不是团队成员！');
+    return;
+  }
+  await deleteSelfPermission(userPermission.id);
+  message.success('退出团队成员成功！');
+  emits('quitTeam');
+}
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    columns: [
+      {
+        type: 'checkbox',
+        width: 50,
+      },
+      {
+        field: 'nickname',
+        title: '姓名',
+      },
+      {
+        field: 'deptName',
+        title: '部门',
+      },
+      {
+        field: 'postNames',
+        title: '岗位',
+      },
+      {
+        field: 'level',
+        title: '权限级别',
+        cellRender: {
+          name: 'CellDict',
+          props: { type: DICT_TYPE.CRM_PERMISSION_LEVEL },
+        },
+      },
+      {
+        field: 'createTime',
+        title: '加入时间',
+        formatter: 'formatDateTime',
+      },
+    ],
+    height: 'auto',
+    pagerConfig: {
+      enabled: false,
+    },
+    proxyConfig: {
+      ajax: {
+        query: async (_params) => {
+          const res = await getPermissionList({
+            bizId: props.bizId,
+            bizType: props.bizType,
+          });
+          gridData.value = res;
+          return res;
+        },
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: { code: 'query' },
+      search: true,
+    },
+  } as VxeTableGridOptions<CrmPermissionApi.Permission>,
+  gridEvents: {
+    checkboxAll: setCheckedIds,
+    checkboxChange: setCheckedIds,
+  },
+});
+
+defineExpose({
+  openForm: handleCreate,
+  validateOwnerUser,
+  validateWrite,
+  isPool,
+});
+
+watch(
+  () => gridData.value,
+  (data) => {
+    isPool.value = false;
+    if (data.length > 0) {
+      isPool.value = data.some(
+        (item) => item.level === PermissionLevelEnum.OWNER,
+      );
+      validateOwnerUser.value = false;
+      validateWrite.value = false;
+      const userId = userStore.userInfo?.id;
+      gridData.value
+        .filter((item) => item.userId === userId)
+        .forEach((item) => {
+          if (item.level === PermissionLevelEnum.OWNER) {
+            validateOwnerUser.value = true;
+            validateWrite.value = true;
+          } else if (item.level === PermissionLevelEnum.WRITE) {
+            validateWrite.value = true;
+          }
+        });
+    } else {
+      isPool.value = true;
+    }
+  },
+  {
+    immediate: true,
+  },
+);
+</script>
+
+<template>
+  <div>
+    <FormModal @success="onRefresh" />
+    <Grid>
+      <template #toolbar-tools>
+        <TableAction
+          :actions="[
+            {
+              label: $t('common.create'),
+              type: 'primary',
+              icon: ACTION_ICON.ADD,
+              ifShow: validateOwnerUser,
+              onClick: handleCreate,
+            },
+            {
+              label: $t('common.edit'),
+              type: 'primary',
+              icon: ACTION_ICON.EDIT,
+              ifShow: validateOwnerUser,
+              onClick: handleEdit,
+            },
+            {
+              label: $t('common.delete'),
+              type: 'primary',
+              danger: true,
+              icon: ACTION_ICON.DELETE,
+              ifShow: validateOwnerUser,
+              onClick: handleDelete,
+            },
+            {
+              label: '退出团队',
+              type: 'primary',
+              danger: true,
+              ifShow: !validateOwnerUser,
+              onClick: handleQuit,
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+  </div>
+</template>

apps/web-antd/src/views/crm/permission/modules/transfer-form.vue

@@ -0,0 +1,202 @@
+<script lang="ts" setup>
+import type { CrmPermissionApi } from '#/api/crm/permission';
+
+import { computed } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { message } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import { transferBusiness } from '#/api/crm/business';
+import { transferClue } from '#/api/crm/clue';
+import { transferContact } from '#/api/crm/contact';
+import { transferContract } from '#/api/crm/contract';
+import { transferCustomer } from '#/api/crm/customer';
+import { BizTypeEnum, PermissionLevelEnum } from '#/api/crm/permission';
+import { getSimpleUserList } from '#/api/system/user';
+import { $t } from '#/locales';
+import { DICT_TYPE, getDictOptions } from '#/utils';
+
+defineOptions({ name: 'CrmTransferForm' });
+
+const emit = defineEmits(['success']);
+
+const bizType = defineModel<number>('bizType');
+
+const getTitle = computed(() => {
+  switch (bizType.value) {
+    case BizTypeEnum.CRM_BUSINESS: {
+      return '商机转移';
+    }
+    case BizTypeEnum.CRM_CLUE: {
+      return '线索转移';
+    }
+    case BizTypeEnum.CRM_CONTACT: {
+      return '联系人转移';
+    }
+    case BizTypeEnum.CRM_CONTRACT: {
+      return '合同转移';
+    }
+    case BizTypeEnum.CRM_CUSTOMER: {
+      return '客户转移';
+    }
+    default: {
+      return '转移';
+    }
+  }
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 120,
+  },
+  layout: 'horizontal',
+  schema: [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'ownerUserId',
+      label: '选择新负责人',
+      component: 'ApiSelect',
+      componentProps: {
+        api: getSimpleUserList,
+        labelField: 'nickname',
+        valueField: 'id',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'oldOwnerHandler',
+      label: '老负责人',
+      component: 'RadioGroup',
+      componentProps: {
+        options: [
+          {
+            label: '加入团队',
+            value: true,
+          },
+          {
+            label: '移除',
+            value: false,
+          },
+        ],
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'oldOwnerPermissionLevel',
+      label: '老负责人权限级别',
+      component: 'RadioGroup',
+      componentProps: {
+        options: getDictOptions(
+          DICT_TYPE.CRM_PERMISSION_LEVEL,
+          'number',
+        ).filter((dict) => dict.value !== PermissionLevelEnum.OWNER),
+      },
+      dependencies: {
+        triggerFields: ['oldOwnerHandler'],
+        show: (values) => values.oldOwnerHandler,
+        trigger(values) {
+          if (!values.oldOwnerHandler) {
+            formApi.setFieldValue('oldOwnerPermissionLevel', undefined);
+          }
+        },
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'toBizTypes',
+      label: '同时转移',
+      component: 'CheckboxGroup',
+      componentProps: {
+        options: [
+          {
+            label: '联系人',
+            value: BizTypeEnum.CRM_CONTACT,
+          },
+          {
+            label: '商机',
+            value: BizTypeEnum.CRM_BUSINESS,
+          },
+          {
+            label: '合同',
+            value: BizTypeEnum.CRM_CONTRACT,
+          },
+        ],
+      },
+    },
+  ],
+  showDefaultActions: false,
+});
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as CrmPermissionApi.TransferReq;
+    try {
+      switch (bizType.value) {
+        case BizTypeEnum.CRM_BUSINESS: {
+          return await transferBusiness(data);
+        }
+        case BizTypeEnum.CRM_CLUE: {
+          return await transferClue(data);
+        }
+        case BizTypeEnum.CRM_CONTACT: {
+          return await transferContact(data);
+        }
+        case BizTypeEnum.CRM_CONTRACT: {
+          return await transferContract(data);
+        }
+        case BizTypeEnum.CRM_CUSTOMER: {
+          return await transferCustomer(data);
+        }
+        default: {
+          message.error('【转移失败】没有转移接口');
+          throw new Error('【转移失败】没有转移接口');
+        }
+      }
+    } finally {
+      // 关闭并提示
+      await modalApi.close();
+      emit('success');
+      message.success($t('ui.actionMessage.operationSuccess'));
+      modalApi.unlock();
+    }
+  },
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      formApi.resetForm();
+      return;
+    }
+    // 加载数据
+    const data = modalApi.getData<{ bizType: number }>();
+    if (!data || !data.bizType) {
+      return;
+    }
+    bizType.value = data.bizType;
+    formApi.setFieldValue('id', data.bizType);
+  },
+});
+</script>
+
+<template>
+  <Modal :title="getTitle" class="w-[40%]">
+    <Form class="mx-4" />
+  </Modal>
+</template>

apps/web-antd/src/views/crm/product/modules/detail-info.vue

@@ -0,0 +1,4 @@
+<script lang="ts" setup></script>
+<template>
+  <div>productInfo</div>
+</template>

apps/web-antd/src/views/crm/product/modules/detail-list.vue

@@ -0,0 +1,4 @@
+<script lang="ts" setup></script>
+<template>
+  <div>productList</div>
+</template>

apps/web-antd/src/views/crm/receivable/data.ts

@@ -173,38 +173,38 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       title: '回款编号',
       field: 'no',
-      width: 150,
+      minWidth: 150,
       fixed: 'left',
       slots: { default: 'no' },
     },
     {
       title: '客户名称',
       field: 'customerName',
-      width: 150,
+      minWidth: 150,
       slots: { default: 'customerName' },
     },
     {
       title: '合同编号',
       field: 'contract',
-      width: 150,
+      minWidth: 150,
       slots: { default: 'contractNo' },
     },
     {
       title: '回款日期',
       field: 'returnTime',
-      width: 150,
+      minWidth: 150,
       formatter: 'formatDateTime',
     },
     {
       title: '回款金额（元）',
       field: 'price',
-      width: 150,
+      minWidth: 150,
       formatter: 'formatNumber',
     },
     {
       title: '回款方式',
       field: 'returnType',
-      width: 150,
+      minWidth: 150,
       cellRender: {
         name: 'CellDict',
         props: { type: DICT_TYPE.CRM_RECEIVABLE_RETURN_TYPE },
@@ -213,45 +213,45 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       title: '备注',
       field: 'remark',
-      width: 150,
+      minWidth: 150,
     },
     {
       title: '合同金额（元）',
       field: 'contract.totalPrice',
-      width: 150,
+      minWidth: 150,
       formatter: 'formatNumber',
     },
     {
       title: '负责人',
       field: 'ownerUserName',
-      width: 150,
+      minWidth: 150,
     },
     {
       title: '所属部门',
       field: 'ownerUserDeptName',
-      width: 150,
+      minWidth: 150,
     },
     {
       title: '更新时间',
       field: 'updateTime',
-      width: 150,
+      minWidth: 150,
       formatter: 'formatDateTime',
     },
     {
       title: '创建时间',
       field: 'createTime',
-      width: 150,
+      minWidth: 150,
       formatter: 'formatDateTime',
     },
     {
       title: '创建人',
       field: 'creatorName',
-      width: 150,
+      minWidth: 150,
     },
     {
       title: '回款状态',
       field: 'auditStatus',
-      width: 100,
+      minWidth: 100,
       fixed: 'right',
       cellRender: {
         name: 'CellDict',

apps/web-antd/src/views/crm/receivable/modules/detail-info.vue

@@ -0,0 +1,4 @@
+<script lang="ts" setup></script>
+<template>
+  <div>receivableInfo</div>
+</template>

apps/web-antd/src/views/crm/receivable/modules/detail-list.vue

@@ -0,0 +1,4 @@
+<script lang="ts" setup></script>
+<template>
+  <div>receivableList</div>
+</template>

apps/web-antd/src/views/crm/receivable/plan/data.ts

@@ -122,48 +122,48 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       title: '客户名称',
       field: 'customerName',
-      width: 150,
+      minWidth: 150,
       fixed: 'left',
       slots: { default: 'customerName' },
     },
     {
       title: '合同编号',
       field: 'contractNo',
-      width: 200,
+      minWidth: 200,
     },
     {
       title: '期数',
       field: 'period',
-      width: 150,
+      minWidth: 150,
       slots: { default: 'period' },
     },
     {
       title: '计划回款金额（元）',
       field: 'price',
-      width: 160,
+      minWidth: 160,
       formatter: 'formatNumber',
     },
     {
       title: '计划回款日期',
       field: 'returnTime',
-      width: 180,
+      minWidth: 180,
       formatter: 'formatDateTime',
     },
     {
       title: '提前几天提醒',
       field: 'remindDays',
-      width: 150,
+      minWidth: 150,
     },
     {
       title: '提醒日期',
       field: 'remindTime',
-      width: 180,
+      minWidth: 180,
       formatter: 'formatDateTime',
     },
     {
       title: '回款方式',
       field: 'returnType',
-      width: 130,
+      minWidth: 130,
       cellRender: {
         name: 'CellDict',
         props: { type: DICT_TYPE.CRM_RECEIVABLE_RETURN_TYPE },
@@ -172,28 +172,29 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       title: '备注',
       field: 'remark',
+      minWidth: 120,
     },
     {
       title: '负责人',
       field: 'ownerUserName',
-      width: 120,
+      minWidth: 120,
     },
     {
       title: '实际回款金额（元）',
       field: 'receivable.price',
-      width: 160,
+      minWidth: 160,
       formatter: 'formatNumber',
     },
     {
       title: '实际回款日期',
       field: 'receivable.returnTime',
-      width: 180,
+      minWidth: 180,
       formatter: 'formatDateTime',
     },
     {
       title: '未回款金额（元）',
       field: 'unpaidPrice',
-      width: 160,
+      minWidth: 160,
       formatter: ({ row }) => {
         if (row.receivable) {
           return row.price - row.receivable.price;
@@ -204,19 +205,19 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       title: '更新时间',
       field: 'updateTime',
-      width: 180,
+      minWidth: 180,
       formatter: 'formatDateTime',
     },
     {
       title: '创建时间',
       field: 'createTime',
-      width: 180,
+      minWidth: 180,
       formatter: 'formatDateTime',
     },
     {
       title: '创建人',
       field: 'creatorName',
-      width: 100,
+      minWidth: 100,
     },
     {
       title: '操作',

apps/web-antd/src/views/crm/receivable/plan/modules/detail-info.vue

@@ -0,0 +1,4 @@
+<script lang="ts" setup></script>
+<template>
+  <div>receivablePlanInfo</div>
+</template>

apps/web-antd/src/views/crm/receivable/plan/modules/detail-list.vue

@@ -0,0 +1,4 @@
+<script lang="ts" setup></script>
+<template>
+  <div>receivablePlanList</div>
+</template>