diff --git a/src/pages/emergency/index.tsx b/src/pages/emergency/index.tsx index 44a0f79..2700a8b 100644 --- a/src/pages/emergency/index.tsx +++ b/src/pages/emergency/index.tsx @@ -19,7 +19,7 @@ import React from "react"; import baseHttp from "@/service/base"; import MinusCircleOutlined from "@ant-design/icons/lib/icons/MinusCircleOutlined"; import { EmConfig } from "./em_column"; - +import TaskArchives from "../training/task_archives"; const Emergency = (props: Store) => { const { emergencyStore } = props; const [isModalOpen, setIsModalOpen] = useState(false); @@ -79,6 +79,7 @@ const Emergency = (props: Store) => { > 删除 + ), }, diff --git a/src/pages/home/home.less b/src/pages/home/home.less index 294e0b3..f609a9c 100644 --- a/src/pages/home/home.less +++ b/src/pages/home/home.less @@ -11,6 +11,27 @@ height: 100%; overflow: hidden; position: relative; + .scr { + position: absolute; + top: 60px; + z-index: 9; + left: 0; + right: 0; + overflow: hidden; + .scrolling-text { + white-space: nowrap; + display: block; + animation: scroll 10s linear infinite; + color: #fff; + > span { + display: inline-block; + animation: scrollText 10s linear infinite; /* 动画 */ + } + :hover >span{ + animation-play-state: paused; + } + } + } .map_container_t { position: absolute; height: 60px; @@ -25,17 +46,20 @@ display: flex; align-items: center; justify-content: space-between; - .map_container_t_l { + .map_container_t_c { display: flex; align-items: center; - flex: 1; + justify-content: center; + flex: 2; .title_img { margin-left: 10px; width: 20px; height: 20px; } + .on_to{ + transform: rotate(-180deg) rotateY(0deg); + } .twp { - width: 160px; height: 30px; } > span { @@ -51,25 +75,24 @@ text-shadow: 0px 0px 10px #29ecb4; } } - - .scr { + .map_container_t_l { flex: 1; - overflow: hidden; - .scrolling-text { - white-space: nowrap; - display: block; - animation: scroll 10s linear infinite; + > span { + margin-left: 15px; + margin-right: 15px; color: #fff; - > span { - display: inline-block; - animation: scrollText 10s linear infinite; /* 动画 */ - } - :hover >span{ - animation-play-state: paused; - } + 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; } } + + .map_container_t_r { flex: 1; text-align: right; diff --git a/src/pages/home/home.tsx b/src/pages/home/home.tsx index 4be2a66..7a04b08 100644 --- a/src/pages/home/home.tsx +++ b/src/pages/home/home.tsx @@ -4,7 +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 image1 from "@/static/title_jiantou@1x.png"; import image2 from "@/static/title_line@1x.png"; import { SettingOutlined } from "@ant-design/icons"; import { useNavigate } from "react-router"; @@ -14,11 +13,23 @@ const Home = observer(() => {
- + 2024年10月20号 +
+
+ 黄水镇武装平台
-
+
+ { + navigate("admin/user"); + }} + style={{ fontSize: "20px", color: "#f9f9f9", cursor: "pointer" }} + /> +
+
+
仓库3,2号货架,单兵装备,即将临期, @@ -27,13 +38,6 @@ const Home = observer(() => {
-
- {navigate("admin/user");}} - style={{ fontSize: "20px", color: "#f9f9f9", cursor: "pointer" }} - /> -
-
diff --git a/src/pages/home/homeLeft/trun_chat_config.ts b/src/pages/home/homeLeft/trun_chat_config.ts new file mode 100644 index 0000000..b25f9b0 --- /dev/null +++ b/src/pages/home/homeLeft/trun_chat_config.ts @@ -0,0 +1,42 @@ +import * as echarts from "echarts"; + +export const trunEchatConfig = (data) => { + return { + 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)", + }, + ]), + }, + }, + ], + }; +} \ No newline at end of file diff --git a/src/pages/home/homeLeft/turn.tsx b/src/pages/home/homeLeft/turn.tsx index 6c5a0eb..ac0cc48 100644 --- a/src/pages/home/homeLeft/turn.tsx +++ b/src/pages/home/homeLeft/turn.tsx @@ -4,59 +4,48 @@ import { inject, observer } from "mobx-react"; import { useEffect, useState } from "react"; import "./left.less"; import { Col, Modal, Row } from "antd"; +import { trunEchatConfig } from "./trun_chat_config"; const Turn = (props: Store) => { - const { homeStore } = props; + const { homeStore, trainingStore, folderStore } = props; const [isModalOpen, setisModalOpen] = useState(false); + const [folderList, setfolderList] = useState([]); + const [imageList, setImageList] = useState([]); + const [imageUrl, setImageUrl] = useState([]); + 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); + trunEchatConfig(data) && myChart.setOption(trunEchatConfig(data)); }; + useEffect(() => { homeStore.getTr().then((res) => { initChart(res.data.record); }); }, [homeStore]); + + useEffect(() => { + trainingStore.getlist(); + }, [trainingStore]); const trunHandler = () => { setisModalOpen(true); }; + const getFolderhandler = (id: string) => { + // trainingStore.getlist(); + folderStore?.getFolderList(id).then((res) => { + setfolderList(res?.data?.record ?? []); + }); + }; + const getAehandler = async (id: string) => { + // trainingStore.getlist(); + await folderStore?.getAlist(id).then(() => { + folderStore.alist?.forEach((elem) => { + elem.url = elem.file_url; + elem.name = elem.file_name; + }); + setImageList(folderStore.alist ?? []); + }); + }; + return ( <>
{ > <> - - {[7, 8, 9, 10, 11].map((item, index) => { - return ( -
- -
- ); - })} + +
+

任务列表

+ {trainingStore.list?.map((item) => { + return ( +

{ + getFolderhandler(item.archives_category_identity); + }} + > + {item.title} +

+ ); + })} +
- -
- +
+

文件夹列表

+ {folderList?.map((item) => { + return ( +

{ + getAehandler(item.identity); + }} + > + {item.folder_name} +

+ ); + })} +
+ + +
+

档案列表

+ {imageList?.map((item) => { + return ( + { + setImageUrl(item.file_url) + }} + style={{ width: "80px", height: "80px" }} + src={item.file_url} alt="" /> -
+ ); + })} +
+ + +
+ +
@@ -107,4 +130,8 @@ const Turn = (props: Store) => { ); }; -export default inject("homeStore")(observer(Turn)); +export default inject( + "homeStore", + "trainingStore", + "folderStore" +)(observer(Turn)); diff --git a/src/pages/training/training.tsx b/src/pages/training/training.tsx index 0b61b9d..91a7257 100644 --- a/src/pages/training/training.tsx +++ b/src/pages/training/training.tsx @@ -81,16 +81,6 @@ const Trainings = (props: Store) => { 训练人员管理 - {/* */}