Commit bcab4b774d384a5de9b87a0c700a9937c79eb5cd
1 parent
0f4b847d
perf(use-message): fix typo
Showing
7 changed files
with
56 additions
and
17 deletions
CHANGELOG.zh_CN.md
src/hooks/web/useMessage.tsx
1 | import type { ModalFunc, ModalFuncProps } from 'ant-design-vue/lib/modal/Modal'; | 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 | import { Modal, message as Message, notification } from 'ant-design-vue'; | 5 | import { Modal, message as Message, notification } from 'ant-design-vue'; |
4 | import { InfoCircleFilled, CheckCircleFilled, CloseCircleFilled } from '@ant-design/icons-vue'; | 6 | import { InfoCircleFilled, CheckCircleFilled, CloseCircleFilled } from '@ant-design/icons-vue'; |
5 | 7 | ||
6 | import { useSetting } from '/@/hooks/core/useSetting'; | 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 | export interface ModalOptionsEx extends Omit<ModalFuncProps, 'iconType'> { | 41 | export interface ModalOptionsEx extends Omit<ModalFuncProps, 'iconType'> { |
9 | iconType: 'warning' | 'success' | 'error' | 'info'; | 42 | iconType: 'warning' | 'success' | 'error' | 'info'; |
10 | } | 43 | } |
@@ -84,8 +117,8 @@ notification.config({ | @@ -84,8 +117,8 @@ notification.config({ | ||
84 | */ | 117 | */ |
85 | export function useMessage() { | 118 | export function useMessage() { |
86 | return { | 119 | return { |
87 | - createMessage: Message, | ||
88 | - notification, | 120 | + createMessage: Message as MessageApi, |
121 | + notification: notification as (arg: ArgsProps) => void, | ||
89 | createConfirm: createConfirm, | 122 | createConfirm: createConfirm, |
90 | createSuccessModal, | 123 | createSuccessModal, |
91 | createErrorModal, | 124 | createErrorModal, |
src/router/menus/modules/demo/exception.ts
src/router/menus/modules/demo/feat.ts
@@ -46,6 +46,10 @@ const menu: MenuModule = { | @@ -46,6 +46,10 @@ const menu: MenuModule = { | ||
46 | name: '全屏', | 46 | name: '全屏', |
47 | }, | 47 | }, |
48 | { | 48 | { |
49 | + path: 'error-log', | ||
50 | + name: '错误日志', | ||
51 | + }, | ||
52 | + { | ||
49 | path: 'testTab', | 53 | path: 'testTab', |
50 | name: '带参Tab', | 54 | name: '带参Tab', |
51 | children: [ | 55 | children: [ |
src/router/routes/modules/demo/exception.ts
@@ -78,13 +78,5 @@ export default { | @@ -78,13 +78,5 @@ export default { | ||
78 | afterCloseLoading: true, | 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 | } as AppRouteModule; | 82 | } as AppRouteModule; |
src/router/routes/modules/demo/feat.ts
@@ -97,6 +97,14 @@ export default { | @@ -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 | path: '/testTab/:id', | 108 | path: '/testTab/:id', |
101 | name: 'TestTab', | 109 | name: 'TestTab', |
102 | component: () => import('/@/views/demo/feat/tab-params/index.vue'), | 110 | component: () => import('/@/views/demo/feat/tab-params/index.vue'), |
src/views/sys/error-log/index.vue
@@ -22,6 +22,7 @@ | @@ -22,6 +22,7 @@ | ||
22 | 22 | ||
23 | import DetailModal from './DetailModal.vue'; | 23 | import DetailModal from './DetailModal.vue'; |
24 | import { useModal } from '/@/components/Modal/index'; | 24 | import { useModal } from '/@/components/Modal/index'; |
25 | + import { useMessage } from '/@/hooks/web/useMessage'; | ||
25 | 26 | ||
26 | import { BasicTable, useTable, TableAction } from '/@/components/Table/index'; | 27 | import { BasicTable, useTable, TableAction } from '/@/components/Table/index'; |
27 | 28 | ||
@@ -32,6 +33,7 @@ | @@ -32,6 +33,7 @@ | ||
32 | import { getColumns } from './data'; | 33 | import { getColumns } from './data'; |
33 | 34 | ||
34 | import { cloneDeep } from 'lodash-es'; | 35 | import { cloneDeep } from 'lodash-es'; |
36 | + import { isDevMode } from '/@/utils/env'; | ||
35 | 37 | ||
36 | export default defineComponent({ | 38 | export default defineComponent({ |
37 | name: 'ErrorHandler', | 39 | name: 'ErrorHandler', |
@@ -39,8 +41,8 @@ | @@ -39,8 +41,8 @@ | ||
39 | setup() { | 41 | setup() { |
40 | const rowInfoRef = ref<ErrorInfo>(); | 42 | const rowInfoRef = ref<ErrorInfo>(); |
41 | const imgListRef = ref<string[]>([]); | 43 | const imgListRef = ref<string[]>([]); |
44 | + | ||
42 | const [register, { setTableData }] = useTable({ | 45 | const [register, { setTableData }] = useTable({ |
43 | - titleHelpMessage: '只在`/src/settings/projectSetting.ts` 内的useErrorHandle=true时生效!', | ||
44 | title: '错误日志列表', | 46 | title: '错误日志列表', |
45 | columns: getColumns(), | 47 | columns: getColumns(), |
46 | actionColumn: { | 48 | actionColumn: { |
@@ -50,8 +52,8 @@ | @@ -50,8 +52,8 @@ | ||
50 | slots: { customRender: 'action' }, | 52 | slots: { customRender: 'action' }, |
51 | }, | 53 | }, |
52 | }); | 54 | }); |
53 | - | ||
54 | const [registerModal, { openModal }] = useModal(); | 55 | const [registerModal, { openModal }] = useModal(); |
56 | + | ||
55 | watch( | 57 | watch( |
56 | () => errorStore.getErrorInfoState, | 58 | () => errorStore.getErrorInfoState, |
57 | (list) => { | 59 | (list) => { |
@@ -63,7 +65,10 @@ | @@ -63,7 +65,10 @@ | ||
63 | immediate: true, | 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 | function handleDetail(row: ErrorInfo) { | 73 | function handleDetail(row: ErrorInfo) { |
69 | rowInfoRef.value = row; | 74 | rowInfoRef.value = row; |