fix(plugin-mobile-client): page content disappears when tab is disabled (#3059)

* fix(plugin-mobile-client): page content disappears when tab is disabled

* feat: make sure include tabs schema
This commit is contained in:
Dunqing 2023-11-22 12:19:55 +08:00 committed by GitHub
parent e0c7d09cab
commit cc40849c59
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -1,5 +1,5 @@
import { RecursionField, useField, useFieldSchema } from '@formily/react'; import { RecursionField, useField, useFieldSchema } from '@formily/react';
import { ActionBarProvider, SortableItem, TabsContextProvider, cx, useDesigner } from '@nocobase/client'; import { ActionBarProvider, SortableItem, TabsContextProvider, css, cx, useDesigner } from '@nocobase/client';
import { TabsProps } from 'antd'; import { TabsProps } from 'antd';
import React, { useCallback } from 'react'; import React, { useCallback } from 'react';
import { useSearchParams } from 'react-router-dom'; import { useSearchParams } from 'react-router-dom';
@ -15,7 +15,7 @@ const InternalPage: React.FC = (props) => {
const [searchParams, setSearchParams] = useSearchParams(); const [searchParams, setSearchParams] = useSearchParams();
const tabsSchema = fieldSchema.properties?.['tabs']; const tabsSchema = fieldSchema.properties?.['tabs'];
const isHeaderEnabled = field.componentProps.headerEnabled !== false; const isHeaderEnabled = field.componentProps.headerEnabled !== false;
const isTabsEnabled = field.componentProps.tabsEnabled !== false; const isTabsEnabled = field.componentProps.tabsEnabled !== false && tabsSchema;
let pageSchema = findSchema(fieldSchema, 'MPage'); let pageSchema = findSchema(fieldSchema, 'MPage');
if (!isTabsEnabled && !pageSchema && tabsSchema) { if (!isTabsEnabled && !pageSchema && tabsSchema) {
@ -23,7 +23,7 @@ const InternalPage: React.FC = (props) => {
return k1['x-index'] - k2['x-index']; return k1['x-index'] - k2['x-index'];
}); });
if (schemaArr.length !== 0) { if (schemaArr.length !== 0) {
pageSchema = Object.values(schemaArr[0].properties)?.[0]; pageSchema = schemaArr[0];
} }
} }
@ -88,7 +88,13 @@ const InternalPage: React.FC = (props) => {
style={{ style={{
paddingBottom: tabsSchema ? null : 'var(--nb-spacing)', paddingBottom: tabsSchema ? null : 'var(--nb-spacing)',
}} }}
className={cx('nb-mobile-page-header', styles.mobilePageHeader)} className={cx('nb-mobile-page-header', styles.mobilePageHeader, {
[css`
& > .ant-nb-grid {
margin-top: 14px;
}
`]: (tabsSchema && !isTabsEnabled) || !tabsSchema,
})}
> >
{isHeaderEnabled && ( {isHeaderEnabled && (
<RecursionField <RecursionField
@ -106,7 +112,7 @@ const InternalPage: React.FC = (props) => {
<RecursionField <RecursionField
schema={isTabsEnabled ? fieldSchema : pageSchema} schema={isTabsEnabled ? fieldSchema : pageSchema}
filterProperties={(s) => { filterProperties={(s) => {
return 'Tabs' === s['x-component'] || 'Grid.Row' === s['x-component']; return 'Tabs' === s['x-component'] || 'Grid' === s['x-component'] || 'Grid.Row' === s['x-component'];
}} }}
></RecursionField> ></RecursionField>
</TabsContextProvider> </TabsContextProvider>