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
2022-06-28 18:18:37 +08:00
parent b117cf9d51
commit cc211cd22b
5 changed files with 87 additions and 171 deletions
Download Patch File Download Diff File Expand all files Collapse all files

152
project/dvui/components/AiDvRender.vue
View File

@@ -15,131 +15,19 @@
:key="data.height"
:theme="theme"
:style="{height: data.height + 'px', width: '100%'}"/>
<ai-echart
v-else-if="data.type === 'barChart1'"
style="height: 100%; width: 100%;"
:ref="'chart' + index"
:key="`chart${index}`"
:theme="theme"
:data="values"
:ops="data.config"/>
<ai-echart
v-else-if="data.type === 'barChart2'"
style="height: 100%; width: 100%;"
:ref="'chart' + index"
:theme="theme"
:key="`chart${index}`"
:data="values"
:ops="data.config"/>
<ai-echart
v-else-if="data.type === 'barChart3'"
style="height: 100%; width: 100%;"
:ref="'chart' + index"
:key="`chart${index}`"
:theme="theme"
:data="values"
:ops="data.config"/>
<ai-echart
v-else-if="data.type === 'barChart5'"
style="height: 100%; width: 100%;"
:ref="'chart' + index"
:key="`chart${index}`"
:theme="theme"
:data="values"
:ops="data.config"/>
<ai-echart
v-else-if="data.type === 'barChart7'"
style="height: 100%; width: 100%;"
:ref="'chart' + index"
:key="`chart${index}`"
:theme="theme"
:data="values"
:ops="data.config"/>
<ai-echart
v-else-if="data.type === 'barChart8'"
style="height: 100%; width: 100%;"
:ref="'chart' + index"
:key="`chart${index}`"
:theme="theme"
:data="values"
:ops="data.config"/>
<ai-echart
v-else-if="data.type === 'barChart9'"
style="height: 100%; width: 100%;"
:ref="'chart' + index"
:key="`chart${index}`"
:theme="theme"
:data="values"
:ops="data.config"/>
<ai-echart
v-else-if="data.type === 'lineChart1'"
style="height: 100%; width: 100%;"
:ref="'chart' + index"
:key="`chart${index}`"
:theme="theme"
:data="values"
:ops="lineChart1"/>
<ai-echart
v-else-if="data.type === 'lineChart2'"
style="height: 100%; width: 100%;"
:ref="'chart' + index"
:key="`chart${index}`"
:theme="theme"
:data="values"
:ops="lineChart2"/>
<ai-echart
v-else-if="data.type === 'lineChart3'"
style="height: 100%; width: 100%;"
:ref="'chart' + index"
:key="`chart${index}`"
:theme="theme"
:data="values"
:ops="data.config"/>
<ai-echart
v-else-if="data.type === 'lineChart4'"
style="height: 100%; width: 100%;"
:ref="'chart' + index"
:key="`chart${index}`"
:theme="theme"
:data="values"
:ops="data.config"/>
<ai-echart
v-else-if="data.type === 'lineChart5'"
style="height: 100%; width: 100%;"
:ref="'chart' + index"
:key="`chart${index}`"
:theme="theme"
:data="values"
:ops="lineChart5"/>
<ai-echart
v-else-if="data.type === 'pieChart'"
style="height: 100%; width: 100%;"
:ref="'chart' + index"
:key="`chart${index}`"
:theme="theme"
:data="values"
:ops="pieChart"/>
<ai-echart
v-else-if="data.type === 'pieChart1'"
style="height: 100%; width: 100%;"
:ref="'chart' + index"
:key="`chart${index}`"
:theme="theme"
:data="values"
:ops="pieChart1"/>
<ai-echart
v-else-if="data.type === 'pieChart3'"
style="height: 100%; width: 100%;"
:ref="'chart' + index"
:key="`chart${index}`"
:theme="theme"
:data="values"
:ops="pieChart3"/>
<ai-echart v-else-if="/Chart/.test(data.type)"
style="height: 100%; width: 100%;"
:ref="'chart' + index"
:key="`chart${index}`"
:theme="theme"
:data="values"
:ops="chartList[data.config]"/>
<ai-map :markers="values" v-else-if="data.type=='map'" :mask="data.mask === '1'" :areaId="data.areaId || user.info.areaId"
:map-style="`amap://styles/${data.mapStyle}`" :pulseLines="data.pulseLines==1" :map.sync="map" :lib.sync="lib"/>
<ai-monitor :src="data.src" v-else-if="data.type === '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]"/>
</ai-dv-panel>
</div>
</template>
@@ -147,54 +35,44 @@
<script>
import {mapState} from 'vuex'
import AiSwiper from './AiSwiper.vue'
import pieChart from './AiEchart/template/pie/pieChart2'
import pieChart1 from './AiEchart/template/pie/pieChart1'
import pieChart3 from './AiEchart/template/pie/pieChart3'
import lineChart1 from './AiEchart/template/line/lineChart1'
import lineChart2 from './AiEchart/template/line/lineChart2'
import lineChart5 from './AiEchart/template/line/lineChart5'
import chartList from './AiEchart/echartTpls'
import AiMonitor from "./AiMonitor/AiMonitor";
import AiDvPanel from "../layout/AiDvPanel/AiDvPanel";
import AiDvDisplay from "../layout/AiDvDisplay/AiDvDisplay";
import AiDvSummary from "../layout/AiDvSummary/AiDvSummary";
import AiSprite from "./AiSprite";
import * as mods from "./AiSprite/mods";
export default {
name: 'AiDvRender',
props: ['data', 'index', 'theme', 'instance'],
components: {
AiSprite,
AiDvSummary,
AiDvDisplay,
AiDvPanel,
AiMonitor,
AiSwiper
},
data() {
return {
lineChart1,
lineChart2,
lineChart5,
pieChart,
pieChart1,
pieChart3,
mods,
chartList,
map: null,
lib: null
}
},
computed: {
...mapState(['user']),
values() {
if (!this.data) {
return []
}
return this.data.type === 'map' ? this.data[this.data.dataType].map(e => {
return {...e, lng: e['经度'], lat: e['纬度'], label: e['地区名称']}
}) : this.data[this.data.dataType]
}
},
},
methods: {
formatTable(data, isShowIndex, rowNum) {