module-menu 0.0.5 → 0.0.7

package/src/.umi/plugin-model/useModel.tsx

@@ -0,0 +1,71 @@
+// @ts-nocheck
+import { useState, useEffect, useContext, useRef } from 'react';
+// @ts-ignore
+import isEqual from 'D:/NewGitPro/module-menu/node_modules/@umijs/plugin-model/node_modules/fast-deep-equal/index.js';
+// @ts-ignore
+import { UmiContext } from './helpers/constant';
+import { Model, models } from './Provider';
+
+export type Models<T extends keyof typeof models> = Model<T>[T]
+
+export function useModel<T extends keyof Model<T>>(model: T): Model<T>[T]
+export function useModel<T extends keyof Model<T>, U>(model: T, selector: (model: Model<T>[T]) => U): U
+
+export function useModel<T extends keyof Model<T>, U>(
+  namespace: T,
+  updater?: (model: Model<T>[T]) => U
+) : typeof updater extends undefined ? Model<T>[T] : ReturnType<NonNullable<typeof updater>>{
+
+  type RetState = typeof updater extends undefined ? Model<T>[T] : ReturnType<NonNullable<typeof updater>>
+  const dispatcher = useContext<any>(UmiContext);
+  const updaterRef = useRef(updater);
+  updaterRef.current = updater;
+  const [state, setState] = useState<RetState>(
+    () => updaterRef.current ? updaterRef.current(dispatcher.data![namespace]) : dispatcher.data![namespace]
+  );
+  const stateRef = useRef<any>(state);
+  stateRef.current = state;
+
+  const isMount = useRef(false);
+  useEffect(() => {
+    isMount.current = true;
+    return () => {
+      isMount.current = false;
+    }
+  }, [])
+
+  useEffect(() => {
+    const handler = (e: any) => {
+      if(!isMount.current) {
+        // 如果 handler 执行过程中，组件被卸载了，则强制更新全局 data
+        setTimeout(() => {
+          dispatcher.data![namespace] = e;
+          dispatcher.update(namespace);
+        });
+      } else {
+        if(updater && updaterRef.current){
+          const currentState = updaterRef.current(e);
+          const previousState = stateRef.current
+          if(!isEqual(currentState, previousState)){
+            setState(currentState);
+          }
+        } else {
+          setState(e);
+        }
+      }
+    }
+    try {
+      dispatcher.callbacks![namespace]!.add(handler);
+      dispatcher.update(namespace);
+    } catch (e) {
+      dispatcher.callbacks![namespace] = new Set();
+      dispatcher.callbacks![namespace]!.add(handler);
+      dispatcher.update(namespace);
+    }
+    return () => {
+      dispatcher.callbacks![namespace]!.delete(handler);
+    }
+  }, [namespace]);
+
+  return state;
+};

package/src/.umi/plugin-request/request.ts

@@ -0,0 +1,278 @@
+// @ts-nocheck
+/**
+ * Base on https://github.com/umijs/D:/NewGitPro/module-menu/node_modules/umi-request
+ */
+import {
+  extend,
+  Context,
+  RequestOptionsInit,
+  OnionMiddleware,
+  RequestOptionsWithoutResponse,
+  RequestMethod,
+  RequestOptionsWithResponse,
+  RequestResponse,
+  RequestInterceptor,
+  ResponseInterceptor,
+} from 'D:/NewGitPro/module-menu/node_modules/umi-request';
+// @ts-ignore
+
+import { ApplyPluginsType } from 'umi';
+import { history, plugin } from '../core/umiExports';
+            
+// decoupling with antd UI library, you can using `alias` modify the ui methods
+// @ts-ignore
+import { message, notification } from '@umijs/plugin-request/lib/ui';
+import useUmiRequest, { UseRequestProvider } from 'D:/NewGitPro/module-menu/node_modules/@ahooksjs/use-request';
+import {
+  BaseOptions,
+  BasePaginatedOptions,
+  BaseResult,
+  CombineService,
+  LoadMoreFormatReturn,
+  LoadMoreOptions,
+  LoadMoreOptionsWithFormat,
+  LoadMoreParams,
+  LoadMoreResult,
+  OptionsWithFormat,
+  PaginatedFormatReturn,
+  PaginatedOptionsWithFormat,
+  PaginatedParams,
+  PaginatedResult,
+} from 'D:/NewGitPro/module-menu/node_modules/@ahooksjs/use-request/lib/types';
+
+type ResultWithData<T = any> = { data?: T; [key: string]: any };
+
+function useRequest<
+  R = any,
+  P extends any[] = any,
+  U = any,
+  UU extends U = any,
+>(
+  service: CombineService<R, P>,
+  options: OptionsWithFormat<R, P, U, UU>,
+): BaseResult<U, P>;
+function useRequest<R extends ResultWithData = any, P extends any[] = any>(
+  service: CombineService<R, P>,
+  options?: BaseOptions<R['data'], P>,
+): BaseResult<R['data'], P>;
+function useRequest<R extends LoadMoreFormatReturn = any, RR = any>(
+  service: CombineService<RR, LoadMoreParams<R>>,
+  options: LoadMoreOptionsWithFormat<R, RR>,
+): LoadMoreResult<R>;
+function useRequest<
+  R extends ResultWithData<LoadMoreFormatReturn | any> = any,
+  RR extends R = any,
+>(
+  service: CombineService<R, LoadMoreParams<R['data']>>,
+  options: LoadMoreOptions<RR['data']>,
+): LoadMoreResult<R['data']>;
+
+function useRequest<R = any, Item = any, U extends Item = any>(
+  service: CombineService<R, PaginatedParams>,
+  options: PaginatedOptionsWithFormat<R, Item, U>,
+): PaginatedResult<Item>;
+function useRequest<Item = any, U extends Item = any>(
+  service: CombineService<
+    ResultWithData<PaginatedFormatReturn<Item>>,
+    PaginatedParams
+  >,
+  options: BasePaginatedOptions<U>,
+): PaginatedResult<Item>;
+function useRequest(service: any, options: any = {}) {
+  return useUmiRequest(service, {
+    formatResult: result => result?.data,
+    requestMethod: (requestOptions: any) => {
+      if (typeof requestOptions === 'string') {
+        return request(requestOptions);
+      }
+      if (typeof requestOptions === 'object') {
+        const { url, ...rest } = requestOptions;
+        return request(url, rest);
+      }
+      throw new Error('request options error');
+    },
+    ...options,
+  });
+}
+
+export interface RequestConfig extends RequestOptionsInit {
+  errorConfig?: {
+    errorPage?: string;
+    adaptor?: (resData: any, ctx: Context) => ErrorInfoStructure;
+  };
+  middlewares?: OnionMiddleware[];
+  requestInterceptors?: RequestInterceptor[];
+  responseInterceptors?: ResponseInterceptor[];
+}
+
+export enum ErrorShowType {
+  SILENT = 0,
+  WARN_MESSAGE = 1,
+  ERROR_MESSAGE = 2,
+  NOTIFICATION = 4,
+  REDIRECT = 9,
+}
+
+interface ErrorInfoStructure {
+  success: boolean;
+  data?: any;
+  errorCode?: string;
+  errorMessage?: string;
+  showType?: ErrorShowType;
+  traceId?: string;
+  host?: string;
+  [key: string]: any;
+}
+
+interface RequestError extends Error {
+  data?: any;
+  info?: ErrorInfoStructure;
+  request?: Context['req'];
+  response?: Context['res'];
+}
+
+const DEFAULT_ERROR_PAGE = '/exception';
+
+let requestMethodInstance: RequestMethod;
+const getRequestMethod = () => {
+  if (requestMethodInstance) {
+    // request method 已经示例化
+    return requestMethodInstance;
+  }
+
+  // runtime 配置可能应为依赖顺序的问题在模块初始化的时候无法获取，所以需要封装一层在异步调用后初始化相关方法
+  // 当用户的 app.ts 中依赖了该文件的情况下就该模块的初始化时间就会被提前，无法获取到运行时配置
+  const requestConfig: RequestConfig = plugin.applyPlugins({
+    key: 'request',
+    type: ApplyPluginsType.modify,
+    initialValue: {},
+  });
+
+  const errorAdaptor =
+    requestConfig.errorConfig?.adaptor || ((resData) => resData);
+
+  requestMethodInstance = extend({
+    errorHandler: (error: RequestError) => {
+      // @ts-ignore
+      if (error?.request?.options?.skipErrorHandler) {
+        throw error;
+      }
+      let errorInfo: ErrorInfoStructure | undefined;
+      if (error.name === 'ResponseError' && error.data && error.request) {
+        const ctx: Context = {
+          req: error.request,
+          res: error.response,
+        };
+        errorInfo = errorAdaptor(error.data, ctx);
+        error.message = errorInfo?.errorMessage || error.message;
+        error.data = error.data;
+        error.info = errorInfo;
+      }
+      errorInfo = error.info;
+
+      if (errorInfo) {
+        const errorMessage = errorInfo?.errorMessage;
+        const errorCode = errorInfo?.errorCode;
+        const errorPage =
+          requestConfig.errorConfig?.errorPage || DEFAULT_ERROR_PAGE;
+
+        switch (errorInfo?.showType) {
+          case ErrorShowType.SILENT:
+            // do nothing
+            break;
+          case ErrorShowType.WARN_MESSAGE:
+            message.warn(errorMessage);
+            break;
+          case ErrorShowType.ERROR_MESSAGE:
+            message.error(errorMessage);
+            break;
+          case ErrorShowType.NOTIFICATION:
+            notification.open({
+              description: errorMessage,
+              message: errorCode,
+            });
+            break;
+          case ErrorShowType.REDIRECT:
+            // @ts-ignore
+            history.push({
+              pathname: errorPage,
+              query: { errorCode, errorMessage },
+            });
+            // redirect to error page
+            break;
+          default:
+            message.error(errorMessage);
+            break;
+        }
+      } else {
+        message.error(error.message || 'Request error, please retry.');
+      }
+      throw error;
+    },
+    ...requestConfig,
+  });
+
+  // 中间件统一错误处理
+  // 后端返回格式 { success: boolean, data: any }
+  // 按照项目具体情况修改该部分逻辑
+  requestMethodInstance.use(async (ctx, next) => {
+    await next();
+    const { req, res } = ctx;
+    // @ts-ignore
+    if (req.options?.skipErrorHandler) {
+      return;
+    }
+    const { options } = req;
+    const { getResponse } = options;
+    const resData = getResponse ? res.data : res;
+    const errorInfo = errorAdaptor(resData, ctx);
+    if (errorInfo.success === false) {
+      // 抛出错误到 errorHandler 中处理
+      const error: RequestError = new Error(errorInfo.errorMessage);
+      error.name = 'BizError';
+      error.data = resData;
+      error.info = errorInfo;
+      error.response = res;
+      throw error;
+    }
+  });
+
+  // Add user custom middlewares
+  const customMiddlewares = requestConfig.middlewares || [];
+  customMiddlewares.forEach((mw) => {
+    requestMethodInstance.use(mw);
+  });
+
+  // Add user custom interceptors
+  const requestInterceptors = requestConfig.requestInterceptors || [];
+  const responseInterceptors = requestConfig.responseInterceptors || [];
+  requestInterceptors.map((ri) => {
+    requestMethodInstance.interceptors.request.use(ri);
+  });
+  responseInterceptors.map((ri) => {
+    requestMethodInstance.interceptors.response.use(ri);
+  });
+
+  return requestMethodInstance;
+};
+
+interface RequestMethodInUmi<R = false> {
+  <T = any>(
+    url: string,
+    options: RequestOptionsWithResponse & { skipErrorHandler?: boolean },
+  ): Promise<RequestResponse<T>>;
+  <T = any>(
+    url: string,
+    options: RequestOptionsWithoutResponse & { skipErrorHandler?: boolean },
+  ): Promise<T>;
+  <T = any>(
+    url: string,
+    options?: RequestOptionsInit & { skipErrorHandler?: boolean },
+  ): R extends true ? Promise<RequestResponse<T>> : Promise<T>;
+}
+const request: RequestMethodInUmi = (url: any, options: any) => {
+  const requestMethod = getRequestMethod();
+  return requestMethod(url, options);
+};
+
+export { request, useRequest, UseRequestProvider };

package/src/.umi/umi.ts

@@ -0,0 +1,58 @@
+// @ts-nocheck
+import './core/polyfill';
+import '@@/core/devScripts';
+import { plugin } from './core/plugin';
+import './core/pluginRegister';
+import { createHistory } from './core/history';
+import { ApplyPluginsType } from 'D:/NewGitPro/module-menu/node_modules/umi/node_modules/@umijs/runtime';
+import { renderClient } from 'D:/NewGitPro/module-menu/node_modules/@umijs/renderer-react/dist/index.js';
+import { getRoutes } from './core/routes';
+
+
+
+
+const getClientRender = (args: { hot?: boolean; routes?: any[] } = {}) => plugin.applyPlugins({
+  key: 'render',
+  type: ApplyPluginsType.compose,
+  initialValue: () => {
+    const opts = plugin.applyPlugins({
+      key: 'modifyClientRenderOpts',
+      type: ApplyPluginsType.modify,
+      initialValue: {
+        routes: args.routes || getRoutes(),
+        plugin,
+        history: createHistory(args.hot),
+        isServer: process.env.__IS_SERVER,
+        rootElement: 'root',
+        defaultTitle: ``,
+      },
+    });
+    return renderClient(opts);
+  },
+  args,
+});
+
+const clientRender = getClientRender();
+export default clientRender();
+
+
+    window.g_umi = {
+      version: '3.5.41',
+    };
+  
+
+// hot module replacement
+// @ts-ignore
+if (module.hot) {
+  // @ts-ignore
+  module.hot.accept('./core/routes', () => {
+    const ret = require('./core/routes');
+    if (ret.then) {
+      ret.then(({ getRoutes }) => {
+        getClientRender({ hot: true, routes: getRoutes() })();
+      });
+    } else {
+      getClientRender({ hot: true, routes: ret.getRoutes() })();
+    }
+  });
+}

package/src/{App.js → pages/index.jsx}

@@ -1,10 +1,6 @@
 import React, { Component } from 'react';
 import { Popconfirm, message } from 'antd';
-import homeIcon from './assets/home.svg'
-import moduleIcon from './assets/module.svg'
-import menuIcon from './assets/menuIcon.svg'
-import childIcon from './assets/childIcon.svg'
-import './App.css'
+import './index.less'
 class ModuleMenu extends Component {
     constructor(props) {
         super(props);
@@ -12,19 +8,19 @@ class ModuleMenu extends Component {
             showMenu: false,
             menuList: [{
                 name: '首页',
-                url: homeIcon,
+                url: require('../assets/home.svg'),
                 children: []
             },
             {
                 name: '数据汇聚',
-                url: moduleIcon,
+                url: require('../assets/module.svg'),
                 children: [{
                     childName: '数据集成平台'
                 }]
             },
             {
                 name: '数据治理',
-                url: moduleIcon,
+                url: require('../assets/module.svg'),
                 children: [{
                     childName: '数据治理平台'
                 },
@@ -40,7 +36,7 @@ class ModuleMenu extends Component {
             },
             {
                 name: '数据开发',
-                url: moduleIcon,
+                url: require('../assets/module.svg'),
                 children: [{
                     childName: '离线开发平台'
                 },
@@ -50,7 +46,7 @@ class ModuleMenu extends Component {
             },
             {
                 name: '数据开放',
-                url: moduleIcon,
+                url: require('../assets/module.svg'),
                 children: [{
                     childName: '数据服务'
                 },
@@ -60,7 +56,7 @@ class ModuleMenu extends Component {
             },
             {
                 name: '数据应用',
-                url: moduleIcon,
+                url: require('../assets/module.svg'),
                 children: [{
                     childName: '标签管理系统'
                 },
@@ -199,17 +195,17 @@ class ModuleMenu extends Component {
             return (
                 <div key={item.name} className="cardLine" style={{height: index === 2 ? '90px' : ''}}>
                     <div className='leftMenu'>
-                        <img src={item.url} className="middle" alt=""/>
+                        <img src={item.url} className="middle"/>
                         <span className="middle textPad" onClick={() => {this.toHomePage(index)}}>{item.name}</span>
                     </div>
                     <div className='rightMenu' style={{height: index === 2 ? '90px' : '', borderBottom: index === 5 ? '0px' : '1px solid #E9E9E9'}}>
                         {
                             item.children.map((child, idx) => {
                                 return (
-                                    <span key={idx}>
-                                        <img src={childIcon} className="middle iconPad" alt=""/>
-                                        <span className='childMenu textPad middle' onClick={() => {this.toModulePage(child.childName)}}>{child.childName}</span>
-                                    </span>
+                                    <>
+                                        <img src={require('../assets/childIcon.svg')} className="middle iconPad"/>
+                                        <span className='childMenu textPad middle' key={child.childName} onClick={() => {this.toModulePage(child.childName)}}>{child.childName}</span>
+                                    </>
                                 )
                             })
                         }
@@ -229,7 +225,7 @@ class ModuleMenu extends Component {
                     showCancel = {false}
                 >
                     <span className='menuIcon'>
-                        <img src={menuIcon} alt=""/>
+                        <img src={require('../assets/menuIcon.svg')}/>
                     </span>
                 </Popconfirm>
             </>

package/src/{App.css → pages/index.less}

@@ -1,69 +1,69 @@
-.ant-popconfirm .ant-popconfirm-buttons {
-    display: none !important;
-}
-.ant-popover-placement-rightTop .ant-popover-arrow {
-    display: none !important;
-}
-.ant-popconfirm .ant-popconfirm-message {
-    margin-bottom: 0px;
-}
-.ant-popconfirm .ant-popconfirm-message {
-    width: 650px;
-}
-.cardLine{
-    height: 60px;
-    padding: 5px 0px;
-}
-.textPad{
-    padding-left: 10px;
-}
-.iconPad{
-    padding-top: 15px;
-}
-.leftMenu{
-    width: 100px;
-    height: 60px;
-    padding: 0px 35px;
-    line-height: 60px;
-    float: left;
-    color: rgba(0, 0, 0, 0.85);
-    font-size: 16px;
-    cursor: pointer;
-    text-align: left;
-}
-.rightMenu{
-    width: 460px;
-    height: 60px;
-    float: left;
-    vertical-align: middle;
-    padding: 5px 10px 0px 10px;
-    font-size: 14px;
-    color: rgba(0,0,0,0.65);
-}
-.childMenu:hover{
-    cursor: pointer;
-    color: #4091F7;
-}
-.childMenu{
-    width: 27%;
-    display: inline-block;
-    padding-top: 15px;
-}
-.middle{
-    vertical-align: middle;
-}
-.menuIcon{
-    width: 60px;
-    height: 50px;
-    text-align: center;
-    display: inline-block;
-    line-height: 67px;
-    cursor: pointer;
-    background-color: #4091F7;
-}
-.ant-popover .ant-popover-inner {
-    border-radius: 0px;
-}
-.ant-popover {
-    left: 69px !important;
+.ant-popconfirm .ant-popconfirm-buttons {
+    display: none !important;
+}
+.ant-popover-placement-rightTop .ant-popover-arrow {
+    display: none !important;
+}
+.ant-popconfirm .ant-popconfirm-message {
+    margin-bottom: 0px;
+}
+.ant-popconfirm .ant-popconfirm-message {
+    width: 650px;
+}
+.cardLine{
+    height: 60px;
+    padding: 5px 0px;
+}
+.textPad{
+    padding-left: 10px;
+}
+.iconPad{
+    padding-top: 15px;
+}
+.leftMenu{
+    width: 100px;
+    height: 60px;
+    padding: 0px 35px;
+    line-height: 60px;
+    float: left;
+    color: rgba(0, 0, 0, 0.85);
+    font-size: 16px;
+    cursor: pointer;
+    text-align: left;
+}
+.rightMenu{
+    width: 460px;
+    height: 60px;
+    float: left;
+    vertical-align: middle;
+    padding: 5px 10px 0px 10px;
+    font-size: 14px;
+    color: rgba(0,0,0,0.65);
+}
+.childMenu:hover{
+    cursor: pointer;
+    color: #4091F7;
+}
+.childMenu{
+    width: 27%;
+    display: inline-block;
+    padding-top: 15px;
+}
+.middle{
+    vertical-align: middle;
+}
+.menuIcon{
+    width: 60px;
+    height: 50px;
+    text-align: center;
+    display: inline-block;
+    line-height: 67px;
+    cursor: pointer;
+    background-color: #4091F7;
+}
+.ant-popover .ant-popover-inner {
+    border-radius: 0px;
+}
+.ant-popover {
+    left: 69px !important;
 }

package/tsconfig.json

@@ -0,0 +1,37 @@
+{
+  "compilerOptions": {
+    "target": "esnext",
+    "module": "esnext",
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "importHelpers": true,
+    "jsx": "preserve",
+    "esModuleInterop": true,
+    "sourceMap": true,
+    "baseUrl": "./",
+    "strict": true,
+    "paths": {
+      "@/*": ["src/*"],
+      "@@/*": ["src/.umi/*"]
+    },
+    "allowSyntheticDefaultImports": true
+  },
+  "include": [
+    "mock/**/*",
+    "src/**/*",
+    "config/**/*",
+    ".umirc.ts",
+    "typings.d.ts"
+  ],
+  "exclude": [
+    "node_modules",
+    "lib",
+    "es",
+    "dist",
+    "typings",
+    "**/__test__",
+    "test",
+    "docs",
+    "tests"
+  ]
+}

package/typings.d.ts

@@ -0,0 +1,10 @@
+declare module '*.css';
+declare module '*.less';
+declare module '*.png';
+declare module '*.svg' {
+  export function ReactComponent(
+    props: React.SVGProps<SVGSVGElement>,
+  ): React.ReactElement;
+  const url: string;
+  export default url;
+}