From 31063a840774ad72c6ee822770857aad01b85e3b Mon Sep 17 00:00:00 2001 From: wang_yp <357754663@qq.com> Date: Sat, 22 Feb 2025 01:02:13 +0800 Subject: [PATCH] first commit --- src/App.tsx | 20 ++++-- src/components/form/interface.ts | 1 + src/components/form/simple_form.tsx | 20 ++---- src/components/layout/layout.less | 3 + src/pages/dep/index.tsx | 23 +++--- src/pages/home/home.less | 19 +++-- src/pages/home/home.tsx | 6 +- src/pages/home/homeBottom/dispath.tsx | 2 + src/pages/home/homeBottom/home_bottom.tsx | 60 +--------------- src/pages/home/homeLeft/timer.tsx | 2 +- src/pages/home/homeLeft/weather.tsx | 4 +- src/pages/home/home_check.tsx | 63 ++++++++++++++++ src/pages/home/home_video.tsx | 18 ++--- src/pages/home/video.tsx | 88 ++++------------------- src/pages/login/login.tsx | 1 + src/pages/training/traning_config.ts | 2 +- src/pages/user/move.tsx | 71 +++++++++++------- src/pages/user/user.tsx | 56 ++++++++++++--- src/pages/user/user_config.tsx | 47 +++++------- src/service/base.ts | 1 - src/store/home.ts | 8 ++- src/store/user.ts | 7 +- src/util/config.ts | 8 +-- 23 files changed, 273 insertions(+), 257 deletions(-) create mode 100644 src/pages/home/home_check.tsx diff --git a/src/App.tsx b/src/App.tsx index 5556144..f6fc854 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -5,13 +5,23 @@ const socketService = SocketService.getInstance(); const onMessage = (e: any) => { let data = JSON.parse(e); if (data.type === "accpt") { + let maker: any = null; let body = JSON.parse(data.content.body); - MapUtl.addMaker({ - lng: 103.872802, - lat: 30.523876, - title: body?.user_name, - users: body, + MapUtl.makerList?.forEach((e) => { + if (e.userIdentity === body?.user.user_identity) { + maker = e.marker; + } }); + if (maker) { + maker?.setPosition([body.address.long, body.address.lat]); + } else { + MapUtl.addMaker({ + lng: body.address.long ?? 103.872802, + lat: body.address.lat ?? 30.523876, + title: body?.user.user_name, + users: body.user, + }); + } } else if (data.type === "move") { let maker: any = null; let body = JSON.parse(data.content.body); diff --git a/src/components/form/interface.ts b/src/components/form/interface.ts index 8bde48a..3032725 100644 --- a/src/components/form/interface.ts +++ b/src/components/form/interface.ts @@ -42,6 +42,7 @@ export interface SimpleFormData { createCallback?: Function children?: React.ReactElement childrenPosi?: boolean + layout?: "vertical" | "horizontal" | "inline" } diff --git a/src/components/form/simple_form.tsx b/src/components/form/simple_form.tsx index e938863..ae5fad9 100644 --- a/src/components/form/simple_form.tsx +++ b/src/components/form/simple_form.tsx @@ -26,11 +26,10 @@ const SimpleForm = (props: SimpleFormData) => { form={form} labelCol={{ span: props.span ?? 4 }} wrapperCol={{ span: props.colProps }} - layout="horizontal" + layout={props.layout} initialValues={{ menubar: true }} onFinish={onFinish} > - {props.childrenPosi ? null : props.children ?? props.children} {props.formDatas.map((v) => { switch (v.type) { case FormType.input: @@ -55,18 +54,7 @@ const SimpleForm = (props: SimpleFormData) => { ); - // case FormType.fetchList: - // return ( - // - // - // - // ); - case "password": + case FormType.password: return ( { name={v.name} rules={v.rules} > - + ); case FormType.map: @@ -234,7 +222,7 @@ const SimpleForm = (props: SimpleFormData) => { ); } })} - {props.childrenPosi ? props.children ?? props.children : null} + {props.childrenPosi ? null : props.children ?? props.children} ); }; diff --git a/src/components/layout/layout.less b/src/components/layout/layout.less index 03bc6b1..4f43b54 100644 --- a/src/components/layout/layout.less +++ b/src/components/layout/layout.less @@ -29,6 +29,9 @@ align-items: center; justify-content: space-between; } +.ant-menu-submenu-title{ + color: rgba(255, 255, 255, 0.6) !important; +} .loginOut { cursor: pointer; diff --git a/src/pages/dep/index.tsx b/src/pages/dep/index.tsx index b5f3432..6860a09 100644 --- a/src/pages/dep/index.tsx +++ b/src/pages/dep/index.tsx @@ -15,7 +15,6 @@ import SimpleForm from "@/components/form/simple_form"; import React from "react"; import { FormType } from "@/components/form/interface"; import DirectoryTree from "antd/lib/tree/DirectoryTree"; -import { DataNode } from "antd/lib/tree"; const { Option } = Select; const Dep = (props: Store) => { const { depStore } = props; @@ -35,20 +34,20 @@ const Dep = (props: Store) => { setIsModalOpen(true); formRef.current?.setFieldsValue(data); setRecord(data); - setId(record.key); + setId(record.id); }; - const onFinish = (values: any) => { + const onFinish =async (values: any) => { if (!tagId) { - depStore.add(values); + await depStore.add(values); } else { - depStore.putItem(tagId, values); + await depStore.putItem(tagId, values); } - getOrg(); + await getOrg(); setIsModalOpen(false); }; useEffect(() => { - depStore.getlist(); getOrg(); + // eslint-disable-next-line react-hooks/exhaustive-deps }, [depStore]); const getOrg = () => { @@ -123,10 +122,11 @@ const Dep = (props: Store) => { onSelect={onSelect} onExpand={onExpand} treeData={org} - titleRender={(nodeData: DataNode) => { + titleRender={(nodeData: any) => { + console.log(nodeData) return ( <> - {nodeData.title} + {nodeData.dep_name} { @@ -138,8 +138,9 @@ const Dep = (props: Store) => { { - depStore.deleteItem(nodeData.key); - getOrg() + depStore.deleteItem(nodeData.id).then(()=>{ + getOrg() + }); }} > 删除 diff --git a/src/pages/home/home.less b/src/pages/home/home.less index 7580d74..1e0446c 100644 --- a/src/pages/home/home.less +++ b/src/pages/home/home.less @@ -50,11 +50,14 @@ display: flex; align-items: center; justify-content: center; - flex: 5; + flex: 4; .title_img { - margin-left: 10px; width: 20px; height: 20px; + + } + img{ + width: 100px; } .on_to { transform: rotate(-180deg) rotateY(0deg); @@ -121,6 +124,15 @@ opacity: 1; background: rgba(37, 52, 70, 0.4); backdrop-filter: blur(10px); + height: 100%; + } + .map_container_b_check{ + position: absolute; + bottom: 40px; + height: 60px; + width: 100%; + z-index: 1; + text-align: center; } .map_container_b { position: absolute; @@ -151,7 +163,6 @@ .map_video_container { position: absolute; - width: 350px; top: 70px; - right: 300px; + right: calc(20%); } diff --git a/src/pages/home/home.tsx b/src/pages/home/home.tsx index ed4982c..caf0ebd 100644 --- a/src/pages/home/home.tsx +++ b/src/pages/home/home.tsx @@ -10,6 +10,7 @@ import { useNavigate } from "react-router"; import Weather from "./homeLeft/weather"; import Timer from "./homeLeft/timer"; import HomeVideo from "./home_video"; +import HomeCheck from "./home_check"; const Home = observer(() => { const navigate = useNavigate(); @@ -30,7 +31,7 @@ const Home = observer(() => { onClick={() => { navigate("admin/user"); }} - style={{ fontSize: "20px", color: "#f9f9f9", cursor: "pointer" }} + style={{ fontSize: "1rem", color: "#f9f9f9", cursor: "pointer" }} /> @@ -53,6 +54,9 @@ const Home = observer(() => {
+
+ +
diff --git a/src/pages/home/homeBottom/dispath.tsx b/src/pages/home/homeBottom/dispath.tsx index 8662ff1..9127e95 100644 --- a/src/pages/home/homeBottom/dispath.tsx +++ b/src/pages/home/homeBottom/dispath.tsx @@ -98,6 +98,8 @@ const Dispath = (props: Store) => { }; data.task_video = task_videos; trainingStore.add(data).then(()=>{ + console.log("添加成功") + message.error("任务发布成功"); homeStore.getNewTask() }); diff --git a/src/pages/home/homeBottom/home_bottom.tsx b/src/pages/home/homeBottom/home_bottom.tsx index e79d1ea..3ffcd66 100644 --- a/src/pages/home/homeBottom/home_bottom.tsx +++ b/src/pages/home/homeBottom/home_bottom.tsx @@ -3,57 +3,7 @@ import WhichVideo from "./which_video"; import Ec from "./ec"; import Emr from "./emr"; import "./bot.less"; -import { Radio } 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"; - -const HomeBottom = (props: Store) => { - const { homeStore } = props; - const [size, changeSize] = useState("1"); - const handleSizeChange = (e: any) => { - changeSize(e.target.value); - getUlist(e.target.value); - }; - useEffect(() => { - setTimeout(() => { - getUlist("1"); - }, 2000); - }, []); - - const getUlist = (type) => { - let query = {}; - switch (type) { - case "1": - query = { militia: 1 }; - break; - case "2": - query = { grid_officer: 1 }; - break; - case "3": - query = { patrol_brigade: 1 }; - break; - } - let marks = MapUtl.makerList; - if (marks.length) { - marks.forEach((item) => { - item?.marker.remove(); - }); - } - homeStore.getContact(query).then((res) => { - let list = res.data.record; - list.forEach((element) => { - if (!element.lat || !element.long) return; - MapUtl.addMaker({ - lng: element.long, - lat: element.lat, - title: element.user_name, - users: element, - }); - }); - }); - }; +const HomeBottom = () => { return (
@@ -61,16 +11,10 @@ const HomeBottom = (props: Store) => { - {/* 切换marker查看 */} - - 民兵 - 网格员 - 巡防 -
); }; // export default HomeBottom; -export default inject("homeStore")(observer(HomeBottom)); +export default HomeBottom; diff --git a/src/pages/home/homeLeft/timer.tsx b/src/pages/home/homeLeft/timer.tsx index c13827b..cc7c4df 100644 --- a/src/pages/home/homeLeft/timer.tsx +++ b/src/pages/home/homeLeft/timer.tsx @@ -20,7 +20,7 @@ const Timer = () => { clearInterval(tim); }; }, []); - return {times} ; + return {times} ; }; export default Timer; diff --git a/src/pages/home/homeLeft/weather.tsx b/src/pages/home/homeLeft/weather.tsx index 3e91516..7be8d57 100644 --- a/src/pages/home/homeLeft/weather.tsx +++ b/src/pages/home/homeLeft/weather.tsx @@ -21,7 +21,7 @@ const Weather = () => { >
{
{ + const { homeStore } = props; + const [size, changeSize] = useState("1"); + const handleSizeChange = (e: any) => { + changeSize(e.target.value); + getUlist(e.target.value); + }; + useEffect(() => { + setTimeout(() => { + getUlist("1"); + }, 2000); + // eslint-disable-next-line react-hooks/exhaustive-deps + }, []); + + const getUlist = (type) => { + let query = {}; + switch (type) { + case "1": + query = { militia: 1 }; + break; + case "2": + query = { grid_officer: 1 }; + break; + case "3": + query = { patrol_brigade: 1 }; + break; + } + let marks = MapUtl.makerList; + if (marks.length) { + marks.forEach((item) => { + item?.marker.remove(); + }); + } + homeStore.getContact(query).then((res) => { + let list = res.data.record; + list.forEach((element) => { + if (!element.lat || !element.long) return; + MapUtl.addMaker({ + lng: element.long, + lat: element.lat, + title: element.user_name, + users: element, + }); + }); + }); + }; + return ( + + 民兵 + 网格员 + 巡防 + + ); +}; + +// export default HomeBottom; +export default inject("homeStore")(observer(HomeCheck)); diff --git a/src/pages/home/home_video.tsx b/src/pages/home/home_video.tsx index 03b7537..de18f22 100644 --- a/src/pages/home/home_video.tsx +++ b/src/pages/home/home_video.tsx @@ -7,21 +7,17 @@ import "./video.less"; const HomeVideo = (props: Store) => { const { homeStore } = props; const [videoUrls, setVideoUrl] = useState | null>([]); + const [showVideo, setShowVideo] = useState(false); useEffect(() => { - // 获取最新任务 homeStore.getNewTask().then((res) => { setVideoUrl(res); }); - }, [homeStore]); + setShowVideo(homeStore.showVideo); + }, [homeStore, homeStore.showVideo]); return ( -
- {homeStore.showVideo ? ( -
+ <> + {showVideo ? ( +
{videoUrls?.map((videoUrl, index) => { return (
@@ -31,7 +27,7 @@ const HomeVideo = (props: Store) => { })}
) : null} -
+ ); }; diff --git a/src/pages/home/video.tsx b/src/pages/home/video.tsx index 543e720..8da4c52 100644 --- a/src/pages/home/video.tsx +++ b/src/pages/home/video.tsx @@ -1,78 +1,18 @@ -// import { Store } from "antd/es/form/interface"; -// import { useEffect, useRef } from "react"; -// import videojs from "video.js"; -// import "video.js/dist/video-js.css"; - -// const Videos = (props: Store) => { -// const { onReady } = props; -// let videoRef = useRef(null); -// let playerRef = useRef(null); // 使用 any 类型 -// const videoJsOptions = { -// autoplay: true, -// controls: true, -// responsive: true, -// fluid: true, -// sources: [ -// { -// src: "", -// type: "application/x-mpegURL", -// }, -// ], -// }; -// useEffect(() => { -// if (!props.url) return; -// videoJsOptions.sources[0].src = props.url; -// if (!playerRef.current && videoRef.current) { -// const videoElement = document.createElement(`video-js`); -// videoElement.classList.add(`vjs-big-play-centered${props.url}`); -// videoRef.current.appendChild(videoElement); -// const player = (playerRef.current = videojs( -// videoElement, -// videoJsOptions, -// () => { -// videojs.log("player is ready"); -// onReady && onReady(player); -// } -// )); -// } else { -// const player = playerRef.current; -// player?.autoplay(videoJsOptions?.autoplay); -// player.src(videoJsOptions?.sources); -// } -// return () => { -// if (playerRef.current) { -// playerRef.current.dispose(); -// playerRef.current = null; -// } -// }; -// }, [videoRef, onReady, props.url]); - -// return ( -// <> -//
-//
-//
-// -// ); -// }; - -// export default Videos; - -import React, { useEffect, useRef } from 'react'; -import flvjs from 'flv.js'; -import { Store } from 'antd/es/form/interface'; +import React, { useEffect, useRef } from "react"; +import flvjs from "flv.js"; +import { Store } from "antd/es/form/interface"; const VideoPlayer = (props: Store) => { const videoRef = useRef(null); let player: flvjs.Player | null = null; - + useEffect(() => { - if (!props.url)return; + if (!props.url) return; if (flvjs.isSupported()) { const videoElement = videoRef.current; if (videoElement) { player = flvjs.createPlayer({ - type: 'mp4', + type: "mp4", url: props.url, }); player.attachMediaElement(videoElement); @@ -93,15 +33,13 @@ const VideoPlayer = (props: Store) => { }, [props.url]); return ( -
-
+