|
@ -1,11 +1,8 @@ |
|
|
<template> |
|
|
<template> |
|
|
<div> |
|
|
<div> |
|
|
|
|
|
|
|
|
<div class="dialog-h-content scroll-h"> |
|
|
<div class="dialog-h-content scroll-h"> |
|
|
<div v-if="initLoading" |
|
|
<div v-if="initLoading" class="m-row"> |
|
|
class="m-row"> |
|
|
|
|
|
<div class="m-info"> |
|
|
<div class="m-info"> |
|
|
|
|
|
|
|
|
<div class="info-prop"> |
|
|
<div class="info-prop"> |
|
|
<span class="info-title-2">所属网格:</span> |
|
|
<span class="info-title-2">所属网格:</span> |
|
|
<span>{{ formData.gridName }}</span> |
|
|
<span>{{ formData.gridName }}</span> |
|
@ -24,8 +21,7 @@ |
|
|
</div> |
|
|
</div> |
|
|
<div class="info-prop"> |
|
|
<div class="info-prop"> |
|
|
<span class="info-title-2">活动内容:</span> |
|
|
<span class="info-title-2">活动内容:</span> |
|
|
<p class="text_p" |
|
|
<p class="text_p" v-html="formData.content"></p> |
|
|
v-html="formData.content"></p> |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
<div class="info-prop"> |
|
|
<div class="info-prop"> |
|
|
<span class="info-title-2">服务人数:</span> |
|
|
<span class="info-title-2">服务人数:</span> |
|
@ -42,90 +38,70 @@ |
|
|
<div class="info-prop"> |
|
|
<div class="info-prop"> |
|
|
<span class="info-title-2">活动地图:</span> |
|
|
<span class="info-title-2">活动地图:</span> |
|
|
<div class="div_map"> |
|
|
<div class="div_map"> |
|
|
|
|
|
|
|
|
<div id="app_detail_activity"></div> |
|
|
<div id="app_detail_activity"></div> |
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="info-prop"> |
|
|
<div class="info-prop"> |
|
|
<span class="info-title-2">活动成果:</span> |
|
|
<span class="info-title-2">活动成果:</span> |
|
|
<p class="text_p" |
|
|
<p class="text_p" v-html="formData.result"></p> |
|
|
v-html="formData.result"></p> |
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="div-btn"> |
|
|
<div class="div-btn"> |
|
|
<el-button size="small" |
|
|
<el-button size="small" @click="handleCancle">关 闭</el-button> |
|
|
@click="handleCancle">关 闭</el-button> |
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</template> |
|
|
</template> |
|
|
|
|
|
|
|
|
<script> |
|
|
<script> |
|
|
|
|
|
import { Loading } from "element-ui"; // 引入Loading服务 |
|
|
import { Loading } from 'element-ui' // 引入Loading服务 |
|
|
|
|
|
import daiMap from "@/utils/dai-map"; |
|
|
import daiMap from "@/utils/dai-map"; |
|
|
|
|
|
|
|
|
var map |
|
|
var map; |
|
|
var search |
|
|
let loading; // 加载动画 |
|
|
var markers |
|
|
|
|
|
var infoWindowList |
|
|
|
|
|
var geocoder // 新建一个正逆地址解析类 |
|
|
|
|
|
|
|
|
|
|
|
let loading // 加载动画 |
|
|
|
|
|
export default { |
|
|
export default { |
|
|
data () { |
|
|
data() { |
|
|
return { |
|
|
return { |
|
|
formData: {}, |
|
|
formData: {}, |
|
|
initLoading: false |
|
|
initLoading: false, |
|
|
} |
|
|
}; |
|
|
}, |
|
|
}, |
|
|
components: {}, |
|
|
components: {}, |
|
|
mounted () { |
|
|
mounted() {}, |
|
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
methods: { |
|
|
methods: { |
|
|
|
|
|
handleCancle() { |
|
|
handleCancle () { |
|
|
this.diaDestroy(); |
|
|
this.diaDestroy() |
|
|
this.$emit("diaDetailClose"); |
|
|
this.$emit('diaDetailClose') |
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
}, |
|
|
|
|
|
|
|
|
diaDestroy () { |
|
|
diaDestroy() { |
|
|
if (map) { |
|
|
if (map) { |
|
|
// map.destroy() |
|
|
// map.destroy() |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
|
|
|
|
|
|
async initForm (row) { |
|
|
async initForm(row) { |
|
|
|
|
|
this.startLoading(); |
|
|
this.startLoading() |
|
|
const { user } = this.$store.state; |
|
|
const { user } = this.$store.state |
|
|
this.agencyId = user.agencyId; |
|
|
this.agencyId = user.agencyId |
|
|
|
|
|
for (let item of this.serviceList) { |
|
|
for (let item of this.serviceList) { |
|
|
|
|
|
|
|
|
if (row.serviceMatter === item.value) { |
|
|
if (row.serviceMatter === item.value) { |
|
|
row.serviceMatterShow = item.label |
|
|
row.serviceMatterShow = item.label; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
this.formData = { ...row } |
|
|
this.formData = { ...row }; |
|
|
|
|
|
|
|
|
this.initLoading = true |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.initLoading = true; |
|
|
|
|
|
|
|
|
let { latitude, longitude } = this.$store.state.user; |
|
|
let { latitude, longitude } = this.$store.state.user; |
|
|
console.log('lat' + latitude + ',lon' + longitude) |
|
|
console.log("lat" + latitude + ",lon" + longitude); |
|
|
if (this.formData.latitude && this.formData.longitude) { |
|
|
if (this.formData.latitude && this.formData.longitude) { |
|
|
latitude = this.formData.latitude |
|
|
latitude = this.formData.latitude; |
|
|
longitude = this.formData.longitude |
|
|
longitude = this.formData.longitude; |
|
|
} |
|
|
} |
|
|
if (!latitude || latitude == "" || latitude == "0") { |
|
|
if (!latitude || latitude == "" || latitude == "0") { |
|
|
latitude = 39.9088810666821; |
|
|
latitude = 39.9088810666821; |
|
@ -133,23 +109,18 @@ export default { |
|
|
} |
|
|
} |
|
|
this.$nextTick(() => { |
|
|
this.$nextTick(() => { |
|
|
if (!map) { |
|
|
if (!map) { |
|
|
this.initMap(latitude, longitude) |
|
|
this.initMap(latitude, longitude); |
|
|
} else { |
|
|
} else { |
|
|
map.setCenter(latitude, longitude); |
|
|
map.setCenter(latitude, longitude); |
|
|
map.setMarker(latitude, longitude); |
|
|
map.setMarker(latitude, longitude); |
|
|
|
|
|
|
|
|
} |
|
|
} |
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
}) |
|
|
this.endLoading(); |
|
|
|
|
|
|
|
|
this.endLoading() |
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 地图初始化函数,本例取名为init,开发者可根据实际情况定义 |
|
|
// 地图初始化函数,本例取名为init,开发者可根据实际情况定义 |
|
|
initMap (latitude, longitude) { |
|
|
initMap(latitude, longitude) { |
|
|
|
|
|
|
|
|
map = new daiMap( |
|
|
map = new daiMap( |
|
|
document.getElementById("app_detail_activity"), |
|
|
document.getElementById("app_detail_activity"), |
|
|
{ latitude, longitude }, |
|
|
{ latitude, longitude }, |
|
@ -167,51 +138,53 @@ export default { |
|
|
|
|
|
|
|
|
map.setCenter(latitude, longitude); |
|
|
map.setCenter(latitude, longitude); |
|
|
map.setMarker(latitude, longitude); |
|
|
map.setMarker(latitude, longitude); |
|
|
|
|
|
|
|
|
}, |
|
|
}, |
|
|
|
|
|
|
|
|
// 开启加载动画 |
|
|
// 开启加载动画 |
|
|
startLoading () { |
|
|
startLoading() { |
|
|
loading = Loading.service({ |
|
|
loading = Loading.service({ |
|
|
lock: true, // 是否锁定 |
|
|
lock: true, // 是否锁定 |
|
|
text: '正在加载……', // 加载中需要显示的文字 |
|
|
text: "正在加载……", // 加载中需要显示的文字 |
|
|
background: 'rgba(0,0,0,.7)' // 背景颜色 |
|
|
background: "rgba(0,0,0,.7)", // 背景颜色 |
|
|
}) |
|
|
}); |
|
|
}, |
|
|
}, |
|
|
// 结束加载动画 |
|
|
// 结束加载动画 |
|
|
endLoading () { |
|
|
endLoading() { |
|
|
// clearTimeout(timer); |
|
|
// clearTimeout(timer); |
|
|
if (loading) { |
|
|
if (loading) { |
|
|
loading.close() |
|
|
loading.close(); |
|
|
} |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
}, |
|
|
computed: {}, |
|
|
computed: {}, |
|
|
props: { |
|
|
props: { |
|
|
serviceList: { |
|
|
serviceList: { |
|
|
type: Array, |
|
|
type: Array, |
|
|
default: [] |
|
|
default: [], |
|
|
}, |
|
|
}, |
|
|
gridList: { |
|
|
gridList: { |
|
|
type: Array, |
|
|
type: Array, |
|
|
default: [] |
|
|
default: [], |
|
|
}, |
|
|
}, |
|
|
} |
|
|
}, |
|
|
} |
|
|
}; |
|
|
</script> |
|
|
</script> |
|
|
|
|
|
|
|
|
<style lang="scss" scoped > |
|
|
<style lang="scss" scoped> |
|
|
@import "@/assets/scss/modules/management/detail-main.scss"; |
|
|
@import "@/assets/scss/modules/management/detail-main.scss"; |
|
|
</style> |
|
|
</style> |
|
|
|
|
|
|
|
|
<style lang="scss" scoped> |
|
|
<style lang="scss" scoped> |
|
|
.text_p { |
|
|
/deep/ .text_p { |
|
|
margin: 0 0; |
|
|
margin: 0 0; |
|
|
border: 3px; |
|
|
border: 3px; |
|
|
|
|
|
|
|
|
> p { |
|
|
> p { |
|
|
margin: 0 0; |
|
|
margin: 0 0; |
|
|
} |
|
|
} |
|
|
|
|
|
img { |
|
|
|
|
|
max-width: 100%; |
|
|
|
|
|
height: auto; |
|
|
|
|
|
} |
|
|
} |
|
|
} |
|
|
</style> |
|
|
</style> |
|
|
|
|
|
|
|
|