fix: 修改标签没有对应颜色，审批页面没有显示正确的创建人名称 (#1090)

Reviewed-on: daoyoucloud/tachybase#1090
Reviewed-by: sealday <zhanglin@daoyoucloud.com>
Co-authored-by: wjh <wwwjh0710@163.com>
Co-committed-by: wjh <wwwjh0710@163.com>

packages/plugins/@hera/plugin-approval-mobile/src/client/approval/todos/component/TabApprovalItem.tsx

@@ -19,9 +19,8 @@ export const TabApprovalItem = observer((props) => {
   const navigate = useNavigate();
   const cm = useCollectionManager();
   useAsyncEffect(async () => {
-    const { data: user } = await api.request({ url: 'users:list', params: { pageSize: 999, appends: ['roles'] } });
     if (collectionName === 'approvalRecords') {
-      changeApprovalRecordsService(api, params?.[tabKey], filter, user, cm, compile, t, setData, input);
+      changeApprovalRecordsService(api, params?.[tabKey], filter, cm, compile, t, setData, input);
     } else if (collectionName === 'users_jobs') {
       changeUsersJobsService(api, t, cm, compile, input, setData, params?.[tabKey], filter);
     }
@@ -83,19 +82,18 @@ const approvalTodoListStatus = (item, t) => {
   }
 };
 
-const changeApprovalRecordsService = (api, params, filter, user, cm, compile, t, setData, input) => {
+const changeApprovalRecordsService = (api, params, filter, cm, compile, t, setData, input) => {
   api
     .request({
       url: 'approvalRecords:listCentralized',
       params: {
         pageSize: 9999,
-        appends: ['execution', 'job', 'node', 'workflow'],
+        appends: ['execution', 'job', 'node', 'workflow', 'user'],
         filter: { ...params, ...filter },
       },
     })
     .then((res) => {
       const result = res.data?.data.map((item) => {
-        const itemUser = user.data.find((value) => value.id === item.userId);
         const priorityType = ApprovalPriorityType.find((priorityItem) => priorityItem.value === item.snapshot.priority);
         const statusType = approvalTodoListStatus(item, t);
         const categoryTitle = item.workflow.title.replace('审批流:', '');
@@ -109,7 +107,7 @@ const changeApprovalRecordsService = (api, params, filter, user, cm, compile, t,
         });
         return {
           ...item,
-          title: `${itemUser.nickname}的${categoryTitle}`,
+          title: `${item.snapshot.createdBy.nickname}的${categoryTitle}`,
           categoryTitle: categoryTitle,
           statusTitle: t(statusType.label),
           statusColor: statusType.color,

packages/plugins/@tachybase/plugin-mobile-client/src/client/core/schema/CustomColor.tsx

@@ -0,0 +1,17 @@
+const customColor = {
+  red: '#fc9792',
+  magenta: '#ffa3cc',
+  volcano: '#ffb38b',
+  orange: '#ffcf86',
+  gold: '#ffe184',
+  lime: '#e7ff84',
+
+  green: '#aee884',
+  cyan: '#7ce5d9',
+  blue: '#86c3ff',
+  geekblue: '#a3bfff',
+  purple: '#cda3f6',
+  default: '#d4d4d4',
+};
+
+export const getMobileColor = (color: string) => customColor[color];

packages/plugins/@tachybase/plugin-mobile-client/src/client/core/schema/components/antd-mobile/Checkbox/Checkbox.tsx

@@ -4,6 +4,8 @@ import { connect, isValid, mapProps, mapReadPretty, useField } from '@tachybase/
 
 import { Checkbox, CheckboxGroupProps, CheckboxProps, Tag } from 'antd-mobile';
 
+import { getMobileColor } from '../../../CustomColor';
+
 type ComposedCheckBox = React.FC<CheckboxProps> & {
   Group?: any;
 };
@@ -59,7 +61,7 @@ MCheckbox.Group = connect(
         {dataSource
           .filter((option) => option.value == value)
           .map((option, key) => (
-            <Tag key={key} color={option.color}>
+            <Tag key={key} color={getMobileColor(option.color)}>
               {option.label}
             </Tag>
           ))}

packages/plugins/@tachybase/plugin-mobile-client/src/client/core/schema/components/antd-mobile/Radio/Radio.tsx

@@ -4,6 +4,8 @@ import { connect, isValid, mapProps, mapReadPretty, useField } from '@tachybase/
 
 import { Radio, RadioGroupProps, RadioProps, Tag } from 'antd-mobile';
 
+import { getMobileColor } from '../../../CustomColor';
+
 type ComposedRadio = React.FC<RadioProps> & {
   Group?: any;
 };
@@ -55,11 +57,13 @@ MRadio.Group = connect(
       <div>
         {dataSource
           .filter((option) => option.value == value)
-          .map((option, key) => (
+          .map((option, key) => {
-            <Tag key={key} color={option.color}>
+            return (
-              {option.label}
+              <Tag key={key} color={getMobileColor(option.color)}>
-            </Tag>
+                {option.label}
-          ))}
+              </Tag>
+            );
+          })}
       </div>
     );
   }),

packages/plugins/@tachybase/plugin-mobile-client/src/client/core/schema/components/collection-field/CollectionField.tsx

@@ -11,8 +11,8 @@ import { connect, Field, merge, useField, useFieldSchema } from '@tachybase/sche
 
 import { concat } from 'lodash';
 
+import { canMobileField } from '../../CustomComponent';
 import { useIsMobile } from '../../hooks';
-import { canMobileField } from '../form/CustomComponent';
 
 type Props = {
   component: any;

packages/plugins/@tachybase/plugin-mobile-client/src/client/core/schema/components/form/MobileFormItemInitializers.tsx

@@ -11,8 +11,8 @@ import {
 } from '@tachybase/client';
 import { Schema, useForm } from '@tachybase/schema';
 
+import { canMobileField } from '../../CustomComponent';
 import { useIsMobile } from '../../hooks';
-import { canMobileField } from './CustomComponent';
 
 export const useFormItemInitializerFields = (options?: any) => {
   const { name, currentFields } = useCollection_deprecated();

packages/plugins/@tachybase/plugin-mobile-client/src/client/core/schema/index.ts

@@ -3,3 +3,5 @@ export * from './components';
 export * from './scopes';
 export * from './hooks';
 export * from './provider';
+export * from './CustomColor';
+export * from './CustomComponent';