201 lines
4.8 KiB
Vue
201 lines
4.8 KiB
Vue
<template>
|
|
<div class="homeBox">
|
|
<!-- <GdMap></GdMap> -->
|
|
<!-- 头部 -->
|
|
|
|
<Head></Head>
|
|
<!-- 内容 -->
|
|
<!-- 左边 -->
|
|
<div class="home-aside asideL">
|
|
<div class="asideL-top">
|
|
<DbCount></DbCount>
|
|
</div>
|
|
<div class="asideL-Bottom">
|
|
<div class="commom-aside">
|
|
<QbsbCount></QbsbCount>
|
|
</div>
|
|
<div class="commom-aside">
|
|
<QblyType></QblyType>
|
|
</div>
|
|
<div class="commom-aside">
|
|
<QbfkCount></QbfkCount>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- 右边 -->
|
|
<div class="home-aside asideR">
|
|
<div class="commom-aside-big">
|
|
<SituationAssessment />
|
|
</div>
|
|
<div class="commom-aside-big">
|
|
<GroupWarning />
|
|
</div>
|
|
<div class="commom-aside-small">
|
|
<Experience />
|
|
</div>
|
|
</div>
|
|
<!-- 中间 -->
|
|
<div class="home-center">
|
|
<div class="middle-top">
|
|
<Yszs />
|
|
</div>
|
|
<div class="flex middle-bottom mt10">
|
|
<div class="mr10" style="width: 50%;">
|
|
<DeployControl />
|
|
</div>
|
|
<div class="flex-1" style="flex: 1;">
|
|
<ZdryWarning />
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<!-- 底部 -->
|
|
<div class="home-foot-t">
|
|
<Bkcz></Bkcz>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 左边弹窗 -->
|
|
<LeftDialog></LeftDialog>
|
|
|
|
<Fxq :initial-position="{ x: position.x, y: position.y }">
|
|
<el-badge value="0" class="item badge-top-left">
|
|
<div class='fxq fxq1'>
|
|
<div class="title" @click.stop="opneMsg('xtxx')"> <img src="@/assets/images/xtxx.png" /> 系统消息</div>
|
|
</div>
|
|
</el-badge>
|
|
<!-- <div class='fxq fxq2'>
|
|
<div class="title" @click.stop="opneMsg('tztg')"> <img src="@/assets/images/tztg.png" /> 通知通报</div>
|
|
</div>
|
|
<div class='fxq fxq3'>
|
|
<div class="title"> <img src="@/assets/images/xxxt.png" /> 消息协同</div>
|
|
</div> -->
|
|
</Fxq>
|
|
<Information v-model='showDialog' :title='title'>
|
|
<systemMessages :dict="{ BD_D_XXLX, BD_D_XXLY }" :idEntityCard='idEntityCard' :xxlx="showMsgLx" />
|
|
</Information>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, getCurrentInstance, reactive } from 'vue'
|
|
import LeftDialog from './dialog/leftDialog'
|
|
import GdMap from "@/components/GdMap/index.vue";
|
|
import Head from './layout/head.vue'
|
|
import DbCount from './model/dbCount.vue'
|
|
import QbfkCount from './model/qbfkCount.vue'
|
|
import QbsbCount from './model/qbsbCount.vue'
|
|
import QblyType from './model/qblyType.vue'
|
|
import Bkcz from './model/bkcz.vue'
|
|
import ZdryWarning from './model/zdryWarning.vue'
|
|
import GroupWarning from './model/groupWarning.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 Fxq from './model/fxq.vue'
|
|
import Information from './model/information.vue'
|
|
import systemMessages from './model/mesgSwitch/systemMessages.vue'
|
|
import { getItem } from '@/utils/storage.js'
|
|
import { queryXxTj} from '@/api/commit.js'
|
|
const { proxy } = getCurrentInstance();
|
|
const { BD_D_XXLX, BD_D_XXLY } = proxy.$dict('BD_D_XXLX', 'BD_D_XXLY'); //获取字典数据
|
|
const idEntityCard = getItem('idEntityCard')
|
|
const position = reactive({
|
|
x: window.innerWidth - 120,
|
|
y: window.innerHeight - 100
|
|
})
|
|
|
|
//消息
|
|
const title = ref('系统消息')
|
|
const showDialog = ref(false)
|
|
const showMsgLx = ref('')
|
|
const opneMsg = (val) => {
|
|
showDialog.value = true
|
|
showMsgLx.value = val
|
|
switch (val) {
|
|
case 'xtxx':
|
|
title.value = '系统消息'
|
|
break;
|
|
case 'tztg':
|
|
title.value = '通知通告'
|
|
break;
|
|
case 'xxxt':
|
|
title.value = '消息协同'
|
|
break;
|
|
|
|
}
|
|
}
|
|
const queryXxTjList = () => {
|
|
queryXxTj({}).then((res) => {
|
|
console.log(res);
|
|
|
|
}).catch((err) => {
|
|
|
|
});
|
|
}
|
|
queryXxTjList()
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
@import "@/assets/css/homeScreen.scss";
|
|
|
|
.fxq {
|
|
border-radius: 35px;
|
|
width: 35px;
|
|
transition: transform 0.5s ease, width 0.5s ease;
|
|
background-color: rgb(1, 127, 245);
|
|
transform-origin: left center;
|
|
overflow: hidden;
|
|
margin-bottom: 10px;
|
|
|
|
.icon {
|
|
display: flex;
|
|
align-items: center;
|
|
width: 35px;
|
|
height: 35px;
|
|
justify-content: center;
|
|
line-height: 35px;
|
|
font-size: 30px;
|
|
}
|
|
|
|
.title {
|
|
height: 35px;
|
|
line-height: 35px;
|
|
|
|
img {
|
|
margin-left: 9.5px;
|
|
width: 16px;
|
|
margin-right: 10px;
|
|
margin-top: -3px;
|
|
vertical-align: middle;
|
|
height: 16px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.fxq2 {
|
|
background-color: #9d88f9;
|
|
}
|
|
|
|
.fxq1:hover {
|
|
width: 120px;
|
|
}
|
|
|
|
.fxq2:hover {
|
|
width: 120px;
|
|
|
|
// background-color: red;
|
|
}
|
|
|
|
.fxq3:hover {
|
|
width: 120px;
|
|
}
|
|
|
|
::v-deep .badge-top-left .el-badge__content {
|
|
top: 0;
|
|
right: auto;
|
|
left: -10px;
|
|
transform: translateY(-50%) translateX(-50%);
|
|
}
|
|
</style>
|