大屏接口

dhy
吕天方 2 years ago
parent 89bbd0f01b
commit a073dcd676

@ -0,0 +1,28 @@
import request from "@/utils/request"
// 重点区域
export function regionalsettings(params){
return request({
url:'/jn/regionalsettings/list',
method:'get',
params
})
}
// 重点路段
export function roadsetting(params){
return request({
url:'/jn/roadsetting/list',
method:'get',
params
})
}
// 围栏
export function fence(params){
return request({
url:'/jn/fence/list',
method:'get',
params
})
}

@ -4,13 +4,13 @@
* @Author: JC9527 * @Author: JC9527
* @Date: 2023-08-15 11:09:57 * @Date: 2023-08-15 11:09:57
* @LastEditors: JC9527 * @LastEditors: JC9527
* @LastEditTime: 2023-08-18 18:42:16 * @LastEditTime: 2023-12-11 17:00:41
--> -->
<template> <template>
<div class="right-box"> <div class="right-box">
<div class="item" :style="relativeHeight"> <div class="item" :style="relativeHeight">
<title-box title="区域网格"></title-box> <title-box title="区域网格"></title-box>
<map-right :rightArray="griddingArray" :height="getHeight"></map-right> <map-right :rightArray="quyuArray" :height="getHeight"></map-right>
</div> </div>
<div class="item" :style="relativeHeight"> <div class="item" :style="relativeHeight">
<title-box title="重点区域"></title-box> <title-box title="重点区域"></title-box>
@ -18,11 +18,11 @@
</div> </div>
<div class="item" :style="relativeHeight"> <div class="item" :style="relativeHeight">
<title-box title="考勤围栏"></title-box> <title-box title="考勤围栏"></title-box>
<map-right :rightArray="griddingArray" :height="getHeight"></map-right> <map-right :rightArray="weilanArray" :height="getHeight"></map-right>
</div> </div>
<div class="item" :style="relativeHeight"> <div class="item" :style="relativeHeight">
<title-box title="重点路段"></title-box> <title-box title="重点路段"></title-box>
<map-right :rightArray="griddingArray" :height="getHeight"></map-right> <map-right :rightArray="luduanArray" :height="getHeight"></map-right>
</div> </div>
</div> </div>
</template> </template>
@ -64,27 +64,27 @@ export default {
], ],
areaArray:[ areaArray:[
{ {
area:'网格1', name:'网格1',
event:60, event:60,
resolved:40, resolved:40,
unsolved:20 unsolved:20
},{ },{
area:'网格2', name:'网格2',
event:60, event:60,
resolved:40, resolved:40,
unsolved:20 unsolved:20
},{ },{
area:'网格3', name:'网格3',
event:60, event:60,
resolved:40, resolved:40,
unsolved:20 unsolved:20
},{ },{
area:'网格1', name:'网格1',
event:60, event:60,
resolved:40, resolved:40,
unsolved:20 unsolved:20
},{ },{
area:'网格2', name:'网格2',
event:60, event:60,
resolved:40, resolved:40,
unsolved:20 unsolved:20
@ -94,8 +94,41 @@ export default {
relativeHeight:{ relativeHeight:{
height:'', height:'',
}, },
quyuArray:[],
weilanArray:[],
luduanArray:[],
}
},
props:['quyuData', 'weilanData', 'luduanData'],
watch:{
quyuData:{
handler(newQuyu){
// console.log(newQuyu,'');
if(newQuyu) {
this.quyuArray = newQuyu
} }
}, },
immediate:true,
},
weilanData:{
handler(newWeilan){
// console.log(newWeilan,'');
if(newWeilan) {
this.weilanArray = newWeilan
}
},
immediate:true,
},
luduanData:{
handler(newLuduan){
// console.log(newLuduan,'');
if(newLuduan) {
this.luduanArray = newLuduan
}
},
immediate:true,
},
},
methods:{ methods:{
getDomHeight(){ getDomHeight(){
this.$nextTick(()=>{ this.$nextTick(()=>{

@ -4,7 +4,7 @@
* @Author: JC9527 * @Author: JC9527
* @Date: 2023-08-14 14:40:02 * @Date: 2023-08-14 14:40:02
* @LastEditors: JC9527 * @LastEditors: JC9527
* @LastEditTime: 2023-08-18 20:37:07 * @LastEditTime: 2023-12-11 15:46:02
--> -->
<template> <template>
<div class="pc-container"> <div class="pc-container">
@ -110,7 +110,7 @@ div {
.pc-container { .pc-container {
overflow: hidden; overflow: hidden;
height: 100%; height: 100%;
background: url("../../assets/images/zhifa/main-background.jpg") no-repeat background: url("~@/assets/images/zhifa/main-background.jpg") no-repeat
center; center;
background-size: cover; background-size: cover;
position: relative; position: relative;
@ -119,7 +119,7 @@ div {
left: 0px; left: 0px;
top: 0px; top: 0px;
width: 510px; width: 510px;
height: 95%; height: 98%;
z-index: 550; z-index: 550;
box-sizing: border-box; box-sizing: border-box;
} }
@ -171,7 +171,7 @@ div {
right: 0px; right: 0px;
top: 0px; top: 0px;
width: 510px; width: 510px;
height: 95%; height: 98%;
z-index: 550; z-index: 550;
box-sizing: border-box; box-sizing: border-box;
} }

@ -93,7 +93,7 @@
</div> </div>
<transition name="right-animationMap"> <transition name="right-animationMap">
<div class="map-right" v-if="rightAnimationData"> <div class="map-right" v-if="rightAnimationData">
<map-right></map-right> <map-right :quyuData="quyuData" :weilanData="weilanData" :luduanData="luduanData"></map-right>
</div> </div>
</transition> </transition>
@ -133,30 +133,6 @@
<crew-assign ref="crewAssign"></crew-assign> <crew-assign ref="crewAssign"></crew-assign>
<video-wall ref="videoWall"></video-wall> <video-wall ref="videoWall"></video-wall>
<shop ref="shop" width="50%" title="商铺详情查看" /> <shop ref="shop" width="50%" title="商铺详情查看" />
<person-popup
v-if="personPopup"
v-on:personClose="personClose"
v-on:getRoute="presoninfo"
:point="mypoint"
></person-popup>
<event-popup
v-if="eventPopup"
v-on:eventClose="eventClose"
v-on:zhipai="personzhipai"
:point="mypoint"
></event-popup>
<car-popup
v-if="carPopup"
v-on:carClose="carClose"
v-on:carinfo="carinfo"
:point="mypoint"
></car-popup>
<monitoring-popup
v-if="monitoringPopup"
v-on:monitoringClose="monitoringClose"
v-on:monitoringInfo="monitoringInfo"
:point="mypoint"
></monitoring-popup>
</div> </div>
</template> </template>
<script> <script>
@ -181,8 +157,9 @@ import detachment2 from "@/utils/mapJson/detachment2.json";
import detachment3 from "@/utils/mapJson/detachment3.json"; import detachment3 from "@/utils/mapJson/detachment3.json";
import detachment4 from "@/utils/mapJson/detachment4.json"; import detachment4 from "@/utils/mapJson/detachment4.json";
import zhongdianluduan from "@/utils/mapJson/zhongdianluduan.json"; // import zhongdianluduan from "@/utils/mapJson/zhongdianluduan.json";
import zhongdianquyu from "@/utils/mapJson/zhongdianquyu.json"; // import zhongdianquyu from "@/utils/mapJson/zhongdianquyu.json";
import mapLeft from "../components/mapLeftContent.vue"; import mapLeft from "../components/mapLeftContent.vue";
import mapRight from "../components/mapRightContent.vue"; import mapRight from "../components/mapRightContent.vue";
@ -192,16 +169,12 @@ import personageTrack from "../../components/personagetrack/index.vue";
import crewAssign from "../../components/crewAssign/index.vue"; import crewAssign from "../../components/crewAssign/index.vue";
import videoWall from "../../components/videoWall/index.vue"; import videoWall from "../../components/videoWall/index.vue";
import shop from "../../components/shop/index.vue"; import shop from "../../components/shop/index.vue";
import personPopup from "../../components/personPopup/index.vue";
import eventPopup from "../../components/eventPopup/index.vue";
import carPopup from "../../components/carPopup/index.vue";
import monitoringPopup from "../../components/monitoringPopup/index.vue";
import jiangningwangge from "@/utils/data/江宁开发区网格.json"; import jiangningwangge from "@/utils/data/江宁开发区网格.json";
import weilan from "@/utils/data/围栏1.json"; import weilan from "@/utils/data/围栏1.json";
import axios from "axios"; import { regionalsettings, roadsetting, fence } from "@/api/bigScreenApi"
export default { export default {
name: "myMap", name: "myMap",
@ -212,10 +185,6 @@ export default {
crewAssign, crewAssign,
videoWall, videoWall,
shop, shop,
personPopup,
eventPopup,
carPopup,
monitoringPopup,
}, },
data() { data() {
return { return {
@ -246,14 +215,17 @@ export default {
mapLayer5: null, mapLayer5: null,
input: "", // input: "", //
actionMap: 1, // actionMap: 1, //
action: 1, // /// action: 1, // ////沿
personPopup: false,
eventPopup: false,
carPopup: false,
monitoringPopup: false,
mypoint: {}, mypoint: {},
leftAnimationData: true, leftAnimationData: true,
rightAnimationData: true, rightAnimationData: true,
electronicMap: null, //
satelliteMap: null, //
satelliteNoteMap:null, //
wanggeData: null, //
quyuData: null, //
weilanData: null, //
luduanData: null, //
}; };
}, },
methods: { methods: {
@ -304,15 +276,28 @@ export default {
// } // }
// ) // )
// .addTo(this.globalMap); // .addTo(this.globalMap);
//
L.tileLayer this.electronicMap = L.tileLayer
.chinaProvider("GaoDe.Normal.Map", { .chinaProvider("GaoDe.Normal.Map", {
maxZoom: 18, maxZoom: 18,
minZoom: 5, minZoom: 5,
color: { r: 10, g: 38, b: 74 }, // color: { r: 10, g: 38, b: 74 }, //
}) })
.addTo(this.globalMap); //
this.satelliteMap = L.tileLayer
.chinaProvider("GaoDe.Satellite.Map", {
maxZoom: 18,
minZoom: 5,
color: { r: 10, g: 38, b: 74 }, //
})
//
this.satelliteNoteMap = L.tileLayer
.chinaProvider("GaoDe.Satellite.Annotion", {
maxZoom: 18,
minZoom: 5,
color: { r: 10, g: 38, b: 74 }, //
})
this.globalMap.addLayer(this.electronicMap)
// L.tileLayer // L.tileLayer
// .chinaProvider("GaoDe.Satellite.Annotion", { // .chinaProvider("GaoDe.Satellite.Annotion", {
// maxZoom: 18, // maxZoom: 18,
@ -345,11 +330,11 @@ export default {
this.globalMap.getPane("mapLayer6").style.pointerEvents = "none"; this.globalMap.getPane("mapLayer6").style.pointerEvents = "none";
this.globalMap.createPane("mapLayer7"); this.globalMap.createPane("mapLayer7");
this.globalMap.getPane("mapLayer7").style.zIndex = 502; this.globalMap.getPane("mapLayer7").style.zIndex = 503;
this.globalMap.getPane("mapLayer7").style.pointerEvents = "none"; this.globalMap.getPane("mapLayer7").style.pointerEvents = "none";
this.globalMap.createPane("mapEvent1"); this.globalMap.createPane("mapEvent1");
this.globalMap.getPane("mapEvent1").style.zIndex = 503; this.globalMap.getPane("mapEvent1").style.zIndex = 504;
this.globalMap.getPane("mapEvent1").style.pointerEvents = "none"; this.globalMap.getPane("mapEvent1").style.pointerEvents = "none";
this.mapEvent.mapEvent1 = L.featureGroup().addTo(this.globalMap); this.mapEvent.mapEvent1 = L.featureGroup().addTo(this.globalMap);
@ -377,20 +362,21 @@ export default {
// this.addLayer3(); // this.addLayer3();
// this.addLayer4(); // this.addLayer4();
// this.addLayer5(); // this.addLayer5();
this.addLayer6(); this.addLayer6(); //
this.addLayer7(); this.addLayer7(); //
this.addLayer8(); this.addLayer8(); // and
// 118.797442,32.087219 // 118.797442,32.087219
L.marker(L.latLng(31.96840071263104, 118.79808425903322), { L.marker(L.latLng(31.96840071263104, 118.79808425903322), {
icon: L.icon({ icon: L.icon({
iconUrl: require("../../../assets/images/3.png"), iconUrl: require("../../../assets/images/3.png"),
iconSize: [38, 38], iconSize: [38, 43],
iconAnchor: [22, 38], iconAnchor: [22, 38],
}), }),
}).addTo(this.globalMap); }).addTo(this.globalMap);
}, },
// and
addLayer8() { addLayer8() {
// geojson // geojson
let geojson = L.geoJSON(jiangningwangge, { let geojson = L.geoJSON(jiangningwangge, {
@ -422,8 +408,37 @@ export default {
}); });
// .addTo(this.mapLayers.mapLayer8); // .addTo(this.mapLayers.mapLayer8);
// geojson //
let geojson2 = L.geoJSON(weilan, { fence({ pageNum: 1, pageSize: 100 }).then(res=>{
// console.log(res,'');
this.weilanData = res.rows;
res.rows.forEach(element=>{
let shapeStr = JSON.parse(element.shapeStr);
//
if(shapeStr.features[0].geometry.type == "Point") {
let geojson2 = L.circle([shapeStr.features[0].geometry.coordinates[1], shapeStr.features[0].geometry.coordinates[0]], {
radius: shapeStr.features[0].properties.radius,
color: "#62E1FA",
weight: 1,
fillColor: "#62E1FA",
fillOpacity: 0.3,
pane: "mapLayer2"
}).addTo(this.mapLayers.mapLayer8);
let myIcon = L.divIcon({
className: "land-name5",
html: element.name,
iconSize: [150, 24],
iconAnchor: [75, 12],
});
// ;
L.marker([shapeStr.features[0].geometry.coordinates[1], shapeStr.features[0].geometry.coordinates[0]], {
pane: "mapLayer3",
icon: myIcon,
}).addTo(this.mapLayers.mapLayer8);
} else if(shapeStr.features[0].geometry.type == "Polygon") {
//
let geojson2 = L.geoJSON(shapeStr.features[0], {
pane: "mapLayer2", pane: "mapLayer2",
style: function (feature) { style: function (feature) {
return { return {
@ -439,7 +454,7 @@ export default {
let center = bounds.getCenter(); let center = bounds.getCenter();
let myIcon = L.divIcon({ let myIcon = L.divIcon({
className: "land-name5", className: "land-name5",
html: text, html: element.name,
iconSize: [150, 24], iconSize: [150, 24],
iconAnchor: [75, 12], iconAnchor: [75, 12],
}); });
@ -450,6 +465,9 @@ export default {
}).addTo(this.mapLayers.mapLayer8); }).addTo(this.mapLayers.mapLayer8);
}, },
}).addTo(this.mapLayers.mapLayer8); }).addTo(this.mapLayers.mapLayer8);
}
})
})
}, },
addLayer1() { addLayer1() {
this.mapLayers.mapLayer1.clearLayers(); this.mapLayers.mapLayer1.clearLayers();
@ -763,12 +781,7 @@ export default {
}); });
}, },
markerClick(marker, index) { markerClick(marker, index) {
// document.getElementsByName('monitoring').addEventListener("click",function(){//ElementsById()elementaddEventListener()
// console.log("");
// })
// console.log(marker);
marker.on("click", (e) => { marker.on("click", (e) => {
// console.log(e);
this.$nextTick(() => { this.$nextTick(() => {
document document
.querySelector("#monitoring" + index) .querySelector("#monitoring" + index)
@ -811,43 +824,8 @@ export default {
}); });
} }
}); });
// this.mypoint = e.containerPoint;
// if(this.actionMap == 1) {
// // this.personPopup = true;
// } else if(this.actionMap == 2) {
// // this.eventPopup = true;
// } else if(this.actionMap == 3) {
// // this.carPopup = true
// } else if(this.actionMap == 4){
// // this.monitoringPopup = true;
// }
}); });
}, },
personClose() {
this.personPopup = false;
},
eventClose() {
this.eventPopup = false;
},
carClose() {
this.carPopup = false;
},
monitoringClose() {
this.monitoringPopup = false;
},
// personzhipai(){
// this.$refs.crewAssign.open();
// },
// presoninfo(){
// this.$refs.personageTrack.open('person');
// },
// carinfo(){
// this.$refs.personageTrack.open('car');
// },
// monitoringInfo(){
// this.$refs.videoWall.open();
// },
addLayer2() { addLayer2() {
this.mapLayers.mapLayer2.clearLayers(); this.mapLayers.mapLayer2.clearLayers();
let geojson = L.geoJSON( let geojson = L.geoJSON(
@ -942,10 +920,16 @@ export default {
// json // json
this.mapLayer5 = geojson.getBounds(); this.mapLayer5 = geojson.getBounds();
}, },
//
addLayer6() { addLayer6() {
this.mapLayers.mapLayer5.clearLayers(); // this.mapLayers.mapLayer5.clearLayers();
regionalsettings({ pageNum: 1, pageSize: 100 }).then(res=>{
// console.log(res,'');
this.quyuData = res.rows;
res.rows.forEach(element => {
let shapeStr = JSON.parse(element.shapeStr)
let geojson = L.geoJSON( let geojson = L.geoJSON(
zhongdianquyu, shapeStr.features[0],
{ {
pane: "mapLayer6", pane: "mapLayer6",
style: function (feature) { style: function (feature) {
@ -959,33 +943,38 @@ export default {
}, },
{ className: "jack-s6" } { className: "jack-s6" }
).addTo(this.mapLayers.mapLayer6); ).addTo(this.mapLayers.mapLayer6);
// json
let bounds = geojson.getBounds();
let latlng = bounds.getCenter();
let myIcon1 = L.divIcon({ let myIcon1 = L.divIcon({
className: "region-name1", className: "region-name1",
html: "重点区域", html: element.name,
iconSize: [120, 68], iconSize: [120, 68],
}); });
L.marker(latlng, { L.marker({lng:shapeStr.features[1].geometry.coordinates[0],lat:shapeStr.features[1].geometry.coordinates[1]}, {
pane: "mapLayer4", pane: "mapLayer4",
icon: myIcon1, icon: myIcon1,
}).addTo(this.mapLayers.mapLayer6); }).addTo(this.mapLayers.mapLayer6);
});
})
// this.mapLayer5 = geojson.getBounds() // this.mapLayer5 = geojson.getBounds()
}, },
//
addLayer7() { addLayer7() {
this.mapLayers.mapLayer7.clearLayers(); // this.mapLayers.mapLayer7.clearLayers();
roadsetting({ pageNum: 1, pageSize: 100 }).then(res=>{
// console.log(res,'');
this.luduanData = res.rows;
res.rows.forEach(element=>{
let shapeStr = JSON.parse(element.shapeStr)
let geojson = L.geoJSON( let geojson = L.geoJSON(
zhongdianluduan, shapeStr.features[0],
{ {
pane: "mapLayer7", pane: "mapLayer7",
style: function (feature) { style: function (feature) {
return { return {
color: "#00C5EC", color: "#46FF77",
weight: 0, // weight: 0,
fillColor: "rgba(70,255,119,0.38)", // fillColor: "rgba(70,255,119,0.38)",
fillOpacity: 1, // fillOpacity: 1,
}; };
}, },
}, },
@ -993,21 +982,32 @@ export default {
).addTo(this.mapLayers.mapLayer7); ).addTo(this.mapLayers.mapLayer7);
// json // json
// this.mapLayer5 = geojson.getBounds() // this.mapLayer5 = geojson.getBounds()
let bounds = geojson.getBounds(); // let bounds = geojson.getBounds();
let latlng = bounds.getCenter(); // let latlng = bounds.getCenter();
let myIcon1 = L.divIcon({ let myIcon1 = L.divIcon({
className: "region-name2", className: "region-name2",
html: "重点路段", html: element.name,
iconSize: [120, 68], iconSize: [120, 68],
}); });
L.marker(latlng, { L.marker({lng:shapeStr.features[1].geometry.coordinates[0],lat:shapeStr.features[1].geometry.coordinates[1]}, {
pane: "mapLayer4", pane: "mapLayer4",
icon: myIcon1, icon: myIcon1,
}).addTo(this.mapLayers.mapLayer7); }).addTo(this.mapLayers.mapLayer7);
})
})
}, },
actionBtn(id) { actionBtn(id) {
this.action = id; this.action = id;
if(id == 1) {
this.globalMap.removeLayer(this.satelliteMap);
this.globalMap.removeLayer(this.satelliteNoteMap);
this.globalMap.addLayer(this.electronicMap);
} else {
this.globalMap.removeLayer(this.electronicMap);
this.globalMap.addLayer(this.satelliteMap);
this.globalMap.addLayer(this.satelliteNoteMap);
}
// console.log(id) // console.log(id)
// this.$emit('actionBtn',id); // this.$emit('actionBtn',id);
// if(id == 1){ // if(id == 1){
@ -1027,41 +1027,37 @@ export default {
// //
changeMap(id) { changeMap(id) {
this.actionMap = id; this.actionMap = id;
this.personPopup = false;
this.eventPopup = false;
this.carPopup = false;
this.monitoringPopup = false;
this.addMark(); this.addMark();
switch (id) { // switch (id) {
case 1: // case 1:
this.addMark("执法人员"); // this.addMark("");
break; // break;
case 2: // case 2:
this.addMark("普通事件"); // this.addMark("");
break; // break;
case 3: // case 3:
this.addMark("执法车辆"); // this.addMark("");
break; // break;
case 4: // case 4:
this.addMark("监控视频"); // this.addMark("");
break; // break;
case 5: // case 5:
this.addMark("沿街商铺分布"); // this.addMark("沿");
break; // break;
default: // default:
return; // return;
} // }
}, },
leftAnimation() { leftAnimation() {
setTimeout(() => { setTimeout(() => {
this.leftAnimationData = !this.leftAnimationData; this.leftAnimationData = !this.leftAnimationData;
}, 800); }, 200);
this.$emit("leftAnimationAction"); this.$emit("leftAnimationAction");
}, },
rightAnimation() { rightAnimation() {
setTimeout(() => { setTimeout(() => {
this.rightAnimationData = !this.rightAnimationData; this.rightAnimationData = !this.rightAnimationData;
}, 1000); }, 200);
this.$emit("rightAnimationAction"); this.$emit("rightAnimationAction");
}, },
}, },

@ -4,10 +4,10 @@
* @Author: JC9527 * @Author: JC9527
* @Date: 2023-08-17 09:04:40 * @Date: 2023-08-17 09:04:40
* @LastEditors: JC9527 * @LastEditors: JC9527
* @LastEditTime: 2023-08-18 20:45:06 * @LastEditTime: 2023-12-11 13:23:15
--> -->
<template> <template>
<dia-log ref="dialog2" width="475px" title="人员指派"> <dia-log ref="dialog2" width="30%" title="人员指派">
<div class="crew-assign"> <div class="crew-assign">
<div class="item"> <div class="item">
<div class="ball"></div> <div class="ball"></div>
@ -203,20 +203,29 @@ export default {
::v-deep .el-select { ::v-deep .el-select {
background-color: transparent; background-color: transparent;
width: 350px; width: 350px;
.el-input
.el-input__suffix
.el-input__suffix-inner
.el-icon-arrow-up {
display: flex;
align-items: center;
justify-content: center;
}
.el-input .el-input
.el-input__suffix .el-input__suffix
.el-input__suffix-inner .el-input__suffix-inner
.el-icon-arrow-up::before { .el-icon-arrow-up::before {
content: ""; content: "";
background: url(../../../assets/images/pull-down.png) center center background: url("~@/assets/images/pull-down.png") center center
no-repeat; no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
position: absolute; // position: absolute;
width: 100%; width: 100%;
height: 22px; height: 22px;
top: 50%; // top: 50%;
left: 50%; // left: 50%;
transform: translate(-50%, -50%); // transform: translate(-50%, -50%);
transform: rotate(180deg);
} }
.el-input__suffix .el-input__suffix-inner .el-select__caret { .el-input__suffix .el-input__suffix-inner .el-select__caret {
width: 22px; width: 22px;

@ -153,6 +153,7 @@ export default {
.real-time-location,.route-track { .real-time-location,.route-track {
display: flex; display: flex;
align-items: center; align-items: center;
cursor: pointer;
img { img {
width: 18px; width: 18px;
margin-right: 5px; margin-right: 5px;

@ -8,9 +8,9 @@
</div> </div>
<div class="lists-main" id="rightBox" :style="{'height':(height - lists.height - 20) + 'px'}"> <div class="lists-main" id="rightBox" :style="{'height':(height - lists.height - 20) + 'px'}">
<div class="main" v-for="(item,index) in rightArray" :key="index" :class="(index+1) % 2 == 0 ? 'main1':''"> <div class="main" v-for="(item,index) in rightArray" :key="index" :class="(index+1) % 2 == 0 ? 'main1':''">
<div> <div class="main-name">
<img src="@/assets/images/location1.png" alt=""> <img src="@/assets/images/location1.png" alt="">
{{ item.area }} <span>{{ item.name }}</span>
</div> </div>
<div>{{ item.event }}</div> <div>{{ item.event }}</div>
<div>{{ item.resolved }}</div> <div>{{ item.resolved }}</div>
@ -68,9 +68,12 @@ export default {
padding: 8px 0 0 17px; padding: 8px 0 0 17px;
.header-title { .header-title {
padding: 0 24px; padding: 0 24px;
display: flex; // display: flex;
align-items: center; // align-items: center;
justify-content: space-between; // justify-content: space-between;
display: grid;
grid-template-columns: repeat(4, 1fr);
// grid-template-rows: 1fr;
background: rgba(7,127,255,0.1608); background: rgba(7,127,255,0.1608);
border-radius: 0px 0px 0px 0px; border-radius: 0px 0px 0px 0px;
opacity: 1; opacity: 1;
@ -81,8 +84,12 @@ export default {
font-family: 'Source Han Sans CN-Bold'; font-family: 'Source Han Sans CN-Bold';
font-weight: bold; font-weight: bold;
color: #D3EEF2; color: #D3EEF2;
line-height: 21px; line-height: 33px;
min-width: 60px; min-width: 60px;
text-align: center;
&:nth-of-type(1) {
text-align: left;
}
} }
} }
.lists-main { .lists-main {
@ -91,31 +98,39 @@ export default {
} }
.main { .main {
padding: 0 24px; padding: 0 24px;
display: flex; // display: flex;
justify-content: space-between; // justify-content: space-between;
align-items: center; // align-items: center;
display: grid;
grid-template-columns: repeat(4, 25%);
background: rgba(216,216,216,0.05); background: rgba(216,216,216,0.05);
height: 33px; height: 33px;
div { div {
display: flex;
align-items: center;
justify-content: center;
font-size: 14px; font-size: 14px;
font-family: 'Source Han Sans CN-Regular'; font-family: 'Source Han Sans CN-Regular';
font-weight: 400; font-weight: 400;
color: #D3EEF2; color: #D3EEF2;
line-height: 21px; line-height: 33px;
min-width: 60px; text-align: center;
// min-width: 60px;
&:nth-child(1) { }
.main-name {
display: flex;
align-items: center;
span {
display: inline-block;
text-align: left;
flex: 1;
font-size: 14px; font-size: 14px;
font-family: 'Source Han Sans CN-Regular'; font-family: 'Source Han Sans CN-Regular';
font-weight: 400; font-weight: 400;
color: #52B1FF; color: #52B1FF;
line-height: 21px; line-height: 33px;
overflow: hidden;
white-space: nowrap; /* 防止文本换行 */
text-overflow: ellipsis; /* 显示省略号 */
} }
img { img {
width: 18px; width: 18px;
margin-right: 8px; margin-right: 8px;

@ -1,5 +1,5 @@
<template> <template>
<dia-log ref="dialog" width="675px" :title="title" :type="1"> <dia-log ref="dialog" width="45%" :title="title" :type="1">
<div class="personage-track"> <div class="personage-track">
<div class="track-title"> <div class="track-title">
<div class="titlebg"></div> <div class="titlebg"></div>
@ -37,7 +37,7 @@
<div class="interval-select"> <div class="interval-select">
<div class="star-time"> <div class="star-time">
<el-date-picker <el-date-picker
v-model="startTime" v-model="queryTime.startTime"
type="datetime" type="datetime"
align="right" align="right"
:clearable="false" :clearable="false"
@ -50,7 +50,7 @@
<div class="symbol"></div> <div class="symbol"></div>
<div class="end-time"> <div class="end-time">
<el-date-picker <el-date-picker
v-model="endTime" v-model="queryTime.endTime"
type="datetime" type="datetime"
align="right" align="right"
:clearable="false" :clearable="false"
@ -67,11 +67,11 @@
</div> </div>
</div> </div>
</div> </div>
<div class="btns reset"> <div class="btns reset" @click="reset">
<img src="@/assets/images/reset.png" alt="" /> <img src="@/assets/images/reset.png" alt="" />
<span>重置</span> <span>重置</span>
</div> </div>
<div class="btns"> <div class="btns" @click="query">
<img src="@/assets/images/inquire.png" alt="" /> <img src="@/assets/images/inquire.png" alt="" />
<span>查询</span> <span>查询</span>
</div> </div>
@ -85,10 +85,10 @@
<div class="contentTitle">轨迹地图</div> <div class="contentTitle">轨迹地图</div>
</div> </div>
<div class="contentMap"> <div class="contentMap">
<!-- <div id="personageTrackMap"> <div id="personageTrackMap">
</div> --> </div>
<img src="@/assets/images/minMap.png" alt="" /> <!-- <img src="@/assets/images/minMap.png" alt="" /> -->
</div> </div>
</div> </div>
</div> </div>
@ -98,17 +98,26 @@
</template> </template>
<script> <script>
import diaLog from "../../components/dialog/index.vue"; import diaLog from "../../components/dialog/index.vue";
import jiangninggeo from "@/utils/mapJson/jiangningjingkaiqugeo.json";
import L from "leaflet";
import "@/utils/lib/leaflet.ChineseTmsProviders.js";
import "@/utils/lib/leaflet-tilelayer-colorizr.js";
export default { export default {
components: { diaLog }, components: { diaLog },
data() { data() {
return { return {
startTime: "",
title: "人员行程轨迹", title: "人员行程轨迹",
person: false, person: false,
queryTime: {
startTime: "",
endTime: "", endTime: "",
},
heightStyle: { heightStyle: {
height: "500px", height: "500px",
}, },
globalMap: null,
track: null,
mapLayer1: null,
}; };
}, },
methods: { methods: {
@ -122,10 +131,81 @@ export default {
this.person = false; this.person = false;
} }
this.$refs.dialog.open("1"); this.$refs.dialog.open("1");
this.$nextTick(()=>{
this.initMap();
})
}, },
Close() { Close() {
this.$refs.dialog.Close(); this.$refs.dialog.Close();
}, },
//
initMap() {
this.globalMap = L.map("personageTrackMap", {
center: [31.953175, 118.839514], // []
zoom: 18, //
zoomControl: false,
attributionControl: false, // leaflet
doubleClickZoom: false, //
scrollWheelZoom: true, //
dragging: true,
renderer: L.svg(),
});
L.tileLayer
.chinaProvider("GaoDe.Normal.Map", {
maxZoom: 18,
minZoom: 5,
color: { r: 10, g: 38, b: 74 }, //
})
.addTo(this.globalMap);
// this.globalMap.createPane("mapLayer1");
// this.globalMap.getPane("mapLayer1").style.zIndex = 501;
// this.globalMap.getPane("mapLayer1").style.pointerEvents = "none";
this.addLayer1();
},
addLayer1() {
let geojson = L.geoJSON(
jiangninggeo,
{
style: function (feature) {
return {
color: "#00C5EC",
weight: 1,
fillColor: "rgba(64,175,255,0.4)",
fillOpacity: 1,
};
},
},
{ className: "jack-s" }
).addTo(this.globalMap);
// this.addMark()
// json
this.mapLayer1 = geojson.getBounds();
// json
this.globalMap.fitBounds(this.mapLayer1);
},
//
reset(){
Object.keys(this.queryTime).forEach(key=>{this.queryTime[key]=''})
if(this.track) {
this.globalMap.removeLayer(this.track);
}
this.globalMap.fitBounds(this.mapLayer1)
},
//
query(){
if(!this.queryTime.startTime) {
this.$modal.msgError( "请选择查询的起始时间");
} else if(!this.queryTime.endTime) {
this.$modal.msgError( "请选择查询的截止时间");
} else {
if(this.track) {
this.globalMap.removeLayer(this.track);
}
this.track
}
},
}, },
}; };
</script> </script>
@ -251,6 +331,7 @@ export default {
font-family: "Source Han Sans CN-Medium"; font-family: "Source Han Sans CN-Medium";
font-weight: 500; font-weight: 500;
color: #e9f4ff; color: #e9f4ff;
padding-left: 15px;
} }
.el-input__inner::placeholder { .el-input__inner::placeholder {
/* 在这里添加你想要修改的 placeholder 样式 */ /* 在这里添加你想要修改的 placeholder 样式 */
@ -279,6 +360,7 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
cursor: pointer;
img { img {
width: 24px; width: 24px;
margin-right: 5px; margin-right: 5px;
@ -326,15 +408,15 @@ export default {
padding: 15px 74px 0 14px; padding: 15px 74px 0 14px;
width: 100%; width: 100%;
height: 400px; height: 400px;
// #personageTrackMap { #personageTrackMap {
// width: 100%;
// height: 100%;
// background-color: #fff;
// }
img {
width: 100%; width: 100%;
height: 100%; height: 100%;
background-color: #fff;
} }
// img {
// width: 100%;
// height: 100%;
// }
} }
} }
} }

@ -48,6 +48,7 @@
<img class="data_icon" src="@/assets/images/timeIcon.png" alt="" /> <img class="data_icon" src="@/assets/images/timeIcon.png" alt="" />
</div> </div>
</div> </div>
<div class="btns">
<div class="btn-reset"> <div class="btn-reset">
<div class="icon-reset"></div> <div class="icon-reset"></div>
<span class="text">重置</span> <span class="text">重置</span>
@ -57,6 +58,7 @@
<span class="text">查询</span> <span class="text">查询</span>
</div> </div>
</div> </div>
</div>
<div> <div>
<div class="tb-header"> <div class="tb-header">
<span>执法人员</span> <span>执法人员</span>
@ -144,6 +146,7 @@ export default {
.search-gr { .search-gr {
display: flex; display: flex;
flex-wrap: wrap;
margin: 10px 0; margin: 10px 0;
.itemtwo { .itemtwo {
@ -171,7 +174,7 @@ export default {
} }
} }
.right { .right {
background-image: url("../../../../assets/images/timebg.png"); background-image: url("~@/assets/images/timebg.png");
// width: 120px; // width: 120px;
// height: 35px; // height: 35px;
background-size: 100% 100%; background-size: 100% 100%;
@ -181,7 +184,7 @@ export default {
} }
::v-deep .el-date-editor { ::v-deep .el-date-editor {
background-color: transparent; background-color: transparent;
width: 120px; width: 200px;
.el-input__inner { .el-input__inner {
background-color: transparent; background-color: transparent;
border: none; border: none;
@ -199,19 +202,18 @@ export default {
font-family: "Source Han Sans CN-Regular"; font-family: "Source Han Sans CN-Regular";
font-weight: 400; font-weight: 400;
color: #d3eef2; color: #d3eef2;
-webkit-background-clip: text; line-height: 20px;
-webkit-text-fill-color: rgba(211, 238, 242, 0.2);
} }
} }
::v-deep .el-select { ::v-deep .el-select {
background-color: transparent; background-color: transparent;
width: 120px; width: 200px;
.el-input .el-input
.el-input__suffix .el-input__suffix
.el-input__suffix-inner .el-input__suffix-inner
.el-icon-arrow-up::before { .el-icon-arrow-up::before {
content: ""; content: "";
background: url("../../../../assets/images/pull-bottom.png") center background: url("~@/assets/images/pull-bottom.png") center
center no-repeat; center no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
position: absolute; position: absolute;
@ -243,8 +245,7 @@ export default {
font-family: "Source Han Sans CN-Regular"; font-family: "Source Han Sans CN-Regular";
font-weight: 400; font-weight: 400;
color: #d3eef2; color: #d3eef2;
-webkit-background-clip: text; line-height: 20px;
-webkit-text-fill-color: rgba(211, 238, 242, 0.2);
} }
} }
.data_icon { .data_icon {
@ -262,7 +263,7 @@ export default {
border: 1px solid rgba(181, 207, 255, 0.5); border: 1px solid rgba(181, 207, 255, 0.5);
.el-input__inner { .el-input__inner {
background-color: transparent; background-color: transparent;
width: 120px; width: 200px;
height: 30px; height: 30px;
color: #fff; color: #fff;
border: none; border: none;
@ -288,6 +289,10 @@ export default {
} }
} }
} }
.btns {
display: flex;
margin-top: 15px;
}
.btn-reset { .btn-reset {
display: flex; display: flex;
align-items: center; align-items: center;
@ -298,7 +303,7 @@ export default {
.icon-reset { .icon-reset {
width: 24px; width: 24px;
height: 24px; height: 24px;
background-image: url("../../../../assets/images/icon-reset.png"); background-image: url("~@/assets/images/icon-reset.png");
background-size: 100% 100%; background-size: 100% 100%;
background-repeat: no-repeat; background-repeat: no-repeat;
} }
@ -321,7 +326,7 @@ export default {
.icon-search { .icon-search {
width: 24px; width: 24px;
height: 24px; height: 24px;
background-image: url("../../../../assets/images/icon-search.png"); background-image: url("~@/assets/images/icon-search.png");
background-size: 100% 100%; background-size: 100% 100%;
background-repeat: no-repeat; background-repeat: no-repeat;
} }

@ -48,6 +48,7 @@
<img class="data_icon" src="@/assets/images/timeIcon.png" alt="" /> <img class="data_icon" src="@/assets/images/timeIcon.png" alt="" />
</div> </div>
</div> </div>
<div class="btns">
<div class="btn-reset"> <div class="btn-reset">
<div class="icon-reset"></div> <div class="icon-reset"></div>
<span class="text">重置</span> <span class="text">重置</span>
@ -57,6 +58,7 @@
<span class="text">查询</span> <span class="text">查询</span>
</div> </div>
</div> </div>
</div>
<div> <div>
<div class="tb-header"> <div class="tb-header">
<span>整改工单编号</span> <span>整改工单编号</span>
@ -142,6 +144,7 @@ export default {
.search-gr { .search-gr {
display: flex; display: flex;
flex-wrap: wrap;
margin: 10px 0; margin: 10px 0;
.itemtwo { .itemtwo {
@ -169,7 +172,7 @@ export default {
} }
} }
.right { .right {
background-image: url("../../../../assets/images/timebg.png"); background-image: url("~@/assets/images/timebg.png");
// width: 120px; // width: 120px;
// height: 35px; // height: 35px;
background-size: 100% 100%; background-size: 100% 100%;
@ -179,7 +182,7 @@ export default {
} }
::v-deep .el-date-editor { ::v-deep .el-date-editor {
background-color: transparent; background-color: transparent;
width: 120px; width: 200px;
.el-input__inner { .el-input__inner {
background-color: transparent; background-color: transparent;
border: none; border: none;
@ -197,19 +200,18 @@ export default {
font-family: "Source Han Sans CN-Regular"; font-family: "Source Han Sans CN-Regular";
font-weight: 400; font-weight: 400;
color: #d3eef2; color: #d3eef2;
-webkit-background-clip: text; line-height: 20px;
-webkit-text-fill-color: rgba(211, 238, 242, 0.2);
} }
} }
::v-deep .el-select { ::v-deep .el-select {
background-color: transparent; background-color: transparent;
width: 120px; width: 200px;
.el-input .el-input
.el-input__suffix .el-input__suffix
.el-input__suffix-inner .el-input__suffix-inner
.el-icon-arrow-up::before { .el-icon-arrow-up::before {
content: ""; content: "";
background: url("../../../../assets/images/pull-bottom.png") center background: url("~@/assets/images/pull-bottom.png") center
center no-repeat; center no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
position: absolute; position: absolute;
@ -241,8 +243,7 @@ export default {
font-family: "Source Han Sans CN-Regular"; font-family: "Source Han Sans CN-Regular";
font-weight: 400; font-weight: 400;
color: #d3eef2; color: #d3eef2;
-webkit-background-clip: text; line-height: 20px;
-webkit-text-fill-color: rgba(211, 238, 242, 0.2);
} }
} }
.data_icon { .data_icon {
@ -260,7 +261,7 @@ export default {
border: 1px solid rgba(181, 207, 255, 0.5); border: 1px solid rgba(181, 207, 255, 0.5);
.el-input__inner { .el-input__inner {
background-color: transparent; background-color: transparent;
width: 120px; width: 200px;
height: 30px; height: 30px;
color: #fff; color: #fff;
border: none; border: none;
@ -286,6 +287,10 @@ export default {
} }
} }
} }
.btns {
display: flex;
margin-top: 15px;
}
.btn-reset { .btn-reset {
display: flex; display: flex;
align-items: center; align-items: center;

@ -122,6 +122,7 @@ export default {
.search-gr { .search-gr {
display: flex; display: flex;
flex-wrap: wrap;
margin: 10px 0; margin: 10px 0;
.itemtwo { .itemtwo {
@ -149,7 +150,7 @@ export default {
} }
} }
.right { .right {
background-image: url("../../../../assets/images/timebg.png"); background-image: url("~@/assets/images/timebg.png");
// width: 120px; // width: 120px;
// height: 35px; // height: 35px;
background-size: 100% 100%; background-size: 100% 100%;
@ -159,7 +160,7 @@ export default {
} }
::v-deep .el-date-editor { ::v-deep .el-date-editor {
background-color: transparent; background-color: transparent;
width: 120px; width: 200px;
.el-input__inner { .el-input__inner {
background-color: transparent; background-color: transparent;
border: none; border: none;
@ -177,13 +178,12 @@ export default {
font-family: "Source Han Sans CN-Regular"; font-family: "Source Han Sans CN-Regular";
font-weight: 400; font-weight: 400;
color: #d3eef2; color: #d3eef2;
-webkit-background-clip: text; line-height: 20px;
-webkit-text-fill-color: rgba(211, 238, 242, 0.2);
} }
} }
::v-deep .el-select { ::v-deep .el-select {
background-color: transparent; background-color: transparent;
width: 120px; width: 200px;
.el-input .el-input
.el-input__suffix .el-input__suffix
.el-input__suffix-inner .el-input__suffix-inner
@ -221,8 +221,7 @@ export default {
font-family: "Source Han Sans CN-Regular"; font-family: "Source Han Sans CN-Regular";
font-weight: 400; font-weight: 400;
color: #d3eef2; color: #d3eef2;
-webkit-background-clip: text; line-height: 20px;
-webkit-text-fill-color: rgba(211, 238, 242, 0.2);
} }
} }
.data_icon { .data_icon {
@ -240,7 +239,7 @@ export default {
border: 1px solid rgba(181, 207, 255, 0.5); border: 1px solid rgba(181, 207, 255, 0.5);
.el-input__inner { .el-input__inner {
background-color: transparent; background-color: transparent;
width: 120px; width: 200px;
height: 30px; height: 30px;
color: #fff; color: #fff;
border: none; border: none;
@ -276,7 +275,7 @@ export default {
.icon-reset { .icon-reset {
width: 24px; width: 24px;
height: 24px; height: 24px;
background-image: url("../../../../assets/images/icon-reset.png"); background-image: url("~@/assets/images/icon-reset.png");
background-size: 100% 100%; background-size: 100% 100%;
background-repeat: no-repeat; background-repeat: no-repeat;
} }
@ -299,7 +298,7 @@ export default {
.icon-search { .icon-search {
width: 24px; width: 24px;
height: 24px; height: 24px;
background-image: url("../../../../assets/images/icon-search.png"); background-image: url("~@/assets/images/icon-search.png");
background-size: 100% 100%; background-size: 100% 100%;
background-repeat: no-repeat; background-repeat: no-repeat;
} }

@ -1,11 +1,3 @@
<!--
* @Descripttion:
* @version:
* @Author: JC9527
* @Date: 2023-08-17 10:41:06
* @LastEditors: JC9527
* @LastEditTime: 2023-08-17 19:08:16
-->
<template> <template>
<dia-log ref="dialog5" :width="width" :title="title"> <dia-log ref="dialog5" :width="width" :title="title">
<div class="tab-list"> <div class="tab-list">
@ -34,7 +26,7 @@ export default {
props: { props: {
width: { width: {
type: String, type: String,
default: "565px", default: "45%",
}, },
title: { title: {
type: String, type: String,
@ -59,10 +51,10 @@ export default {
this.currentIndex = index; this.currentIndex = index;
}, },
open() { open() {
this.$refs.dialog5.open("5"); this.$refs.dialog5.open("1");
}, },
Close() { Close() {
this.$refs.dialog3.Close(); this.$refs.dialog5.Close();
}, },
}, },
}; };
@ -71,19 +63,6 @@ export default {
::v-deep .el-dialog__body { ::v-deep .el-dialog__body {
padding: 30px !important; padding: 30px !important;
} }
.video-main {
display: grid;
grid-template-columns: repeat(3, 200px);
grid-column-gap: 10px;
grid-row-gap: 15px;
.main-item {
// width: 248px;
height: 100px;
width: 100%;
background-image: url("../../../assets/images/videoImg.png");
background-size: 100% 100%;
}
}
.tab-list { .tab-list {
display: flex; display: flex;
align-items: center; align-items: center;

@ -4,10 +4,10 @@
* @Author: JC9527 * @Author: JC9527
* @Date: 2023-08-17 10:41:06 * @Date: 2023-08-17 10:41:06
* @LastEditors: JC9527 * @LastEditors: JC9527
* @LastEditTime: 2023-08-17 19:08:16 * @LastEditTime: 2023-12-11 13:44:59
--> -->
<template> <template>
<dia-log ref="dialog3" width="565px" title="视频墙"> <dia-log ref="dialog3" width="37%" title="视频墙">
<div class="video-main"> <div class="video-main">
<div class="main-item" v-for="(item,index) in 9" :key="index"></div> <div class="main-item" v-for="(item,index) in 9" :key="index"></div>
</div> </div>

@ -4,7 +4,7 @@
* @Author: JC9527 * @Author: JC9527
* @Date: 2023-08-17 16:59:51 * @Date: 2023-08-17 16:59:51
* @LastEditors: JC9527 * @LastEditors: JC9527
* @LastEditTime: 2023-08-17 21:28:32 * @LastEditTime: 2023-12-11 13:43:05
--> -->
<template> <template>
<popup-title :type="3" v-on:personClose="carClose" title="车辆信息" :style="pointLocation"> <popup-title :type="3" v-on:personClose="carClose" title="车辆信息" :style="pointLocation">
@ -19,7 +19,7 @@
</popup-title> </popup-title>
</template> </template>
<script> <script>
import popupTitle from "../popupTitle/index.vue" import popupTitle from "@/views/components/popupTitle/index.vue"
export default { export default {
components:{popupTitle}, components:{popupTitle},
data() { data() {

@ -28,7 +28,7 @@
</popup-title> </popup-title>
</template> </template>
<script> <script>
import popupTitle from "../popupTitle/index.vue" import popupTitle from "@/views/components/popupTitle/index.vue"
export default { export default {
components:{popupTitle}, components:{popupTitle},
data() { data() {

@ -4,7 +4,7 @@
* @Author: JC9527 * @Author: JC9527
* @Date: 2023-08-17 17:14:00 * @Date: 2023-08-17 17:14:00
* @LastEditors: JC9527 * @LastEditors: JC9527
* @LastEditTime: 2023-08-17 21:28:08 * @LastEditTime: 2023-12-11 13:43:25
--> -->
<template> <template>
<popup-title :type="4" v-on:personClose="monitoringClose" title="监控视频" :style="pointLocation"> <popup-title :type="4" v-on:personClose="monitoringClose" title="监控视频" :style="pointLocation">
@ -20,7 +20,7 @@
</popup-title> </popup-title>
</template> </template>
<script> <script>
import popupTitle from "../popupTitle/index.vue" import popupTitle from "@/views/components/popupTitle/index.vue"
export default { export default {
components:{popupTitle}, components:{popupTitle},
data() { data() {

@ -4,7 +4,7 @@
* @Author: JC9527 * @Author: JC9527
* @Date: 2023-08-17 15:43:51 * @Date: 2023-08-17 15:43:51
* @LastEditors: JC9527 * @LastEditors: JC9527
* @LastEditTime: 2023-08-18 20:50:21 * @LastEditTime: 2023-12-11 13:41:09
--> -->
<template> <template>
<div class="person-popup" :style="pointLocation"> <div class="person-popup" :style="pointLocation">
@ -75,7 +75,7 @@ export default {
top: 20px; top: 20px;
width: 242px; width: 242px;
height: 244px; height: 244px;
background-image: url("../../../assets/images/popup/bg1.png"); background-image: url("~@/assets/images/popup/bg1.png");
background-size: 100% 100%; background-size: 100% 100%;
z-index: 600; z-index: 600;
.popup-title { .popup-title {
@ -133,7 +133,7 @@ export default {
grid-row-gap: 6px; grid-row-gap: 6px;
margin-top: 15px; margin-top: 15px;
div { div {
background-image: url('../../../assets/images/popup/icon1btn.png'); background-image: url('~@/assets/images/popup/icon1btn.png');
width: 100%; width: 100%;
height: 30px; height: 30px;
background-size: 100% 100%; background-size: 100% 100%;
Loading…
Cancel
Save