add animation

2025-03-11 17:26:05 +08:00 · 2025-03-11 17:26:05 +08:00 · 66dba51bf9
parent 07b4f7e193
commit 66dba51bf9
32 changed files with 516 additions and 240 deletions
--- a/src/App.tsx
+++ b/src/App.tsx
@ -20,6 +20,9 @@ const onMessage = (e: any) => {
        lat: body.address.lat ?? 30.523876,
        title: body?.user.user_name,
        users: body.user,
+        clicks:(v)=>{
+          console.log(v)
+        }
      });
    }
  } else if (data.type === "move") {
--- a/src/components/map/MapComponentTow.tsx
+++ b/src/components/map/MapComponentTow.tsx
@ -0,0 +1,46 @@
+import { useEffect, useState } from "react";
+import AMapLoader from "@amap/amap-jsapi-loader";
+import { mapArrs } from "@/store/map";
+
+export default function MapContainerTow() {
+  let [amap, setmaps] = useState<any>(null);
+  useEffect(() => {
+    loadMaps();
+    return () => {
+      amap?.destroy();
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  const loadMaps = async () => {
+    const Amap = await AMapLoader.load({
+      key: "d58999d072ed7e5897d3900a769cfda0", // 申请好的Web端开发者Key，首次调用 load 时必填
+      version: "2.0", // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
+      plugins: ["AMap.Scale", "AMap.MoveAnimation", "AMap.Weather"],
+    });
+
+    amap = new Amap.Map("containerTow", {
+      viewMode: "2D", // 是否为3D地图模式
+      zoom: 15, // 初始化地图级别
+      center: [103.872802, 30.523876], // 初始化地图中心点位置
+      mapStyle: "amap://styles/darkblue",
+      resizeEnable: true,
+    });
+    const polygon = new Amap.Polygon({
+      map: amap,
+      path: mapArrs,
+      strokeColor: "red", //线颜色
+      strokeOpacity: 0.8, //线透明度
+      strokeWeight: 2, //线宽
+      fillColor: "#85b0ec", //填充色
+      fillOpacity: 0, //填充透明度
+    });
+    amap.add(polygon);
+    amap.setFitView();
+    setmaps(amap);
+  };
+
+  return (
+    <div id="containerTow" style={{ height: "100vh", width: "100%" }}></div>
+  );
+}
--- a/src/components/map/MapFrom.tsx
+++ b/src/components/map/MapFrom.tsx
@ -37,7 +37,6 @@ export default function MapFrom(props:any) {
      // 开启坐标选择功能
      mouseTool.on("draw", function (event) {
        var lnglat = event.obj.getBounds().getCenter(); // 获取图形的中心点坐标
-        console.log(lnglat)
        markers = mouseTool.overlays.marker
        props.onChange({lng:lnglat.lng,lat:lnglat.lat})
        var mk = []
--- a/src/components/map/mapUtil.ts
+++ b/src/components/map/mapUtil.ts
@ -2,7 +2,7 @@ import makers from "../../static/map-maker.png";
 import makers1 from "../../static/map-maker1.png";
 interface makersInf {
    userIdentity: string,
-    marker: any
+    marker: any,
 } 
 class MapUtl {
    static makerList: makersInf[] = [];
@ -11,7 +11,7 @@ class MapUtl {
    static wecherInfo: any = null;

    static addMaker(data: any) {
-        const { lng, lat, title, users } = data;
+        const { lng, lat, title, users,clicks } = data;
        let mk, dep = "";
        if (users?.militia_type === 1) {
            mk = makers
@ -51,6 +51,7 @@ class MapUtl {
        });
        marker.on("click", (e) => {
            infoWindow.open(MapUtl.amap, e.target.getPosition());
+            clicks(users.id)
        });
        MapUtl.amap?.add(marker);
        // 将maker添加到数组
@ -98,7 +99,7 @@ class MapUtl {
    }

    static polyline = (lineArr) => {
-        var marker = new MapUtl.loadMap.Marker({
+        let markerp = new MapUtl.loadMap.Marker({
            map: MapUtl.amap,
            position: [116.478935, 39.997761],
            icon: "https://a.amap.com/jsapi_demos/static/demo-center-v2/car.png",
@ -111,17 +112,17 @@ class MapUtl {
            strokeColor: "#28F",  //线颜色
            strokeWeight: 6,      //线宽
        });
-        var passedPolyline = new MapUtl.loadMap.Polyline({
+        let passedPolyline = new MapUtl.loadMap.Polyline({
            map: MapUtl.amap,
            strokeColor: "#AF5",  //线颜色
            strokeWeight: 6,      //线宽
        });
-        marker.on('moving', function (e) {
+        markerp.on('moving', function (e) {
            passedPolyline.setPath(e.passedPath);
            MapUtl.amap.setCenter(e.target.getPosition(), true)
        });
        MapUtl.amap.setFitView();
-        marker.moveAlong(lineArr, {
+        markerp.moveAlong(lineArr, {
            duration: 500,//可根据实际采集时间间隔设置
            autoRotation: true,
        });
--- a/src/index.less
+++ b/src/index.less
@ -73,6 +73,9 @@ code {
  color: #00ef97 !important;
  border-color: #00ef97 !important;
 }
+p{
+  margin: 0;
+}
 .owner_model {
  padding-bottom: 0px !important;
  .ant-modal-content {
@ -80,7 +83,7 @@ code {
    background-size: 100% 100%;
    background-position: center center; /* 可选，确保图片在容器中居中 */
    background-repeat: no-repeat; /* 确保图片不会重复 */
-    padding-bottom: 0px;
+    padding-bottom: 0px; 
    .ant-modal-header {
      color: rgba(0, 0, 0, 0.85);
      background: none;
--- a/src/pages/home/home.less
+++ b/src/pages/home/home.less
@ -34,46 +34,25 @@
  }
  .map_container_t {
    position: absolute;
-    height: 60px;
    top: 0;
    width: 100%;
-    background-image: url("../../static/head.png");
-    background-repeat: no-repeat;
-    backdrop-filter: blur(10px);
+    background-image: url("../../static/head1.png");
    left: 0;
-    right: 0;
+    background-size: 100% 100%;
+    height: 120px;
    z-index: 1;
    display: flex;
-    align-items: center;
    justify-content: space-between;
    .map_container_t_c {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      flex: 4;
-      .title_img {
-        width: 20px;
-        height: 20px;
-        
-      }
-      img{
-        width: 100px;
-      }
-      .on_to {
-        transform: rotate(-180deg) rotateY(0deg);
-      }
-      .twp {
-        height: 30px;
-      }
+      text-align: center;
+      flex: 1;
+      padding: 10px;
+      font-size: 15px;
      > span {
-        margin-left: 15px;
-        margin-right: 15px;
-        color: #fff;
-        font-size:25px;
+        font-size: 20px;
        font-weight: normal;
        line-height: normal;
        letter-spacing: 0.1em;
-        font-variation-settings: "opsz" auto;
        color: #ffffff;
        text-shadow: 0px 0px 10px #29ecb4;
      }
@ -97,16 +76,16 @@
    .map_container_t_r {
      flex: 1;
      display: flex;
-      align-items: center;
-      justify-content: space-between;
      text-align: right;
      padding-right: 10px;
+      display: flex;
+      justify-content: end;
    }
  }
  .map_container_l {
    position: absolute;
    left: 0px;
-    top: 60px;
+    top: 40px;
    width: 20%;
    bottom: 0px;
    z-index: 2;
@ -117,7 +96,7 @@
  .map_container_r {
    position: absolute;
    right: 0px;
-    top: 60px;
+    top: 40px;
    bottom: 0px;
    width: 20%;
    z-index: 2;
@ -126,7 +105,7 @@
    backdrop-filter: blur(10px);
    height: 100%;
  }
-  .map_container_b_check{
+  .map_container_b_check {
    position: absolute;
    bottom: 40px;
    height: 60px;
@ -138,7 +117,6 @@
    position: absolute;
    bottom: 0px;
    backdrop-filter: blur(10px);
-    background: rgba(37, 52, 70, 0.4);
    height: 60px;
    width: 100%;
    z-index: 1;
@ -146,11 +124,7 @@
    .bottom_content {
      display: inline-block;
      > span {
-        background: linear-gradient(
-          180deg,
-          rgba(0, 193, 153, 0.1) 0%,
-          rgba(0, 239, 151, 0.8) 100%
-        );
+       
        padding: 5px 10px;
        color: #fff;
        margin: 0 10px;
--- a/src/pages/home/home.tsx
+++ b/src/pages/home/home.tsx
@ -4,9 +4,6 @@ import MapContainer from "@/components/map/MapComponent";
 import HomeLeft from "@/pages/home/homeLeft/home_left";
 import HomeRight from "@/pages/home/homeRigrt/home_right";
 import HomeBottom from "@/pages/home/homeBottom/home_bottom";
-import image2 from "@/static/title_line@1x.png";
-import { SettingOutlined } from "@ant-design/icons";
-import { useNavigate } from "react-router";
 import Weather from "./homeLeft/weather";
 import Timer from "./homeLeft/timer";
 import HomeVideo from "./home_video";
@ -14,7 +11,7 @@ import HomeCheck from "./home_check";
 import Scr from "./scr";

 const Home = observer(() => {
-  const navigate = useNavigate();
+  
  return (
    <div className="contents_center">
      <div className="map_container_t">
@ -22,18 +19,10 @@ const Home = observer(() => {
          <Timer />
        </div>
        <div className="map_container_t_c">
-          <img className="twp on_to" src={image2} alt="" />
          <span>黄水镇微网实格应急处突综合指挥服务平台</span>
-          <img className="twp" src={image2} alt="" />
        </div>
        <div className="map_container_t_r">
          <Weather />
-          <SettingOutlined
-            onClick={() => {
-              navigate("admin/user");
-            }}
-            style={{ fontSize: "1rem", color: "#f9f9f9", cursor: "pointer" }}
-          />
        </div>
      </div>
      <div className="scr">
@ -50,7 +39,7 @@ const Home = observer(() => {
        <HomeRight />
      </div>
      <div className="map_container_b_check">
-        <HomeCheck />
+        {/* <HomeCheck /> */}
      </div>
      <div className="map_container_b">
        <HomeBottom />
--- a/src/pages/home/homeBottom/bot.less
+++ b/src/pages/home/homeBottom/bot.less
@ -5,6 +5,9 @@
  align-items: center;
  justify-content: center;
  height: 100%;
+  background-image: url("../../../static/bottom.png");
+  background-size: 100% 100%;
+  background-repeat: no-repeat;
 }

 .owner_model {
--- a/src/pages/home/homeLeft/left.less
+++ b/src/pages/home/homeLeft/left.less
@ -11,13 +11,13 @@
        overflow-y: hidden;
        text-align: center;
        .org_head{
-            background-image: url("../../../static/titie_secend@1x.png");
-            background-size: 100% 50px;
+            background-image: url("../../../static/sub_title.png");
+            background-size: 100% 100%;
            background-repeat: no-repeat;
-            line-height: 60px;
-            height: 50px;
+            line-height: 36px;
+            height: 36px;
            text-align: left;
-            padding-left: 20px;
+            padding-left: 30px;
        }
        .orgin-content{
            display: flex;
--- a/src/pages/home/homeLeft/pover.tsx
+++ b/src/pages/home/homeLeft/pover.tsx
@ -22,7 +22,7 @@ const Pover = (props: Store) => {
      },
      grid: {
        top: "10%",
-        bottom: "45%",
+        bottom: "35%",
        right: "5%",
        left: "12%",
      },
@ -37,6 +37,7 @@ const Pover = (props: Store) => {
          data: data.map((item) => item.count),
          type: "bar",
          barWidth: 10, // 设置柱子粗细
+          color:"#0094FF",
          itemStyle: {
            borderRadius: [5, 5, 0, 0],
          },
@ -66,6 +67,7 @@ const Pover = (props: Store) => {
        title="力量汇总"
        className="owner_model"
        width={"80%"}
+        height={"700px"}
        open={isModalOpen}
        afterClose={() => {}}
        onOk={() => {}}
--- a/src/pages/home/homeLeft/timer.tsx
+++ b/src/pages/home/homeLeft/timer.tsx
@ -20,7 +20,7 @@ const Timer = () => {
      clearInterval(tim);
    };
  }, []);
-  return <span style={{fontSize:"1rem"}}>{times} </span>;
+  return <span style={{fontSize:"1rem",marginTop:"5px",display:"block"}}>{times} </span>;
 };

 export default Timer;
--- a/src/pages/home/homeLeft/trun_chat_config.ts
+++ b/src/pages/home/homeLeft/trun_chat_config.ts
@ -11,7 +11,7 @@ export const trunEchatConfig = (data) => {
                rotate: 30,
            },
        },
-        grid: { top: "10%", bottom: "45%", right: "5%" },
+        grid: { top: "10%", bottom: "35%", right: "5%" },
        yAxis: {
            type: "value",
            splitLine: {
--- a/src/pages/home/homeLeft/weather.tsx
+++ b/src/pages/home/homeLeft/weather.tsx
@ -1,8 +1,10 @@
 import MapUtl from "@/components/map/mapUtil";
 import { useEffect, useState } from "react";
-
+import { SettingOutlined } from "@ant-design/icons";
+import { useNavigate } from "react-router";
 const Weather = () => {
  const [wechaer, setWechaer] = useState<any>();
+  const navigate = useNavigate();
  useEffect(() => {
    setTimeout(() => {
      MapUtl.wecherInfo?.getLive("双流区", (err, data) => {
@ -16,31 +18,31 @@ const Weather = () => {
        flex: "1",
        color: "#fff",
        fontSize: "13px",
-        padding:"10px"
      }}
    >
      <div
        style={{
-          fontSize: ".8rem",
+          fontSize: "1rem",
          display: "flex",
-          justifyContent: "space-between",
+          justifyContent: "end",
          alignItems: "center",
+          marginTop:"5px"
        }}
      >
        <span>天气:{wechaer?.weather}</span>
        <span>风向:{wechaer?.windDirection}</span>
-      </div>
-      <div
-        style={{
-          fontSize: ".8rem",
-          display: "flex",
-          justifyContent: "space-between",
-          alignItems: "center",
-        }}
-      >
+        <div style={{width:"10px"}}></div>
        <span>风级:{wechaer?.windPower}</span>
        <span>湿度:{wechaer?.humidity}</span>
+        <div style={{width:"10px"}}></div>
+        <SettingOutlined
+        onClick={() => {
+          navigate("admin/user");
+        }}
+        style={{ fontSize: "1rem", color: "#f9f9f9", cursor: "pointer" }}
+      />
      </div>
+     
    </div>
  );
 };
--- a/src/pages/home/homeRigrt/ac.tsx
+++ b/src/pages/home/homeRigrt/ac.tsx
@ -6,11 +6,11 @@ const Ac = (props: Store) => {
  const { homeStore } = props;

  const initChart = (data) => {
-    var myChart = echarts.init(document.getElementById("rm"));
+    var myChart = echarts.init(document.getElementById("ac"));
    var option = {
      legend: {
        top: "5%",
-        left:"left",
+        left: "right",
        textStyle: {
          color: "#fff",
        },
@ -33,17 +33,17 @@ const Ac = (props: Store) => {
      },
      series: [
        {
-          center: ["70%", "40%"],
+          center: ["35%", "40%"],
          name: "Access From",
          type: "pie",
-          radius: ["40%", "60%"],
-            normal : {
-              label : {
-                show : false
-              },
-              labelLine : {
-                show : false
-              }
+          radius: ["30%", "50%"],
+          normal: {
+            label: {
+              show: false,
+            },
+            labelLine: {
+              show: false,
+            },
          },
          label: {
            backgroundColor: "#F6F8FC",
@ -64,6 +64,6 @@ const Ac = (props: Store) => {
    });
   
  }, [homeStore]);
-  return <div style={{ width: "100%", height: "100%" }} id="rm"></div>;
+  return <div style={{ width: "100%", height: "100%" }} id="ac"></div>;
 };
 export default inject("homeStore")(observer(Ac));
--- a/src/pages/home/homeRigrt/pyzx.tsx
+++ b/src/pages/home/homeRigrt/pyzx.tsx
@ -2,11 +2,17 @@ import { inject, observer } from "mobx-react";
 import "./right.less";
 import { Store } from "antd/es/form/interface";
 import { useEffect, useState } from "react";
+import { Modal } from "antd";
+
 const Pyzx = (props: Store) => {
  const { homeStore } = props;
  const [user, setUser] = useState<any>();
+  const [isModalOpen, setIsModalOpen] = useState<boolean>(false);
  useEffect(() => {
    homeStore.getAe().then((res) => {
+      res.data?.record.sort((item, item2) => {
+        return item2.scores - item.scores;
+      });
      setUser(res.data?.record);
    });
  }, [homeStore]);
@ -15,12 +21,15 @@ const Pyzx = (props: Store) => {
    <div className="pyzx">
      {user?.map((item) => {
        return (
-          <div key={item.id} className="pyzx_title">
-            <img
-              height={80}
-              src={item.head_img}
-              alt=""
-            />
+          <div
+            key={item.id}
+            className="pyzx_title"
+            onClick={() => {
+              homeStore.getScores(item.identity);
+              setIsModalOpen(true);
+            }}
+          >
+            <img height={80} src={item.head_img} alt="" />
            <div className="content">
              <div>姓名:{item.user_name}</div>
              <div>总积分:{item.scores}</div>
@ -30,6 +39,56 @@ const Pyzx = (props: Store) => {
          </div>
        );
      })}
+      <Modal
+        title="积分详情"
+        className="owner_model"
+        width={"60%"}
+        open={isModalOpen}
+        afterClose={() => {}}
+        onOk={() => {}}
+        footer={null}
+        onCancel={() => {
+          setIsModalOpen(false);
+        }}
+      >
+        <div>
+          <p style={{ color: "#fff", fontSize: "16px" }}>总积分：{homeStore.scoreData?.totalScore}</p>
+          <div style={{ color: "#fff", fontSize: "15px" ,display:"flex",justifyContent:"space-between",marginBottom:"10px"}}>
+            <div style={{border:"1px solid #333",padding:"10px",flex:1}}>
+              <span>训练积分汇总 :</span>
+              <span>{homeStore.scoreData?.taskScore}</span>
+              <div style={{height:"10px"}}></div>
+              <div style={{height:"500px"}}>
+                {
+                 homeStore.scoreData?.training?.map((item,index)=>{
+                  return <div key={index} style={{marginBottom:"10px",border:"1px solid #333",padding:"10px"}}>
+                    <div>任务标题：{item.title}</div>
+                    <div>任务描述：{item.desc}</div>
+                    <div>任务积分：{item.score}</div>
+                  </div>
+                 }) 
+                }
+              </div>
+            </div>
+            <div style={{width:"10px"}}></div>
+            <div style={{border:"1px solid #333",padding:"10px",flex:1}}>
+              <span>学习积分汇总 :</span>
+              <span>{homeStore.scoreData?.learnScore}</span>
+              <div style={{height:"10px"}}></div>
+              <div style={{height:"500px",overflow:"auto"}}>
+                {
+                 homeStore.scoreData?.learn?.map((item,index)=>{
+                  return <div key={index} style={{marginBottom:"10px",border:"1px solid #333",padding:"10px"}}>
+                    <div>学习内容：{item.title}</div>
+                    <div>任务积分：{item.score}</div>
+                  </div>
+                 }) 
+                }
+              </div>
+            </div>
+          </div>
+        </div>
+      </Modal>
    </div>
  );
 };
--- a/src/pages/home/homeRigrt/right.less
+++ b/src/pages/home/homeRigrt/right.less
@ -10,13 +10,13 @@
    overflow-y: hidden;
    text-align: center;
    .org_head {
-      background-image: url("../../../static/titie_secend@1x.png");
-      background-size: 100% 50px;
+      background-image: url("../../../static/sub_title.png");
+      background-size: 100% 100%;
      background-repeat: no-repeat;
-      line-height: 60px;
-      height: 50px;
+      line-height: 36px;
+      height: 36px;
      text-align: left;
-      padding-left: 20px;
+      padding-left: 30px;
    }
  }
 }
--- a/src/pages/home/homeRigrt/wz.tsx
+++ b/src/pages/home/homeRigrt/wz.tsx
@ -13,7 +13,7 @@ const Wz = (props: Store) => {
    var option = {
      legend: {
        top: "5%",
-        right: "right",
+        right: "left",
        textStyle: {
          color: "#fff",
        },
@ -26,13 +26,20 @@ const Wz = (props: Store) => {
          });
          return name + "-" + v;
        },
+        orient: "vertical", // 垂直排列
+        type: "scroll", //分页类型
+        pageIconColor: "#ff781f", //翻页箭头颜色
+        pageTextStyle: {
+          color: "#999", //翻页数字颜色
+        }, //翻页数字设置
+        pageIconSize: 5,
      },
      series: [
        {
          center: ["35%", "40%"],
          name: "Access From",
          type: "pie",
-          radius: ["40%", "60%"],
+          radius: ["30%", "50%"],
          normal: {
            label: {
              show: false,
@ -45,7 +52,7 @@ const Wz = (props: Store) => {
            backgroundColor: "#F6F8FC",
            borderColor: "#8C8D8E",
            borderWidth: 0,
-            show: true,
+            show: false,
            borderRadius: 4,
          },
          data,
--- a/src/pages/home/home_check.tsx
+++ b/src/pages/home/home_check.tsx
@ -1,12 +1,18 @@
-import { Radio } from "antd";
+import { Button, DatePicker, message, Modal, Radio, Space } from "antd";
 import { useEffect, useState } from "react";
 import { inject, observer } from "mobx-react";
 import { Store } from "antd/es/form/interface";
 import MapUtl from "@/components/map/mapUtil";
+import MapContainerTow from "@/components/map/MapComponentTow";

 const HomeCheck = (props: Store) => {
-  const { homeStore } = props;
+  const { homeStore ,usrStore} = props;
  const [size, changeSize] = useState("1");
+  const [id, setId] = useState("");
+  const { RangePicker } = DatePicker;
+  const [isOpen, setOpen] = useState<boolean>(false);
+  const [times, setTimes] = useState<string[]>([]);
+
  const handleSizeChange = (e: any) => {
    changeSize(e.target.value);
    getUlist(e.target.value);
@ -15,8 +21,35 @@ const HomeCheck = (props: Store) => {
    setTimeout(() => {
      getUlist("1");
    }, 2000);
-  // eslint-disable-next-line react-hooks/exhaustive-deps
+    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []);
+  const serchSD = () => {
+    if (times.length === 0) {
+      message.error("请选择时间区间");
+      return;
+    }
+    usrStore
+      .getSite({
+        id: id,
+        start_time: times[0],
+        end_time: times[1],
+      })
+      .then((res) => {
+        let data: any = [];
+        if (res.data && res.data.record) {
+          res.data.record.forEach((element) => {
+            data.push([element.long, element.lat]);
+          });
+          if (data.length === 0) {
+            message.info("暂无轨迹数据");
+            return;
+          }
+          if (data.length > 0) {
+            MapUtl.polyline(data);
+          }
+        }
+      });
+  };

  const getUlist = (type) => {
    let query = {};
@ -46,18 +79,58 @@ const HomeCheck = (props: Store) => {
          lat: element.lat,
          title: element.user_name,
          users: element,
+          clicks: (v) => {
+            setId("01JDGZGAKDRK1K5R5AF9JFHCTN")
+            setOpen(true)
+          },
        });
      });
    });
  };
  return (
-    <Radio.Group value={size} onChange={handleSizeChange}>
-      <Radio.Button value="1">民兵</Radio.Button>
-      <Radio.Button value="2">网格员</Radio.Button>
-      <Radio.Button value="3">巡防</Radio.Button>
-    </Radio.Group>
+    <>
+      <Radio.Group value={size} onChange={handleSizeChange}>
+        <Radio.Button value="1">民兵</Radio.Button>
+        <Radio.Button value="2">网格员</Radio.Button>
+        <Radio.Button value="3">巡防</Radio.Button>
+      </Radio.Group>
+      <Modal
+        title={"轨迹回放"}
+        width={"70%"}
+        open={isOpen}
+        centered
+        okText="确定"
+        cancelText="取消"
+        footer={null}
+        destroyOnClose={true}
+        onCancel={() => {
+          setOpen(false);
+        }}
+      >
+        <div>
+          <Space>
+            <RangePicker
+              onChange={(v, s) => {
+                setTimes(s);
+              }}
+            />
+            <Button
+              type="dashed"
+              size="small"
+              onClick={() => {
+                serchSD();
+              }}
+            >
+              查看轨迹信息
+            </Button>
+          </Space>
+          <div style={{ height: "10px" }}></div>
+          <MapContainerTow />
+        </div>
+      </Modal>
+    </>
  );
 };

 // export default HomeBottom;
-export default inject("homeStore")(observer(HomeCheck));
+export default inject("homeStore","usrStore")(observer(HomeCheck));
--- a/src/pages/poverDetail/index.tsx
+++ b/src/pages/poverDetail/index.tsx
@ -30,11 +30,11 @@ const PoverDetail = (props:Store) => {
          </tr>
          <tr>
            <td >通讯地址</td>
-            <td colSpan={3}>{usrStore.userDetail?.mail_addr}</td>
+            <td colSpan={3}>{usrStore.userDetail?.home_addr}</td>
          </tr>
          <tr>
            <td >联系电话</td>
-            <td >13208266337</td>
+            <td >{usrStore.userDetail?.tel}</td>
            <td >邮箱</td>
            <td colSpan={2}>{usrStore.userDetail?.email}</td>
          </tr>
--- a/src/pages/poverPage/index.tsx
+++ b/src/pages/poverPage/index.tsx
@ -9,11 +9,16 @@ import PoverDetail from "../poverDetail";
 const PoverPage = (props: Store) => {
  const { usrStore } = props;
  const [poverData, setPover] = useState<any>();
+  const [config, setConfig] = useState<any>({
+    militia_type: 1,
+    vet: 1,
+    o_type: "",
+  });
  const initChart = (id: string, count: number, total: number) => {
    var myChart = echarts.init(document.getElementById(id));
    var option = {
      title: {
-        text: "10%",
+        text: count,
        left: "center",
        top: "center",
        textStyle: {
@ -52,40 +57,52 @@ const PoverPage = (props: Store) => {
  };
  useEffect(() => {
    usrStore.getPover().then((e) => {
-      initChart("pover_jg", e.data.o_type_nums, e.data.total);
-      initChart("pover_jgs", e.data.o_type_num, e.data.total);
-      initChart("pover1", e.data.a_member, e.data.total);
+      initChart("pover_jg", e.data.o_type, e.data.total);
+      initChart("pover_jgs", e.data.o_types, e.data.total);
      setPover(e.data);
    });
  }, [usrStore]);
-
+  const serch = () => {
+    usrStore.getPoverList(config);
+  };
  return (
-    <div style={{ width: "100%", height: "100%" }}>
+    <div
+      style={{
+        width: "100%",
+        height: "100%",
+        display: "flex",
+        alignContent: "space-between",
+      }}
+    >
      <div className="nav-header">
-        <div style={{ textAlign: "center" }}>
-          <div style={{ width: "150px", height: "100px" }} id="pover_jgs"></div>
+        <div style={{ textAlign: "center", marginBottom: "20px" ,cursor:"pointer" }}>
+          <div
+            style={{ width: "150px", height: "100px" }}
+            id="pover_jgs"
+            onClick={() => {
+              setConfig({
+                o_type: "01JAZAZDTHJE8FZ24GY9AJ758N",
+                size: 30,
+                offset: 1,
+              });
+              serch();
+            }}
+          ></div>
          <span style={{ color: "#fff" }}>机关单位</span>
        </div>
-        <div className="pv-head-item">
-          <SnippetsTwoTone style={{ fontSize: 30 }} />
-          <div>
-            <div>{poverData?.militia_meber}人</div>
-            <span>基干民兵</span>
-          </div>
-        </div>
-        <div className="pv-head-item">
-          <SnippetsTwoTone style={{ fontSize: 30 }} />
-          <div>
-            <div>{poverData?.easy_meber}人</div>
-            <span>普通民兵</span>
-          </div>
-        </div>
-        <div className="pv-head-item">
-          <SnippetsTwoTone style={{ fontSize: 30 }} />
-          <div>
-            <div>{poverData?.vet_meber}人</div>
-            <span>退役军人</span>
-          </div>
+        <div
+          style={{ textAlign: "center", marginBottom: "20px" }}
+          onClick={() => {
+            setConfig({
+              o_type: "01JAZB1GVJED5R34V6Z8MBWER4",
+              size: 30,
+              offset: 1,
+            });
+            serch();
+          }}
+        >
+          <div style={{ width: "150px", height: "100%" }} id="pover_jg"></div>
+          <span style={{ color: "#fff" }}>企事业单位</span>
        </div>
      </div>
      <div className="nav-content">
@ -95,16 +112,57 @@ const PoverPage = (props: Store) => {
            usrStore.setPoverDe(false);
          }}
        >
-          <div style={{ textAlign: "center" }}>
-            <div style={{ width: "100%", height: "100%" }} id="pover_jg"></div>
-            <span style={{ color: "#fff" }}>企事业单位</span>
+          <div
+            className="pv-head-item"
+            onClick={(e) => {
+              setConfig({
+                militia_type: 1,
+                size: 30,
+                offset: 1,
+              });
+              serch();
+            }}
+          >
+            <SnippetsTwoTone style={{ fontSize: 30 }} />
+            <div>
+              <div>{poverData?.militia_meber}人</div>
+              <span>基干民兵</span>
+            </div>
          </div>
-          <p></p>
-          <div style={{ textAlign: "center"}}>
-            <div style={{ width: "100%", height: "100%" }} id="pover1"></div>
-            <span style={{ color: "#fff" }}>积极力量</span>
+          <div className="pv-head-item">
+            <SnippetsTwoTone style={{ fontSize: 30 }} />
+            <div
+              onClick={() => {
+                setConfig({
+                  militia_type: 2,
+                  size: 30,
+                  offset: 1,
+                });
+                serch();
+              }}
+            >
+              <div>{poverData?.easy_meber}人</div>
+              <span>普通民兵</span>
+            </div>
+          </div>
+          <div className="pv-head-item">
+            <SnippetsTwoTone style={{ fontSize: 30 }} />
+            <div
+              onClick={() => {
+                setConfig({
+                  vet: 1,
+                  size: 30,
+                  offset: 1,
+                });
+                serch();
+              }}
+            >
+              <div>{poverData?.vet_meber}人</div>
+              <span>退役军人</span>
+            </div>
          </div>
        </div>
+
        <div className="content-right">
          <p style={{ margin: 0, fontSize: "20px", marginBottom: "10px" }}>
            双流区黄水镇人民武装部基干民兵力量
--- a/src/pages/poverPage/pv.less
+++ b/src/pages/poverPage/pv.less
@ -1,18 +1,17 @@
 .nav-header {
  min-height: 50px;
  padding: 10px;
-  display: flex;
 }
 .nav-content {
  width: 100%;
  height: 100%;
  min-height: 500px;
-  display: flex;
-  align-items: start;
-  justify-content: space-around;
+ 
  .content-left {
-    width: 15%;
    height: 100%;
+    display: flex;
+    align-items: start;
+    justify-content: start;
  }
  .content-right {
    width: 85%;
@ -43,7 +42,7 @@
  }
 }
 .pv_table {
-  height: 430px;
+  height: 500px;
  .table {
    width: 100%;
    overflow-x: auto;
@ -61,5 +60,6 @@
        }
      }
    }
+    
  }
 }
--- a/src/pages/poverPage/pvTable.tsx
+++ b/src/pages/poverPage/pvTable.tsx
@ -5,28 +5,26 @@ import { useEffect } from "react";
 const PvTable = (props: Store) => {
  const { teamStore, persMgmtStore, usrStore } = props;
  useEffect(() => {
-    teamStore.getlist();
    persMgmtStore.getlist();
-    usrStore.getlist();
-   
-  }, [teamStore,persMgmtStore,usrStore]);
-  const folders = (id,list) => {
-    let has = false
-    list.forEach(element => {
+    usrStore.getPoverList();
+  }, [teamStore, persMgmtStore, usrStore]);
+  const folders = (id, list) => {
+    let has = false;
+    list.forEach((element) => {
      if (element.team_identity === id) {
-        has = true
+        has = true;
      }
    });
-    return <div>{has?'√':'x'}</div>
+    return <div>{has ? "√" : "x"}</div>;
  };
-  const foldersp = (id,list) => {
-    let has = false
-    list.forEach(element => {
+  const foldersp = (id, list) => {
+    let has = false;
+    list.forEach((element) => {
      if (element.pers_identity === id) {
-        has = true
+        has = true;
      }
    });
-    return <div>{has?'√':'x'}</div>
+    return <div>{has ? "√" : "x"}</div>;
  };
  return (
    <div className="pv_table">
@ -36,7 +34,6 @@ const PvTable = (props: Store) => {
            <td rowSpan={2}>序号</td>
            <td rowSpan={2}>姓名</td>
            <td rowSpan={2}>政治面貌</td>
-            <td rowSpan={2}>所属集结点</td>
            <td colSpan={teamStore.list?.length ?? 4}>所属队伍</td>
            <td colSpan={persMgmtStore.list?.length ?? 4}>个人身份</td>
          </tr>
@ -50,23 +47,27 @@ const PvTable = (props: Store) => {
          </tr>
        </thead>
        <tbody>
-          {usrStore.list?.map((us,i) => {
+          {usrStore.poverList?.map((us, i) => {
            return (
-              <tr 
-              key={us.id}
-              onClick={(e) => {
-                usrStore.setUserDetaul(us)
-                usrStore.setPoverDe(true)
-              }}>
-                <td>{i+1}</td>
-                <td>{us.user_name}</td>
-                <td>{us.political_affil}</td>
-                <td>{us.dep_identity}</td>
+              <tr
+                key={us.id}
+                onClick={(e) => {
+                  usrStore.setUserDetaul(us);
+                  usrStore.setPoverDe(true);
+                }}
+              >
+                <td>{i + 1}</td>
+                <td>{us.username}</td>
+                <td>{us.politicalaffils.name}</td>
                {teamStore.list?.map((e) => {
-                  return <td key={e.identity}>{folders(e.identity,us.team)}</td>;
+                  return (
+                    <td key={e.identity}>{folders(e.identity, us.team)}</td>
+                  );
                })}
                {persMgmtStore.list?.map((e) => {
-                   return <td key={e.identity}>{foldersp(e.identity,us.pers)}</td>;
+                  return (
+                    <td key={e.identity}>{foldersp(e.identity, us.pers)}</td>
+                  );
                })}
              </tr>
            );
--- a/src/pages/signin/column.tsx
+++ b/src/pages/signin/column.tsx
@ -65,4 +65,5 @@ export const serchConfig = [
    value: "",
    rules: [],
  },
+   
 ];
--- a/src/pages/signin/index.tsx
+++ b/src/pages/signin/index.tsx
@ -1,17 +1,46 @@
-import { Button, FormInstance, Space } from "antd";
+import { Button, Form, FormInstance, Select, Space } from "antd";
 import { inject, observer } from "mobx-react";
 import BTable from "@/components/b_table";
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
 import { Store } from "antd/lib/form/interface";
 import React from "react";
 import { serchConfig, studyColumns } from "./column";
 import SimpleForm from "@/components/form/simple_form";
+const { Option } = Select;

 const Signin = (props: Store) => {
  const { signinStore } = props;
  const serchFormRef = React.useRef<FormInstance>(null);
-  useEffect(() => { 
+  const [tagList, setTagList] = useState<any>([]);
+
+  useEffect(() => {
    signinStore.getlist();
+    setTagList([
+      {
+        id: 0,
+        name: "全部",
+      },
+      {
+        id: 1,
+        name: "网格员",
+      },
+      {
+        id: 2,
+        name: "微网格员",
+      },
+      {
+        id: 3,
+        name: "基干民兵",
+      },
+      {
+        id: 4,
+        name: "普通民兵",
+      },
+      {
+        id: 5,
+        name: "巡防大队",
+      },
+    ]);
  }, [signinStore]);

  const onSerchFinish = (values: any) => {
@ -20,7 +49,7 @@ const Signin = (props: Store) => {
      start_time: values.start_time?.format("YYYY-MM-DD HH:mm"),
      end_time: values.end_time?.format("YYYY-MM-DD HH:mm"),
      page: 1,
-      page_size: 10,
+      page_size: 20,
    };
    signinStore.getlist(query);
  };
@ -46,6 +75,17 @@ const Signin = (props: Store) => {
            onFinishFailed={onFinishFailed}
          >
            <Space>
+              <Form.Item key="tags" label="身份" name="tags" initialValue={0}>
+                <Select placeholder="">
+                  {tagList?.map((v: any) => {
+                    return (
+                      <Option key={v.id} value={v.id}>
+                        {v.name}
+                      </Option>
+                    );
+                  })}
+                </Select>
+              </Form.Item>
              <Button
                type="primary"
                onClick={() => {
@ -62,18 +102,17 @@ const Signin = (props: Store) => {
              >
                重置
              </Button>
-              <Button onClick={() => {
-                signinStore.exports();
-              }}>导出</Button>
+              <Button
+                onClick={() => {
+                  signinStore.exports();
+                }}
+              >
+                导出
+              </Button>
            </Space>
          </SimpleForm>
        </Space>
-
-        <BTable
-          store={signinStore}
-          columns={studyColumns}
-          dataSource={signinStore.list}
-        />
+        <BTable store={signinStore} columns={studyColumns} dataSource={signinStore.list}/>
      </Space>
    </div>
  );
--- a/src/pages/user/move.tsx
+++ b/src/pages/user/move.tsx
@ -38,25 +38,10 @@ const Move = (props) => {
 
  return (
    <>
-      <Button
-        type="dashed"
-        size="small"
-        onClick={() => {
-          setOpen(true);
-        }}
-      >
+      <Button type="dashed" size="small" onClick={() => {setOpen(true);}}>
        查看轨迹信息
      </Button>
-
-      <Modal
-        title={"轨迹回放"}
-        width={"70%"}
-        open={isOpen}
-        centered
-        okText="确定"
-        cancelText="取消"
-        footer={null}
-        destroyOnClose={true}
+      <Modal title={"轨迹回放"} width={"70%"} open={isOpen} centered okText="确定" cancelText="取消" footer={null} destroyOnClose={true}
        onCancel={() => {
          setOpen(false);
        }}
--- a/src/pages/user/user_config.tsx
+++ b/src/pages/user/user_config.tsx
@ -29,6 +29,23 @@ export const defaultConfig =(team,per)=>
    value: 0,
    rules: [{ required: true, message: "请选择性别" }],
  },
+  {
+    type: FormType.radio,
+    label: "视频查看权限",
+    name: "video_permission",
+    radioData: [
+      {
+        key: "有",
+        val: 1,
+      },
+      {
+        key: "无",
+        val: 2,
+      },
+    ],
+    value: 0,
+    rules: [{ required: true, message: "视频查看权限" }],
+  },
  {
    type: FormType.radio,
    label: "是否网格员",
@ -61,7 +78,7 @@ export const defaultConfig =(team,per)=>
      },
    ],
    value: 0,
-    rules: [],
+    rules: [{ required: true, message: "是否微网格员" }],
  },
  {
    type: FormType.radio,
--- a/src/static/bottom.png
+++ b/src/static/bottom.png
--- a/src/static/head1.png
+++ b/src/static/head1.png
--- a/src/static/sub_title.png
+++ b/src/static/sub_title.png
--- a/src/store/home.ts
+++ b/src/store/home.ts
@ -3,7 +3,6 @@ import { action, makeObservable, observable } from "mobx";
 import baseHttp from "@/service/base";
 import BaseStore from "./baseStore";
 import { TagDataType } from "@/model/userModel";
-import MapUtl from "@/components/map/mapUtil";
 import Config from "@/util/config";

 class HomeConfig {
@ -15,28 +14,36 @@ class HomeConfig {
    static ae: string = "/v1/public/ae"
    static todo: string = "/v1/public/todo"
    static con: string = "/v1/user/mapMakerUser"
-    
+
    static newTask: string = "/v1/user/newTask"
    static taskulist: string = "/v1/public/taskInUser"
    static deviceList: string = "/api/v1/devicesconfig" //设备列表
    static channerList: string = "/api/v1/channelsconfig" //设备列表
    static channelstream: string = "/api/v1/devices/channelstream" //设备包活
+    static scores: string = "/v1/user/scores"

 }
 class HomeStore extends BaseStore<TagDataType> {
+    scoreData = {}
    constructor() {
        super(HomeConfig)
        makeObservable(this, {
            getOgCount: action,
+            scoreData:observable,
            ogMap: observable,
            alist: observable,
            showVideo: observable,
            ulist: observable,
            showVideoHandler: action,
            getTaskUserList: action,
+            getScores: action,
        })
    }
-
+    async getScores(id) {
+        let data = await baseHttp.get(HomeConfig.scores + "/" + id, null)
+        this.scoreData = data.data.record
+        
+    }
    async getOgCount() {
        let res = await baseHttp.get(HomeConfig.os, {});
        this.ogMap = res.data.record
@ -113,9 +120,9 @@ class HomeStore extends BaseStore<TagDataType> {
                    let res = await this.getChannerStrem(element.device, element.channel)
                    urls.push(Config.videoApis + res.EasyDarwin?.Body.URL)
                }
-                this.getTaskUserList()
+                // this.getTaskUserList()
                this.showVideoHandler(true)
-               
+
            }
            return urls;
        } catch (error) {
@ -126,12 +133,12 @@ class HomeStore extends BaseStore<TagDataType> {
        let res = await baseHttp.get(HomeConfig.taskulist, {});
        if (res.data?.record?.ulist && res.data?.record.ulist.length > 0) {
            res.data?.record?.ulist.forEach(element => {
-                MapUtl.addMaker({
-                    lng: element.long ?? 116.478935,
-                    lat: element.lat ?? 39.997761,
-                    title: element.user_name,
-                    users: element
-                })
+                // MapUtl.addMaker({
+                //     lng: element.long ?? 116.478935,
+                //     lat: element.lat ?? 39.997761,
+                //     title: element.user_name,
+                //     users: element
+                // })
            });
        }
    }
--- a/src/store/user.ts
+++ b/src/store/user.ts
@ -11,6 +11,7 @@ class UserConfig {
    static DELETE: string = "/v1/user"
    static EDIT: string = "/v1/user"
    static pover: string = "/v1/user/userPower"
+    static poverList: string = "/v1/user/poverList"
    static team: string = "/v1/team/list"
    static per: string = "/v1/persMgmt/list"
    static serch: string = "/v1/user/serch"
@ -18,12 +19,15 @@ class UserConfig {
    static videoLogin: string = "/api/v1/login"
    static siteList: string = "/v1/user/site"
    static reSetPwd: string = "/v1/user/reSetPwd"
+
 }
 class UserStore extends BaseStore<UserDataType> {
    _userinfo: UserInfos = {}; // 用户信息
    userDetail = {}
+
    isNeedLogin: boolean = false; // 是否需要登录
    poverDetail: boolean = false; // 是否展示民兵详情
+    poverList: any = []

    constructor() {
        super(UserConfig)
@ -35,6 +39,7 @@ class UserStore extends BaseStore<UserDataType> {
            serchUser: action,
            setPoverDe: action,
            setUserDetaul: action,
+            getPoverList: action,
            getPatrol: action,
            getSite: action,
            _userinfo: observable,
@ -42,12 +47,14 @@ class UserStore extends BaseStore<UserDataType> {
            poverDetail: observable,
            userDetail: observable,
            openLoginDilog: action,
+            poverList: observable,
            userInfo: computed,
        })
    }
    async getTeam() {
        return await baseHttp.get(UserConfig.team, null)
    }
+
    async getPer() {
        return await baseHttp.get(UserConfig.per, null)
    }
@ -60,17 +67,20 @@ class UserStore extends BaseStore<UserDataType> {
    async getPatrol() {
        return await baseHttp.get(UserConfig.getPatrol, {})
    }
-
+    // 获取坐标点
    async getSite(id) {
        return await baseHttp.put(UserConfig.siteList + "/" + id.id, id)
    }
-
+    // 重置密码
    async reSetPwd(id) {
-     await baseHttp.put(UserConfig.reSetPwd+"/"+id,{})
+        await baseHttp.put(UserConfig.reSetPwd + "/" + id, {})
        message.success("密码重置成功")
    }
-
-
+    //  获取 力量列表
+    async getPoverList(param) {
+        let res = await baseHttp.get(UserConfig.poverList, param)
+        this.poverList = res.data.record
+    }

    get userInfo(): UserInfos {
        if (!this._userinfo.token) {
--- a/src/util/config.ts
+++ b/src/util/config.ts
@ -1,6 +1,6 @@
 class Config {
-    static baseUrl = "https://www.hswzct.cn:12016/";
-    // static baseUrl = "http://127.0.0.1:12214/";
+    // static baseUrl = "https://www.hswzct.cn:12016/";
+    static baseUrl = "http://127.0.0.1:12214/";
    static ws = "wss://www.hswzct.cn:12016/wsadmin?id=admin";
    // static ws = "wss://rw.quwanya.cn/wsadmin?id=admin";
    static userStatic = "https://www.hswzct.cn:12016/api/uploads/user/";
@ -8,6 +8,3 @@ class Config {
    static videoApis = "https://sprh.hswzct.cn:4443"; // 
 }
 export default Config;
-
-// 1、发布任务的时候选择视频列表 
-// 2、人的数据区分