Commit bcab4b774d384a5de9b87a0c700a9937c79eb5cd

Authored by vben
1 parent 0f4b847d

perf(use-message): fix typo

CHANGELOG.zh_CN.md
... ... @@ -15,6 +15,7 @@
15 15  
16 16 - 修复升级之后 table 类型问题
17 17 - 修复分割菜单且左侧菜单没有数据时候,继续展示上一次子菜单的问题
  18 +- 修复`useMessage`类型问题
18 19  
19 20 ## 2.0.0-rc.8 (2020-11-2)
20 21  
... ...
src/hooks/web/useMessage.tsx
1 1 import type { ModalFunc, ModalFuncProps } from 'ant-design-vue/lib/modal/Modal';
  2 +import type { MessageApi } from 'ant-design-vue/lib/message/index';
  3 +import type { VNodeTypes, CSSProperties } from 'vue';
2 4  
3 5 import { Modal, message as Message, notification } from 'ant-design-vue';
4 6 import { InfoCircleFilled, CheckCircleFilled, CloseCircleFilled } from '@ant-design/icons-vue';
5 7  
6 8 import { useSetting } from '/@/hooks/core/useSetting';
7 9  
  10 +export interface ArgsProps {
  11 + message: VNodeTypes;
  12 + description?: VNodeTypes;
  13 + btn?: VNodeTypes;
  14 + key?: string;
  15 + onClose?: () => void;
  16 + duration?: number | null;
  17 + icon?: VNodeTypes;
  18 + placement?: NotificationPlacement;
  19 + style?: CSSProperties;
  20 + prefixCls?: string;
  21 + class?: string;
  22 + readonly type?: IconType;
  23 + onClick?: () => void;
  24 + top?: number;
  25 + bottom?: number;
  26 + getContainer?: () => HTMLElement;
  27 + closeIcon?: VNodeTypes;
  28 +}
  29 +
  30 +export declare type NotificationPlacement = 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight';
  31 +export declare type IconType = 'success' | 'info' | 'error' | 'warning';
  32 +export interface ConfigProps {
  33 + top?: string | number;
  34 + bottom?: string | number;
  35 + duration?: number;
  36 + placement?: NotificationPlacement;
  37 + getContainer?: () => HTMLElement;
  38 + closeIcon?: VNodeTypes;
  39 +}
  40 +
8 41 export interface ModalOptionsEx extends Omit<ModalFuncProps, 'iconType'> {
9 42 iconType: 'warning' | 'success' | 'error' | 'info';
10 43 }
... ... @@ -84,8 +117,8 @@ notification.config({
84 117 */
85 118 export function useMessage() {
86 119 return {
87   - createMessage: Message,
88   - notification,
  120 + createMessage: Message as MessageApi,
  121 + notification: notification as (arg: ArgsProps) => void,
89 122 createConfirm: createConfirm,
90 123 createSuccessModal,
91 124 createErrorModal,
... ...
src/router/menus/modules/demo/exception.ts
... ... @@ -25,10 +25,6 @@ const menu: MenuModule = {
25 25 path: 'not-data',
26 26 name: '无数据',
27 27 },
28   - {
29   - path: 'error-log',
30   - name: '错误日志',
31   - },
32 28 ],
33 29 },
34 30 };
... ...
src/router/menus/modules/demo/feat.ts
... ... @@ -46,6 +46,10 @@ const menu: MenuModule = {
46 46 name: '全屏',
47 47 },
48 48 {
  49 + path: 'error-log',
  50 + name: '错误日志',
  51 + },
  52 + {
49 53 path: 'testTab',
50 54 name: '带参Tab',
51 55 children: [
... ...
src/router/routes/modules/demo/exception.ts
... ... @@ -78,13 +78,5 @@ export default {
78 78 afterCloseLoading: true,
79 79 },
80 80 },
81   - {
82   - path: '/error-log',
83   - name: 'ErrorLog',
84   - component: () => import('/@/views/sys/error-log/index.vue'),
85   - meta: {
86   - title: '错误日志',
87   - },
88   - },
89 81 ],
90 82 } as AppRouteModule;
... ...
src/router/routes/modules/demo/feat.ts
... ... @@ -97,6 +97,14 @@ export default {
97 97 },
98 98 },
99 99 {
  100 + path: '/error-log',
  101 + name: 'ErrorLog',
  102 + component: () => import('/@/views/sys/error-log/index.vue'),
  103 + meta: {
  104 + title: '错误日志',
  105 + },
  106 + },
  107 + {
100 108 path: '/testTab/:id',
101 109 name: 'TestTab',
102 110 component: () => import('/@/views/demo/feat/tab-params/index.vue'),
... ...
src/views/sys/error-log/index.vue
... ... @@ -22,6 +22,7 @@
22 22  
23 23 import DetailModal from './DetailModal.vue';
24 24 import { useModal } from '/@/components/Modal/index';
  25 + import { useMessage } from '/@/hooks/web/useMessage';
25 26  
26 27 import { BasicTable, useTable, TableAction } from '/@/components/Table/index';
27 28  
... ... @@ -32,6 +33,7 @@
32 33 import { getColumns } from './data';
33 34  
34 35 import { cloneDeep } from 'lodash-es';
  36 + import { isDevMode } from '/@/utils/env';
35 37  
36 38 export default defineComponent({
37 39 name: 'ErrorHandler',
... ... @@ -39,8 +41,8 @@
39 41 setup() {
40 42 const rowInfoRef = ref<ErrorInfo>();
41 43 const imgListRef = ref<string[]>([]);
  44 +
42 45 const [register, { setTableData }] = useTable({
43   - titleHelpMessage: '只在`/src/settings/projectSetting.ts` 内的useErrorHandle=true时生效!',
44 46 title: '错误日志列表',
45 47 columns: getColumns(),
46 48 actionColumn: {
... ... @@ -50,8 +52,8 @@
50 52 slots: { customRender: 'action' },
51 53 },
52 54 });
53   -
54 55 const [registerModal, { openModal }] = useModal();
  56 +
55 57 watch(
56 58 () => errorStore.getErrorInfoState,
57 59 (list) => {
... ... @@ -63,7 +65,10 @@
63 65 immediate: true,
64 66 }
65 67 );
66   -
  68 + const { createMessage } = useMessage();
  69 + if (isDevMode()) {
  70 + createMessage.info('只在`/src/settings/projectSetting.ts` 内的useErrorHandle=true时生效!');
  71 + }
67 72 // 查看详情
68 73 function handleDetail(row: ErrorInfo) {
69 74 rowInfoRef.value = row;
... ...