添加安全管理模块

.umirc.ts

@@ -131,6 +131,11 @@ export default defineConfig({
       path: '/task-manage/detail',
       component: './TaskManage/Detail/TaskDetail',
     },
+    {
+      name: '安全管理',
+      path: '/safety/:projectId', ///safety management
+      component: './SafetyManagement',
+    },
     // {
     //   name: '权限演示',
     //   path: '/access',

src/pages/SafetyManagement/index.js

@@ -0,0 +1,51 @@
+import PageContent from '@/components/PageContent';
+import TabsContent from '@/components/TabsContent';
+import { useNavigate, useParams } from '@umijs/max';
+import { Space } from 'antd';
+import styles from './index.less';
+const img = require('@/assets/deviceManager/device01.png');
+const chartIcon = require('@/assets/deviceManager/chartIcon.png');
+const DeviceManager = () => {
+  const { projectId } = useParams();
+
+  return (
+    <PageContent style={{ backgroundColor: 'gray' }}>
+      <TabsContent
+        defaultActiveKey="1"
+        onChange={() => {}}
+        items={[
+          {
+            label: `视频监控`,
+            key: '1',
+            children: <Video projectId={projectId} />,
+          },
+          {
+            label: `门禁`,
+            key: '2',
+            children: <Door />,
+          },
+        ]}
+      />
+    </PageContent>
+  );
+};
+const Video = ({ projectId }) => {
+  return (
+    <Space direction="vertical" className={styles.sparePart}>
+      <div className={`card-box ${styles.titleContent}`}>
+        <img className={styles.img} src={img} />
+        <div>
+          <div className={styles.num}>{0}</div>
+          <div>在库数量（个）</div>
+        </div>
+      </div>
+    </Space>
+  );
+};
+const Door = () => {
+  const navigate = useNavigate();
+
+  return <div>8888</div>;
+};
+
+export default DeviceManager;

src/pages/SafetyManagement/index.less

@@ -0,0 +1,32 @@
+.close {
+  position: absolute;
+  right: 0;
+}
+.titleContent {
+  position: relative;
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
+  .img {
+    width: 30%;
+  }
+  .num {
+    color: #ffc400;
+    font-size: 36px;
+    margin-bottom: 20px;
+  }
+  .rightIcon {
+    position: absolute;
+    right: 20px;
+    top: 20px;
+  }
+}
+.sparePart {
+  width: 100%;
+  .cardItem {
+    display: flex;
+    padding: 10px;
+    justify-content: space-between;
+    align-items: center;
+  }
+}