Skip to content

G
gassafety-progress
Commit 38f8fe2b authored by 纪泽龙's avatar 纪泽龙
Browse files
Options

上传master

parent a5be4eff
Show whitespace changes
Inline Side-by-side
Showing with 145 additions and 79 deletions
gassafetyprogress-web/src/components/bigWindow/DeviceA.vue
View file @ 38f8fe2b
<!--
* @Author: your name
* @Date: 2022-01-26 20:07:52
* @LastEditTime: 2022-02-26 14:16:23
* @LastEditTime: 2022-02-26 23:06:21
* @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
......@@ -26,7 +26,7 @@
<div class="group">
<div class="left">设备类型：</div>
<div class="right zzz">
{{ deviceType[deviceData.type] }}
{{ deviceType[deviceData.iconType] }}
</div>
</div>
<div class="group">
......@@ -45,6 +45,7 @@
>
{{ deviceData.stationAddr || "-" }}
</div>
<div v-else>-</div>
</div>
</div>
......
gassafetyprogress-web/src/components/bigWindow/rightBar.vue
View file @ 38f8fe2b
......@@ -450,7 +450,7 @@
this.timerAni();
},
timerAni() {
console.log("zhix")
const selectWrap = this.$refs.table.$el.querySelector(
".el-table__body-wrapper"
);
......
gassafetyprogress-web/src/utils/mapClass/map.js
View file @ 38f8fe2b
/*
* @Author: your name
* @Date: 2022-01-11 13:45:12
* @LastEditTime: 2022-02-26 13:59:03
* @LastEditTime: 2022-02-26 23:23:01
* @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /test/hello-world/src/utils/mapClass.js
......@@ -445,7 +445,7 @@ export class EditorMap {
this.infowindow.close();
}
allilter(companyArr, typeArr) {
allfilter(companyArr, typeArr) {
for (let pipeItem in this.pipeArr) {
this.pipeArr[pipeItem].forEach((pipe) => {
const data = pipe.getExtData();
......@@ -463,7 +463,8 @@ export class EditorMap {
// 燃气没有公司，所以没有device.companyType不收到公司的控制
const companyHas = companyArr.indexOf(data.companyType + "") >= 0;
// 设备存在
const deviceHas = typeArr.indexOf(data.iconType + "") >= 0;
const deviceHas = typeArr.indexOf(+data.iconType ) >= 0;
console.log(deviceHas)
// 必须设备存在数组里，才会显示设备 !data.companyType代表用户不受公司制约
if (deviceHas && (companyHas || !data.companyType)) {
device.show();
......
gassafetyprogress-web/src/views/bigWindow/index.vue
View file @ 38f8fe2b
<!--
* @Author: your name
* @Date: 2022-01-11 13:44:17
* @LastEditTime: 2022-02-26 22:54:46
* @LastEditTime: 2022-02-26 23:31:14
* @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /test/hello-world/src/views/Home.vue
......@@ -11,6 +11,15 @@
<div class="goSystem" @click="$router.push('/index')">进入管理系统</div>
<div id="map"></div>
<Center :show="show" :centerData="centerData" />
<UserCenter
:title="centerTitle"
:show="centerShow"
ref="userCenter"
:detcetorList="detcetorList"
:userId="centerUserId"
:total="centerTotal"
:pageSize="20"
/>
<PipeColor />
<!-- 底部按钮 -->
<div class="home-div">
......@@ -37,12 +46,21 @@
<!-- 设备按钮 -->
<div class="typelist-div">
<div class="list" v-for="(item,index) in arr" :key="index" :class="item.ischeck==true?'active':''" @click="sel1(index,item)">
<img :src="item.imgurl" style="margin-top: 2px;float: left;margin-right: 3px;" /> {{item.name}}
<div
class="list"
v-for="(item, index) in arr"
:key="index"
:class="selarr1.indexOf(item.val) >= 0 ? 'active' : ''"
@click="sel1(index, item)"
>
<img
:src="item.imgurl"
style="margin-top: 2px; float: left; margin-right: 3px"
/>
{{ item.name }}
</div>
</div>
<!-- 弹框 -->
<div
id=""
......@@ -104,10 +122,10 @@
z-index: 999;
width: 200px;
height: 50px;
color: #339CC9;
color: #339cc9;
"
>
<div style="height: 20px; width: 100%; float: right; font-size: 14px;">
<div style="height: 20px; width: 100%; float: right; font-size: 14px">
{{ nowDate }}&nbsp;{{ nowtime }}&nbsp;{{ nowweek }}
</div>
</div>
......@@ -118,6 +136,8 @@
// @ is an alias to /src
import { EditorMap } from "@/utils/mapClass/map";
import { mapGetters, mapActions } from "vuex";
import { listDetectorInfo } from "@/api/detector/detectorInfo";
import { detectorUserList } from "@/api/detector/detectorUser";
import {
pipeData,
tiaoyaxiang,
......@@ -139,6 +159,7 @@ import VideoView from "@/components/bigWindow/VideoView.vue";
import DeviceA from "@/components/bigWindow/DeviceA.vue";
import User from "@/components/bigWindow/User.vue";
import Center from "@/components/bigWindow/Center.vue";
import UserCenter from "@/components/bigWindow/UserCenter.vue";
import PipeColor from "@/components/bigWindow/PipeColor.vue";
// import markerInfoWindow from './components/markerInfoWindow.vue'
......@@ -150,6 +171,7 @@ export default {
leftBar,
rightBar,
Center,
UserCenter,
PipeColor,
},
data() {
......@@ -179,39 +201,50 @@ export default {
name: "中燃韵科",
},
],
arr:[
// 2:"调压箱",
// 3:"阀门",
// 4:"厂站",
// 5:"监控",
// 6:"用户",
arr: [
{
val:1,
ischeck:false,
imgurl: require('@/assets/image/tyxsub.svg'),
name: "调压箱"
val: 2,
ischeck: false,
imgurl: require("@/assets/image/tyxsub.svg"),
name: "调压箱",
},
{
val:2,
ischeck:false,
imgurl: require('@/assets/image/fmjsub.svg'),
name: "阀门井"
val: 3,
ischeck: false,
imgurl: require("@/assets/image/fmjsub.svg"),
name: "阀门井",
},
{
val:3,
ischeck:false,
imgurl: require('@/assets/image/czsub.svg'),
name: "场 站"
val: 4,
ischeck: false,
imgurl: require("@/assets/image/czsub.svg"),
name: "厂 站",
},
{
val:4,
ischeck:false,
imgurl: require('@/assets/image/usersub.svg'),
name: "用 户"
val: 6,
ischeck: false,
imgurl: require("@/assets/image/usersub.svg"),
name: "用 户",
},
{
val:5,
ischeck:false,
imgurl: require('@/assets/image/jksub.svg'),
name: "监 控"
}
val: 5,
ischeck: false,
imgurl: require("@/assets/image/jksub.svg"),
name: "监 控",
},
],
selarr1:[],
selarr1: [],
// 用户的center数据
detcetorList: [],
centerUserId: null,
centerTotal: null,
centerShow: false,
centerTitle: "",
};
},
......@@ -224,8 +257,8 @@ export default {
watch: {
selarr(newValue) {
if (newValue.length == this.companyLength) {
this.$refs.mychild.choice(0);
this.$refs.mychild2.choice(0);
// this.$refs.mychild.choice(0);
// this.$refs.mychild2.choice(0);
}
},
},
......@@ -264,6 +297,9 @@ export default {
name: item.companyName,
}));
this.selarr = this.company.map((item) => item.conpanyId);
this.selarr1 = this.arr.map((item) => item.val);
this.arr.forEach((item) => (item.ischeck = true));
// getPipe() getTyx() getFm() getCz() getVideo() getUser()
this.goMap(getPipe, this.addPipeLine, Line);
this.goMap(getTyx, this.addDevice, DeviceA);
......@@ -277,8 +313,8 @@ export default {
}
this.currentTime();
this.$refs.mychild.choice(0);
this.$refs.mychild2.choice(0);
// this.$refs.mychild.choice(0);
// this.$refs.mychild2.choice(0);
},
methods: {
...mapActions({
......@@ -302,15 +338,29 @@ export default {
},
goMap(httpFunc, addFunc, component) {
httpFunc().then((res) => {
if(res.data&&!res.data[0].iconType){
res.data.forEach(item=>{
item.iconType =6;
})
// 给用户加icontype
if (res.data && !res.data[0].iconType) {
res.data.forEach((item) => {
item.iconType = 6;
});
}
// if (res.data && !res.data[0].iconType) {
// res.data.forEach((item) => {
// item.iconType = 6;
// });
// }
// 根据数据格式不同，赋值不同，如果是个数组，就用res，如果不是就用res.data
let config = {};
if (Array.isArray(res)) {
config = { data: res };
// 给视频设备的conpanyType变成null
if(res[0].iconType==5){
res.forEach(item=>{
item.companyType = null;
})
}
} else {
config = { data: res.data };
}
......@@ -318,7 +368,7 @@ export default {
});
},
centerShow(boolean) {
myCenterShow(boolean) {
this.show = boolean;
},
centerDataFunc(centerData) {
......@@ -345,36 +395,49 @@ export default {
if (ind >= 0) {
this.selarr.splice(ind, 1);
if (item.val == 3) {
this.$refs.mychild.choice(1);
this.$refs.mychild2.choice(1);
// this.$refs.mychild.choice(1);
// this.$refs.mychild2.choice(1);
} else {
this.$refs.mychild.choice(item.val + 1);
this.$refs.mychild2.choice(item.val + 1);
// this.$refs.mychild.choice(item.val + 1);
// this.$refs.mychild2.choice(item.val + 1);
}
} else {
this.selarr.push(item.val);
this.$refs.mychild.choice(item.val);
this.$refs.mychild2.choice(item.val);
// this.$refs.mychild.choice(item.val);
// this.$refs.mychild2.choice(item.val);
}
this.map.companyFilter(this.selarr);
// this.map.companyFilter(this.selarr);
this.map.allfilter(this.selarr, this.selarr1);
},
sel1(index,item){
let arr=[...this.arr];
let selarr1=[...this.selarr1];
if(arr[index].ischeck==false){
arr[index].ischeck=true;
selarr1.push(item)
}else{
arr[index].ischeck=false;
var index11=selarr1.indexOf(index)
selarr1.splice(index11,1)
sel1(index, item) {
const ind = this.selarr1.indexOf(item.val);
if (ind >= 0) {
this.selarr1.splice(ind, 1);
} else {
this.selarr1.push(item.val);
}
this.arr=arr;
this.selarr1=selarr1;
this.map.allfilter(this.selarr, this.selarr1);
},
//用户的设备center
getDetectorInfoList(queryParams, title) {
console.log(queryParams);
return listDetectorInfo(queryParams).then((res) => {
console.log("queryParams", res);
if (res.code == 200) {
this.detcetorList = res.rows;
this.centerUserId = queryParams.userId;
// 总数据
this.centerTotal = res.total;
// this.$refs.userCenter.fade = "fade";
this.centerShow = true;
this.centerTitle = title;
// 传递回去
return res.code;
}
});
},
currentTime() {
setInterval(() => {
this.formatDate();
......@@ -428,11 +491,11 @@ export default {
color: #18baff;
cursor: pointer;
padding: 3px 5px;
border: 1px solid #339CC9;
color: #339CC9;
border: 1px solid #339cc9;
color: #339cc9;
&:hover {
background-color: #053B6A ;
color: #2CD5DB;
background-color: #053b6a;
color: #2cd5db;
}
}
#map {
......@@ -549,7 +612,7 @@ export default {
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.typelist-div{
.typelist-div {
width: 450px;
height: 50px;
z-index: 9999;
......@@ -558,7 +621,7 @@ export default {
margin-top: 120px;
right: 450px;
}
.list{
.list {
z-index: 9999;
float: left;
margin-left: 15px;
......@@ -566,14 +629,15 @@ export default {
line-height: auto;
text-align: center;
background: linear-gradient(86deg, #112238 0%, #086187 62%, #112238 100%);
box-shadow: inset 0px 1px 2px 1px #125C9B;
box-shadow: inset 0px 1px 2px 1px #125c9b;
font-size: 14px;
padding: 5px 7px;
cursor: pointer;
}
.list.active{
background: linear-gradient(86deg, #112238 0%, #32A3D3 62%, #112238 100%);
box-shadow: inset 0px 1px 2px 1px #125C9B;
.list.active {
background: linear-gradient(86deg, #112238 0%, #32a3d3 62%, #112238 100%);
box-shadow: inset 0px 1px 2px 1px #125c9b;
color: #2ee7e7;
font-size: 14px;
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment