Browse Source

perf(use-message): fix typo

vben 4 years ago
parent
commit
bcab4b774d

+ 1 - 0
CHANGELOG.zh_CN.md

@@ -15,6 +15,7 @@
 
 - 修复升级之后 table 类型问题
 - 修复分割菜单且左侧菜单没有数据时候,继续展示上一次子菜单的问题
+- 修复`useMessage`类型问题
 
 ## 2.0.0-rc.8 (2020-11-2)
 

+ 35 - 2
src/hooks/web/useMessage.tsx

@@ -1,10 +1,43 @@
 import type { ModalFunc, ModalFuncProps } from 'ant-design-vue/lib/modal/Modal';
+import type { MessageApi } from 'ant-design-vue/lib/message/index';
+import type { VNodeTypes, CSSProperties } from 'vue';
 
 import { Modal, message as Message, notification } from 'ant-design-vue';
 import { InfoCircleFilled, CheckCircleFilled, CloseCircleFilled } from '@ant-design/icons-vue';
 
 import { useSetting } from '/@/hooks/core/useSetting';
 
+export interface ArgsProps {
+  message: VNodeTypes;
+  description?: VNodeTypes;
+  btn?: VNodeTypes;
+  key?: string;
+  onClose?: () => void;
+  duration?: number | null;
+  icon?: VNodeTypes;
+  placement?: NotificationPlacement;
+  style?: CSSProperties;
+  prefixCls?: string;
+  class?: string;
+  readonly type?: IconType;
+  onClick?: () => void;
+  top?: number;
+  bottom?: number;
+  getContainer?: () => HTMLElement;
+  closeIcon?: VNodeTypes;
+}
+
+export declare type NotificationPlacement = 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight';
+export declare type IconType = 'success' | 'info' | 'error' | 'warning';
+export interface ConfigProps {
+  top?: string | number;
+  bottom?: string | number;
+  duration?: number;
+  placement?: NotificationPlacement;
+  getContainer?: () => HTMLElement;
+  closeIcon?: VNodeTypes;
+}
+
 export interface ModalOptionsEx extends Omit<ModalFuncProps, 'iconType'> {
   iconType: 'warning' | 'success' | 'error' | 'info';
 }
@@ -84,8 +117,8 @@ notification.config({
  */
 export function useMessage() {
   return {
-    createMessage: Message,
-    notification,
+    createMessage: Message as MessageApi,
+    notification: notification as (arg: ArgsProps) => void,
     createConfirm: createConfirm,
     createSuccessModal,
     createErrorModal,

+ 0 - 4
src/router/menus/modules/demo/exception.ts

@@ -25,10 +25,6 @@ const menu: MenuModule = {
         path: 'not-data',
         name: '无数据',
       },
-      {
-        path: 'error-log',
-        name: '错误日志',
-      },
     ],
   },
 };

+ 4 - 0
src/router/menus/modules/demo/feat.ts

@@ -46,6 +46,10 @@ const menu: MenuModule = {
         name: '全屏',
       },
       {
+        path: 'error-log',
+        name: '错误日志',
+      },
+      {
         path: 'testTab',
         name: '带参Tab',
         children: [

+ 0 - 8
src/router/routes/modules/demo/exception.ts

@@ -78,13 +78,5 @@ export default {
         afterCloseLoading: true,
       },
     },
-    {
-      path: '/error-log',
-      name: 'ErrorLog',
-      component: () => import('/@/views/sys/error-log/index.vue'),
-      meta: {
-        title: '错误日志',
-      },
-    },
   ],
 } as AppRouteModule;

+ 8 - 0
src/router/routes/modules/demo/feat.ts

@@ -97,6 +97,14 @@ export default {
       },
     },
     {
+      path: '/error-log',
+      name: 'ErrorLog',
+      component: () => import('/@/views/sys/error-log/index.vue'),
+      meta: {
+        title: '错误日志',
+      },
+    },
+    {
       path: '/testTab/:id',
       name: 'TestTab',
       component: () => import('/@/views/demo/feat/tab-params/index.vue'),

+ 8 - 3
src/views/sys/error-log/index.vue

@@ -22,6 +22,7 @@
 
   import DetailModal from './DetailModal.vue';
   import { useModal } from '/@/components/Modal/index';
+  import { useMessage } from '/@/hooks/web/useMessage';
 
   import { BasicTable, useTable, TableAction } from '/@/components/Table/index';
 
@@ -32,6 +33,7 @@
   import { getColumns } from './data';
 
   import { cloneDeep } from 'lodash-es';
+  import { isDevMode } from '/@/utils/env';
 
   export default defineComponent({
     name: 'ErrorHandler',
@@ -39,8 +41,8 @@
     setup() {
       const rowInfoRef = ref<ErrorInfo>();
       const imgListRef = ref<string[]>([]);
+
       const [register, { setTableData }] = useTable({
-        titleHelpMessage: '只在`/src/settings/projectSetting.ts` 内的useErrorHandle=true时生效!',
         title: '错误日志列表',
         columns: getColumns(),
         actionColumn: {
@@ -50,8 +52,8 @@
           slots: { customRender: 'action' },
         },
       });
-
       const [registerModal, { openModal }] = useModal();
+
       watch(
         () => errorStore.getErrorInfoState,
         (list) => {
@@ -63,7 +65,10 @@
           immediate: true,
         }
       );
-
+      const { createMessage } = useMessage();
+      if (isDevMode()) {
+        createMessage.info('只在`/src/settings/projectSetting.ts` 内的useErrorHandle=true时生效!');
+      }
       // 查看详情
       function handleDetail(row: ErrorInfo) {
         rowInfoRef.value = row;