Commit a2c413a838bb3f737e28e95302ccf0a0171c91b6

Authored by vben
1 parent 8f5016e3

fix: the useMessage icon style problem

CHANGELOG.zh_CN.md
... ... @@ -27,6 +27,7 @@
27 27 - 修复热更新时多次注册组件警告问题
28 28 - 修复登录后出现登录标签页
29 29 - 修复路由切换参数消失问题
  30 +- 修复 useMessage 图标样式问题
30 31  
31 32 ## 2.0.0-rc.5 (2020-10-26)
32 33  
... ...
src/design/ant/index.less
... ... @@ -27,6 +27,10 @@
27 27 color: @error-color !important;
28 28 }
29 29  
  30 +.modal-icon-info {
  31 + color: @primary-color !important;
  32 +}
  33 +
30 34 .ant-modal-mask {
31 35 background-color: rgba(0, 0, 0, 0.2);
32 36 }
... ...
src/hooks/core/types.ts
... ... @@ -87,6 +87,6 @@ export interface MessageOptions {
87 87 offset?: number;
88 88 }
89 89 export interface ModalOptionsEx extends Omit<ModalOptions, 'iconType'> {
90   - iconType: 'warning' | 'success' | 'error';
  90 + iconType: 'warning' | 'success' | 'error' | 'info';
91 91 }
92 92 export type ModalOptionsPartial = Partial<ModalOptionsEx> & Pick<ModalOptionsEx, 'content'>;
... ...
src/hooks/web/useMessage.tsx
... ... @@ -13,6 +13,8 @@ function getIcon(iconType: string) {
13 13 return <InfoCircleFilled class="modal-icon-warning" />;
14 14 } else if (iconType === 'success') {
15 15 return <CheckCircleFilled class="modal-icon-success" />;
  16 + } else if (iconType === 'info') {
  17 + return <InfoCircleFilled class="modal-icon-info" />;
16 18 } else {
17 19 return <CloseCircleFilled class="modal-icon-error" />;
18 20 }
... ... @@ -49,7 +51,7 @@ function createModalOptions(options: ModalOptionsPartial, icon: string): ModalOp
49 51 };
50 52 }
51 53 function createSuccessModal(options: ModalOptionsPartial) {
52   - return Modal.success(createModalOptions(options, 'check'));
  54 + return Modal.success(createModalOptions(options, 'success'));
53 55 }
54 56 function createErrorModal(options: ModalOptionsPartial) {
55 57 return Modal.error(createModalOptions(options, 'close'));
... ... @@ -58,7 +60,7 @@ function createInfoModal(options: ModalOptionsPartial) {
58 60 return Modal.info(createModalOptions(options, 'info'));
59 61 }
60 62 function createWarningModal(options: ModalOptionsPartial) {
61   - return Modal.warning(createModalOptions(options, 'info'));
  63 + return Modal.warning(createModalOptions(options, 'warning'));
62 64 }
63 65  
64 66 notification.config({
... ...
src/views/demo/feat/msg/index.vue
... ... @@ -13,6 +13,7 @@
13 13 </CollapseContainer>
14 14  
15 15 <CollapseContainer class="px-20 bg-white w-full h-32 rounded-md mt-5" title="Comfirm">
  16 + <a-button @click="handleConfirm('info')" class="mr-2">Info</a-button>
16 17 <a-button @click="handleConfirm('warning')" color="warning" class="mr-2">Warning</a-button>
17 18 <a-button @click="handleConfirm('success')" color="success" class="mr-2">Success</a-button>
18 19 <a-button @click="handleConfirm('error')" color="error" class="mr-2">Error</a-button>
... ...