From c8b5005bd77c29d82bc4d11d00e11e8b49767cee Mon Sep 17 00:00:00 2001 From: sealday Date: Fri, 31 May 2024 20:03:14 +0800 Subject: [PATCH] fix: table appends (#1099) Reviewed-on: https://git.daoyoucloud.com/daoyoucloud/tachybase/pulls/1099 --- .../client/src/block-provider/hooks/index.ts | 7 ++ .../data-blocks/table/tableColumnSettings.tsx | 20 +--- .../antd/action/Action.Designer.tsx | 26 ++++-- .../AppendsTreeSelectV2.tsx | 4 +- .../antd/table-v2/Table.Column.Decorator.tsx | 13 --- .../schema-component/antd/table-v2/index.ts | 1 + .../features/custom-components/index.tsx | 45 +++++---- .../custom-components/RecordDetails2.tsx | 92 +++++++++++++++++++ .../@hera/plugin-rental/src/client/index.tsx | 2 + 9 files changed, 151 insertions(+), 59 deletions(-) create mode 100644 packages/plugins/@hera/plugin-rental/src/client/custom-components/RecordDetails2.tsx diff --git a/packages/core/client/src/block-provider/hooks/index.ts b/packages/core/client/src/block-provider/hooks/index.ts index c9b6ff0fa..7ab28d4bd 100644 --- a/packages/core/client/src/block-provider/hooks/index.ts +++ b/packages/core/client/src/block-provider/hooks/index.ts @@ -1187,6 +1187,13 @@ export const useAssociationNames = (dataSource?: string) => { const isAssociationField = collectionField && ['hasOne', 'hasMany', 'belongsTo', 'belongsToMany'].includes(collectionField.type); + // 从属性中取 appends + if (s['x-component-props']?.['appends']) { + _.forEach(s['x-component-props']?.['appends'], (append) => { + appends.add(append); + }); + } + // 根据联动规则中条件的字段获取一些 appends if (s['x-linkage-rules']) { const collectAppends = (obj) => { diff --git a/packages/core/client/src/modules/blocks/data-blocks/table/tableColumnSettings.tsx b/packages/core/client/src/modules/blocks/data-blocks/table/tableColumnSettings.tsx index a22ce9ea2..c0a4954f9 100644 --- a/packages/core/client/src/modules/blocks/data-blocks/table/tableColumnSettings.tsx +++ b/packages/core/client/src/modules/blocks/data-blocks/table/tableColumnSettings.tsx @@ -298,25 +298,7 @@ export const tableColumnSettings = new SchemaSettings({ useChildren() { const app = useApp(); const fieldComponentName = useFieldComponentName(); - console.log('🚀 ~ file: tableColumnSettings.tsx:300 ~ useChildren ~ fieldComponentName:', fieldComponentName); - const map = { - Select: 'Select', - DatePicker: 'DatePicker', - Nester: 'Nester', - SubTable: 'SubTable', - Picker: 'Picker', - PopoverNester: 'PopoverNester', - Tag: 'Tag', - }; - const componentSettings = app.schemaSettingsManager.get( - `fieldSettings:component:${map[fieldComponentName] || fieldComponentName}`, - ); - console.log( - '🚀 ~ file: tableColumnSettings.tsx:313 ~ useChildren ~ componentSettings:', - componentSettings, - app.schemaSettingsManager.getAll(), - ); - console.log(`fieldSettings:component:${map[fieldComponentName] || fieldComponentName}`, 'fieldComponentName'); + const componentSettings = app.schemaSettingsManager.get(`fieldSettings:component:${fieldComponentName}`); return componentSettings?.items || []; }, }, diff --git a/packages/core/client/src/schema-component/antd/action/Action.Designer.tsx b/packages/core/client/src/schema-component/antd/action/Action.Designer.tsx index 032bd3189..b705a05a4 100644 --- a/packages/core/client/src/schema-component/antd/action/Action.Designer.tsx +++ b/packages/core/client/src/schema-component/antd/action/Action.Designer.tsx @@ -1,10 +1,20 @@ -import { ArrayTable } from '@tachybase/components'; -import { Field, onFieldValueChange } from '@tachybase/schema'; -import { ISchema, useField, useFieldSchema, useForm, useFormEffects } from '@tachybase/schema'; -import { isValid, uid } from '@tachybase/schema'; -import { Alert, Flex, ModalProps, Tag } from 'antd'; import React, { useCallback, useMemo, useState } from 'react'; +import { ArrayTable } from '@tachybase/components'; +import { + Field, + ISchema, + isValid, + onFieldValueChange, + uid, + useField, + useFieldSchema, + useForm, + useFormEffects, +} from '@tachybase/schema'; + +import { Alert, Flex, ModalProps, Tag } from 'antd'; import { useTranslation } from 'react-i18next'; + import { RemoteSelect, useCompile, useDesignable } from '../..'; import { isInitializersSame, useApp } from '../../../application'; import { usePlugin } from '../../../application/hooks'; @@ -13,13 +23,15 @@ import { useSchemaToolbar } from '../../../application/schema-toolbar'; import { useFormBlockContext } from '../../../block-provider'; import { joinCollectionName, - useCollectionManager_deprecated, useCollection_deprecated, + useCollectionManager_deprecated, } from '../../../collection-manager'; +import { DataSourceProvider, useDataSourceKey } from '../../../data-source'; import { FlagProvider } from '../../../flag-provider'; import { SaveMode } from '../../../modules/actions/submit/createSubmitActionSettings'; import { SchemaSettingOpenModeSchemaItems } from '../../../schema-items'; import { GeneralSchemaDesigner } from '../../../schema-settings/GeneralSchemaDesigner'; +import { DefaultValueProvider } from '../../../schema-settings/hooks/useIsAllowToSetDefaultValue'; import { SchemaSettingsActionModalItem, SchemaSettingsDivider, @@ -29,10 +41,8 @@ import { SchemaSettingsRemove, SchemaSettingsSwitchItem, } from '../../../schema-settings/SchemaSettings'; -import { DefaultValueProvider } from '../../../schema-settings/hooks/useIsAllowToSetDefaultValue'; import { useLinkageAction } from './hooks'; import { requestSettingsSchema } from './utils'; -import { DataSourceProvider, useDataSourceKey } from '../../../data-source'; const MenuGroup = (props) => { return props.children; diff --git a/packages/core/client/src/schema-component/antd/appends-tree-select/AppendsTreeSelectV2.tsx b/packages/core/client/src/schema-component/antd/appends-tree-select/AppendsTreeSelectV2.tsx index 8923ec26b..ad897cbad 100644 --- a/packages/core/client/src/schema-component/antd/appends-tree-select/AppendsTreeSelectV2.tsx +++ b/packages/core/client/src/schema-component/antd/appends-tree-select/AppendsTreeSelectV2.tsx @@ -88,7 +88,7 @@ function getCollectionFieldOptions( }); } // XXX: 目前 AppendsTreeSelectV2 和 AppendsTreeSelect 都有特化逻辑, 需要整理出一个通用组件 -export const AppendsTreeSelectV2: React.FC = (props) => { +export const AppendsTreeSelectV2 = (props: TreeSelectProps & AppendsTreeSelectPropsV2) => { const { title, value: propsValue, @@ -247,8 +247,6 @@ export const AppendsTreeSelectV2: React.FC { - {/* */}
{field?.title || compile(uiSchema?.title)}
- {/*
{ - field.title = uid(); - // columnSchema.title = field.title = field.title; - // refresh(); - // field.query(`.*.${fieldSchema.name}`).take((f) => { - // f.componentProps.dateFormat = 'YYYY-MM-DD'; - // }); - }} - > - Edit -
*/} ); diff --git a/packages/core/client/src/schema-component/antd/table-v2/index.ts b/packages/core/client/src/schema-component/antd/table-v2/index.ts index 5aa731593..b1dff0425 100644 --- a/packages/core/client/src/schema-component/antd/table-v2/index.ts +++ b/packages/core/client/src/schema-component/antd/table-v2/index.ts @@ -10,6 +10,7 @@ import { TableSelector } from './TableSelector'; export * from './TableBlockDesigner'; export * from './TableField'; export * from './TableSelectorDesigner'; +export { useColumnSchema } from './Table.Column.Decorator'; export const TableV2 = Table; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/custom-components/index.tsx b/packages/plugins/@hera/plugin-core/src/client/features/custom-components/index.tsx index 75fd0c906..bc5840d3a 100644 --- a/packages/plugins/@hera/plugin-core/src/client/features/custom-components/index.tsx +++ b/packages/plugins/@hera/plugin-core/src/client/features/custom-components/index.tsx @@ -1,12 +1,23 @@ import React from 'react'; -import { Plugin, SchemaSettings, SchemaSettingsModalItem, useCollection, useDesignable } from '@tachybase/client'; -import { ISchema, useField, useFieldSchema } from '@tachybase/schema'; +import { + Plugin, + SchemaSettings, + SchemaSettingsModalItem, + useCollection, + useColumnSchema, + useDesignable, +} from '@tachybase/client'; +import { ISchema, useFieldSchema } from '@tachybase/schema'; import { get, set } from 'lodash'; +import { useTranslation } from '../../locale'; + const SchemaSettingsAppends = () => { - const fieldSchema = useFieldSchema(); - const field = useField(); + const originFieldSchema = useFieldSchema(); + const { fieldSchema: columnSchema } = useColumnSchema(); + const fieldSchema = columnSchema ?? originFieldSchema; + const { t } = useTranslation(); const c = useCollection(); const { dn } = useDesignable(); @@ -14,35 +25,37 @@ const SchemaSettingsAppends = () => { item.name), }, }, } as ISchema } onSubmit={({ appends }) => { - set(field.componentProps, 'service.params.appends', appends); - fieldSchema['x-component-props'] = field.componentProps; - const path = field.path?.splice(field.path?.length - 1, 1); - field.form.query(`${path.concat(`*.` + fieldSchema.name)}`).forEach((f) => { - f.componentProps.service = f.componentProps.service || { params: {} }; - f.componentProps.service.params.appends = appends; - }); + set(fieldSchema['x-component-props'], 'appends', appends ?? []); dn.emit('patch', { schema: { ['x-uid']: fieldSchema['x-uid'], - 'x-component-props': field.componentProps, + 'x-component-props': fieldSchema['x-component-props'], }, }); diff --git a/packages/plugins/@hera/plugin-rental/src/client/custom-components/RecordDetails2.tsx b/packages/plugins/@hera/plugin-rental/src/client/custom-components/RecordDetails2.tsx new file mode 100644 index 000000000..a361e314d --- /dev/null +++ b/packages/plugins/@hera/plugin-rental/src/client/custom-components/RecordDetails2.tsx @@ -0,0 +1,92 @@ +import React from 'react'; +import { FormPath, useField, useFieldSchema, useForm } from '@tachybase/schema'; + +import { CustomComponentType, CustomFunctionComponent } from '@hera/plugin-core/client'; +import { Descriptions } from 'antd'; +import _ from 'lodash'; + +import { formatQuantity } from '../../utils/currencyUtils'; + +export const RecordDetails2: CustomFunctionComponent = () => { + const form = useForm(); + const fieldSchema = useFieldSchema(); + const field = useField(); + const path: any = field.path.entire; + const fieldPath = path?.replace(`.${fieldSchema.name}`, ''); + const itemPath = FormPath.parse('.', fieldPath).toString(); + + const item = form.getValuesIn(itemPath); + + const displayItems = []; + const productItem = {}; + const items = item?.items || []; + + items.forEach((item) => { + if (!item.product) return; + const key = item.product.name; + const count = item.product.category.convertible ? item.count * item.product.ratio : item.count; + const unit = item.product.category.convertible ? item.product.category.conversion_unit : item.product.category.unit; + + const weight = item.count * item.product.weight; + if (productItem[key]) { + productItem[key].count += count; + productItem[key].feeItems = productItem[key].feeItems.concat(item.fee_items || []); + } else { + productItem[key] = { + label: item.product.name, + sort: item.product.category.sort, + unit, + count, + weight: formatQuantity(weight, 2) + 'KG', + feeItems: item.fee_items || [], + }; + } + }); + for (const key in productItem) { + displayItems.push(productItem[key]); + productItem[key].children = formatQuantity(productItem[key].count, 2) + productItem[key].unit; + productItem[key].span = 1; + displayItems.push({ + label: '理论重量', + children: [productItem[key].weight], + }); + + const children = []; + if (productItem[key].feeItems.length > 0) { + const feeItems = productItem[key].feeItems.reduce((prev, current) => { + if (current.product) { + if (!prev[current.product.label]) { + prev[current.product.label] = 0; + } + prev[current.product.label] += current.count; + } + return prev; + }, {}); + productItem[key].span = 1; + for (const name in feeItems) { + if (children.length > 0) { + children.push(
); + } + children.push(name + ' ' + formatQuantity(feeItems[name], 2)); + } + } + if (children.length > 0) { + displayItems.push({ + label: '维修赔偿', + children, + }); + } else { + displayItems.push({ + label: '', + children, + }); + } + } + displayItems.sort((a, b) => a.sort - b.sort); + + return ; +}; + +RecordDetails2.displayName = 'RecordDetails2'; +RecordDetails2.__componentType = CustomComponentType.CUSTOM_FIELD; +RecordDetails2.__componentLabel = '记录单 - 详情2'; diff --git a/packages/plugins/@hera/plugin-rental/src/client/index.tsx b/packages/plugins/@hera/plugin-rental/src/client/index.tsx index 96ddfde7a..9821ae3bc 100644 --- a/packages/plugins/@hera/plugin-rental/src/client/index.tsx +++ b/packages/plugins/@hera/plugin-rental/src/client/index.tsx @@ -2,6 +2,7 @@ import { Plugin, useCollection } from '@tachybase/client'; import { DetailChecks } from './custom-components/DetailChecks'; import { RecordDetails } from './custom-components/RecordDetails'; +import { RecordDetails2 } from './custom-components/RecordDetails2'; import { RecordFeeConvertedAmount } from './custom-components/RecordFeeConverted'; import { ReadFeeConvertedAmount } from './custom-components/RecordFeeConvertedRead'; import { RecordFeeScope } from './custom-components/RecordFeeScope'; @@ -181,6 +182,7 @@ export class PluginRentalClient extends Plugin { RecordSummary, RecordTotalPrice, RecordDetails, + RecordDetails2, DetailChecks, PdfIsDoubleProvider, PrintStyleSetupInitializer,