Skip to content

G
gassafety
Commit d19a64a2 authored by jianqian's avatar jianqian
Browse files
Options

Merge remote-tracking branch 'origin/master'

parents 9e821a91 53aad3ff
Show whitespace changes
Inline Side-by-side
Showing with 810 additions and 517 deletions
gassafety-web/package-lock.json
View file @ d19a64a2
This source diff could not be displayed because it is too large. You can view the blob instead.
gassafety-web/src/assets/styles/gassafety.scss
View file @ d19a64a2
......@@ -56,7 +56,7 @@
.el-dialog:not(.is-fullscreen) {
margin-top: 6vh !important;
}
// 全局表格样式
.el-table {
.el-table__header-wrapper,
.el-table__fixed-header-wrapper {
......@@ -104,6 +104,15 @@
}
// gis地图中底部table样式
.drawer {
// .el-button {
// color:red;
// .is-disabled {
// background-color: none;
// }
// }
}
.right-bottom-data-left {
.el-table {
background-color: rgba(0, 0, 0, 0) !important;
......@@ -118,11 +127,11 @@
.el-table__header-wrapper,
.el-table__fixed-header-wrapper {
tr {
background-color: #213b5260 !important;
background-color: #213b52cc !important;
}
th {
word-break: break-word;
background-color: #213b5260 !important;
background-color: #213b52cc !important;
color: rgba(123, 248, 244, 1);
height: 30px;
font-size: 13px;
......@@ -134,13 +143,7 @@
}
.el-table__body-wrapper {
.el-table__row:nth-child(2n + 1) {
// background-color: #e6e6e6;
background-color: #213b5260;
// &:hover {
// td {
// background-color: #f4f4f4;
// }
// }
background-color: #213b52b3;
&:hover td {
background-color: #7bf8f430 !important;
}
......@@ -152,20 +155,12 @@
}
}
.el-table__row:nth-child(2n) {
// background-color: #213b52;
background-color: #06315760;
// &:hover {
// td {
// background-color: #e6e6e6;
// }
// }
background-color: #063157cc;
&:hover td {
background-color: #7bf8f430 !important;
}
td {
.cell {
// color: #053b6a;
color: #fff;
}
}
......@@ -388,6 +383,55 @@
}
}
// 设备巡检详情页表格样式
.inspectiondetail {
.el-table {
.el-table__header-wrapper,
.el-table__fixed-header-wrapper {
th {
word-break: break-word;
background-color: #1181e8;
color: #fff;
height: 40px;
font-size: 14px;
}
}
.el-table__body-wrapper {
.el-table__row:nth-child(2n + 1) {
background-color: #e6e6e6;
// &:hover {
// td {
// background-color: #f4f4f4;
// }
// }
td {
.cell {
color: #053b6a;
}
}
}
.el-table__row:nth-child(2n) {
background-color: #f4f4f4;
// &:hover {
// td {
// background-color: #e6e6e6;
// }
// }
td {
.cell {
color: #053b6a;
}
}
}
}
.el-table__body-wrapper {
.el-button [class*="el-icon-"] + span {
margin-left: 1px;
}
}
}
}
.ddd {
overflow: hidden;
text-overflow: ellipsis;
......
gassafety-web/src/components/PopWindow/flowMeter.vue
View file @ d19a64a2
......@@ -12,7 +12,9 @@
<el-select
v-model="form.pipeId"
placeholder="请选择所属管道"
filterable
style="width: 100%"
@change="selectChange"
>
<el-option
v-for="item in pipeList"
......@@ -200,6 +202,10 @@ export default {
MyFileUpload,
},
methods: {
selectChange(e){
const arr = this.pipeList.filter(item=>item.pipeId == e);
this.form.pipeName = arr[0].pipeName;
},
show() {
this.dialogVisible = true;
},
......@@ -210,7 +216,7 @@ export default {
this.form.iconUrl = res.url;
},
submitForm() {
console.log(this.form);
// console.log("this.form",this.form);
this.$refs["form"].validate((valid) => {
if (valid) {
if (this.form.deviceId != null) {
......
gassafety-web/src/components/PopWindow/lineInfoWindow.vue
View file @ d19a64a2
<template>
<div class="wrapper">
<div class="top display-default">
<div class="left text">{{ obj.pipeName }}</div>
<div class="left text ddd" :title="obj.pipeName">{{ obj.pipeName }}</div>
<div class="right text">
<img @click="close" src="../../assets/images/closeBtn.png" alt="" />
</div>
......@@ -132,27 +132,30 @@ export default {
.wrapper {
width: 406px;
// height: 488px;
background: #fff;
// background: #fff;
border-radius: 4px;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
background: rgba(7, 29, 51, 0.9);
color: #fff;
// overflow: hidden;
.top {
width: 100%;
height: 51px;
// background-color: #053b6a;
background-image: url(../../assets/images/blueTopBg.png);
background-size: 100% 100%;
background-position: center;
&:before {
content: "";
position: absolute;
left: -20px;
top: 5px;
width: 0px;
height: 0px;
/* border: 20px solid red; */
border-top: 15px solid transparent;
border-bottom: 15px solid transparent;
/* border-left: 50px solid greenyellow; */
border-right: 30px solid #053b6a;
z-index: -1;
width: 33px;
height: 33px;
background-image: url(../../assets/images/blueLeftTriangle.png);
}
.top {
width: 100%;
height: 51px;
background-color: #053b6a;
.text {
font-weight: 600;
font-size: 16px;
......@@ -187,7 +190,7 @@ export default {
.eq-text {
font-size: 14px;
font-weight: 400;
color: #1d1d1d;
color: #fff;
opacity: 1;
& > span {
vertical-align: top;
......
gassafety-web/src/components/PopWindow/markerInfoWindow.vue
View file @ d19a64a2
......@@ -2,7 +2,7 @@
<div class="wrapper">
<span class="dot-left"></span>
<div class="top display-default">
<div class="left text">{{ data.deviceName }}</div>
<div class="left text ddd" :title="data.deviceName">{{ data.deviceName }}</div>
<div class="right text">
<img
src="../../assets/images/closeBtn.png"
......@@ -51,8 +51,8 @@
</el-col>
<div>
<span>管道所在地址：</span>
<span>{{ data.pipeAddr }}</span>
<span>设备所在地址：</span>
<span>{{ data.deviceAddr }}</span>
</div>
<div>
<span>备注信息：</span>
......@@ -88,26 +88,28 @@ export default {
.wrapper {
width: 406px;
// height: 488px;
background: #fff;
border-radius: 4px;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
// background: #fff;
// overflow: hidden;
background: rgba(7, 29, 51, 0.9);
color: #fff;
.top {
width: 100%;
height: 51px;
background-color: #053b6a;
background-image: url(../../assets/images/blueTopBg.png);
background-size: 100% 100%;
background-position: center;
color: #fff;
&:before {
content: "";
position: absolute;
left: -20px;
top: 5px;
width: 0px;
height: 0px;
/* border: 20px solid red; */
border-top: 15px solid transparent;
border-bottom: 15px solid transparent;
/* border-left: 50px solid greenyellow; */
border-right: 30px solid #053b6a;
z-index: -1;
width: 33px;
height: 33px;
background-image: url(../../assets/images/blueLeftTriangle.png);
}
.text {
font-weight: 600;
......@@ -143,7 +145,7 @@ export default {
.eq-text {
font-size: 14px;
font-weight: 400;
color: #1d1d1d;
color: #fff;
opacity: 1;
& > span {
vertical-align: top;
......
gassafety-web/src/components/PopWindow/pipelineView.vue
View file @ d19a64a2
......@@ -349,7 +349,6 @@ export default {
// 图片列表移除
listRemove(e) {
this.editForm.iconUrl = "";
this.fileArr = [];
},
},
......
gassafety-web/src/components/PopWindow/pressureGage.vue
View file @ d19a64a2
......@@ -12,7 +12,9 @@
<el-select
v-model="form.pipeId"
placeholder="请选择所属管道"
filterable
style="width: 100%"
@change="selectChange"
>
<el-option
v-for="item in pipeList"
......@@ -201,6 +203,10 @@ export default {
MyFileUpload,
},
methods: {
selectChange(e){
const arr = this.pipeList.filter(item=>item.pipeId == e);
this.form.pipeName = arr[0].pipeName;
},
show() {
this.dialogVisible = true;
},
......
gassafety-web/src/components/PopWindow/regulatorBox.vue
View file @ d19a64a2
......@@ -12,7 +12,9 @@
<el-select
v-model="form.pipeId"
placeholder="请选择所属管道"
filterable
style="width: 100%"
@change="selectChange"
>
<el-option
v-for="item in pipeList"
......@@ -176,9 +178,9 @@ export default {
deviceAddr: [
{ required: true, message: "请输入所在地址", trigger: "blur" },
],
iotNo: [
/* iotNo: [
{ required: true, message: "请输入物联网编号", trigger: "blur" },
],
],*/
linkman: [{ required: true, message: "请输入联系人", trigger: "blur" }],
phone: [
{ required: true, message: "请输入联系电话", trigger: "blur" },
......@@ -200,6 +202,10 @@ export default {
MyFileUpload,
},
methods: {
selectChange(e){
const arr = this.pipeList.filter(item=>item.pipeId == e);
this.form.pipeName = arr[0].pipeName;
},
show() {
this.dialogVisible = true;
//this.getPipeInfo();
......
gassafety-web/src/components/PopWindow/valveWell.vue
View file @ d19a64a2
......@@ -12,7 +12,9 @@
<el-select
v-model="form.pipeId"
placeholder="请选择所属管道"
filterable
style="width: 100%"
@change="selectChange"
>
<el-option
v-for="item in pipeList"
......@@ -174,9 +176,9 @@ export default {
deviceAddr: [
{ required: true, message: "请输入所在地址", trigger: "blur" },
],
iotNo: [
/* iotNo: [
{ required: true, message: "请输入物联网编号", trigger: "blur" },
],
],*/
linkman: [{ required: true, message: "请输入联系人", trigger: "blur" }],
phone: [
{ required: true, message: "请输入联系电话", trigger: "blur" },
......@@ -198,6 +200,10 @@ export default {
MyFileUpload,
},
methods: {
selectChange(e){
const arr = this.pipeList.filter(item=>item.pipeId == e);
this.form.pipeName = arr[0].pipeName;
},
show() {
this.dialogVisible = true;
},
......
gassafety-web/src/components/PopWindowGis/lineInfoWindow.vue
View file @ d19a64a2
......@@ -151,9 +151,9 @@ export default {
.wrapper {
width: 406px;
max-height: 430px;
background: rgba(7, 29, 51, 0.9);
border-radius: 4px;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
background: rgba(7, 29, 51, 0.9);
color: #fff;
// overflow: hidden;
......
gassafety-web/src/components/PopWindowGis/markerInfoWindow.vue
View file @ d19a64a2
......@@ -47,7 +47,7 @@
</el-col>
<div>
<span>管道所在地址：</span>
<span>设备所在地址：</span>
<span>{{ data.pipeAddr }}</span>
</div>
<div>
......
gassafety-web/src/components/PopWindowGis/markerInfoWindowWarn.vue
View file @ d19a64a2
......@@ -49,7 +49,7 @@
</el-col>
<div>
<span>管道所在地址：</span>
<span>设备所在地址：</span>
<span>{{ data.pipeAddr }}</span>
</div>
<div>
......
gassafety-web/src/components/PopWindowGis/workerManView.vue
View file @ d19a64a2
......@@ -5,16 +5,6 @@
:before-close="handleClose"
>
<el-form :model="formData" ref="formData" :rules="rules">
<!-- <el-form-item label="选择时间段:" prop=""> -->
<!-- <el-date-picker
v-model="dateValue"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker> -->
<!-- </el-form-item> -->
<el-row>
<el-col :span="11">
<el-form-item label="选择值班人员:" prop="userId">
......@@ -37,10 +27,23 @@
</el-col>
</el-row>
<el-row>
<el-col>
<el-form-item label="请选择时间段" prop="changeTime">
<el-radio-group v-model="formData.changeTime" @change="radioChange">
<el-radio :label="1">最近2小时</el-radio>
<el-radio :label="2">最近24小时</el-radio>
<el-radio :label="3">自定义时间段</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="11">
<el-form-item label="选择开始时间:" prop="beginTime">
<el-date-picker
:disabled="formData.changeTime != 3"
v-model="formData.beginTime"
type="datetime"
placeholder="选择开始时间"
......@@ -51,6 +54,7 @@
<el-col :span="11">
<el-form-item label="选择结束时间:" prop="endTime">
<el-date-picker
:disabled="formData.changeTime != 3"
v-model="formData.endTime"
type="datetime"
placeholder="选择结束时间"
......@@ -97,13 +101,24 @@ export default {
okLoading: false,
formData: {
userId: null,
changeTime: 1,
beginTime: "",
endTime: "",
},
changeTime: null,
workerManArr: [],
rules: {
userId: [
{ required: true, message: "请选择值班人员", trigger: "blur" },
],
changeTime: [
{
required: true,
message: "选择查询时间",
trigger: ["blur", "change"],
},
],
beginTime: [
{ required: true, message: "请输入开始时间", trigger: "blur" },
],
......@@ -120,6 +135,8 @@ export default {
label: item.nickName,
value: item.userId,
}));
this.formData.beginTime = moment().format("YYYY-MM-DD HH:mm:ss");
this.formData.endTime = moment().add(2, "h").format("YYYY-MM-DD HH:mm:ss");
},
methods: {
......@@ -128,6 +145,22 @@ export default {
console.log(e);
this.formData.userId = e;
},
radioChange(e) {
if (e == 1) {
this.formData.beginTime = moment().format("YYYY-MM-DD HH:mm:ss");
this.formData.endTime = moment()
.add(2, "h")
.format("YYYY-MM-DD HH:mm:ss");
} else if (e == 2) {
this.formData.beginTime = moment().format("YYYY-MM-DD HH:mm:ss");
this.formData.endTime = moment()
.add(1, "d")
.format("YYYY-MM-DD HH:mm:ss");
} else {
this.formData.beginTime = "";
this.formData.endTime = "";
}
},
ok() {
this.$refs.formData.validate((valid) => {
if (valid) {
......@@ -135,24 +168,24 @@ export default {
moment(this.formData.beginTime).valueOf() >
moment(this.formData.endTime).valueOf()
) {
this.msgError(
"开始时间不能大于结束时间"
);
this.msgError("开始时间不能大于结束时间");
this.formData.endTime = "";
return;
}
this.okLoading = true;
if (this.formData.changeTime != 3) {
this.radioChange(this.formData.changeTime);
} else {
this.formData.beginTime = moment(this.formData.beginTime).format(
"YYYY-MM-DD HH:mm:ss"
);
this.formData.endTime = moment(this.formData.endTime).format(
"YYYY-MM-DD HH:mm:ss"
);
}
console.log(this.formData);
// console.log(this.formData);
// 找到哪个值班人员
const target = this.gaodeMap.workerManMarkArr.filter((item) => {
// console.log("userId",item.getExtData().userId)
......
gassafety-web/src/components/mapDialog/checkPipeLineLocation.vue
View file @ d19a64a2
......@@ -15,8 +15,6 @@
<el-button type="primary" size="small" @click="confirmFun">确定</el-button>
<el-button size="small" @click="$emit('dialogcancelFun')">取消</el-button>
</el-row>
</el-dialog>
</template>
<script>
......
gassafety-web/src/utils/gaodeMap.js
View file @ d19a64a2
import createPop from "./createPop";
import { lineColor } from "./mapCommon.js";
import regulatorBox from "../components/PopWindow/regulatorBox.vue";
import valveWell from "../components/PopWindow/valveWell.vue";
import flowMeter from "../components/PopWindow/flowMeter.vue";
......@@ -9,6 +10,7 @@ import { delDeviceInfo, updateDeviceInfo } from "@/api/device/deviceInfo";
import markerInfoWindow from "../components/PopWindow/markerInfoWindow.vue";
import { getArray } from "@/utils/gassafety.js";
import { delPipe, updatePipe } from "@/api/device/pipe.js";
import vue from "../main";
let defaultCenter = "石家庄";
export let map;
......@@ -54,6 +56,7 @@ class gaodeMap {
// labelzIndex: 110,
pitch: 8,
zoom: 9,
mapStyle: "amap://styles/1c84d2203793b0f622df2cda53db1afd"
// mapStyle: 'amap://styles/darkblue',
// mapStyle: 'amap://styles/3b679a15f448a4740ba2ff7524e1a4ae',
});
......@@ -77,7 +80,7 @@ class gaodeMap {
this.createNewLine();
console.log("map点击事件新建");
})
.catch(() => { });
.catch(() => {});
}
// console.log("抬起来了");
});
......@@ -95,6 +98,7 @@ class gaodeMap {
// 地图开始缩放删除infowindow
this.myMap.on("zoomstart", () => {
this.closeInfoWindow();
this.polyLinesColorClear();
});
this.myMap.on("moveend", () => {
if (this.handleInfoWindowOpenFunc) {
......@@ -116,7 +120,7 @@ class gaodeMap {
let options = this.myMap.getStatus();
options.scrollWheel = true;
this.myMap.setStatus(options);
console.log("飞行结束")
console.log("飞行结束");
});
this.districtBoundaries(latlng);
......@@ -124,6 +128,20 @@ class gaodeMap {
panTo(lnglat) {
this.myMap.panTo(lnglat);
}
changeMap(bool) {
// 卫星图
if (!bool) {
if (this.satellite) return;
this.satellite = new AMap.TileLayer.Satellite();
this.myMap.addLayer(this.satellite);
} else {
if (this.satellite) {
this.myMap.removeLayer(this.satellite);
this.satellite = null;
}
}
}
/**
* 获取map
* @returns {AMap.Map}
......@@ -157,9 +175,8 @@ class gaodeMap {
level: "city"
};
let district = new AMap.DistrictSearch(opts);
district.search(that.center, function (status, result) {
district.search(that.center, function(status, result) {
if (status == "complete") {
let defaultCenter = [];
defaultCenter.push(result.districtList[0].center.lng);
defaultCenter.push(result.districtList[0].center.lat);
......@@ -169,7 +186,7 @@ class gaodeMap {
map.setCenter(defaultCenter);
}
console.log("defaultCenter", defaultCenter)
console.log("defaultCenter", defaultCenter);
let bounds = result.districtList[0].boundaries;
for (let i = 0; i < bounds.length; i += 1) {
......@@ -199,12 +216,12 @@ class gaodeMap {
offset: new AMap.Pixel(24, -38),
anchor: "left-top"
});
infoWindow.on("mouseover", function () {
infoWindow.on("mouseover", function() {
let options = map.getStatus();
options.scrollWheel = false;
map.setStatus(options);
});
infoWindow.on("mouseout", function () {
infoWindow.on("mouseout", function() {
let options = map.getStatus();
options.scrollWheel = true;
map.setStatus(options);
......@@ -234,7 +251,7 @@ class gaodeMap {
editWindow.obj = marker;
editWindow.gaoMap = that;
editWindow.map = map;
marker.on("click", function (e) {
marker.on("click", function(e) {
if ("edit" == that.mapOperateType) {
editWindow.form = e.target.getExtData();
editWindow.show();
......@@ -296,19 +313,19 @@ class gaodeMap {
infoWindow.open(map, e.target.getPosition());
}*/
});
marker.on("dragend", function (e) {
marker.on("dragend", function(e) {
editWindow.form.longitude = e.lnglat.lng;
editWindow.form.latitude = e.lnglat.lat;
});
} else {
marker.on("mouseover", function () {
marker.on("mouseover", function() {
marker.setLabel({
offset: new AMap.Pixel(0, -10), //设置文本标注偏移量
content: "<div class='info'>" + data.deviceName + "</div>", //设置文本标注内容
direction: "top" //设置文本标注方位
});
});
marker.on("mouseout", function () {
marker.on("mouseout", function() {
marker.setLabel({
content: null
});
......@@ -447,7 +464,7 @@ class gaodeMap {
case DEVICE_TYPE.REGEULATORBOX: {
let icon = new AMap.Icon({
//size: new AMap.Size(51, 23),
image: require("../assets/oldImages/tiaoyaxiang.png")
image: require("../assets/images/tiaoyaxiang.png")
});
marker.setIcon(icon);
break;
......@@ -455,7 +472,7 @@ class gaodeMap {
case DEVICE_TYPE.VALUEWELL: {
let icon = new AMap.Icon({
//size: new AMap.Size(51, 23),
image: require("../assets/oldImages/famenjing.png")
image: require("../assets/images/famenjing.png")
});
marker.setIcon(icon);
break;
......@@ -463,7 +480,7 @@ class gaodeMap {
case DEVICE_TYPE.FLOWMETER: {
let icon = new AMap.Icon({
//size: new AMap.Size(51, 23),
image: require("../assets/oldImages/liuliangji.png")
image: require("../assets/images/liuliangji.png")
});
marker.setIcon(icon);
break;
......@@ -487,7 +504,7 @@ class gaodeMap {
case DEVICE_TYPE.PRESSUREGAGE: {
let icon = new AMap.Icon({
//size: new AMap.Size(51, 23),
image: require("../assets/oldImages/yalibiao.png")
image: require("../assets/images/yalibiao.png")
});
marker.setIcon(icon);
break;
......@@ -512,7 +529,7 @@ class gaodeMap {
console.log("包装的数组", arr);
for (let i = 0; i < arr.length; i++) {
const item = arr[i];
let { coordinates } = item;
let { coordinates, pipePressure } = item;
// console.log("coordinates",coordinates)
// let path = coordinates ? getArray(coordinates) :[];
// 字符串转二维数组
......@@ -520,7 +537,7 @@ class gaodeMap {
let path = coordinates ? eval(coordinates) : [];
let polyline = new AMap.Polyline({
path,
strokeColor: "#2EE7E7",
strokeColor: lineColor[pipePressure],
strokeWeight: 4,
strokeOpacity: 0.9,
zIndex: 50,
......@@ -575,7 +592,9 @@ class gaodeMap {
this.polyLinesColorClear(polyline);
});
polyline.on("mouseout", e => {
polyline.setOptions({ strokeColor: "#2EE7E7" });
// polyline.setOptions({ strokeColor: "#2EE7E7" });
polyline.setOptions({ strokeColor: lineColor[pipePressure] });
// infoWindow.close();
});
// 计算info的位置
......@@ -695,7 +714,9 @@ class gaodeMap {
polyLinesColorClear(polylines) {
this.polyLines.forEach(item => {
if (item != polylines) {
item.setOptions({ strokeColor: "#2EE7E7" });
const { pipePressure } = item.getExtData().lineData;
// item.setOptions({ strokeColor: "#2EE7E7" });
item.setOptions({ strokeColor: lineColor[pipePressure] });
}
});
}
......@@ -898,12 +919,14 @@ class gaodeMap {
this.polyLines.forEach(item => {
item.polyEditor.close();
let opstions = item.getExtData();
const { pipePressure } = opstions.lineData;
opstions.isState = 0;
item.setExtData(opstions);
let attr = item.getOptions();
// attr.strokeColor = "#F7FE38";
attr.strokeColor = "#2EE7E7";
attr.strokeColor = lineColor[pipePressure];
item.setOptions(attr);
});
}
......@@ -952,14 +975,14 @@ class gaodeMap {
this.overlays = [];
let that = this;
this.markerOverlays = [];
this.mouseTool.on("draw", function (e) {
this.mouseTool.on("draw", function(e) {
if (e.obj.getExtData().type != "newLine") {
map.remove(that.markerOverlays);
const device = that.createInfowindow("新增");
device.map = map;
device.obj = e.obj;
device.gaoMap = that;
e.obj.on("click", function (aa) {
e.obj.on("click", function(aa) {
let postion = aa.target._position;
//兼容拖拽后单击事件，拖拽后点击事件返回位置为数组
if (postion instanceof Array) {
......@@ -971,11 +994,11 @@ class gaodeMap {
}
device.show();
});
e.obj.on("mouseover", function () {
e.obj.on("mouseover", function() {
that.mouseTool.close();
});
e.obj.on("mouseout", function () {
e.obj.on("mouseout", function() {
that.draw(that.deviceType);
});
......@@ -1086,7 +1109,7 @@ class gaodeMap {
"AMap.MapType",
"AMap.Geolocation"
],
function () {
function() {
// 在图面添加工具条控件，工具条控件集成了缩放、平移、定位等功能按钮在内的组合控件
//map.addControl(new AMap.ToolBar());
......@@ -1109,7 +1132,7 @@ class gaodeMap {
searchTips(inputId) {
let that = this;
AMap.plugin(["AMap.AutoComplete", "AMap.PlaceSearch"], function () {
AMap.plugin(["AMap.AutoComplete", "AMap.PlaceSearch"], function() {
//输入提示
// var autoOptions = {
// input: inputId
......@@ -1170,7 +1193,10 @@ class gaodeMap {
const path1 = eval(coordinates)[0];
const path2 = eval(coordinates)[1];
// map.setFitView();
const path3 = [(Number(path1[0])+Number(path2[0]) )/2 ,(Number(path1[1])+Number(path2[1]) )/2];
const path3 = [
(Number(path1[0]) + Number(path2[0])) / 2,
(Number(path1[1]) + Number(path2[1])) / 2
];
map.setCenter(path3, false);
// const lntlat = eval(coordinates)[0];
......
gassafety-web/src/utils/gaodeMapView.js
View file @ d19a64a2
......@@ -15,6 +15,7 @@ import workerManInfowindow from "../components/PopWindowGis/workerManInfowindow.
import workerManView from "../components/PopWindowGis/workerManView.vue";
import { getArray } from "@/utils/gassafety.js";
import { lineColor } from "./mapCommon.js";
import { delPipe } from "@/api/device/pipe.js";
import vue from "../main";
import { Card } from "element-ui";
......@@ -32,6 +33,7 @@ export const DEVICE_TYPE = {
SMALLINSPECTOR: "workPoint",
TROUBLE: "trouble"
};
class gaodeMap {
// 所有线的数组
polyLines = [];
......@@ -112,6 +114,8 @@ class gaodeMap {
this.myMap.on("zoomstart", () => {
// console.log("缩放开始")
this.closeInfoWindow();
this.polyLinesColorClear()
});
this.myMap.on("moveend", () => {
if (this.handleInfoWindowOpenFunc) {
......@@ -284,7 +288,7 @@ class gaodeMap {
marker.on("mouseover", this.wokerManOpen);
marker.on("mouseout", e => {
e.target.infoWindow.close();
this.domAllShow()
this.domAllShow();
});
marker.on("mousedown", e => {
......@@ -805,14 +809,15 @@ class gaodeMap {
//console.log("包装的数组", arr);
for (let i = 0; i < arr.length; i++) {
const item = arr[i];
let { coordinates } = item;
let { coordinates, pipePressure } = item;
console.log(pipePressure);
// //console.log("coordinates",coordinates)
// let path = coordinates ? getArray(coordinates) :[];
// 字符串转二维数组
let path = coordinates ? eval(coordinates) : [];
let polyline = new AMap.Polyline({
path,
strokeColor: "#2EE7E7",
strokeColor: lineColor[pipePressure],
strokeWeight: 4,
strokeOpacity: 0.9,
zIndex: 50,
......@@ -834,6 +839,8 @@ class gaodeMap {
//添加事件
polyline.on("mousedown", this.polylineMouseOver);
polyline.on("mouseover", () => {
// lineColor
polyline.setOptions({ strokeColor: "#F7FE38" });
});
polyline.on("mouseout", e => {
......@@ -841,7 +848,7 @@ class gaodeMap {
if (polyline.getExtData().lineData.alarmState == 1) {
polyline.setOptions({ strokeColor: "#ff0000" });
} else {
polyline.setOptions({ strokeColor: "#2EE7E7" });
polyline.setOptions({ strokeColor: lineColor[pipePressure] });
}
// infoWindow.close();
});
......@@ -935,7 +942,8 @@ class gaodeMap {
if (item.getExtData().lineData.alarmState == 1) {
item.setOptions({ strokeColor: "#ff0000" });
} else {
item.setOptions({ strokeColor: "#2EE7E7" });
const { pipePressure } = item.getExtData().lineData;
item.setOptions({ strokeColor: lineColor[pipePressure] });
}
}
});
......
gassafety-web/src/utils/mapCommon.js 0 → 100644
View file @ d19a64a2
// 管道压力（1低压，2中压，3次高压，4高压） 颜色不同
export const lineColor ={
"1":"#2EE7E7",
"2":"#FFFFFF",
"3":"#18FF0F",
"4":"#DE67FA"
}
\ No newline at end of file
gassafety-web/src/views/device/deviceInfo/index.vue
View file @ d19a64a2
......@@ -193,8 +193,8 @@
</el-col>
<el-col :span="12">
<el-form-item label="物联网编号" prop="iotNo">
<el-input v-model="form.iotNo" placeholder="请输入物联网编号" />
<el-form-item label="物联网编号" prop="iotNo" :rules="form.deviceType == 3 || form.deviceType == 4 ? {required: true, message: '请输入物联网编号', trigger: 'blur'}:{required:false}">
<el-input v-model="form.iotNo" placeholder="请输入物联网编号"/>
</el-form-item>
</el-col>
......@@ -374,9 +374,9 @@
longitude: [
{ required: true, message: "请输入经纬度", trigger: "blur" },
],
iotNo: [
/*iotNo: [
{ required: true, message: "请输入物联网编号", trigger: "blur" },
],
],*/
linkman: [
{ required: true, message: "请输入联系人", trigger: "blur" }
],
......
gassafety-web/src/views/device/map/index.vue
View file @ d19a64a2
......@@ -103,6 +103,31 @@
:class="{ back: backFlag, opacity: drawerOpacity }"
@click.stop="drawerdrawer"
>
<div class="mapChange">
<div :class="{ active: !mapStyle }" @click="mapChange(1)">卫星地图</div>
<div :class="{ active: mapStyle }" @click="mapChange(2)">全景地图</div>
</div>
<div class="pipePressure">
<!-- <div>管道压力</div> -->
<div class="hasColorBox" :style="{ color: lineColor[`1`] }">
<div :style="{ backgroundColor: lineColor[`1`] }"></div>
低压
</div>
<div class="hasColorBox" :style="{ color: lineColor[`2`] }">
<div :style="{ backgroundColor: lineColor[`2`] }"></div>
中压
</div>
<div class="hasColorBox" :style="{ color: lineColor[`3`] }">
<div :style="{ backgroundColor: lineColor[`3`] }"></div>
次高压
</div>
<div class="hasColorBox" :style="{ color: lineColor[`4`] }">
<div :style="{ backgroundColor: lineColor[`4`] }"></div>
高压
</div>
</div>
<div class="switch" @click="backFlag = !backFlag">
<img v-if="!backFlag" src="@/assets/images/l.png" alt="" />
<img v-else src="@/assets/images/r.png" alt="" />
......@@ -213,7 +238,7 @@
</template>
<!-- 无数据 -->
<template v-else>
<div style="padding-left: 5px">暂无数据</div>
<div style="padding-left: 5px; color: #fff">暂无数据</div>
</template>
</div>
</el-collapse-transition>
......@@ -228,6 +253,8 @@ import gaodeMap from "utils/gaodeMap.js";
import { pipeAllInfoList } from "@/api/device/pipe.js";
import { map, DEVICE_TYPE, mapOperateType } from "utils/gaodeMap.js";
import { getAllDeviceInfo } from "@/api/device/deviceInfo";
import { lineColor } from "@/utils/mapCommon.js";
export default {
data() {
return {
......@@ -238,8 +265,11 @@ export default {
radio1: "",
// 1新建，2编辑，3删除,点按钮变色
targetNum: 0,
lineColor,
backFlag: true,
// 卫星与全景地图的切换
mapStyle: true,
// 抽屉内的滚动条的高需要赋值赋值
boxHeight: "",
boxWidth: "",
......@@ -307,7 +337,7 @@ export default {
},
methods: {
onResize() {
this.boxHeight = document.body.clientHeight - 81;
this.boxHeight = document.body.clientHeight - 80;
this.boxWidth = document.body.clientWidth - 100;
},
async initMap() {
......@@ -371,6 +401,15 @@ export default {
this.gaoMap.markerShow(4, false);
}
},
// 卫星地图与全景地图的切换
mapChange(num) {
if (num == 1) {
this.mapStyle = false;
} else {
this.mapStyle = true;
}
this.gaoMap.changeMap(this.mapStyle);
},
addDevice() {
if (this.iconClass == "icon-create") {
this.targetNum = this.targetNum != 1 ? 1 : 0;
......@@ -1116,7 +1155,9 @@ input[type="radio"] {
left: 100px;
width: 348px;
transition: 0.2s linear;
background: #fff;
// background: #fff;
background: rgba(6, 29, 51, 0.8);
// background: red;
opacity: 0;
&.opacity {
......@@ -1125,6 +1166,42 @@ input[type="radio"] {
&.back {
left: -248px;
}
.mapChange {
right: -178px;
top: 10px;
color: #fff;
position: absolute;
display: flex;
div {
padding: 4px 8px;
border: 1px solid #fff;
margin-left: 8px;
cursor: pointer;
&.active,
&:hover {
background-color: #053b6a;
color: #31eaea;
}
}
}
.pipePressure {
position: absolute;
color: #fff;
right: -80px;
top: 50px;
padding: 1px;
// background: rgba(6, 29, 51, 0.8);
.hasColorBox {
// border: 1px solid #053b6a;
padding: 2px 5px;
margin-bottom: 5px;
& > div {
display: inline-block;
width: 10px;
height: 10px;
}
}
}
.scroll {
// height: 100%;
position: relative;
......@@ -1188,7 +1265,9 @@ input[type="radio"] {
// border-right: 1px solid #cccccc;
box-sizing: border-box;
// padding-left: 5px;
color: #053b6a;
// color: #053b6a;
color: #fff;
font-weight: 600;
}
}
......@@ -1200,9 +1279,14 @@ input[type="radio"] {
color: #1d1d1d;
&:hover {
box-sizing: border-box;
border-bottom: 1px solid #053b6a;
color: #053b6a;
// border-bottom: 1px solid #053b6a;
border-bottom: 1px solid #7fc0f8;
// color: #053b6a;
font-weight: 600;
> div {
color: #7fc0f8;
}
}
&.topActive {
// border-top: 1px solid #cccccc;
......@@ -1219,6 +1303,8 @@ input[type="radio"] {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: #fff;
// border-right: 1px solid #cccccc;
}
}
......@@ -1242,14 +1328,16 @@ input[type="radio"] {
height: 48px;
padding-left: 20px;
display: flex;
background-color: #ffffff;
// background-color: #ffffff;
box-sizing: border-box;
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
border-bottom: 1px solid rgba(0, 0, 0, 0.5);
cursor: pointer;
position: relative;
// box-sizing: border-box;
&.firstbox {
border-top: 1px solid rgba(0, 0, 0, 0.1);
// border-top: 1px solid rgba(0, 0, 0, 0.1);
border-top: 1px solid rgba(5, 59, 106, 0);
// box-sizing: border-box;
&:hover {
border-top: 1px solid rgba(5, 59, 106, 0);
......@@ -1257,15 +1345,24 @@ input[type="radio"] {
}
&:hover {
box-sizing: border-box;
background-color: rgba(5, 59, 106, 0.1);
// background-color: rgba(5, 59, 106, 0.1);
background-color: #053b6a;
border-bottom: none !important;
.upPic {
color: #31eaea;
}
.left,
.right {
color: #31eaea !important;
}
}
.upPic {
display: inline-block;
margin-left: 40px;
line-height: 48px;
font-size: 16px;
color: #053b6a;
// color: #053b6a;
color: #fff;
}
> i.ju {
position: absolute;
......@@ -1289,6 +1386,7 @@ input[type="radio"] {
color: #fff;
}
> i.arrow-right {
color: #fff !important;
position: absolute;
right: 32px;
top: 16px;
......@@ -1299,16 +1397,21 @@ input[type="radio"] {
}
&.active {
// background-color: #053b6a;
.left,
.right {
color: #053b6a;
}
// .left,
// .right {
// color: #053b6a;
// }
// > i {
// color: #053b6a;
// }
> i {
color: #053b6a;
color: #31eaea;
font-weight: 600;
}
}
.left {
color: #053b6a;
// color: #053b6a;
color: #fff;
line-height: 48px;
margin-left: 28px;
.iconfont {
......@@ -1316,7 +1419,8 @@ input[type="radio"] {
}
}
.right {
color: #1d1d1d;
// color: #1d1d1d;
color: #fff;
line-height: 48px;
font-size: 16px;
margin-left: 4px;
......@@ -1337,6 +1441,8 @@ input[type="radio"] {
padding-bottom: 2px;
.btn {
border-radius: 50%;
background: none;
// width: 14px;
// height: 14px;
padding: 2px;
......@@ -1345,6 +1451,7 @@ input[type="radio"] {
display: inline-block;
font-size: 14px;
padding: 0px 5px;
color: #fff;
}
}
}
......@@ -1353,9 +1460,9 @@ input[type="radio"] {
.switch {
position: absolute;
font-size: 30px;
right: -27px;
right: -30px;
top: 50%;
margin-top: -30px;
margin-top: -123px;
width: 40px;
border-radius: 40%;
overflow: hidden;
......
gassafety-web/src/views/deviceInspection/inspectiondetail/index.vue
View file @ d19a64a2
<template>
<div class="app-container detail" style="background-color: rgb(238, 241, 245);">
<div class="app-container detail inspectiondetail" style="background-color: rgb(238, 241, 245);">
<!-- 巡检计划信息 -->
<div style="padding-top: 10px;background: #fff;height: 100%;">
<el-row>
......@@ -416,7 +416,7 @@
addBasicsInfo(this.form2).then(response => {
this.msgSuccess("生成工单成功");
this.open2 = false;
this.getList();
location.reload();
});
}
});
......
gassafety-web/src/views/enterprise/mapView/components/CreateWorkTrouble.vue
View file @ d19a64a2
......@@ -78,7 +78,7 @@ export default {
},
gaoMap: "",
open: false,
title: "",
title: "隐患生成工单",
inspector: [],
loading: false,
alarmId: "",
......
gassafety-web/src/views/enterprise/mapView/index.vue
View file @ d19a64a2
......@@ -103,6 +103,26 @@
<div :class="{ active: !mapStyle }" @click="mapChange(1)">卫星地图</div>
<div :class="{ active: mapStyle }" @click="mapChange(2)">全景地图</div>
</div>
<!-- 管道压力 -->
<div class="pipePressure">
<!-- <div>管道压力</div> -->
<div class="hasColorBox" :style="{ color: lineColor[`1`] }">
<div :style="{ backgroundColor: lineColor[`1`] }"></div>
低压
</div>
<div class="hasColorBox" :style="{ color: lineColor[`2`] }">
<div :style="{ backgroundColor: lineColor[`2`] }"></div>
中压
</div>
<div class="hasColorBox" :style="{ color: lineColor[`3`] }">
<div :style="{ backgroundColor: lineColor[`3`] }"></div>
次高压
</div>
<div class="hasColorBox" :style="{ color: lineColor[`4`] }">
<div :style="{ backgroundColor: lineColor[`4`] }"></div>
高压
</div>
</div>
<div class="switch" @click="backFlag = !backFlag">
<img v-if="!backFlag" src="@/assets/images/l.png" alt="" />
<img v-else src="@/assets/images/r.png" alt="" />
......@@ -295,6 +315,7 @@ import Right from "./components/Right.vue";
import CreateWork from "./components/CreateWork.vue";
import CreateWorkTrouble from "./components/CreateWorkTrouble.vue";
import { getInspectorLocations } from "@/api/inspectorLocation/location";
import { lineColor } from "@/utils/mapCommon.js";
export default {
components: {
......@@ -305,6 +326,7 @@ export default {
},
data() {
return {
lineColor,
gaoMap: null,
deviceType: false,
value: "",
......@@ -448,11 +470,10 @@ export default {
const RightBottom = pageDomRight.offsetTop + pageDomRight.offsetHeight;
// 下边的上边
const bottomTop = pageDomBottom.offsetTop;
if(RightBottom>bottomTop){
if (RightBottom > bottomTop) {
// 重叠了，bottom右移动
this.bottomMarginRight=true;
this.bottomMarginRight = true;
}
},
initMap() {
......@@ -1512,7 +1533,7 @@ export default {
width: 100%;
}
// 如果right与bottom 重叠，则bottom左移动
.bottomMarginRight{
.bottomMarginRight {
right: 280px;
}
// .btn-wrapper {
......@@ -1688,6 +1709,24 @@ input[type="radio"] {
}
}
}
.pipePressure {
position: absolute;
color: #fff;
right: -80px;
top: 50px;
padding: 1px;
// background: rgba(6, 29, 51, 0.8);
.hasColorBox {
// border: 1px solid #053b6a;
padding: 2px 5px;
margin-bottom: 5px;
& > div {
display: inline-block;
width: 10px;
height: 10px;
}
}
}
.scroll {
// height: 100%;
position: relative;
......@@ -1833,7 +1872,9 @@ input[type="radio"] {
position: relative;
// box-sizing: border-box;
&.firstbox {
border-top: 1px solid rgba(0, 0, 0, 0.5);
// border-top: 1px solid rgba(0, 0, 0, 0.5);
border-top: 1px solid rgba(5, 59, 106, 0);
// box-sizing: border-box;
&:hover {
border-top: 1px solid rgba(5, 59, 106, 0);
......
gassafety-web/src/views/riskManagement/hiddenTroubleDetail/index.vue
View file @ d19a64a2
......@@ -552,7 +552,7 @@ export default {
addBasicsInfo(this.form2).then(response => {
this.msgSuccess("生成工单成功");
this.open2 = false;
this.getList();
location.reload();
});
}
});
......
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