|
|
@ -61,6 +61,10 @@ |
|
|
<span>仓库安防</span> |
|
|
<span>仓库安防</span> |
|
|
</div> |
|
|
</div> |
|
|
<div class="mortgage-layout-top-right-title-right"> |
|
|
<div class="mortgage-layout-top-right-title-right"> |
|
|
|
|
|
<div style="border-bottom: solid 1px #58A55C;padding-bottom: 2px; |
|
|
|
|
|
color: #58A55C;position: absolute;right:5px ; bottom: 12px; font-size: 18px;pointer-events: auto; cursor: pointer; |
|
|
|
|
|
z-index:10" @click="showPos">仓库分布图>></div> |
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
@ -299,6 +303,56 @@ |
|
|
</iframe> |
|
|
</iframe> |
|
|
</el-dialog> |
|
|
</el-dialog> |
|
|
|
|
|
|
|
|
|
|
|
<!-- 仓库分布 --> |
|
|
|
|
|
<el-dialog title="仓库分布" :visible.sync="dialogVisible" width="90%" :before-close="handleClose"> |
|
|
|
|
|
<div class="iframemap"> |
|
|
|
|
|
<div class="app-container"> |
|
|
|
|
|
<el-amap ref="map" :center="center" :zoom="zoom"> |
|
|
|
|
|
<el-amap-control-map-type :visible="controlVisible" /> |
|
|
|
|
|
<el-amap-marker v-for="(marker, index) in markers" :key="index" :icon="marker.icon" |
|
|
|
|
|
:title="marker.title" :position="marker.position" style=" z-index:99;" |
|
|
|
|
|
@click="(e) => {clickArrayMarker(marker, e)}" /> |
|
|
|
|
|
</el-amap> |
|
|
|
|
|
<div class="toolbar"> |
|
|
|
|
|
<el-collapse v-model="activeNames"> |
|
|
|
|
|
<el-collapse-item name="info"> |
|
|
|
|
|
<template slot="title"> |
|
|
|
|
|
<i class="el-icon-s-shop" /> 当前选中仓库信息 |
|
|
|
|
|
</template> |
|
|
|
|
|
<el-descriptions :column="1" size="mini" border> |
|
|
|
|
|
<!-- <el-descriptions-item :label-style="{'width': '70px'}" |
|
|
|
|
|
label="序号">{{ currentStore.serNumber }}</el-descriptions-item> --> |
|
|
|
|
|
<el-descriptions-item |
|
|
|
|
|
label="仓库名称">{{ currentStore.warehouseName }}</el-descriptions-item> |
|
|
|
|
|
<el-descriptions-item |
|
|
|
|
|
label="仓库编码">{{ currentStore.warehouseCode }}</el-descriptions-item> |
|
|
|
|
|
</el-descriptions> |
|
|
|
|
|
</el-collapse-item> |
|
|
|
|
|
<el-collapse-item title="" name="list"> |
|
|
|
|
|
<template slot="title"> |
|
|
|
|
|
<i class="el-icon-s-grid" /> 仓库列表 |
|
|
|
|
|
</template> |
|
|
|
|
|
<el-form ref="form" :model="queryParams" label-width="70px" size="mini"> |
|
|
|
|
|
<el-form-item label="仓库名称"> |
|
|
|
|
|
<el-input v-model="queryParams.name" clearable @clear="dosearch"> |
|
|
|
|
|
<el-button slot="append" icon="el-icon-search" @click="dosearch" /> |
|
|
|
|
|
</el-input> |
|
|
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
|
|
|
|
</el-form> |
|
|
|
|
|
|
|
|
|
|
|
<el-table v-loading="tableLoading" :data="dataList" border |
|
|
|
|
|
style="width: 100%;margin-top: 10px;" max-height="400"> |
|
|
|
|
|
<el-table-column prop="warehouseName" label="仓库名称" align="center" /> |
|
|
|
|
|
<el-table-column prop="warehouseCode" label="仓库编码" align="center" width="90" /> |
|
|
|
|
|
</el-table> |
|
|
|
|
|
</el-collapse-item> |
|
|
|
|
|
</el-collapse> |
|
|
|
|
|
</div> |
|
|
|
|
|
</div> |
|
|
|
|
|
</div> |
|
|
|
|
|
</el-dialog> |
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
</template> |
|
|
</template> |
|
|
@ -317,6 +371,8 @@ |
|
|
}, |
|
|
}, |
|
|
data() { |
|
|
data() { |
|
|
return { |
|
|
return { |
|
|
|
|
|
activeNames: ['info', 'list'], |
|
|
|
|
|
dialogVisible: false, |
|
|
times: getDateRang('yesterday'), |
|
|
times: getDateRang('yesterday'), |
|
|
warehouse: [{ |
|
|
warehouse: [{ |
|
|
value: "选项1", |
|
|
value: "选项1", |
|
|
@ -371,14 +427,34 @@ |
|
|
}, |
|
|
}, |
|
|
warehouseImg: "", |
|
|
warehouseImg: "", |
|
|
warehouseSid: "", |
|
|
warehouseSid: "", |
|
|
cameraList: [] |
|
|
cameraList: [], |
|
|
|
|
|
currentStore: { |
|
|
|
|
|
serNumber: '', |
|
|
|
|
|
name: '', |
|
|
|
|
|
address: '', |
|
|
|
|
|
area: '', |
|
|
|
|
|
dueDiligence: '' |
|
|
|
|
|
}, |
|
|
|
|
|
queryParams: { |
|
|
|
|
|
name: '', |
|
|
|
|
|
projectSid: "" |
|
|
|
|
|
}, |
|
|
|
|
|
dataList: [], |
|
|
|
|
|
tableLoading: false, |
|
|
|
|
|
controlVisible: false, |
|
|
|
|
|
zoom: 7, |
|
|
|
|
|
center: [114.490788, 38.033577], |
|
|
|
|
|
markers: [], |
|
|
|
|
|
mapicon: { |
|
|
|
|
|
red: 'https://supervise.yxtsoft.com/map365/image/icon_local_red.png', |
|
|
|
|
|
blue: process.env.VUE_APP_PUBLIC_PATH + 'image/icon_local_blue.png' |
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
}; |
|
|
}; |
|
|
}, |
|
|
}, |
|
|
|
|
|
|
|
|
mounted() { |
|
|
mounted() { |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 获取url中的参数 |
|
|
// 获取url中的参数 |
|
|
const searchParams = new URLSearchParams(/(?<=#.*\?).*/.exec(window.location.href)[0]); |
|
|
const searchParams = new URLSearchParams(/(?<=#.*\?).*/.exec(window.location.href)[0]); |
|
|
console.log("searchParams>>>>", searchParams) |
|
|
console.log("searchParams>>>>", searchParams) |
|
|
@ -388,7 +464,7 @@ |
|
|
this.params.orderDate = searchParams.get('orderDate'); |
|
|
this.params.orderDate = searchParams.get('orderDate'); |
|
|
console.log("projectSid>>>>", this.params.projectSid) |
|
|
console.log("projectSid>>>>", this.params.projectSid) |
|
|
console.log("projectName>>>>", this.params.projectName) |
|
|
console.log("projectName>>>>", this.params.projectName) |
|
|
console.log("orderDate>>>>",this.params.orderDate) |
|
|
console.log("orderDate>>>>", this.params.orderDate) |
|
|
|
|
|
|
|
|
this.times = this.params.orderDate |
|
|
this.times = this.params.orderDate |
|
|
this.loadList() // 左侧圆形图 |
|
|
this.loadList() // 左侧圆形图 |
|
|
@ -404,6 +480,64 @@ |
|
|
|
|
|
|
|
|
// }, |
|
|
// }, |
|
|
methods: { |
|
|
methods: { |
|
|
|
|
|
showPos() { |
|
|
|
|
|
this.dialogVisible = true |
|
|
|
|
|
this.loadList2() |
|
|
|
|
|
}, |
|
|
|
|
|
handleClose() { |
|
|
|
|
|
this.dialogVisible = false |
|
|
|
|
|
}, |
|
|
|
|
|
loadList2() { |
|
|
|
|
|
this.queryParams.projectSid = this.params.projectSid |
|
|
|
|
|
req.getPos(this.queryParams).then(res => { |
|
|
|
|
|
this.dataList = res.data |
|
|
|
|
|
this.resetMarkers() |
|
|
|
|
|
}).catch(e => { |
|
|
|
|
|
console.log('GdinventoryLog-loadList-ee:', e) |
|
|
|
|
|
}) |
|
|
|
|
|
}, |
|
|
|
|
|
dosearch() { |
|
|
|
|
|
this.loadList2() |
|
|
|
|
|
}, |
|
|
|
|
|
resetQuery() { |
|
|
|
|
|
this.queryParams = { |
|
|
|
|
|
name: '', |
|
|
|
|
|
projectSid: this.params.projectSid |
|
|
|
|
|
} |
|
|
|
|
|
this.loadList2() |
|
|
|
|
|
}, |
|
|
|
|
|
resetMarkers() { |
|
|
|
|
|
this.markers = [] |
|
|
|
|
|
for (var i in this.dataList) { |
|
|
|
|
|
const d = this.dataList[i] |
|
|
|
|
|
// let nicon = this.mapicon.red |
|
|
|
|
|
// if (d.dueDiligence === '是') { |
|
|
|
|
|
// nicon = this.mapicon.red |
|
|
|
|
|
// } |
|
|
|
|
|
const newMarker = { |
|
|
|
|
|
id: d.sid, |
|
|
|
|
|
position: [d.longitude, d.latitude], |
|
|
|
|
|
title: d.warehouseName, |
|
|
|
|
|
icon: this.mapicon.red, |
|
|
|
|
|
label: { |
|
|
|
|
|
direction: 'bottom', |
|
|
|
|
|
offset: [0, 5], // 设置文本标注偏移量 |
|
|
|
|
|
content: "<div class='info'>" + d.warehouseName + '</div>' // 设置文本标注内容 |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
this.markers.push(newMarker) |
|
|
|
|
|
// console.log("marksers", this.markers); |
|
|
|
|
|
} |
|
|
|
|
|
}, |
|
|
|
|
|
clickArrayMarker(marker) { |
|
|
|
|
|
for (var i in this.dataList) { |
|
|
|
|
|
if (marker.id === this.dataList[i].sid) { |
|
|
|
|
|
this.currentStore = this.dataList[i] |
|
|
|
|
|
break |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
selectTime(val) { |
|
|
selectTime(val) { |
|
|
console.log('val:', val) |
|
|
console.log('val:', val) |
|
|
|
|
|
|
|
|
@ -635,6 +769,59 @@ |
|
|
</script> |
|
|
</script> |
|
|
|
|
|
|
|
|
<style lang="scss" scoped> |
|
|
<style lang="scss" scoped> |
|
|
|
|
|
.app-container { |
|
|
|
|
|
width: 100%; |
|
|
|
|
|
height: 100%; |
|
|
|
|
|
top: 0px; |
|
|
|
|
|
left: 0px; |
|
|
|
|
|
margin: 0; |
|
|
|
|
|
padding: 0; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.toolbar { |
|
|
|
|
|
position: absolute; |
|
|
|
|
|
top: 80px; |
|
|
|
|
|
left: 40px; |
|
|
|
|
|
width: 300px; |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.info { |
|
|
|
|
|
position: relative; |
|
|
|
|
|
margin: 0; |
|
|
|
|
|
top: 0; |
|
|
|
|
|
right: 0; |
|
|
|
|
|
min-width: 0; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.storelabel { |
|
|
|
|
|
width: 80px |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.amap-icon { |
|
|
|
|
|
overflow: inherit !important; |
|
|
|
|
|
|
|
|
|
|
|
img { |
|
|
|
|
|
width: 25px; |
|
|
|
|
|
height: 34px; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.chartsa { |
|
|
|
|
|
position: absolute; |
|
|
|
|
|
top: 20px; |
|
|
|
|
|
right: 15px; |
|
|
|
|
|
width: 300px; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.iframemap { |
|
|
|
|
|
margin-top: -30px; |
|
|
|
|
|
width: 100%; |
|
|
|
|
|
height: 1000px; |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
.mortgage { |
|
|
.mortgage { |
|
|
background-color: #040C2B; |
|
|
background-color: #040C2B; |
|
|
width: 100%; |
|
|
width: 100%; |
|
|
|
