|
|
@@ -5,28 +5,20 @@
|
|
|
<el-col :span="8" style="height: 100%">
|
|
|
<el-card class="tableHeight">
|
|
|
<div slot="header" class="clearfix">
|
|
|
- <span>链路参数设置</span>
|
|
|
- <el-select v-model="selectedNode" size="mini" style="width: 40%;">
|
|
|
- <el-option v-for="item in nodes" :key="item.name" :label="item.name"
|
|
|
- :value="item.name"></el-option>
|
|
|
+ <span>网络组参数设置</span>
|
|
|
+ <el-select v-model="selectedGroupId" size="mini" style="width: 40%;float: right;background-color: #8CC0FB;"
|
|
|
+ @change="selectChange">
|
|
|
+ <el-option v-for="item in networkGroupList"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"/>
|
|
|
</el-select>
|
|
|
- <el-button size="mini" type="success" style="float: right" @click="handleEdit">变更</el-button>
|
|
|
</div>
|
|
|
- <el-table height="100%" :data="Params" style="width: 100%" border fit size="mini">
|
|
|
- <el-table-column width="110" prop="key" label="属性"></el-table-column>
|
|
|
- <el-table-column width="100" prop="value" label="值"></el-table-column>
|
|
|
- <el-table-column label="操作">
|
|
|
+ <el-table height="90%" :data="Params" style="width: 100%;overflow-y: auto" fit size="mini">
|
|
|
+ <el-table-column width="80" prop="key" label="属性"></el-table-column>
|
|
|
+ <el-table-column width="80" prop="value" label="值"></el-table-column>
|
|
|
+ <el-table-column label="操作" align="center">
|
|
|
<template slot-scope="scope">
|
|
|
- <!-- <el-select v-if="scope.row.key === '平台身份'" v-model="linkVUProps.platInfo" size="mini"
|
|
|
- placeholder="选择平台身份">
|
|
|
- <el-option v-for="item in platInfoOptions" :key="item.value" :label="item.label"
|
|
|
- :value="item.value"></el-option>
|
|
|
- </el-select> -->
|
|
|
- <!-- <el-select v-if="scope.row.key === '入网状态'" v-model="linkVUProps.linkEdit" size="mini"
|
|
|
- placeholder="选择入网状态">
|
|
|
- <el-option v-for="item in linkEditOptions" :key="item.value" :label="item.label"
|
|
|
- :value="item.value"></el-option>
|
|
|
- </el-select> -->
|
|
|
<el-switch v-if="scope.row.key === '链路开关'" active-text="开" inactive-text="关"
|
|
|
v-model="linkVUProps.linkSwitchBoolean" :change="switchChange()">
|
|
|
</el-switch>
|
|
|
@@ -46,136 +38,109 @@
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
+ <div >
|
|
|
+ <el-button size="mini" type="success" style="float: right"
|
|
|
+ :disabled="!editable">修改参数</el-button>
|
|
|
+ <el-button size="mini" type="info" style="float: right"
|
|
|
+ :disabled="editable()"
|
|
|
+ @click="getParams"
|
|
|
+ >刷新</el-button>
|
|
|
+ </div>
|
|
|
</el-card>
|
|
|
</el-col>
|
|
|
<el-col :span="16" style="height: 100%">
|
|
|
- <el-card class="radar">
|
|
|
- <div slot="header" class="clearfix">
|
|
|
+ <el-card class="radar" border>
|
|
|
+ <div slot="header" class="clearfix" >
|
|
|
<span>通信状态显示</span>
|
|
|
</div>
|
|
|
<div class="echarts-box">
|
|
|
- <div id="radarEchart"></div>
|
|
|
+ <div ref="chart" id="radarEchart"></div>
|
|
|
</div>
|
|
|
</el-card>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
<el-row style="height: calc(34% - 6px); margin-top: 6px;" :gutter="10">
|
|
|
<el-card class="box-card">
|
|
|
- <div slot="header" class="clearfix">
|
|
|
+ <div slot="header" class="clearfix" style="height: 28px">
|
|
|
<span>已接收消息</span>
|
|
|
</div>
|
|
|
- <el-table :data="inbox" size="mini" style="overflow-y: auto;">
|
|
|
- <el-table-column type="selection" width="55">
|
|
|
- </el-table-column>
|
|
|
+ <el-table :data="receivedMessage" size="mini" height="tableHeight">
|
|
|
<el-table-column prop="time" label="时间"></el-table-column>
|
|
|
- <el-table-column prop="domain" label="传输双方" ></el-table-column>
|
|
|
- <el-table-column prop="topic" label="主题"></el-table-column>
|
|
|
- <el-table-column fixed="right" label="操作" width="150">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
|
|
|
- <el-button @click="handleClick(scope.row)" type="text" size="small">忽略</el-button>
|
|
|
- </template>
|
|
|
+ <el-table-column prop="translation" label="传输双方" ></el-table-column>
|
|
|
+ <el-table-column prop="type" label="主题"></el-table-column>
|
|
|
+ <el-table-column prop="status" label="状态" width="150">
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
</el-card>
|
|
|
</el-row>
|
|
|
</el-col>
|
|
|
- <el-col :span="6" style="height: 100%">
|
|
|
- <el-row style="height: 36%">
|
|
|
+ <el-col :span="6" style="height: 100%;overflow-y: auto">
|
|
|
+ <el-row style="height: calc(36%)">
|
|
|
<el-card class="box-card">
|
|
|
- <div slot="header" class="clearfix">
|
|
|
+ <div slot="header" class="clearfix" style="height: 28px">
|
|
|
<span>已发送消息</span>
|
|
|
- <el-button size="mini" type="success" style="float: right; margin-top: 1px;"
|
|
|
- @click="sendMessage">手动发送</el-button>
|
|
|
</div>
|
|
|
- <el-table :data="outbox" border fit size="mini">
|
|
|
+ <el-table :data="sendMessage" fit size="mini" height="sendMessageHeight">
|
|
|
<el-table-column width="80" prop="time" label="时间"></el-table-column>
|
|
|
- <el-table-column width="90" prop="domain" label="域"></el-table-column>
|
|
|
- <el-table-column prop="topic" label="主题"></el-table-column>
|
|
|
+ <el-table-column width="90" prop="translation" label="传输双方"></el-table-column>
|
|
|
+ <el-table-column prop="type" label="主题"></el-table-column>
|
|
|
<el-table-column width="60" prop="status" label="状态"></el-table-column>
|
|
|
</el-table>
|
|
|
</el-card>
|
|
|
</el-row>
|
|
|
<el-row style="height: calc(64% - 6px); margin-top: 6px;">
|
|
|
<el-card class="target">
|
|
|
- <div slot="header" class="clearfix">
|
|
|
+ <div slot="header" class="clearfix" style="height: 28px">
|
|
|
<span>成员列表</span>
|
|
|
</div>
|
|
|
- <el-table height="100%" :data="VUStatus" border fit size="mini">
|
|
|
- <el-table-column prop="platID" label="平台ID"> </el-table-column>
|
|
|
+ <el-table height="tableHeight" :data="members" border fit size="mini">
|
|
|
+ <el-table-column prop="id" label="平台ID"> </el-table-column>
|
|
|
<el-table-column prop="isOnline" label="是否在网"> </el-table-column>
|
|
|
- <el-table-column prop="TransBW" label="可用带宽"> </el-table-column>
|
|
|
- <el-table-column prop="isAccess" label="连接方式"> </el-table-column>
|
|
|
+ <el-table-column prop="status" label="静默状态"> </el-table-column>
|
|
|
+ <el-table-column prop="linkModel" label="连接方式"> </el-table-column>
|
|
|
</el-table>
|
|
|
</el-card>
|
|
|
</el-row>
|
|
|
</el-col>
|
|
|
-
|
|
|
- <!-- <el-col :span="6" style="height: 100%">
|
|
|
- <el-card class="tableHeight">
|
|
|
- <div slot="header" class="clearfix">
|
|
|
- <span>链路状态</span>
|
|
|
- </div>
|
|
|
- <el-table height="100%" :data="JStatus" v-if="this.currentLink === 2" size="small" border fit>
|
|
|
- <el-table-column prop="key" label="属性"></el-table-column>
|
|
|
- <el-table-column prop="value" label="值"></el-table-column>
|
|
|
- </el-table>
|
|
|
- <el-table height="100%" :data="VUStatus" v-if="this.currentLink === 1" size="small" border fit>
|
|
|
- <el-table-column prop="key" label="属性"></el-table-column>
|
|
|
- <el-table-column prop="value" label="值"></el-table-column>
|
|
|
- </el-table>
|
|
|
- </el-card>
|
|
|
- </el-col> -->
|
|
|
-
|
|
|
</el-row>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { mapGetters } from "vuex";
|
|
|
import {Message} from "element-ui";
|
|
|
export default {
|
|
|
- computed: {
|
|
|
- ...mapGetters([
|
|
|
- "map",
|
|
|
- "init",
|
|
|
- "platforms",
|
|
|
- "platformID",
|
|
|
- "JParams",
|
|
|
- "JStatus",
|
|
|
- "VUParams",
|
|
|
- "VUStatus",
|
|
|
- ]),
|
|
|
- },
|
|
|
- watch: {
|
|
|
- init: {
|
|
|
- handler: function (val, oldVal) {
|
|
|
- this.setTimer();
|
|
|
- },
|
|
|
- },
|
|
|
- VUParams: {
|
|
|
- handler: function (val, oldVal) { },
|
|
|
- },
|
|
|
- },
|
|
|
data() {
|
|
|
return {
|
|
|
- currentLink: 1,
|
|
|
- Params:[{
|
|
|
- key:"链路开关",
|
|
|
- value:"开"
|
|
|
- },
|
|
|
+ selectedGroupId: null,
|
|
|
+ selectedGroup: null,
|
|
|
+ networkGroupList: [],
|
|
|
+
|
|
|
+ chartInstance: null,
|
|
|
+ nodes: [],
|
|
|
+ edges: [],
|
|
|
+
|
|
|
+ sendMessage: [],
|
|
|
+ receivedMessage: [],
|
|
|
+ members: [],
|
|
|
+
|
|
|
+ tableHeight: "calc(100vh - 30px)",
|
|
|
+
|
|
|
+ Params: [{
|
|
|
+ key: "链路开关",
|
|
|
+ value: "开"
|
|
|
+ },
|
|
|
{
|
|
|
- key:"静默状态",
|
|
|
- value:"非静默"
|
|
|
+ key: "静默状态",
|
|
|
+ value: "非静默"
|
|
|
},
|
|
|
{
|
|
|
- key:"通信速率",
|
|
|
- value:"速率1"
|
|
|
+ key: "通信速率",
|
|
|
+ value: "速率1"
|
|
|
},
|
|
|
{
|
|
|
- key:"传输模式",
|
|
|
- value:"模式1"
|
|
|
+ key: "传输模式",
|
|
|
+ value: "模式1"
|
|
|
}
|
|
|
- ],
|
|
|
+ ],
|
|
|
linkVUProps: {
|
|
|
linkSwitch: 1,
|
|
|
linkSilent: 1,
|
|
|
@@ -193,205 +158,165 @@ export default {
|
|
|
WireLessStatusBoolean: true,
|
|
|
PlatType: null,
|
|
|
},
|
|
|
- linkEditOptions: [
|
|
|
- { value: 1, label: "入网" },
|
|
|
- { value: 2, label: "退网" },
|
|
|
- { value: 3, label: "变更身份" },
|
|
|
- ],
|
|
|
- platInfoOptions: [
|
|
|
- { value: 1, label: "长机" },
|
|
|
- { value: 2, label: "僚机" },
|
|
|
- { value: 3, label: "主站" },
|
|
|
- { value: 4, label: "从站" },
|
|
|
- ],
|
|
|
linkVUSpeedOptions: [
|
|
|
- { value: 0, label: "无报告" },
|
|
|
- { value: 1, label: "2.4kbps" },
|
|
|
- { value: 2, label: "4.8kbps" },
|
|
|
- { value: 3, label: "6.4kbps" },
|
|
|
- { value: 4, label: "128kbps" },
|
|
|
- { value: 5, label: "256kbps" },
|
|
|
- { value: 6, label: "512kbps" },
|
|
|
- { value: 7, label: "1Mbps" },
|
|
|
- { value: 8, label: "2Mbps" },
|
|
|
+ {value: 0, label: "无报告"},
|
|
|
+ {value: 1, label: "2.4kbps"},
|
|
|
+ {value: 2, label: "4.8kbps"},
|
|
|
+ {value: 3, label: "6.4kbps"},
|
|
|
+ {value: 4, label: "128kbps"},
|
|
|
+ {value: 5, label: "256kbps"},
|
|
|
+ {value: 6, label: "512kbps"},
|
|
|
+ {value: 7, label: "1Mbps"},
|
|
|
+ {value: 8, label: "2Mbps"},
|
|
|
],
|
|
|
linkVUQualityOptions: [
|
|
|
- { value: 1, label: "可靠性" },
|
|
|
- { value: 2, label: "实时性" },
|
|
|
- ],
|
|
|
- frequencevalue: "",
|
|
|
- workvalue: "",
|
|
|
- frequenceAverageShow: false,
|
|
|
- radarEchart: null,
|
|
|
- linkOptions: [
|
|
|
- {
|
|
|
- linkID: 1,
|
|
|
- linkName: "V/U",
|
|
|
- },
|
|
|
- {
|
|
|
- linkID: 2,
|
|
|
- linkName: "J",
|
|
|
- },
|
|
|
- {
|
|
|
- linkID: 3,
|
|
|
- linkName: "ZY",
|
|
|
- },
|
|
|
+ {value: 1, label: "可靠性"},
|
|
|
+ {value: 2, label: "实时性"},
|
|
|
],
|
|
|
-
|
|
|
- groupTable: [],
|
|
|
- selectedNode: "",
|
|
|
- nodes: [
|
|
|
- { name: "地面控制站" },
|
|
|
- { name: "雷达平台-101" },
|
|
|
- { name: "雷达平台-102" },
|
|
|
- { name: "雷达平台-103" },
|
|
|
- { name: "雷达平台-104" },
|
|
|
- { name: "雷达平台-105" },
|
|
|
- { name: "雷达平台-106" },
|
|
|
- { name: "雷达平台-107" },
|
|
|
- { name: "雷达平台-108" },
|
|
|
- { name: "雷达平台-109" },
|
|
|
- { name: "雷达平台-110" },
|
|
|
- { name: "接入终端-201" },
|
|
|
- { name: "接入终端-202" },
|
|
|
- { name: "接入终端-203" },
|
|
|
- ],
|
|
|
- edges: [
|
|
|
- { source: "接入终端-201", target: "雷达平台-103" },
|
|
|
- { source: "接入终端-202", target: "雷达平台-105" },
|
|
|
- { source: "接入终端-203", target: "雷达平台-110" },
|
|
|
- { source: "地面控制站", target: "雷达平台-102" },
|
|
|
- { source: "地面控制站", target: "雷达平台-107" },
|
|
|
- { source: "地面控制站", target: "雷达平台-109" },
|
|
|
- { source: "雷达平台-101", target: "雷达平台-102" },
|
|
|
- { source: "雷达平台-101", target: "雷达平台-103" },
|
|
|
- { source: "雷达平台-101", target: "雷达平台-104" },
|
|
|
- { source: "雷达平台-102", target: "雷达平台-103" },
|
|
|
- { source: "雷达平台-102", target: "雷达平台-104" },
|
|
|
- { source: "雷达平台-103", target: "雷达平台-104" },
|
|
|
- { source: "雷达平台-105", target: "雷达平台-106" },
|
|
|
- { source: "雷达平台-105", target: "雷达平台-107" },
|
|
|
- { source: "雷达平台-106", target: "雷达平台-107" },
|
|
|
- { source: "雷达平台-108", target: "雷达平台-109" },
|
|
|
- { source: "雷达平台-108", target: "雷达平台-110" },
|
|
|
- { source: "雷达平台-109", target: "雷达平台-110" },
|
|
|
- { source: "雷达平台-106", target: "雷达平台-108" },
|
|
|
- { source: "雷达平台-103", target: "雷达平台-105" },
|
|
|
- ],
|
|
|
- outbox: [
|
|
|
- { time: "14:33.00", domain: "103->101", topic: "态势信息-106", status: "成功" },
|
|
|
- { time: "14:33.10", domain: "101->102", topic: "任务应答-雷达探测-4", status: "成功" },
|
|
|
- { time: "14:34.00", domain: "104->101", topic: "态势信息-106", status: "失败" },
|
|
|
- { time: "14:34.70", domain: "106->107", topic: "雷达数据-雷达探测-4", status: "成功" },
|
|
|
- { time: "14:35.00", domain: "105->108", topic: "态势信息-106", status: "成功" },
|
|
|
- ],
|
|
|
- inbox: [
|
|
|
- // { time: "14:33.50", domain: "101->103", topic: "态势信息-106", status: "成功" },
|
|
|
- // { time: "14:34.10", domain: "102->101", topic: "任务应答-雷达探测-4", status: "成功" },
|
|
|
- // { time: "14:34.60", domain: "104->101", topic: "态势信息-106", status: "失败" },
|
|
|
- // { time: "14:35.70", domain: "107->106", topic: "雷达数据-雷达探测-4", status: "成功" },
|
|
|
- // { time: "14:35.90", domain: "108->105", topic: "态势信息-106", status: "成功" },
|
|
|
- ]
|
|
|
};
|
|
|
},
|
|
|
created() {
|
|
|
- this.getLinkParamData();
|
|
|
},
|
|
|
activated() {
|
|
|
- this.setTimer();
|
|
|
+ this.init();
|
|
|
},
|
|
|
deactivated() {
|
|
|
- this.timerDestory();
|
|
|
+ if(this.interval){
|
|
|
+ clearInterval(this.interval)
|
|
|
+ }
|
|
|
},
|
|
|
mounted() {
|
|
|
- this.echartsInit();
|
|
|
+ this.init();
|
|
|
// 页面加载设置高度自适应
|
|
|
window.onresize = () => {
|
|
|
this.resizeDom();
|
|
|
};
|
|
|
// 页面加载设置高度自适应
|
|
|
this.resizeDom();
|
|
|
+ this.interval=setInterval(this.fetchData, 5000)
|
|
|
},
|
|
|
methods: {
|
|
|
- //查询已经接收的消息
|
|
|
- getMessage() {
|
|
|
+ async init() {
|
|
|
+ await this.getNetworkGroupList();
|
|
|
+ this.initGroup()
|
|
|
+ if (this.selectedGroupId != null) {
|
|
|
+ this.initChart()
|
|
|
+ this.initSend()
|
|
|
+ this.initReceived()
|
|
|
+ this.initMembers()
|
|
|
+ this.getParams()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ initGroup() {
|
|
|
+ let flag = true;
|
|
|
+ if (this.selectedGroupId !== 0) {
|
|
|
+ for (let i = 0; i < this.networkGroupList.length; i++) {
|
|
|
+ if (this.selectedGroupId === this.networkGroupList[i].id) {
|
|
|
+ flag = false;
|
|
|
+ this.selectedGroup = this.networkGroupList[i]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (flag) {
|
|
|
+ this.selectedGroupId = null;
|
|
|
+ this.selectedGroup = null;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ selectChange() {
|
|
|
+ for (let i = 0; i < this.networkGroupList.length; i++) {
|
|
|
+ if (this.selectedGroupId === this.networkGroupList[i].id) {
|
|
|
+ this.selectedGroup = this.networkGroupList[i];
|
|
|
+ break
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.initChart();
|
|
|
+ this.initSend();
|
|
|
+ this.initReceived();
|
|
|
+ this.initMembers();
|
|
|
+ },
|
|
|
+ getNetworkGroupList() {
|
|
|
this.$http({
|
|
|
- url: this.$http.adornUrl("/community/listReceivedMessage"),
|
|
|
+ url: this.$http.adornUrl("/communication/getNetworkGroups"),
|
|
|
method: "get",
|
|
|
- }).then(({ data }) => {
|
|
|
+ }).then(({data}) => {
|
|
|
if (data && data.code === 0) {
|
|
|
- this.inbox = data.receivedMessage;
|
|
|
+ this.networkGroupList = data.data;
|
|
|
+ if (this.networkGroupList.length === 0) {
|
|
|
+ Message.info("暂未设置网络组信息")
|
|
|
+ }
|
|
|
} else {
|
|
|
- this.inbox = [];
|
|
|
+ this.networkGroupList = [];
|
|
|
+ Message.error("无法获取网络组信息")
|
|
|
}
|
|
|
- });
|
|
|
+ })
|
|
|
+ },
|
|
|
+ editable() {
|
|
|
+ return this.selectedGroupId === 0;
|
|
|
+ },
|
|
|
+ fetchData(){
|
|
|
+ if(this.selectedGroupId!=null){
|
|
|
+ this.initMembers();
|
|
|
+ this.initChart();
|
|
|
+ this.initSend();
|
|
|
+ this.initReceived();
|
|
|
+ }
|
|
|
},
|
|
|
- getLinkParamData() {
|
|
|
+ initChart() {
|
|
|
this.$http({
|
|
|
- url: this.$http.adornUrl("/community/listLinkParam"),
|
|
|
+ url: this.$http.adornUrl("/communication/getChart?id=" + this.selectedGroupId),
|
|
|
method: "get",
|
|
|
- }).then(({ data }) => {
|
|
|
+ }).then(({data}) => {
|
|
|
if (data && data.code === 0) {
|
|
|
- console.log("data", JSON.stringify(data));
|
|
|
- this.linkVUProps = data.linkParam;
|
|
|
- this.$set(this.linkVUProps, 'linkSilentBoolean', this.linkVUProps.linkSilent === 1);
|
|
|
- this.$set(this.linkVUProps, 'linkSwitchBoolean', this.linkVUProps.linkSwitch === 1);
|
|
|
- } else {
|
|
|
- this.linkVUProps = {};
|
|
|
+ this.nodes = data.nodes;
|
|
|
+ this.edges = data.edges;
|
|
|
+ if (this.chartInstance == null) {
|
|
|
+ this.createChartInstance(this.$refs.chart);
|
|
|
+ }
|
|
|
+ this.chartInstance.setOption({
|
|
|
+ series: [{
|
|
|
+ data: this.nodes,
|
|
|
+ links: this.edges,
|
|
|
+ }]
|
|
|
+ })
|
|
|
}
|
|
|
- });
|
|
|
+ })
|
|
|
},
|
|
|
- setTimer() {
|
|
|
- if (this.timer == null) {
|
|
|
- this.timer = setInterval(() => {
|
|
|
- // setTimeout(this.timerRefresh, 0);
|
|
|
- }, 1000);
|
|
|
- }
|
|
|
+ initSend() {
|
|
|
+ this.$http({
|
|
|
+ url: this.$http.adornUrl("/communication/getSendMessage?id=" + this.selectedGroupId),
|
|
|
+ method: "get",
|
|
|
+ }).then(({data}) => {
|
|
|
+ if (data && data.code === 0) {
|
|
|
+ this.sendMessage = data.data;
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
- timerDestory() {
|
|
|
- if (this.timer) {
|
|
|
- clearInterval(this.timer);
|
|
|
- this.timer = null;
|
|
|
- }
|
|
|
+ initReceived() {
|
|
|
+ this.$http({
|
|
|
+ url: this.$http.adornUrl("/communication/getSendMessage?id=" + this.selectedGroupId),
|
|
|
+ method: "get",
|
|
|
+ }).then(({data}) => {
|
|
|
+ if (data && data.code === 0) {
|
|
|
+ this.receivedMessage = data.data;
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
- timerRefresh() {
|
|
|
- // this.echartsInit();
|
|
|
- if (this.currentLink == 1) {
|
|
|
- this.$wst.send({
|
|
|
- url: "getVUParams",
|
|
|
- data: {
|
|
|
- PlatformID: this.platformID,
|
|
|
- },
|
|
|
- });
|
|
|
- this.$wst.send({
|
|
|
- url: "getVUStatus",
|
|
|
- data: {
|
|
|
- PlatformID: this.platformID,
|
|
|
- },
|
|
|
- });
|
|
|
- } else if (this.currentLink == 2) {
|
|
|
- this.$wst.send({
|
|
|
- url: "getJStatus",
|
|
|
- data: {
|
|
|
- PlatformID: this.platformID,
|
|
|
- },
|
|
|
- });
|
|
|
- this.$wst.send({
|
|
|
- url: "getJParams",
|
|
|
- data: {
|
|
|
- PlatformID: this.platformID,
|
|
|
- },
|
|
|
- });
|
|
|
- }
|
|
|
+ initMembers(){
|
|
|
+ this.$http({
|
|
|
+ url: this.$http.adornUrl("/communication/getMembers?id=" + this.selectedGroupId),
|
|
|
+ method: "get",
|
|
|
+ }).then(({data}) => {
|
|
|
+ if (data && data.code === 0) {
|
|
|
+ this.members = data.data;
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
- echartsInit() {
|
|
|
- let option = {
|
|
|
- title: {
|
|
|
- text: "",
|
|
|
- },
|
|
|
- tooltip: {},
|
|
|
- animationDurationUpdate: 1500,
|
|
|
- animationEasingUpdate: "quinticInOut",
|
|
|
+ getParams(){},
|
|
|
+ createChartInstance(dom) {
|
|
|
+ this.chartInstance = this.$echarts.init(dom)
|
|
|
+ const chartOption = {
|
|
|
+ title: {},
|
|
|
+ animation: true,
|
|
|
series: [
|
|
|
{
|
|
|
type: "graph",
|
|
|
@@ -401,14 +326,11 @@ export default {
|
|
|
label: {
|
|
|
show: true,
|
|
|
},
|
|
|
- // edgeSymbol: ["circle", "arrow"],
|
|
|
edgeSymbol: ["circle"],
|
|
|
- edgsSymbolSize: [4, 10],
|
|
|
+ edgeSymbolSize: [4, 10],
|
|
|
edgeLabel: {
|
|
|
fontSize: 12,
|
|
|
},
|
|
|
- data: this.nodes,
|
|
|
- links: this.edges,
|
|
|
emphasis: {
|
|
|
focus: "adjacency",
|
|
|
lineStyle: {
|
|
|
@@ -429,118 +351,39 @@ export default {
|
|
|
},
|
|
|
],
|
|
|
};
|
|
|
- if (this.radarEchart == null) {
|
|
|
- console.log("初始化拓扑图");
|
|
|
- this.radarEchart = this.$echarts.init(
|
|
|
- document.getElementById("radarEchart")
|
|
|
- );
|
|
|
- this.radarEchart.setOption(option);
|
|
|
- } else {
|
|
|
- console.log("更新拓扑图");
|
|
|
- this.radarEchart.setOption(option);
|
|
|
- }
|
|
|
+
|
|
|
+ this.chartInstance.setOption(chartOption)
|
|
|
},
|
|
|
//通过窗体高宽计算容器高宽，渲染echart图表的div的宽高度以达到自适应目的
|
|
|
resizeDom() {
|
|
|
- console.log("高度自适应");
|
|
|
const boxHeight =
|
|
|
- document.getElementsByClassName("echarts-box")[0].clientHeight;
|
|
|
+ document.getElementsByClassName("echarts-box")[0].clientHeight;
|
|
|
var Echart = document.getElementById("radarEchart");
|
|
|
Echart.style.height = boxHeight - 65 + "px";
|
|
|
this.$echarts.init(document.getElementById("radarEchart")).resize();
|
|
|
},
|
|
|
- editParam() {
|
|
|
- const formatData = new FormData();
|
|
|
- formatData.append("PlatformID", this.platformID);
|
|
|
- formatData.append("nodeName", this.selectedNode);
|
|
|
- formatData.append("isValid", this.linkVUProps.linkSwitch);
|
|
|
- formatData.append("isSilence", this.linkVUProps.linkSilent);
|
|
|
- formatData.append("linkSpeed", this.linkVUProps.linkSpeed);
|
|
|
- formatData.append("linkQuality", this.linkVUProps.linkQuality);
|
|
|
- this.$http({
|
|
|
- url: this.$http.adornUrl("/community/updateLink"),
|
|
|
- method: "post",
|
|
|
- data: formatData,
|
|
|
- }).then(({ data }) => {
|
|
|
- if (data && data.code === 0) {
|
|
|
- Message({
|
|
|
- message: "操作成功",
|
|
|
- type: "success",
|
|
|
- duration: 1500,
|
|
|
- onClose: () => {
|
|
|
- this.visible = false;
|
|
|
- },
|
|
|
- });
|
|
|
- } else {
|
|
|
- Message.error(data.msg);
|
|
|
- }
|
|
|
- this.getLinkParamData();
|
|
|
- this.dialogVisible = false;
|
|
|
- });
|
|
|
- },
|
|
|
//变更参数
|
|
|
handleEdit() {
|
|
|
- if (this.currentLink == 1) {
|
|
|
- //更新VU链路状态
|
|
|
- this.editParam();
|
|
|
- if (this.linkVUProps.linkSwitch === 0) {
|
|
|
- this.edges = this.edges.filter(edge => edge.source !== this.selectedNode && edge.target !== this.selectedNode);
|
|
|
- console.log("this.edges", this.edges);
|
|
|
- }
|
|
|
- this.echartsInit();
|
|
|
- } else if (this.currentLink == 2) {
|
|
|
- //更新J参数
|
|
|
- this.$wst.send({
|
|
|
- url: "setJParams",
|
|
|
- data: {
|
|
|
- PlatformID: this.platformID,
|
|
|
- WorkMode: this.linkJProps.WorkMode,
|
|
|
- PlatType: this.linkJProps.PlatType,
|
|
|
- WireLessStatus: this.linkJProps.WireLessStatus,
|
|
|
- },
|
|
|
- });
|
|
|
- }
|
|
|
- },
|
|
|
- sendMessage() {
|
|
|
- console.log("this.outbox", this.outbox);
|
|
|
- this.$http({
|
|
|
- url: this.$http.adornUrl("/community/sendMessage"),
|
|
|
- method: "post",
|
|
|
- data: this.outbox,
|
|
|
- }).then(({ data }) => {
|
|
|
- if (data && data.code === 0) {
|
|
|
- Message({
|
|
|
- message: "操作成功",
|
|
|
- type: "success",
|
|
|
- duration: 1500,
|
|
|
- onClose: () => {
|
|
|
- this.visible = false;
|
|
|
- },
|
|
|
- });
|
|
|
- } else {
|
|
|
- Message.error(data.msg);
|
|
|
- }
|
|
|
- this.getMessage();
|
|
|
- });
|
|
|
+ console.log("aaa")
|
|
|
},
|
|
|
switchChange() {
|
|
|
if (this.currentLink === 1) {
|
|
|
this.linkVUProps.linkSilent =
|
|
|
- this.linkVUProps.linkSilentBoolean == true ? 1 : 0;
|
|
|
+ this.linkVUProps.linkSilentBoolean == true ? 1 : 0;
|
|
|
this.linkVUProps.linkSwitch =
|
|
|
- this.linkVUProps.linkSwitchBoolean == true ? 1 : 0;
|
|
|
+ this.linkVUProps.linkSwitchBoolean == true ? 1 : 0;
|
|
|
} else if (this.currentLink === 2) {
|
|
|
this.linkJProps.WireLessStatus =
|
|
|
- this.linkJProps.WireLessStatusBoolean == true ? 1 : 0;
|
|
|
+ this.linkJProps.WireLessStatusBoolean == true ? 1 : 0;
|
|
|
this.linkJProps.WorkMode =
|
|
|
- this.linkJProps.WorkModeBoolean == true ? 1 : 2;
|
|
|
+ this.linkJProps.WorkModeBoolean == true ? 1 : 2;
|
|
|
}
|
|
|
},
|
|
|
- },
|
|
|
-};
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
</script>
|
|
|
<style scoped>
|
|
|
-.tableHeight {}
|
|
|
|
|
|
.echarts-box {
|
|
|
height: 100%;
|
|
|
@@ -550,4 +393,4 @@ export default {
|
|
|
.radar {
|
|
|
height: 100%;
|
|
|
}
|
|
|
-</style>
|
|
|
+</style>
|
