From ac15b43e980d7f33502f72b75f7aba78212edb07 Mon Sep 17 00:00:00 2001 From: gaoyuanwei <2826352639@qq.com> Date: Fri, 9 Sep 2022 10:54:50 +0800 Subject: [PATCH] =?UTF-8?q?=E5=89=8D=E7=AB=AF=E9=A1=B5=E9=9D=A2=E4=BC=98?= =?UTF-8?q?=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/supermap/image/waterPoint4.png | Bin 0 -> 4274 bytes src/supermap/map-showResource.js | 84 +++---- .../waterPoints/components/ComplaintEvent.vue | 94 ++++++-- .../pages/waterPoints/components/SiteList.vue | 186 +++++++++++++--- .../waterPoints/components/VideoList.vue | 210 +++++++++++++----- .../waterPoints/components/WaterHistory.vue | 2 +- .../waterPoints/components/WaterPointPop.vue | 4 +- src/views/pages/waterPoints/index.vue | 124 ++++++----- 8 files changed, 491 insertions(+), 213 deletions(-) create mode 100644 src/supermap/image/waterPoint4.png diff --git a/src/supermap/image/waterPoint4.png b/src/supermap/image/waterPoint4.png new file mode 100644 index 0000000000000000000000000000000000000000..bc69fe1e61e887e505da95ddc23e908902ec7c1e GIT binary patch literal 4274 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 literal 0 HcmV?d00001 diff --git a/src/supermap/map-showResource.js b/src/supermap/map-showResource.js index 868e4fd..16069ef 100644 --- a/src/supermap/map-showResource.js +++ b/src/supermap/map-showResource.js @@ -19,18 +19,18 @@ const restoreIconObj = { restoreIcon: null, currentLayer: null } -const progress = document.getElementById('progress'); -const progressBar = document.getElementById('progress-bar'); +const progress = document.getElementById('progress') +const progressBar = document.getElementById('progress-bar') function updateProgressBar(processed, total, elapsed, layersArray) { if (elapsed > 1000) { // if it takes more than a second to load, display the progress bar: - progress.style.display = 'block'; - progressBar.style.width = Math.round(processed/total*100) + '%'; + progress.style.display = 'block' + progressBar.style.width = Math.round(processed / total * 100) + '%' } if (processed === total) { // all markers processed - hide the progress bar: - progress.style.display = 'none'; + progress.style.display = 'none' } } /** @@ -38,11 +38,11 @@ function updateProgressBar(processed, total, elapsed, layersArray) { * @param layerClassName 据此判断是否需要自定义聚合图层的样式 * @returns {*} */ -function createMarkerClusterLayer (layerClassName) { +function createMarkerClusterLayer(layerClassName) { let markerClusterLayer = null if (layerClassName) { // 如果存在类名，表示需要自定义图标 markerClusterLayer = L.markerClusterGroup({ - iconCreateFunction (cluster) { + iconCreateFunction(cluster) { const markers = cluster.getAllChildMarkers() let n = 0 for (let i = 0; i < markers.length; i++) { @@ -80,7 +80,7 @@ function createMarkerClusterLayer (layerClassName) { * @param doChunk 处理数据的函数 * @param chunkCompleted 数据处理完以后执行的函数 */ -function chunkData (data, doChunk, chunkCompleted) { +function chunkData(data, doChunk, chunkCompleted) { const chunk = data.splice(0, 1000) doChunk(chunk) if (data.length > 0) { @@ -107,7 +107,7 @@ function chunkData (data, doChunk, chunkCompleted) { * @param layerGroup * @return {*|void} layer对象，可以直接用map的removeLayer删除 */ -function addPointOnMap ({ +function addPointOnMap({ feature, iconSize = [48, 48], iconUrl = 'poi.png', @@ -168,7 +168,7 @@ function addPointOnMap ({ * @returns {Promise} * @private */ -function createPromiseByQueryService (idArray = [], layerConfigInfo, type = '') { +function createPromiseByQueryService(idArray = [], layerConfigInfo, type = '') { const queryUrl = _mapConfig.config.QUERY_URL // 构造查询条件authorityFilter let authorityFilter = '' @@ -223,7 +223,7 @@ function createPromiseByQueryService (idArray = [], layerConfigInfo, type = '') * @param {*} * @return {*} */ -function addResourceOnMapNew (features, layerConfig, getLayerPopupInfo, createPopupFun, +function addResourceOnMapNew(features, layerConfig, getLayerPopupInfo, createPopupFun, mapObj, featureGroup, layerGroup) { // 如果资源要素数量为0，则说明该种资源没有记录 if (features.length < 1) { @@ -298,7 +298,7 @@ function addResourceOnMapNew (features, layerConfig, getLayerPopupInfo, createPo * @return {*} * @private */ -function addResourceOnMap ({ +function addResourceOnMap({ features, layerName, layerConfigInfo, @@ -312,7 +312,7 @@ function addResourceOnMap ({ replaceIconUrl = '/src/supermap/image/poi.png', replaceIconSize = [44, 44] } = {}, mapObj, featureGroup, layerGroup) { -// debugger; + // debugger; console.log('上图数据', layerClassName) // 如果资源要素数量为0，则说明该种资源没有记录 if (features.length < 1) { @@ -369,11 +369,11 @@ function addResourceOnMap ({ console.log('图标点击e', e) // 判断是否需要选中之后更换marker的图标 if (clickReplaceIcon) { - // 先把之前选中的图标切换回来 - // const previousLayer = layerGroup.get(layerName).getLayer(restoreIconObj.layerId); - // if (previousLayer) { - // previousLayer.setIcon(icon); - // } + // 先把之前选中的图标切换回来 + // const previousLayer = layerGroup.get(layerName).getLayer(restoreIconObj.layerId); + // if (previousLayer) { + // previousLayer.setIcon(icon); + // } const layers = layerGroup.get(layerName).getLayers() layers.forEach(layer => { layer.setIcon(icon) @@ -390,11 +390,11 @@ function addResourceOnMap ({ let type = null // 根据layerName1 传递不同的 resourceType switch (e.sourceTarget.layerConfigInfo.layerName1) { - // 直升机起降点 + // 直升机起降点 case 'f_helicopter': type = 'resourceHelicopter' break - // 物资储备库 + // 物资储备库 case 'f_repository': type = 'resourceStorage' break @@ -417,7 +417,7 @@ function addResourceOnMap ({ case 'f_check_station': type = 'resourceProtection' break - // 墓地 + // 墓地 case 'f_cemetery': type = 'resourceProtection' break @@ -458,7 +458,7 @@ function addResourceOnMap ({ }) } // 根据类型返回具体用聚合图层的样式。 -function typeToStyle (layerName) { +function typeToStyle(layerName) { let returnStyle = null const typeToImg = { fireForest: 'multi-marker-cluster-resource-protection', @@ -495,7 +495,7 @@ function typeToStyle (layerName) { return returnStyle } // 无聚合上图 =》阳性人员路径 -function addResourceOnMapWithoutSuperMap ( +function addResourceOnMapWithoutSuperMap( features, url, lastOne, createPopupFun, DS, featureGroup, layerGroup, map) { // 如果资源要素数量为0，则说明该种资源没有记录 // if (features.length < 1) { @@ -519,10 +519,10 @@ function addResourceOnMapWithoutSuperMap ( const marker = L.marker(feature.latLng, { icon }) // marker.zjmc = feature.zjmc marker.bindTooltip('

' + numArr[index] + '' + - feature.traveladdress + '(' + feature.count + '次)

' - , { - permanent: true - }) + feature.traveladdress + '(' + feature.count + '次)

' + , { + permanent: true + }) L.tooltipLayout.resetMarker(marker) if (createPopupFun !== null) { marker.on('click', async e => { @@ -551,7 +551,7 @@ function addResourceOnMapWithoutSuperMap ( // L.layerGroup.addLayer(layers) } // 道路污染治理专题-点位上图 -function addPointsToMap (features, url, lastOne, createPopupFun, DS, featureGroup, layerGroup, map) { +function addPointsToMap(features, url, lastOne, createPopupFun, DS, featureGroup, layerGroup, map) { // 如果资源要素数量为0，则说明该种资源没有记录 // if (features.length < 1) { // return Promise.resolve(0); @@ -564,7 +564,7 @@ function addPointsToMap (features, url, lastOne, createPopupFun, DS, featureGrou // layers = createMarkerClusterLayer(defaultStyle) const icon = createDefaultFeatureStyle({ img: url || 'the-head.png', - iconSize: url == ('construction.png'||url == 'waterPoint2.png'||url == 'waterPoint1.png'||url == 'waterPoint3.png')?[37,49]:[36, 36], + iconSize: url == ('construction.png' || url == 'waterPoint2.png' || url == 'waterPoint1.png' || url == 'waterPoint3.png' || url == 'waterPoint4.png') ? [37, 49] : [36, 36] }) const arr = [] features.map((feature, index) => { @@ -582,15 +582,15 @@ function addPointsToMap (features, url, lastOne, createPopupFun, DS, featureGrou marker.on('click', async e => { const elementHtml = createPopupFun(feature) if (elementHtml) { - if(feature.type=='road'){ - L.popup({ className: 'roadGovernance-popup', keepInView: false,}).setLatLng(feature.latLng).setContent(elementHtml).openOn(map) - } else if(feature.type=='site'){ - L.popup({ className: 'site-popup', keepInView: false,}).setLatLng(feature.latLng).setContent(elementHtml).openOn(map) - } else if(feature.type=='siteRoad'){ - L.popup({ className: 'site-road-popup', keepInView: false,}).setLatLng(feature.latLng).setContent(elementHtml).openOn(map) - } else if(feature.type=='waterPoint'){ - L.popup({ className: 'water-point-pop', keepInView: false,}).setLatLng(feature.latLng).setContent(elementHtml).openOn(map) - } else{ + if (feature.type == 'road') { + L.popup({ className: 'roadGovernance-popup', keepInView: false }).setLatLng(feature.latLng).setContent(elementHtml).openOn(map) + } else if (feature.type == 'site') { + L.popup({ className: 'site-popup', keepInView: false }).setLatLng(feature.latLng).setContent(elementHtml).openOn(map) + } else if (feature.type == 'siteRoad') { + L.popup({ className: 'site-road-popup', keepInView: false }).setLatLng(feature.latLng).setContent(elementHtml).openOn(map) + } else if (feature.type == 'waterPoint') { + L.popup({ className: 'water-point-pop', keepInView: false }).setLatLng(feature.latLng).setContent(elementHtml).openOn(map) + } else { L.popup({ className: 'epidemic-address', keepInView: false, maxHeight: 300 }).setLatLng(feature.latLng).setContent(elementHtml).openOn(map) } } @@ -635,7 +635,7 @@ function addPointsToMap (features, url, lastOne, createPopupFun, DS, featureGrou * @return {*} * @private */ -function addResourceOnMapWithoutSuper ({ +function addResourceOnMapWithoutSuper({ features, layerName, layerConfigInfo, @@ -727,11 +727,11 @@ function addResourceOnMapWithoutSuper ({ case 'wf_storage': resourceType = 'resourceStorage' break - // 应急队伍 + // 应急队伍 case 'wf_team': resourceType = 'resourceTeam' break - // 危险源 + // 危险源 case 'wf_danger': resourceType = 'resourceDanger' break @@ -774,7 +774,7 @@ function addResourceOnMapWithoutSuper ({ chunkData(features, doChunk, chunkCompleted) }) } -async function myGetLayerPopupInfo (resId, layerConfigInfo, type, mapObj, latLng, createPopupFun, getLayerPopupInfo, popupClassName) { +async function myGetLayerPopupInfo(resId, layerConfigInfo, type, mapObj, latLng, createPopupFun, getLayerPopupInfo, popupClassName) { const response = await getLayerPopupInfo(resId, layerConfigInfo, type) // debugger; console.log(response) diff --git a/src/views/pages/waterPoints/components/ComplaintEvent.vue b/src/views/pages/waterPoints/components/ComplaintEvent.vue index d09a821..eec3bd6 100644 --- a/src/views/pages/waterPoints/components/ComplaintEvent.vue +++ b/src/views/pages/waterPoints/components/ComplaintEvent.vue @@ -23,7 +23,14 @@ -
总数：{{allNum}}个
+
总数：{{allNum}}个
+
+ + + + +
+
30cm)', '影响行人(<30cm)', '无积水(<10cm)'], + type: ['影响车辆(>30cm)', '影响行人(<30cm)', '无积水或少量积水(<10cm)'], processStateSelect: ['全部', '未派发', '未处置', '已处置'], processStateSelectActive: '全部', - typeActive: ['影响车辆(>30cm)', '影响行人(<30cm)', '无积水(<10cm)'] + typeActive: ['影响车辆(>30cm)', '影响行人(<30cm)', '无积水或少量积水(<10cm)'] }, eventListData: [], preTime: '', @@ -130,7 +137,8 @@ export default { listAll: [], policeList: [], // 单项总数 - allNum: 0 + allNum: 0, + reportType: '随手拍' } }, components: { @@ -161,10 +169,18 @@ export default { selectWaterPoliceList().then((policeRes) => { this.policeList = policeRes.data.data || [] const dataAll = [...res.data.data, ...policeRes.data.data] - this.list = dataAll + // this.list = dataAll this.listAll = dataAll + this.allNum = this.listAll.length + // bus.$emit('waterPoint', dataAll) + this.list = [] + this.listAll.forEach(tempItem => { + if (tempItem.reportOrigin === 'auditorReport') { + this.list.push(tempItem) + } + }) this.allNum = this.list.length - bus.$emit('waterPoint', dataAll) + bus.$emit('waterPoint', this.list) }) // this.list = res.data.data // this.listAll = res.data.data @@ -187,7 +203,7 @@ export default { return `影响行人(${deepth}cm)` break default: - return `无积水(${deepth}cm)` + return `无积水或少量积水(${deepth}cm)` break } }, @@ -204,7 +220,7 @@ export default { case '影响行人(<30cm)': this.list = this.list.filter(v => v.pointLevel != 'pedestrian') break - case '无积水(<10cm)': + case '无积水或少量积水(<10cm)': this.list = this.list.filter(v => v.pointLevel != 'non') break } @@ -221,7 +237,7 @@ export default { case '影响行人(<30cm)': this.list = this.list.concat(this.listAll.filter(v => v.pointLevel == 'pedestrian')) break - case '无积水(<10cm)': + case '无积水或少量积水(<10cm)': this.list = this.list.concat(this.listAll.filter(v => v.pointLevel == 'non')) break } @@ -234,7 +250,7 @@ export default { tabHandleClick (item) { this.allNum = 0 this.tabsActiveName = item.title - this.filterButton.typeActive = ['影响车辆(>30cm)', '影响行人(<30cm)', '无积水(<10cm)'] + this.filterButton.typeActive = ['影响车辆(>30cm)', '影响行人(<30cm)', '无积水或少量积水(<10cm)'] if (item.title == '全部') { selectWaterPoint().then((res) => { @@ -259,6 +275,20 @@ export default { }) this.allNum = this.list.length bus.$emit('waterPoint', this.list) + } else if (item.id == 'commonReport') { + if (this.reportType == '随手拍') { + selectReportOrigin({ reportOrigin: 'case' }).then((res) => { + this.list = res.data.data + this.allNum = this.list.length + bus.$emit('waterPoint', res.data.data) + }) + } else if (this.reportType == '爱山东') { + selectReportOrigin({ reportOrigin: 'commonReport' }).then((res) => { + this.list = res.data.data + this.allNum = this.list.length + bus.$emit('waterPoint', res.data.data) + }) + } } else { selectReportOrigin({ reportOrigin: item.id }).then((res) => { this.list = res.data.data @@ -356,6 +386,14 @@ export default { openDialog (item) { bus.$emit('openWaterPointDialog', item) + }, + // 爱山东、随手拍 + reportTypeChange (item) { + this.reportType = item + this.tabHandleClick({ + title: '群众上报', + id: 'commonReport' + }) } } } @@ -504,6 +542,21 @@ export default { .allNum { color: #ffffff; margin: 12px 0px 0 12px; + display: flex; + justify-content: space-between; + ::v-deep .el-radio-button__inner { + background: rgba(24, 51, 76, 0.95); + color: #ffffff; + border: none; + width: 70px; + padding: 6px; + border-radius: 2px; + } + ::v-deep .el-radio-button__orig-radio:checked + .el-radio-button__inner { + background: #279ff5; + border: none; + margin-right: 2px; + } } .filter-btn-box { margin-top: 16px; @@ -701,13 +754,13 @@ export default { .box3 { color: #fff; margin-top: 10px; - height: 600px; + height: 565px; overflow-y: scroll; cursor: pointer; .item { - margin-top: 10px; + margin-top: 8px; background: rgba(5, 33, 59, 0.35); - padding: 10px; + padding: 6px 10px; .top { display: flex; justify-content: space-between; @@ -716,7 +769,7 @@ export default { } .name { font-weight: 600; - font-size: 14px; + font-size: 16px; } .topType { margin-left: 5px; @@ -743,6 +796,9 @@ export default { .green { background: #31d779; } + .type { + font-size: 14px; + } } .bottom { margin-top: 10px; diff --git a/src/views/pages/waterPoints/components/SiteList.vue b/src/views/pages/waterPoints/components/SiteList.vue index ae6bd4a..52a448e 100644 --- a/src/views/pages/waterPoints/components/SiteList.vue +++ b/src/views/pages/waterPoints/components/SiteList.vue @@ -1,9 +1,11 @@ @@ -334,7 +430,7 @@ export default { background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; - font-family: 'Tensentype-ZhiHeiJ-W5'; + font-family: "Tensentype-ZhiHeiJ-W5"; } .time { text-align: left; @@ -414,13 +510,19 @@ export default { } & > div:last-child { width: 40%; - height: 165px; + // height: 165px; } } - #analysis-of-water-source,#analysis-of-water-level { + #analysis-of-water-source, + #analysis-of-water-level { width: 100%; height: 165px; margin: 22px; } + #event-type-chart { + width: 100%; + height: 207px; + margin: 22px 0; + } } diff --git a/src/views/pages/waterPoints/components/WaterHistory.vue b/src/views/pages/waterPoints/components/WaterHistory.vue index 8346b3e..e0b0a39 100644 --- a/src/views/pages/waterPoints/components/WaterHistory.vue +++ b/src/views/pages/waterPoints/components/WaterHistory.vue @@ -90,7 +90,7 @@ export default { selectWaterPondingInDay({ water_point_id: this.feature.data.waterPointId, year: String(this.dateYearData[0]), month: String(this.dateYearData[1]), day: String(this.dateYearData[2]) }).then((res) => { console.log(res.data.data, 'res') res.data.data.map(val => { - this.depthDayX.push(val.hour + ':' + val.minute) + this.depthDayX.push((val.hour > 9 ? val.hour : '0' + val.hour) + ':' + (val.minute > 9 ? val.minute : '0' + val.minute)) this.depthDayY.push(Number(val.depth) * 100) }) console.log(this.depthDayX, this.depthDayY, ' this.depthDayX') diff --git a/src/views/pages/waterPoints/components/WaterPointPop.vue b/src/views/pages/waterPoints/components/WaterPointPop.vue index 4566ddf..3748c2b 100644 --- a/src/views/pages/waterPoints/components/WaterPointPop.vue +++ b/src/views/pages/waterPoints/components/WaterPointPop.vue @@ -69,7 +69,7 @@ 更新时间: {{ feature.data.updatedDate || "" }}
- +
@@ -141,7 +141,7 @@ export default { } else if (data.pointLevel == 'pedestrian') { return '影响行人(<30cm)' } else { - return '无积水(<10cm)' + return '无积水或少量积水(<10cm)' } }, typeSelect (item) { diff --git a/src/views/pages/waterPoints/index.vue b/src/views/pages/waterPoints/index.vue index 8b7e854..7a4692d 100644 --- a/src/views/pages/waterPoints/index.vue +++ b/src/views/pages/waterPoints/index.vue @@ -46,20 +46,17 @@
- -
- +
-
@@ -71,18 +68,18 @@
-
+
@@ -99,7 +96,7 @@ import complaintEvent from './components/ComplaintEvent' import VideoList from './components/VideoList' import SiteList from './components/SiteList' import { selectByJdWd } from '@/api/construction/index' -import { createSiteListPop, createCameraDetailsPop,createWaterPointPop } from '@/supermap/createMarkerPopup' +import { createSiteListPop, createCameraDetailsPop, createWaterPointPop } from '@/supermap/createMarkerPopup' import VideoPlay from './components/VideoPlay' export default { @@ -113,9 +110,9 @@ export default { // changeLayerBtnList: ['视频监控', '易积水点'], changeLayerBtnList: ['易积水点'], changeLayerBtnGroup: [], - eventCheckList: ['影响车辆(>30cm)', '影响行人(<30cm)', '无积水(<10cm)'], + eventCheckList: ['影响车辆(>30cm)', '影响行人(<30cm)', '无积水或少量积水(<10cm)'], openVideo: false, - channelCode:[] + channelCode: [] } }, @@ -180,7 +177,7 @@ export default { bus.$off('openWaterPointDialog') bus.$on('openWaterPointDialog', (item) => { - this.hiMap.mapObj.map.flyTo({ lat: item.latitude, lng: item.longitude },16) + this.hiMap.mapObj.map.flyTo({ lat: item.latitude, lng: item.longitude }, 16) // this.WithinRadiusSite(latLng); // const dataEvent = [{ // latLng: { lat: item.latitude, lng: item.longitude }, @@ -196,11 +193,10 @@ export default { }) bus.$off('openCurrentVideoWaterPoint') - bus.$on('openCurrentVideoWaterPoint',channelCode => { - this.openVideo = true; + bus.$on('openCurrentVideoWaterPoint', channelCode => { + this.openVideo = true this.channelCode.unshift(channelCode) }) - }, methods: { querySearchAsync (queryString, cb) { @@ -372,51 +368,54 @@ export default { this.hiMapFun.removeLayerByLayerName('waterPoint1') this.hiMapFun.removeLayerByLayerName('waterPoint2') this.hiMapFun.removeLayerByLayerName('waterPoint3') + this.hiMapFun.removeLayerByLayerName('waterPoint4') const dataEvent1 = [] const dataEvent2 = [] const dataEvent3 = [] + const dataEvent4 = [] data.forEach((item) => { const arr = [0, 0.0, '', '0', '0.0'] if (arr.indexOf(item.longitude) == -1) { - switch(item.pointLevel){ + switch (item.pointLevel) { case 'non': dataEvent1.push({ latLng: { lat: Number(item.latitude), lng: Number(item.longitude) }, data: item, type: 'waterPoint' }) - break; + break case 'pedestrian': dataEvent2.push({ latLng: { lat: Number(item.latitude), lng: Number(item.longitude) }, data: item, type: 'waterPoint' }) - break; + break case 'traffic': - dataEvent3.push({ + dataEvent3.push({ latLng: { lat: Number(item.latitude), lng: Number(item.longitude) }, data: item, type: 'waterPoint' }) - break; + break default: - dataEvent1.push({ + dataEvent4.push({ latLng: { lat: Number(item.latitude), lng: Number(item.longitude) }, data: item, type: 'waterPoint' }) - break; + break } } }) this.hiMapFun.addPointsToMap(dataEvent1, 'waterPoint1.png', 'waterPoint1', createWaterPointPop) this.hiMapFun.addPointsToMap(dataEvent2, 'waterPoint2.png', 'waterPoint2', createWaterPointPop) this.hiMapFun.addPointsToMap(dataEvent3, 'waterPoint3.png', 'waterPoint3', createWaterPointPop) + this.hiMapFun.addPointsToMap(dataEvent4, 'waterPoint4.png', 'waterPoint4', createWaterPointPop) }, - selectType(item){ + selectType (item) { this.$refs.complaintEventRef.selectType(item) } }, @@ -427,7 +426,7 @@ export default { @import url(../../../../node_modules/element-ui/lib/theme-chalk/index.css); @font-face { - font-family: 'Tensentype-ZhiHeiJ-W5'; + font-family: "Tensentype-ZhiHeiJ-W5"; src: url("../../../assets/construction/TTZhiHeiJ-W5.ttf"); } .map-box { @@ -456,11 +455,11 @@ export default { background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; - font-family: 'Tensentype-ZhiHeiJ-W5'; + font-family: "Tensentype-ZhiHeiJ-W5"; } .title::before { - content: '青岛市易积水点地图'; - text-shadow: 0px 3px 10px rgba(0,0,0,.9); + content: "青岛市易积水点地图"; + text-shadow: 0px 3px 10px rgba(0, 0, 0, 0.9); position: absolute; z-index: -1; } @@ -471,20 +470,20 @@ export default { z-index: 1000; left: 496px; top: 90px; - border: 1px solid rgba(31,254,253,.9); + border: 1px solid rgba(31, 254, 253, 0.9); ::v-deep .el-input__inner { color: #fff; - background: rgba($color: #203b5d, $alpha: .8); + background: rgba($color: #203b5d, $alpha: 0.8); width: 226px; height: 36px; - border:none; + border: none; &::placeholder { color: rgba($color: #fff, $alpha: 0.6); } } ::v-deep .el-input__prefix { top: -1px; - color: rgba(31,254,253,.9); + color: rgba(31, 254, 253, 0.9); } ::v-deep .el-input-group__append { width: 54px; @@ -503,7 +502,7 @@ export default { z-index: -1 !important; width: 226px !important; left: 0px !important; - background: rgba(32,59,93,.8); + background: rgba(32, 59, 93, 0.8); border: 1px solid #1ffefd; li { color: #fff; @@ -519,9 +518,9 @@ export default { z-index: 1000; left: 10px; top: 90px; - height:908px; + height: 908px; width: 478px; - background: rgba($color: #05213b, $alpha: .85) + background: rgba($color: #05213b, $alpha: 0.85); } .eventNum { @@ -542,7 +541,7 @@ export default { span { font-size: 46px; font-weight: bold; - background: linear-gradient(0deg, #91f4f8 0%, #ffffff 100% ); + background: linear-gradient(0deg, #91f4f8 0%, #ffffff 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; @@ -558,23 +557,23 @@ export default { top: 92px; width: 398px; // height:460px; - background: rgba($color: #05213b, $alpha: .85); + background: rgba($color: #05213b, $alpha: 0.85); } .siteList { position: absolute; z-index: 1000; right: 8px; - top: 660px; + top: 703px; width: 398px; // height:500px; - background: rgba($color: #05213b, $alpha: .85); + background: rgba($color: #05213b, $alpha: 0.85); } .changeLayer { width: 332px; height: 67px; - background: rgba(7,26,44,.8); + background: rgba(7, 26, 44, 0.8); position: absolute; bottom: 10px; left: 50%; @@ -585,7 +584,7 @@ export default { width: 96px; height: 100%; font-size: 16px; - color: rgba(255,255,255,.6); + color: rgba(255, 255, 255, 0.6); text-align: center; line-height: 67px; } @@ -596,17 +595,16 @@ export default { padding-left: 20px; ::v-deep .el-checkbox-group { - .el-checkbox-button__inner{ - padding: 6px 14px; - border: 0; - border-radius: 10px; - + .el-checkbox-button__inner { + padding: 6px 14px; + border: 0; + border-radius: 10px; } - .el-checkbox-button:first-child .el-checkbox-button__inner{ + .el-checkbox-button:first-child .el-checkbox-button__inner { margin-right: 10px; } - .el-checkbox-button.is-checked .el-checkbox-button__inner{ - background: #027DB4; + .el-checkbox-button.is-checked .el-checkbox-button__inner { + background: #027db4; color: #ffffff; box-shadow: unset; } @@ -614,7 +612,7 @@ export default { } } - .eventSelection{ + .eventSelection { width: 170px; height: 100px; background: rgba(7, 26, 44, 0.8); @@ -625,16 +623,16 @@ export default { display: flex; align-items: center; z-index: 1000; - ::v-deep .el-checkbox__label{ + ::v-deep .el-checkbox__label { color: #ffffff; } - ::v-deep .el-checkbox{ - margin:0 15px; - .el-checkbox__inner{ - margin-right: 15px; + ::v-deep .el-checkbox { + margin: 0 15px; + .el-checkbox__inner { + margin-right: 15px; } } - .eventSelectionIcon{ + .eventSelectionIcon { display: block; width: 14px; height: 14px; @@ -642,21 +640,27 @@ export default { background: #f74b3f; position: absolute; left: 34.5px; - top: 21px; + top: 13px; } - .eventSelectionIcon:nth-child(2){ + .eventSelectionIcon:nth-child(2) { background: #ffae2b; - position: absolute; + position: absolute; left: 34.5px; - top: 42px; + top: 34px; } - .eventSelectionIcon:nth-child(3){ + .eventSelectionIcon:nth-child(3) { background: #31d779; position: absolute; left: 34.5px; - top: 63px; + top: 54px; } } + ::v-deep .el-checkbox__label { + display: inline-grid; + width: 170px; + white-space: pre-line; + word-wrap: break-word; + } }