zy_oyj/sgxt_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

lcw

Browse Source
This commit is contained in:
lcw
2025-11-22 21:59:58 +08:00
parent ea3022c3f6
commit 93c49dff27
661 changed files with 195357 additions and 2160 deletions
Download Patch File Download Diff File Expand all files Collapse all files

180
src/views/home/index.vue
View File

@ -1,12 +1,11 @@
<template>
<div class="homeBox">
<div class="homeBox" style="background-color: #07274d;">
<!-- 头部 -->
<Head></Head>
<!-- 左边 -->
<div class="home-aside asideL">
<div class="asideL-top">
<DbCount></DbCount>
</div>
<div class="asideL-Bottom">
@ -14,11 +13,21 @@
<QbsbCount></QbsbCount>
</div>
<div class="commom-aside">
<QblyType></QblyType>
<KeyPpersonneltypes />
</div>
<div class="commom-aside">
<!-- <GroupWarning /> -->
<TextType></TextType>
<div class="commom-aside" @mouseenter="mouseEnter" @mouseleave="mouseLeave"
style="position: relative; height: 100%; overflow: hidden;">
<!-- <GroupWarning /> -->
<div style="position: relative; height: 100%;">
<transition name="flip" mode="out-in">
<div :key="'qb'" v-if="reversalPushShow" class="flip-wrapper">
<QblyType @reversalPush="reversalPush"></QblyType>
</div>
<div :key="'text'" v-else class="flip-wrapper">
<TextType @reversalPush="reversalPush"></TextType>
</div>
</transition>
</div>
<!-- <QbfkCount></QbfkCount> -->
</div>
</div>
@ -29,11 +38,11 @@
<Calendar />
</div>
<div class="commom-aside-big">
<Experience />
<Experience />
</div>
<div class="commom-aside-small">
<SituationAssessment />
<!-- <SituationAssessment /> -->
<Judgment />
</div>
</div>
<!-- 中间 -->
@ -48,13 +57,27 @@
<div class="flex-1" style="width: 340px;position: absolute;z-index: 100;right: 0;">
<DeployControl />
</div>
<!-- <div class="mr10" style="width: 30%;"><DeployControl /></div> -->
<!-- <div class="flex-1" style="flex: 1;"><ZdryWarning /></div> -->
<!-- <div class="flex-1" style="width: 340px;position: absolute;z-index: 100;left: 0;">
<div style="background-color: #07274d; height: 100px;">
生份证："xxxxxxxx"
</div>
</div> -->
<div class="flex-1" style="width: 340px;position: absolute;z-index: 100;left: 0;top: 30%;">
<GeneralWindow />
</div>
</div>
</div>
<!-- 底部 -->
<div class="home-foot-t">
<Bkcz></Bkcz>
<div style="width: 33%;">
<WarningDistrict></WarningDistrict>
</div>
<div style="width: 33%;">
<WarningLevels></WarningLevels>
</div>
<div style="width: 33%;">
<Bkcz></Bkcz>
</div>
</div>
</div>
<!-- 左边弹窗 -->
@ -63,7 +86,7 @@
</template>
<script setup>
import { ref, getCurrentInstance, reactive, onMounted } from 'vue'
import { ref, getCurrentInstance, reactive, onMounted, onUnmounted } from 'vue'
import LeftDialog from './dialog/leftDialog'
import GdMap from "@/components/GdMap/index.vue";
import Head from './layout/head.vue'
@ -72,20 +95,21 @@ import QbsbCount from './model/qbsbCount.vue'
import QblyType from './model/qblyType.vue'
import TextType from './model/textType.vue'
import Bkcz from './model/bkcz.vue'
import GroupWarning from './model/groupWarning.vue'
import WarningLevels from './model/warningLevels.vue'
import Yszs from './model/yszs.vue'
import DeployControl from './model/deployControl.vue';
import SituationAssessment from './model/situationAssessment.vue'
import Experience from './model/experience.vue'
import Calendar from './model/calendar.vue'
import { getItem, setItem} from "@/utils/storage";
import KeyPpersonneltypes from './model/keyPpersonneltypes.vue'
import WarningDistrict from './model/WarningDistrict.vue'
import { getItem, setItem } from "@/utils/storage";
import emitter from "@/utils/eventBus.js";
import { bm ,centralPoint} from '@/views/backOfficeSystem/IntelligentControl/DeploymentArea/xzqh.js'
import SwitchSysDialog from '@/components/SwitchSysDialog.vue'
const changeXzqh = (val,trg) => {
import { bm, centralPoint } from '@/views/backOfficeSystem/IntelligentControl/DeploymentArea/xzqh.js'
import Judgment from './model/judgment.vue'
import { tbYjxxGetList } from '@/api/zdr.js'
import GeneralWindow from './model/generalWindow.vue'
const changeXzqh = (val, trg) => {
setTimeout(() => {
// 先移除已有的边界
emitter.emit('removeBj')
@ -141,7 +165,7 @@ const getDepId = () => {
const deptCode = deptId[0].deptCode ? deptId[0].deptCode : null
if (deptLevel.startsWith('2')) {
const data = Object.values(bm).map(item => item);
changeXzqh(data,true)
changeXzqh(data, true)
} else {
switch (deptCode) {
case '54040200000'://巴宜区
@ -159,30 +183,96 @@ const getDepId = () => {
case '54042600000'://朗县
changeXzqh(bm[542627])
break;
case '54042200000'://米林县
case '54042200000'://米林县
changeXzqh(bm[542623])
break;
case '54042300000'://墨脱县
case '54042300000'://墨脱县
changeXzqh(bm[542624])
break;
default:
const data = Object.values(bm).map(item => item);
changeXzqh(data,true)
const data = Object.values(bm).map(item => item);
changeXzqh(data, true)
break;
}
}
}
}
const makerCenter = () => {
const dw = require("@/assets/point/dingwei.png")
const dw = require("@/assets/point/dingwei.png")
const coords = centralPoint.map(item => {
return { jd: item.point[0], wd: item.point[1], jzMc: item.name }
})
emitter.emit("addPointArea", { coords, icon: dw, flag: "hm", size: '14px', showTitle: true, offset: [0, -25] });
}
const timeRef = ref('')
let bj=ref(0)
// 布控预警上图
const getTbYjxxGetList = () => {
tbYjxxGetList().then(res => {
const coords = res.map(item => {
return {
id: item.id,
jd: item.jd,
wd: item.wd,
yjtp: item.yjTp,
yjnr: item.yjNr,
yjLx: item.yjlx,
yjlx: '01',
yjsj: item.yjSj,
rysfzh: item.yjRysfzh,
ryxm: item.yjRyxm,
}
})
if (timeRef.value != coords[0].yjsj&&bj.value==1) {
const icons = require("@/assets/point/jq.png")
emitter.emit('addPointArea', { coords: [{ jd: coords[0].jd, wd: coords[0].wd }], icon: icons, flag: 'yjs' })
emitter.emit('yjDetail', coords[0])
timeRef.value = coords[0].yjsj
}
bj.value=1
const icon = require("@/assets/point/yj.png")
emitter.emit('addPoint', { coords: coords, icon: icon, flag: 'yj', fontColor: '#FF0000' })
})
}
let timing = ref(true)
onMounted(() => {
getDepId()
makerCenter()
mouseLeave()
getTbYjxxGetList()
})
const timer = setInterval(() => {
getTbYjxxGetList()
}, 60000)
const reversalPushShow = ref(true)
const reversalPush = () => {
reversalPushShow.value = !reversalPushShow.value
// 移除clearInterval调用，避免定时器被清除
}
// 鼠标移入
const mouseEnter = () => {
clearInterval(timing.value)
}
// 鼠标移出
const mouseLeave = () => {
// 清除可能存在的旧定时器，避免多个定时器同时运行
clearInterval(timing.value)
// 设置为5秒自动切换，更容易测试效果
timing.value = setInterval(() => {
reversalPush()
}, 30000)
}
onUnmounted(() => {
clearInterval(timing.value)
clearInterval(timer)
})
@ -281,4 +371,38 @@ onMounted(() => {
align-items: center;
}
.home-foot-t {
display: flex;
}
/* Vue 过渡动画 - 翻转效果 */
.flip-enter-active,
.flip-leave-active {
transition: transform 0.6s ease, opacity 0.6s ease;
transform-style: preserve-3d;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.flip-enter-from {
transform: rotateY(90deg) translateZ(0);
opacity: 0;
}
.flip-leave-to {
transform: rotateY(-90deg) translateZ(0);
opacity: 0;
}
/* 包装层样式 */
.flip-wrapper {
position: relative;
width: 100%;
height: calc(100%/3 - 8px);
backface-visibility: hidden;
perspective: 1000px;
}
</style>