派生自 wuyushui/SewerAndRainNetwork
src/components/base-page/enterprise-emergency/event-handling/EventHandling.vue
@@ -1,28 +1,25 @@ <template> <el-dialog :visible.sync="isShow" class="effect-vol-calc" title="分析" :modal="false" v-dialog-drag :before-close="handleClose"> <div> <el-dialog :visible.sync="isShow" class="effect-vol-calc" title="分析" :modal="false" v-dialog-drag :before-close="handleClose"> <!--<!– 基本信息–>--> <!-- <event-base-info>--> <!--<!– 基本信息–>--> <!-- <event-base-info>--> <!-- </event-base-info>--> <!-- 建议处置--> <disposal-proposed> </disposal-proposed> <!-- 有效容积计算--> <div class="footer"> <el-button type="primary" size="mini" @click="toggleShowCalc">事故水计算</el-button> <el-button type="primary" size="mini" @click="toggleShowResInfo">周边资源</el-button> <el-button type="primary" size="mini" @click="toggleShowReportDoc">生成报告</el-button> <!-- <el-button type="primary" size="mini" @click="close">返回</el-button>--> </div> <effective-volume-calc ref="effectVolCalc"></effective-volume-calc> <event-report-doc ref="eventReportDoc" :reportItemCon="reportItemCon"> </event-report-doc> <res-info ref="resInfo"></res-info> </el-dialog> <!-- </event-base-info>--> <!-- 建议处置--> <disposal-proposed></disposal-proposed> <!-- 有效容积计算--> <div class="footer"> <el-button type="primary" size="mini" @click="toggleShowCalc">事故水计算</el-button> <el-button type="primary" size="mini" @click="toggleShowResInfo">周边资源</el-button> <el-button type="primary" size="mini" @click="toggleShowReportDoc">生成报告</el-button> <!-- <el-button type="primary" size="mini" @click="close">返回</el-button>--> </div> <effective-volume-calc ref="effectVolCalc"></effective-volume-calc> <event-report-doc ref="eventReportDoc" :reportItemCon="reportItemCon"></event-report-doc> <res-info ref="resInfo"></res-info> </el-dialog> </div> </template> <script> @@ -32,9 +29,15 @@ import EventReportDoc from '@components/base-page/enterprise-emergency/event-handling/EventReportDoc' import ResInfo from '@components/base-page/enterprise-emergency/event-handling/ResInfo' import eventBus from '../../../../eventBus' export default { name: 'EventHandling', components: { ResInfo, EventReportDoc, DisposalProposed, EffectiveVolumeCalc }, components: { ResInfo, EventReportDoc, DisposalProposed, EffectiveVolumeCalc }, data () { return { isShow: false, @@ -65,7 +68,9 @@ report () { console.log('生成报告') }, close () { console.log('返回') }, close () { console.log('返回') }, handleClose () { this.isShow = false @@ -76,7 +81,7 @@ </script> <style lang="less" scoped> .footer{ .footer { text-align: right; margin: 15px; } src/components/base-page/enterprise-emergency/events-reported/EventsReported.vue
@@ -1,147 +1,147 @@ <template> <div class="event-report"> <el-form :model="ruleForm" ref="ruleForm" label-width="90px" class="search-form"> <!-- 事件名称--> <el-form-item class="input-event-name" label="事件名称" prop="nameOfEvent"> <el-input v-model="ruleForm.nameOfEvent" placeholder="将事件命名" ></el-input> </el-form-item> <!-- 事件类型--> <el-form-item label="事件类型" prop="eventOfType"> <el-radio-group v-model="ruleForm.eventOfType"> <el-col :span="8" v-for="(item,index) in ruleForm.eventOfTypeList" :key="index" :style="{margin:'5px 0'}"> <el-radio :label="item.value"> <span>{{ item.name }}</span> </el-radio> </el-col> </el-radio-group> </el-form-item> <!-- 事件等级--> <el-form-item label="事件分级" prop="eventOfLevel"> <el-radio-group v-model="ruleForm.eventOfLevel"> <el-col :span="8" v-for="(item,index) in ruleForm.eventOfLevelList" :key="index" :style="{margin:'5px 0'}"> <el-radio :label="item.value"> <span>{{ item.name }}</span> </el-radio> </el-col> </el-radio-group> </el-form-item> <el-row> <!-- 事发单位--> <el-col :span="12"> <el-form-item label="事发单位" prop="unit"> <el-select v-model="ruleForm.unit" placeholder="单位,装置选择"> <el-option v-for="item in ruleForm.unitList" :key="item.value" :label="item.label" :value="item.value"> </el-option> </el-select> </el-form-item> </el-col> <!-- 事发时间--> <el-col :span="12"> <el-form-item class="search-panel-item" label="事发时间" prop="atTime"> <el-date-picker v-model="ruleForm.atTime" type="datetime" placeholder="年/月/日"> </el-date-picker> </el-form-item> </el-col> </el-row> <el-row> <!-- 事发位置--> <el-col :span="12"> <el-form-item label="事发位置" prop="positionOf"> <el-input v-model="ruleForm.positionOf" clearable> <!-- <el-button slot="suffix" type="text" class="el-icon-location-information"--> <!-- @click="locationInfo"></el-button>--> <el-button style="padding-right:10px;" slot="suffix" type="text" @click="locationInfo"> <img src="../../../../../public/assets/images/map/loc.png" alt=""> </el-button> </el-input> </el-form-item> </el-col> <!-- 位置描述--> <el-col :span="12"> <el-form-item label="位置描述" prop="positionDescription"> <el-input v-model="ruleForm.positionDescription"></el-input> </el-form-item> </el-col> </el-row> <el-row> <!-- 管线名称--> <el-col :span="12"> <el-form-item label="管线名称" prop="lineName" class="search-panel-item"> <el-input disabled v-model="ruleForm.lineName" placeholder="自动带出不可修改" class="report-input"></el-input> </el-form-item> </el-col> <!-- 管线类型--> <el-col :span="12"> <el-form-item label="管线类型" prop="lineType"> <label>{{ ruleForm.lineTypeText }}</label> </el-form-item> </el-col> </el-row> <!-- 点击上传--> <el-form-item label="附件上传" prop="upload"> <el-upload class="upload-demo" action="uploadAction" multiple :limit="3" :file-list="fileList"> <el-button size="small" type="primary">点击上传</el-button> </el-upload> </el-form-item> <!-- 消息推送--> <el-form-item label="消息推送" prop="beingPush"> <el-checkbox-group v-model="ruleForm.beingPushed" @change="infoChange"> <el-checkbox v-for="item in ruleForm.beingPushList" :key="item.name" :label="item.name" > </el-checkbox> </el-checkbox-group> </el-form-item> <!-- // 描述 接收 展示、隐藏--> <div v-show="wayTo" class="way-to"> <el-form-item label="事件描述" prop="desc"> <el-input type="textarea" resize="none" v-model="ruleForm.desc" placeholder="带出事件类型，事件位置，事件单位，事件时间等字段自动生产一部分描述"> </el-input> <el-button type="primary">一键<br/>生成</el-button> </el-form-item> <el-form-item label="接收人员" prop="receiveOne"> <el-input type="textarea" resize="none" v-model="ruleForm.receiveOne" placeholder="张三；李四，"></el-input> <el-button type="primary">+</el-button> </el-form-item> </div> <el-form-item class="confirmCancel"> <el-button type="primary" size="small" @click="submitForm('ruleForm')">确认</el-button> <el-button size="small" @click="resetForm('ruleForm')">取消</el-button> </el-form-item> </el-form> <el-dialog custom-class="event-report-dialog" title="事发位置定位" :visible.sync="dialogLocation" :append-to-body="true" :modal="false" v-dialogDrag > <ReportLocation></ReportLocation> </el-dialog> </div> <div class="event-report"> <el-form :model="ruleForm" ref="ruleForm" label-width="90px" class="search-form"> <!-- 事件名称--> <el-form-item class="input-event-name" label="事件名称" prop="nameOfEvent"> <el-input v-model="ruleForm.nameOfEvent" placeholder="将事件命名" ></el-input> </el-form-item> <!-- 事件类型--> <el-form-item label="事件类型" prop="eventOfType"> <el-radio-group v-model="ruleForm.eventOfType"> <el-col :span="8" v-for="(item,index) in ruleForm.eventOfTypeList" :key="index" :style="{margin:'5px 0'}"> <el-radio :label="item.value"> <span>{{ item.name }}</span> </el-radio> </el-col> </el-radio-group> </el-form-item> <!-- 事件等级--> <el-form-item label="事件分级" prop="eventOfLevel"> <el-radio-group v-model="ruleForm.eventOfLevel"> <el-col :span="8" v-for="(item,index) in ruleForm.eventOfLevelList" :key="index" :style="{margin:'5px 0'}"> <el-radio :label="item.value"> <span>{{ item.name }}</span> </el-radio> </el-col> </el-radio-group> </el-form-item> <el-row> <!-- 事发单位--> <el-col :span="12"> <el-form-item label="事发单位" prop="unit"> <el-select v-model="ruleForm.unit" placeholder="单位,装置选择"> <el-option v-for="item in ruleForm.unitList" :key="item.value" :label="item.label" :value="item.value"> </el-option> </el-select> </el-form-item> </el-col> <!-- 事发时间--> <el-col :span="12"> <el-form-item class="search-panel-item" label="事发时间" prop="atTime"> <el-date-picker v-model="ruleForm.atTime" type="datetime" placeholder="年/月/日"> </el-date-picker> </el-form-item> </el-col> </el-row> <el-row> <!-- 事发位置--> <el-col :span="12"> <el-form-item label="事发位置" prop="positionOf"> <el-input v-model="ruleForm.positionOf" clearable> <!-- <el-button slot="suffix" type="text" class="el-icon-location-information"--> <!-- @click="locationInfo"></el-button>--> <el-button style="padding-right:10px;" slot="suffix" type="text" @click="locationInfo"> <img src="../../../../../public/assets/images/map/loc.png" alt=""> </el-button> </el-input> </el-form-item> </el-col> <!-- 位置描述--> <el-col :span="12"> <el-form-item label="位置描述" prop="positionDescription"> <el-input v-model="ruleForm.positionDescription"></el-input> </el-form-item> </el-col> </el-row> <el-row> <!-- 管线名称--> <el-col :span="12"> <el-form-item label="管线名称" prop="lineName" class="search-panel-item"> <el-input disabled v-model="ruleForm.lineName" placeholder="自动带出不可修改" class="report-input"></el-input> </el-form-item> </el-col> <!-- 管线类型--> <el-col :span="12"> <el-form-item label="管线类型" prop="lineType"> <label>{{ ruleForm.lineTypeText }}</label> </el-form-item> </el-col> </el-row> <!-- 点击上传--> <el-form-item label="附件上传" prop="upload"> <el-upload class="upload-demo" action="uploadAction" multiple :limit="3" :file-list="fileList"> <el-button size="small" type="primary">点击上传</el-button> </el-upload> </el-form-item> <!-- 消息推送--> <el-form-item label="消息推送" prop="beingPush"> <el-checkbox-group v-model="ruleForm.beingPushed" @change="infoChange"> <el-checkbox v-for="item in ruleForm.beingPushList" :key="item.name" :label="item.name" > </el-checkbox> </el-checkbox-group> </el-form-item> <!-- // 描述 接收 展示、隐藏--> <div v-show="wayTo" class="way-to"> <el-form-item label="事件描述" prop="desc"> <el-input type="textarea" resize="none" v-model="ruleForm.desc" placeholder="带出事件类型，事件位置，事件单位，事件时间等字段自动生产一部分描述"> </el-input> <el-button type="primary">一键<br/>生成</el-button> </el-form-item> <el-form-item label="接收人员" prop="receiveOne"> <el-input type="textarea" resize="none" v-model="ruleForm.receiveOne" placeholder="张三；李四，"></el-input> <el-button type="primary">+</el-button> </el-form-item> </div> <el-form-item class="confirmCancel"> <el-button type="primary" size="small" @click="submitForm('ruleForm')">确认</el-button> <el-button size="small" @click="resetForm('ruleForm')">取消</el-button> </el-form-item> </el-form> <el-dialog custom-class="event-report-dialog" title="事发位置定位" :visible.sync="dialogLocation" :append-to-body="true" :modal="false" v-dialogDrag > <ReportLocation></ReportLocation> </el-dialog> </div> </template> <!-- :rules="rules"--> <!-- :show-close="false"--> @@ -376,90 +376,85 @@ <style lang="less" scoped> /*/deep/ .el-dialog .el-dialog--center {*/ /* margin-top: 1rem !important;*/ /* margin-left: 6.4rem !important;*/ /*}*/ /deep/ .event-report-dialog { left: 5rem; top: 1rem; margin-top: 2rem; margin-left: 2rem; } /deep/ .event-report-dialog { left: 5rem; top: 1rem; margin-top: 2rem; margin-left: 2rem; } /deep/ .el-dialog { left: 5rem; top: 1rem; width: 3.087834rem; } /deep/ .el-dialog { left: 5rem; top: 1rem; width: 3.087834rem; } .event-report { margin: 0 5px !important; } .event-report { margin: 0 5px !important; } .way-to { /deep/ .el-form-item__content { display: flex; } } .way-to { /deep/ .el-form-item__content { display: flex; } } /deep/ .el-form-item { margin: 2px 0 !important; color: #00fff6 !important; } /deep/ .el-form-item { margin: 2px 0 !important; color: #00fff6 !important; } /deep/ .el-textarea__inner { height: 0.28rem !important; max-height: 0.45rem !important; width: 2rem; color: darkgrey; border: solid 1px #00fff6; background-color: rgba(0, 255, 246, 0.14); outline: none; font-size: 0.01rem; } /deep/ .el-textarea__inner { height: 0.28rem !important; max-height: 0.45rem !important; width: 2rem; color: darkgrey; border: solid 1px #00fff6; background-color: rgba(0, 255, 246, 0.14); outline: none; font-size: 0.01rem; } /deep/ .el-checkbox__label { color: #00fff6 !important; } /deep/ .el-checkbox__label { color: #00fff6 !important; } /deep/ .el-icon-time:before { content: " "; } /deep/ .el-icon-time:before { content: " "; } /deep/ input { border-radius: 0; background-color: rgba(0, 255, 246, 0.14); border: solid 1px #00fff6; color: #C0C4CC; font-size: 0.01rem; } /deep/ input { border-radius: 0; background-color: rgba(0, 255, 246, 0.14); border: solid 1px #00fff6; color: #C0C4CC; font-size: 0.01rem; } /deep/ .el-input.is-disabled .el-input__inner { color: #C0C4CC; font-size: 0.01rem; border-radius: 4px; background: @background-color; border-color: @color; } /deep/ .el-input.is-disabled .el-input__inner { color: #C0C4CC; font-size: 0.01rem; border-radius: 4px; background: @background-color; border-color: @color; } /deep/ .el-input__inner { height: 0.2rem !important; border-radius: 5px; background: rgba(0, 16, 30, 0.5); } /deep/ .el-input__inner { height: 0.2rem !important; border-radius: 5px; background: rgba(0, 16, 30, 0.5); } /deep/ .el-form-item__label { color: @color; } /deep/ .el-form-item__label { color: @color; } /deep/ .el-radio__label { color: @color; } /deep/ .el-radio__label { color: @color; } .confirmCancel { text-align: right; margin: 0.071234rem !important; } .confirmCancel { text-align: right; margin: 0.071234rem !important; } </style> src/components/base-page/enterprise-emergency/events-reported/ReportLocation.js
New file @@ -0,0 +1,17 @@ // 公共方法 上报数据 到数据库中 export function publicLocationStore (data) { // const data = { // ID: '', // EventID: '', // EventPipeline: '', // EventPipeSeg: '', // EventAffType: '', // EventAffCode: '', // EventAffPointNum: '', // EventPosX: '', // EventPosY: '', // AcquisitionPeople: '', // AcquisitionDate: '' // } console.log(data) } src/components/base-page/enterprise-emergency/events-reported/ReportLocationPoint.vue
@@ -1,44 +1,45 @@ <template> <div class="location-lon-and-lat"> <el-form :model="lonlatpos" label-width="60px"> <el-row class="pipe-line-search"> <el-col :span="12"> <el-form-item label="经度:"> <el-input v-model="lonlatpos.longPos"></el-input> </el-form-item> </el-col> <el-col :span="12"> <el-form-item label="纬度:"> <el-input v-model="lonlatpos.latPos"></el-input> </el-form-item> </el-col> </el-row> </el-form> <el-row> <el-col :span="12" style="text-align: center;margin: 5px 0"> <el-button type="primary" size="small" @click="mapPoints">精确定位</el-button> </el-col> <el-col :span="12" style="text-align: center;margin: 5px 0"> <el-button type="primary" size="small" @click="dataPoints">位置拾取</el-button> </el-col> </el-row> <el-row style="text-align: right;margin: 5px"> <el-button type="primary" @click="confirm" size="small">确认</el-button> </el-row> </div> <div class="location-lon-and-lat"> <el-form :model="positionLocationForm" label-width="60px"> <el-row class="pipe-line-search"> <el-col :span="12"> <el-form-item label="经度:"> <el-input v-model="positionLocationForm.longPos"></el-input> </el-form-item> </el-col> <el-col :span="12"> <el-form-item label="纬度:"> <el-input v-model="positionLocationForm.latPos"></el-input> </el-form-item> </el-col> </el-row> </el-form> <el-row> <el-col :span="12" style="text-align: center;margin: 5px 0"> <el-button type="primary" size="small" @click="mapPoints">精确定位</el-button> </el-col> <el-col :span="12" style="text-align: center;margin: 5px 0"> <el-button type="primary" size="small" @click="dataPoints">位置拾取</el-button> </el-col> </el-row> <el-row style="text-align: right;margin: 5px"> <el-button type="primary" @click="confirm" size="small">确认</el-button> </el-row> </div> </template> <script> import { pulseEffect } from '../../../../utils/utils' import iconUrl from '../../../../../public/assets/images/map/marker-icon.png' import eventBus from '../../../../eventBus' import { publicLocationStore } from './ReportLocation' export default { name: 'ReportLocationPoint', data () { return { // 经纬度定位 lonlatpos: { positionLocationForm: { longPos: '', latPos: '' }, @@ -50,8 +51,8 @@ // 精确定位 mapPoints () { window.map.on('click', (e) => { this.lonlatpos.longPos = parseFloat(e.latlng.lng).toFixed(8) this.lonlatpos.latPos = parseFloat(e.latlng.lat).toFixed(8) this.positionLocationForm.longPos = parseFloat(e.latlng.lng).toFixed(8) this.positionLocationForm.latPos = parseFloat(e.latlng.lat).toFixed(8) const as = [e.latlng.lat, e.latlng.lng] // console.log(as) window.map.setView(as, 17) @@ -63,17 +64,17 @@ iconAnchor: [13, 20] }) }) // 添加点数据 window.map.addLayer(this.marker) this.layersGroupArrList.push(this.marker) // 事件结束 关闭点击事件 window.map.off('click') // this.lonlatpos.latPos = '' // this.lonlatpos.longPos = '' }) }, // 通过数据定位 dataPoints () { if (this.lonlatpos.latPos !== '' && this.lonlatpos.longPos !== '') { const as = [this.lonlatpos.latPos, this.lonlatpos.longPos] if (this.positionLocationForm.latPos !== '' && this.positionLocationForm.longPos !== '') { const as = [this.positionLocationForm.latPos, this.positionLocationForm.longPos] window.map.setView(as, 17) pulseEffect(as) this.marker = window.L.marker(as, { @@ -91,14 +92,32 @@ }, // 点击确认按钮事件 confirm () { // 循环数据 清除 图层添加的点数据 for (let i = 0; i < this.layersGroupArrList.length; i++) { window.map.removeLayer(this.layersGroupArrList[i]) } window.mapManager.clearHighlight() // window.map.removeLayer(this.marker) eventBus.$emit('location-setChange', true) this.lonlatpos.longPos = '' this.lonlatpos.latPos = '' // 事件上报 位置信息 存储数据库 const data = { ID: '', EventID: '', EventPipeline: '', EventPipeSeg: '', EventAffType: '', EventAffCode: '', EventAffPointNum: '', EventPosX: this.positionLocationForm.longPos, EventPosY: this.positionLocationForm.latPos, AcquisitionPeople: '', AcquisitionDate: '' } // 通过方法 存储数据 进行 数据库存储数据 publicLocationStore(data) // 确定点数据 位置信息 进行数据 的置空 this.positionLocationForm.longPos = '' this.positionLocationForm.latPos = '' } } } src/components/base-page/enterprise-emergency/events-reported/ReportLocationSearch.vue
@@ -2,7 +2,7 @@ <div class="click-location"> <el-row> <!-- clearable--> <el-input type="text" v-model="clickLocation" @change="focusLocation"> <el-input type="text" v-model="clickLocation" @change="focusLocation" style="display:flex;align-items: center"> <el-button slot="suffix" type="text" @click="focusLocation"> <img src="../../../../../public/assets/images/map/emergency/search.png" alt=""> </el-button> @@ -10,29 +10,6 @@ </el-row> <!-- <el-scrollbar style="height:250.34px">--> <el-row v-for="(item,index) in searchList.slice((currentPage-1)*pageSize,currentPage*pageSize)" :key="index" style="display: flex;align-items: center;margin: 0.1343rem 15px;text-align: left" class="environmental-risk-list"> <!-- <div v-if="item.resultType === 1">--> <el-col :span="4"> <img src="../../../../../public/assets/images/map/marker-icon.png" alt="" class="state" style="background: none;margin: 0 15px"> </el-col> <el-col :span="12"> <div class=search-list> <!-- <h4 :class="activeNum===index?'hover':''" @click="handleLocation(index)">名称：<h3 style="display: inline-block">{{ item.name }}</h3></h4>--> <h3 style="text-overflow: ellipsis;white-space: nowrap;overflow: hidden" :class="activeNum===index?'hover':''" @click="handleLocation(index)">名称：{{ item.name }}</h3> <p style="text-overflow: ellipsis;white-space: nowrap;overflow: hidden">地址：<span>{{ item.address }}</span> <p style="text-overflow: ellipsis;white-space: nowrap;overflow: hidden">电话：<span>{{ item.phone }}</span></p> </div> </el-col> <el-col :span="8" style="text-align: right"> <el-button type="primary" size="mini" icon="el-icon-position" @click="locationMapClick(item,index)"> 定位 </el-button> </el-col> <!-- </div>--> </el-row> <el-row v-for="(item,index) in searchListStatistics.slice((currentPage-1)*pageSize,currentPage*pageSize)" :key="index" style="display: flex;align-items: center;margin: 0.1343rem 15px;text-align: left" class="environmental-risk-list"> <!-- <div v-if="item.resultType === 1">--> @@ -43,13 +20,38 @@ <el-col :span="12"> <div class=search-list> <!-- <h4 :class="activeNum===index?'hover':''" @click="handleLocation(index)">名称：<h3 style="display: inline-block">{{ item.name }}</h3></h4>--> <h3 :class="activeNum===index?'hover':''" @click="handleLocation(index)" >名称：{{ item.name }}</h3> <h3 style="text-overflow: ellipsis;white-space: nowrap;overflow: hidden" :class="activeNum===index?'hover':''" @click="locationMapClick(1, item, index)">名称：{{ item.name }}</h3> <p style="text-overflow: ellipsis;white-space: nowrap;overflow: hidden">地址：<span>{{ item.address }}</span> <p>电话：<span>{{ item.phone }}</span></p> <p style="text-overflow: ellipsis;white-space: nowrap;overflow: hidden">电话：<span>{{ item.phone }}</span></p> </div> </el-col> <el-col :span="8" style="text-align: right"> <el-button type="primary" size="mini" icon="el-icon-position" @click="locationMapClick(item,index)"> <el-button type="primary" size="mini" icon="el-icon-position" @click="locationMapClick(1,item,index)"> 定位 </el-button> </el-col> <!-- </div>--> </el-row> <el-row v-for="(item,index) in searchListStatistics.slice((currentPage-1)*pageSize,currentPage*pageSize)" :key="index" style="display: flex;align-items: center;margin: 0.1343rem 15px;text-align: left" class="environmental-risk-list"> <!-- <div v-if="item.resultType === 1">--> <el-col :span="4"> <img src="../../../../../public/assets/images/map/marker-icon.png" alt="" class="state" style="background: none;margin: 0 15px"> </el-col> <el-col :span="12"> <div class=search-list> <!-- <h4 :class="activeNum===index?'hover':''" @click="handleLocation(index)">名称：<h3 style="display: inline-block">{{ item.name }}</h3></h4>--> <h3 @click="locationMapClick(2, item, index)" :class="activeNum===index?'hover':''">名称：{{ item.name }}</h3> <p style="text-overflow: ellipsis;white-space: nowrap;overflow: hidden">行政代码：<span>{{ item.adminCode }}</span> <p></p> </div> </el-col> <el-col :span="8" style="text-align: right"> <el-button type="primary" size="mini" icon="el-icon-position" @click="locationMapClick(2,item,index)"> 定位 </el-button> </el-col> @@ -79,6 +81,7 @@ import { pulseEffect } from '../../../../utils/utils' import eventBus from '../../../../eventBus' import iconUrl from '../../../../../public/assets/images/map/marker-icon.png' import { publicLocationStore } from './ReportLocation' export default { name: 'ReportLocationSearch', @@ -103,13 +106,6 @@ } }, methods: { handlePage (currentPage) { // this.focusLocation() this.currentPage = currentPage }, handleLocation (index) { this.activeNum = index }, // 搜索定位 focusLocation () { // 每次进行搜索 都对之前数组列表进行置空 @@ -135,40 +131,82 @@ console.log(res) // 返回数据类型 1（普通POI） if (res.resultType === 1) { this.searchList = res.pois // this.total = res.count this.total = res.pois.length if (res.pois) { this.searchList = res.pois // this.total = res.count this.total = res.pois.length } } else if (res.resultType === 2) { // 返回数据类型 2（统计 this.searchListStatistics = res.statistics.priorityCitys this.total = res.statistics.priorityCitys.length } else if (res.resultType === 3) { // 返回数据类型 3 area 区域 } else { this.$message('未搜索到您想要数据') } }) }, // getStyle (index) { // console.log(index) // if (this.activeNum === index) { // return { color: 'red' } // } // }, // 点击定位 locationMapClick (val, index) { this.activeNum = index const ps = val.lonlat.trim().split(' ') this.marker = window.L.marker([ps[1], ps[0]], { icon: window.L.icon({ iconUrl: iconUrl, iconSize: [26, 40], iconAnchor: [13, 20] locationMapClick (type, val, index) { // this.activeNum = index // this.getStyle(index) // console.log(val) if (type === 1) { this.activeNum = index const ps = val.lonlat.trim().split(' ') this.marker = window.L.marker([ps[1], ps[0]], { icon: window.L.icon({ iconUrl: iconUrl, iconSize: [26, 40], iconAnchor: [13, 20] }) }) }) .bindTooltip(val.name, { permanent: 'true', direction: 'bottom', offset: [0, 10], sticky: true, className: '' .bindTooltip(val.name, { permanent: 'true', direction: 'bottom', offset: [0, 10], sticky: true, className: '' }) window.map.addLayer(this.marker) this.layersGroupArrList.push(this.marker) window.map.setView([ps[1], ps[0]], 17) pulseEffect([ps[1], ps[0]]) } else if (type === 2) { this.activeNum = index const ps = [val.lon, val.lat] this.marker = window.L.marker([ps[1], ps[0]], { icon: window.L.icon({ iconUrl: iconUrl, iconSize: [26, 40], iconAnchor: [13, 20] }) }) window.map.addLayer(this.marker) this.layersGroupArrList.push(this.marker) window.map.setView([ps[1], ps[0]], 17) pulseEffect([ps[1], ps[0]]) .bindTooltip(val.name, { permanent: 'true', direction: 'bottom', offset: [0, 10], sticky: true, className: '' }) window.map.addLayer(this.marker) this.layersGroupArrList.push(this.marker) window.map.setView([ps[1], ps[0]], 17) pulseEffect([ps[1], ps[0]]) } }, // 分页功能 当前页 handlePage (currentPage) { console.log(currentPage) this.currentPage = currentPage this.activeNum = -1 }, // 点击确认按钮事件 confirm () { @@ -176,9 +214,28 @@ for (let i = 0; i < this.layersGroupArrList.length; i++) { window.map.removeLayer(this.layersGroupArrList[i]) } // 事件上报 位置信息 存储数据库 const data = { ID: '', EventID: '', EventPipeline: '', EventPipeSeg: '', EventAffType: '', EventAffCode: '', EventAffPointNum: '', EventPosX: '', EventPosY: '', AcquisitionPeople: '', AcquisitionDate: '' } // 通过方法 存储数据 进行 数据库存储数据 publicLocationStore(data) // 确认事件 置空数据 this.searchList = [] this.searchListStatistics = [] this.clickLocation = '' this.total = 0 // 通过 传递数据 关闭 位置选择 eventBus.$emit('location-setChange', true) } } @@ -186,12 +243,6 @@ </script> <style lang="less" scoped> /*/deep/ .el-row {*/ /* margin: 2px 0 !important;*/ /* padding: 0;*/ /* height: 10px;*/ /* max-height: 10px;*/ /*}*/ .environmental-risk-list { color: @color; border-bottom: 1px solid rgba(0, 255, 246, 0.14); @@ -211,6 +262,16 @@ } } //.environmental-risk-list :hover { // h3 { // color: @color-highlight; // } //} //.search-list :hover { // color: @color-highlight; //} .hover { color: @color-highlight; } src/components/base-page/enterprise-emergency/events-reported/ReportLocationSection.vue
@@ -1,156 +1,156 @@ <template> <div class="ReportLocationSection"> <el-form :model="form" label-width="120px"> <el-row class="pipe-line-search"> <el-col :span="18"> <el-form-item label="管线名称:"> <el-input v-model="form.pipeName" @change="pipelineSearch"> <el-button style="padding-right:10px;" slot="suffix" type="text" @click="pipelineSearch"> <img src="../../../../../public/assets/images/map/emergency/search.png" alt=""> </el-button> </el-input> </el-form-item> </el-col> <el-col :span="6"> <el-button type="primary" size="small" icon="el-icon-location-outline" @click="pipeClickLocation">定位 </el-button> </el-col> </el-row> <el-row> <el-col :span="24"> <el-form-item label="管段编码:"> <el-input v-model="form.sectionName" disabled></el-input> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="12"> <el-form-item label="附属设施编码:"> <el-input v-model="form.affiliatedFacilities" disabled></el-input> </el-form-item> </el-col> <el-col :span="12"> <el-form-item label="附属设施类型:"> <el-input v-model="form.affiliatedFacilitiesCode" disabled></el-input> </el-form-item> </el-col> </el-row> </el-form> <div class="pipe-table" v-show="this.tableList.length>=1"> <el-card> <span class="fixed-style" style="display: block">管线名称</span> <el-table :data="tableList" border height="120" max-height="140" @row-click="sectionShowClick" style="width: 100%"> <el-table-column label="序号" type="index" > </el-table-column> <el-table-column show-overflow-tooltip prop="properties.pipename" label="管线名称"> </el-table-column> <el-table-column show-overflow-tooltip prop="properties.subchaname" label="支线名称"> </el-table-column> <el-table-column show-overflow-tooltip prop="properties.mediumtype" label="管线类型"> </el-table-column> <el-table-column width="40" fixed="right" label="操作"> <template slot-scope="scope"> <el-button @click="localAdr(scope.row)" type="text" size="small">定位</el-button> </template> </el-table-column> </el-table> </el-card> <el-card> <span class="fixed-style" style="display: block">管段列表</span> <el-table :data="tableListSection" border @row-click="sectionCode" height="100" max-height="100" style="width: 100%"> <el-table-column show-overflow-tooltip prop="properties.pipesegcode" label="管段编码"> </el-table-column> <el-table-column show-overflow-tooltip prop="properties.startpointnumber" label="起点探查号"> </el-table-column> <el-table-column show-overflow-tooltip prop="properties.endpointnumber" label="终点探查号"> </el-table-column> <el-table-column show-overflow-tooltip prop="properties.material" label="材质"> </el-table-column> <el-table-column show-overflow-tooltip prop="properties.embeddingmode" label="埋设方式"> </el-table-column> <el-table-column width="40" fixed="right" label="操作"> <template slot-scope="scope"> <el-button @click="localAdr(scope.row)" type="text" size="small">定位</el-button> </template> </el-table-column> </el-table> <span class="fixed-style" style="display: block">附属设施列表</span> <el-table :data="tableDataAffFac" border @row-click="affFacName" height="120" max-height="140" style="width: 100%"> <el-table-column show-overflow-tooltip width="150" prop="properties.pipecode" label="管线编号"> </el-table-column> <el-table-column show-overflow-tooltip width="150" prop="properties.name" label="附属设施名称"> </el-table-column> <el-table-column width="150" show-overflow-tooltip prop="properties.type" label="设施类型"> </el-table-column> <el-table-column width="90" fixed="right" label="操作"> <template slot-scope="scope"> <el-button @click="localAdr(scope.row)" type="text" size="small">定位</el-button> </template> </el-table-column> </el-table> </el-card> </div> <el-row style="text-align: right;margin: 10px"> <el-button type="primary" @click="confirm" size="small">确认</el-button> </el-row> <div class="ReportLocationSection"> <el-form :model="form" label-width="120px"> <el-row class="pipe-line-search"> <el-col :span="18"> <el-form-item label="管线名称:"> <el-input v-model="form.pipeName" @change="pipelineSearch"> <el-button style="padding-right:10px;" slot="suffix" type="text" @click="pipelineSearch"> <img src="../../../../../public/assets/images/map/emergency/search.png" alt=""> </el-button> </el-input> </el-form-item> </el-col> <el-col :span="6"> <el-button type="primary" size="small" icon="el-icon-location-outline" @click="pipeClickLocation">定位 </el-button> </el-col> </el-row> <el-row> <el-col :span="18"> <el-form-item label="管段编:"> <el-input v-model="form.sectionName" disabled></el-input> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="12"> <el-form-item label="附属设施编码:"> <el-input v-model="form.affiliatedFacilities" disabled></el-input> </el-form-item> </el-col> <el-col :span="12"> <el-form-item label="附属设施类型:"> <el-input v-model="form.affiliatedFacilitiesCode" disabled></el-input> </el-form-item> </el-col> </el-row> </el-form> <div class="pipe-table" v-show="this.tableList.length>=1"> <el-card> <span class="fixed-style" style="display: block">管线名称</span> <el-table :data="tableList" border height="120" max-height="140" @row-click="sectionShowClick" style="width: 100%"> <el-table-column label="序号" type="index" > </el-table-column> <el-table-column show-overflow-tooltip prop="properties.pipename" label="管线名称"> </el-table-column> <el-table-column show-overflow-tooltip prop="properties.subchaname" label="支线名称"> </el-table-column> <el-table-column show-overflow-tooltip prop="properties.mediumtype" label="管线类型"> </el-table-column> <el-table-column width="40" fixed="right" label="操作"> <template slot-scope="scope"> <el-button @click="localAdr(scope.row)" type="text" size="small">定位</el-button> </template> </el-table-column> </el-table> </el-card> <el-card> <span class="fixed-style" style="display: block">管段列表</span> <el-table :data="tableListSection" border @row-click="sectionCode" height="100" max-height="100" style="width: 100%"> <el-table-column show-overflow-tooltip prop="properties.pipesegcode" label="管段编码"> </el-table-column> <el-table-column show-overflow-tooltip prop="properties.startpointnumber" label="起点探查号"> </el-table-column> <el-table-column show-overflow-tooltip prop="properties.endpointnumber" label="终点探查号"> </el-table-column> <el-table-column show-overflow-tooltip prop="properties.material" label="材质"> </el-table-column> <el-table-column show-overflow-tooltip prop="properties.embeddingmode" label="埋设方式"> </el-table-column> <el-table-column width="40" fixed="right" label="操作"> <template slot-scope="scope"> <el-button @click="localAdr(scope.row)" type="text" size="small">定位</el-button> </template> </el-table-column> </el-table> <span class="fixed-style" style="display: block">附属设施列表</span> <el-table :data="tableDataAffFac" border @row-click="affFacName" height="120" max-height="140" style="width: 100%"> <el-table-column show-overflow-tooltip width="150" prop="properties.pipecode" label="管线编号"> </el-table-column> <el-table-column show-overflow-tooltip width="150" prop="properties.name" label="附属设施名称"> </el-table-column> <el-table-column width="150" show-overflow-tooltip prop="properties.type" label="设施类型"> </el-table-column> <el-table-column width="90" fixed="right" label="操作"> <template slot-scope="scope"> <el-button @click="localAdr(scope.row)" type="text" size="small">定位</el-button> </template> </el-table-column> </el-table> </el-card> </div> <el-row style="text-align: right;margin: 10px"> <el-button type="primary" @click="confirm" size="small">确认</el-button> </el-row> </div> </template> <script> @@ -159,6 +159,7 @@ import AjaxUtils from '@utils/AjaxUtils' import eventBus from '../../../../eventBus' import { WMS_URL } from '../../../../conf/Constants' import { publicLocationStore } from './ReportLocation' export default { name: 'ReportLocationSection', @@ -355,9 +356,27 @@ confirm () { // console.log('点击确定选择完成') eventBus.$emit('location-setChange', true) // 事件上报 位置信息 存储数据库 const data = { ID: '', EventID: '', EventPipeline: this.form.pipeName, EventPipeSeg: this.form.sectionName, EventAffType: this.form.affiliatedFacilitiesCode, EventAffCode: this.form.affiliatedFacilities, EventAffPointNum: '', EventPosX: '', EventPosY: '', AcquisitionPeople: '', AcquisitionDate: '' } // 通过方法 存储数据 进行 数据库存储数据 publicLocationStore(data) // 数据置空 this.form.pipeName = '' this.form.sectionName = '' this.form.affiliatedFacilities = '' this.form.affiliatedFacilitiesCode = '' this.tableList = [] this.tableListSection = [] this.tableDataAffFac = [] @@ -368,86 +387,23 @@ </script> <style lang="less" scoped> /*/deep/ .el-input {*/ /* width: 0.74353rem;*/ /*}*/ .pipe-line-search { display: flex; align-items: center; .pipe-line-search { display: flex; align-items: center; .el-button { margin: 0 15px; } .el-button { margin: 0 15px; } } .pipe-table { /deep/ .el-card { .el-table { margin: 0.05345rem auto; } } } .pipe-table { /*display: flex;*/ /*align-items: center;*/ /*justify-content: space-around;*/ /deep/ .el-card { /*width: 1.39523rem;*/ /*max-width: 1.39523rem;*/ /*height: 0.9343rem;*/ /*max-height: 0.9343rem;*/ .el-table { margin: 0.05345rem auto; } } } .fixed-style { color: @color; } /deep/ .warnPagination { .btn-quicknext, .btn-quickprev { color: #e4e8f1 !important; background-color: transparent; // border: 1px solid #25AECD; border-left: 1px solid #25AECD; border-bottom: 1px solid #25AECD; border-top: 1px solid #25AECD; color: #e4e8f1; } .el-pager li { color: #e4e8f1; background: transparent; // border: 1px solid #25AECD; border-left: 1px solid #25AECD; border-bottom: 1px solid #25AECD; border-top: 1px solid #25AECD; } .el-pager li.active { border-color: #25AECD; background-color: rgba(38, 222, 253, 0.3); color: #e4e8f1; } .el-pager li:hover { border-color: #25AECD; background-color: rgba(38, 222, 253, 0.3); color: #34e0ff; } .btn-prev { background-color: transparent; // border: 1px solid #25AECD; border-left: 1px solid #25AECD; border-bottom: 1px solid #25AECD; border-top: 1px solid #25AECD; color: #e4e8f1; } .btn-next { background-color: transparent; border: 1px solid #25AECD; color: #e4e8f1; } } </style> src/components/panel/topicSearch/SewersSearch.vue
@@ -1,85 +1,84 @@ <template> <div class="sewers-search" v-if="gdVisible"> <div class="panel-title">{{ title }}</div> <el-tabs v-model="activeName" @tab-click="handleClick"> <el-tab-pane label="查询" name="first"> <div class="search-panel "> <el-form ref="form" :model="form" label-width="90px" class="search-form"> <el-form-item label="设施类型：" size="mini" class="search-panel-item"> <el-select style="width: 100%" v-model="form.pipelineType" :popper-class="'select-down'"> <el-option v-for="item in items" :key="item.code" :label="item.name" :value="item.name"> </el-option> </el-select> </el-form-item> <el-form-item :label="form.pipelineType+'：'" size="mini"> <el-select style="width: 100%" v-model="form.dataType" value-key="code" :popper-class="'select-down'" @change="handleDataType"> <el-option v-for="item in subItems" :key="item.code" :label="item.name" :value="item"> </el-option> </el-select> </el-form-item> <div class="page_total"> <p>共计 <span>{{total}}</span> 条记录 </p> </div> <div class="rightButtonSearch"> <el-input v-model="form.keyword" size="mini" placeholder="在此输入关键字搜索"></el-input> <el-button class="el-icon-search" @click="handleSearch"></el-button> </div> </el-form> </div> <el-scrollbar style="height:413px;"> <div class="environmental-risk-list" v-for="(item,index) in list" :key="index" :class="activeNum===index?'hover':''"> <img class="state" :src="getImgSrc()" style="background: none"/> <div> <h3 @click="handleLocation(item,index)">{{ item.properties.name || item.properties.code }}</h3> <p>所属企业：<span>{{ item.properties.orgname }}</span> <p>设施类型：<span>{{ item.properties.type }}</span> <el-button v-if="fuShuSheShiShow" class="rt btn00fff6" size="mini" style="margin-right: 0.04rem;" @click="btnAffiliatedFacilities(item,index)"> 附属设施 </el-button> </p> </div> </div> </el-scrollbar> <el-card class="footer-page" v-if="total > 10"> <el-pagination small @current-change="handlePage" :page-size=pageSize layout="prev, pager, next" :total=total class="warnPagination" > </el-pagination> </el-card> </el-tab-pane> <el-tab-pane label="分析" name="second"> <SewersAnalysis></SewersAnalysis> </el-tab-pane> <el-tab-pane label="历史" name="third"> <SewersHistory></SewersHistory> </el-tab-pane> </el-tabs> <!-- 附属设施面板 --> <affiliated-facilities :facilitiesParameter="facilitiesParameter" v-if="fuShuSheShiShow"></affiliated-facilities> </div> <div class="sewers-search" v-if="gdVisible"> <div class="panel-title">{{ title }}</div> <el-tabs v-model="activeName" @tab-click="handleClick"> <el-tab-pane label="查询" name="first"> <div class="search-panel "> <el-form ref="form" :model="form" label-width="90px" class="search-form"> <el-form-item label="设施类型：" size="mini" class="search-panel-item"> <el-select style="width: 100%" v-model="form.pipelineType" :popper-class="'select-down'"> <el-option v-for="item in items" :key="item.code" :label="item.name" :value="item.name"> </el-option> </el-select> </el-form-item> <el-form-item :label="form.pipelineType+'：'" size="mini"> <el-select style="width: 100%" v-model="form.dataType" value-key="code" :popper-class="'select-down'" @change="handleDataType"> <el-option v-for="item in subItems" :key="item.code" :label="item.name" :value="item"> </el-option> </el-select> </el-form-item> <div class="page_total"> <p>共计 <span>{{ total }}</span> 条记录 </p> </div> <div class="rightButtonSearch"> <el-input v-model="form.keyword" size="mini" placeholder="在此输入关键字搜索"></el-input> <el-button class="el-icon-search" @click="handleSearch"></el-button> </div> </el-form> </div> <el-scrollbar style="height:413px;"> <div class="environmental-risk-list" v-for="(item,index) in list" :key="index" :class="activeNum===index?'hover':''"> <img class="state" :src="getImgSrc()" style="background: none"/> <div> <h3 @click="handleLocation(item,index)">{{ item.properties.name || item.properties.code }}</h3> <p>所属企业：<span>{{ item.properties.orgname }}</span> <p>设施类型：<span>{{ item.properties.type }}</span> <el-button v-if="fuShuSheShiShow" class="rt btn00fff6" size="mini" style="margin-right: 0.04rem;" @click="btnAffiliatedFacilities(item,index)"> 附属设施 </el-button> </p> </div> </div> </el-scrollbar> <el-card class="footer-page" v-if="total > 10"> <el-pagination small @current-change="handlePage" :page-size=pageSize layout="prev, pager, next" :total=total class="warnPagination" > </el-pagination> </el-card> </el-tab-pane> <el-tab-pane label="分析" name="second"> <SewersAnalysis></SewersAnalysis> </el-tab-pane> <el-tab-pane label="历史" name="third"> <SewersHistory></SewersHistory> </el-tab-pane> </el-tabs> <!-- 附属设施面板 --> <affiliated-facilities :facilitiesParameter="facilitiesParameter" v-if="fuShuSheShiShow"></affiliated-facilities> </div> </template> <script> src/components/panel/topicSearch/enterprise-emergency/EventQuery.vue
@@ -99,7 +99,7 @@ :visible.sync="dialogVisible" :append-to-body="true" :modal="false" v-dialogDrag v-dialog-drag > <EventsReported></EventsReported> </el-dialog> src/views/MapTemplate.vue
@@ -1,28 +1,20 @@ <template> <div class="full-screen"> <!--<popup ref="popup" @callPopup="callPopup"></popup>--> <div id="map" ref="rootmap"> </div> <sgis-layer-controller></sgis-layer-controller> <monitor-panel></monitor-panel> <!-- <top-enterprise-panel></top-enterprise-panel>--> <tool-box-panel ref="toolBox"></tool-box-panel> <!-- <menu-special></menu-special>--> <legend-panel></legend-panel> <!-- <summary-sheets></summary-sheets>--> <SummarySheet></SummarySheet> <!-- <enterprise></enterprise> --> <!-- <el-button id="map-btn" el-icon-c-scale-to-original icon="el-icon-c-scale-to-original" circle @click="isShowHidden"></el-button>--> <!-- <el-button type="primary" @click="ChangeState" class="solid-waste">固废</el-button>--> <!-- <el-button type="primary" @click="ChangeWaterState" class="Waste-water">废水</el-button>--> <!-- <el-button type="primary" @click="AddGasHelper" class="flue-gas">废气</el-button>--> <!-- <PublicBounced ref="PublicBounced"></PublicBounced>--> <ReportIncident></ReportIncident> <Emergency ref="Emergency"></Emergency> <Message></Message> <EventsReported></EventsReported> <event-handling></event-handling> <div class="full-screen"> <!--<popup ref="popup" @callPopup="callPopup"></popup>--> <div id="map" ref="rootmap"> </div> <sgis-layer-controller></sgis-layer-controller> <monitor-panel></monitor-panel> <!-- <top-enterprise-panel></top-enterprise-panel>--> <tool-box-panel ref="toolBox"></tool-box-panel> <!-- <menu-special></menu-special>--> <legend-panel></legend-panel> <!-- <summary-sheets></summary-sheets>--> <SummarySheet></SummarySheet> <Emergency ref="Emergency"></Emergency> <Message></Message> <event-handling></event-handling> </div> </template> <script> @@ -35,18 +27,12 @@ // import summarySheets from '@components/table/summarySheets.vue'SummarySheet import SummarySheet from '@components/table/summarySheets' import ToolBoxPanel from '@components/panel/ToolBoxPanel' // import MenuSpecial from '@components/panel/MenuTopic' import LegendPanel from '@components/panel/LegendPanel' // import Enterprise from '../components/table/enterprise' // // 公共展示数据 // import PublicBounced from '@components/base-page/PublicBounced/PublicBounced' import LayerFactory from '@components/LayerController/service/LayerFactory' import ReportIncident from '../components/base-page/enterprise-emergency/discard/ReportIncident' import Emergency from '@components/emergency/index' import MapManager from '../components/helpers/MapManager' import Message from '@components/message/index' import EventsReported from '../components/base-page/enterprise-emergency/events-reported/EventsReported' import EventHandling from '@components/base-page/enterprise-emergency/event-handling/EventHandling' import EventHandling from '../components/base-page/enterprise-emergency/event-handling/EventHandling' export default { name: 'MapTemplate', @@ -61,11 +47,8 @@ MonitorPanel, // summarySheets, SummarySheet, // PublicBounced, Emergency, Message, ReportIncident, EventsReported Message }, data () { return { @@ -134,59 +117,59 @@ </script> <style lang="less"> .flue-gas { position: fixed; top: 88px; left: 180px; z-index: 500; } .flue-gas { position: fixed; top: 88px; left: 180px; z-index: 500; } .solid-waste { position: absolute; top: 88px; left: 88px; z-index: 999; } .solid-waste { position: absolute; top: 88px; left: 88px; z-index: 999; } .full-screen { width: 100%; height: 100%; margin: 0; padding: 0; position: absolute; .full-screen { width: 100%; height: 100%; margin: 0; padding: 0; position: absolute; #map { height: 100%; width: 100%; } #map { height: 100%; width: 100%; } .barline { //width: 100%; //height: 1px; //background-color: #0661AE; border-top: 1px solid #0661AE; } .barline { //width: 100%; //height: 1px; //background-color: #0661AE; border-top: 1px solid #0661AE; } #map-btn { position: fixed; top: 20px; left: 100px; z-index: 9999; } #map-btn { position: fixed; top: 20px; left: 100px; z-index: 9999; } .leaflet-custom-icon { background: white; } .leaflet-custom-icon { background: white; } .leaflet-marker-icon { background: none; } .leaflet-marker-icon { background: none; } #migic { width: 48px; height: 48px; margin: -18px -20px; z-index: 999; } } #migic { width: 48px; height: 48px; margin: -18px -20px; z-index: 999; } } </style>
