Merge branch 'dev' of gitee.com:yudaocode/yudao-ui-admin-vben into dev-spu

Signed-off-by: puhui999 <puhui999@163.com>

apps/web-antd/src/api/bpm/definition/index.ts

@@ -6,6 +6,7 @@ export namespace BpmProcessDefinitionApi {
   /** 流程定义 */
   export interface ProcessDefinition {
     id: string;
+    key?: string;
     version: number;
     name: string;
     description: string;

apps/web-antd/src/api/bpm/processInstance/index.ts

@@ -15,6 +15,7 @@ export namespace BpmProcessInstanceApi {
   export interface Task {
     id: number;
     name: string;
+    assigneeUser?: User;
   }
 
   export interface User {
@@ -51,6 +52,7 @@ export namespace BpmProcessInstanceApi {
   export interface ProcessInstance {
     businessKey: string;
     category: string;
+    categoryName?: string;
     createTime: string;
     endTime: string;
     fields: string[];
@@ -64,6 +66,10 @@ export namespace BpmProcessInstanceApi {
     startTime?: Date;
     startUser?: User;
     status: number;
+    summary?: {
+      key: string;
+      value: string;
+    }[];
     tasks?: BpmProcessInstanceApi.Task[];
   }
 

apps/web-antd/src/api/bpm/task/index.ts

@@ -13,6 +13,7 @@ export namespace BpmTaskApi {
     status: number; // 监听器状态
     event: string; // 监听事件
     valueType: string; // 监听器值类型
+    processInstance?: BpmProcessInstanceApi.ProcessInstance; // 流程实例
   }
 
   // 流程任务

apps/web-antd/src/components/description/description.vue

@@ -1,82 +1,196 @@
 <script lang="tsx">
-import type { DescriptionsProps } from 'ant-design-vue';
+import type { DescriptionsProps } from 'ant-design-vue/es/descriptions';
 
-import type { PropType } from 'vue';
+import type { CSSProperties, PropType, Slots } from 'vue';
 
-import type { DescriptionItemSchema, DescriptionsOptions } from './typing';
+import type { DescriptionItemSchema, DescriptionProps } from './typing';
 
-import { defineComponent } from 'vue';
+import { computed, defineComponent, ref, unref, useAttrs } from 'vue';
 
-import { get } from '@vben/utils';
+import { get, getNestedValue, isFunction } from '@vben/utils';
 
-import { Descriptions, DescriptionsItem } from 'ant-design-vue';
+import { Card, Descriptions } from 'ant-design-vue';
 
-/** 对 Descriptions 进行二次封装 */
+const props = {
-const Description = defineComponent({
+  bordered: { default: true, type: Boolean },
-  name: 'Descriptions',
+  column: {
-  props: {
+    default: () => {
-    data: {
+      return { lg: 3, md: 3, sm: 2, xl: 3, xs: 1, xxl: 4 };
-      type: Object as PropType<Record<string, any>>,
-      default: () => ({}),
-    },
-    schema: {
-      type: Array as PropType<DescriptionItemSchema[]>,
-      default: () => [],
-    },
-    // Descriptions 原生 props
-    componentProps: {
-      type: Object as PropType<DescriptionsProps>,
-      default: () => ({}),
     },
+    type: [Number, Object],
   },
+  data: { type: Object },
+  schema: {
+    default: () => [],
+    type: Array as PropType<DescriptionItemSchema[]>,
+  },
+  size: {
+    default: 'small',
+    type: String,
+    validator: (v: string) =>
+      ['default', 'middle', 'small', undefined].includes(v),
+  },
+  title: { default: '', type: String },
+  useCard: { default: true, type: Boolean },
+};
 
-  setup(props: DescriptionsOptions) {
+function getSlot(slots: Slots, slot: string, data?: any) {
-    // TODO @xingyu：每个 field 的 slot 的考虑
+  if (!slots || !Reflect.has(slots, slot)) {
-    // TODO @xingyu：from 5.0：extra: () => getSlot(slots, 'extra')
+    return null;
-    /** 过滤掉不需要展示的 */
+  }
-    const shouldShowItem = (item: DescriptionItemSchema) => {
+  if (!isFunction(slots[slot])) {
-      if (item.hidden === undefined) return true;
+    console.error(`${slot} is not a function!`);
-      return typeof item.hidden === 'function'
+    return null;
-        ? !item.hidden(props.data)
+  }
-        : !item.hidden;
+  const slotFn = slots[slot];
-    };
+  if (!slotFn) return null;
-    /** 渲染内容 */
+  return slotFn({ data });
-    const renderContent = (item: DescriptionItemSchema) => {
+}
-      if (item.content) {
+
-        return typeof item.content === 'function'
+export default defineComponent({
-          ? item.content(props.data)
+  name: 'Description',
-          : item.content;
+  props,
+  setup(props, { slots }) {
+    const propsRef = ref<null | Partial<DescriptionProps>>(null);
+
+    const prefixCls = 'description';
+    const attrs = useAttrs();
+
+    // Custom title component: get title
+    const getMergeProps = computed(() => {
+      return {
+        ...props,
+        ...(unref(propsRef) as any),
+      } as DescriptionProps;
+    });
+
+    const getProps = computed(() => {
+      const opt = {
+        ...unref(getMergeProps),
+        title: undefined,
+      };
+      return opt as DescriptionProps;
+    });
+
+    const useWrapper = computed(() => !!unref(getMergeProps).title);
+
+    const getDescriptionsProps = computed(() => {
+      return { ...unref(attrs), ...unref(getProps) } as DescriptionsProps;
+    });
+
+    // 防止换行
+    function renderLabel({
+      label,
+      labelMinWidth,
+      labelStyle,
+    }: DescriptionItemSchema) {
+      if (!labelStyle && !labelMinWidth) {
+        return label;
       }
-      return item.field ? get(props.data, item.field) : null;
-    };
 
-    return () => (
+      const labelStyles: CSSProperties = {
-      <Descriptions
+        ...labelStyle,
-        {...props}
+        minWidth: `${labelMinWidth}px `,
-        bordered={props.componentProps?.bordered}
+      };
-        colon={props.componentProps?.colon}
+      return <div style={labelStyles}>{label}</div>;
-        column={props.componentProps?.column}
+    }
-        extra={props.componentProps?.extra}
+
-        layout={props.componentProps?.layout}
+    function renderItem() {
-        size={props.componentProps?.size}
+      const { data, schema } = unref(getProps);
-        title={props.componentProps?.title}
+      return unref(schema)
-      >
+        .map((item) => {
-        {props.schema?.filter(shouldShowItem).map((item) => (
+          const { contentMinWidth, field, render, show, span } = item;
-          <DescriptionsItem
+
-            contentStyle={item.contentStyle}
+          if (show && isFunction(show) && !show(data)) {
-            key={item.field || String(item.label)}
+            return null;
-            label={item.label}
+          }
-            labelStyle={item.labelStyle}
+
-            span={item.span}
+          function getContent() {
-          >
+            const _data = unref(getProps)?.data;
-            {renderContent(item)}
+            if (!_data) {
-          </DescriptionsItem>
+              return null;
-        ))}
+            }
-      </Descriptions>
+            const getField = field.includes('.')
-    );
+              ? (getNestedValue(_data, field) ?? get(_data, field))
+              : get(_data, field);
+            // if (
+            //   getField &&
+            //   !Object.prototype.hasOwnProperty.call(toRefs(_data), field)
+            // ) {
+            //   return isFunction(render) ? render('', _data) : (getField ?? '');
+            // }
+            return isFunction(render)
+              ? render(getField, _data)
+              : (getField ?? '');
+          }
+
+          const width = contentMinWidth;
+          return (
+            <Descriptions.Item
+              key={field}
+              label={renderLabel(item)}
+              span={span}
+            >
+              {() => {
+                if (item.slot) {
+                  const slotContent = getSlot(slots, item.slot, data);
+                  return slotContent;
+                }
+                if (!contentMinWidth) {
+                  return getContent();
+                }
+                const style: CSSProperties = {
+                  minWidth: `${width}px`,
+                };
+                return <div style={style}>{getContent()}</div>;
+              }}
+            </Descriptions.Item>
+          );
+        })
+        .filter((item) => !!item);
+    }
+
+    function renderDesc() {
+      return (
+        <Descriptions
+          class={`${prefixCls}`}
+          {...(unref(getDescriptionsProps) as any)}
+        >
+          {renderItem()}
+        </Descriptions>
+      );
+    }
+
+    function renderCard() {
+      const content = props.useCard ? renderDesc() : <div>{renderDesc()}</div>;
+      // Reduce the dom level
+      if (!props.useCard) {
+        return content;
+      }
+
+      const { title } = unref(getMergeProps);
+      const extraSlot = getSlot(slots, 'extra');
+
+      return (
+        <Card
+          bodyStyle={{ padding: '8px 0' }}
+          headStyle={{
+            padding: '8px 16px',
+            fontSize: '14px',
+            minHeight: '24px',
+          }}
+          style={{ margin: 0 }}
+          title={title}
+        >
+          {{
+            default: () => content,
+            extra: () => extraSlot && <div>{extraSlot}</div>,
+          }}
+        </Card>
+      );
+    }
+
+    return () => (unref(useWrapper) ? renderCard() : renderDesc());
   },
 });
-
-// TODO @xingyu：from 5.0：emits: ['register'] 事件
-export default Description;
 </script>

apps/web-antd/src/components/description/typing.ts

@@ -1,27 +1,56 @@
-import type { DescriptionsProps } from 'ant-design-vue';
+import type { DescriptionsProps } from 'ant-design-vue/es/descriptions';
+import type { JSX } from 'vue/jsx-runtime';
 
 import type { CSSProperties, VNode } from 'vue';
 
-// TODO @xingyu：【content】这个纠结下；1）vben2.0 是 render；https://doc.vvbin.cn/components/desc.html#usage 2）
+import type { Recordable } from '@vben/types';
-// TODO @xingyu：vben2.0 还有 sapn【done】、labelMinWidth、contentMinWidth
+
-// TODO @xingyu：【hidden】这个纠结下；1）vben2.0 是 show；
 export interface DescriptionItemSchema {
-  label: string | VNode; // 内容的描述
+  labelMinWidth?: number;
-  field?: string; // 对应 data 中的字段名
+  contentMinWidth?: number;
-  content?: ((data: any) => string | VNode) | string | VNode; // 自定义需要展示的内容，比如说 dict-tag
+  // 自定义标签样式
-  span?: number; // 包含列的数量
+  labelStyle?: CSSProperties;
-  labelStyle?: CSSProperties; // 自定义标签样式
+  // 对应 data 中的字段名
-  contentStyle?: CSSProperties; // 自定义内容样式
+  field: string;
-  hidden?: ((data: any) => boolean) | boolean; // 是否显示
+  // 内容的描述
+  label: JSX.Element | string | VNode;
+  // 包含列的数量
+  span?: number;
+  // 是否显示
+  show?: (...arg: any) => boolean;
+  // 插槽名称
+  slot?: string;
+  // 自定义需要展示的内容
+  render?: (
+    val: any,
+    data?: Recordable<any>,
+  ) => Element | JSX.Element | number | string | undefined | VNode;
 }
 
-// TODO @xingyu：vben2.0 还有 title【done】、bordered【done】d、useCollapse、collapseOptions
+export interface DescriptionProps extends DescriptionsProps {
-// TODO @xingyu：from 5.0：bordered 默认为 true
+  // 是否包含卡片组件
-// TODO @xingyu：from 5.0：column 默认为 lg: 3, md: 3, sm: 2, xl: 3, xs: 1, xxl: 4
+  useCard?: boolean;
-// TODO @xingyu：from 5.0：size 默认为 small；有 'default', 'middle', 'small', undefined
+  // 描述项配置
-// TODO @xingyu：from 5.0：useCollapse 默认为 true
+  schema: DescriptionItemSchema[];
-export interface DescriptionsOptions {
+  // 数据
-  data?: Record<string, any>; // 数据
+  data: Recordable<any>;
-  schema?: DescriptionItemSchema[]; // 描述项配置
+  // 标题
-  componentProps?: DescriptionsProps; // antd Descriptions 组件参数
+  title?: string;
+  // 是否包含边框
+  bordered?: boolean;
+  // 列数
+  column?:
+    | number
+    | {
+        lg: number;
+        md: number;
+        sm: number;
+        xl: number;
+        xs: number;
+        xxl: number;
+      };
+}
+
+export interface DescInstance {
+  setDescProps(descProps: Partial<DescriptionProps>): void;
 }

apps/web-antd/src/components/description/use-description.ts

@@ -1,71 +1,31 @@
-import type { DescriptionsOptions } from './typing';
+import type { Component } from 'vue';
 
-import { defineComponent, h, isReactive, reactive, watch } from 'vue';
+import type { DescInstance, DescriptionProps } from './typing';
+
+import { h, reactive } from 'vue';
 
 import Description from './description.vue';
 
-/** 描述列表 api 定义 */
+export function useDescription(options?: Partial<DescriptionProps>) {
-class DescriptionApi {
+  const propsState = reactive<Partial<DescriptionProps>>(options || {});
-  private state = reactive<Record<string, any>>({});
 
-  constructor(options: DescriptionsOptions) {
+  const api: DescInstance = {
-    this.state = { ...options };
+    setDescProps: (descProps: Partial<DescriptionProps>): void => {
-  }
+      Object.assign(propsState, descProps);
+    },
+  };
 
-  getState(): DescriptionsOptions {
+  // 创建一个包装组件，将 propsState 合并到 props 中
-    return this.state as DescriptionsOptions;
+  const DescriptionWrapper: Component = {
-  }
-
-  // TODO @xingyu：【setState】纠结下：1）vben2.0 是 data https://doc.vvbin.cn/components/desc.html#usage；
-  setState(newState: Partial<DescriptionsOptions>) {
-    this.state = { ...this.state, ...newState };
-  }
-}
-
-export type ExtendedDescriptionApi = DescriptionApi;
-
-export function useDescription(options: DescriptionsOptions) {
-  const IS_REACTIVE = isReactive(options);
-  const api = new DescriptionApi(options);
-  // 扩展 API
-  const extendedApi: ExtendedDescriptionApi = api as never;
-  const Desc = defineComponent({
     name: 'UseDescription',
     inheritAttrs: false,
-    setup(_, { attrs, slots }) {
+    setup(_props, { attrs, slots }) {
-      // 合并props和attrs到state
+      return () => {
-      api.setState({ ...attrs });
+        // @ts-ignore - 避免类型实例化过深
-
+        return h(Description, { ...propsState, ...attrs }, slots);
-      return () =>
+      };
-        h(
-          Description,
-          {
-            ...api.getState(),
-            ...attrs,
-          },
-          slots,
-        );
     },
-  });
+  };
 
-  // 响应式支持
+  return [DescriptionWrapper, api] as const;
-  if (IS_REACTIVE) {
-    watch(
-      () => options.schema,
-      (newSchema) => {
-        api.setState({ schema: newSchema });
-      },
-      { immediate: true, deep: true },
-    );
-
-    watch(
-      () => options.data,
-      (newData) => {
-        api.setState({ data: newData });
-      },
-      { immediate: true, deep: true },
-    );
-  }
-
-  return [Desc, extendedApi] as const;
 }

apps/web-antd/src/views/ai/chat/manager/data.ts

@@ -109,7 +109,7 @@ export function useGridFormSchemaMessage(): VbenFormSchema[] {
       label: '用户编号',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },

apps/web-antd/src/views/ai/image/manager/data.ts

@@ -15,7 +15,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       label: '用户编号',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },

apps/web-antd/src/views/ai/mindmap/manager/data.ts

@@ -12,7 +12,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       label: '用户编号',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },

apps/web-antd/src/views/ai/model/chatRole/data.ts

@@ -93,7 +93,7 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'ApiSelect',
       componentProps: {
         placeholder: '请选择引用知识库',
-        api: () => getSimpleKnowledgeList(),
+        api: getSimpleKnowledgeList,
         labelField: 'name',
         mode: 'multiple',
         valueField: 'id',
@@ -106,7 +106,7 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'ApiSelect',
       componentProps: {
         placeholder: '请选择引用工具',
-        api: () => getToolSimpleList(),
+        api: getToolSimpleList,
         mode: 'multiple',
         labelField: 'name',
         valueField: 'id',

apps/web-antd/src/views/ai/model/model/data.ts

@@ -48,7 +48,7 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'ApiSelect',
       componentProps: {
         placeholder: '请选择API 秘钥',
-        api: () => getApiKeySimpleList(),
+        api: getApiKeySimpleList,
         labelField: 'name',
         valueField: 'id',
         allowClear: true,

apps/web-antd/src/views/ai/music/manager/data.ts

@@ -15,7 +15,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       label: '用户编号',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },

apps/web-antd/src/views/ai/write/manager/data.ts

@@ -15,7 +15,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       label: '用户编号',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },

apps/web-antd/src/views/bpm/form/designer/index.vue

@@ -138,11 +138,7 @@ onMounted(() => {
     <FormModal @success="handleBack" />
 
     <Spin :spinning="loading">
-      <FcDesigner
+      <FcDesigner ref="designerRef" height="90vh" :config="designerConfig">
-        class="h-full min-h-[500px]"
-        ref="designerRef"
-        :config="designerConfig"
-      >
         <template #handle>
           <Button size="small" type="primary" @click="handleSave">
             <IconifyIcon icon="mdi:content-save" />

apps/web-antd/src/views/bpm/group/data.ts

@@ -51,7 +51,7 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'ApiSelect',
       componentProps: {
         placeholder: '请选择成员',
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
         mode: 'tags',

apps/web-antd/src/views/bpm/oa/leave/data.ts

@@ -179,21 +179,21 @@ export function useDetailFormSchema(): DescriptionItemSchema[] {
     {
       label: '请假类型',
       field: 'type',
-      content: (data) =>
+      render: (val) =>
         h(DictTag, {
           type: DICT_TYPE.BPM_OA_LEAVE_TYPE,
-          value: data?.type,
+          value: val,
         }),
     },
     {
       label: '开始时间',
       field: 'startTime',
-      content: (data) => formatDateTime(data?.startTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
     {
       label: '结束时间',
       field: 'endTime',
-      content: (data) => formatDateTime(data?.endTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
     {
       label: '原因',

apps/web-antd/src/views/bpm/processExpression/index.vue

@@ -44,9 +44,7 @@ async function handleDelete(row: BpmProcessExpressionApi.ProcessExpression) {
   });
   try {
     await deleteProcessExpression(row.id as number);
-    message.success({
+    message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
-      content: $t('ui.actionMessage.deleteSuccess', [row.name]),
-    });
     handleRefresh();
   } finally {
     hideLoading();
@@ -74,6 +72,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,

apps/web-antd/src/views/bpm/processExpression/modules/form.vue

@@ -55,6 +55,7 @@ const [Modal, modalApi] = useVbenModal({
   },
   async onOpenChange(isOpen: boolean) {
     if (!isOpen) {
+      formData.value = undefined;
       return;
     }
     // 加载数据

apps/web-antd/src/views/bpm/processInstance/data.ts

@@ -5,23 +5,12 @@ import { DICT_TYPE } from '@vben/constants';
 import { getDictOptions } from '@vben/hooks';
 
 import { getCategorySimpleList } from '#/api/bpm/category';
+import { getSimpleProcessDefinitionList } from '#/api/bpm/definition';
 import { getRangePickerDefaultProps } from '#/utils';
 
 /** 列表的搜索表单 */
 export function useGridFormSchema(): VbenFormSchema[] {
   return [
-    // {
-    //   fieldName: 'startUserId',
-    //   label: '发起人',
-    //   component: 'ApiSelect',
-    //   componentProps: {
-    //     placeholder: '请选择发起人',
-    //     allowClear: true,
-    //     api: () => getSimpleUserList(),
-    //     labelField: 'nickname',
-    //     valueField: 'id',
-    //   },
-    // },
     {
       fieldName: 'name',
       label: '流程名称',
@@ -34,13 +23,15 @@ export function useGridFormSchema(): VbenFormSchema[] {
     {
       fieldName: 'processDefinitionId',
       label: '所属流程',
-      component: 'Input',
+      component: 'ApiSelect',
       componentProps: {
-        placeholder: '请输入流程定义的编号',
+        placeholder: '请选择流程定义',
         allowClear: true,
+        api: getSimpleProcessDefinitionList,
+        labelField: 'name',
+        valueField: 'id',
       },
     },
-    // 流程分类
     {
       fieldName: 'category',
       label: '流程分类',
@@ -48,12 +39,11 @@ export function useGridFormSchema(): VbenFormSchema[] {
       componentProps: {
         placeholder: '请输入流程分类',
         allowClear: true,
-        api: () => getCategorySimpleList(),
+        api: getCategorySimpleList,
         labelField: 'name',
         valueField: 'code',
       },
     },
-    // 流程状态
     {
       fieldName: 'status',
       label: '流程状态',
@@ -67,7 +57,6 @@ export function useGridFormSchema(): VbenFormSchema[] {
         allowClear: true,
       },
     },
-    // 发起时间
     {
       fieldName: 'createTime',
       label: '发起时间',
@@ -97,15 +86,12 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
         default: 'slot-summary',
       },
     },
-
     {
       field: 'categoryName',
       title: '流程分类',
       minWidth: 120,
       fixed: 'left',
     },
-
-    // 流程状态
     {
       field: 'status',
       title: '流程状态',
@@ -114,7 +100,6 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
         default: 'slot-status',
       },
     },
-
     {
       field: 'startTime',
       title: '发起时间',

apps/web-antd/src/views/bpm/processInstance/index.vue

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
-import type { BpmTaskApi } from '#/api/bpm/task';
+import type { BpmProcessInstanceApi } from '#/api/bpm/processInstance';
 
 import { h } from 'vue';
 
@@ -10,11 +10,13 @@ import { BpmProcessInstanceStatus, DICT_TYPE } from '@vben/constants';
 import { Button, message, Textarea } from 'ant-design-vue';
 
 import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getProcessDefinition } from '#/api/bpm/definition';
 import {
   cancelProcessInstanceByStartUser,
   getProcessInstanceMyPage,
 } from '#/api/bpm/processInstance';
 import { DictTag } from '#/components/dict-tag';
+import { $t } from '#/locales';
 import { router } from '#/router';
 
 import { useGridColumns, useGridFormSchema } from './data';
@@ -27,43 +29,53 @@ function handleRefresh() {
 }
 
 /** 查看流程实例 */
-function handleDetail(row: BpmTaskApi.Task) {
+function handleDetail(row: BpmProcessInstanceApi.ProcessInstance) {
   router.push({
     name: 'BpmProcessInstanceDetail',
     query: { id: row.id },
   });
 }
 
+/** 重新发起流程 */
+async function handleCreate(row: BpmProcessInstanceApi.ProcessInstance) {
+  // 如果是【业务表单】，不支持重新发起
+  if (row?.id) {
+    const processDefinitionDetail = await getProcessDefinition(
+      row.processDefinitionId,
+    );
+    if (processDefinitionDetail.formType === 20) {
+      message.error(
+        '重新发起流程失败，原因：该流程使用业务表单，不支持重新发起',
+      );
+      return;
+    }
+  }
+  // 跳转发起流程界面
+  await router.push({
+    name: 'BpmProcessInstanceCreate',
+    query: { processInstanceId: row?.id },
+  });
+}
+
 /** 取消流程实例 */
-function handleCancel(row: BpmTaskApi.Task) {
+function handleCancel(row: BpmProcessInstanceApi.ProcessInstance) {
   prompt({
-    async beforeClose(scope) {
-      if (scope.isConfirm) {
-        if (scope.value) {
-          try {
-            await cancelProcessInstanceByStartUser(row.id, scope.value);
-            message.success('取消成功');
-            handleRefresh();
-          } catch {
-            return false;
-          }
-        } else {
-          message.error('请输入取消原因');
-          return false;
-        }
-      }
-    },
     component: () => {
       return h(Textarea, {
         placeholder: '请输入取消原因',
         allowClear: true,
         rows: 2,
-        rules: [{ required: true, message: '请输入取消原因' }],
       });
     },
     content: '请输入取消原因',
     title: '取消流程',
     modelPropName: 'value',
+  }).then(async (reason) => {
+    if (reason) {
+      await cancelProcessInstanceByStartUser(row.id, reason);
+      message.success('取消成功');
+      handleRefresh();
+    }
   });
 }
 
@@ -88,15 +100,13 @@ const [Grid, gridApi] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,
       search: true,
     },
-    cellConfig: {
+  } as VxeTableGridOptions<BpmProcessInstanceApi.ProcessInstance>,
-      height: 64,
-    },
-  } as VxeTableGridOptions<BpmTaskApi.Task>,
 });
 </script>
 
@@ -110,7 +120,6 @@ const [Grid, gridApi] = useVbenVxeGrid({
     </template>
 
     <Grid table-title="流程状态">
-      <!-- 摘要 -->
       <template #slot-summary="{ row }">
         <div
           class="flex flex-col py-2"
@@ -124,31 +133,29 @@ const [Grid, gridApi] = useVbenVxeGrid({
         </div>
         <div v-else>-</div>
       </template>
-
       <template #slot-status="{ row }">
-        <!-- 审批中状态 -->
         <template
           v-if="
             row.status === BpmProcessInstanceStatus.RUNNING &&
-            row.tasks?.length > 0
+            row.tasks!.length > 0
           "
         >
           <!-- 单人审批 -->
-          <template v-if="row.tasks.length === 1">
+          <template v-if="row.tasks!.length === 1">
             <span>
               <Button type="link" @click="handleDetail(row)">
-                {{ row.tasks[0].assigneeUser?.nickname }}
+                {{ row.tasks![0]!.assigneeUser?.nickname }}
               </Button>
-              ({{ row.tasks[0].name }}) 审批中
+              ({{ row.tasks![0]!.name }}) 审批中
             </span>
           </template>
           <!-- 多人审批 -->
           <template v-else>
             <span>
               <Button type="link" @click="handleDetail(row)">
-                {{ row.tasks[0].assigneeUser?.nickname }}
+                {{ row.tasks![0]!.assigneeUser?.nickname }}
               </Button>
-              等 {{ row.tasks.length }} 人 ({{ row.tasks[0].name }})审批中
+              等 {{ row.tasks!.length }} 人 ({{ row.tasks![0]!.name }})审批中
             </span>
           </template>
         </template>
@@ -179,6 +186,14 @@ const [Grid, gridApi] = useVbenVxeGrid({
               auth: ['bpm:process-instance:cancel'],
               onClick: handleCancel.bind(null, row),
             },
+            {
+              label: '重新发起',
+              type: 'link',
+              icon: ACTION_ICON.ADD,
+              ifShow: row.status !== BpmProcessInstanceStatus.RUNNING,
+              auth: ['bpm:process-instance:create'],
+              onClick: handleCreate.bind(null, row),
+            },
           ]"
         />
       </template>

apps/web-antd/src/views/bpm/processInstance/manager/data.ts

@@ -1,15 +1,11 @@
 import type { VbenFormSchema } from '#/adapter/form';
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
-import type { BpmProcessInstanceApi } from '#/api/bpm/processInstance';
-
-import { h } from 'vue';
 
 import { DICT_TYPE } from '@vben/constants';
 import { getDictOptions } from '@vben/hooks';
 
-import { Button } from 'ant-design-vue';
-
 import { getCategorySimpleList } from '#/api/bpm/category';
+import { getSimpleProcessDefinitionList } from '#/api/bpm/definition';
 import { getSimpleUserList } from '#/api/system/user';
 import { getRangePickerDefaultProps } from '#/utils';
 
@@ -23,7 +19,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       componentProps: {
         placeholder: '请选择发起人',
         allowClear: true,
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },
@@ -40,13 +36,15 @@ export function useGridFormSchema(): VbenFormSchema[] {
     {
       fieldName: 'processDefinitionId',
       label: '所属流程',
-      component: 'Input',
+      component: 'ApiSelect',
       componentProps: {
-        placeholder: '请输入流程定义的编号',
+        placeholder: '请选择流程定义',
         allowClear: true,
+        api: getSimpleProcessDefinitionList,
+        labelField: 'name',
+        valueField: 'id',
       },
     },
-    // 流程分类
     {
       fieldName: 'category',
       label: '流程分类',
@@ -54,12 +52,11 @@ export function useGridFormSchema(): VbenFormSchema[] {
       componentProps: {
         placeholder: '请输入流程分类',
         allowClear: true,
-        api: () => getCategorySimpleList(),
+        api: getCategorySimpleList,
         labelField: 'name',
         valueField: 'code',
       },
     },
-    // 流程状态
     {
       fieldName: 'status',
       label: '流程状态',
@@ -73,7 +70,6 @@ export function useGridFormSchema(): VbenFormSchema[] {
         allowClear: true,
       },
     },
-    // 发起时间
     {
       fieldName: 'createTime',
       label: '发起时间',
@@ -87,9 +83,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
 }
 
 /** 列表的字段 */
-export function useGridColumns(
+export function useGridColumns(): VxeTableGridOptions['columns'] {
-  onTaskClick: (task: BpmProcessInstanceApi.Task) => void,
-): VxeTableGridOptions['columns'] {
   return [
     {
       field: 'id',
@@ -103,27 +97,22 @@ export function useGridColumns(
       minWidth: 200,
       fixed: 'left',
     },
-
     {
       field: 'categoryName',
       title: '流程分类',
       minWidth: 120,
       fixed: 'left',
     },
-
     {
       field: 'startUser.nickname',
       title: '流程发起人',
       minWidth: 120,
     },
-
     {
       field: 'startUser.deptName',
       title: '发起部门',
       minWidth: 120,
     },
-
-    // 流程状态
     {
       field: 'status',
       title: '流程状态',
@@ -133,7 +122,6 @@ export function useGridColumns(
         props: { type: DICT_TYPE.BPM_PROCESS_INSTANCE_STATUS },
       },
     },
-
     {
       field: 'startTime',
       title: '发起时间',
@@ -152,29 +140,11 @@ export function useGridColumns(
       minWidth: 180,
       formatter: 'formatPast2',
     },
-
-    // 当前审批任务 tasks
     {
       field: 'tasks',
       title: '当前审批任务',
       minWidth: 320,
-      slots: {
+      slots: { default: 'tasks' },
-        default: ({ row }) => {
-          if (!row?.tasks?.length) return '-';
-
-          return row.tasks.map((task: BpmProcessInstanceApi.Task) =>
-            h(
-              Button,
-              {
-                type: 'link',
-                size: 'small',
-                onClick: () => onTaskClick(task),
-              },
-              { default: () => task.name },
-            ),
-          );
-        },
-      },
     },
     {
       title: '操作',

apps/web-antd/src/views/bpm/processInstance/manager/index.vue

@@ -7,7 +7,7 @@ import { h } from 'vue';
 import { DocAlert, Page, prompt } from '@vben/common-ui';
 import { BpmProcessInstanceStatus } from '@vben/constants';
 
-import { message, Textarea } from 'ant-design-vue';
+import { Button, message, Textarea } from 'ant-design-vue';
 
 import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
 import {
@@ -26,15 +26,19 @@ function handleRefresh() {
   gridApi.query();
 }
 
-/** 点击任务 */
+/** 查看任务详情 */
-function onTaskClick(task: BpmProcessInstanceApi.Task) {
+function handleTaskDetail(
-  // TODO 待实现
+  row: BpmProcessInstanceApi.ProcessInstance,
-  console.warn(task);
+  task: BpmProcessInstanceApi.Task,
+) {
+  router.push({
+    name: 'BpmProcessInstanceDetail',
+    query: { id: row.id, taskId: task.id },
+  });
 }
 
 /** 查看流程实例 */
 function handleDetail(row: BpmProcessInstanceApi.ProcessInstance) {
-  console.warn(row);
   router.push({
     name: 'BpmProcessInstanceDetail',
     query: { id: row.id },
@@ -44,36 +48,23 @@ function handleDetail(row: BpmProcessInstanceApi.ProcessInstance) {
 /** 取消流程实例 */
 function handleCancel(row: BpmProcessInstanceApi.ProcessInstance) {
   prompt({
-    async beforeClose(scope) {
-      if (scope.isConfirm) {
-        if (scope.value) {
-          try {
-            await cancelProcessInstanceByAdmin(row.id, scope.value);
-            message.success('取消成功');
-            handleRefresh();
-          } catch {
-            return false;
-          }
-        } else {
-          message.error('请输入取消原因');
-          return false;
-        }
-      }
-    },
     component: () => {
       return h(Textarea, {
         placeholder: '请输入取消原因',
         allowClear: true,
         rows: 2,
-        rules: [{ required: true, message: '请输入取消原因' }],
       });
     },
     content: '请输入取消原因',
     title: '取消流程',
     modelPropName: 'value',
-  })
+  }).then(async (reason) => {
-    .then(() => {})
+    if (reason) {
-    .catch(() => {});
+      await cancelProcessInstanceByAdmin(row.id, reason);
+      message.success('取消成功');
+      handleRefresh();
+    }
+  });
 }
 
 const [Grid, gridApi] = useVbenVxeGrid({
@@ -81,7 +72,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     schema: useGridFormSchema(),
   },
   gridOptions: {
-    columns: useGridColumns(onTaskClick),
+    columns: useGridColumns(),
     height: 'auto',
     keepSource: true,
     proxyConfig: {
@@ -97,6 +88,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,
@@ -113,6 +105,19 @@ const [Grid, gridApi] = useVbenVxeGrid({
     </template>
 
     <Grid table-title="流程实例">
+      <template #tasks="{ row }">
+        <template v-if="row.tasks && row.tasks.length > 0">
+          <Button
+            v-for="task in row.tasks"
+            :key="task.id"
+            type="link"
+            @click="handleTaskDetail(row, task)"
+          >
+            {{ task.name }}
+          </Button>
+        </template>
+        <span v-else>-</span>
+      </template>
       <template #actions="{ row }">
         <TableAction
           :actions="[

apps/web-antd/src/views/bpm/processListener/data.ts

@@ -64,6 +64,7 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'Select',
       componentProps: {
         options: getDictOptions(DICT_TYPE.BPM_PROCESS_LISTENER_TYPE, 'string'),
+        placeholder: '请选择类型',
         allowClear: true,
       },
       rules: 'required',
@@ -74,6 +75,7 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'Select',
       componentProps: {
         options: EVENT_OPTIONS,
+        placeholder: '请选择事件',
         allowClear: true,
       },
       rules: 'required',
@@ -97,6 +99,7 @@ export function useFormSchema(): VbenFormSchema[] {
           DICT_TYPE.BPM_PROCESS_LISTENER_VALUE_TYPE,
           'string',
         ),
+        placeholder: '请选择值类型',
         allowClear: true,
       },
       rules: 'required',
@@ -165,6 +168,15 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
         props: { type: DICT_TYPE.BPM_PROCESS_LISTENER_TYPE },
       },
     },
+    {
+      field: 'status',
+      title: '状态',
+      minWidth: 100,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.COMMON_STATUS },
+      },
+    },
     {
       field: 'event',
       title: '事件',
@@ -191,9 +203,8 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
       formatter: 'formatDateTime',
     },
     {
-      field: 'actions',
       title: '操作',
-      minWidth: 180,
+      width: 180,
       fixed: 'right',
       slots: { default: 'actions' },
     },

apps/web-antd/src/views/bpm/processListener/index.vue

@@ -44,11 +44,9 @@ async function handleDelete(row: BpmProcessListenerApi.ProcessListener) {
   });
   try {
     await deleteProcessListener(row.id as number);
-    message.success({
+    message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
-      content: $t('ui.actionMessage.deleteSuccess', [row.name]),
-    });
     handleRefresh();
-  } catch {
+  } finally {
     hideLoading();
   }
 }
@@ -74,6 +72,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,

apps/web-antd/src/views/bpm/processListener/modules/form.vue

@@ -55,9 +55,7 @@ const [Modal, modalApi] = useVbenModal({
       // 关闭并提示
       await modalApi.close();
       emit('success');
-      message.success({
+      message.success($t('ui.actionMessage.operationSuccess'));
-        content: $t('ui.actionMessage.operationSuccess'),
-      });
     } finally {
       modalApi.unlock();
     }

apps/web-antd/src/views/bpm/task/copy/data.ts

@@ -34,7 +34,6 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
       field: 'processInstanceName',
       title: '流程名称',
       minWidth: 200,
-      fixed: 'left',
     },
     {
       field: 'summary',
@@ -62,12 +61,12 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'activityName',
       title: '抄送节点',
-      minWidth: 180,
+      minWidth: 120,
     },
     {
       field: 'createUser.nickname',
       title: '抄送人',
-      minWidth: 180,
+      minWidth: 120,
       formatter: ({ cellValue }) => {
         return cellValue || '-';
       },

apps/web-antd/src/views/bpm/task/copy/index.vue

@@ -46,14 +46,12 @@ const [Grid] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,
       search: true,
     },
-    cellConfig: {
-      height: 64,
-    },
   } as VxeTableGridOptions<BpmProcessInstanceApi.Copy>,
 });
 </script>

apps/web-antd/src/views/bpm/task/done/data.ts

@@ -5,6 +5,7 @@ import { DICT_TYPE } from '@vben/constants';
 import { getDictOptions } from '@vben/hooks';
 
 import { getCategorySimpleList } from '#/api/bpm/category';
+import { getSimpleProcessDefinitionList } from '#/api/bpm/definition';
 import { getRangePickerDefaultProps } from '#/utils';
 
 /** 列表的搜索表单 */
@@ -20,12 +21,15 @@ export function useGridFormSchema(): VbenFormSchema[] {
       },
     },
     {
-      fieldName: 'processDefinitionId',
+      fieldName: 'processDefinitionKey',
       label: '所属流程',
-      component: 'Input',
+      component: 'ApiSelect',
       componentProps: {
-        placeholder: '请输入流程定义的编号',
+        placeholder: '请选择流程定义',
         allowClear: true,
+        api: getSimpleProcessDefinitionList,
+        labelField: 'name',
+        valueField: 'key',
       },
     },
     {
@@ -35,7 +39,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       componentProps: {
         placeholder: '请输入流程分类',
         allowClear: true,
-        api: () => getCategorySimpleList(),
+        api: getCategorySimpleList,
         labelField: 'name',
         valueField: 'code',
       },
@@ -69,7 +73,6 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
       field: 'processInstance.name',
       title: '流程',
       minWidth: 200,
-      fixed: 'left',
     },
     {
       field: 'processInstance.summary',
@@ -88,6 +91,12 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
       title: '发起人',
       minWidth: 120,
     },
+    {
+      field: 'processInstance.createTime',
+      title: '发起时间',
+      minWidth: 180,
+      formatter: 'formatDateTime',
+    },
     {
       field: 'name',
       title: '当前任务',

apps/web-antd/src/views/bpm/task/done/index.vue

@@ -6,6 +6,8 @@ import { DocAlert, Page } from '@vben/common-ui';
 
 import { message } from 'ant-design-vue';
 
+import { $t } from '#/locales';
+
 import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
 import { getTaskDonePage, withdrawTask } from '#/api/bpm/task';
 import { router } from '#/router';
@@ -27,10 +29,17 @@ function handleHistory(row: BpmTaskApi.TaskManager) {
 
 /** 撤回任务 */
 async function handleWithdraw(row: BpmTaskApi.TaskManager) {
-  await withdrawTask(row.id);
+  const hideLoading = message.loading({
-  message.success('撤回成功');
+    content: '正在撤回中...',
-  // 刷新表格数据
+    duration: 0,
-  await gridApi.query();
+  });
+  try {
+    await withdrawTask(row.id);
+    message.success('撤回成功');
+    await gridApi.query();
+  } finally {
+    hideLoading();
+  }
 }
 
 const [Grid, gridApi] = useVbenVxeGrid({
@@ -54,14 +63,12 @@ const [Grid, gridApi] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,
       search: true,
     },
-    cellConfig: {
-      height: 64,
-    },
   } as VxeTableGridOptions<BpmTaskApi.TaskManager>,
 });
 </script>
@@ -88,9 +95,12 @@ const [Grid, gridApi] = useVbenVxeGrid({
             {
               label: '撤回',
               type: 'link',
-              icon: ACTION_ICON.EDIT,
+              danger: true,
-              color: 'warning',
+              icon: ACTION_ICON.DELETE,
-              onClick: handleWithdraw.bind(null, row),
+              popConfirm: {
+                title: '确定要撤回该任务吗？',
+                confirm: handleWithdraw.bind(null, row),
+              },
             },
             {
               label: '历史',

apps/web-antd/src/views/bpm/task/manager/data.ts

@@ -36,7 +36,6 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
       field: 'processInstance.name',
       title: '流程',
       minWidth: 200,
-      fixed: 'left',
     },
     {
       field: 'processInstance.startUser.nickname',

apps/web-antd/src/views/bpm/task/manager/index.vue

@@ -43,14 +43,12 @@ const [Grid] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,
       search: true,
     },
-    cellConfig: {
-      height: 64,
-    },
   } as VxeTableGridOptions<BpmTaskApi.TaskManager>,
 });
 </script>
@@ -60,6 +58,7 @@ const [Grid] = useVbenVxeGrid({
     <template #doc>
       <DocAlert title="工作流手册" url="https://doc.iocoder.cn/bpm/" />
     </template>
+
     <Grid table-title="流程任务">
       <template #actions="{ row }">
         <TableAction

apps/web-antd/src/views/bpm/task/todo/data.ts

@@ -5,6 +5,7 @@ import { DICT_TYPE } from '@vben/constants';
 import { getDictOptions } from '@vben/hooks';
 
 import { getCategorySimpleList } from '#/api/bpm/category';
+import { getSimpleProcessDefinitionList } from '#/api/bpm/definition';
 import { getRangePickerDefaultProps } from '#/utils';
 
 /** 列表的搜索表单 */
@@ -20,12 +21,15 @@ export function useGridFormSchema(): VbenFormSchema[] {
       },
     },
     {
-      fieldName: 'processDefinitionId',
+      fieldName: 'processDefinitionKey',
       label: '所属流程',
-      component: 'Input',
+      component: 'ApiSelect',
       componentProps: {
-        placeholder: '请输入流程定义的编号',
+        placeholder: '请选择流程定义',
         allowClear: true,
+        api: getSimpleProcessDefinitionList,
+        labelField: 'name',
+        valueField: 'key',
       },
     },
     {
@@ -35,7 +39,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       componentProps: {
         placeholder: '请输入流程分类',
         allowClear: true,
-        api: () => getCategorySimpleList(),
+        api: getCategorySimpleList,
         labelField: 'name',
         valueField: 'code',
       },
@@ -72,7 +76,6 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
       field: 'processInstance.name',
       title: '流程',
       minWidth: 200,
-      fixed: 'left',
     },
     {
       field: 'processInstance.summary',
@@ -91,6 +94,12 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
       title: '发起人',
       minWidth: 120,
     },
+    {
+      field: 'processInstance.createTime',
+      title: '发起时间',
+      minWidth: 180,
+      formatter: 'formatDateTime',
+    },
     {
       field: 'name',
       title: '当前任务',

apps/web-antd/src/views/bpm/task/todo/index.vue

@@ -14,11 +14,10 @@ defineOptions({ name: 'BpmTodoTask' });
 
 /** 办理任务 */
 function handleAudit(row: BpmTaskApi.Task) {
-  console.warn(row);
   router.push({
     name: 'BpmProcessInstanceDetail',
     query: {
-      id: row.processInstance.id,
+      id: row.processInstance!.id,
       taskId: row.id,
     },
   });
@@ -45,14 +44,12 @@ const [Grid] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,
       search: true,
     },
-    cellConfig: {
-      height: 64,
-    },
   } as VxeTableGridOptions<BpmTaskApi.Task>,
 });
 </script>

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

@@ -40,7 +40,7 @@ export function useFormSchema(): VbenFormSchema[] {
         disabled: (values) => values.id,
       },
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
         placeholder: '请选择负责人',
@@ -54,7 +54,7 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '客户名称',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getCustomerSimpleList(),
+        api: getCustomerSimpleList,
         labelField: 'name',
         valueField: 'id',
         placeholder: '请选择客户',
@@ -80,7 +80,7 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '商机状态组',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getBusinessStatusTypeSimpleList(),
+        api: getBusinessStatusTypeSimpleList,
         labelField: 'name',
         valueField: 'id',
         placeholder: '请选择商机状态组',

apps/web-antd/src/views/crm/business/detail/data.ts

@@ -21,7 +21,7 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'totalPrice',
       label: '商机金额（元）',
-      content: (data) => erpPriceInputFormatter(data.totalPrice),
+      render: (val) => erpPriceInputFormatter(val),
     },
     {
       field: 'statusTypeName',
@@ -34,7 +34,7 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'createTime',
       label: '创建时间',
-      content: (data) => formatDateTime(data?.createTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
   ];
 }
@@ -53,17 +53,17 @@ export function useDetailBaseSchema(): DescriptionItemSchema[] {
     {
       field: 'totalPrice',
       label: '商机金额（元）',
-      content: (data) => erpPriceInputFormatter(data.totalPrice),
+      render: (val) => erpPriceInputFormatter(val),
     },
     {
       field: 'dealTime',
       label: '预计成交日期',
-      content: (data) => formatDateTime(data?.dealTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
     {
       field: 'contactNextTime',
       label: '下次联系时间',
-      content: (data) => formatDateTime(data?.contactNextTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
     {
       field: 'statusTypeName',

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

@@ -23,9 +23,9 @@ import { PermissionList, TransferForm } from '#/views/crm/permission';
 import { ProductDetailsList } from '#/views/crm/product/components';
 
 import Form from '../modules/form.vue';
-import UpStatusForm from './modules/status-form.vue';
 import { useDetailSchema } from './data';
 import BusinessDetailsInfo from './modules/info.vue';
+import UpStatusForm from './modules/status-form.vue';
 
 const route = useRoute();
 const router = useRouter();
@@ -38,11 +38,9 @@ const logList = ref<SystemOperateLogApi.OperateLog[]>([]);
 const permissionListRef = ref<InstanceType<typeof PermissionList>>(); // 团队成员列表 Ref
 
 const [Descriptions] = useDescription({
-  componentProps: {
+  bordered: false,
-    bordered: false,
+  column: 4,
-    column: 4,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailSchema(),
 });
 

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

@@ -12,31 +12,27 @@ defineProps<{
   business: CrmBusinessApi.Business; // 商机信息
 }>();
 
-const [BaseDescriptions] = useDescription({
+const [BaseDescription] = useDescription({
-  componentProps: {
+  title: '基本信息',
-    title: '基本信息',
+  bordered: false,
-    bordered: false,
+  column: 4,
-    column: 4,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailBaseSchema(),
 });
 
-const [SystemDescriptions] = useDescription({
+const [SystemDescription] = useDescription({
-  componentProps: {
+  title: '系统信息',
-    title: '系统信息',
+  bordered: false,
-    bordered: false,
+  column: 3,
-    column: 3,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useFollowUpDetailSchema(),
 });
 </script>
 
 <template>
   <div class="p-4">
-    <BaseDescriptions :data="business" />
+    <BaseDescription :data="business" />
     <Divider />
-    <SystemDescriptions :data="business" />
+    <SystemDescription :data="business" />
   </div>
 </template>

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

@@ -53,7 +53,7 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '负责人',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
         allowClear: true,
@@ -121,7 +121,7 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '地址',
       component: 'ApiTreeSelect',
       componentProps: {
-        api: () => getAreaTree(),
+        api: getAreaTree,
         fieldNames: { label: 'name', value: 'id', children: 'children' },
         placeholder: '请选择地址',
       },

apps/web-antd/src/views/crm/clue/detail/data.ts

@@ -13,10 +13,10 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'source',
       label: '线索来源',
-      content: (data) =>
+      render: (val) =>
         h(DictTag, {
           type: DICT_TYPE.CRM_CUSTOMER_SOURCE,
-          value: data?.source,
+          value: val,
         }),
     },
     {
@@ -30,7 +30,7 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'createTime',
       label: '创建时间',
-      content: (data) => formatDateTime(data?.createTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
   ];
 }
@@ -45,10 +45,10 @@ export function useDetailBaseSchema(): DescriptionItemSchema[] {
     {
       field: 'source',
       label: '客户来源',
-      content: (data) =>
+      render: (val) =>
         h(DictTag, {
           type: DICT_TYPE.CRM_CUSTOMER_SOURCE,
-          value: data?.source,
+          value: val,
         }),
     },
     {
@@ -66,8 +66,8 @@ export function useDetailBaseSchema(): DescriptionItemSchema[] {
     {
       field: 'areaName',
       label: '地址',
-      content: (data) => {
+      render: (val, data) => {
-        const areaName = data.areaName ?? '';
+        const areaName = val ?? '';
         const detailAddress = data?.detailAddress ?? '';
         return [areaName, detailAddress].filter((item) => !!item).join(' ');
       },
@@ -83,25 +83,25 @@ export function useDetailBaseSchema(): DescriptionItemSchema[] {
     {
       field: 'industryId',
       label: '客户行业',
-      content: (data) =>
+      render: (val) =>
         h(DictTag, {
           type: DICT_TYPE.CRM_CUSTOMER_INDUSTRY,
-          value: data?.industryId,
+          value: val,
         }),
     },
     {
       field: 'level',
       label: '客户级别',
-      content: (data) =>
+      render: (val) =>
         h(DictTag, {
           type: DICT_TYPE.CRM_CUSTOMER_LEVEL,
-          value: data?.level,
+          value: val,
         }),
     },
     {
       field: 'contactNextTime',
       label: '下次联系时间',
-      content: (data) => formatDateTime(data?.contactNextTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
     {
       field: 'remark',

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

@@ -34,11 +34,9 @@ const logList = ref<SystemOperateLogApi.OperateLog[]>([]); // 操作日志
 const permissionListRef = ref<InstanceType<typeof PermissionList>>(); // 团队成员列表 Ref
 
 const [Descriptions] = useDescription({
-  componentProps: {
+  bordered: false,
-    bordered: false,
+  column: 4,
-    column: 4,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailSchema(),
 });
 

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

@@ -13,22 +13,18 @@ defineProps<{
 }>();
 
 const [BaseDescriptions] = useDescription({
-  componentProps: {
+  title: '基本信息',
-    title: '基本信息',
+  bordered: false,
-    bordered: false,
+  column: 4,
-    column: 4,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailBaseSchema(),
 });
 
 const [SystemDescriptions] = useDescription({
-  componentProps: {
+  title: '系统信息',
-    title: '系统信息',
+  bordered: false,
-    bordered: false,
+  column: 3,
-    column: 3,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useFollowUpDetailSchema(),
 });
 </script>

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

@@ -41,7 +41,7 @@ export function useFormSchema(): VbenFormSchema[] {
         disabled: (values) => values.id,
       },
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
         placeholder: '请选择负责人',
@@ -54,7 +54,7 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'ApiSelect',
       rules: 'required',
       componentProps: {
-        api: () => getCustomerSimpleList(),
+        api: getCustomerSimpleList,
         labelField: 'name',
         valueField: 'id',
         placeholder: '请选择客户',
@@ -134,7 +134,7 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '直属上级',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleContactList(),
+        api: getSimpleContactList,
         labelField: 'name',
         valueField: 'id',
         placeholder: '请选择直属上级',
@@ -145,7 +145,7 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '地址',
       component: 'ApiTreeSelect',
       componentProps: {
-        api: () => getAreaTree(),
+        api: getAreaTree,
         fieldNames: { label: 'name', value: 'id', children: 'children' },
         placeholder: '请选择地址',
       },
@@ -188,7 +188,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       label: '客户',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getCustomerSimpleList(),
+        api: getCustomerSimpleList,
         labelField: 'name',
         valueField: 'id',
         placeholder: '请选择客户',

apps/web-antd/src/views/crm/contact/detail/data.ts

@@ -25,7 +25,7 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'createTime',
       label: '创建时间',
-      content: (data) => formatDateTime(data?.createTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
   ];
 }
@@ -64,10 +64,10 @@ export function useDetailBaseSchema(): DescriptionItemSchema[] {
     {
       field: 'areaName',
       label: '地址',
-      content: (data) => {
+      render: (val, data) => {
-        const areaName = data?.areaName ?? '';
+        const areaName = val ?? '';
         const detailAddress = data?.detailAddress ?? '';
-        return [areaName, detailAddress].filter(Boolean).join(' ');
+        return [areaName, detailAddress].filter((item) => !!item).join(' ');
       },
     },
     {
@@ -81,22 +81,22 @@ export function useDetailBaseSchema(): DescriptionItemSchema[] {
     {
       field: 'master',
       label: '关键决策人',
-      content: (data) =>
+      render: (val) =>
         h(DictTag, {
           type: DICT_TYPE.INFRA_BOOLEAN_STRING,
-          value: data?.master,
+          value: val,
         }),
     },
     {
       field: 'sex',
       label: '性别',
-      content: (data) =>
+      render: (val) =>
-        h(DictTag, { type: DICT_TYPE.SYSTEM_USER_SEX, value: data?.sex }),
+        h(DictTag, { type: DICT_TYPE.SYSTEM_USER_SEX, value: val }),
     },
     {
       field: 'contactNextTime',
       label: '下次联系时间',
-      content: (data) => formatDateTime(data?.contactNextTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
     {
       field: 'remark',

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

@@ -36,11 +36,9 @@ const logList = ref<SystemOperateLogApi.OperateLog[]>([]); // 操作日志
 const permissionListRef = ref<InstanceType<typeof PermissionList>>(); // 团队成员列表 Ref
 
 const [Descriptions] = useDescription({
-  componentProps: {
+  bordered: false,
-    bordered: false,
+  column: 4,
-    column: 4,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailSchema(),
 });
 

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

@@ -13,22 +13,18 @@ defineProps<{
 }>();
 
 const [BaseDescriptions] = useDescription({
-  componentProps: {
+  title: '基本信息',
-    title: '基本信息',
+  bordered: false,
-    bordered: false,
+  column: 4,
-    column: 4,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailBaseSchema(),
 });
 
 const [SystemDescriptions] = useDescription({
-  componentProps: {
+  title: '系统信息',
-    title: '系统信息',
+  bordered: false,
-    bordered: false,
+  column: 3,
-    column: 3,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useFollowUpDetailSchema(),
 });
 </script>

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

@@ -46,7 +46,7 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '负责人',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },
@@ -63,7 +63,7 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'ApiSelect',
       rules: 'required',
       componentProps: {
-        api: () => getCustomerSimpleList(),
+        api: getCustomerSimpleList,
         labelField: 'name',
         valueField: 'id',
         placeholder: '请选择客户',
@@ -137,7 +137,7 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '公司签约人',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },
@@ -263,7 +263,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       label: '客户',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getCustomerSimpleList(),
+        api: getCustomerSimpleList,
         labelField: 'name',
         valueField: 'id',
         placeholder: '请选择客户',

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

@@ -17,18 +17,17 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'totalPrice',
       label: '合同金额（元）',
-      content: (data) => erpPriceInputFormatter(data?.totalPrice) as string,
+      render: (val) => erpPriceInputFormatter(val) as string,
     },
     {
       field: 'orderDate',
       label: '下单时间',
-      content: (data) => formatDateTime(data?.orderDate) as string,
+      render: (val) => formatDateTime(val) as string,
     },
     {
       field: 'totalReceivablePrice',
       label: '回款金额（元）',
-      content: (data) =>
+      render: (val) => erpPriceInputFormatter(val) as string,
-        erpPriceInputFormatter(data?.totalReceivablePrice) as string,
     },
     {
       field: 'ownerUserName',
@@ -59,22 +58,22 @@ export function useDetailBaseSchema(): DescriptionItemSchema[] {
     {
       field: 'totalPrice',
       label: '合同金额（元）',
-      content: (data) => erpPriceInputFormatter(data?.totalPrice) as string,
+      render: (val) => erpPriceInputFormatter(val) as string,
     },
     {
       field: 'orderDate',
       label: '下单时间',
-      content: (data) => formatDateTime(data?.orderDate) as string,
+      render: (val) => formatDateTime(val) as string,
     },
     {
       field: 'startTime',
       label: '合同开始时间',
-      content: (data) => formatDateTime(data?.startTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
     {
       field: 'endTime',
       label: '合同结束时间',
-      content: (data) => formatDateTime(data?.endTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
     {
       field: 'signContactName',
@@ -91,10 +90,10 @@ export function useDetailBaseSchema(): DescriptionItemSchema[] {
     {
       field: 'auditStatus',
       label: '合同状态',
-      content: (data) =>
+      render: (val) =>
         h(DictTag, {
           type: DICT_TYPE.CRM_AUDIT_STATUS,
-          value: data?.auditStatus,
+          value: val,
         }),
     },
   ];

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

@@ -40,11 +40,9 @@ const logList = ref<SystemOperateLogApi.OperateLog[]>([]); // 操作日志
 const permissionListRef = ref<InstanceType<typeof PermissionList>>(); // 团队成员列表 Ref
 
 const [Descriptions] = useDescription({
-  componentProps: {
+  bordered: false,
-    bordered: false,
+  column: 4,
-    column: 4,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailSchema(),
 });
 

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

@@ -13,22 +13,18 @@ defineProps<{
 }>();
 
 const [BaseDescriptions] = useDescription({
-  componentProps: {
+  title: '基本信息',
-    title: '基本信息',
+  bordered: false,
-    bordered: false,
+  column: 4,
-    column: 4,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailBaseSchema(),
 });
 
 const [SystemDescriptions] = useDescription({
-  componentProps: {
+  title: '系统信息',
-    title: '系统信息',
+  bordered: false,
-    bordered: false,
+  column: 3,
-    column: 3,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useFollowUpDetailSchema(),
 });
 </script>

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

@@ -60,7 +60,7 @@ export function useFormSchema(): VbenFormSchema[] {
         disabled: (values) => values.id,
       },
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
         placeholder: '请选择负责人',
@@ -130,7 +130,7 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '地址',
       component: 'ApiTreeSelect',
       componentProps: {
-        api: () => getAreaTree(),
+        api: getAreaTree,
         fieldNames: { label: 'name', value: 'id', children: 'children' },
         placeholder: '请选择地址',
         allowClear: true,
@@ -220,7 +220,7 @@ export function useImportFormSchema(): VbenFormSchema[] {
       label: '负责人',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
         placeholder: '请选择负责人',

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

@@ -27,7 +27,7 @@ export function useDistributeFormSchema(): VbenFormSchema[] {
       label: '负责人',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },
@@ -43,13 +43,13 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'level',
       label: '客户级别',
-      content: (data) =>
+      render: (val) =>
-        h(DictTag, { type: DICT_TYPE.CRM_CUSTOMER_LEVEL, value: data?.level }),
+        h(DictTag, { type: DICT_TYPE.CRM_CUSTOMER_LEVEL, value: val }),
     },
     {
       field: 'dealStatus',
       label: '成交状态',
-      content: (data) => (data.dealStatus ? '已成交' : '未成交'),
+      render: (val) => (val ? '已成交' : '未成交'),
     },
     {
       field: 'ownerUserName',
@@ -58,7 +58,7 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'createTime',
       label: '创建时间',
-      content: (data) => formatDateTime(data?.createTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
   ];
 }
@@ -73,10 +73,10 @@ export function useDetailBaseSchema(): DescriptionItemSchema[] {
     {
       field: 'source',
       label: '客户来源',
-      content: (data) =>
+      render: (val) =>
         h(DictTag, {
           type: DICT_TYPE.CRM_CUSTOMER_SOURCE,
-          value: data?.source,
+          value: val,
         }),
     },
     {
@@ -94,8 +94,8 @@ export function useDetailBaseSchema(): DescriptionItemSchema[] {
     {
       field: 'areaName',
       label: '地址',
-      content: (data) => {
+      render: (val, data) => {
-        const areaName = data?.areaName ?? '';
+        const areaName = val ?? '';
         const detailAddress = data?.detailAddress ?? '';
         return [areaName, detailAddress].filter(Boolean).join(' ');
       },
@@ -111,16 +111,16 @@ export function useDetailBaseSchema(): DescriptionItemSchema[] {
     {
       field: 'industryId',
       label: '客户行业',
-      content: (data) =>
+      render: (val) =>
         h(DictTag, {
           type: DICT_TYPE.CRM_CUSTOMER_INDUSTRY,
-          value: data?.industryId,
+          value: val,
         }),
     },
     {
       field: 'contactNextTime',
       label: '下次联系时间',
-      content: (data) => formatDateTime(data?.contactNextTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
     {
       field: 'remark',

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

@@ -47,11 +47,9 @@ const logList = ref<SystemOperateLogApi.OperateLog[]>([]); // 操作日志
 const permissionListRef = ref<InstanceType<typeof PermissionList>>(); // 团队成员列表 Ref
 
 const [Descriptions] = useDescription({
-  componentProps: {
+  bordered: false,
-    bordered: false,
+  column: 4,
-    column: 4,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailSchema(),
 });
 

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

@@ -13,22 +13,18 @@ defineProps<{
 }>();
 
 const [BaseDescriptions] = useDescription({
-  componentProps: {
+  title: '基本信息',
-    title: '基本信息',
+  bordered: false,
-    bordered: false,
+  column: 4,
-    column: 4,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailBaseSchema(),
 });
 
 const [SystemDescriptions] = useDescription({
-  componentProps: {
+  title: '系统信息',
-    title: '系统信息',
+  bordered: false,
-    bordered: false,
+  column: 3,
-    column: 3,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useFollowUpDetailSchema(),
 });
 </script>

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

@@ -34,7 +34,7 @@ export function useFormSchema(confType: LimitConfType): VbenFormSchema[] {
       label: '规则适用人群',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
         mode: 'multiple',

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

@@ -173,7 +173,7 @@ export function useFollowUpDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'contactLastTime',
       label: '最后跟进时间',
-      content: (data) => formatDateTime(data?.contactLastTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
     {
       field: 'creatorName',
@@ -182,12 +182,12 @@ export function useFollowUpDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'createTime',
       label: '创建时间',
-      content: (data) => formatDateTime(data?.createTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
     {
       field: 'updateTime',
       label: '更新时间',
-      content: (data) => formatDateTime(data?.updateTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
   ];
 }

apps/web-antd/src/views/crm/permission/modules/data.ts

@@ -23,7 +23,7 @@ export function useTransferFormSchema(): VbenFormSchema[] {
       label: '选择新负责人',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },
@@ -116,7 +116,7 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '选择人员',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },

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

@@ -42,7 +42,7 @@ export function useFormSchema(): VbenFormSchema[] {
         disabled: (values) => values.id,
       },
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
         placeholder: '请选择负责人',

apps/web-antd/src/views/crm/product/detail/data.ts

@@ -17,13 +17,13 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'unit',
       label: '产品单位',
-      content: (data) =>
+      render: (val) =>
-        h(DictTag, { type: DICT_TYPE.CRM_PRODUCT_UNIT, value: data?.unit }),
+        h(DictTag, { type: DICT_TYPE.CRM_PRODUCT_UNIT, value: val }),
     },
     {
       field: 'price',
       label: '产品价格（元）',
-      content: (data) => erpPriceInputFormatter(data.price),
+      render: (val) => erpPriceInputFormatter(val),
     },
     {
       field: 'no',
@@ -46,7 +46,7 @@ export function useDetailBaseSchema(): DescriptionItemSchema[] {
     {
       field: 'price',
       label: '价格（元）',
-      content: (data) => erpPriceInputFormatter(data.price),
+      render: (val) => erpPriceInputFormatter(val),
     },
     {
       field: 'description',
@@ -59,14 +59,14 @@ export function useDetailBaseSchema(): DescriptionItemSchema[] {
     {
       field: 'status',
       label: '是否上下架',
-      content: (data) =>
+      render: (val) =>
-        h(DictTag, { type: DICT_TYPE.CRM_PRODUCT_STATUS, value: data?.status }),
+        h(DictTag, { type: DICT_TYPE.CRM_PRODUCT_STATUS, value: val }),
     },
     {
       field: 'unit',
       label: '产品单位',
-      content: (data) =>
+      render: (val) =>
-        h(DictTag, { type: DICT_TYPE.CRM_PRODUCT_UNIT, value: data?.unit }),
+        h(DictTag, { type: DICT_TYPE.CRM_PRODUCT_UNIT, value: val }),
     },
   ];
 }

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

@@ -29,11 +29,9 @@ const product = ref<CrmProductApi.Product>({} as CrmProductApi.Product); // 产
 const logList = ref<SystemOperateLogApi.OperateLog[]>([]); // 操作日志
 
 const [Descriptions] = useDescription({
-  componentProps: {
+  bordered: false,
-    bordered: false,
+  column: 4,
-    column: 4,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailSchema(),
 });
 

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

@@ -10,12 +10,10 @@ defineProps<{
 }>();
 
 const [ProductDescriptions] = useDescription({
-  componentProps: {
+  title: '基本信息',
-    title: '基本信息',
+  bordered: false,
-    bordered: false,
+  column: 4,
-    column: 4,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailBaseSchema(),
 });
 </script>

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

@@ -44,7 +44,7 @@ export function useFormSchema(): VbenFormSchema[] {
         disabled: (values) => values.id,
       },
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
         placeholder: '请选择负责人',
@@ -58,7 +58,7 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'ApiSelect',
       rules: 'required',
       componentProps: {
-        api: () => getCustomerSimpleList(),
+        api: getCustomerSimpleList,
         labelField: 'name',
         valueField: 'id',
         placeholder: '请选择客户',
@@ -188,7 +188,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       label: '客户',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getCustomerSimpleList(),
+        api: getCustomerSimpleList,
         labelField: 'name',
         valueField: 'id',
         placeholder: '请选择客户',

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

@@ -17,18 +17,18 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'totalPrice',
       label: '合同金额（元）',
-      content: (data) =>
+      render: (val, data) =>
-        erpPriceInputFormatter(data?.contract?.totalPrice ?? data.totalPrice),
+        erpPriceInputFormatter(val ?? data?.contract?.totalPrice ?? 0),
     },
     {
       field: 'returnTime',
       label: '回款日期',
-      content: (data) => formatDateTime(data?.returnTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
     {
       field: 'price',
       label: '回款金额（元）',
-      content: (data) => erpPriceInputFormatter(data.price),
+      render: (val) => erpPriceInputFormatter(val),
     },
     {
       field: 'ownerUserName',
@@ -51,25 +51,26 @@ export function useDetailBaseSchema(): DescriptionItemSchema[] {
     {
       field: 'contract',
       label: '合同编号',
-      content: (data) => data?.contract?.no,
+      render: (val, data) =>
+        val && data?.contract?.no ? data?.contract?.no : '',
     },
     {
       field: 'returnTime',
       label: '回款日期',
-      content: (data) => formatDateTime(data?.returnTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
     {
       field: 'price',
       label: '回款金额',
-      content: (data) => erpPriceInputFormatter(data.price),
+      render: (val) => erpPriceInputFormatter(val),
     },
     {
       field: 'returnType',
       label: '回款方式',
-      content: (data) =>
+      render: (val) =>
         h(DictTag, {
           type: DICT_TYPE.CRM_RECEIVABLE_RETURN_TYPE,
-          value: data?.returnType,
+          value: val,
         }),
     },
     {
@@ -93,12 +94,12 @@ export function useDetailSystemSchema(): DescriptionItemSchema[] {
     {
       field: 'createTime',
       label: '创建时间',
-      content: (data) => formatDateTime(data?.createTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
     {
       field: 'updateTime',
       label: '更新时间',
-      content: (data) => formatDateTime(data?.updateTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
   ];
 }

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

@@ -38,11 +38,9 @@ const logList = ref<SystemOperateLogApi.OperateLog[]>([]); // 操作日志
 const permissionListRef = ref<InstanceType<typeof PermissionList>>(); // 团队成员列表 Ref
 
 const [Descriptions] = useDescription({
-  componentProps: {
+  bordered: false,
-    bordered: false,
+  column: 4,
-    column: 4,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailSchema(),
 });
 

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

@@ -12,22 +12,18 @@ defineProps<{
 }>();
 
 const [BaseDescriptions] = useDescription({
-  componentProps: {
+  title: '基本信息',
-    title: '基本信息',
+  bordered: false,
-    bordered: false,
+  column: 4,
-    column: 4,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailBaseSchema(),
 });
 
 const [SystemDescriptions] = useDescription({
-  componentProps: {
+  title: '系统信息',
-    title: '系统信息',
+  bordered: false,
-    bordered: false,
+  column: 3,
-    column: 3,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailSystemSchema(),
 });
 </script>

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

@@ -28,7 +28,7 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '负责人',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },
@@ -45,7 +45,7 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'ApiSelect',
       rules: 'required',
       componentProps: {
-        api: () => getCustomerSimpleList(),
+        api: getCustomerSimpleList,
         labelField: 'name',
         valueField: 'id',
         placeholder: '请选择客户',
@@ -153,7 +153,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       label: '客户',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getCustomerSimpleList(),
+        api: getCustomerSimpleList,
         labelField: 'name',
         valueField: 'id',
         placeholder: '请选择客户',

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

@@ -21,17 +21,17 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'price',
       label: '计划回款金额',
-      content: (data) => erpPriceInputFormatter(data.price),
+      render: (val) => erpPriceInputFormatter(val),
     },
     {
       field: 'returnTime',
       label: '计划回款日期',
-      content: (data) => formatDateTime(data?.returnTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
     {
       field: 'receivable',
       label: '实际回款金额',
-      content: (data) => erpPriceInputFormatter(data?.receivable?.price ?? 0),
+      render: (val) => erpPriceInputFormatter(val?.price ?? 0),
     },
   ];
 }
@@ -54,20 +54,20 @@ export function useDetailBaseSchema(): DescriptionItemSchema[] {
     {
       field: 'returnTime',
       label: '计划回款日期',
-      content: (data) => formatDateTime(data?.returnTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
     {
       field: 'price',
       label: '计划回款金额',
-      content: (data) => erpPriceInputFormatter(data.price),
+      render: (val) => erpPriceInputFormatter(val),
     },
     {
       field: 'returnType',
       label: '计划回款方式',
-      content: (data) =>
+      render: (val) =>
         h(DictTag, {
           type: DICT_TYPE.CRM_RECEIVABLE_RETURN_TYPE,
-          value: data?.returnType,
+          value: val,
         }),
     },
     {
@@ -77,20 +77,20 @@ export function useDetailBaseSchema(): DescriptionItemSchema[] {
     {
       field: 'receivable',
       label: '实际回款金额',
-      content: (data) => erpPriceInputFormatter(data?.receivable?.price ?? 0),
+      render: (val) => erpPriceInputFormatter(val ?? 0),
     },
     {
       field: 'receivableRemain',
       label: '未回款金额',
-      content: (data) => {
+      render: (val, data) => {
         const paid = data?.receivable?.price ?? 0;
-        return erpPriceInputFormatter(Math.max(data.price - paid, 0));
+        return erpPriceInputFormatter(Math.max(val - paid, 0));
       },
     },
     {
       field: 'receivable.returnTime',
       label: '实际回款日期',
-      content: (data) => formatDateTime(data?.receivable?.returnTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
     {
       field: 'remark',
@@ -113,12 +113,12 @@ export function useDetailSystemSchema(): DescriptionItemSchema[] {
     {
       field: 'createTime',
       label: '创建时间',
-      content: (data) => formatDateTime(data?.createTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
     {
       field: 'updateTime',
       label: '更新时间',
-      content: (data) => formatDateTime(data?.updateTime) as string,
+      render: (val) => formatDateTime(val) as string,
     },
   ];
 }

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

@@ -39,11 +39,9 @@ const permissionListRef = ref<InstanceType<typeof PermissionList>>(); // 团队
 const validateWrite = () => permissionListRef.value?.validateWrite;
 
 const [Descriptions] = useDescription({
-  componentProps: {
+  bordered: false,
-    bordered: false,
+  column: 4,
-    column: 4,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailSchema(),
 });
 

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

@@ -12,22 +12,18 @@ defineProps<{
 }>();
 
 const [BaseDescriptions] = useDescription({
-  componentProps: {
+  title: '基本信息',
-    title: '基本信息',
+  bordered: false,
-    bordered: false,
+  column: 4,
-    column: 4,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailBaseSchema(),
 });
 
 const [SystemDescriptions] = useDescription({
-  componentProps: {
+  title: '系统信息',
-    title: '系统信息',
+  bordered: false,
-    bordered: false,
+  column: 3,
-    column: 3,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailSystemSchema(),
 });
 </script>

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

@@ -99,7 +99,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       label: '员工',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
         placeholder: '请选择员工',

apps/web-antd/src/views/crm/statistics/funnel/data.ts

@@ -73,7 +73,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       label: '员工',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         allowClear: true,
         labelField: 'nickname',
         valueField: 'id',

apps/web-antd/src/views/crm/statistics/performance/data.ts

@@ -64,7 +64,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       label: '员工',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
         placeholder: '请选择员工',

apps/web-antd/src/views/crm/statistics/portrait/data.ts

@@ -68,7 +68,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       label: '员工',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
         placeholder: '请选择员工',

apps/web-antd/src/views/erp/finance/payment/data.ts

@@ -52,7 +52,7 @@ export function useFormSchema(formType: string): VbenFormSchema[] {
         placeholder: '请选择供应商',
         allowClear: true,
         showSearch: true,
-        api: () => getSupplierSimpleList(),
+        api: getSupplierSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -66,7 +66,7 @@ export function useFormSchema(formType: string): VbenFormSchema[] {
         placeholder: '请选择财务人员',
         allowClear: true,
         showSearch: true,
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },
@@ -119,7 +119,7 @@ export function useFormSchema(formType: string): VbenFormSchema[] {
         placeholder: '请选择付款账户',
         allowClear: true,
         showSearch: true,
-        api: () => getAccountSimpleList(),
+        api: getAccountSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -241,7 +241,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择供应商',
         allowClear: true,
         showSearch: true,
-        api: () => getSupplierSimpleList(),
+        api: getSupplierSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -254,7 +254,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择创建人',
         allowClear: true,
         showSearch: true,
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },
@@ -267,7 +267,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择财务人员',
         allowClear: true,
         showSearch: true,
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },
@@ -280,7 +280,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择付款账户',
         allowClear: true,
         showSearch: true,
-        api: () => getAccountSimpleList(),
+        api: getAccountSimpleList,
         labelField: 'name',
         valueField: 'id',
       },

apps/web-antd/src/views/erp/finance/receipt/data.ts

@@ -52,7 +52,7 @@ export function useFormSchema(formType: string): VbenFormSchema[] {
         placeholder: '请选择客户',
         allowClear: true,
         showSearch: true,
-        api: () => getCustomerSimpleList(),
+        api: getCustomerSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -66,7 +66,7 @@ export function useFormSchema(formType: string): VbenFormSchema[] {
         placeholder: '请选择财务人员',
         allowClear: true,
         showSearch: true,
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },
@@ -119,7 +119,7 @@ export function useFormSchema(formType: string): VbenFormSchema[] {
         placeholder: '请选择收款账户',
         allowClear: true,
         showSearch: true,
-        api: () => getAccountSimpleList(),
+        api: getAccountSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -241,7 +241,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择客户',
         allowClear: true,
         showSearch: true,
-        api: () => getCustomerSimpleList(),
+        api: getCustomerSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -254,7 +254,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择创建人',
         allowClear: true,
         showSearch: true,
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },
@@ -267,7 +267,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择财务人员',
         allowClear: true,
         showSearch: true,
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },
@@ -280,7 +280,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择收款账户',
         allowClear: true,
         showSearch: true,
-        api: () => getAccountSimpleList(),
+        api: getAccountSimpleList,
         labelField: 'name',
         valueField: 'id',
       },

apps/web-antd/src/views/erp/product/product/data.ts

@@ -61,7 +61,7 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '单位',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getProductUnitSimpleList(),
+        api: getProductUnitSimpleList,
         labelField: 'name',
         valueField: 'id',
         placeholder: '请选择单位',

apps/web-antd/src/views/erp/purchase/in/data.ts

@@ -66,7 +66,7 @@ export function useFormSchema(formType: string): VbenFormSchema[] {
         placeholder: '请选择供应商',
         allowClear: true,
         showSearch: true,
-        api: () => getSupplierSimpleList(),
+        api: getSupplierSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -174,7 +174,7 @@ export function useFormSchema(formType: string): VbenFormSchema[] {
         placeholder: '请选择结算账户',
         allowClear: true,
         showSearch: true,
-        api: () => getAccountSimpleList(),
+        api: getAccountSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -319,7 +319,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择产品',
         allowClear: true,
         showSearch: true,
-        api: () => getProductSimpleList(),
+        api: getProductSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -341,7 +341,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择供应商',
         allowClear: true,
         showSearch: true,
-        api: () => getSupplierSimpleList(),
+        api: getSupplierSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -354,7 +354,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择仓库',
         allowClear: true,
         showSearch: true,
-        api: () => getWarehouseSimpleList(),
+        api: getWarehouseSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -367,7 +367,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择创建人',
         allowClear: true,
         showSearch: true,
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },
@@ -389,7 +389,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择结算账户',
         allowClear: true,
         showSearch: true,
-        api: () => getAccountSimpleList(),
+        api: getAccountSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -530,7 +530,7 @@ export function useOrderGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择产品',
         allowClear: true,
         showSearch: true,
-        api: () => getProductSimpleList(),
+        api: getProductSimpleList,
         labelField: 'name',
         valueField: 'id',
       },

apps/web-antd/src/views/erp/purchase/order/data.ts

@@ -52,7 +52,7 @@ export function useFormSchema(formType: string): VbenFormSchema[] {
         placeholder: '请选择供应商',
         allowClear: true,
         showSearch: true,
-        api: () => getSupplierSimpleList(),
+        api: getSupplierSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -140,7 +140,7 @@ export function useFormSchema(formType: string): VbenFormSchema[] {
         placeholder: '请选择结算账户',
         allowClear: true,
         showSearch: true,
-        api: () => getAccountSimpleList(),
+        api: getAccountSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -261,7 +261,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择产品',
         allowClear: true,
         showSearch: true,
-        api: () => getProductSimpleList(),
+        api: getProductSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -283,7 +283,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择供应商',
         allowClear: true,
         showSearch: true,
-        api: () => getSupplierSimpleList(),
+        api: getSupplierSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -296,7 +296,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择创建人',
         allowClear: true,
         showSearch: true,
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },

apps/web-antd/src/views/erp/purchase/return/data.ts

@@ -66,7 +66,7 @@ export function useFormSchema(formType: string): VbenFormSchema[] {
         placeholder: '请选择供应商',
         allowClear: true,
         showSearch: true,
-        api: () => getSupplierSimpleList(),
+        api: getSupplierSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -173,7 +173,7 @@ export function useFormSchema(formType: string): VbenFormSchema[] {
         placeholder: '请选择结算账户',
         allowClear: true,
         showSearch: true,
-        api: () => getAccountSimpleList(),
+        api: getAccountSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -319,7 +319,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择产品',
         allowClear: true,
         showSearch: true,
-        api: () => getProductSimpleList(),
+        api: getProductSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -341,7 +341,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择供应商',
         allowClear: true,
         showSearch: true,
-        api: () => getSupplierSimpleList(),
+        api: getSupplierSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -354,7 +354,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择仓库',
         allowClear: true,
         showSearch: true,
-        api: () => getWarehouseSimpleList(),
+        api: getWarehouseSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -367,7 +367,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择创建人',
         allowClear: true,
         showSearch: true,
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },
@@ -516,7 +516,7 @@ export function useOrderGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择产品',
         allowClear: true,
         showSearch: true,
-        api: () => getProductSimpleList(),
+        api: getProductSimpleList,
         labelField: 'name',
         valueField: 'id',
       },

apps/web-antd/src/views/erp/sale/order/data.ts

@@ -52,7 +52,7 @@ export function useFormSchema(formType: string): VbenFormSchema[] {
         placeholder: '请选择客户',
         allowClear: true,
         showSearch: true,
-        api: () => getCustomerSimpleList(),
+        api: getCustomerSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -66,7 +66,7 @@ export function useFormSchema(formType: string): VbenFormSchema[] {
         placeholder: '请选择销售人员',
         allowClear: true,
         showSearch: true,
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },
@@ -153,7 +153,7 @@ export function useFormSchema(formType: string): VbenFormSchema[] {
         placeholder: '请选择结算账户',
         allowClear: true,
         showSearch: true,
-        api: () => getAccountSimpleList(),
+        api: getAccountSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -275,7 +275,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择产品',
         allowClear: true,
         showSearch: true,
-        api: () => getProductSimpleList(),
+        api: getProductSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -297,7 +297,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择客户',
         allowClear: true,
         showSearch: true,
-        api: () => getCustomerSimpleList(),
+        api: getCustomerSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -310,7 +310,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择创建人',
         allowClear: true,
         showSearch: true,
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },

apps/web-antd/src/views/erp/sale/out/data.ts

@@ -544,7 +544,7 @@ export function useOrderGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择产品',
         allowClear: true,
         showSearch: true,
-        api: () => getProductSimpleList(),
+        api: getProductSimpleList,
         labelField: 'name',
         valueField: 'id',
       },

apps/web-antd/src/views/erp/sale/return/data.ts

@@ -66,7 +66,7 @@ export function useFormSchema(formType: string): VbenFormSchema[] {
         placeholder: '请选择客户',
         allowClear: true,
         showSearch: true,
-        api: () => getCustomerSimpleList(),
+        api: getCustomerSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -80,7 +80,7 @@ export function useFormSchema(formType: string): VbenFormSchema[] {
         placeholder: '请选择销售人员',
         allowClear: true,
         showSearch: true,
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },
@@ -187,7 +187,7 @@ export function useFormSchema(formType: string): VbenFormSchema[] {
         disabled: true,
         allowClear: true,
         showSearch: true,
-        api: () => getAccountSimpleList(),
+        api: getAccountSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -333,7 +333,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择产品',
         allowClear: true,
         showSearch: true,
-        api: () => getProductSimpleList(),
+        api: getProductSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -355,7 +355,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择客户',
         allowClear: true,
         showSearch: true,
-        api: () => getCustomerSimpleList(),
+        api: getCustomerSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -368,7 +368,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择仓库',
         allowClear: true,
         showSearch: true,
-        api: () => getWarehouseSimpleList(),
+        api: getWarehouseSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -381,7 +381,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择创建人',
         allowClear: true,
         showSearch: true,
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },
@@ -531,7 +531,7 @@ export function useOrderGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择产品',
         allowClear: true,
         showSearch: true,
-        api: () => getProductSimpleList(),
+        api: getProductSimpleList,
         labelField: 'name',
         valueField: 'id',
       },

apps/web-antd/src/views/erp/stock/check/data.ts

@@ -180,7 +180,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择产品',
         allowClear: true,
         showSearch: true,
-        api: () => getProductSimpleList(),
+        api: getProductSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -202,7 +202,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择仓库',
         allowClear: true,
         showSearch: true,
-        api: () => getWarehouseSimpleList(),
+        api: getWarehouseSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -215,7 +215,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择创建人',
         allowClear: true,
         showSearch: true,
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },

apps/web-antd/src/views/erp/stock/in/data.ts

@@ -50,7 +50,7 @@ export function useFormSchema(formType: string): VbenFormSchema[] {
         placeholder: '请选择供应商',
         allowClear: true,
         showSearch: true,
-        api: () => getSupplierSimpleList(),
+        api: getSupplierSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -187,7 +187,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择产品',
         allowClear: true,
         showSearch: true,
-        api: () => getProductSimpleList(),
+        api: getProductSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -209,7 +209,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择供应商',
         allowClear: true,
         showSearch: true,
-        api: () => getSupplierSimpleList(),
+        api: getSupplierSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -222,7 +222,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择仓库',
         allowClear: true,
         showSearch: true,
-        api: () => getWarehouseSimpleList(),
+        api: getWarehouseSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -235,7 +235,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择创建人',
         allowClear: true,
         showSearch: true,
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },

apps/web-antd/src/views/erp/stock/move/data.ts

@@ -178,7 +178,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择产品',
         allowClear: true,
         showSearch: true,
-        api: () => getProductSimpleList(),
+        api: getProductSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -200,7 +200,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择调出仓库',
         allowClear: true,
         showSearch: true,
-        api: () => getWarehouseSimpleList(),
+        api: getWarehouseSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -213,7 +213,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择调入仓库',
         allowClear: true,
         showSearch: true,
-        api: () => getWarehouseSimpleList(),
+        api: getWarehouseSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -226,7 +226,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择创建人',
         allowClear: true,
         showSearch: true,
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
       },

apps/web-antd/src/views/erp/stock/record/data.ts

@@ -19,7 +19,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择产品',
         allowClear: true,
         showSearch: true,
-        api: () => getProductSimpleList(),
+        api: getProductSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -32,7 +32,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择仓库',
         allowClear: true,
         showSearch: true,
-        api: () => getWarehouseSimpleList(),
+        api: getWarehouseSimpleList,
         labelField: 'name',
         valueField: 'id',
       },

apps/web-antd/src/views/erp/stock/stock/data.ts

@@ -15,7 +15,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择产品',
         allowClear: true,
         showSearch: true,
-        api: () => getProductSimpleList(),
+        api: getProductSimpleList,
         labelField: 'name',
         valueField: 'id',
       },
@@ -28,7 +28,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         placeholder: '请选择仓库',
         allowClear: true,
         showSearch: true,
-        api: () => getWarehouseSimpleList(),
+        api: getWarehouseSimpleList,
         labelField: 'name',
         valueField: 'id',
       },

apps/web-antd/src/views/infra/apiAccessLog/data.ts

@@ -1,6 +1,5 @@
 import type { VbenFormSchema } from '#/adapter/form';
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
-import type { InfraApiAccessLogApi } from '#/api/infra/api-access-log';
 import type { DescriptionItemSchema } from '#/components/description';
 
 import { h } from 'vue';
@@ -181,10 +180,10 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'userType',
       label: '用户类型',
-      content: (data: InfraApiAccessLogApi.ApiAccessLog) => {
+      render: (val) => {
         return h(DictTag, {
           type: DICT_TYPE.USER_TYPE,
-          value: data.userType,
+          value: val,
         });
       },
     },
@@ -198,9 +197,10 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     },
     {
       label: '请求信息',
-      content: (data: InfraApiAccessLogApi.ApiAccessLog) => {
+      field: 'requestMethod',
-        if (data?.requestMethod && data?.requestUrl) {
+      render: (val, data) => {
-          return `${data.requestMethod} ${data.requestUrl}`;
+        if (val && data?.requestUrl) {
+          return `${val} ${data.requestUrl}`;
         }
         return '';
       },
@@ -208,10 +208,10 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'requestParams',
       label: '请求参数',
-      content: (data: InfraApiAccessLogApi.ApiAccessLog) => {
+      render: (val) => {
-        if (data.requestParams) {
+        if (val) {
           return h(JsonViewer, {
-            value: JSON.parse(data.requestParams),
+            value: JSON.parse(val),
             previewMode: true,
           });
         }
@@ -224,26 +224,29 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     },
     {
       label: '请求时间',
-      content: (data: InfraApiAccessLogApi.ApiAccessLog) => {
+      field: 'beginTime',
-        if (data?.beginTime && data?.endTime) {
+      render: (val, data) => {
-          return `${formatDateTime(data.beginTime)} ~ ${formatDateTime(data.endTime)}`;
+        if (val && data?.endTime) {
+          return `${formatDateTime(val)} ~ ${formatDateTime(data.endTime)}`;
         }
         return '';
       },
     },
     {
       label: '请求耗时',
-      content: (data: InfraApiAccessLogApi.ApiAccessLog) => {
+      field: 'duration',
-        return data?.duration ? `${data.duration} ms` : '';
+      render: (val) => {
+        return val ? `${val} ms` : '';
       },
     },
     {
       label: '操作结果',
-      content: (data: InfraApiAccessLogApi.ApiAccessLog) => {
+      field: 'resultCode',
-        if (data?.resultCode === 0) {
+      render: (val, data) => {
+        if (val === 0) {
           return '正常';
-        } else if (data && data.resultCode > 0) {
+        } else if (val > 0 && data?.resultMsg) {
-          return `失败 | ${data.resultCode} | ${data.resultMsg}`;
+          return `失败 | ${val} | ${data.resultMsg}`;
         }
         return '';
       },
@@ -259,10 +262,10 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'operateType',
       label: '操作类型',
-      content: (data: InfraApiAccessLogApi.ApiAccessLog) => {
+      render: (val) => {
         return h(DictTag, {
           type: DICT_TYPE.INFRA_OPERATE_TYPE,
-          value: data?.operateType,
+          value: val,
         });
       },
     },

apps/web-antd/src/views/infra/apiAccessLog/modules/detail.vue

@@ -12,11 +12,9 @@ import { useDetailSchema } from '../data';
 const formData = ref<InfraApiAccessLogApi.ApiAccessLog>();
 
 const [Descriptions] = useDescription({
-  componentProps: {
+  bordered: true,
-    bordered: true,
+  column: 1,
-    column: 1,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailSchema(),
 });
 

apps/web-antd/src/views/infra/apiErrorLog/data.ts

@@ -1,6 +1,5 @@
 import type { VbenFormSchema } from '#/adapter/form';
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
-import type { InfraApiErrorLogApi } from '#/api/infra/api-error-log';
 import type { DescriptionItemSchema } from '#/components/description';
 
 import { h } from 'vue';
@@ -158,10 +157,10 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'userType',
       label: '用户类型',
-      content: (data: InfraApiErrorLogApi.ApiErrorLog) => {
+      render: (val) => {
         return h(DictTag, {
           type: DICT_TYPE.USER_TYPE,
-          value: data.userType,
+          value: val,
         });
       },
     },
@@ -176,9 +175,9 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'requestMethod',
       label: '请求信息',
-      content: (data: InfraApiErrorLogApi.ApiErrorLog) => {
+      render: (val, data) => {
-        if (data?.requestMethod && data?.requestUrl) {
+        if (val && data?.requestUrl) {
-          return `${data.requestMethod} ${data.requestUrl}`;
+          return `${val} ${data.requestUrl}`;
         }
         return '';
       },
@@ -186,10 +185,10 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'requestParams',
       label: '请求参数',
-      content: (data: InfraApiErrorLogApi.ApiErrorLog) => {
+      render: (val) => {
-        if (data.requestParams) {
+        if (val) {
           return h(JsonViewer, {
-            value: JSON.parse(data.requestParams),
+            value: JSON.parse(val),
             previewMode: true,
           });
         }
@@ -199,8 +198,8 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'exceptionTime',
       label: '异常时间',
-      content: (data: InfraApiErrorLogApi.ApiErrorLog) => {
+      render: (val) => {
-        return formatDateTime(data?.exceptionTime || '') as string;
+        return formatDateTime(val) as string;
       },
     },
     {
@@ -210,12 +209,11 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'exceptionStackTrace',
       label: '异常堆栈',
-      hidden: (data: InfraApiErrorLogApi.ApiErrorLog) =>
+      show: (val) => !val,
-        !data?.exceptionStackTrace,
+      render: (val) => {
-      content: (data: InfraApiErrorLogApi.ApiErrorLog) => {
+        if (val) {
-        if (data?.exceptionStackTrace) {
           return h('textarea', {
-            value: data.exceptionStackTrace,
+            value: val,
             style:
               'width: 100%; min-height: 200px; max-height: 400px; resize: vertical;',
             readonly: true,
@@ -227,24 +225,24 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'processStatus',
       label: '处理状态',
-      content: (data: InfraApiErrorLogApi.ApiErrorLog) => {
+      render: (val) => {
         return h(DictTag, {
           type: DICT_TYPE.INFRA_API_ERROR_LOG_PROCESS_STATUS,
-          value: data?.processStatus,
+          value: val,
         });
       },
     },
     {
       field: 'processUserId',
       label: '处理人',
-      hidden: (data: InfraApiErrorLogApi.ApiErrorLog) => !data?.processUserId,
+      show: (val) => !val,
     },
     {
       field: 'processTime',
       label: '处理时间',
-      hidden: (data: InfraApiErrorLogApi.ApiErrorLog) => !data?.processTime,
+      show: (val) => !val,
-      content: (data: InfraApiErrorLogApi.ApiErrorLog) => {
+      render: (val) => {
-        return formatDateTime(data?.processTime || '') as string;
+        return formatDateTime(val) as string;
       },
     },
   ];

apps/web-antd/src/views/infra/apiErrorLog/modules/detail.vue

@@ -12,11 +12,9 @@ import { useDetailSchema } from '../data';
 const formData = ref<InfraApiErrorLogApi.ApiErrorLog>();
 
 const [Descriptions] = useDescription({
-  componentProps: {
+  bordered: true,
-    bordered: true,
+  column: 1,
-    column: 1,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailSchema(),
 });
 

apps/web-antd/src/views/infra/codegen/data.ts

@@ -25,7 +25,7 @@ export function useImportTableFormSchema(): VbenFormSchema[] {
       label: '数据源',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getDataSourceConfigList(),
+        api: getDataSourceConfigList,
         labelField: 'name',
         valueField: 'id',
         autoSelect: 'first',

apps/web-antd/src/views/infra/job/data.ts

@@ -1,6 +1,5 @@
 import type { VbenFormSchema } from '#/adapter/form';
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
-import type { InfraJobApi } from '#/api/infra/job';
 import type { DescriptionItemSchema } from '#/components/description';
 
 import { h, markRaw } from 'vue';
@@ -191,10 +190,10 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'status',
       label: '任务状态',
-      content: (data: InfraJobApi.Job) => {
+      render: (val) => {
         return h(DictTag, {
           type: DICT_TYPE.INFRA_JOB_STATUS,
-          value: data?.status,
+          value: val,
         });
       },
     },
@@ -216,27 +215,27 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     },
     {
       label: '重试间隔',
-      content: (data: InfraJobApi.Job) => {
+      field: 'retryInterval',
-        return data?.retryInterval ? `${data.retryInterval} 毫秒` : '无间隔';
+      render: (val) => {
+        return val ? `${val} 毫秒` : '无间隔';
       },
     },
     {
       label: '监控超时时间',
-      content: (data: InfraJobApi.Job) => {
+      field: 'monitorTimeout',
-        return data?.monitorTimeout && data.monitorTimeout > 0
+      render: (val) => {
-          ? `${data.monitorTimeout} 毫秒`
+        return val && val > 0 ? `${val} 毫秒` : '未开启';
-          : '未开启';
       },
     },
     {
       field: 'nextTimes',
       label: '后续执行时间',
-      content: (data: InfraJobApi.Job) => {
+      render: (val) => {
-        if (!data?.nextTimes || data.nextTimes.length === 0) {
+        if (!val || val.length === 0) {
           return '无后续执行时间';
         }
         return h(Timeline, {}, () =>
-          data.nextTimes?.map((time: Date) =>
+          val?.map((time: Date) =>
             h(Timeline.Item, {}, () => formatDateTime(time)),
           ),
         );

apps/web-antd/src/views/infra/job/logger/data.ts

@@ -1,6 +1,5 @@
 import type { VbenFormSchema } from '#/adapter/form';
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
-import type { InfraJobLogApi } from '#/api/infra/job-log';
 import type { DescriptionItemSchema } from '#/components/description';
 
 import { h } from 'vue';
@@ -154,9 +153,9 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'beginTime',
       label: '执行时间',
-      content: (data: InfraJobLogApi.JobLog) => {
+      render: (val, data) => {
-        if (data?.beginTime && data?.endTime) {
+        if (val && data?.endTime) {
-          return `${formatDateTime(data.beginTime)} ~ ${formatDateTime(data.endTime)}`;
+          return `${formatDateTime(val)} ~ ${formatDateTime(data.endTime)}`;
         }
         return '';
       },
@@ -164,17 +163,17 @@ export function useDetailSchema(): DescriptionItemSchema[] {
     {
       field: 'duration',
       label: '执行时长',
-      content: (data: InfraJobLogApi.JobLog) => {
+      render: (val) => {
-        return data?.duration ? `${data.duration} 毫秒` : '';
+        return val ? `${val} 毫秒` : '';
       },
     },
     {
       field: 'status',
       label: '任务状态',
-      content: (data: InfraJobLogApi.JobLog) => {
+      render: (val) => {
         return h(DictTag, {
           type: DICT_TYPE.INFRA_JOB_LOG_STATUS,
-          value: data?.status,
+          value: val,
         });
       },
     },

apps/web-antd/src/views/infra/job/logger/modules/detail.vue

@@ -13,11 +13,9 @@ import { useDetailSchema } from '../data';
 const formData = ref<InfraJobLogApi.JobLog>();
 
 const [Descriptions] = useDescription({
-  componentProps: {
+  bordered: true,
-    bordered: true,
+  column: 1,
-    column: 1,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailSchema(),
 });
 

apps/web-antd/src/views/infra/job/modules/detail.vue

@@ -14,11 +14,9 @@ const formData = ref<InfraJobApi.Job>(); // 任务详情
 const nextTimes = ref<Date[]>([]); // 下一次执行时间
 
 const [Descriptions] = useDescription({
-  componentProps: {
+  bordered: true,
-    bordered: true,
+  column: 1,
-    column: 1,
+  class: 'mx-4',
-    class: 'mx-4',
-  },
   schema: useDetailSchema(),
 });
 

apps/web-antd/src/views/infra/redis/modules/info.vue

@@ -1,60 +1,74 @@
 <script lang="ts" setup>
 import type { InfraRedisApi } from '#/api/infra/redis';
 
-import { Descriptions } from 'ant-design-vue';
+import { useDescription } from '#/components/description';
 
 defineProps<{
   redisData?: InfraRedisApi.RedisMonitorInfo;
 }>();
+
+const [Descriptions] = useDescription({
+  bordered: false,
+  column: 6,
+  class: 'mx-4',
+  schema: [
+    {
+      field: 'info.redis_version',
+      label: 'Redis 版本',
+    },
+    {
+      field: 'info.redis_mode',
+      label: '运行模式',
+      render: (val) => (val === 'standalone' ? '单机' : '集群'),
+    },
+    {
+      field: 'info.tcp_port',
+      label: '端口',
+    },
+    {
+      field: 'info.connected_clients',
+      label: '客户端数',
+    },
+    {
+      field: 'info.uptime_in_days',
+      label: '运行时间(天)',
+    },
+    {
+      field: 'info.used_memory_human',
+      label: '使用内存',
+    },
+    {
+      field: 'info.used_cpu_user_children',
+      label: '使用 CPU',
+      render: (val) => Number.parseFloat(val).toFixed(2),
+    },
+    {
+      field: 'info.maxmemory_human',
+      label: '内存配置',
+    },
+    {
+      field: 'info.aof_enabled',
+      label: 'AOF 是否开启',
+      render: (val) => (val === '0' ? '否' : '是'),
+    },
+    {
+      field: 'info.rdb_last_bgsave_status',
+      label: 'RDB 是否成功',
+    },
+    {
+      field: 'dbSize',
+      label: 'Key 数量',
+    },
+    {
+      field: 'info.instantaneous_input_kbps',
+      label: '网络入口/出口',
+      render: (val, data) =>
+        `${val}kps / ${data?.info?.instantaneous_output_kbps}kps`,
+    },
+  ],
+});
 </script>
 
 <template>
-  <Descriptions
+  <Descriptions :data="redisData" />
-    :column="6"
-    bordered
-    size="middle"
-    :label-style="{ width: '138px' }"
-  >
-    <Descriptions.Item label="Redis 版本">
-      {{ redisData?.info?.redis_version }}
-    </Descriptions.Item>
-    <Descriptions.Item label="运行模式">
-      {{ redisData?.info?.redis_mode === 'standalone' ? '单机' : '集群' }}
-    </Descriptions.Item>
-    <Descriptions.Item label="端口">
-      {{ redisData?.info?.tcp_port }}
-    </Descriptions.Item>
-    <Descriptions.Item label="客户端数">
-      {{ redisData?.info?.connected_clients }}
-    </Descriptions.Item>
-    <Descriptions.Item label="运行时间(天)">
-      {{ redisData?.info?.uptime_in_days }}
-    </Descriptions.Item>
-    <Descriptions.Item label="使用内存">
-      {{ redisData?.info?.used_memory_human }}
-    </Descriptions.Item>
-    <Descriptions.Item label="使用 CPU">
-      {{
-        redisData?.info
-          ? parseFloat(redisData?.info?.used_cpu_user_children).toFixed(2)
-          : ''
-      }}
-    </Descriptions.Item>
-    <Descriptions.Item label="内存配置">
-      {{ redisData?.info?.maxmemory_human }}
-    </Descriptions.Item>
-    <Descriptions.Item label="AOF 是否开启">
-      {{ redisData?.info?.aof_enabled === '0' ? '否' : '是' }}
-    </Descriptions.Item>
-    <Descriptions.Item label="RDB 是否成功">
-      {{ redisData?.info?.rdb_last_bgsave_status }}
-    </Descriptions.Item>
-    <Descriptions.Item label="Key 数量">
-      {{ redisData?.dbSize }}
-    </Descriptions.Item>
-    <Descriptions.Item label="网络入口/出口">
-      {{ redisData?.info?.instantaneous_input_kbps }}kps /
-      {{ redisData?.info?.instantaneous_output_kbps }}kps
-    </Descriptions.Item>
-  </Descriptions>
 </template>

apps/web-antd/src/views/infra/redis/modules/memory.vue

@@ -94,7 +94,7 @@ function renderMemoryChart() {
         detail: {
           show: true,
           offsetCenter: [0, '50%'],
-          color: 'auto',
+          color: 'inherit',
           fontSize: 30,
           formatter: usedMemory,
         },

apps/web-antd/src/views/iot/alert/config/data.ts

@@ -63,7 +63,7 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '关联场景联动规则',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleRuleSceneList(),
+        api: getSimpleRuleSceneList,
         labelField: 'name',
         valueField: 'id',
         mode: 'multiple',
@@ -76,7 +76,7 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '接收的用户',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleUserList(),
+        api: getSimpleUserList,
         labelField: 'nickname',
         valueField: 'id',
         mode: 'multiple',

apps/web-antd/src/views/iot/alert/record/data.ts

@@ -17,7 +17,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       label: '告警配置',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleAlertConfigList(),
+        api: getSimpleAlertConfigList,
         labelField: 'name',
         valueField: 'id',
         placeholder: '请选择告警配置',
@@ -40,7 +40,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       label: '产品',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleProductList(),
+        api: getSimpleProductList,
         labelField: 'name',
         valueField: 'id',
         placeholder: '请选择产品',
@@ -53,7 +53,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       label: '设备',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleDeviceList(),
+        api: getSimpleDeviceList,
         labelField: 'deviceName',
         valueField: 'id',
         placeholder: '请选择设备',

apps/web-antd/src/views/iot/device/device/data.ts

@@ -28,7 +28,7 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '产品',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleProductList(),
+        api: getSimpleProductList,
         labelField: 'name',
         valueField: 'id',
         placeholder: '请选择产品',
@@ -89,7 +89,7 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '设备分组',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleDeviceGroupList(),
+        api: getSimpleDeviceGroupList,
         labelField: 'name',
         valueField: 'id',
         mode: 'multiple',
@@ -156,7 +156,7 @@ export function useGroupFormSchema(): VbenFormSchema[] {
       label: '设备分组',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleDeviceGroupList(),
+        api: getSimpleDeviceGroupList,
         labelField: 'name',
         valueField: 'id',
         mode: 'multiple',
@@ -199,7 +199,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       label: '产品',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleProductList(),
+        api: getSimpleProductList,
         labelField: 'name',
         valueField: 'id',
         placeholder: '请选择产品',
@@ -249,7 +249,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       label: '设备分组',
       component: 'ApiSelect',
       componentProps: {
-        api: () => getSimpleDeviceGroupList(),
+        api: getSimpleDeviceGroupList,
         labelField: 'name',
         valueField: 'id',
         placeholder: '请选择设备分组',