fix: 修改消息弹框

src/components/GlobalHeader/NoticeIconView.js

@@ -5,12 +5,14 @@ import { connect } from 'react-redux';
 import { FormattedMessage } from '@wisdom-utils/components';
 import { history } from '@wisdom-utils/runtime';
 import { findPathByWidget, isJSON } from '@wisdom-utils/components/lib/AppLayout/helpers';
+import classNames from 'classnames';
 import Notifier from '../../layouts/AppLayout/notifier/notice';
 import NoticeIcon from '../../layouts/AppLayout/notifier';
 import { ERR_OK, MESSAGE_TYPE, NEW_MESSAGE } from '../../layouts/AppLayout/notifier/constants';
 import service from '../../api/service/notification';
 import { actionCreators } from '../../containers/App/store';
 import isProd from '../../utils/env';
+import { getMessageTypeIcon } from '../../layouts/AppLayout/notifier/utils';
 // import NoticeIcon from '../NoticeIcon';
 import styles from './index.less';
 
@@ -19,17 +21,27 @@ const { TextArea } = Input;
 const PlatformModal = ({ platformVisible, handleClosePlatform, handlerMointer, messages = [] }) => {
   const [pageIndex, setPageIndex] = useState(1);
   const message = useMemo(() => messages[pageIndex - 1], [messages, pageIndex]);
-
+  const isAlarm = message.infoClasses === MESSAGE_TYPE.ALARM_TYPE;
+  const defaultIcon = isAlarm
+    ? 'https://panda-water.com/web4/assets/images/message/报警图标.svg'
+    : getMessageTypeIcon(message);
+  const icon = message.webIcon ? `${window.location.origin}/${message.webIcon}` : defaultIcon;
   return (
     <Modal
-      title={<FormattedMessage id="component.noticeIcon.modal.alarm.title" />}
+      title={
+        isAlarm ? (
+          <FormattedMessage id="component.noticeIcon.modal.alarm.title" />
+        ) : (
+          <FormattedMessage id="component.noticeIcon.model.system.title" />
+        )
+      }
       maskClosable={false}
       mask={false}
       maskStyle={{ pointerEvents: 'none' }}
       visible={platformVisible}
       zIndex={5000}
       wrapClassName={styles.platformModalWrap}
-      className={styles.platformModal}
+      className={classNames(styles.platformModal, !isAlarm && styles.platformModalDefault)}
       footer={
         <Pagination
           simple
@@ -45,7 +57,7 @@ const PlatformModal = ({ platformVisible, handleClosePlatform, handlerMointer, m
     >
       <div className={styles.alarmContent}>
         {/* eslint-disable-next-line jsx-a11y/alt-text */}
-        <img src="https://panda-water.com/web4/assets/images/message/报警图标.svg" alt="" />
+        <img src={icon} alt="" />
         <div className={styles.content}>
           <div className={styles['content-top']}>
             <a onClick={event => handlerMointer(event, message, true)}>
@@ -53,20 +65,27 @@ const PlatformModal = ({ platformVisible, handleClosePlatform, handlerMointer, m
             </a>
             <span title="点击标为已读" onClick={event => handlerMointer(event, message, false)} />
           </div>
-
-          <div className={styles['content-mid']}>
-            <b>{message && message.infoContent && message.infoContent.alarmType}</b>
-            {`|${message && message.infoContent && message.infoContent.alarmContent}`}
-          </div>
-          <div className={styles['content-bottom']}>
-            <p>
-              报警值：
-              <b>{message && message.infoContent && message.infoContent.alarmValue}</b>
-              {' / '}
-              预设值：
-              {message && message.infoContent && message.infoContent.alarmThreshold}
-            </p>
-          </div>
+          {isAlarm ? (
+            <>
+              <div className={styles['content-mid']}>
+                <b>{message && message.infoContent && message.infoContent.alarmType}</b>
+                {`|${message && message.infoContent && message.infoContent.alarmContent}`}
+              </div>
+              <div className={styles['content-bottom']}>
+                <p>
+                  报警值：
+                  <b>{message && message.infoContent && message.infoContent.alarmValue}</b>
+                  {' / '}
+                  预设值：
+                  {message && message.infoContent && message.infoContent.alarmThreshold}
+                </p>
+              </div>
+            </>
+          ) : (
+            <div className={styles['content-bottom']}>
+              <p>{message && message.infoContent && message.infoContent.content}</p>
+            </div>
+          )}
           <p className={styles['message-time']}>{message && message.time}</p>
         </div>
       </div>
@@ -110,7 +129,7 @@ class NoticeIconView extends Component {
   }
 
   get platformMessages() {
-    return this.state.noticeData.filter(item => item.infoLevel === '4' && item.infoClasses === 'alarmType');
+    return this.state.noticeData.filter(item => item.infoLevel === '4');
   }
 
   async componentDidMount() {

src/components/GlobalHeader/index.less

@@ -376,6 +376,13 @@
     }
   }
 }
+.platformModalDefault {
+  :global {
+    .@{ant-prefix}-modal-header {
+      background: var(--panda-console-base-header-bg-color);
+    }
+  }
+}
 .videoPopup {
   :global(.@{ant-prefix}-modal-content) {
     height: 520px;

src/layouts/AppLayout/notifier/notice.js

@@ -513,11 +513,7 @@ class Notifier {
       this.renderPopVideo(message); // 显示视频弹窗
       return;
     }
-    if (message.infoLevel === PLATFORM_LEVEL && message.infoClasses === MESSAGE_TYPE.ALARM_TYPE) {
-      this.renderPopPlatform(message); // 显示报警弹窗
-      return;
-    }
-    if (message.version === '3.0' && message.infoLevel === PLATFORM_LEVEL) {
+    if (message.infoLevel === PLATFORM_LEVEL) {
       this.renderPopPlatform(message); // 显示报警弹窗
       return;
     }