dilog

2024-10-07 01:08:33 +08:00 · 2024-10-07 01:08:33 +08:00 · 2f686df09c
parent fa2023f223
commit 2f686df09c
14 changed files with 403 additions and 167 deletions
--- a/src/components/map/MapComponent.tsx
+++ b/src/components/map/MapComponent.tsx
@ -18,24 +18,40 @@ export default function MapContainer() {
      version: "2.0", // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
      plugins: ["AMap.Scale"],
    });
+
    amap = new Amap.Map("container", {
      viewMode: "2D", // 是否为3D地图模式
      zoom: 11, // 初始化地图级别
      center: [103.55, 30.34], // 初始化地图中心点位置
      mapStyle: "amap://styles/darkblue",
+      resizeEnable: true,
    });
-   
    setmaps(amap);
-    addMaket(Amap);
+    addMaket(Amap,amap);
+    amap.setFitView();
  };
-  const addMaket = (m) => {
+  const addMaket = (m,mp) => {
    const marker = new m.Marker({
      position: new m.LngLat(103.55, 30.34),
      title: "黄水",
    });
-    //将创建的点标记添加到已有的地图实例：
+   
+    var content = [
+      "<div><b>高德软件有限公司</b>",
+      "电话 : 010-84107000   邮编 : 100102",
+      "地址 : 北京市望京阜通东大街方恒国际中心A座16层</div>",
+    ];
+    var infoWindow = new m.InfoWindow({
+      offset: new m.Pixel(0, -30),
+      autoMove: true,
+      content: content.join("<br/>"),
+    });
+    marker.on("click", (e) => {
+      infoWindow.open(mp, e.target.getPosition());
+    });
    amap.add(marker);
-    MapUtl.makerList.push(marker)
+
+    MapUtl.makerList.push(marker);
    MapUtl.amap = m;
  };

--- a/src/maptest.html
+++ b/src/maptest.html
@ -0,0 +1,41 @@
+<!doctype html>
+<html>
+
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <title>给多个点添加信息窗体</title>
+    <link rel="stylesheet" href="https://cache.amap.com/lbs/static/main1119.css" />
+    <script type="text/javascript"
+        src="https://webapi.amap.com/maps?v=2.0&key=d58999d072ed7e5897d3900a769cfda0"></script>
+</head>
+
+<body>
+    <div id="container"></div>
+    <script type="text/javascript">
+        //初始化地图对象，加载地图
+        var map = new AMap.Map("container", { 
+            resizeEnable: true, 
+            mapStyle: "amap://styles/darkblue", 
+            center: [103.55, 30.34],
+            viewMode: "2D", // 是否为3D地图模式
+            zoom: 11, // 初始化地图级别
+        });
+        var infoWindow = new AMap.InfoWindow({ offset: new AMap.Pixel(0, -30) });
+        var marker = new AMap.Marker({
+            position: [103.55, 30.34],
+            map: map
+        });
+        marker.content = '我是第1个Marker';
+        marker.on('click', markerClick);
+        marker.emit('click', { target: marker });
+        function markerClick(e) {
+            infoWindow.setContent(e.target.content);
+            infoWindow.open(map, e.target.getPosition());
+        }
+        map.setFitView();
+    </script>
+</body>
+
+</html>
--- a/src/pages/emergency/em_column.tsx
+++ b/src/pages/emergency/em_column.tsx
@ -0,0 +1,40 @@
+import { FormType } from "@/components/form/interface";
+
+export const EmConfig = (userList) => [
+  {
+    type: FormType.input,
+    label: "处突名称",
+    name: "emergency_name",
+    value: "",
+    rules: [{ required: true, message: "请输入处突名称!" }],
+  },
+  {
+    type: FormType.input,
+    label: "任务描述",
+    name: "desc",
+    value: "",
+    rules: [{ required: true, message: "请输入任务描述!" }],
+  },
+  {
+    type: FormType.input,
+    label: "目标位置",
+    name: "target_location",
+    value: "",
+    rules: [{ required: true, message: "请输入任务描述!" }],
+  },
+  {
+    type: FormType.map,
+    label: "坐标信息",
+    name: "marker",
+    value: "",
+    rules: [{ required: true, message: "请输入任务描述!" }],
+  },
+  {
+    type: FormType.cehckboxGroup,
+    label: "参与人员选择",
+    name: "user_id",
+    value: [],
+    checkboxData: userList,
+    rules: [{ required: true, message: "请选择参与人员!" }],
+  },
+];
--- a/src/pages/emergency/index.tsx
+++ b/src/pages/emergency/index.tsx
@ -16,9 +16,9 @@ import { UserDataType } from "@/model/userModel";
 import { Store } from "antd/lib/form/interface";
 import SimpleForm from "@/components/form/simple_form";
 import React from "react";
-import { FormType } from "@/components/form/interface";
 import baseHttp from "@/service/base";
 import MinusCircleOutlined from "@ant-design/icons/lib/icons/MinusCircleOutlined";
+import { EmConfig } from "./em_column";

 const Emergency = (props: Store) => {
  const { emergencyStore } = props;
@ -87,7 +87,7 @@ const Emergency = (props: Store) => {
    emergencyStore.deleteItem(record.identity);
  };
  const edit = (record) => {
-    setProjectConfig(defaultConfig);
+    setProjectConfig(EmConfig(userList));

    setIsModalOpen(true);
    formRef.current?.setFieldsValue(record);
@ -118,44 +118,7 @@ const Emergency = (props: Store) => {
      setUserList(data ?? []);
    });
  }, [emergencyStore]);
-  const defaultConfig = [
-    {
-      type: FormType.input,
-      label: "处突名称",
-      name: "emergency_name",
-      value: "",
-      rules: [{ required: true, message: "请输入处突名称!" }],
-    },
-    {
-      type: FormType.input,
-      label: "任务描述",
-      name: "desc",
-      value: "",
-      rules: [{ required: true, message: "请输入任务描述!" }],
-    },
-    {
-      type: FormType.input,
-      label: "目标位置",
-      name: "target_location",
-      value: "",
-      rules: [{ required: true, message: "请输入任务描述!" }],
-    },
-    {
-      type: FormType.map,
-      label: "坐标信息",
-      name: "marker",
-      value: "",
-      rules: [{ required: true, message: "请输入任务描述!" }],
-    },
-    {
-      type: FormType.cehckboxGroup,
-      label: "参与人员选择",
-      name: "user_id",
-      value: [],
-      checkboxData: userList,
-      rules: [{ required: true, message: "请选择参与人员!" }],
-    },
-  ];
+
  const onFinishFailed = () => {};
  const handleSearch = (newValue: string) => {
    if (newValue === "") return;
@ -180,7 +143,7 @@ const Emergency = (props: Store) => {
          <Button
            type="default"
            onClick={() => {
-              setProjectConfig(defaultConfig);
+              setProjectConfig(EmConfig(userList));
              setId(null);
              setIsModalOpen(true);
            }}
--- a/src/pages/home/homeBottom/dispath.tsx
+++ b/src/pages/home/homeBottom/dispath.tsx
@ -1,7 +1,7 @@
 import SimpleForm from "@/components/form/simple_form";
 import { traningConfig } from "@/pages/training/traning_config";
 import { Button, Form, FormInstance, Modal, Select } from "antd";
-import React, { useEffect } from "react";
+import React from "react";
 import { useState } from "react";
 import baseHttp from "@/service/base";
 import "./bot.less";
@ -12,7 +12,8 @@ const { Option } = Select;

 const Dispath = (props: Store) => {
  const { trainingStore, trainingCatStore } = props;
-  const openDispatch = () => {
+  const openDispatch = async () => {
+    await getList();
    setIsModalOpen(true);
    setProjectConfig([
      ...traningConfig,
@ -26,19 +27,7 @@ const Dispath = (props: Store) => {
      },
    ]);
  };
-  const handleCancle = () => {
-    setIsModalOpen(false);
-  };
-  const handleSubmit = () => {
-    setIsModalOpen(false);
-  };
-  const formRef = React.useRef<FormInstance>(null);
-  const [isModalOpen, setIsModalOpen] = useState<boolean>(false);
-  const [projectConfig, setProjectConfig] = useState<any>([]);
-  const [stashList, setStashList] = useState<any>([]);
-  const [userList, setUserList] = useState<any>([]);
-
-  useEffect(() => {
+  const getList = async () => {
    try {
      trainingCatStore.getlist().then(() => {
        setStashList(trainingCatStore.list);
@ -54,7 +43,18 @@ const Dispath = (props: Store) => {
    } catch (error) {
      console.log(error);
    }
-  }, [trainingCatStore]);
+  };
+  const handleCancle = () => {
+    setIsModalOpen(false);
+  };
+  const handleSubmit = () => {
+    setIsModalOpen(false);
+  };
+  const formRef = React.useRef<FormInstance>(null);
+  const [isModalOpen, setIsModalOpen] = useState<boolean>(false);
+  const [projectConfig, setProjectConfig] = useState<any>([]);
+  const [stashList, setStashList] = useState<any>([]);
+  const [userList, setUserList] = useState<any>([]);

  const onFinish = (values: any) => {
    let data = {
--- a/src/pages/home/homeBottom/ec.tsx
+++ b/src/pages/home/homeBottom/ec.tsx
@ -1,7 +1,7 @@
 import { Modal } from "antd";
 import { Store } from "antd/es/form/interface";
 import { inject, observer } from "mobx-react";
-import { useEffect, useState } from "react";
+import { useState } from "react";
 import "./bot.less";
 import { PhoneTwoTone } from "@ant-design/icons";
 import { webRTC } from "@/util/webRtc";
@ -10,14 +10,16 @@ const Ec = (props: Store) => {
  const [isModalOpen, setIsModalOpen] = useState<boolean>(false);
  const { usrStore } = props;
  const [userList, setUserList] = useState<any>([]);
-  useEffect(() => {
+  const openDispatch = () => {
+    try {
      usrStore.getlist().then(() => {
        setUserList(usrStore.list);
        webRTC.init();
-    });
-  }, [usrStore]);
-  const openDispatch = () => {
        setIsModalOpen(true);
+      });
+    } catch (error) {
+      console.log(error);
+    }
  };
  const callphone = (record: any) => {
    webRTC.calls(record.identity);
@ -63,8 +65,11 @@ const Ec = (props: Store) => {
            </div>
          </div>
          <div className="ec_right">
-            <div style={{display:"flex"}}>
-              <video id="rtcVideo" style={{ width: "300px", height: "300px" }}></video>
+            <div style={{ display: "flex" }}>
+              <video
+                id="rtcVideo"
+                style={{ width: "300px", height: "300px" }}
+              ></video>
              <video
                id="remoteVideo"
                style={{ width: "300px", height: "300px" }}
--- a/src/pages/home/homeBottom/emr.tsx
+++ b/src/pages/home/homeBottom/emr.tsx
@ -1,11 +1,65 @@
-import { Modal } from "antd";
+import SimpleForm from "@/components/form/simple_form";
+import {
+  Button,
+  Form,
+  FormInstance,
+  InputNumber,
+  Modal,
+  Select,
+  SelectProps,
+} from "antd";
+import { Store } from "antd/es/form/interface";
+import React, { useEffect } from "react";
 import { useState } from "react";
+import baseHttp from "@/service/base";
+import MinusCircleOutlined from "@ant-design/icons/lib/icons/MinusCircleOutlined";
+import { EmConfig } from "@/pages/emergency/em_column";
+import { inject, observer } from "mobx-react";

-const Emr = () => {
+const Emr = (props: Store) => {
+  const { emergencyStore } = props;
  const [isModalOpen, setIsModalOpen] = useState<boolean>(false);
+  const formRef = React.useRef<FormInstance>(null);
+  const [projectConfig, setProjectConfig] = useState<any>([]);
+  const [data, setData] = useState<SelectProps["options"]>([]);
+  const [userList, setUserList] = useState<Array<any>>([]);
  const openDispatch = () => {
+    setProjectConfig(EmConfig(userList));
    setIsModalOpen(true);
  };
+  const onFinishFailed = () => {};
+
+  const onFinish = (values: any) => {
+    let data = {
+      ...values,
+      long: values.marker["lng"],
+      lat: values.marker["lat"],
+    };
+    emergencyStore.add(data);
+    setIsModalOpen(false);
+  };
+  const handleSearch = (newValue: string) => {
+    if (newValue === "") return;
+    baseHttp.get("/supplies/list/serch", { name: newValue }).then((res) => {
+      let data = res.data?.record ?? [];
+      data.forEach((item) => {
+        item.text = item.name;
+        item.value = item.identity;
+      });
+      setData(data ?? []);
+    });
+  };
+  useEffect(() => {
+    emergencyStore.getlist();
+    baseHttp.get("/user/list", null).then((res) => {
+      let data = res.data?.record ?? [];
+      data.forEach((item) => {
+        item.label = item.account;
+        item.value = item.identity;
+      });
+      setUserList(data ?? []);
+    });
+  }, [emergencyStore]);
  return (
    <>
      <span onClick={openDispatch}> 应急处突</span>
@ -14,15 +68,86 @@ const Emr = () => {
        className="owner_model"
        width={800}
        open={isModalOpen}
-        afterClose={() => {}}
-        onOk={() => {}}
-        footer={null}
+        afterClose={() => formRef.current?.resetFields()}
+        onOk={() => formRef.current?.submit()}
+        okText="确定"
+        cancelText="取消"
        onCancel={() => {
          setIsModalOpen(false);
        }}
-      ></Modal>
+      >
+        <div className="disPatch" style={{ fontSize: "#fff" }}>
+          <SimpleForm
+            formRef={formRef}
+            createCallback={() => {
+              formRef.current?.setFieldsValue(null);
+            }}
+            formName="card_basic"
+            colProps={25}
+            subBtnName="提交"
+            formDatas={projectConfig}
+            onFinish={onFinish}
+            initialValues={true}
+            childrenPosi={true}
+            onFinishFailed={onFinishFailed}
+          >
+            <Form.List name="supplies_list">
+              {(fields, { add, remove }) => (
+                <>
+                  {fields.map(({ key, name, ...restField }) => (
+                    <>
+                      <Form.Item
+                        {...restField}
+                        label={"物资"}
+                        name={[name, "supplies_identity"]}
+                        rules={[{ required: true, message: "请选择物资" }]}
+                      >
+                        <Select
+                          showSearch
+                          placeholder={props.placeholder}
+                          style={props.style}
+                          defaultActiveFirstOption={false}
+                          suffixIcon={null}
+                          filterOption={false}
+                          onSearch={handleSearch}
+                          notFoundContent={null}
+                          options={(data || []).map((d) => ({
+                            value: d.value,
+                            label: d.text,
+                          }))}
+                        />
+                      </Form.Item>
+                      <Form.Item
+                        {...restField}
+                        name={[name, "num"]}
+                        label={"数量"}
+                        rules={[{ required: true, message: "请输入物资数量" }]}
+                      >
+                        <InputNumber placeholder="请输入物资数量" />
+                      </Form.Item>
+                      <MinusCircleOutlined onClick={() => remove(name)} />
+                    </>
+                  ))}
+                  <Form.Item>
+                    <div style={{ textAlign: "center" }}>
+                      <Button
+                        style={{ width: 300 }}
+                        type="dashed"
+                        onClick={() => add()}
+                        block
+                      >
+                        添加物资
+                      </Button>
+                    </div>
+                  </Form.Item>
+                </>
+              )}
+            </Form.List>
+          </SimpleForm>
+        </div>
+      </Modal>
    </>
  );
 };

-export default Emr;
+export default inject("emergencyStore")(observer(Emr));
--- a/src/pages/home/homeLeft/home_left.tsx
+++ b/src/pages/home/homeLeft/home_left.tsx
@ -1,63 +1,9 @@
-import { useEffect, useState } from "react";
-import { Modal } from "antd";
 import "./left.less";
-
-import * as echarts from "echarts";
 import Orgin from "./orgin";
 import Pover from "./pover";
-import { inject, observer } from "mobx-react";
-import { Store } from "antd/es/form/interface";
-const HomeLeft = (props: Store) => {
-  const { homeStore } = props;
-  const [isModalOpen, setIsModalOpen] = useState<boolean>(false);
-  const initChart = (data) => {
-    var myChart = echarts.init(document.getElementById("xunlian"));
-    var option = {
-      xAxis: {
-        type: "category",
-        data: data.map((item) => item.name),
-        axisLabel: {
-          show: true,
-          interval: 0,
-          rotate: 30,
-        },
-      },
-      grid: {top: "10%",bottom: "45%",right: "5%"},
-      yAxis: {
-        type: "value",
-        splitLine: {
-          show: false, // 去除网格线
-        },
-      },
-      series: [
-        {
-          data: data.map((item) => item.count),
-          type: "line",
-          smooth: true,
-          areaStyle: {
-            opacity: 0.1,
-            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-              {
-                offset: 0,
-                color: "rgb(128, 255, 165)",
-              },
-              {
-                offset: 1,
-                color: "rgb(1, 191, 236)",
-              },
-            ]),
-          },
-        },
-      ],
-    };
-    option && myChart.setOption(option);
-  };
+import Turn from './turn';
+const HomeLeft = () => {

-  useEffect(() => {
-    homeStore.getTr().then((res) => {
-      initChart(res.data.record);
-    });
-  }, [homeStore]);

  // const openDispatch = () => {
  // 位置移动
@ -89,24 +35,9 @@ const HomeLeft = (props: Store) => {
        <div className="org_head">
          <p>年度训练</p>
        </div>
-        <div style={{ width: "100%", height: "100%" }} id="xunlian"></div>
+        <Turn />
      </div>
-      <Modal
-        title="组织架构"
-        className="owner_model"
-        width={"80%"}
-        open={isModalOpen}
-        afterClose={() => {}}
-        okText="确定"
-        cancelText="取消"
-        onOk={() => {}}
-        onCancel={() => {
-          setIsModalOpen(false);
-        }}
-      >
-        <p>cascsa</p>
-      </Modal>
    </div>
  );
 };
-export default inject("homeStore")(observer(HomeLeft));
+export default HomeLeft;
--- a/src/pages/home/homeLeft/turn.tsx
+++ b/src/pages/home/homeLeft/turn.tsx
@ -0,0 +1,110 @@
+import { Store } from "antd/es/form/interface";
+import * as echarts from "echarts";
+import { inject, observer } from "mobx-react";
+import { useEffect, useState } from "react";
+import "./left.less";
+import { Col, Modal, Row } from "antd";
+const Turn = (props: Store) => {
+  const { homeStore } = props;
+  const [isModalOpen, setisModalOpen] = useState(false);
+  const initChart = (data) => {
+    var myChart = echarts.init(document.getElementById("xunlian"));
+    var option = {
+      xAxis: {
+        type: "category",
+        data: data.map((item) => item.name),
+        axisLabel: {
+          show: true,
+          interval: 0,
+          rotate: 30,
+        },
+      },
+      grid: { top: "10%", bottom: "45%", right: "5%" },
+      yAxis: {
+        type: "value",
+        splitLine: {
+          show: false, // 去除网格线
+        },
+      },
+      series: [
+        {
+          data: data.map((item) => item.count),
+          type: "line",
+          smooth: true,
+          areaStyle: {
+            opacity: 0.1,
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              {
+                offset: 0,
+                color: "rgb(128, 255, 165)",
+              },
+              {
+                offset: 1,
+                color: "rgb(1, 191, 236)",
+              },
+            ]),
+          },
+        },
+      ],
+    };
+    option && myChart.setOption(option);
+  };
+  useEffect(() => {
+    homeStore.getTr().then((res) => {
+      initChart(res.data.record);
+    });
+  }, [homeStore]);
+  const trunHandler = () => {
+    setisModalOpen(true);
+  };
+  return (
+    <>
+      <div
+        onClick={trunHandler}
+        style={{ width: "100%", height: "100%" }}
+        id="xunlian"
+      ></div>
+      <Modal
+        title="年度训练"
+        className="owner_model"
+        width={1200}
+        open={isModalOpen}
+        afterClose={() => {}}
+        onOk={() => {}}
+        footer={null}
+        onCancel={() => {
+          setisModalOpen(false);
+        }}
+      >
+        <>
+          <Row>
+            <Col flex={2}>
+              {[7, 8, 9, 10, 11].map((item, index) => {
+                return (
+                  <div style={{ color: "#fff" ,margin:"10px"}} key={index}>
+                    <img
+                      height={60}
+                      src="https://img0.baidu.com/it/u=2135939479,1633462316&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500"
+                      alt=""
+                    />
+                  </div>
+                );
+              })}
+            </Col>
+            <Col flex={8}>
+                  <div style={{ color: "#fff" }} >
+                  <img
+                      style={{width:"100%",height:"800px"}}
+                      src="https://img0.baidu.com/it/u=2135939479,1633462316&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500"
+                      alt=""
+                    />
+                  </div> 
+            </Col>
+          </Row>
+        </>
+      </Modal>
+    </>
+  );
+};
+
+export default inject("homeStore")(observer(Turn));
--- a/src/service/base.ts
+++ b/src/service/base.ts
@ -18,16 +18,17 @@ axios.interceptors.request.use((config) => {
 // 添加响应拦截器
 axios.interceptors.response.use((res: AxiosResponse) => {
    if (res.data?.status === 401) {
-        console.log("res.data.status",res.data.status);
        store.usrStore.openLoginDilog()
        store.usrStore.logOut()
+        window.location.href = '#/login'
    }
    return res;
 }, (err) => {
-    console.log(err.status===401);
+
    if (err.status === 401) {
        store.usrStore.openLoginDilog()
        store.usrStore.logOut()
+        window.location.href = '#/login'
    }
    return Promise.reject(err);
 });
--- a/src/store/user.ts
+++ b/src/store/user.ts
@ -40,6 +40,7 @@ class UserStore extends BaseStore<UserDataType> {
        if (!this._userinfo.token) {
            let token = window.localStorage.getItem("token")
            this._userinfo.token = token;
+            
        }
        return this._userinfo;
    }
--- a/src/util/config.ts
+++ b/src/util/config.ts
@ -1,12 +1,13 @@
 class Config {
-    // static baseUrl = "https://rw.quwanya.cn/";
-    // static uploadUrl = "https://rw.quwanya.cn/";
+    static baseUrl = "https://rw.quwanya.cn/";
+    static uploadUrl = "https://rw.quwanya.cn/";
+    static ws = "wss://rw.quwanya.cn/ws";
+
    // static ws = "wss://rw.quwanya.cn/ws?id=admin";
-    
-
-    static baseUrl = "http://127.0.0.1:12214/";
-    static uploadUrl = "http://127.0.0.1:12214/";
-    static ws = "ws://rw.quwanya.cn:12217/ws";
+    // static baseUrl = "http://127.0.0.1:12214/";
+    // static uploadUrl = "http://127.0.0.1:12214/";
+    // static ws = "ws://rw.quwanya.cn/ws";
    
 }
 export default Config;
+
--- a/src/util/webRtc.ts
+++ b/src/util/webRtc.ts
@ -1,4 +1,6 @@
-import SocketService from "./socket";
+// import SocketService from "./socket";
+
+import Config from "./config";

 // const socketService = SocketService.getInstance();
 class WebRtc {
@ -17,7 +19,7 @@ class WebRtc {
        }))
    }
    async init() {
-        this.ws = new WebSocket("ws://rw.quwanya.cn:12217/ws")
+        this.ws = new WebSocket(Config.ws)
        this.ws.addEventListener('open', this.open);
        let that = this;
        this.createOffer()