Browse Source

样式还原度修改

citygis-lhh 2 days ago
parent
commit
d084691a22

+ 121 - 80
src/views/index.vue

@@ -3,15 +3,29 @@
     <Map />
     <!-- 头部 -->
     <div class="home_container_header">
-      <div class="home_container_header-left" :class="{ home_left_bg_max: commonStore.activeIndex === 1 }">
+      <div
+        class="home_container_header-left"
+        :class="{ home_left_bg_max: commonStore.activeIndex === 1 }"
+      >
         <div class="home_container_header-left_time">
           <!-- <img class="time_icon" src="../assets/img/risk_info_icon-1.png" alt="" />
           <div class="clock">{{ currentTime }}</div> -->
         </div>
         <div class="home_container_header-left_tab">
           <div class="button-container">
-            <div v-for="(item, index) in buttons" :key="index" class="parallelogram-button" :class="{ highlight: commonStore.activeIndex === index }" @click="setActive(index, item)">
-              <div class="text-container" :class="{ 'text-container-highlight': commonStore.activeIndex === index }">
+            <div
+              v-for="(item, index) in buttons"
+              :key="index"
+              class="parallelogram-button"
+              :class="{ highlight: commonStore.activeIndex === index }"
+              @click="setActive(index, item)"
+            >
+              <div
+                class="text-container"
+                :class="{
+                  'text-container-highlight': commonStore.activeIndex === index,
+                }"
+              >
                 {{ item.title }}
               </div>
             </div>
@@ -29,105 +43,132 @@
       </div>
     </div>
     <!-- 两侧 -->
-    <div class="home_content_left" :class="{ home_left_bg_max: commonStore.activeIndex === 1 }">
+    <div
+      class="home_content_left"
+      :class="{ home_left_bg_max: commonStore.activeIndex === 1 }"
+    >
       <LeftPage :activeIndex="activeIndex" class="left_page"></LeftPage>
     </div>
-    <div class="home_content_right" :class="{ home_right_bg_max: commonStore.activeIndex === 1 && !rightPanelStore.emergencyVisible }">
+    <div
+      class="home_content_right"
+      :class="{
+        home_right_bg_max:
+          commonStore.activeIndex === 1 && !rightPanelStore.emergencyVisible,
+      }"
+    >
       <RightPage :activeIndex="activeIndex" class="right_page"></RightPage>
     </div>
     <!-- 底部片区图层按钮 -->
     <AreaLayerSwitch></AreaLayerSwitch>
 
     <!-- 提示框 -->
-    <MyAlert v-if="commonStore.showAlert" :message="commonStore.alertMessage" :duration="3" :onClose="() => (commonStore.showAlert = false)"></MyAlert>
+    <MyAlert
+      v-if="commonStore.showAlert"
+      :message="commonStore.alertMessage"
+      :duration="3"
+      :onClose="() => (commonStore.showAlert = false)"
+    ></MyAlert>
 
     <VideoCallView
       v-if="rightPanelStore.videoCallVisible2"
       class="video_call_po"
       :class="{
-        'right-dialog-max': commonStore.activeTools['图例']
+        'right-dialog-max': commonStore.activeTools['图例'],
       }"
     ></VideoCallView>
   </div>
 </template>
 <script setup>
-import VideoCallView from '@/views/right/components/handleProcess/comp/VideoCallView.vue'
-import MyAlert from '../components/MyAlert/index'
-import AreaLayerSwitch from '../components/AreaLayerSwitch/index'
-import LeftPage from './left/index.vue'
-import RightPage from './right/index.vue'
-import Map from '@/components/Map.vue'
-import { storeToRefs } from 'pinia'
-import { useUserStore } from '../store/user'
-import { useCommonStore } from '../store/common.js'
-import { ref, reactive, toRefs, onBeforeMount, onMounted, onUnmounted, watch } from 'vue'
-import { useRiskTableStore } from '@/store/riskTable.js'
-import { handleJtlxPoints, handleRiskStatistic, handleXcczPoints, initDistrict } from '@/utils/map/baseMethod.js'
-import { useRightPanelStore } from '@/store/rightPanel.js'
-import { useEventInteractionStore } from '@/store/eventInteraction.js'
-let userStore = useUserStore()
-let commonStore = useCommonStore()
-let riskTableStore = useRiskTableStore()
-const rightPanelStore = useRightPanelStore()
-const eventInteractionStore = useEventInteractionStore()
-
-console.log(userStore, 'useUserStore')
-let { name, age } = storeToRefs(userStore)
-const currentTime = ref('')
+import VideoCallView from "@/views/right/components/handleProcess/comp/VideoCallView.vue";
+import MyAlert from "../components/MyAlert/index";
+import AreaLayerSwitch from "../components/AreaLayerSwitch/index";
+import LeftPage from "./left/index.vue";
+import RightPage from "./right/index.vue";
+import Map from "@/components/Map.vue";
+import { storeToRefs } from "pinia";
+import { useUserStore } from "../store/user";
+import { useCommonStore } from "../store/common.js";
+import {
+  ref,
+  reactive,
+  toRefs,
+  onBeforeMount,
+  onMounted,
+  onUnmounted,
+  watch,
+} from "vue";
+import { useRiskTableStore } from "@/store/riskTable.js";
+import {
+  handleJtlxPoints,
+  handleRiskStatistic,
+  handleXcczPoints,
+  initDistrict,
+} from "@/utils/map/baseMethod.js";
+import { useRightPanelStore } from "@/store/rightPanel.js";
+import { useEventInteractionStore } from "@/store/eventInteraction.js";
+let userStore = useUserStore();
+let commonStore = useCommonStore();
+let riskTableStore = useRiskTableStore();
+const rightPanelStore = useRightPanelStore();
+const eventInteractionStore = useEventInteractionStore();
+
+console.log(userStore, "useUserStore");
+let { name, age } = storeToRefs(userStore);
+const currentTime = ref("");
 // 更新当前时间的函数
 const updateTime = () => {
-  const now = new Date()
+  const now = new Date();
 
   // 格式化为 2025-02-25 10:39:05
-  const year = now.getFullYear()
-  const month = String(now.getMonth() + 1).padStart(2, '0') // 月份从 0 开始,需加 1
-  const day = String(now.getDate()).padStart(2, '0')
-  const hours = String(now.getHours()).padStart(2, '0')
-  const minutes = String(now.getMinutes()).padStart(2, '0')
-  const seconds = String(now.getSeconds()).padStart(2, '0')
-
-  currentTime.value = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
-}
+  const year = now.getFullYear();
+  const month = String(now.getMonth() + 1).padStart(2, "0"); // 月份从 0 开始,需加 1
+  const day = String(now.getDate()).padStart(2, "0");
+  const hours = String(now.getHours()).padStart(2, "0");
+  const minutes = String(now.getMinutes()).padStart(2, "0");
+  const seconds = String(now.getSeconds()).padStart(2, "0");
+
+  currentTime.value = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
+};
 // 设置定时器每秒更新一次
-let timer
+let timer;
 onMounted(() => {
-  updateTime() // 初始化时更新时间
-  timer = setInterval(updateTime, 1000) // 每秒更新
-  activeIndex.value = commonStore.getActiveIndex()
-})
+  updateTime(); // 初始化时更新时间
+  timer = setInterval(updateTime, 1000); // 每秒更新
+  activeIndex.value = commonStore.getActiveIndex();
+});
 
 // 清理定时器
 onUnmounted(() => {
-  clearInterval(timer)
-})
+  clearInterval(timer);
+});
 
 let buttons = ref([
-  { id: 0, title: '报告处置', active: true },
-  { id: 1, title: '处置进展', active: false }
-])
-let activeIndex = ref(0) // 存储当前高亮按钮的索引
+  { id: 0, title: "报告处置", active: true },
+  { id: 1, title: "处置进展", active: false },
+]);
+let activeIndex = ref(0); // 存储当前高亮按钮的索引
 
 function setActive(index, item) {
   if (commonStore.activeIndex === index) {
-    return
+    return;
   }
   // 切换高亮按钮,点击时高亮切换
-  activeIndex.value = index
-  commonStore.setActiveIndex(index)
-  riskTableStore.setCurrentBackground(1)
+  activeIndex.value = index;
+  commonStore.setActiveIndex(index);
+  riskTableStore.setCurrentBackground(1);
   if (index === 0) {
-    if (eventInteractionStore.mapType === 'china') {
-      eventInteractionStore.mapType = 'shanghai'
-      commonStore.areaLayerSwitchActive = '上海市'
+    if (eventInteractionStore.mapType === "china") {
+      eventInteractionStore.mapType = "shanghai";
+      commonStore.areaLayerSwitchActive = "上海市";
     } else {
-      initDistrict()
+      initDistrict();
     }
-    commonStore.activeModuleTime = '年'
-    commonStore.activeModule = '风险总览'
+    commonStore.activeModuleTime = "年";
+    commonStore.activeModule = "风险总览";
   } else {
-    commonStore.activeModuleTime = ''
-    commonStore.activeModule = ''
-    commonStore.riskTableItem = commonStore.tableData[0]
+    commonStore.activeModuleTime = "";
+    commonStore.activeModule = "";
+    commonStore.riskTableItem = commonStore.tableData[0];
   }
   // handleJtlxPoints(index === 0)
 }
@@ -135,17 +176,17 @@ function setActive(index, item) {
 watch(
   () => commonStore.activeModule,
   (val, oldVal) => {
-    rightPanelStore.riskLevelList.forEach(item => {
-      item.value = true
-    })
-    rightPanelStore.riskTypeSelect = ['A', 'B', 'C', 'D']
-    handleRiskStatistic(false)
+    rightPanelStore.riskLevelList.forEach((item) => {
+      item.value = true;
+    });
+    rightPanelStore.riskTypeSelect = ["A", "B", "C", "D"];
+    handleRiskStatistic(false);
     // commonStore.areaLayerSwitchActive = val
-    if (oldVal === '现场处置视频') {
-      handleXcczPoints(false)
+    if (oldVal === "现场处置视频") {
+      handleXcczPoints(false);
     }
   }
-)
+);
 </script>
 <style lang="scss" scoped>
 .home_container {
@@ -292,6 +333,8 @@ watch(
     height: 100px;
     display: flex;
     align-items: center;
+    justify-content: flex-end;
+    padding-right: 40px;
     border-radius: 10px 30px 0 0;
     // background: rgba(0, 21, 51, 0.7);
     z-index: 0;
@@ -306,7 +349,7 @@ watch(
       .icon-img {
         width: 40px;
         height: 40px;
-        background-image: url('../assets/img/通讯录@2x.png');
+        background-image: url("../assets/img/通讯录@2x.png");
         background-size: 100% 100%;
       }
 
@@ -333,7 +376,7 @@ watch(
     .duoyun {
       width: 35px;
       height: 35px;
-      background-image: url('../assets/img/多云.png');
+      background-image: url("../assets/img/多云.png");
       background-size: 100% 100%;
     }
 
@@ -362,7 +405,7 @@ watch(
   height: 988px;
   z-index: 0;
   // background: url('../assets/img/left_bg (2).png') no-repeat;
-  background: url('../assets/img/左背景_2.png') no-repeat;
+  background: url("../assets/img/左背景_2.png") no-repeat;
   background-size: 100% 100%;
 
   // background-color: rgba(242, 17, 10, 0.7);
@@ -386,11 +429,9 @@ watch(
   top: 90px;
   width: 1240px;
   height: 988px;
-  // background: rgba(0, 21, 51, 0.7);
-  // background: url('../assets/img/right_bg (2).png') no-repeat;
-  // background: url('../assets/img/Frame 2136636887.png') no-repeat;
-  background: url('../assets/img/右背景_2.png') no-repeat;
-  background-size: 100% 100%;
+  background-image: url("../assets/img/右背景_2.png");
+  background-size: 100% calc(100% + 30px);
+  background-position-y: -65px;
   // z-index: 0;
   .right_page {
     position: absolute;

+ 0 - 3
src/views/right/components/handleProcess/index.vue

@@ -601,9 +601,6 @@ onMounted(() => {
   top: 160px;
   right: 620px;
 }
-.right-legend-max {
-  right: 1180px;
-}
 .right-dialog-max {
   right: 1420px;
 }

+ 5 - 5
src/views/right/components/reportHandle/comp/publicHealthRiskReport.vue

@@ -41,11 +41,11 @@
         </div>
         <div class="echart-legend">
           <div class="content">
-            <div class="icon-item" style="background: #ffd15c"></div>
-            上一年报告数
+            <div class="icon-item" style="background: #53e2ad"></div>
+            风险报告数
           </div>
           <!-- <div class="content">
-            <div class="icon-item" style="background: #53e2ad"></div>
+            <div class="icon-item" style="background: #ffd15c"></div>
             上一年报告数
           </div> -->
         </div>
@@ -130,7 +130,7 @@ const riskTypeList = [
   },
 ];
 
-const riskLevel = ref(["A"]);
+const riskLevel = ref(["A", "B", "C","D"]);
 const riskType = ref(["风险个案"]);
 //选择级别
 const handleRiskLevel = (item) => {
@@ -155,7 +155,7 @@ const handleRiskTypeClick = (item) => {
 };
 
 //突发
-const tufaLevel = ref(false);
+const tufaLevel = ref(true);
 
 //点击图标弹出公共卫生风险健康报告弹窗
 const openPublicHealthDialog = (item) => {

+ 1 - 1
src/views/right/components/reportHandle/index.vue

@@ -196,7 +196,7 @@ function setActiveModule(module) {
     .risk-assetsment-left,
     .risk-assetsment-right {
       width: 50%;
-      padding: 10px 5px;
+      padding: 10px 0px;
     }
   }
   .risk-assets-bottom {

+ 2 - 2
src/views/right/index.vue

@@ -71,11 +71,11 @@ const hotCurrentTime = computed(() => {
 }
 .right-legend {
   position: fixed;
-  top: 205px;
+  top: 175px;
   right: 620px;
 }
 .right-legend-max {
-  right: 1180px;
+  right: 1228px;
 }
 .right-dialog-max {
   right: 1420px;