fix: 优化移动端没有页面的效果 (#1053)

Reviewed-on: daoyoucloud/tachybase#1053
Reviewed-by: sealday <zhanglin@daoyoucloud.com>
Co-authored-by: wjh <wwwjh0710@163.com>
Co-committed-by: wjh <wwwjh0710@163.com>
This commit is contained in:
wjh 2024-05-28 10:26:53 +08:00 committed by sealday
parent a298f4ddf0
commit 84608f9a3e
17 changed files with 98 additions and 31 deletions

View File

@ -248,7 +248,7 @@ const AppMaintainingDialog = observer(
{ displayName: 'AppMaintainingDialog' },
);
const AppNotFound = () => {
export const AppNotFound = () => {
const navigate = useNavigate();
return (
<Result

View File

@ -1,17 +1,23 @@
import { BlockItem, ExtendCollectionsProvider, SchemaComponent, useDesignable } from '@tachybase/client';
import { SearchBar, Space, Tabs } from 'antd-mobile';
import React, { createContext, useEffect, useState } from 'react';
import { BlockItem, css, ExtendCollectionsProvider, SchemaComponent, useDesignable } from '@tachybase/client';
import { observer, useFieldSchema } from '@tachybase/schema';
import { SearchBar, Space, Tabs } from 'antd-mobile';
import '../style/style.css';
import { CollectionWorkflows } from '../collection/Workflows.collection';
import { CollectionFlowNodes } from '../collection/FlowNodes.collection';
import { CollectionApprovals } from '../collection/Approvals.collection';
import { CollectionApprovalTodos } from '../collection/ApprovalTodos';
import { CollectionFlowNodes } from '../collection/FlowNodes.collection';
import { CollectionWorkflows } from '../collection/Workflows.collection';
import { useTranslation } from '../locale';
import { InitiationsItem } from './component/InitiationsItem';
import { UserInitiationsItem } from './component/UserInitiationsItem';
import { useTranslation } from '../locale';
import '../style/style.css';
import { createGlobalStyle } from '@tachybase/client';
export const InitiationsBlockContext = createContext({});
export const InitiationsBlock = observer((props) => {
@ -45,7 +51,14 @@ export const InitiationsBlock = observer((props) => {
}}
/>
<Tabs
style={{ '--title-font-size': '12px', backgroundColor: '#f3f3f3' }}
className={css`
.adm-tabs-tab {
font-size: 12px;
}
.adm-tabs-content {
padding: 0;
}
`}
onChange={(key) => {
const filter = { ...contextFilter };
filter['key'] = key;

View File

@ -53,9 +53,6 @@
background-color: #f3f3f3;
}
.adm-tabs-content{
padding: 0;
}

View File

@ -0,0 +1,40 @@
import React from 'react';
import { AppNotFound, css } from '@tachybase/client';
import { Button, ErrorBlock } from 'antd-mobile';
import { useNavigate } from 'react-router-dom';
export const MAppNotFound = () => {
const navigate = useNavigate();
const path = window.location.pathname.split('/');
const isMobile = path[1] === 'mobile';
return isMobile ? (
<ErrorBlock
status="empty"
title="Sorry, the page you visited does not exist."
description={
<Button onClick={() => navigate('/mobile', { replace: true })} color="primary">
Back Home
</Button>
}
className={css`
.adm-error-block-image {
height: 30vh;
}
.adm-error-block-description-title {
font-size: 50px;
}
.adm-error-block-description-subtitle {
font-size: 50px;
}
button {
width: 20vh;
height: 3.5vh;
font-size: 50px;
}
`}
/>
) : (
<AppNotFound />
);
};

View File

@ -1,8 +1,9 @@
import { createRouterManager, Plugin, RouterManager, RouteSchemaComponent } from '@tachybase/client';
import React from 'react';
import { AppNotFound, createRouterManager, Plugin, RouterManager, RouteSchemaComponent } from '@tachybase/client';
import { Navigate, Outlet } from 'react-router-dom';
import { MobileClientProvider } from './MobileClientProvider';
import MApplication from './router/Application';
import { AppConfiguration, InterfaceConfiguration } from './configuration';
import {
ImageSearchConfigureFields,
ImageSearchItemFieldSettings,
@ -14,8 +15,10 @@ import {
TabSearchFieldSchemaInitializer,
TabSearchItemFieldSettings,
} from './core/schema';
import { AppConfiguration, InterfaceConfiguration } from './configuration';
import { NAMESPACE } from './locale';
import { MAppNotFound } from './MAppNotFound';
import { MobileClientProvider } from './MobileClientProvider';
import MApplication from './router/Application';
export class MobileClientPlugin extends Plugin {
public mobileRouter: RouterManager;
@ -55,6 +58,10 @@ export class MobileClientPlugin extends Plugin {
setMobileRouter() {
const router = createRouterManager({ type: 'hash' }, this.app);
this.router.add('not-found', {
path: '*',
Component: MAppNotFound,
});
router.add('root', {
path: '/',
element: <Navigate replace to="/mobile" />,

View File

@ -1,7 +1,7 @@
import { RemoteSelect, SchemaComponent, Variable, useCollectionFilterOptions, useToken } from '@tachybase/client';
import React from 'react';
import { RemoteSelect, SchemaComponent, useCollectionFilterOptions, useToken, Variable } from '@tachybase/client';
import { FilterDynamicComponent, useWorkflowVariableOptions } from '@tachybase/plugin-workflow/client';
import { useField } from '@tachybase/schema';
import React from 'react';
// TODO: 可以将这个选择组件封装为一个通用组件, 放在 workflow 下提供使用
export const SelectNotifiedPerson = (props) => {

View File

@ -1,9 +1,10 @@
import { Plugin } from '@tachybase/client';
import PluginWorkflow from '@tachybase/plugin-workflow/client';
import { NoticeInstruction } from './Notice.instruction';
import { NOTICE_INSTRUCTION_NAMESPACE } from '../../common/constants';
import { SCNoticeDetail } from './show-interface/NoticeDetail.schema';
import { ArrayItems } from '@tachybase/components';
import PluginWorkflow from '@tachybase/plugin-workflow/client';
import { NOTICE_INSTRUCTION_NAMESPACE } from '../../common/constants';
import { NoticeInstruction } from './Notice.instruction';
import { SCNoticeDetail } from './show-interface/NoticeDetail.schema';
// NOTE: 试着用一种新的约束规则去声明文件属于哪种功能. 比如 kit.ts 导出的是单个 Plugin 下的功能集成
// 注册一个节点

View File

@ -1,12 +1,14 @@
import { SchemaInitializer, gridRowColWrap, usePlugin } from '@tachybase/client';
import { gridRowColWrap, SchemaInitializer, usePlugin } from '@tachybase/client';
import PluginWorkflow, {
useAvailableUpstreams,
useFlowContext,
useNodeContext,
useTrigger,
} from '@tachybase/plugin-workflow/client';
import { tval } from '../../locale';
import { NoticeDetailAddBlock } from './NoticeDetail.block';
// import { ApproverAddBlockComponent } from './VC.ApproverAddBlock';
// import { ApproverAddBlockKit } from './VC.ApproverAddBlockKit';

View File

@ -1,10 +1,11 @@
import React, { useContext, useMemo, useState } from 'react';
import { SchemaComponent, SchemaComponentContext } from '@tachybase/client';
import { useFlowContext } from '@tachybase/plugin-workflow/client';
import { uid } from '@tachybase/utils/client';
import React, { useContext, useMemo, useState } from 'react';
import { tval } from '../../locale';
import { schemaStyle } from './style';
import { NoticeDetail } from './NoticeDetail.schema';
import { schemaStyle } from './style';
export const NoticeDetailContainer = () => {
const context = useContext(SchemaComponentContext);

View File

@ -1,6 +1,7 @@
import React, { useCallback } from 'react';
import { Plugin, SchemaInitializerItem, useSchemaInitializer, useSchemaInitializerItem } from '@tachybase/client';
import { uid } from '@tachybase/utils/client';
import React, { useCallback } from 'react';
import { COLLECTION_NOTICE_NAME } from '../../common/constants';
import { NoticeBlockProvider } from './NoticeBlock.provider';
import { NoticeCenter } from './NoticeCenter.schema';

View File

@ -1,4 +1,4 @@
import { observer, useField, Field } from '@tachybase/schema';
import { Field, observer, useField } from '@tachybase/schema';
export const ColumnNode = observer(
() => {

View File

@ -1,4 +1,4 @@
import { observer, useField, Field } from '@tachybase/schema';
import { Field, observer, useField } from '@tachybase/schema';
export const ColumnUser = observer(
() => {

View File

@ -1,6 +1,7 @@
import React from 'react';
import { css } from '@tachybase/client';
import { Field, observer, useField } from '@tachybase/schema';
import React from 'react';
import { useTranslation } from '../../locale';
export const ColumnWorkflow = observer(

View File

@ -1,4 +1,5 @@
import { Plugin } from '@tachybase/client';
import { tval } from '../locale';
import { NoticeBlockInitializer, SCApprovalBlock } from './NoticeBlock.initializer';

View File

@ -1,4 +1,5 @@
import { defineCollection } from '@tachybase/database';
import { COLLECTION_NOTICE_NAME } from '../../common/constants';
export const COLLECTION_WORKFLOWS_NAME = 'workflows';

View File

@ -1,11 +1,11 @@
import path from 'path';
import WorkflowPlugin from '@tachybase/plugin-workflow';
import { Plugin } from '@tachybase/server';
import path from 'path';
import { NOTICE_INSTRUCTION_NAMESPACE } from '../common/constants';
import NoticeInstruction from './NoticeInstruction';
import { COLLECTION_NOTICE_NAME, NOTICE_INSTRUCTION_NAMESPACE } from '../common/constants';
import { init } from './actions';
import { COLLECTION_WORKFLOWS_NAME } from './collections/workflowNotice';
import { COLLECTION_NOTICE_NAME } from '../common/constants';
import NoticeInstruction from './NoticeInstruction';
export class PluginWorkflowNoticeServer extends Plugin {
workflow;

View File

@ -1,5 +1,7 @@
import { JOB_STATUS } from '@tachybase/plugin-workflow';
import _ from 'lodash';
import { NOTICE_ACTION_STATUS } from './constants';
interface ParamsType {