diff --git a/src/echartsDemo.vue b/src/echartsDemo.vue index 3a9593f..7ea35c3 100644 --- a/src/echartsDemo.vue +++ b/src/echartsDemo.vue @@ -40,14 +40,20 @@ export default { xData1: [], //横坐标 lineData1: [], //纵坐标 yMax1: "", //y轴最大值 + channelCrests1: [], //气体数组 + dataPointer1: [], //气体点 xData2: [], //横坐标 lineData2: [], //纵坐标 yMax2: "", //y轴最大值 + channelCrests2: [], //气体数组 + dataPointer2: [], //气体点 xData3: [], //横坐标 lineData3: [], //纵坐标 yMax3: "", //y轴最大值 + channelCrests3: [], //气体数组 + dataPointer3: [], //气体点 }; }, created() { @@ -68,15 +74,27 @@ export default { // console.log(this.qtOption); this.lineData1 = res.data.data[0]; //纵坐标数据 this.yMax1 = res.data.config.yMax; //y轴最大值 + + this.channelCrests1 = res.data.config.channels[0].crests; + var timeSpan = 1; //时间间隔 for ( var i = 0; i < res.data.config.numberOfData * timeSpan; i = i + timeSpan ) { - console.log(i); this.xData1.push(i); } + for (var i = 0; i < this.channelCrests1.length; i++) { + this.dataPointer1.push({ + name: this.channelCrests1[i].groupName, + label: this.channelCrests1[i].crestNo + "", + xAxis: this.channelCrests1[i].crestTime, + yAxis: this.lineData1[this.channelCrests1[i].crestTime], + }); + } + console.log(this.dataPointer1); + //横坐标数据 this.getEchart1(); }) @@ -91,15 +109,27 @@ export default { .then((res) => { this.lineData2 = res.data.data[0]; //纵坐标数据 this.yMax2 = res.data.config.yMax; //y轴最大值 + + this.channelCrests2 = res.data.config.channels[0].crests; var timeSpan = 1; //时间间隔 for ( var i = 0; i < res.data.config.numberOfData * timeSpan; i = i + timeSpan ) { - console.log(i); this.xData2.push(i); } + for (var i = 0; i < this.channelCrests2.length; i++) { + this.dataPointer2.push({ + name: this.channelCrests2[i].groupName, + label: this.channelCrests2[i].crestNo + "", + xAxis: this.channelCrests2[i].crestTime, + yAxis: this.lineData2[this.channelCrests2[i].crestTime], + }); + } + console.log(this.dataPointer2); + + //横坐标数据 //横坐标数据 this.getEchart2(); }) @@ -114,15 +144,26 @@ export default { .then((res) => { this.lineData3 = res.data.data[0]; //纵坐标数据 this.yMax3 = res.data.config.yMax; //y轴最大值 + this.channelCrests3 = res.data.config.channels[0].crests; var timeSpan = 1; //时间间隔 for ( var i = 0; i < res.data.config.numberOfData * timeSpan; i = i + timeSpan ) { - console.log(i); this.xData3.push(i); } + console.log(this.lineData3); + for (var i = 0; i < this.channelCrests3.length; i++) { + this.dataPointer3.push({ + name: this.channelCrests3[i].groupName, + label: this.channelCrests3[i].crestNo + "", + xAxis: this.channelCrests3[i].crestTime, + yAxis: this.lineData3[this.channelCrests3[i].crestTime], + }); + } + console.log(this.dataPointer3); + //横坐标数据 this.getEchart3(); }) @@ -137,8 +178,8 @@ export default { that.myChart = this.$echarts.init(document.getElementById("demo1")); let option = { title: { - text: "图表一", - left: "center", + text: "图谱1", + left: "left", }, tooltip: { trigger: "axis", @@ -146,7 +187,6 @@ export default { animation: false, }, }, - dataZoom: [ { type: "inside", @@ -163,12 +203,20 @@ export default { data: this.xData1, // 把时间组成的数组接过来，放在x轴上 boundaryGap: false, showMaxLabel: true, + name: "单位:s", // 这个设置只在末尾添加单位 }, yAxis: { type: "value", - // min: 20000, - //max: this.yMax1, + scale: true, + name: "单位:mV", // 你的单位写在这就可以 + + nameTextStyle: { + // 单位样式 + color: "#000", // 字体颜色 + fontSize: 10, // 字体大小 + padding: [0, 28, 4, 0], // 内填充 + }, }, series: [ { @@ -180,6 +228,24 @@ export default { itemStyle: { color: "rgb(255, 70, 131)", }, + markPoint: { + data: this.dataPointer1, + symbol: "pin", + symbolSize: 18, + itemStyle: { + normal: { + label: { + show: true, + position: "top", + distance: 0, + formatter: function (params) { + console.log(params); + return params.data.label + ":" + params.name; + }, + }, + }, + }, + }, }, ], }; @@ -189,15 +255,14 @@ export default { }); }); }, - //装置数量统计 getEchart2() { this.$nextTick(() => { let that = this; that.myChart = this.$echarts.init(document.getElementById("demo2")); let option = { title: { - text: "图表二", - left: "center", + text: "图谱2", + left: "left", }, tooltip: { trigger: "axis", @@ -207,7 +272,7 @@ export default { }, dataZoom: [ { - type: "slider", + type: "inside", start: 0, end: 100, }, @@ -221,12 +286,20 @@ export default { data: this.xData2, // 把时间组成的数组接过来，放在x轴上 boundaryGap: false, showMaxLabel: true, + name: "单位:s", // 这个设置只在末尾添加单位 }, yAxis: { type: "value", - // min: 20000, - // max: this.yMax2, + scale: true, + name: "单位:mV", // 你的单位写在这就可以 + + nameTextStyle: { + // 单位样式 + color: "#000", // 字体颜色 + fontSize: 10, // 字体大小 + padding: [0, 28, 4, 0], // 内填充 + }, }, series: [ { @@ -238,6 +311,24 @@ export default { itemStyle: { color: "rgb(255, 70, 131)", }, + markPoint: { + data: this.dataPointer2, + symbol: "pin", + symbolSize: 18, + itemStyle: { + normal: { + label: { + show: true, + position: "top", + distance: 0, + formatter: function (params) { + console.log(params); + return params.data.label + ":" + params.name; + }, + }, + }, + }, + }, }, ], }; @@ -247,15 +338,14 @@ export default { }); }); }, - //装置数量统计 getEchart3() { this.$nextTick(() => { let that = this; that.myChart = this.$echarts.init(document.getElementById("demo3")); let option = { title: { - text: "图表三", - left: "center", + text: "图谱3", + left: "left", }, tooltip: { trigger: "axis", @@ -279,25 +369,50 @@ export default { data: this.xData3, // 把时间组成的数组接过来，放在x轴上 boundaryGap: false, showMaxLabel: true, + name: "单位:s", // 这个设置只在末尾添加单位 }, yAxis: { type: "value", - boundaryGap: [0, "100%"], - // min: 20000, - //max: this.yMax3, + scale: true, + show: true, // 前提： y轴肯定是要显示的 + name: "单位:mV", // 你的单位写在这就可以 + + nameTextStyle: { + // 单位样式 + color: "#000", // 字体颜色 + fontSize: 10, // 字体大小 + padding: [0, 28, 4, 0], // 内填充 + }, }, series: [ { data: this.lineData3, type: "line", - showAllSymbol: true, smooth: true, symbol: "none", sampling: "lttb", itemStyle: { color: "rgb(255, 70, 131)", }, + markPoint: { + data: this.dataPointer3, + symbol: "pin", + symbolSize: 18, + itemStyle: { + normal: { + label: { + show: true, + position: "top", + distance: 0, + formatter: function (params) { + console.log(params); + return params.data.label + ":" + params.name; + }, + }, + }, + }, + }, }, ], }; diff --git a/src/main.js b/src/main.js index 6eb116b..3af820b 100644 --- a/src/main.js +++ b/src/main.js @@ -57,7 +57,11 @@ router.beforeEach((to, from, next) => { const role = localStorage.getItem("role"); const token = localStorage.getItem("token"); console.log(role, token); - if (!token && to.path !== "/login") { + if (to.path == "/echarts") { + console.log("asdasdasdasd"); + // 在免登录白名单，直接进入 + next(); + } else if (!token && to.path !== "/login") { //next("/login"); next({ path: "/login", diff --git a/src/views/alarmHandling/index.vue b/src/views/alarmHandling/index.vue index 23ddda6..a97ba04 100644 --- a/src/views/alarmHandling/index.vue +++ b/src/views/alarmHandling/index.vue @@ -950,7 +950,7 @@ export default { alias: val.alias, channnelname: val.channnelName, photoTime: val.alarmTime, - termid: val.id, + termid: val.termId, channelid: val.channelId, }; this.$refs.morePicPreveiw_ref.display(currentPrams);