+
下载图片
{
+ const canvas = document.createElement("canvas");
+ canvas.width = image.width;
+ canvas.height = image.height;
+ const ctx = canvas.getContext("2d");
+ ctx.drawImage(image, 0, 0, image.width, image.height);
+ canvas.toBlob((blob) => {
+ const url = URL.createObjectURL(blob);
+ this.download(url, name);
+ // 用完释放URL对象
+ URL.revokeObjectURL(url);
+ });
+ };
+ },
+ download(href, name) {
+ const eleLink = document.createElement("a");
+ eleLink.download = name;
+ eleLink.href = href;
+ eleLink.click();
+ eleLink.remove();
+ },
// showbigpicPath(data) {
// console.log(data);
// if (data.includes("!")) {
@@ -582,6 +618,19 @@ export default {
overflow: hidden;
margin-bottom: 4px;
position: relative;
+ .downBtn {
+ position: absolute;
+ background: rgba(0, 0, 0, 0.5);
+ border: none;
+ right: 8px;
+ bottom: 16px;
+ color: #fff;
+ z-index: 5;
+ &:hover {
+ background: rgba(0, 0, 0, 0.9);
+ color: #169e8c;
+ }
+ }
&:hover {
.arrow {
opacity: 1;
diff --git a/src/views/realTimeMonitor/index.vue b/src/views/realTimeMonitor/index.vue
index 4362a13..2491621 100644
--- a/src/views/realTimeMonitor/index.vue
+++ b/src/views/realTimeMonitor/index.vue
@@ -22,10 +22,17 @@
- 全部
- 在线
- 离线
+ 全部
+ 在线
+ 离线
+ 刷新
{
setTimeout(this.getLineTreeStatus(), 0);
@@ -401,7 +410,9 @@ export default {
methods: {
//获取当前选中的radio
getRadio() {
- console.log();
+ console.log(this.zzradio);
+ localStorage.setItem("radio", JSON.stringify(this.zzradio));
+ this.getLineTreeStatus();
},
//获取当前时间
getDateTime() {
@@ -455,10 +466,11 @@ export default {
if (this.filterText !== "") {
this.$refs.tree.filter(this.filterText);
} else {
- getdyTreeListJoggle()
+ getdyTreeListJoggle({ type: this.zzradio })
.then((res) => {
console.log(res);
this.lineTreeData = res.data.list;
+
this.$nextTick(() => {
this.$refs.tree.setCurrentKey(this.selectData.id); //一定要加这个选中了否则样式没有出来
});
@@ -484,11 +496,13 @@ export default {
},
//获取左侧树结构
getLineTreeList() {
- getdyTreeListJoggle()
+ console.log(this.zzradio);
+ getdyTreeListJoggle({ type: this.zzradio })
.then((res) => {
console.log(res);
this.lineTreeData = res.data.list;
console.log(this.lineTreeData);
+
this.onlineNum = res.data.onlineNum;
this.totalNum = res.data.totalNum;
this.currentData = JSON.parse(localStorage.getItem("currentData"));
@@ -521,6 +535,45 @@ export default {
this.$refs.tree.setCurrentKey(this.currentNodekey); //一定要加这个选中了否则样式没有出来
});
}
+ // if (this.zzradio == -1) {
+ // this.lineTreeData = this.lineTreeData;
+ // } else if (this.zzradio == 1) {
+ // //在线
+ // var data = JSON.parse(JSON.stringify(this.lineTreeData));
+ // console.log(data);
+ // const filterId = (data, id) => {
+ // if (!Array.isArray(data)) {
+ // return data;
+ // }
+ // return data.filter((item) => {
+ // if ("list" in item) {
+ // item.list = filterId(item.list, id);
+ // }
+ // return item.onlinestatus !== 0;
+ // });
+ // };
+ // const filtredData = filterId(data);
+ // console.log(filtredData);
+ // this.lineTreeData = filtredData;
+ // } else if (this.zzradio == 0) {
+ // //离线
+ // var data = JSON.parse(JSON.stringify(this.lineTreeData));
+ // console.log(data);
+ // const filterId = (data, id) => {
+ // if (!Array.isArray(data)) {
+ // return data;
+ // }
+ // return data.filter((item) => {
+ // if ("list" in item) {
+ // item.list = filterId(item.list, id);
+ // }
+ // return item.onlinestatus !== 1;
+ // });
+ // };
+ // const filtredData = filterId(data);
+ // console.log(filtredData);
+ // this.lineTreeData = filtredData;
+ // }
})
.catch((err) => {
console.log(err); //代码错误、请求失败捕获
@@ -1224,6 +1277,10 @@ export default {
margin: 0 auto;
margin-bottom: 8px;
font-size: 12px;
+ display: flex;
+ justify-content: space-around;
+ .refresh {
+ }
.el-radio-group {
display: flex;
align-items: center;
diff --git a/vue.config.js b/vue.config.js
index 040028d..31ee2c5 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -30,7 +30,7 @@ module.exports = defineConfig({
"/api": {
//表示拦截以/api开头的请求路径
target: "http://47.96.238.157:8093", //阿里云服务器环境
- //target: "http://180.166.218.222:40080", //dell
+ // target: "http://180.166.218.222:40080", //dell
changOrigin: true, //是否开启跨域
pathRewrite: {
"^/api": "", //重写api,把api变成空字符,因为我们真正请求的路径是没有api的