gt_client_pad/src/pages/MessageCenter/index.js

import PageContent from '@/components/PageContent';
import TabsContent from '@/components/TabsContent';
import { getNotificationList } from '@/services/message';
import { UnityAction } from '@/utils/utils';
import { useParams, useRequest } from '@umijs/max';
import { Button } from 'antd';
import dayjs from 'dayjs';
import { useState } from 'react';
import styles from './index.less';
const icon1 = require('@/assets/message/work.png');
const icon2 = require('@/assets/message/check.png');

const MessageCenter = () => {
  const { projectId } = useParams();
  const [tab, setTab] = useState('1');
  const { data, run, loading } = useRequest(getNotificationList, {
    defaultParams: [{ projectId, msgType: 11 }], //, msgType: 工况：11， 自检：12
  });

  const handleTabsChange = (tab) => {
    setTab(tab);
    tab == '1'
      ? run({ projectId, msgType: 11 })
      : run({ projectId, msgType: 12 });
  };

  const handleReadClick = () => {
    UnityAction.sendMsg('notiReadAll', '');
  };

  const handlerSeeClick = () => {
    UnityAction.sendMsg('noti', tab == '1' ? 'gongKuang' : 'ziJian');
  };

  const renderItem = (item) => {
    const time = item?.CreatedOn
      ? dayjs(item.CreatedOn).format('YYYY-MM-DD hh:mm:ss')
      : '';
    return (
      <div className={`card-box ${styles.itemContent}`}>
        <img className={styles.img} src={tab == '1' ? icon1 : icon2} />
        <div>
          <div className={styles.text}>{item.MsgBody}</div>
          <div className={styles.time}>{time}</div>
        </div>
        <div className={styles.right}>
          <div
            className={item?.ReadStatus ? styles.redPoint : styles.nonePoint}
          />
          <Button
            className={styles.btn}
            type="primary"
            onClick={handlerSeeClick}
          >
            查看
          </Button>
        </div>
      </div>
    );
  };
  return (
    <PageContent tabs>
      <TabsContent
        center={false}
        defaultActiveKey="1"
        onChange={handleTabsChange}
        items={[
          {
            label: `水厂工况`,
            key: '1',
            children: data?.list?.map((item) => renderItem(item)),
          },
          {
            label: `系统自检`,
            key: '2',
            children: data?.list?.map((item) => renderItem(item)),
          },
        ]}
      />
      <div className={styles.allRead} onClick={handleReadClick}>
        全部已读
      </div>
    </PageContent>
  );
};
export default MessageCenter;