kubbo/dvcp_v2_webapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

已增加整轮播图和地图连线

Browse Source
This commit is contained in:
aixianling
2023-10-07 11:30:13 +08:00
parent 39a344b054
commit 50541832cc
12 changed files with 451 additions and 153 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
components/AiDvRender.vue
View File

@@ -1,24 +1,24 @@
<template>
<div class="AiDvRender" style="width: 100%; height: 100%;">
<ai-dv-display v-if="data.type === 'display'" :title="data.title" :list="values"></ai-dv-display>
<ai-dv-display v-if="currentType === 'display'" :title="data.title" :list="values"/>
<ai-dv-panel
style="height: 100%; width: 100%;"
v-if="data.type !== 'display'"
v-if="currentType !== 'display'"
:title="data.title"
:theme="theme"
:border="data.border || ''">
<AiDvSummary v-if="data.type === 'summary'" :theme="theme" :summaryTitle="data.summaryTitle"
<AiDvSummary v-if="currentType === 'summary'" :theme="theme" :summaryTitle="data.summaryTitle"
:key="`summary${index}`" :type="data.display"
:data="values"/>
<AiSwiper v-else-if="data.type === 'swiper'" :heigth="'100%'" :data="values"/>
<AiSwiper v-else-if="currentType === 'swiper'" :heigth="'100%'" :data="values" :dotIndicator="data.dotIndicator"/>
<dv-scroll-board
v-if="data.type === 'table'"
v-if="currentType === 'table'"
:class="'dvScrollBoard' + theme"
:config="formatTable(values, data.isShowIndex, data.rowNum)"
:key="data.height"
:theme="theme"
:style="{height: data.height + 'px', width: '100%'}"/>
<ai-echart-v2 v-else-if="/Chart/.test(data.type)"
<ai-echart-v2 v-else-if="/Chart/.test(currentType)"
style="height: 100%; width: 100%;"
:ref="'chart' + index"
:key="`chart-${index}`"
@@ -26,7 +26,7 @@
:data="values"
:ops="chartList[data.config]"/>
<!-- <ai-q-map
v-else-if="data.type=='map'"
v-else-if="currentType=='map'"
:area-id="data.areaId"
:markers="markers"
:is3d="data.is3D === '1'"
@@ -34,7 +34,7 @@
:is3dAround="data.is3dAround === '1'">
</ai-q-map> -->
<AiDvTable
v-else-if="data.type === 'AiDvTable'"
v-else-if="currentType === 'AiDvTable'"
:heigth="'100%'"
:stripe="data.stripe"
:theme="theme"
@@ -43,15 +43,15 @@
:data="values">
</AiDvTable>
<AiRanking
v-else-if="data.type === 'AiRanking'"
v-else-if="currentType === 'AiRanking'"
:theme="theme"
:heigth="'100%'"
:subType="data.subType"
:data="values">
</AiRanking>
<AiDvMap v-else-if="data.type === 'AiDvMap'" style="width: 100%; height: 100%" :ref="'chart' + index"
<AiDvMap v-else-if="currentType === 'AiDvMap'" style="width: 100%; height: 100%" :ref="'chart' + index"
:key="`AiDvMap${index}`" :theme="theme"></AiDvMap>
<ai-map v-else-if="data.type=='map'" :mask="data.mask === '1'" :areaId="data.areaId" :is3d="data.is3d==1"
<ai-map v-else-if="currentType=='map'" :mask="data.mask === '1'" :areaId="data.areaId" :is3d="data.is3d==1"
:is3dAround="data.is3dAround === '1'"
:map-style="`amap://styles/${data.mapStyle}`" :pulseLines="data.pulseLines==1" :map.sync="map"
:lib.sync="lib"
@@ -61,11 +61,11 @@
<div ref="mapInfoWin"/>
</div>
</ai-map>
<ai-monitor :src="data.src" v-else-if="data.type === 'monitor'" :type="data.monitorType"/>
<ai-monitor :src="data.src" v-else-if="currentType === 'monitor'" :type="data.monitorType"/>
<video style="width: 100%; height: 100%; object-fit: fill;" loop :src="data.src" autoplay
v-else-if="data.type === 'video'"/>
<AiDvPartyOrg style="width: 100%; height: 100%;" v-else-if="data.type === 'partyOrg'" :instance="instance"/>
<!-- <ai-sprite v-else-if="/building/.test(data.type)" v-bind="data" is3D @init="mods[data.type]"/> -->
v-else-if="currentType === 'video'"/>
<AiDvPartyOrg style="width: 100%; height: 100%;" v-else-if="currentType === 'partyOrg'" :instance="instance"/>
<!-- <ai-sprite v-else-if="/building/.test(currentType)" v-bind="data" is3D @init="mods[currentType]"/> -->
</ai-dv-panel>
</div>
</template>
@@ -109,14 +109,7 @@ export default {
},
computed: {
...mapState(['user']),
values() {
if (!this.data) {
return []
}
return this.data.type === 'map' ? this.data[this.data.dataType]?.map(e => {
return {lng: e['经度'], lat: e['纬度'], label: e['地区名称'], ...e}
}) || [] : this.data[this.data.dataType]
},
values: v => v.data?.[v.data?.dataType] || [],
currentType: v => v.data.type
},
watch: {
@@ -186,7 +179,9 @@ export default {
map.setPitch(0)
this.mapDialog = false
})
this.values.filter(e => e.lng).map((e) => {
const markers = Array.isArray(this.values) ? this.values : this.values.markers
const polylines = Array.isArray(this.values) ? [] : this.values.polylines || []
markers.map(e => ({lng: e['经度'], lat: e['纬度'], label: e['地区名称'], ...e})).filter(e => e.lng).map((e) => {
const {icon = "https://cdn.cunwuyun.cn/dvcp/h5/Location2.png"} = e
return new AMap.Marker({
map,
@@ -204,6 +199,9 @@ export default {
})
})
})
polylines.filter(e => e.path?.length > 0)?.map(e => new AMap.Polyline({
map, strokeColor: "#00FFAE", ...e, path: e.path.map(p => new AMap.LngLat(p[1], p[0]))
}))
this.data.is3d > 0 && map.setPitch(65)
if (this.data.is3dAround == 1) {
this.timer = setInterval(() => map?.setRotation(360, false, 16000))
@@ -215,7 +213,7 @@ export default {
}
},
mounted() {
if (this.data.type == 'table') {
if (this.currentType == 'table') {
this.$injectLib("https://cdn.cunwuyun.cn/datav.map.vue.js")
}
}