Skip to content

Z
zh-baseversion-project
Commit c1e5c241 authored by 纪泽龙's avatar 纪泽龙
Browse files
Options

Merge branch 'jzl'

parents 9ee22145 b2b24350
Show whitespace changes
Inline Side-by-side
Showing with 647 additions and 202 deletions
zh-baseversion-web/src/assets/styles/all.scss
View file @ c1e5c241
...@@ -746,3 +746,7 @@ ...@@ -746,3 +746,7 @@
// pointer-events:auto !important; // pointer-events:auto !important;
// top:-30px !important; // top:-30px !important;
} }
zh-baseversion-web/src/components/bigWindow/PipeColor.vue
View file @ c1e5c241
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
--> -->
<template> <template>
<div> <div>
<div class="pipePressure"> <!-- <div class="pipePressure"> -->
<!-- <!--
<div style="float: left;margin-right: 5px;"> <div style="float: left;margin-right: 5px;">
<div class="hasColorBox"> <div class="hasColorBox">
...@@ -32,7 +32,7 @@ ...@@ -32,7 +32,7 @@
监控 监控
</div> </div>
</div> --> </div> -->
<div> <!-- <div>
<div class="hasColorBox" :style="{ color: pipeColor[`1`] }"> <div class="hasColorBox" :style="{ color: pipeColor[`1`] }">
<div :style="{ backgroundColor: pipeColor[`1`] }"></div> <div :style="{ backgroundColor: pipeColor[`1`] }"></div>
低压管线 低压管线
...@@ -50,7 +50,7 @@ ...@@ -50,7 +50,7 @@
高压管线 高压管线
</div> </div>
</div> </div>
</div> </div> -->
<div class="mapChange"> <div class="mapChange">
<div :class="{ active: mapStyle }" @click="mapChange(2)">全景地图</div> <div :class="{ active: mapStyle }" @click="mapChange(2)">全景地图</div>
......
zh-baseversion-web/src/components/bigWindow/rightBar.vue
View file @ c1e5c241
...@@ -1151,6 +1151,7 @@ export default { ...@@ -1151,6 +1151,7 @@ export default {
.rightb { .rightb {
width: 98%; width: 98%;
height: 100%; height: 100%;
} }
.rightbar1 { .rightbar1 {
width: 90%; width: 90%;
...@@ -1161,7 +1162,7 @@ export default { ...@@ -1161,7 +1162,7 @@ export default {
.rightbar2 { .rightbar2 {
width: 76%; width: 76%;
height: 37%; height: 37%;
padding-top: 15px; padding-top: 30px;
margin-left: 20%; margin-left: 20%;
pointer-events: auto; pointer-events: auto;
} }
......
zh-baseversion-web/src/views/bigWindow/components/Bottom.vue
View file @ c1e5c241
<!-- <!--
* @Author: 纪泽龙 jizelong@qq.com * @Author: 纪泽龙 jizelong@qq.com
* @Date: 2023-07-12 13:58:25 * @Date: 2024-07-15 10:26:41
* @LastEditors: 纪泽龙 jizelong@qq.com * @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2023-07-12 17:12:59 * @LastEditTime: 2024-07-16 17:27:41
* @FilePath: /gassafetyprogress-web/src/views/bigWindow/components/Bottom.vue * @FilePath: /zh-baseversion-web/src/views/bigWindow/components/Bottom.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
--> -->
<template> <template>
<div class="bigwindow-bottom listingsSty"> <div class="big-bottom">
<div class="left">
<img <img
src="~@/assets/firstimage/bottombk.svg" v-if="cont != list.length - 3"
@click.stop="cont++"
src="@/assets/firstimage/l.png"
alt="" alt=""
style="backdrop-filter: blur(4px)"
/> />
<div class="listingsSty"> </div>
<div class="container">
<transition name="fade" mode="out-in">
<div v-if="activeCom.label" class="children">
<div
v-for="item in activeCom.children"
:key="item.value"
:title="'河北冉盛升新能源有限公123123123司'"
class="child zzz"
:class="[{ active: selectActive.includes(item.value) }]"
@click.stop="selectActiveChange(item.value)"
>
{{ item.label }}
</div>
</div>
</transition>
<div <div
class="firsty selectAll" class="all"
@click.stop="selectAll" @click.stop="selectAll"
:class="[ :class="{
{
active: active:
selectActive.length == listFlatArr.length && selectActive.length == listFlatArr.length &&
selectActive.length > 1, selectActive.length > 1,
}, }"
]"
> >
全部 全部
</div> </div>
<div class="firsty item" v-for="(item, index) in list" :key="item.value"> <div class="other">
<div class="other2">
<div class="move" :style="{ left: -cont * 144 + 'px' }">
<div <div
class="itemCompany" v-for="item in list"
@click.stop="selectChange(item.value)" @click.stop="itemClick(item)"
:key="item.value"
class="item"
:class="[ :class="[
{ active: selectSome(index) }, { active: item.label == activeCom.label },
{ activeAll: selectEvery(index) }, { minOne: selectSome(item) },
{ maxAll: selectEvery(item) },
]" ]"
> >
{{ item.label }} {{ item.label }}
</div> </div>
<div
class="up-select"
:class="[{ hide: !selectShowNum.includes(item.value) }]"
:style="{ height: item.children.length * 35 + 'px' }"
>
<div
class="selectItem"
v-for="selectItem in item.children"
:class="[{ active: selectActive.includes(selectItem.value) }]"
:key="selectItem.value"
@click.stop="selectActiveChange(selectItem.value)"
>
{{ selectItem.label }}
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="right">
<img
v-if="cont != 0"
@click.stop="cont--"
src="@/assets/firstimage/r.png"
alt=""
/>
</div>
</div> </div>
</template> </template>
<script> <script>
import { mapGetters, mapActions } from "vuex"; import { mapGetters, mapActions } from "vuex";
export default { export default {
name: "", name: "",
data() { data() {
return { return {
cont: 0,
list: [ list: [
{ {
value: 1, value: 1,
...@@ -92,6 +108,8 @@ export default { ...@@ -92,6 +108,8 @@ export default {
], ],
}, },
], ],
// 被选中的公司
activeCom: {},
selectShowNum: [], selectShowNum: [],
// 被选中的值 // 被选中的值
selectActive: [], selectActive: [],
...@@ -101,12 +119,10 @@ export default { ...@@ -101,12 +119,10 @@ export default {
computed: { computed: {
...mapGetters(["company", "systemSetting"]), ...mapGetters(["company", "systemSetting"]),
}, },
beforeCreate() {},
mounted() { mounted() {
this.GetCompany().then((res) => { this.GetCompany().then((res) => {
this.company.forEach((item) => { this.company.forEach((item) => {
this.list[item.companyType-1].children.push({ this.list[item.companyType - 1].children.push({
value: item.conpanyId, value: item.conpanyId,
label: item.companyName, label: item.companyName,
}); });
...@@ -118,9 +134,8 @@ export default { ...@@ -118,9 +134,8 @@ export default {
...mapActions({ ...mapActions({
GetCompany: "bigWindowCompany/GetCompany", GetCompany: "bigWindowCompany/GetCompany",
}), }),
// 把下拉框放下 selectUpClear() {
selectUpClear(){ this.activeCom = {};
this.selectShowNum=[];
}, },
selectAll() { selectAll() {
// 生成所有都选中的数组 // 生成所有都选中的数组
...@@ -141,12 +156,12 @@ export default { ...@@ -141,12 +156,12 @@ export default {
} }
this.$emit("listChange", this.selectActive); this.$emit("listChange", this.selectActive);
}, },
selectChange(value) { itemClick(item) {
const num = this.selectShowNum.indexOf(value); if (item.children.length == 0) return;
if (num >= 0) { if (this.activeCom == item) {
this.selectShowNum.splice(num, 1); this.activeCom = {};
} else { } else {
this.selectShowNum.push(value); this.activeCom = item;
} }
}, },
selectActiveChange(value) { selectActiveChange(value) {
...@@ -158,20 +173,19 @@ export default { ...@@ -158,20 +173,19 @@ export default {
} }
this.$emit("listChange", this.selectActive); this.$emit("listChange", this.selectActive);
}, },
// 至少有一个被选中 selectSome(item) {
selectSome(index) {
return ( return (
this.list[index].children.length > 0 && item.children.length > 0 &&
this.list[index].children.some((item) => { item.children.some((item) => {
return this.selectActive.includes(item.value); return this.selectActive.includes(item.value);
}) })
); );
}, },
// 都被选中 // 都被选中
selectEvery(index) { selectEvery(item) {
return ( return (
this.list[index].children.length > 0 && item.children.length > 0 &&
this.list[index].children.every((item) => { item.children.every((item) => {
return this.selectActive.includes(item.value); return this.selectActive.includes(item.value);
}) })
); );
...@@ -180,84 +194,188 @@ export default { ...@@ -180,84 +194,188 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.bigwindow-bottom { .big-bottom {
width: 40%; width: 810px;
height: 70px; height: 50px;
position: fixed; position: fixed;
bottom: 0; bottom: 38px;
margin-left: 30%; left: 50%;
display: flex; margin-left: -405px;
// z-index: 1000; background: url("~@/assets/firstimage/btmA.png") no-repeat bottom center,
img { url("~@/assets/firstimage/btmB.png") no-repeat bottom center;
width: 100%;
height: 100%;
position: absolute;
z-index: -1;
bottom: -10px;
}
.listingsSty {
padding-left: 15%;
padding-right: 15%;
box-sizing: border-box; box-sizing: border-box;
width: 180%; padding: 0 80px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.firsty { align-items: center;
// width: 15%;
min-width: 80px; .container {
height: 35px; // background: red;
flex: 1;
margin-right: 22px;
height: 28px;
display: flex;
.all {
transition: all 0.2s linear;
width: 128px;
margin-right: 16px;
text-align: center; text-align: center;
line-height: 35px; line-height: 28px;
color: #fff; color: #fff;
font-size: 16px; font-size: 16px;
cursor: pointer; cursor: pointer;
&.selectAll { background: url("~@/assets/firstimage/btm-item.png") no-repeat bottom
transition: all 0.5s ease; center;
&.active { &.active {
color: #00ffff; background: url("~@/assets/firstimage/btm-item-active.png") no-repeat
text-shadow: 0 0 20px rgba(0, 255, 255, 1), bottom center;
0 0 35px rgb(0, 255, 255, 1);
} }
&:hover {
opacity: 0.7;
} }
}
.other {
flex: 1;
width: 0;
position: relative;
.other2 {
width: 100%;
height: 100%;
overflow: hidden;
&.item { .move {
min-width: 180px; transition: all 0.5s linear;
width: 1000px;
height: 100%;
// background: blue;
position: relative; position: relative;
.itemCompany { display: flex;
transition: all 0.5s ease; align-items: center;
left: 0px;
.item {
transition: all 0.2s linear;
width: 128px;
margin-right: 16px;
text-align: center;
line-height: 28px;
color: #fff;
font-size: 16px;
cursor: pointer;
background: url("~@/assets/firstimage/btm-item.png") no-repeat
bottom center;
&.active { &.active {
color: #00ffff; color: #1ec9e3;
text-shadow: 0 0 20px rgba(0, 255, 255, 0.3), }
0 0 35px rgb(0, 255, 255, 0.3); // 最少选中一个
&.minOne {
background: url("~@/assets/firstimage/btm-item-one.png") no-repeat
bottom center;
}
// 全选中
&.maxAll {
background: url("~@/assets/firstimage/btm-item-active.png")
no-repeat bottom center;
}
&:hover {
opacity: 0.7;
}
} }
&.activeAll {
color: #00ffff;
text-shadow: 0 0 20px rgba(0, 255, 255, 1),
0 0 35px rgb(0, 255, 255, 1);
} }
} }
.up-select { }
transition: all 0.5s ease; .children {
transition: all 1s linear;
width: 620px;
max-height: 214px;
position: absolute; position: absolute;
// background: red;
background: rgba(2, 26, 51, 0.9);
border: 1px solid #127bd1;
box-shadow: inset 0px 0px 10px 0px #164db2;
left: 50%;
margin-left: -310px;
// top: -215px;
bottom: 50px; bottom: 50px;
left: 0; display: flex;
width: 100%; flex-wrap: wrap;
background: rgb(18, 92, 155, 0.3); justify-content: space-between;
overflow: hidden; box-sizing: border-box;
&.hide { padding: 20px 20px 0px 20px;
height: 0px !important; // 滚动条
overflow-y: auto;
&::-webkit-scrollbar {
width: 10px;
background: #012a53;
position: absolute;
top: 0;
}
&::-webkit-scrollbar-thumb {
/*滚动条里面小方块*/
// border-radius: 10px;
// box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
background: #00000052;
border-radius: 8px;
}
&::-webkit-scrollbar-track {
/*滚动条里面轨道*/
// box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
// border-radius: 10px;
// background-color: red;
} }
.selectItem {
transition: all 0.5s ease; &::-webkit-scrollbar-button:start {
// overflow: hidden;
}
&::-webkit-scrollbar-button:end {
// overflow: hidden;
}
.child {
width: 275px;
height: 32px;
margin-bottom: 16px;
background: #0b2d47;
box-sizing: border-box;
padding-left: 21px;
line-height: 32px;
color: #fff;
border: 1px solid rgba(54, 136, 255, 0.2392);
cursor: pointer;
&.active { &.active {
color: #00ffff; background: rgba(255, 141, 70, 0.29);
text-shadow: 0 0 20px #00ffff, 0 0 35px #00ffff; box-sizing: border-box;
border: 1px solid rgba(255, 178, 130, 0.4);
}
&:hover {
opacity: 0.7;
} }
} }
} }
} }
.left {
margin-right: 32px;
color: white;
} }
.right {
color: white;
} }
.left,
.right {
width: 14px;
height: 20px;
img {
transition: all 0.5s linear;
width: 100%;
height: 100%;
cursor: pointer;
&:hover {
opacity: 0.7;
}
}
}
// background: red;
} }
</style> </style>
zh-baseversion-web/src/views/bigWindow/components/BottomOld.vue 0 → 100644
View file @ c1e5c241
<!--
* @Author: 纪泽龙 jizelong@qq.com
* @Date: 2023-07-12 13:58:25
* @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2023-07-12 17:12:59
* @FilePath: /gassafetyprogress-web/src/views/bigWindow/components/Bottom.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
<div class="bigwindow-bottom listingsSty">
<img
src="~@/assets/firstimage/bottombk.svg"
alt=""
style="backdrop-filter: blur(4px)"
/>
<div class="listingsSty">
<div
class="firsty selectAll"
@click.stop="selectAll"
:class="[
{
active:
selectActive.length == listFlatArr.length &&
selectActive.length > 1,
},
]"
>
全部
</div>
<div class="firsty item" v-for="(item, index) in list" :key="item.value">
<div
class="itemCompany"
@click.stop="selectChange(item.value)"
:class="[
{ active: selectSome(index) },
{ activeAll: selectEvery(index) },
]"
>
{{ item.label }}
</div>
<div
class="up-select"
:class="[{ hide: !selectShowNum.includes(item.value) }]"
:style="{ height: item.children.length * 35 + 'px' }"
>
<div
class="selectItem"
v-for="selectItem in item.children"
:class="[{ active: selectActive.includes(selectItem.value) }]"
:key="selectItem.value"
@click.stop="selectActiveChange(selectItem.value)"
>
{{ selectItem.label }}
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { mapGetters, mapActions } from "vuex";
export default {
name: "",
data() {
return {
list: [
{
value: 1,
label: "天然气公司",
children: [
// { value: 10, label: "东阿道夫阿" },
// { value: 11, label: "阿发送到" },
// { value: 19, label: "发打算发大水" },
],
},
{
value: 2,
label: "液化气公司",
children: [
// { value: 21, label: "2-1" },
// { value: 22, label: "2-2" },
],
},
{
value: 3,
label: "加气站",
children: [
// { value: 31, label: "3-1" },
// { value: 32, label: "3-2" },
],
},
],
selectShowNum: [],
// 被选中的值
selectActive: [],
listFlatArr: [],
};
},
computed: {
...mapGetters(["company", "systemSetting"]),
},
beforeCreate() {},
mounted() {
this.GetCompany().then((res) => {
this.company.forEach((item) => {
this.list[item.companyType-1].children.push({
value: item.conpanyId,
label: item.companyName,
});
});
this.selectAll();
});
},
methods: {
...mapActions({
GetCompany: "bigWindowCompany/GetCompany",
}),
// 把下拉框放下
selectUpClear(){
this.selectShowNum=[];
},
selectAll() {
// 生成所有都选中的数组
this.listFlatArr = this.list
.map((item) => {
return item.children.map((iten) => {
return iten.value;
});
})
.flat();
// 如果是全选中状态，则全取消，否则全选
if (this.selectActive.length == this.listFlatArr.length) {
this.selectActive = [];
} else {
this.selectActive = [...this.listFlatArr];
}
this.$emit("listChange", this.selectActive);
},
selectChange(value) {
const num = this.selectShowNum.indexOf(value);
if (num >= 0) {
this.selectShowNum.splice(num, 1);
} else {
this.selectShowNum.push(value);
}
},
selectActiveChange(value) {
const num = this.selectActive.indexOf(value);
if (num >= 0) {
this.selectActive.splice(num, 1);
} else {
this.selectActive.push(value);
}
this.$emit("listChange", this.selectActive);
},
// 至少有一个被选中
selectSome(index) {
return (
this.list[index].children.length > 0 &&
this.list[index].children.some((item) => {
return this.selectActive.includes(item.value);
})
);
},
// 都被选中
selectEvery(index) {
return (
this.list[index].children.length > 0 &&
this.list[index].children.every((item) => {
return this.selectActive.includes(item.value);
})
);
},
},
};
</script>
<style lang="scss" scoped>
.bigwindow-bottom {
width: 40%;
height: 70px;
position: fixed;
bottom: 0;
margin-left: 30%;
display: flex;
// z-index: 1000;
img {
width: 100%;
height: 100%;
position: absolute;
z-index: -1;
bottom: -10px;
}
.listingsSty {
padding-left: 15%;
padding-right: 15%;
box-sizing: border-box;
width: 180%;
display: flex;
justify-content: space-between;
.firsty {
// width: 15%;
min-width: 80px;
height: 35px;
text-align: center;
line-height: 35px;
color: #fff;
font-size: 16px;
cursor: pointer;
&.selectAll {
transition: all 0.5s ease;
&.active {
color: #00ffff;
text-shadow: 0 0 20px rgba(0, 255, 255, 1),
0 0 35px rgb(0, 255, 255, 1);
}
}
&.item {
min-width: 180px;
position: relative;
.itemCompany {
transition: all 0.5s ease;
&.active {
color: #00ffff;
text-shadow: 0 0 20px rgba(0, 255, 255, 0.3),
0 0 35px rgb(0, 255, 255, 0.3);
}
&.activeAll {
color: #00ffff;
text-shadow: 0 0 20px rgba(0, 255, 255, 1),
0 0 35px rgb(0, 255, 255, 1);
}
}
.up-select {
transition: all 0.5s ease;
position: absolute;
bottom: 50px;
left: 0;
width: 100%;
background: rgb(18, 92, 155, 0.3);
overflow: hidden;
&.hide {
height: 0px !important;
}
.selectItem {
transition: all 0.5s ease;
&.active {
color: #00ffff;
text-shadow: 0 0 20px #00ffff, 0 0 35px #00ffff;
}
}
}
}
}
}
}
</style>
zh-baseversion-web/src/views/bigWindow/index.vue
View file @ c1e5c241
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2022-01-11 13:44:17 * @Date: 2022-01-11 13:44:17
* @LastEditTime: 2023-07-12 17:13:16 * @LastEditTime: 2024-07-15 14:29:45
* @LastEditors: 纪泽龙 jizelong@qq.com * @LastEditors: 纪泽龙 jizelong@qq.com
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /test/hello-world/src/views/Home.vue * @FilePath: /test/hello-world/src/views/Home.vue
--> -->
<template> <template>
<div class="home bigwindow" @click='windowClick'> <div class="home bigwindow" @click="windowClick">
<div class="goSystem" @click="$router.push('/index')">进入管理系统</div> <div class="goSystem" @click="$router.push('/index')">进入管理系统</div>
<div id="map"></div> <div id="map"></div>
<!-- <Center :show="show" :centerData="centerData" /> --> <!-- <Center :show="show" :centerData="centerData" /> -->
...@@ -30,7 +30,10 @@ ...@@ -30,7 +30,10 @@
:pageSize="20" :pageSize="20"
/> />
<PipeColor /> <PipeColor />
<PipeSelect @transmit="getPipeSelectMessage" @closeMediumPressureLine="clearBigWindowsSelectPipe"/> <!-- <PipeSelect
@transmit="getPipeSelectMessage"
@closeMediumPressureLine="clearBigWindowsSelectPipe"
/> -->
<!-- 底部按钮 --> <!-- 底部按钮 -->
<!-- <div class="home-div"> <!-- <div class="home-div">
...@@ -54,7 +57,7 @@ ...@@ -54,7 +57,7 @@
</div> </div>
</div> </div>
</div> --> </div> -->
<Bottom v-if="enterpriseId==-2" @listChange="listChange" ref='Bottom'/> <Bottom v-if="enterpriseId == -2" @listChange="listChange" ref="Bottom" />
<!-- 设备按钮 --> <!-- 设备按钮 -->
<div class="typelist-div"> <div class="typelist-div">
<div <div
...@@ -83,18 +86,21 @@ ...@@ -83,18 +86,21 @@
<!-- 头部 --> <!-- 头部 -->
<div class="banner-test"> <div class="banner-test">
<!-- <dv-decoration-5 style="width:100%;height:100%;" /> --> <!-- <dv-decoration-5 style="width:100%;height:100%;" /> -->
<img v-if="this.enterpriseId==-2" src="../../assets/images/zibk.png" alt="" /> <img
v-if="this.enterpriseId == -2"
src="../../assets/images/zibk.png"
alt=""
/>
<img v-else src="../../assets/images/20230805152711.png" alt="" /> <img v-else src="../../assets/images/20230805152711.png" alt="" />
</div> </div>
<!-- 左边 --> <!-- 左边 -->
<div class="leftbar"> <div class="leftbar" :style="changeLeftBarStyle">
<leftBar ref="mychild2"></leftBar> <leftBar ref="mychild2"></leftBar>
</div> </div>
<!-- 右边 --> <!-- 右边 -->
<div class="rightbar"> <div class="rightbar" :style="changeRightBarStyle">
<rightBar ref="mychild"></rightBar> <rightBar ref="mychild"></rightBar>
</div> </div>
<!-- <img src="../../assets/images/leftbk.svg" alt=""> --> <!-- <img src="../../assets/images/leftbk.svg" alt=""> -->
...@@ -150,7 +156,11 @@ ...@@ -150,7 +156,11 @@
import { EditorMap } from "@/utils/mapClass/map"; import { EditorMap } from "@/utils/mapClass/map";
import { mapGetters, mapActions } from "vuex"; import { mapGetters, mapActions } from "vuex";
import { listDetectorInfo } from "@/api/detector/detectorInfo"; import { listDetectorInfo } from "@/api/detector/detectorInfo";
import { detectorUserList,massMarksDetectorUserList,labelsLayerMarksDetectorUserList } from "@/api/detector/detectorUser"; import {
detectorUserList,
massMarksDetectorUserList,
labelsLayerMarksDetectorUserList,
} from "@/api/detector/detectorUser";
import { import {
pipeData, pipeData,
tiaoyaxiang, tiaoyaxiang,
...@@ -171,7 +181,7 @@ import { ...@@ -171,7 +181,7 @@ import {
userAlarm, userAlarm,
getTcqDevice, getTcqDevice,
getYhq, getYhq,
deviceUser deviceUser,
} from "@/api/bigWindow/getDevice"; } from "@/api/bigWindow/getDevice";
import Line from "@/components/bigWindow/Line.vue"; import Line from "@/components/bigWindow/Line.vue";
import VideoView from "@/components/bigWindow/VideoView.vue"; import VideoView from "@/components/bigWindow/VideoView.vue";
...@@ -190,9 +200,9 @@ import { getUserProfile } from "@/api/system/user"; ...@@ -190,9 +200,9 @@ import { getUserProfile } from "@/api/system/user";
import leftBar from "@/components/bigWindow/leftBar.vue"; import leftBar from "@/components/bigWindow/leftBar.vue";
import rightBar from "@/components/bigWindow/rightBar.vue"; import rightBar from "@/components/bigWindow/rightBar.vue";
import Bottom from "./components/Bottom.vue"; import Bottom from "./components/Bottom.vue";
import { mapState } from 'vuex' import { mapState } from "vuex";
import MediumPressureLineVue from '../../components/bigWindow/MediumPressureLine.vue'; import MediumPressureLineVue from "../../components/bigWindow/MediumPressureLine.vue";
import PipeSelect from '../../components/bigWindow/PipeSelect.vue'; import PipeSelect from "../../components/bigWindow/PipeSelect.vue";
export default { export default {
name: "Home", name: "Home",
components: { components: {
...@@ -217,6 +227,8 @@ export default { ...@@ -217,6 +227,8 @@ export default {
nowDate: "", nowDate: "",
nowweek: "", nowweek: "",
nowtime: "", // 当前日期 nowtime: "", // 当前日期
changeRightBarStyle: "",
changeLeftBarStyle: "",
typeList: [ typeList: [
{ {
val: 1, val: 1,
...@@ -300,7 +312,7 @@ export default { ...@@ -300,7 +312,7 @@ export default {
}, },
computed: { computed: {
...mapGetters(["company", "systemSetting","enterpriseId"]), ...mapGetters(["company", "systemSetting", "enterpriseId"]),
companyLength() { companyLength() {
return this.typeList.length; return this.typeList.length;
}, },
...@@ -313,6 +325,12 @@ export default { ...@@ -313,6 +325,12 @@ export default {
} }
}, },
}, },
created() {
window.addEventListener("resize", this.leftRightBarChange);
this.leftRightBarChange();
// changeRightBarStyle
},
async mounted() { async mounted() {
// console.log(99999999999999) // console.log(99999999999999)
// getPipe().then(res=>{ // getPipe().then(res=>{
...@@ -334,10 +352,10 @@ export default { ...@@ -334,10 +352,10 @@ export default {
this this
); );
getUserProfile().then(response => { getUserProfile().then((response) => {
var user = response.data; var user = response.data;
if(user.deptId ==13){ if (user.deptId == 13) {
this.map.setCenter(["117.908541","39.688353"]) this.map.setCenter(["117.908541", "39.688353"]);
} }
}); });
...@@ -369,22 +387,32 @@ export default { ...@@ -369,22 +387,32 @@ export default {
await this.goMap(getEnterprise, this.addDevice, Company, true); await this.goMap(getEnterprise, this.addDevice, Company, true);
// this.goMap(getPipe, this.addPipeLine, Line, true); // this.goMap(getPipe, this.addPipeLine, Line, true);
//管道 //管道
this.goMediumPressureLineMap(getPipe, this.addMediumPipeLine, Line,MediumPressureLineVue, true); this.goMediumPressureLineMap(
getPipe,
this.addMediumPipeLine,
Line,
MediumPressureLineVue,
true
);
//调压箱 //调压箱
this.labelsLayerMarksTysGoMap(getTyx, Device, false); this.labelsLayerMarksTysGoMap(getTyx, Device, false);
//阀门井 //阀门井
this.labelsLayerMarksFmjGoMap(getFm, Device, false); this.labelsLayerMarksFmjGoMap(getFm, Device, false);
//场站 //场站
this.labelsLayerMarksCzGoMap(getCz,Cz, false); this.labelsLayerMarksCzGoMap(getCz, Cz, false);
//监控 //监控
this.labelsLayerMarksVideoGoMap(getVideo,VideoView, false); this.labelsLayerMarksVideoGoMap(getVideo, VideoView, false);
//this.goMap(getYhq, this.addDevice2, yhqUser, false); //液化气用户上图 //this.goMap(getYhq, this.addDevice2, yhqUser, false); //液化气用户上图
if (this.enterpriseId==-2){ if (this.enterpriseId == -2) {
this.labelsLayerMarksDeviceUserGoMap(deviceUser, yhqUser, false); //用户上图 this.labelsLayerMarksDeviceUserGoMap(deviceUser, yhqUser, false); //用户上图
} }
// 用户要等一下 因为有报警数据 // 用户要等一下 因为有报警数据
this.labelsLayerMarksDetectorUserGoMap(labelsLayerMarksDetectorUserList,User, false).then((res) => { this.labelsLayerMarksDetectorUserGoMap(
labelsLayerMarksDetectorUserList,
User,
false
).then((res) => {
// 先查一下，然后开启定时器 // 先查一下，然后开启定时器
this.userAlarm(); this.userAlarm();
this.alarmTimer = setInterval(() => { this.alarmTimer = setInterval(() => {
...@@ -403,17 +431,42 @@ export default { ...@@ -403,17 +431,42 @@ export default {
...mapActions({ ...mapActions({
GetCompany: "bigWindowCompany/GetCompany", GetCompany: "bigWindowCompany/GetCompany",
}), }),
windowClick(){ leftRightBarChange() {
const scale = window.innerHeight / 1080;
let right = 0;
if (scale >= 1) {
right = (585 / 2) * (scale - 1) - 20;
} else {
right = (585 / 2) * (scale - 1) - 20;
}
// console.log("right", right, "scale", scale);
this.changeRightBarStyle = [
{ right: right + "px" },
{ transform: `scale(${scale})` },
];
this.changeLeftBarStyle = [
{ left: right + 20 + "px" },
{ transform: `scale(${scale})` },
];
},
windowClick() {
this.$refs.Bottom.selectUpClear(); this.$refs.Bottom.selectUpClear();
}, },
// 点击了 大屏端 管道搜索的清除键 // 点击了 大屏端 管道搜索的清除键
clearBigWindowsSelectPipe(){ clearBigWindowsSelectPipe() {
this.map.infowindowClose(); this.map.infowindowClose();
}, },
getPipeSelectMessage(data,id) { getPipeSelectMessage(data, id) {
let arrArea = data.split(','); let arrArea = data.split(",");
this.map.setCenter([arrArea[0],arrArea[1]]) this.map.setCenter([arrArea[0], arrArea[1]]);
this.map.filterSelectPipe(id,MediumPressureLineVue,arrArea[0],arrArea[1]); this.map.filterSelectPipe(
id,
MediumPressureLineVue,
arrArea[0],
arrArea[1]
);
}, },
// 管道上图 // 管道上图
addPipeLine(data, component) { addPipeLine(data, component) {
...@@ -424,10 +477,10 @@ export default { ...@@ -424,10 +477,10 @@ export default {
} }
}, },
// 管道上图 // 管道上图
addMediumPipeLine(data, component,mediumComponent) { addMediumPipeLine(data, component, mediumComponent) {
for (let comp in data) { for (let comp in data) {
data[comp].forEach((pipe) => { data[comp].forEach((pipe) => {
this.map.addMediumPipeLine(pipe, component,mediumComponent); this.map.addMediumPipeLine(pipe, component, mediumComponent);
}); });
} }
}, },
...@@ -461,7 +514,13 @@ export default { ...@@ -461,7 +514,13 @@ export default {
}); });
} }
}, },
goMediumPressureLineMap(httpFunc, addFunc, component,mediumComponent, show){ goMediumPressureLineMap(
httpFunc,
addFunc,
component,
mediumComponent,
show
) {
return httpFunc().then((res) => { return httpFunc().then((res) => {
// 给用户加icontype // 给用户加icontype
if (res.data && !res.data[0].iconType) { if (res.data && !res.data[0].iconType) {
...@@ -482,46 +541,41 @@ export default { ...@@ -482,46 +541,41 @@ export default {
} else { } else {
config = { data: res.data || res.rows }; config = { data: res.data || res.rows };
} }
addFunc(config, component, mediumComponent,show); addFunc(config, component, mediumComponent, show);
return config.iconType; return config.iconType;
}); });
}, },
labelsLayerMarksDeviceUserGoMap(httpFunc,component,show){ labelsLayerMarksDeviceUserGoMap(httpFunc, component, show) {
return httpFunc().then((res) => { return httpFunc().then((res) => {
const mapData = res.data; const mapData = res.data;
this.map.labelsLayerMarksDeviceUserGoMap(mapData, component, show); this.map.labelsLayerMarksDeviceUserGoMap(mapData, component, show);
}) });
} },
, labelsLayerMarksVideoGoMap(httpFunc, component, show) {
labelsLayerMarksVideoGoMap(httpFunc,component,show){
return httpFunc().then((res) => { return httpFunc().then((res) => {
const mapData = res.data; const mapData = res.data;
this.map.labelsLayerMarksVideoGoMap(mapData, component, show); this.map.labelsLayerMarksVideoGoMap(mapData, component, show);
}) });
} },
, labelsLayerMarksCzGoMap(httpFunc, component, show) {
labelsLayerMarksCzGoMap(httpFunc,component,show){
return httpFunc().then((res) => { return httpFunc().then((res) => {
const mapData = res.data; const mapData = res.data;
this.map.labelsLayerMarksCzGoMap(mapData, component, show); this.map.labelsLayerMarksCzGoMap(mapData, component, show);
}) });
} },
, labelsLayerMarksFmjGoMap(httpFunc, component, show) {
labelsLayerMarksFmjGoMap(httpFunc,component,show){
return httpFunc().then((res) => { return httpFunc().then((res) => {
const mapData = res.data; const mapData = res.data;
this.map.labelsLayerMarksFmjGoMap(mapData, component, show); this.map.labelsLayerMarksFmjGoMap(mapData, component, show);
}) });
} },
, labelsLayerMarksTysGoMap(httpFunc, component, show) {
labelsLayerMarksTysGoMap(httpFunc,component,show){
return httpFunc().then((res) => { return httpFunc().then((res) => {
const mapData = res.data; const mapData = res.data;
this.map.labelsLayerMarksTysGoMap(mapData, component, show); this.map.labelsLayerMarksTysGoMap(mapData, component, show);
}) });
} },
,
labelsLayerMarksDetectorUserGoMap(httpFunc, component, show) { labelsLayerMarksDetectorUserGoMap(httpFunc, component, show) {
return httpFunc().then((res) => { return httpFunc().then((res) => {
const mapData = res.data; const mapData = res.data;
...@@ -572,9 +626,9 @@ export default { ...@@ -572,9 +626,9 @@ export default {
// }, // },
// 更改下方列表 // 更改下方列表
listChange(arr) { listChange(arr) {
console.log(arr) console.log(arr);
// return; // return;
this.selarr=[...arr] this.selarr = [...arr];
this.map.allfilter(this.selarr, this.selarr1); this.map.allfilter(this.selarr, this.selarr1);
this.map.infowindowClose(); this.map.infowindowClose();
this.show = false; this.show = false;
...@@ -653,7 +707,6 @@ export default { ...@@ -653,7 +707,6 @@ export default {
getTcqDevice(queryParams, title) { getTcqDevice(queryParams, title) {
console.log(queryParams); console.log(queryParams);
return getTcqDevice(queryParams).then((res) => { return getTcqDevice(queryParams).then((res) => {
this.detcetorList = res; this.detcetorList = res;
this.centerUserId = queryParams.devId; this.centerUserId = queryParams.devId;
// 总数据 // 总数据
...@@ -700,6 +753,7 @@ export default { ...@@ -700,6 +753,7 @@ export default {
}, },
// 销毁定时器 // 销毁定时器
beforeDestroy() { beforeDestroy() {
window.removeEventListener("resize",this.leftRightBarChange);
if (this.formatDate) { if (this.formatDate) {
clearInterval(this.formatDate); // 在Vue实例销毁前，清除时间定时器 clearInterval(this.formatDate); // 在Vue实例销毁前，清除时间定时器
} }
...@@ -755,9 +809,13 @@ export default { ...@@ -755,9 +809,13 @@ export default {
.leftbar { .leftbar {
width: 565px; width: 565px;
height: 93%; // height: 93%;
height: 1010px;
position: fixed; position: fixed;
top: 70px; // top: 70px;
top: 50%;
margin-top: -470px;
z-index: 999; z-index: 999;
background: url("../../assets/firstimage/le.png"); background: url("../../assets/firstimage/le.png");
background-size: 105% 100%; background-size: 105% 100%;
...@@ -767,15 +825,15 @@ export default { ...@@ -767,15 +825,15 @@ export default {
} }
.rightbar { .rightbar {
width: 585px; width: 585px;
height: 93%; height: 1010px;
position: fixed; position: fixed;
top: 70px; top: 50%;
margin-top: -470px;
z-index: 999; z-index: 999;
right: 0; // right: 861px;
background: url("../../assets/firstimage/ri.png"); background: url("../../assets/firstimage/ri.png");
background-size: 100% 100%; background-size: 100% 100%;
background-repeat: no-repeat; background-repeat: no-repeat;
margin-right: -20px;
pointer-events: none; pointer-events: none;
} }
.home-div { .home-div {
......
zh-baseversion-web/vue.config.js
View file @ c1e5c241
...@@ -35,8 +35,9 @@ module.exports = { ...@@ -35,8 +35,9 @@ module.exports = {
// detail: https://cli.vuejs.org/config/#devserver-proxy // detail: https://cli.vuejs.org/config/#devserver-proxy
[process.env.VUE_APP_BASE_API]: { [process.env.VUE_APP_BASE_API]: {
target: `http://localhost:8905/gassafety`, // target: `http://localhost:8905/gassafety`,
// target: `http://27.128.233.145:8905/gassafety`, // target: `http://27.128.233.145:8905/gassafety`,
target: ` http://36.138.180.82:8905/gassafety`,
changeOrigin: true, changeOrigin: true,
pathRewrite: { pathRewrite: {
['^' + process.env.VUE_APP_BASE_API]: '' ['^' + process.env.VUE_APP_BASE_API]: ''
......
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