From a2c413a838bb3f737e28e95302ccf0a0171c91b6 Mon Sep 17 00:00:00 2001
From: vben <anncwb@126.com>
Date: Tue, 27 Oct 2020 23:58:44 +0800
Subject: [PATCH] fix: the useMessage icon style problem

---
 CHANGELOG.zh_CN.md                | 1 +
 src/design/ant/index.less         | 4 ++++
 src/hooks/core/types.ts           | 2 +-
 src/hooks/web/useMessage.tsx      | 6 ++++--
 src/views/demo/feat/msg/index.vue | 1 +
 5 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/CHANGELOG.zh_CN.md b/CHANGELOG.zh_CN.md
index 42b7bcc7..6538aadb 100644
--- a/CHANGELOG.zh_CN.md
+++ b/CHANGELOG.zh_CN.md
@@ -27,6 +27,7 @@
 - 修复热更新时多次注册组件警告问题
 - 修复登录后出现登录标签页
 - 修复路由切换参数消失问题
+- 修复 useMessage 图标样式问题
 
 ## 2.0.0-rc.5 (2020-10-26)
 
diff --git a/src/design/ant/index.less b/src/design/ant/index.less
index dddfaf08..e02fba64 100644
--- a/src/design/ant/index.less
+++ b/src/design/ant/index.less
@@ -27,6 +27,10 @@
   color: @error-color !important;
 }
 
+.modal-icon-info {
+  color: @primary-color !important;
+}
+
 .ant-modal-mask {
   background-color: rgba(0, 0, 0, 0.2);
 }
diff --git a/src/hooks/core/types.ts b/src/hooks/core/types.ts
index 4d8324b5..6a5f2e6e 100644
--- a/src/hooks/core/types.ts
+++ b/src/hooks/core/types.ts
@@ -87,6 +87,6 @@ export interface MessageOptions {
   offset?: number;
 }
 export interface ModalOptionsEx extends Omit<ModalOptions, 'iconType'> {
-  iconType: 'warning' | 'success' | 'error';
+  iconType: 'warning' | 'success' | 'error' | 'info';
 }
 export type ModalOptionsPartial = Partial<ModalOptionsEx> & Pick<ModalOptionsEx, 'content'>;
diff --git a/src/hooks/web/useMessage.tsx b/src/hooks/web/useMessage.tsx
index cca16885..8bedc6ec 100644
--- a/src/hooks/web/useMessage.tsx
+++ b/src/hooks/web/useMessage.tsx
@@ -13,6 +13,8 @@ function getIcon(iconType: string) {
     return <InfoCircleFilled class="modal-icon-warning" />;
   } else if (iconType === 'success') {
     return <CheckCircleFilled class="modal-icon-success" />;
+  } else if (iconType === 'info') {
+    return <InfoCircleFilled class="modal-icon-info" />;
   } else {
     return <CloseCircleFilled class="modal-icon-error" />;
   }
@@ -49,7 +51,7 @@ function createModalOptions(options: ModalOptionsPartial, icon: string): ModalOp
   };
 }
 function createSuccessModal(options: ModalOptionsPartial) {
-  return Modal.success(createModalOptions(options, 'check'));
+  return Modal.success(createModalOptions(options, 'success'));
 }
 function createErrorModal(options: ModalOptionsPartial) {
   return Modal.error(createModalOptions(options, 'close'));
@@ -58,7 +60,7 @@ function createInfoModal(options: ModalOptionsPartial) {
   return Modal.info(createModalOptions(options, 'info'));
 }
 function createWarningModal(options: ModalOptionsPartial) {
-  return Modal.warning(createModalOptions(options, 'info'));
+  return Modal.warning(createModalOptions(options, 'warning'));
 }
 
 notification.config({
diff --git a/src/views/demo/feat/msg/index.vue b/src/views/demo/feat/msg/index.vue
index 90f29fdc..0819762f 100644
--- a/src/views/demo/feat/msg/index.vue
+++ b/src/views/demo/feat/msg/index.vue
@@ -13,6 +13,7 @@
     </CollapseContainer>
 
     <CollapseContainer class="px-20 bg-white w-full h-32 rounded-md mt-5" title="Comfirm">
+      <a-button @click="handleConfirm('info')" class="mr-2">Info</a-button>
       <a-button @click="handleConfirm('warning')" color="warning" class="mr-2">Warning</a-button>
       <a-button @click="handleConfirm('success')" color="success" class="mr-2">Success</a-button>
       <a-button @click="handleConfirm('error')" color="error" class="mr-2">Error</a-button>