Merge remote-tracking branch 'origin/develop' into develop
# Conflicts:
# src/components/panel/ToolBoxPanel.vue
| | |
| | | @background-color-split: rgba(0, 255, 246, .14);//分割线 |
| | | @background-color-tools: #1A4951;//工具箱 |
| | | @border-radius: .03rem;//倒角 |
| | | |
| | | @size-0:.08333rem; |
| | | @size-1: .125rem; |
| | | @size-2: .125rem; |
| | | @size-3: .24479rem; |
| | |
| | | <el-button size="mini" round @click="dialogVisible = true">明细表</el-button> |
| | | <el-dialog :visible.sync="dialogVisible" |
| | | :append-to-body="true" |
| | | width="66%" |
| | | :title="this.$attrs.getWasteGasDetails[0].OnLineMonEmissPointName" |
| | | width="68%" |
| | | center |
| | | v-dialogDrag |
| | | > |
| | | <div class="el-dialog-div" style="height: 600px"> |
| | | <div class="el-dialog-div" style="height: 500px"> |
| | | <public-detailed-list v-bind="$attrs"></public-detailed-list> |
| | | </div> |
| | | </el-dialog> |
| | |
| | | <template> |
| | | <div class="PublicDetailedList"> |
| | | <el-table :data="tableData" max-height="600px"> |
| | | <el-table :data="tableData" max-height="500px"> |
| | | <el-table-column prop="OnLineMonEmissPointName" label="排放点"></el-table-column> |
| | | <el-table-column prop="MonTimeStr" label="监测时间"></el-table-column> |
| | | <el-table-column label="氮氧化物"> |
| | |
| | | <div class="border_corner border_corner_right_bottom"></div> |
| | | <div class="main"> |
| | | <div class="main-table"> |
| | | <el-table |
| | | stripe='stripe' |
| | | <el-table :data="listData" style="width: 100%" stripe='stripe' |
| | | :height="300" |
| | | tooltip-effect="dark" |
| | | :data="displayContentTableData" |
| | | :row-class-name="tableRowClassName" |
| | | > |
| | | <el-table-column prop="StoragePlaceId" label="序号"></el-table-column> |
| | | <el-table-column prop="StoragePlaceTypeName" label="类别"></el-table-column> |
| | | <el-table-column prop="StoragePlaceName" label="固废名称"></el-table-column> |
| | | <el-table-column prop="StorageZDMJ" label="代码"></el-table-column> |
| | | <el-table-column prop="StorageZCNL" label="产生量(t)"></el-table-column> |
| | | <el-table-column prop="StorageZCL" label="储存量(t)"></el-table-column> |
| | | <el-table-column prop="StorageType" label="产生装置"></el-table-column> |
| | | tooltip-effect="dark" :row-class-name="tableRowClassName"> |
| | | <el-table-column v-for="(item, index) in listLabel" :key="index" :prop="item.prop" |
| | | :label="item.label"></el-table-column> |
| | | </el-table> |
| | | </div> |
| | | </div> |
| | |
| | | props: ['displayContentTable'], |
| | | data () { |
| | | return { |
| | | displayContentTableData: [] |
| | | listData: [], |
| | | listLabel: [ |
| | | { |
| | | label: '序号', |
| | | prop: 'StoragePlaceId' |
| | | }, |
| | | { |
| | | label: '类别', |
| | | prop: 'StoragePlaceTypeName' |
| | | }, |
| | | { |
| | | label: '固废名称', |
| | | prop: 'StoragePlaceName' |
| | | }, |
| | | { |
| | | label: '代码', |
| | | prop: 'StorageZDMJ' |
| | | }, |
| | | { |
| | | label: '产生量(t)', |
| | | prop: 'StorageZCL' |
| | | }, |
| | | { |
| | | label: '贮存量(t)', |
| | | prop: 'StorageZCNL' |
| | | }, |
| | | { |
| | | label: '产生装置', |
| | | prop: 'StorageType' |
| | | } |
| | | ] |
| | | } |
| | | }, |
| | | mounted () { |
| | | this.$nextTick(() => { |
| | | this.displayContentTable.forEach(item => { |
| | | this.displayContentTableData = item |
| | | this.listData = item |
| | | }) |
| | | }) |
| | | }, |
| | |
| | | .win { |
| | | position: relative; |
| | | background-color: rgba(33, 41, 69, 0.9); |
| | | min-height: 300px; |
| | | min-height: 354px; |
| | | } |
| | | |
| | | .main { |
| | |
| | | border: 1px solid #396d83; |
| | | padding: 6px; |
| | | //.main-video { |
| | | height: 378px; |
| | | height: 432px; |
| | | video { |
| | | width: 100%; |
| | | height: 378px; |
| | | height: 432px; |
| | | outline: none; |
| | | } |
| | | //} |
| | |
| | | <div class="public-bounced-content-left-bottom"> |
| | | <public-table v-if="value === 'gufei'" |
| | | :displayContentTable="displayContentTable"></public-table> |
| | | <public-chart v-else></public-chart> |
| | | <public-chart v-else :getWasteGasDetails="getWasteGasDetails"></public-chart> |
| | | </div> |
| | | </div> |
| | | <div class="public-bounced-content-right"> |
| | |
| | | |
| | | // 根据点击不同数据 进行接口的数据请求 |
| | | this.requestSolidWasteData = async (e) => { |
| | | // 基本信息展示 |
| | | // 基本信息 和 详细信息 展示数据所需参数 |
| | | const dataValue = { |
| | | StoragePlaceId: e.layer.options.totransferData.StoragePlaceId |
| | | } |
| | | // 基本信息 tabs |
| | | const resultBasic = await mapApi.getSolidWasteBaseInfo(dataValue) |
| | | // 详细信息展示 |
| | | // 详细信息展示 table |
| | | const resultDetailed = await mapApi.getSolidWasteDetail(dataValue) |
| | | |
| | | // 绑定弹框实例 |
| | | const PublicBounced = window.Vue.extend(publicBounced) |
| | | const instance = new PublicBounced() |
| | | instance.$mount() |
| | | document.body.appendChild(instance.$el) |
| | | // 通过方法 向绑定弹框传递数据 |
| | | instance.setData(resultBasic.Result.DataInfo, resultDetailed.Result.DataInfo, 'gufei') |
| | | /* flyTo()弹出框平移事件 */ |
| | | this.setPanTo(e.latlng, 200) |
| | |
| | | <template> |
| | | <div class="inner-panel"> |
| | | <div class="filter-group"> |
| | | <div v-for="item in pointLayers" :key="item.code" class="filter-item"> |
| | | <div v-for="item in layers" :key="item.code" class="filter-item"> |
| | | <div class="title"><input type="checkbox" :value="item.code" :checked="item.checked" |
| | | @change="swAllSubFilter(item)">{{item.name}} |
| | | </div> |
| | | <el-scrollbar style="height:100%"> |
| | | <div class="content"> |
| | | <div v-for="filter in item.layers" :key="filter.code"> |
| | | <input type="checkbox" :value="filter.code" :checked="filter.checked" @change="swSubFilter(item.url,filter)"><label |
| | | <input type="checkbox" :value="filter.code" :checked="filter.checked" |
| | | @change="swSubFilter(item.url,filter)"><label |
| | | :title="filter.name">{{filter.name}}</label> |
| | | </div> |
| | | </div> |
| | |
| | | |
| | | <script> |
| | | import { mapMutations } from 'vuex' |
| | | import { LayerSewersPoint } from '@src/conf/layers/LayerSewers' |
| | | |
| | | export default { |
| | | name: 'LcServiceLayerFilter', |
| | |
| | | data () { |
| | | return { |
| | | visible: {}, |
| | | layerSewersPoint: LayerSewersPoint, |
| | | layers: [], |
| | | filterConfig: [] // 附属要素 |
| | | } |
| | | }, |
| | | computed: { |
| | | serviceLayers () { |
| | | return this.$store.state.map.serviceLayers.LayerSewersLine |
| | | }, |
| | | config () { |
| | | return this.$store.state.map.config |
| | | }, |
| | | pointLayers () { |
| | | // 根据线图层选中情况,显示或隐藏点图层面板 |
| | | var serviceLayers = this.config.mapConfig.Layers.LayerSewersLine // 一级图层 |
| | | var checkedLayers = window.serviceLayerHelper.getCheckedLayers(serviceLayers) |
| | | var pointLayers = this.config.mapConfig.Layers.layerSewersPoint // 二级图层 |
| | | return pointLayers.filter(function (layer) { |
| | | var code = layer.code |
| | | for (var i = 0; i < checkedLayers.length; i++) { |
| | | var checkedLayer = checkedLayers[i] |
| | | if (checkedLayer.childLayer.indexOf(code) >= 0) { |
| | | return checkedLayer |
| | | } |
| | | } |
| | | }) |
| | | } |
| | | }, |
| | | mounted () { |
| | | // this.filterConfig = window.serviceLayerHelper.getWMSConfig().filtersGroup |
| | | }, |
| | | methods: { |
| | | ...mapMutations([]), |
| | | swAllSubFilter (item) { |
| | | item.checked = !item.checked |
| | | console.log(item) |
| | | // window.serviceLayerHelper.loadLayers() |
| | | }, |
| | | // todo 还需要优化,在有多个需要子图层独立弹窗情况下无效 |
| | | toggle (serviceLayers) { |
| | | for (var i = 0; i < serviceLayers.length; i++) { |
| | | var serviceLayer = serviceLayers[i] |
| | | var childLayer = serviceLayer.childLayer |
| | | if (childLayer) { |
| | | if (this.checkChecked(serviceLayer.layers)) { |
| | | this.layers = childLayer |
| | | } else { |
| | | this.layers = [] |
| | | } |
| | | break |
| | | } else { |
| | | this.toggle(serviceLayer.layers) |
| | | } |
| | | } |
| | | }, |
| | | checkChecked (serviceLayers) { |
| | | for (var i = 0; i < serviceLayers.length; i++) { |
| | | var serviceLayer = serviceLayers[i] |
| | | var checked = serviceLayer.checked |
| | | if (checked) { |
| | | return true |
| | | } |
| | | } |
| | | }, |
| | | swSubFilter (url, item) { |
| | | item.checked = !item.checked |
| | |
| | | window.serviceLayerHelper.removeLayer(item) |
| | | } |
| | | // window.serviceLayerHelper.loadLayers() |
| | | } |
| | | }, |
| | | watch: { |
| | | // 此处需要深度监听图层选中状态,使用computed无效 |
| | | '$store.state.map.serviceLayers.LayerSewersLine': { |
| | | handler: function (val) { |
| | | this.toggle(val) |
| | | }, |
| | | immediate: true, |
| | | deep: true |
| | | } |
| | | } |
| | | } |
| | |
| | | max-height: 200px; |
| | | //overflow-y: hidden; |
| | | } |
| | | |
| | | // |
| | | //::-webkit-scrollbar { |
| | | // width: 7px; |
| | |
| | | <img src="@assets/images/map-pages/icon/toolbox/Selecd/tool.png" alt="" class="icon" /> |
| | | <span class="span-default">工具</span> |
| | | </el-button> |
| | | |
| | | <transition name="animationChange"> |
| | | <el-row v-show="selectGroup" class="specific-tools-group"> |
| | | <el-popover |
| | |
| | | <img :src="itemT.iconChoose" :title="itemT.title" v-if="Selecd === indexT && checkedItem" alt=""/> |
| | | <img :src="itemT.icon" :title="itemT.title" alt="" v-else/> |
| | | </el-button> |
| | | <div class="base-map-inner-panel" v-show="item.index==='2'"> |
| | | <div v-for="item in basemapHelper.basemapList" :key="item.code" class="basemap-layer-item"> |
| | | <img class="base-map-img" width="50" height="50" :src="item.conf.icon_actived" :title="item.name" |
| | | @click="changeBasemap(item)" alt=""/> |
| | | <el-checkbox class="base-map-anno" name="basemap" v-model="item.conf.annotationCheck" |
| | | label="标注" @change="changeBasemap(item)"> |
| | | </el-checkbox> |
| | | </div> |
| | | </div> |
| | | <!-- <div class="base-map-inner-panel" v-show="item.index==='2'">--> |
| | | <!-- <div v-for="item in basemapHelper.basemapList" :key="item.code" class="basemap-layer-item">--> |
| | | <!-- <img class="base-map-img" width="50" height="50" :src="item.conf.icon_actived" :title="item.name"--> |
| | | <!-- @click="changeBasemap(item)" alt=""/>--> |
| | | <!-- <el-checkbox class="base-map-anno" name="basemap" v-model="item.conf.annotationCheck"--> |
| | | <!-- label="标注" @change="changeBasemap(item)">--> |
| | | <!-- </el-checkbox>--> |
| | | <!-- </div>--> |
| | | <!-- </div>--> |
| | | <lc-base-map v-show="item.index==='2'"></lc-base-map> |
| | | </el-popover> |
| | | <el-button @click="changeSelect" class="special-button"> |
| | | <i class="el-icon-d-arrow-left"></i> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import LcBaseMap from '@components/LayerController/modules/LcBaseMap' |
| | | // 功能导航 |
| | | import plot from '@assets/images/map-pages/icon/toolbox/biaohui.png' |
| | | import polygon from '@assets/images/map-pages/icon/toolbox/celiang1.png' |
| | |
| | | |
| | | export default { |
| | | name: 'ToolBoxPanel', |
| | | components: { |
| | | LcBaseMap |
| | | }, |
| | | data () { |
| | | return { |
| | | isShow: [], |
| | | currentBaseMapCode: 'tianditu_img', |
| | | basemapList: [], |
| | | // currentBaseMapCode: 'tianditu_img', |
| | | // basemapList: [], |
| | | selectGroup: false, |
| | | drawLayer: null, |
| | | drawLayerArray: [], |
| | |
| | | ] |
| | | } |
| | | }, |
| | | computed: { |
| | | basemapHelper () { |
| | | return this.$store.state.map.basemapHelper |
| | | } |
| | | }, |
| | | methods: { |
| | | init (map) { |
| | | this.map = map |
| | | this.toolBoxPanelVisible = true |
| | | }, |
| | | changeBasemap (itm) { |
| | | this.active = -1 |
| | | const code = itm.code |
| | | this.basemapHelper.basemapList.forEach((item) => { |
| | | if (item.code === code) { |
| | | if (this.currentBaseMapCode == null || this.currentBaseMapCode !== code) { |
| | | this.currentBaseMapCode = code |
| | | this.basemapHelper.showBasemap(item.code, item.conf.annotationCheck, true) |
| | | } else { |
| | | this.basemapHelper.showBasemap(item.code, item.conf.annotationCheck, false) |
| | | } |
| | | |
| | | this.basemapHelper.basemapList.forEach((item) => { |
| | | item.layer.bringToBack() |
| | | }) |
| | | } |
| | | }) |
| | | }, |
| | | changeChoose (index) { |
| | | if (this.drawLayer == null) { |
| | |
| | | } |
| | | }, |
| | | _fillStroke: function (ctx, layer) { |
| | | debugger |
| | | var options = layer.options |
| | | |
| | | if (options.fill) { |