Procházet zdrojové kódy

feat(home): viewMap

lind před 3 roky
rodič
revize
af9d937ecc

+ 4 - 0
src/pages/home/comprehensive /index.tsx

@@ -0,0 +1,4 @@
+const Comprehensive = () => {
+  return <div>综合管理视图</div>;
+};
+export default Comprehensive;

+ 24 - 16
src/pages/home/index.tsx

@@ -1,26 +1,34 @@
 import { PageContainer } from '@ant-design/pro-layout';
-import { Button } from 'antd';
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
+import Comprehensive from './comprehensive  ';
 import Device from './device';
 import Init from './init';
 import Ops from './ops';
+import Service from './service';
 
-const ViewMap = {
-  init: <Init />,
-  device: <Device />,
-  ops: <Ops />,
-};
-
-type ViewType = keyof typeof ViewMap;
-
+export const service = new Service();
 const Home = () => {
+  type ViewType = keyof typeof ViewMap;
   const [current, setCurrent] = useState<ViewType>('init');
 
-  return (
-    <PageContainer>
-      <Button onClick={() => setCurrent('device')}>切换视图</Button>
-      {ViewMap[current]}
-    </PageContainer>
-  );
+  const ViewMap = {
+    init: <Init changeView={(value: ViewType) => setCurrent(value)} />,
+    device: <Device />,
+    ops: <Ops />,
+    comprehensive: <Comprehensive />,
+  };
+
+  useEffect(() => {
+    service.queryView().then((resp) => {
+      if (resp.status === 200) {
+        if (resp.result.length == 0) {
+          setCurrent('init');
+        } else {
+          setCurrent(resp.result[0]?.content);
+        }
+      }
+    });
+  }, []);
+  return <PageContainer>{ViewMap[current]}</PageContainer>;
 };
 export default Home;

+ 45 - 2
src/pages/home/init/index.tsx

@@ -1,4 +1,47 @@
-const Init = () => {
-  return <div>初始化视图</div>;
+import { Button, Radio } from 'antd';
+import { useState } from 'react';
+import { service } from '..';
+
+interface Props {
+  changeView: (view: any) => void;
+}
+
+const Init = (props: Props) => {
+  const options = [
+    { label: '设备接入视图', value: 'device' },
+    { label: '运维管理视图', value: 'ops' },
+    { label: '综合管理视图', value: 'comprehensive' },
+  ];
+
+  const [value, setValue] = useState<string>('device');
+
+  return (
+    <div>
+      <Radio.Group
+        options={options}
+        value={value}
+        onChange={(e) => setValue(e.target.value)}
+        optionType="button"
+      />
+      <div>
+        <Button
+          onClick={() => {
+            service
+              .setView({
+                name: 'view',
+                content: value,
+              })
+              .then((resp) => {
+                if (resp.status === 200) {
+                  props.changeView(value);
+                }
+              });
+          }}
+        >
+          确定
+        </Button>
+      </div>
+    </div>
+  );
 };
 export default Init;

+ 17 - 0
src/pages/home/service.ts

@@ -0,0 +1,17 @@
+import { request } from 'umi';
+import SystemConst from '@/utils/const';
+
+class Service {
+  public queryView = () =>
+    request(`/${SystemConst.API_BASE}/user/settings/view`, {
+      method: 'GET',
+    });
+
+  public setView = (data: Record<string, any>) =>
+    request(`/${SystemConst.API_BASE}/user/settings/view`, {
+      method: 'POST',
+      data,
+    });
+}
+
+export default Service;