feats

src/pages/message/detail.jsx

+import React from 'react';
+import { Button, Card, Typography } from 'antd';
+import { useSearchParams, Link } from 'react-router-dom';
+import { getMessage } from '@/services/message';
+import useBool from '@/utils/hooks/useBool';
+
+export default (props) => {
+  const [searchParams] = useSearchParams();
+  const [loading, startLoading, cancelLoading] = useBool(false);
+
+  const [detail, setDetail] = React.useState({});
+  const id = searchParams.get('id');
+
+  React.useEffect(() => {
+    if (id) {
+      startLoading()
+      getMessage(id).then((res) => {
+        setDetail(res);
+        cancelLoading();
+      }).catch(() => {
+        cancelLoading();
+      });
+    }
+  }, [id]);
+
+  return (
+    <Card
+      loading={loading}
+      title={detail.createDate}
+      actions={[
+        <Button key={1} type="link" disabled={detail.isReaded}>设为已读</Button>,
+        <Link>去处理</Link>
+      ]}
+    >
+      <Typography.Paragraph>
+        {detail.message}
+      </Typography.Paragraph>
+    </Card>
+  )
+}

src/pages/message/index.jsx

 import React from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate, Link } from 'react-router-dom';
 import { queryTable } from '@/utils/request';
 import { ProTable } from '@ant-design/pro-components';
 import { Button, message, Popconfirm } from 'antd';
 
 export default (props) => {
   const columns = [
-    {
-      title: 'id',
-      dataIndex: 'id',
-      search: false,
-    },
     {
       title: '时间',
       dataIndex: 'createDate',
       valueType: 'date',
       search: false,
+      width: 160,
     },
     {
       title: '时间',
       title: '状态',
       dataIndex: 'isReaded',
       search: false,
+      width: 120,
       valueEnum: {
-        1: {
+        true: {
           text: '已读',
           status: 'Processing',
         },
-        0: {
+        false: {
           text: '未读',
           status: 'Error',
         },
       title: '操作',
       valueType: 'option',
       width: 200,
-      render: (_, record) => [
-        <Button
-          key={2}
-          style={{ padding: 0 }}
-          type="link"
-          onClick={() => {
-            navigate(`/system/message/detail?id=${record.id}`);
-          }}
-        >
-          详情
-        </Button>,
-      ],
+      render: (_, record) => {
+        const doUrl = record.targetType === 'store' ?
+        `/stock/list?id=${record.targetId}` : undefined;
+
+        return [
+          <Button
+            key={1}
+            type="link"
+            disabled={record.isReaded}
+          >
+            设为已读
+          </Button>,
+          <Link
+            key={2}
+            to={doUrl}
+          >
+            去处理
+          </Link>,
+        ]
+      },
     },
   ]
 

src/pages/stock/list/index.jsx

 import { deleteStore, getStoreList, getStoreTypeList, storeExport } from '@/services/stock';
 import { queryDict, queryTable } from '@/utils/request';
 import { PageContainer, ProTable } from '@ant-design/pro-components';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate, useSearchParams } from 'react-router-dom';
 import { Button, message, Modal, Popconfirm } from 'antd';
 import { useRef, useState } from 'react';
 import OutAndIn from '../outAndIn';
+import './style.less';
 
 const StockList = (props) => {
   const [isOpen, setIsOpen] = useState(false);
   const [modalData, setModalData] = useState({});
-  // const [storeTypeDict, setStoreTypeDict] = useState([]);
   const actionRef = useRef();
   const formRef = useRef();
   const navigate = useNavigate();
-  
-  // useEffect(() => {
-  //   getStoreTypeList({ pageSize: 9999, pageNum: 1 }).then((res) => {
-  //     setStoreTypeDict(
-  //       res?.records?.map((x) => ({
-  //         label: x.name,
-  //         value: x.id,
-  //       })) || [],
-  //     );
-  //   });
-  // }, []);
+  const [searchParams] = useSearchParams();
+
+  const id = searchParams.get('id');
 
   const handleDelete = (id) => {
     if (id) {
   };
 
   const columns = [
-    // {
-    //   title: 'id',
-    //   dataIndex: 'id',
-    //   search: false,
-    // },
     {
       title: '名称',
       dataIndex: 'name',
+      render: (t, row) => row.warnAmount >= row.amount ? `${t} (库存不足)` : t
     },
     {
       title: '单位',
       dataIndex: 'amount',
       search: false,
     },
-
     {
       title: '操作',
       valueType: 'option',
       <ProTable
         actionRef={actionRef}
         formRef={formRef}
+        params={{ id }}
         rowKey="id"
+        rowClassName={(row) => row.warnAmount >= row.amount ? 'store-danger' : ''}
         toolBarRender={() => [
           <Button
             key="2"

src/pages/stock/list/style.less

+
+.store-danger {
+  color: #ff4d4f;
+}

src/routes/routes.jsx

 import EmergencyPlanDetail from "@/pages/cms/emergencyPlan/detail";
 import FilesList from "@/pages/cms/files/list";
 import MessageList from '@/pages/message';
+import MessageDetail from '@/pages/message/detail';
 
 /**
  * meta 用来扩展自定义数据数据
         meta: {
           title: '消息列表',
         },
+      },
+      {
+        path: 'message/detail',
+        element: <MessageDetail />,
+        meta: {
+          title: '消息详情',
+          hideInMenu: true,
+        },
       }
     ],
   },

src/services/message.js

 
 const [
   getMessageList,
+  getMessage,
 ] = restful("/noticeMessage");
 
 export {
   getMessageList,
+  getMessage,
 }