<template>
|
<div class="content">
|
<div class="container" id="moved">
|
<el-menu
|
default-active="2"
|
:unique-opened="true"
|
@select="handleSelect"
|
class="el-menu-vertical-demo"
|
>
|
<el-submenu index="1">
|
<template slot="title">
|
<i class="el-icon-location"></i>
|
<span>频谱态势分析</span>
|
</template>
|
<el-menu-item-group>
|
<el-menu-item index="1-1">动态播放</el-menu-item>
|
<el-menu-item index="1-2">态势比对</el-menu-item>
|
<el-menu-item index="1-3">态势分析</el-menu-item>
|
</el-menu-item-group>
|
</el-submenu>
|
<el-submenu index="2">
|
<template slot="title">
|
<i class="el-icon-location"></i>
|
<span>频谱使用评估</span>
|
</template>
|
<el-menu-item-group>
|
<el-menu-item index="2-1">用频合规分析</el-menu-item>
|
<el-menu-item index="2-2">空闲频率资源分析</el-menu-item>
|
<el-menu-item index="2-3">信号覆盖率分析</el-menu-item>
|
<el-menu-item index="2-4">用频密度分析</el-menu-item>
|
<el-menu-item index="2-5">频段占用度分析</el-menu-item>
|
<el-menu-item index="2-6">频谱占用度分析</el-menu-item>
|
</el-menu-item-group>
|
</el-submenu>
|
<el-submenu index="3">
|
<template slot="title">
|
<i class="el-icon-location"></i>
|
<span>覆盖能力评估</span>
|
</template>
|
<el-menu-item-group>
|
<el-menu-item index="3-1">监测网覆盖能力评估</el-menu-item>
|
<el-menu-item index="3-2">监测站覆盖能力评估</el-menu-item>
|
<el-menu-item index="3-3">场强覆盖评估(多选)</el-menu-item>
|
<el-menu-item index="3-4">场强覆盖评估</el-menu-item>
|
</el-menu-item-group>
|
</el-submenu>
|
<el-submenu index="4">
|
<template slot="title">
|
<i class="el-icon-location"></i>
|
<span>数据管理</span>
|
</template>
|
<el-menu-item-group>
|
<el-menu-item index="4-1">测试台站管理</el-menu-item>
|
<el-menu-item index="4-2">监测站管理</el-menu-item>
|
<el-menu-item index="4-3">台站管理</el-menu-item>
|
<el-menu-item index="4-4">移动监测数据回放</el-menu-item>
|
<el-menu-item index="4-5">固定监测数据回放</el-menu-item>
|
</el-menu-item-group>
|
</el-submenu>
|
<el-submenu index="5">
|
<template slot="title">
|
<i class="el-icon-location"></i>
|
<span>报告库</span>
|
</template>
|
<el-menu-item-group>
|
<el-menu-item index="5-1">数据分析报告</el-menu-item>
|
</el-menu-item-group>
|
</el-submenu>
|
<el-submenu index="6">
|
<template slot="title">
|
<i class="el-icon-location"></i>
|
<span>数据资源管理子系统</span>
|
</template>
|
<el-menu-item-group>
|
<el-menu-item index="6-1">通用模版管理</el-menu-item>
|
<el-menu-item index="6-2">通信资源管理</el-menu-item>
|
<el-menu-item index="6-3">通信网系管理</el-menu-item>
|
<el-menu-item index="6-4">通信想定管理</el-menu-item>
|
<el-menu-item index="6-5">多媒体素材管理</el-menu-item>
|
<el-menu-item index="6-6">仿真模型管理</el-menu-item>
|
<el-menu-item index="6-7">用户管理和系统设置</el-menu-item>
|
</el-menu-item-group>
|
</el-submenu>
|
<el-submenu index="7">
|
<template slot="title">
|
<i class="el-icon-location"></i>
|
<span>综合态势显示子系统</span>
|
</template>
|
<el-menu-item-group>
|
<el-menu-item index="7-1">zcTS\筹划步骤</el-menu-item>
|
<el-submenu index="7-2">
|
<template slot="title">ZC环境显示</template>
|
<el-menu-item index="7-2-1">东南沿海、TD</el-menu-item>
|
</el-submenu>
|
<el-submenu index="7-3">
|
<template slot="title">通信态势显示</template>
|
<el-menu-item index="7-3-1">基站、监测站</el-menu-item>
|
</el-submenu>
|
<el-menu-item index="7-4">信息链路显示</el-menu-item>
|
<el-menu-item index="7-5">作战态势显示</el-menu-item>
|
<el-menu-item index="7-6">想定资料显示</el-menu-item>
|
<el-menu-item index="7-7">态势显示控制</el-menu-item>
|
<el-menu-item index="7-8">多媒体素材浏览</el-menu-item>
|
<el-menu-item index="7-9">态势标绘</el-menu-item>
|
</el-menu-item-group>
|
</el-submenu>
|
<el-submenu index="8">
|
<template slot="title">
|
<i class="el-icon-location"></i>
|
<span>通信方案筹划子系统</span>
|
</template>
|
<el-menu-item-group>
|
<el-menu-item index="8-1">通信方案管理</el-menu-item>
|
<el-menu-item index="8-2">通信方案拟制</el-menu-item>
|
<el-menu-item index="8-3">通信网系构建</el-menu-item>
|
<el-menu-item index="8-4">通信方案讲评</el-menu-item>
|
</el-menu-item-group>
|
</el-submenu>
|
<el-submenu index="9">
|
<template slot="title">
|
<i class="el-icon-location"></i>
|
<span>通信效能评估子系统</span>
|
</template>
|
<el-menu-item-group>
|
<el-menu-item index="9-1">通信毁伤影响评估</el-menu-item>
|
<el-menu-item index="9-2">通信干扰影响评估</el-menu-item>
|
<el-menu-item index="9-3">辅助计算分析</el-menu-item>
|
</el-menu-item-group>
|
</el-submenu>
|
<el-submenu index="10">
|
<template slot="title">
|
<i class="el-icon-location"></i>
|
<span>作战行动影响分析子系统</span>
|
</template>
|
<el-menu-item-group>
|
<el-menu-item index="10-1">情报链路行动影响分析</el-menu-item>
|
<el-menu-item index="10-2">指挥链路行动影响分析</el-menu-item>
|
<el-menu-item index="10-3">打击链路行动影响分析</el-menu-item>
|
<el-menu-item index="10-4"
|
>保障链路行动影响分析和评估分析结果展示
|
</el-menu-item>
|
</el-menu-item-group>
|
</el-submenu>
|
</el-menu>
|
</div>
|
<div class="bot">
|
<div
|
:class="istrue ? 'botImg1' : 'botImg'"
|
@mousemove="makebig"
|
@mouseout="makeSmall"
|
>
|
<span id="img" @click="changeMap">
|
<span class="mapinner">街道图</span>
|
</span>
|
<span id="img1" @click="changeMap1" :style="move1">
|
<span class="mapinner1">影像图</span>
|
</span>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
let gdMap = null;
|
|
import { addMpt } from "../../../utils/work";
|
import bus from "../../../utils/bus";
|
export default {
|
data() {
|
return {
|
move1: {
|
transform: "translateX(-230px)",
|
"z-index": "2",
|
transition: "transform,1s",
|
},
|
nowchoose: null,
|
bot1: [
|
{ img: require("@/assets/image/test/组 163.png") },
|
{ img: require("@/assets/image/test/组 164.png") },
|
{ img: require("@/assets/image/test/组 165.png") },
|
],
|
isshowGD: false,
|
istrue: true,
|
};
|
},
|
methods: {
|
handleSelect(key, keyPath) {
|
var val = keyPath[1];
|
switch (val) {
|
case "1-3":
|
this.nowchoose = 2;
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "1-2": //null
|
this.nowchoose = 7;
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "1-1":
|
this.nowchoose = 1;
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "2-6": //null
|
this.nowchoose = 8;
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "2-5":
|
this.nowchoose = 3;
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "2-4": //null
|
this.nowchoose = 9;
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "2-3": //null
|
this.nowchoose = 10;
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "2-2":
|
this.nowchoose = "1-4";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
|
case "3-4":
|
this.nowchoose = 5;
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "3-3":
|
this.nowchoose = "1-2";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "3-2":
|
this.nowchoose = 4;
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "3-1":
|
this.nowchoose = 6;
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
|
case "4-1":
|
this.nowchoose = "4-1";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "4-2":
|
this.nowchoose = "4-2";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "4-3":
|
this.nowchoose = "4-3";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "4-4":
|
this.nowchoose = "4-4";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "4-5":
|
this.nowchoose = "4-5";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "5-1":
|
this.nowchoose = "5-1";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "6-1":
|
this.nowchoose = "6-1";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "6-2":
|
this.nowchoose = "6-2";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "6-3":
|
this.nowchoose = "6-3";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "6-4":
|
this.nowchoose = "6-4";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "6-5":
|
this.nowchoose = "6-5";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "6-6":
|
this.nowchoose = "6-6";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "6-7":
|
this.nowchoose = "6-7";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
|
case "7-1":
|
this.nowchoose = "7-1";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "7-2-1":
|
this.nowchoose = "7-2-1";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "7-3-1":
|
this.nowchoose = "7-3-1";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "7-4":
|
this.nowchoose = "7-4";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "7-5":
|
this.nowchoose = "7-5";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "7-6":
|
this.nowchoose = "7-6";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "7-7":
|
this.nowchoose = "7-7";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "7-8":
|
this.nowchoose = "7-8";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "7-9":
|
this.nowchoose = "7-9";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "8-1":
|
this.nowchoose = "8-1";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "8-2":
|
this.nowchoose = "8-2";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "8-3":
|
this.nowchoose = "8-3";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "8-4":
|
this.nowchoose = "8-4";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "9-1":
|
this.nowchoose = "9-1";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "9-2":
|
this.nowchoose = "9-2";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "9-3":
|
this.nowchoose = "9-3";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "10-1":
|
this.nowchoose = "10-1";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "10-2":
|
this.nowchoose = "10-2";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "10-3":
|
this.nowchoose = "10-3";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
case "10-4":
|
this.nowchoose = "10-4";
|
bus.$emit("showdio", this.nowchoose);
|
break;
|
}
|
},
|
makebig() {
|
this.istrue = false;
|
this.move1.transform = "translateX(0px)";
|
},
|
makeSmall() {
|
this.istrue = true;
|
this.move1.transform = "translateX(-230px)";
|
},
|
changeMap1() {
|
Viewer.imageryLayers._layers[0].show = true;
|
addMpt(true);
|
if (gdMap) {
|
gdMap.setVisibility(false);
|
this.move1["z-index"] = 2;
|
} else {
|
return;
|
}
|
},
|
changeMap() {
|
this.move1["z-index"] = 0;
|
Viewer.imageryLayers._layers[0].show = false;
|
addMpt(false);
|
if (gdMap) {
|
gdMap.setVisibility(true);
|
} else {
|
var base = {
|
url: "https://map.geoq.cn/ArcGIS/rest/services/ChinaOnlineCommunity/MapServer",
|
enablePickFeatures: false,
|
usePreCachedTilesIfAvailable: false, // 是否使用服务的内置的切片方案，偏移纠正需要使用如下自定义的方案
|
tilingScheme: sgworld.Core.getOffsetTilingScheme(), // 偏移纠正
|
};
|
gdMap = sgworld.Creator.createArcGisImageryLayer(
|
"街道",
|
base,
|
"0",
|
undefined,
|
true,
|
""
|
);
|
this.isshowGD = true;
|
}
|
},
|
},
|
mounted() {
|
bus.$on("showindex", (e) => {
|
if (this.boxindex == e) {
|
this.boxindex = 0;
|
} else {
|
this.boxindex = e;
|
}
|
});
|
},
|
};
|
</script>
|
|
<style scoped>
|
.content {
|
/* height: 2000px; */
|
position: relative;
|
/* background: skyblue; */
|
display: flex;
|
justify-content: space-between;
|
flex-direction: column;
|
}
|
.container {
|
width: 400px;
|
margin-left: 100px;
|
height: 1600px;
|
display: flex;
|
padding: 20px;
|
margin-top: 100px;
|
background: url("../../../assets/image/listbg.png") no-repeat;
|
background-size: 100% 100%;
|
}
|
.el-menu-vertical-demo {
|
width: 100%;
|
background: transparent !important;
|
border: transparent;
|
color: white;
|
}
|
/deep/ .el-submenu__title:hover {
|
background: rgba(255, 255, 255, 0.2) !important;
|
}
|
/deep/ .el-submenu__title {
|
color: white !important;
|
font-size: 32px;
|
}
|
/deep/.el-menu {
|
background: transparent !important;
|
}
|
/deep/.el-menu-item:focus,
|
.el-menu-item:hover {
|
background: rgba(255, 255, 255, 0.2) !important;
|
color: #409eff !important;
|
}
|
/deep/.el-menu-item {
|
color: white !important;
|
font-size: 28px;
|
padding: 0px 40px !important;
|
}
|
/deep/.el-submenu__icon-arrow {
|
font-size: 20px !important;
|
}
|
.bot {
|
width: 100px;
|
height: 310px;
|
margin-top: 200px;
|
bottom: 10px;
|
left: 10%;
|
margin-left: 50px;
|
}
|
.bot > span {
|
display: block;
|
width: 100%;
|
height: 29%;
|
background-size: 100% 100% !important;
|
background-repeat: no-repeat !important;
|
background-position: center !important;
|
}
|
#img,
|
#img1 {
|
display: block;
|
margin: 20px 0;
|
width: 250px;
|
height: 150px;
|
}
|
#img {
|
background: url(../../../assets/image/subject/二维.png);
|
background-size: 100% 100%;
|
background-repeat: no-repeat;
|
background-position: center;
|
position: absolute;
|
margin: 20px;
|
z-index: 1;
|
}
|
#img1 {
|
background: url(../../../assets/image/change/组182.png);
|
background-size: 100% 100%;
|
background-repeat: no-repeat;
|
background-position: center;
|
position: absolute;
|
margin: 20px;
|
left: 350px;
|
}
|
.botImg {
|
width: 540px;
|
height: 190px;
|
background: transparent;
|
}
|
.botImg1 {
|
width: 340px;
|
height: 190px;
|
background: transparent;
|
}
|
</style>
|
