feat: init support notice area (#1216)
Reviewed-on: daoyoucloud/tachybase#1216
This commit is contained in:
		
							parent
							
								
									d2dbcf8799
								
							
						
					
					
						commit
						a9acc4badc
					
				@ -252,7 +252,7 @@ export class Application {
 | 
			
		||||
    });
 | 
			
		||||
    this.ws.on('serverDown', () => {
 | 
			
		||||
      this.maintaining = true;
 | 
			
		||||
      this.maintained = false;
 | 
			
		||||
      this.maintained = true;
 | 
			
		||||
    });
 | 
			
		||||
    this.ws.connect();
 | 
			
		||||
    try {
 | 
			
		||||
 | 
			
		||||
@ -1,4 +1,5 @@
 | 
			
		||||
import React, { createContext, ReactNode, useContext, useEffect } from 'react';
 | 
			
		||||
import { define, observable } from '@tachybase/schema';
 | 
			
		||||
 | 
			
		||||
import { message, notification } from 'antd';
 | 
			
		||||
import mitt, { Emitter, EventType } from 'mitt';
 | 
			
		||||
@ -54,7 +55,11 @@ export class NoticeManager {
 | 
			
		||||
  constructor(private app: Application) {
 | 
			
		||||
    this.ws = app.ws;
 | 
			
		||||
    this.emitter = mitt();
 | 
			
		||||
    define(this, {
 | 
			
		||||
      currentStatus: observable.ref,
 | 
			
		||||
    });
 | 
			
		||||
  }
 | 
			
		||||
  currentStatus = '';
 | 
			
		||||
 | 
			
		||||
  on(data: { type: NoticeType; title?: string; content: string; level: NoticeLevel; eventType?: string; event?: any }) {
 | 
			
		||||
    if (data.type === NoticeType.NOTIFICATION) {
 | 
			
		||||
@ -68,6 +73,7 @@ export class NoticeManager {
 | 
			
		||||
 | 
			
		||||
  status(content: string, level: NoticeLevel) {
 | 
			
		||||
    // 常驻消息
 | 
			
		||||
    this.currentStatus = content;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  toast(content: string, level: NoticeLevel) {
 | 
			
		||||
 | 
			
		||||
@ -0,0 +1,12 @@
 | 
			
		||||
import React from 'react';
 | 
			
		||||
import { observer } from '@tachybase/schema';
 | 
			
		||||
 | 
			
		||||
import { useNoticeManager } from '../../application';
 | 
			
		||||
 | 
			
		||||
export const NoticeArea = observer(
 | 
			
		||||
  (props: React.HTMLAttributes<HTMLDivElement>) => {
 | 
			
		||||
    const nm = useNoticeManager();
 | 
			
		||||
    return <div {...props}>{nm.manager.currentStatus ? nm.manager.currentStatus : null}</div>;
 | 
			
		||||
  },
 | 
			
		||||
  { displayName: 'NoticeArea' },
 | 
			
		||||
);
 | 
			
		||||
@ -25,6 +25,7 @@ import {
 | 
			
		||||
} from '../..';
 | 
			
		||||
import { Plugin } from '../../application/Plugin';
 | 
			
		||||
import { VariablesProvider } from '../../variables';
 | 
			
		||||
import { NoticeArea } from './NoticeArea';
 | 
			
		||||
 | 
			
		||||
const useStyles = createStyles(({ css, token }) => {
 | 
			
		||||
  return {
 | 
			
		||||
@ -104,6 +105,10 @@ const useStyles = createStyles(({ css, token }) => {
 | 
			
		||||
    editor: css`
 | 
			
		||||
      flex: 1 1 auto;
 | 
			
		||||
      width: 0;
 | 
			
		||||
      display: flex;
 | 
			
		||||
    `,
 | 
			
		||||
    notice: css`
 | 
			
		||||
      flex: 1;
 | 
			
		||||
    `,
 | 
			
		||||
    sider: css`
 | 
			
		||||
      height: 100%;
 | 
			
		||||
@ -411,6 +416,7 @@ export const InternalAdminLayout = (props: any) => {
 | 
			
		||||
              <h1 className={styles.title}>{result?.data?.data?.title}</h1>
 | 
			
		||||
            </div>
 | 
			
		||||
            <div className={styles.editor}>
 | 
			
		||||
              <NoticeArea className={styles.notice} />
 | 
			
		||||
              <SetThemeOfHeaderSubmenu>
 | 
			
		||||
                <MenuEditor sideMenuRef={sideMenuRef} />
 | 
			
		||||
              </SetThemeOfHeaderSubmenu>
 | 
			
		||||
@ -472,3 +478,5 @@ export class AdminLayoutPlugin extends Plugin {
 | 
			
		||||
    this.app.addComponents({ AdminLayout });
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export * from './NoticeArea';
 | 
			
		||||
 | 
			
		||||
@ -3,13 +3,13 @@ import { observer } from '@tachybase/schema';
 | 
			
		||||
import { getSubAppName } from '@tachybase/sdk';
 | 
			
		||||
 | 
			
		||||
import { DisconnectOutlined, LoadingOutlined } from '@ant-design/icons';
 | 
			
		||||
import { Button, Modal, Result, Spin } from 'antd';
 | 
			
		||||
import { Button, Result, Spin } from 'antd';
 | 
			
		||||
import { createStyles } from 'antd-style';
 | 
			
		||||
import { useTranslation } from 'react-i18next';
 | 
			
		||||
import { Navigate, useNavigate } from 'react-router-dom';
 | 
			
		||||
 | 
			
		||||
import { useAPIClient } from '../api-client';
 | 
			
		||||
import { Application, useApp } from '../application';
 | 
			
		||||
import { Application, NoticeLevel, useApp } from '../application';
 | 
			
		||||
import { Plugin } from '../application/Plugin';
 | 
			
		||||
import { BlockSchemaComponentPlugin } from '../block-provider';
 | 
			
		||||
import { CollectionPlugin } from '../collection-manager';
 | 
			
		||||
@ -28,7 +28,7 @@ import { PinnedListPlugin } from './pinned-list';
 | 
			
		||||
import { PMPlugin } from './pm';
 | 
			
		||||
import { SystemSettingsPlugin } from './system-settings';
 | 
			
		||||
 | 
			
		||||
export { AdminProvider } from './admin-layout';
 | 
			
		||||
export { AdminProvider, NoticeArea } from './admin-layout';
 | 
			
		||||
 | 
			
		||||
interface AppStatusProps {
 | 
			
		||||
  error: Error;
 | 
			
		||||
@ -248,11 +248,9 @@ const AppMaintaining = observer(
 | 
			
		||||
const AppMaintainingDialog = observer(
 | 
			
		||||
  ({ app }: AppStatusProps) => {
 | 
			
		||||
    const { icon, status, title, subTitle } = getProps(app);
 | 
			
		||||
    return (
 | 
			
		||||
      <Modal open={true} footer={null} closable={false}>
 | 
			
		||||
        <Result icon={icon} status={status} title={app.i18n.t(title)} subTitle={app.i18n.t(subTitle)} />
 | 
			
		||||
      </Modal>
 | 
			
		||||
    );
 | 
			
		||||
    const manager = app.noticeManager;
 | 
			
		||||
    manager.status(app.i18n.t(title) + app.i18n.t(subTitle), NoticeLevel.INFO);
 | 
			
		||||
    return null;
 | 
			
		||||
  },
 | 
			
		||||
  { displayName: 'AppMaintainingDialog' },
 | 
			
		||||
);
 | 
			
		||||
 | 
			
		||||
@ -5,6 +5,7 @@ import {
 | 
			
		||||
  CurrentUser,
 | 
			
		||||
  findByUid,
 | 
			
		||||
  findMenuItem,
 | 
			
		||||
  NoticeArea,
 | 
			
		||||
  PinnedPluginList,
 | 
			
		||||
  SchemaComponent,
 | 
			
		||||
  useACLRoleContext,
 | 
			
		||||
@ -17,7 +18,7 @@ import {
 | 
			
		||||
} from '@tachybase/client';
 | 
			
		||||
 | 
			
		||||
import { useSessionStorageState } from 'ahooks';
 | 
			
		||||
import { Alert, App, Layout } from 'antd';
 | 
			
		||||
import { App, Layout } from 'antd';
 | 
			
		||||
import { Link, Outlet, useMatch, useNavigate, useParams } from 'react-router-dom';
 | 
			
		||||
 | 
			
		||||
import { MobileLink } from '../components/system/MobileLink';
 | 
			
		||||
@ -287,8 +288,14 @@ export const InternalAdminLayout = () => {
 | 
			
		||||
              className={css`
 | 
			
		||||
                flex: 1 1 auto;
 | 
			
		||||
                width: 0;
 | 
			
		||||
                display: flex;
 | 
			
		||||
              `}
 | 
			
		||||
            >
 | 
			
		||||
              <NoticeArea
 | 
			
		||||
                className={css`
 | 
			
		||||
                  flex: 1;
 | 
			
		||||
                `}
 | 
			
		||||
              />
 | 
			
		||||
              <MenuEditor sideMenuRef={sideMenuRef} />
 | 
			
		||||
            </div>
 | 
			
		||||
          </div>
 | 
			
		||||
 | 
			
		||||
@ -20,6 +20,7 @@ export class PluginCoreServer extends Plugin {
 | 
			
		||||
    });
 | 
			
		||||
    this.addFeature(DepartmentsPlugin);
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  async load() {
 | 
			
		||||
    try {
 | 
			
		||||
      await Container.get(ConnectionManager).load();
 | 
			
		||||
@ -35,8 +36,5 @@ export class PluginCoreServer extends Plugin {
 | 
			
		||||
      console.warn(err);
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
  async afterEnable() {}
 | 
			
		||||
  async afterDisable() {}
 | 
			
		||||
  async remove() {}
 | 
			
		||||
}
 | 
			
		||||
export default PluginCoreServer;
 | 
			
		||||
 | 
			
		||||
		Loading…
	
		Reference in New Issue
	
	Block a user