From 20206433717fd2c31cd5f96cc0b70d8c3ce8bda0 Mon Sep 17 00:00:00 2001 From: wjh Date: Mon, 15 Apr 2024 17:40:22 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E5=A4=84=E7=90=86=E5=90=8C=E5=90=8D?= =?UTF-8?q?=E7=BB=84=E4=BB=B6=E9=80=89=E6=8B=A9=E5=BC=82=E5=B8=B8=E6=83=85?= =?UTF-8?q?=E5=86=B5=EF=BC=8C=E6=96=87=E6=9C=AC=E5=88=87=E6=8D=A2=E7=BB=84?= =?UTF-8?q?=E4=BB=B6=E9=98=88=E5=80=BC=EF=BC=8C=E6=97=B6=E9=97=B4=E9=80=89?= =?UTF-8?q?=E6=8B=A9=E5=85=B7=E4=BD=93=E8=8C=83=E5=9B=B4=20(#712)=20Co-aut?= =?UTF-8?q?hored-by:=20wjh=20=20Co-committed-by:=20wjh?= =?UTF-8?q?=20?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .changeset/yellow-papayas-shout.md | 5 ++++ .../TabSearchCollapsibleInputItemAction.ts | 25 +++++++++++++------ .../TabSearchCollapsibleInputMItemChild.tsx | 21 ++++++++++------ .../field-item/TabSearchFieldItemAction.ts | 5 +++- .../field-item/TabSearchFieldItemProps.ts | 9 ++++--- .../create/createTabSearchItemSchema.ts | 5 ++-- .../TabSearchFieldSchemaInitializer.tsx | 4 ++- .../schma-component/tab-search/utils.ts | 4 +++ 8 files changed, 56 insertions(+), 22 deletions(-) create mode 100644 .changeset/yellow-papayas-shout.md diff --git a/.changeset/yellow-papayas-shout.md b/.changeset/yellow-papayas-shout.md new file mode 100644 index 000000000..09509afa1 --- /dev/null +++ b/.changeset/yellow-papayas-shout.md @@ -0,0 +1,5 @@ +--- +"@hera/plugin-mobile": patch +--- + +修改mobile组件同名切换问题，文本切换阈值，时间范围 diff --git a/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/components/field-item/TabSearchCollapsibleInputItemAction.ts b/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/components/field-item/TabSearchCollapsibleInputItemAction.ts index c88648874..6a6034063 100644 --- a/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/components/field-item/TabSearchCollapsibleInputItemAction.ts +++ b/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/components/field-item/TabSearchCollapsibleInputItemAction.ts @@ -1,7 +1,13 @@ import { useMemo, useState } from 'react'; import { useFieldSchema } from '@nocobase/schema'; import { useCollection, useCollectionManager, useDesignable, useDesigner } from '@nocobase/client'; -import { canBeDataField, canBeRelatedField, convertFormat, isTabSearchCollapsibleInputItem } from '../../utils'; +import { + canBeDataField, + canBeRelatedField, + changFormat, + convertFormat, + isTabSearchCollapsibleInputItem, +} from '../../utils'; import { useTabSearchCollapsibleInputItem } from './hooks'; import { dayjs } from '@nocobase/utils/client'; @@ -11,13 +17,16 @@ export const useTabSearchCollapsibleInputItemAction = (props) => { const collection = useCollection(); const cm = useCollectionManager(); const { dn } = useDesignable(); - const collectionField = useMemo(() => collection?.getField(fieldSchema.name as any), [collection, fieldSchema.name]); + const collectionField = useMemo( + () => collection?.getField(fieldSchema['fieldName'] as any), + [collection, fieldSchema['fieldName']], + ); const properties = fieldSchema.parent.properties; const Designer = useDesigner(); - const [customLabelKey, setCustomLabelKey] = useState(fieldSchema['name'] as string); + const [customLabelKey, setCustomLabelKey] = useState(fieldSchema['fieldName'] as string); const [fieldInterface, setFieldInterface] = useState(fieldSchema['x-component-props'].interface); const defaultValue = canBeDataField(fieldInterface) - ? convertFormat(new Date()) + '&' + convertFormat(new Date()) + ? changFormat(dayjs(new Date()).startOf('date')) + '&' + changFormat(dayjs(new Date()).endOf('date')) : ''; const [value, setValue] = useState(defaultValue); const options = Object.values(properties) @@ -25,7 +34,7 @@ export const useTabSearchCollapsibleInputItemAction = (props) => { if (isTabSearchCollapsibleInputItem(option['x-component'])) { return { label: option['title'], - value: option['name'], + value: option['fieldName'], interface: option['x-component-props'].interface, }; } @@ -36,7 +45,7 @@ export const useTabSearchCollapsibleInputItemAction = (props) => { let time; let filterKey = `${customLabelKey}.$includes`; if (canBeDataField(fieldInterface)) { - time = value.split('&'); + time = value.split('&').map((value) => JSON.parse(value)); filterKey = `${customLabelKey}.$dateBetween`; } if (canBeRelatedField(fieldInterface)) { @@ -48,7 +57,7 @@ export const useTabSearchCollapsibleInputItemAction = (props) => { }; const onSelectChange = (label) => { - const type = Object.values(properties).find((value) => value.name === label)['x-component-props'].interface; + const type = Object.values(properties).find((value) => value['fieldName'] === label)['x-component-props'].interface; if (canBeRelatedField(type)) { const titleField = cm.getCollection(collection.name + '.' + label).titleField; fieldSchema['x-component-props']['correlation'] = label; @@ -63,7 +72,7 @@ export const useTabSearchCollapsibleInputItemAction = (props) => { } setFieldInterface(type); if (canBeDataField(type)) { - setValue(convertFormat(new Date()) + '&' + convertFormat(new Date())); + setValue(changFormat(new Date()) + '&' + changFormat(new Date())); } else { setValue(''); } diff --git a/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/components/field-item/TabSearchCollapsibleInputMItemChild.tsx b/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/components/field-item/TabSearchCollapsibleInputMItemChild.tsx index b013dd08e..63f2a1c43 100644 --- a/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/components/field-item/TabSearchCollapsibleInputMItemChild.tsx +++ b/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/components/field-item/TabSearchCollapsibleInputMItemChild.tsx @@ -3,7 +3,8 @@ import { useTranslation } from '../../../../locale'; import { Grid, Divider, Picker, Input, Space, ActionSheet, DatePicker, CalendarPicker } from 'antd-mobile'; import { DownOutline } from 'antd-mobile-icons'; import type { Action } from 'antd-mobile/es/components/action-sheet'; -import { convertFormat } from '../../utils'; +import { changFormat, convertFormat } from '../../utils'; +import { dayjs } from '@nocobase/utils/client'; export const ISelect = (props) => { const { options, onChange, customLabelKey } = props; @@ -25,7 +26,7 @@ export const ISelect = (props) => { {options.find((option) => option.value === customLabelKey).label} - {options.length <= 3 ? ( + {options.length <= 5 ? ( { > - {time[0]} + {convertFormat(JSON.parse(time[0]))} - - {time[1]} + {convertFormat(JSON.parse(time[1]))} @@ -82,9 +83,15 @@ export const IDatePicker = (props) => { selectionMode="range" onMaskClick={() => setVisible(false)} onClose={() => setVisible(false)} - onConfirm={(v) => { - onInputChange(convertFormat(v[0]) + '&' + convertFormat(v[1])); - onChange(convertFormat(v[0]) + '&' + convertFormat(v[1])); + onConfirm={([start, end]) => { + const startTime = dayjs(start).startOf('date').toISOString(); + const endTime = dayjs(end).endOf('date').toISOString(); + + // TODO: 此处受上游影响,格式必须确定为这样, 时间有限,不再往上追查 + const timeString = `"${startTime}"&"${endTime}"`; + + onInputChange(timeString); + onChange(timeString); }} /> diff --git a/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/components/field-item/TabSearchFieldItemAction.ts b/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/components/field-item/TabSearchFieldItemAction.ts index 014554780..6b00f36d8 100644 --- a/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/components/field-item/TabSearchFieldItemAction.ts +++ b/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/components/field-item/TabSearchFieldItemAction.ts @@ -9,7 +9,10 @@ export const useTabSearchFieldItemAction = (props) => { const { t } = useTranslation(); const fieldSchema = useFieldSchema(); const c = useCollection(); - const collectionField = React.useMemo(() => c?.getField(fieldSchema.name as any), [c, fieldSchema.name]); + const collectionField = React.useMemo( + () => c?.getField(fieldSchema['fieldName'] as any), + [c, fieldSchema['fieldName']], + ); const Designer = useDesigner(); const valueKey = _valueKey || collectionField?.targetKey || 'id'; const labelKey = _labelKey || fieldSchema['x-component-props']?.fieldNames?.label || valueKey; diff --git a/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/components/field-item/TabSearchFieldItemProps.ts b/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/components/field-item/TabSearchFieldItemProps.ts index fa5fb9679..f66f51b10 100644 --- a/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/components/field-item/TabSearchFieldItemProps.ts +++ b/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/components/field-item/TabSearchFieldItemProps.ts @@ -10,7 +10,10 @@ export const useTabSearchFieldItemProps = () => { const collection = useCollection(); const optionalFieldList = useOptionalFieldList(); const cm = useCollectionManager(); - const collectionField = useMemo(() => collection?.getField(fieldSchema.name as any), [collection, fieldSchema.name]); + const collectionField = useMemo( + () => collection?.getField(fieldSchema['fieldName'] as any), + [collection, fieldSchema['fieldName']], + ); const { onSelected } = useTabSearchCollapsibleInputItem(); const result = { list: null, valueKey: '', labelKey: '', filterKey: '' }; if (!collection) return; @@ -18,7 +21,7 @@ export const useTabSearchFieldItemProps = () => { result.labelKey = fieldSchema['x-component-props']?.fieldNames?.label || result.valueKey; const fieldInterface = fieldSchema['x-component-props'].interface; if (canBeOptionalField(fieldInterface)) { - const field = optionalFieldList.find((field) => field.name === fieldSchema.name); + const field = optionalFieldList.find((field) => field.fieldName === fieldSchema['fieldName']); const operatorMap = { select: '$in', multipleSelect: '$anyOf', @@ -30,7 +33,7 @@ export const useTabSearchFieldItemProps = () => { result.valueKey = 'value'; result.labelKey = 'label'; result.list = _list; - result.filterKey = `${field.name}.${operatorMap[field.interface]}`; + result.filterKey = `${field.fieldName}.${operatorMap[field.interface]}`; } return { diff --git a/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/create/createTabSearchItemSchema.ts b/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/create/createTabSearchItemSchema.ts index 0caacac5f..5243e9fe2 100644 --- a/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/create/createTabSearchItemSchema.ts +++ b/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/create/createTabSearchItemSchema.ts @@ -1,11 +1,12 @@ export const createTabSearchItemSchema = (options) => { - const { field, itemComponent, label, itemUseProps, collection } = options; + const { field, itemComponent, label, itemUseProps, collection, type } = options; return { name: field.key, title: field.uiSchema?.title, Component: 'TabSearchFieldSchemaInitializerGadget', schema: { - name: field.name, + name: field.name + type, + fieldName: field.name, title: field.uiSchema?.title, type: 'void', 'x-toolbar': 'CollapseItemSchemaToolbar', diff --git a/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/initializer/TabSearchFieldSchemaInitializer.tsx b/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/initializer/TabSearchFieldSchemaInitializer.tsx index 175af229f..6f5bd89ba 100644 --- a/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/initializer/TabSearchFieldSchemaInitializer.tsx +++ b/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/initializer/TabSearchFieldSchemaInitializer.tsx @@ -24,7 +24,7 @@ const textFieldsItem: SchemaInitializerItemType = { const label = canBeRelatedField(field.interface) ? cm.getCollection(`${collection.name}.${field.name}`).titleField : field.name; - return createTabSearchItemSchema({ field, itemComponent, label, collection }); + return createTabSearchItemSchema({ field, itemComponent, label, collection, type: 'text' }); } }) .filter(Boolean); @@ -51,6 +51,7 @@ const choicesFieldsItem: SchemaInitializerItemType = { itemComponent, label, itemUseProps: 'useTabSearchFieldItemProps', + type: 'choices', }); } else if (canBeRelatedField(field.interface)) { return createTabSearchItemSchema({ @@ -58,6 +59,7 @@ const choicesFieldsItem: SchemaInitializerItemType = { itemComponent, label, itemUseProps: 'useTabSearchFieldItemRelatedProps', + type: 'choices', }); } }) diff --git a/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/utils.ts b/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/utils.ts index 7c0713878..19cf3bf3a 100644 --- a/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/utils.ts +++ b/packages/plugins/@hera/plugin-mobile/src/client/schma-component/tab-search/utils.ts @@ -31,3 +31,7 @@ export const canBeSearchField = (_interface: string) => canBeSearchFields.includ export const convertFormat = (currentDate) => { return dayjs(currentDate).format('YYYY-MM-DD'); }; + +export const changFormat = (currentDate) => { + return JSON.stringify(dayjs(currentDate)); +};