|
|
|
|
@ -1,18 +1,22 @@
|
|
|
|
|
<template>
|
|
|
|
|
<div>
|
|
|
|
|
<div class="map" id="map" :style="{'height':mapHeight+'px'}">
|
|
|
|
|
<div class="teamsTab">
|
|
|
|
|
<span>防汛队伍:{{this.makerObj.teams.length}}</span>
|
|
|
|
|
<span>在册人员:{{totalPerson}}</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tabs">
|
|
|
|
|
<div :class="!addCur?'tabcur':''" @click="changeMask(1)">抢险队伍</div>
|
|
|
|
|
<div :class="!addCur?'tabcur':''" @click="changeMask(1)">抢险队伍</div>
|
|
|
|
|
|
|
|
|
|
<div :class="addCur?'tabcur':''">
|
|
|
|
|
<el-dropdown @command="clickQuyu" :show-timeout="100" >
|
|
|
|
|
<span class="el-dropdown-link" @click="changeMask(2)">
|
|
|
|
|
防汛仓库<i class="el-icon-arrow-down el-icon--right"></i>
|
|
|
|
|
</span>
|
|
|
|
|
<el-dropdown-menu slot="dropdown">
|
|
|
|
|
<el-dropdown-item v-for="item in areaList" :command="item.id">{{item.value}}</el-dropdown-item>
|
|
|
|
|
</el-dropdown-menu>
|
|
|
|
|
</el-dropdown>
|
|
|
|
|
<div :class="addCur?'tabcur':''">
|
|
|
|
|
<el-dropdown @command="clickQuyu" :show-timeout="100">
|
|
|
|
|
<span class="el-dropdown-link" @click="changeMask(2)">
|
|
|
|
|
防汛仓库<i class="el-icon-arrow-down el-icon--right"></i>
|
|
|
|
|
</span>
|
|
|
|
|
<el-dropdown-menu slot="dropdown">
|
|
|
|
|
<el-dropdown-item v-for="item in areaList" :command="item.id">{{item.value}}</el-dropdown-item>
|
|
|
|
|
</el-dropdown-menu>
|
|
|
|
|
</el-dropdown>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
@ -72,13 +76,14 @@
|
|
|
|
|
import {
|
|
|
|
|
index,
|
|
|
|
|
destroy
|
|
|
|
|
} from "@/api/system/baseForm.js"
|
|
|
|
|
import {
|
|
|
|
|
getparameteritem
|
|
|
|
|
} from "@/api/system/baseForm.js"
|
|
|
|
|
import {
|
|
|
|
|
getparameteritem
|
|
|
|
|
} from "@/api/system/dictionary.js"
|
|
|
|
|
export default {
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
totalPerson: 0,
|
|
|
|
|
zoom: 10,
|
|
|
|
|
center: [120.585294, 31.299758],
|
|
|
|
|
mapHeight: 0,
|
|
|
|
|
@ -87,16 +92,16 @@
|
|
|
|
|
makerObj: {
|
|
|
|
|
teams: [],
|
|
|
|
|
storages: []
|
|
|
|
|
},
|
|
|
|
|
areaList:[],
|
|
|
|
|
},
|
|
|
|
|
areaList: [],
|
|
|
|
|
infoWindow: null,
|
|
|
|
|
openData: [],
|
|
|
|
|
materList: [],
|
|
|
|
|
quyu_id:'',
|
|
|
|
|
materList: [],
|
|
|
|
|
quyu_id: '',
|
|
|
|
|
loading: true,
|
|
|
|
|
total: 0,
|
|
|
|
|
addCur: false,
|
|
|
|
|
loadingFull:null,
|
|
|
|
|
addCur: false,
|
|
|
|
|
loadingFull: null,
|
|
|
|
|
table: [{
|
|
|
|
|
label: '序号',
|
|
|
|
|
type: 'index',
|
|
|
|
|
@ -220,18 +225,18 @@
|
|
|
|
|
]
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
created() {
|
|
|
|
|
created() {
|
|
|
|
|
this.getArea()
|
|
|
|
|
this.initHeight()
|
|
|
|
|
this.$nextTick(function() {
|
|
|
|
|
this.mapInit()
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
getArea(){
|
|
|
|
|
getparameteritem("area").then(res=>{
|
|
|
|
|
this.areaList = res.detail
|
|
|
|
|
})
|
|
|
|
|
methods: {
|
|
|
|
|
getArea() {
|
|
|
|
|
getparameteritem("area").then(res => {
|
|
|
|
|
this.areaList = res.detail
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
initHeight() {
|
|
|
|
|
let winHeight = document.body.clientHeight
|
|
|
|
|
@ -268,8 +273,8 @@
|
|
|
|
|
this.addCur = false
|
|
|
|
|
this.setMapMarker("teams", this.makerObj.teams)
|
|
|
|
|
} else if (type == 2) {
|
|
|
|
|
this.addCur = true
|
|
|
|
|
this.quyu_id = ''
|
|
|
|
|
this.addCur = true
|
|
|
|
|
this.quyu_id = ''
|
|
|
|
|
this.getStorages()
|
|
|
|
|
// this.setMapMarker("storages", this.makerObj.storages)
|
|
|
|
|
}
|
|
|
|
|
@ -284,38 +289,41 @@
|
|
|
|
|
if (res.data.length < 1) {
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
let _total = 0
|
|
|
|
|
res.data.map(item => {
|
|
|
|
|
_total += parseInt(item.renshu)
|
|
|
|
|
this.makerObj.teams.push({
|
|
|
|
|
type: 'teams',
|
|
|
|
|
name: item.mingcheng,
|
|
|
|
|
...item
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
this.setMapMarker("teams", this.makerObj.teams)
|
|
|
|
|
this.totalPerson = _total
|
|
|
|
|
this.setMapMarker("teams", this.makerObj.teams)
|
|
|
|
|
this.loadingFull.close();
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
clickQuyu(e){
|
|
|
|
|
console.log("e",e)
|
|
|
|
|
this.quyu_id = e
|
|
|
|
|
this.getStorages()
|
|
|
|
|
},
|
|
|
|
|
async getStorages() {
|
|
|
|
|
this.loadingFull = this.$loading({
|
|
|
|
|
lock: true,
|
|
|
|
|
text: '',
|
|
|
|
|
spinner: 'el-icon-loading',
|
|
|
|
|
background: 'rgba(0, 0, 0, 0.7)'
|
|
|
|
|
});
|
|
|
|
|
clickQuyu(e) {
|
|
|
|
|
console.log("e", e)
|
|
|
|
|
this.quyu_id = e
|
|
|
|
|
this.getStorages()
|
|
|
|
|
},
|
|
|
|
|
async getStorages() {
|
|
|
|
|
this.loadingFull = this.$loading({
|
|
|
|
|
lock: true,
|
|
|
|
|
text: '',
|
|
|
|
|
spinner: 'el-icon-loading',
|
|
|
|
|
background: 'rgba(0, 0, 0, 0.7)'
|
|
|
|
|
});
|
|
|
|
|
this.makerObj.storages = []
|
|
|
|
|
await index({
|
|
|
|
|
page: 1,
|
|
|
|
|
page_size: 9999,
|
|
|
|
|
table_name: 'flood_storages',
|
|
|
|
|
filter: [{
|
|
|
|
|
key:'quyu_id',
|
|
|
|
|
op:'eq',
|
|
|
|
|
value:this.quyu_id
|
|
|
|
|
table_name: 'flood_storages',
|
|
|
|
|
filter: [{
|
|
|
|
|
key: 'quyu_id',
|
|
|
|
|
op: 'eq',
|
|
|
|
|
value: this.quyu_id
|
|
|
|
|
}],
|
|
|
|
|
}).then(res => {
|
|
|
|
|
let markers = []
|
|
|
|
|
@ -328,8 +336,8 @@
|
|
|
|
|
name: item.cangkumingcheng,
|
|
|
|
|
...item
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
this.setMapMarker("storages", this.makerObj.storages)
|
|
|
|
|
})
|
|
|
|
|
this.setMapMarker("storages", this.makerObj.storages)
|
|
|
|
|
this.loadingFull.close();
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
@ -406,6 +414,26 @@
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
.teamsTab {
|
|
|
|
|
position: absolute;
|
|
|
|
|
z-index: 99;
|
|
|
|
|
top: 20px;
|
|
|
|
|
left: 20px;
|
|
|
|
|
display: -webkit-box;
|
|
|
|
|
display: -ms-flexbox;
|
|
|
|
|
display: flex;
|
|
|
|
|
-webkit-box-align: center;
|
|
|
|
|
-ms-flex-align: center;
|
|
|
|
|
align-items: center;
|
|
|
|
|
background: #fff;
|
|
|
|
|
padding: 20px 40px;
|
|
|
|
|
border-radius: 40px;
|
|
|
|
|
font-size: 18px;
|
|
|
|
|
&>span{
|
|
|
|
|
margin:0px 20px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.tabs {
|
|
|
|
|
position: absolute;
|
|
|
|
|
z-index: 99;
|
|
|
|
|
@ -421,11 +449,12 @@
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
color: #333;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
::v-deep .el-dropdown{
|
|
|
|
|
font-size: 16px;
|
|
|
|
|
color: #333;
|
|
|
|
|
|
|
|
|
|
::v-deep .el-dropdown {
|
|
|
|
|
font-size: 16px;
|
|
|
|
|
color: #333;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.tabs>div:first-child {
|
|
|
|
|
border-radius: 20px 0 0 20px;
|
|
|
|
|
|
|
|
|
|
@ -439,10 +468,10 @@
|
|
|
|
|
.tabs>div.tabcur {
|
|
|
|
|
background: #0077CC;
|
|
|
|
|
color: #fff
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
::v-deep .tabs>div.tabcur .el-dropdown{
|
|
|
|
|
color: #fff;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
::v-deep .tabs>div.tabcur .el-dropdown {
|
|
|
|
|
color: #fff;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#infoWindow {
|
|
|
|
|
|