秀山金融大屏完成
This commit is contained in:
aixianling
@@ -45,13 +45,13 @@
|
|||||||
<div class="layout-middle">
|
<div class="layout-middle">
|
||||||
<div class="canvas-wrapper">
|
<div class="canvas-wrapper">
|
||||||
<vue-ruler-tool
|
<vue-ruler-tool
|
||||||
v-model="dashboard.presetLine"
|
v-model="dashboard.presetLine"
|
||||||
class="vueRuler"
|
class="vueRuler"
|
||||||
:step-length="50"
|
:step-length="50"
|
||||||
:parent="true"
|
:parent="true"
|
||||||
:position="'relative'"
|
:position="'relative'"
|
||||||
:is-scale-revise="true"
|
:is-scale-revise="true"
|
||||||
:visible.sync="dashboard.presetLineVisible">
|
:visible.sync="dashboard.presetLineVisible">
|
||||||
<div
|
<div
|
||||||
id="workbench"
|
id="workbench"
|
||||||
class="workbench"
|
class="workbench"
|
||||||
@@ -63,29 +63,29 @@
|
|||||||
<ai-dv-wrapper style="height: 100%" :title="params.name" :theme="dashboard.theme">
|
<ai-dv-wrapper style="height: 100%" :title="params.name" :theme="dashboard.theme">
|
||||||
<div style="width: 100%; height: 100%">
|
<div style="width: 100%; height: 100%">
|
||||||
<AiDvBackground
|
<AiDvBackground
|
||||||
:theme="dashboard.theme"
|
:theme="dashboard.theme"
|
||||||
v-if="dashboard.backgroundImage.length || dashboard.theme === '1'"
|
v-if="dashboard.backgroundImage.length || dashboard.theme === '1'"
|
||||||
:src="dashboard.theme === '1' ? 'https://cdn.cunwuyun.cn/dvcp/dv/img/dj-bg.png' : dashboard.backgroundImage[0].url">
|
:src="dashboard.theme === '1' ? 'https://cdn.cunwuyun.cn/dvcp/dv/img/dj-bg.png' : dashboard.backgroundImage[0].url">
|
||||||
</AiDvBackground>
|
</AiDvBackground>
|
||||||
<vue-draggable-resizable
|
<vue-draggable-resizable
|
||||||
:w="item.width"
|
:w="item.width"
|
||||||
:h="item.height"
|
:h="item.height"
|
||||||
:x="item.left"
|
:x="item.left"
|
||||||
:y="item.top"
|
:y="item.top"
|
||||||
:scale="heightScale"
|
:scale="heightScale"
|
||||||
:z="item.zIndex || 0"
|
:z="item.zIndex || 0"
|
||||||
:parent="true"
|
:parent="true"
|
||||||
:resizable="item.type !== 'display' || item.display === 'summary2' || item.display === 'summary3'"
|
:resizable="item.type !== 'display' || item.display === 'summary2' || item.display === 'summary3'"
|
||||||
class-name-active="drag-active"
|
class-name-active="drag-active"
|
||||||
:class="[activeIndex === index ? 'drag-active' : '']"
|
:class="[activeIndex === index ? 'drag-active' : '']"
|
||||||
class="draggable"
|
class="draggable"
|
||||||
@contextmenu.native.stop="e => onContextmenu(e, index)"
|
@contextmenu.native.stop="e => onContextmenu(e, index)"
|
||||||
@dragging="(x, y) => onDrag(x, y, index)"
|
@dragging="(x, y) => onDrag(x, y, index)"
|
||||||
@resizing="(x, y, w, h) => onResizing(x, y, w, h, index, item.type)"
|
@resizing="(x, y, w, h) => onResizing(x, y, w, h, index, item.type)"
|
||||||
@activated="onActivated(index)"
|
@activated="onActivated(index)"
|
||||||
@click.native.stop="activeIndex = index"
|
@click.native.stop="activeIndex = index"
|
||||||
v-for="(item, index) in componentList"
|
v-for="(item, index) in componentList"
|
||||||
:key="index">
|
:key="index">
|
||||||
<div class="coordinate" v-show="activeIndex === index">
|
<div class="coordinate" v-show="activeIndex === index">
|
||||||
<div class="coordinate-left"></div>
|
<div class="coordinate-left"></div>
|
||||||
<div class="coordinate-top"></div>
|
<div class="coordinate-top"></div>
|
||||||
@@ -156,15 +156,6 @@
|
|||||||
</el-select>
|
</el-select>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="layout-config__item" v-if="currLayout.type === 'map'">
|
|
||||||
<label>遮罩层</label>
|
|
||||||
<div class="layout-config__item--right">
|
|
||||||
<el-select size="mini" v-model="currLayout.mask" placeholder="请选择" clearable>
|
|
||||||
<el-option label="是" value="1"></el-option>
|
|
||||||
<el-option label="否" value="2"></el-option>
|
|
||||||
</el-select>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="layout-config__item layout-config__item--input" v-if="currLayout.type === 'video'">
|
<div class="layout-config__item layout-config__item--input" v-if="currLayout.type === 'video'">
|
||||||
<label>视频地址</label>
|
<label>视频地址</label>
|
||||||
<div class="layout-config__item--right">
|
<div class="layout-config__item--right">
|
||||||
@@ -201,21 +192,44 @@
|
|||||||
<el-input-number size="mini" style="width: 232px" :min="0" v-model="currLayout.rowNum" controls-position="right"></el-input-number>
|
<el-input-number size="mini" style="width: 232px" :min="0" v-model="currLayout.rowNum" controls-position="right"></el-input-number>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="layout-config__item" v-if="currLayout.type === 'map'">
|
<template v-if="currLayout.type === 'map'">
|
||||||
<label>选择地区</label>
|
<div class="layout-config__item">
|
||||||
<div class="layout-config__item--right">
|
<label>遮罩层</label>
|
||||||
<AiAreaGet :instance="instance" :valueLevel="3" v-model="currLayout.areaId" placeholder="请选择地区"></AiAreaGet>
|
<div class="layout-config__item--right">
|
||||||
|
<el-select size="mini" v-model="currLayout.mask" placeholder="请选择" clearable>
|
||||||
|
<el-option label="是" value="1"></el-option>
|
||||||
|
<el-option label="否" value="2"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="layout-config__item">
|
||||||
|
<label>选择地区</label>
|
||||||
|
<div class="layout-config__item--right">
|
||||||
|
<AiAreaGet :instance="instance" :valueLevel="3" v-model="currLayout.areaId" placeholder="请选择地区"></AiAreaGet>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layout-config__item">
|
||||||
|
<label>展示光轨</label>
|
||||||
|
<div class="layout-config__item--right">
|
||||||
|
<ai-select v-model="currLayout.pulseLines" :selectList="dict.getDict('yesOrNo')"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layout-config__item layout-config__item--input">
|
||||||
|
<label>地图样式</label>
|
||||||
|
<div class="layout-config__item--right">
|
||||||
|
<el-input size="mini" v-model="currLayout.mapStyle" clearable placeholder="请输入地图样式ID,从UI处获取.."/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
<div class="layout-config__item" v-if="currLayout.type === 'summary'">
|
<div class="layout-config__item" v-if="currLayout.type === 'summary'">
|
||||||
<label>数据汇总</label>
|
<label>数据汇总</label>
|
||||||
<div class="layout-config__item--right">
|
<div class="layout-config__item--right">
|
||||||
<el-select size="mini" v-model="currLayout.display" placeholder="请选择类型" clearable>
|
<el-select size="mini" v-model="currLayout.display" placeholder="请选择类型" clearable>
|
||||||
<el-option
|
<el-option
|
||||||
v-for="(item, index) in summaryList"
|
v-for="(item, index) in summaryList"
|
||||||
:key="index"
|
:key="index"
|
||||||
:label="item"
|
:label="item"
|
||||||
:value="item">
|
:value="item">
|
||||||
</el-option>
|
</el-option>
|
||||||
</el-select>
|
</el-select>
|
||||||
</div>
|
</div>
|
||||||
@@ -284,9 +298,9 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
class="layout-menu"
|
class="layout-menu"
|
||||||
v-if="activeIndex > -1 && isShowMenu"
|
v-if="activeIndex > -1 && isShowMenu"
|
||||||
:style="{top: menuY + 'px', left: menuX + 'px'}">
|
:style="{top: menuY + 'px', left: menuX + 'px'}">
|
||||||
<div class="layout-menu__item" @click="removeLayer">
|
<div class="layout-menu__item" @click="removeLayer">
|
||||||
<span>删除图层</span>
|
<span>删除图层</span>
|
||||||
</div>
|
</div>
|
||||||
@@ -303,17 +317,17 @@
|
|||||||
<ai-dialog :visible.sync="isShowImg" append-to-body title="图片素材" @onConfirm="isShowImg = false">
|
<ai-dialog :visible.sync="isShowImg" append-to-body title="图片素材" @onConfirm="isShowImg = false">
|
||||||
<el-button type="primary" style="margin-bottom: 20px" @click="isShowAddImg = true">添加图片</el-button>
|
<el-button type="primary" style="margin-bottom: 20px" @click="isShowAddImg = true">添加图片</el-button>
|
||||||
<ai-table
|
<ai-table
|
||||||
:tableData="images"
|
:tableData="images"
|
||||||
:total="images.length"
|
:total="images.length"
|
||||||
:colConfigs="colConfigs"
|
:colConfigs="colConfigs"
|
||||||
@getList="() => {}">
|
@getList="() => {}">
|
||||||
<el-table-column slot="img" label="图片" align="center">
|
<el-table-column slot="img" label="图片" align="center">
|
||||||
<template slot-scope="{ row }">
|
<template slot-scope="{ row }">
|
||||||
<ai-uploader
|
<ai-uploader
|
||||||
:instance="instance"
|
:instance="instance"
|
||||||
:value="[{url: row.url}]"
|
:value="[{url: row.url}]"
|
||||||
disabled
|
disabled
|
||||||
:limit="1">
|
:limit="1">
|
||||||
</ai-uploader>
|
</ai-uploader>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
@@ -329,9 +343,9 @@
|
|||||||
</ai-dialog>
|
</ai-dialog>
|
||||||
<ai-dialog :visible.sync="isShowAddImg" width="580px" append-to-body title="添加图片" @closed="form.images = []" @onConfirm="onImageConfirm">
|
<ai-dialog :visible.sync="isShowAddImg" width="580px" append-to-body title="添加图片" @closed="form.images = []" @onConfirm="onImageConfirm">
|
||||||
<ai-uploader
|
<ai-uploader
|
||||||
:instance="instance"
|
:instance="instance"
|
||||||
v-model="form.images"
|
v-model="form.images"
|
||||||
:limit="9">
|
:limit="9">
|
||||||
<template slot="tips">
|
<template slot="tips">
|
||||||
<p>最多上传9张图片,单个文件最大10MB，支持jpg、jpeg、png格式</p>
|
<p>最多上传9张图片,单个文件最大10MB，支持jpg、jpeg、png格式</p>
|
||||||
</template>
|
</template>
|
||||||
@@ -341,284 +355,283 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { components } from '../config'
|
import {components} from '../config'
|
||||||
import VueRulerTool from 'vue-ruler-tool'
|
import VueRulerTool from 'vue-ruler-tool'
|
||||||
import VueDraggableResizable from 'vue-draggable-resizable'
|
import VueDraggableResizable from 'vue-draggable-resizable'
|
||||||
import 'vue-draggable-resizable/dist/VueDraggableResizable.css'
|
import 'vue-draggable-resizable/dist/VueDraggableResizable.css'
|
||||||
import DataConfig from './form/DataConfig.vue'
|
import DataConfig from './form/DataConfig.vue'
|
||||||
import RenderElement from './RenderElement'
|
import RenderElement from './RenderElement'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
props: {
|
props: {
|
||||||
instance: Function,
|
instance: Function,
|
||||||
dict: Object,
|
dict: Object,
|
||||||
params: Object,
|
params: Object,
|
||||||
urlPrefix: String
|
urlPrefix: String
|
||||||
},
|
},
|
||||||
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
colConfigs: [
|
colConfigs: [
|
||||||
// { prop: 'url', label: '图片链接', showOverflowTooltip: false },
|
// { prop: 'url', label: '图片链接', showOverflowTooltip: false },
|
||||||
{ slot: 'img', label: '图片' }
|
{slot: 'img', label: '图片'}
|
||||||
],
|
],
|
||||||
form: {
|
form: {
|
||||||
images: []
|
images: []
|
||||||
},
|
|
||||||
isShowAddImg: false,
|
|
||||||
isShowImg: false,
|
|
||||||
parentIndex: 0,
|
|
||||||
subIndex: 0,
|
|
||||||
sonIndex: 0,
|
|
||||||
leftIndex: 0,
|
|
||||||
rightIndex: 1,
|
|
||||||
configIndex: 0,
|
|
||||||
components,
|
|
||||||
bigscreenWidth: 1920,
|
|
||||||
bigscreenHeight: 1080,
|
|
||||||
widthPaddingTools: 18,
|
|
||||||
componentList: [],
|
|
||||||
dashboard: {
|
|
||||||
title: '大屏',
|
|
||||||
width: 1920,
|
|
||||||
height: 1080,
|
|
||||||
theme: '0',
|
|
||||||
backgroundColor: '',
|
|
||||||
backgroundImage: []
|
|
||||||
},
|
|
||||||
menuX: 0,
|
|
||||||
menuY: 0,
|
|
||||||
isShowMenu: false,
|
|
||||||
activeIndex: -1,
|
|
||||||
middleWidth: 0,
|
|
||||||
middleHeight: 0,
|
|
||||||
widthScale: 0,
|
|
||||||
heightScale: 0,
|
|
||||||
bigscreenScaleInWorkbench: 0,
|
|
||||||
tableStatus: [{
|
|
||||||
label: '是',
|
|
||||||
value: '1'
|
|
||||||
}, {
|
|
||||||
label: '否',
|
|
||||||
value: '0'
|
|
||||||
}],
|
|
||||||
images: [],
|
|
||||||
summaryList: ['summary0', 'summary1', 'summary2', 'summary3', 'summary4', 'summary6', 'summary5', 'summary7', 'summary8', 'summary9', 'summary10', 'summary11'],
|
|
||||||
borderList: ['border0', 'border1', 'border2', 'border3', 'border4', 'border5']
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
components: {
|
|
||||||
RenderElement,
|
|
||||||
DataConfig,
|
|
||||||
VueRulerTool,
|
|
||||||
VueDraggableResizable,
|
|
||||||
},
|
|
||||||
|
|
||||||
computed: {
|
|
||||||
workbenchTransform() {
|
|
||||||
return `scale(${this.heightScale})`
|
|
||||||
},
|
},
|
||||||
|
isShowAddImg: false,
|
||||||
currLayout() {
|
isShowImg: false,
|
||||||
if (this.activeIndex === -1) return {}
|
parentIndex: 0,
|
||||||
|
subIndex: 0,
|
||||||
return this.componentList[this.activeIndex]
|
sonIndex: 0,
|
||||||
|
leftIndex: 0,
|
||||||
|
rightIndex: 1,
|
||||||
|
configIndex: 0,
|
||||||
|
components,
|
||||||
|
bigscreenWidth: 1920,
|
||||||
|
bigscreenHeight: 1080,
|
||||||
|
widthPaddingTools: 18,
|
||||||
|
componentList: [],
|
||||||
|
dashboard: {
|
||||||
|
title: '大屏',
|
||||||
|
width: 1920,
|
||||||
|
height: 1080,
|
||||||
|
theme: '0',
|
||||||
|
backgroundColor: '',
|
||||||
|
backgroundImage: []
|
||||||
},
|
},
|
||||||
|
menuX: 0,
|
||||||
|
menuY: 0,
|
||||||
|
isShowMenu: false,
|
||||||
|
activeIndex: -1,
|
||||||
|
middleWidth: 0,
|
||||||
|
middleHeight: 0,
|
||||||
|
widthScale: 0,
|
||||||
|
heightScale: 0,
|
||||||
|
bigscreenScaleInWorkbench: 0,
|
||||||
|
tableStatus: [{
|
||||||
|
label: '是',
|
||||||
|
value: '1'
|
||||||
|
}, {
|
||||||
|
label: '否',
|
||||||
|
value: '0'
|
||||||
|
}],
|
||||||
|
images: [],
|
||||||
|
summaryList: ['summary0', 'summary1', 'summary2', 'summary3', 'summary4', 'summary6', 'summary5', 'summary7', 'summary8', 'summary9', 'summary10', 'summary11'],
|
||||||
|
borderList: ['border0', 'border1', 'border2', 'border3', 'border4', 'border5']
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
widget() {
|
components: {
|
||||||
if (this.components.length && this.components[this.parentIndex].list.length) {
|
RenderElement,
|
||||||
return this.components[this.parentIndex].list[this.subIndex].list
|
DataConfig,
|
||||||
}
|
VueRulerTool,
|
||||||
|
VueDraggableResizable,
|
||||||
|
},
|
||||||
|
|
||||||
return []
|
computed: {
|
||||||
}
|
workbenchTransform() {
|
||||||
|
return `scale(${this.heightScale})`
|
||||||
},
|
},
|
||||||
|
|
||||||
mounted() {
|
currLayout() {
|
||||||
if (this.params && this.params.id) {
|
if (this.activeIndex === -1) return {}
|
||||||
this.getInfo(this.params.id)
|
return this.componentList[this.activeIndex]
|
||||||
|
},
|
||||||
|
|
||||||
|
widget() {
|
||||||
|
if (this.components.length && this.components[this.parentIndex].list.length) {
|
||||||
|
return this.components[this.parentIndex].list[this.subIndex].list
|
||||||
}
|
}
|
||||||
|
|
||||||
|
return []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
mounted() {
|
||||||
|
if (this.params && this.params.id) {
|
||||||
|
this.getInfo(this.params.id)
|
||||||
|
}
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.middleWidth = document.querySelector('.layout-wrapper').offsetWidth - 670
|
||||||
|
this.middleHeight = document.querySelector('.layout-wrapper').offsetHeight
|
||||||
|
this.initCanvas()
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
bindEvent() {
|
||||||
|
this.middleWidth = document.querySelector('.layout-wrapper').offsetWidth - 670
|
||||||
|
this.middleHeight = document.querySelector('.layout-wrapper').offsetHeight
|
||||||
|
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.middleWidth = document.querySelector('.layout-wrapper').offsetWidth - 670
|
|
||||||
this.middleHeight = document.querySelector('.layout-wrapper').offsetHeight
|
|
||||||
this.initCanvas()
|
this.initCanvas()
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
copy(link) {
|
||||||
bindEvent() {
|
let oInput = document.createElement('input')
|
||||||
this.middleWidth = document.querySelector('.layout-wrapper').offsetWidth - 670
|
oInput.value = link
|
||||||
this.middleHeight = document.querySelector('.layout-wrapper').offsetHeight
|
document.body.appendChild(oInput)
|
||||||
|
oInput.select()
|
||||||
|
document.execCommand('Copy')
|
||||||
|
this.$message({
|
||||||
|
message: '已复制',
|
||||||
|
type: 'success'
|
||||||
|
})
|
||||||
|
oInput.remove()
|
||||||
|
},
|
||||||
|
|
||||||
this.$nextTick(() => {
|
removeImg(index) {
|
||||||
this.initCanvas()
|
this.images.splice(index, 1)
|
||||||
})
|
},
|
||||||
},
|
|
||||||
|
|
||||||
copy (link) {
|
onImageConfirm() {
|
||||||
let oInput = document.createElement('input')
|
if (!this.form.images.length) {
|
||||||
oInput.value = link
|
return this.$message.error('请上传图片')
|
||||||
document.body.appendChild(oInput)
|
|
||||||
oInput.select()
|
|
||||||
document.execCommand('Copy')
|
|
||||||
this.$message({
|
|
||||||
message: '已复制',
|
|
||||||
type: 'success'
|
|
||||||
})
|
|
||||||
oInput.remove()
|
|
||||||
},
|
|
||||||
|
|
||||||
removeImg (index) {
|
|
||||||
this.images.splice(index, 1)
|
|
||||||
},
|
|
||||||
|
|
||||||
onImageConfirm () {
|
|
||||||
if (!this.form.images.length) {
|
|
||||||
return this.$message.error('请上传图片')
|
|
||||||
}
|
|
||||||
|
|
||||||
this.images = [
|
|
||||||
...this.images,
|
|
||||||
...this.form.images
|
|
||||||
]
|
|
||||||
|
|
||||||
this.form.images = []
|
|
||||||
this.isShowAddImg = false
|
|
||||||
},
|
|
||||||
|
|
||||||
setTop() {
|
|
||||||
const maxZindex = Math.max.apply(Math, this.componentList.map(item => {
|
|
||||||
return item.zIndex
|
|
||||||
}))
|
|
||||||
|
|
||||||
this.$set(this.componentList[this.activeIndex], 'zIndex', maxZindex + 1)
|
|
||||||
},
|
|
||||||
|
|
||||||
setBottom() {
|
|
||||||
const item = this.componentList[this.activeIndex]
|
|
||||||
this.componentList.splice(this.activeIndex, 1)
|
|
||||||
this.componentList.unshift(item)
|
|
||||||
},
|
|
||||||
|
|
||||||
getInfo(id) {
|
|
||||||
this.instance.post(`${this.urlPrefix}/appdiylargescreen/queryLargeScreenDetailById?id=${id}`).then(res => {
|
|
||||||
if (res.code === 0) {
|
|
||||||
const data = JSON.parse(res.data.config)
|
|
||||||
this.componentList = data.config
|
|
||||||
this.dashboard = data.dashboard
|
|
||||||
this.images = data.images || []
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
|
|
||||||
back() {
|
|
||||||
this.$emit('close')
|
|
||||||
},
|
|
||||||
|
|
||||||
save() {
|
|
||||||
this.instance.post(`${this.urlPrefix}/appdiylargescreen/addOrUpdateLargeScreen`, {
|
|
||||||
config: JSON.stringify({
|
|
||||||
config: this.componentList,
|
|
||||||
dashboard: this.dashboard,
|
|
||||||
images: this.images
|
|
||||||
}),
|
|
||||||
status: 1,
|
|
||||||
title: this.dashboard.title,
|
|
||||||
id: this.params.id || ''
|
|
||||||
}).then(res => {
|
|
||||||
if (res.code == 0) {
|
|
||||||
this.$message.success('保存成功')
|
|
||||||
this.$emit('change', res.data)
|
|
||||||
this.back()
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
|
|
||||||
clone(e) {
|
|
||||||
this.componentList.push(this.deepClone(e))
|
|
||||||
},
|
|
||||||
|
|
||||||
onChange(e) {
|
|
||||||
if (e.indexOf('Chart') > -1) {
|
|
||||||
this.$refs[`chart${this.activeIndex}`][0].refresh()
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
deepClone(data, hash = new WeakMap()) {
|
|
||||||
if (typeof data !== 'object' || data === null) {
|
|
||||||
throw new TypeError('传入参数不是对象')
|
|
||||||
}
|
|
||||||
if (hash.has(data)) {
|
|
||||||
return hash.get(data)
|
|
||||||
}
|
|
||||||
let newData = {}
|
|
||||||
const dataKeys = Object.keys(data)
|
|
||||||
dataKeys.forEach(value => {
|
|
||||||
const currentDataValue = data[value]
|
|
||||||
if (typeof currentDataValue !== "object" || currentDataValue === null) {
|
|
||||||
newData[value] = currentDataValue
|
|
||||||
} else if (Array.isArray(currentDataValue)) {
|
|
||||||
newData[value] = [...currentDataValue]
|
|
||||||
} else if (currentDataValue instanceof Set) {
|
|
||||||
newData[value] = new Set([...currentDataValue])
|
|
||||||
} else if (currentDataValue instanceof Map) {
|
|
||||||
newData[value] = new Map([...currentDataValue])
|
|
||||||
} else {
|
|
||||||
hash.set(data, data)
|
|
||||||
newData[value] = this.deepClone(currentDataValue, hash)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
return newData
|
|
||||||
},
|
|
||||||
|
|
||||||
onContextmenu(e, index) {
|
|
||||||
this.menuX = e.clientX + 10
|
|
||||||
this.menuY = e.clientY + 10
|
|
||||||
this.activeIndex = index
|
|
||||||
this.isShowMenu = true
|
|
||||||
|
|
||||||
e.preventDefault()
|
|
||||||
},
|
|
||||||
|
|
||||||
copyLayer() {
|
|
||||||
const layer = this.deepClone(this.componentList[this.activeIndex])
|
|
||||||
this.componentList.push(layer)
|
|
||||||
},
|
|
||||||
|
|
||||||
removeLayer() {
|
|
||||||
this.componentList.splice(this.activeIndex, 1)
|
|
||||||
this.activeIndex = -1
|
|
||||||
},
|
|
||||||
|
|
||||||
onActivated(index) {
|
|
||||||
this.activeIndex = index
|
|
||||||
},
|
|
||||||
|
|
||||||
|
|
||||||
onDrag(x, y, index) {
|
|
||||||
this.$set(this.componentList[index], 'left', x)
|
|
||||||
this.$set(this.componentList[index], 'top', y)
|
|
||||||
},
|
|
||||||
|
|
||||||
onResizing(x, y, w, h, index, type) {
|
|
||||||
this.$set(this.componentList[index], 'left', x)
|
|
||||||
this.$set(this.componentList[index], 'top', y)
|
|
||||||
this.$set(this.componentList[index], 'width', w)
|
|
||||||
this.$set(this.componentList[index], 'height', h)
|
|
||||||
|
|
||||||
if (type.indexOf('Chart') > -1) {
|
|
||||||
// this.$refs[`chart${index}`][0].watchResize()
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
initCanvas() {
|
|
||||||
var widthScale = (this.middleWidth - this.widthPaddingTools) / this.bigscreenWidth
|
|
||||||
var heightScale = (this.middleHeight - this.widthPaddingTools) / this.bigscreenHeight
|
|
||||||
this.heightScale = Math.min(widthScale, heightScale)
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
this.images = [
|
||||||
|
...this.images,
|
||||||
|
...this.form.images
|
||||||
|
]
|
||||||
|
|
||||||
|
this.form.images = []
|
||||||
|
this.isShowAddImg = false
|
||||||
|
},
|
||||||
|
|
||||||
|
setTop() {
|
||||||
|
const maxZindex = Math.max.apply(Math, this.componentList.map(item => {
|
||||||
|
return item.zIndex
|
||||||
|
}))
|
||||||
|
|
||||||
|
this.$set(this.componentList[this.activeIndex], 'zIndex', maxZindex + 1)
|
||||||
|
},
|
||||||
|
|
||||||
|
setBottom() {
|
||||||
|
const item = this.componentList[this.activeIndex]
|
||||||
|
this.componentList.splice(this.activeIndex, 1)
|
||||||
|
this.componentList.unshift(item)
|
||||||
|
},
|
||||||
|
|
||||||
|
getInfo(id) {
|
||||||
|
this.instance.post(`${this.urlPrefix}/appdiylargescreen/queryLargeScreenDetailById?id=${id}`).then(res => {
|
||||||
|
if (res.code === 0) {
|
||||||
|
const data = JSON.parse(res.data.config)
|
||||||
|
this.componentList = data.config
|
||||||
|
this.dashboard = data.dashboard
|
||||||
|
this.images = data.images || []
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
back() {
|
||||||
|
this.$emit('close')
|
||||||
|
},
|
||||||
|
|
||||||
|
save() {
|
||||||
|
this.instance.post(`${this.urlPrefix}/appdiylargescreen/addOrUpdateLargeScreen`, {
|
||||||
|
config: JSON.stringify({
|
||||||
|
config: this.componentList,
|
||||||
|
dashboard: this.dashboard,
|
||||||
|
images: this.images
|
||||||
|
}),
|
||||||
|
status: 1,
|
||||||
|
title: this.dashboard.title,
|
||||||
|
id: this.params.id || ''
|
||||||
|
}).then(res => {
|
||||||
|
if (res.code == 0) {
|
||||||
|
this.$message.success('保存成功')
|
||||||
|
this.$emit('change', res.data)
|
||||||
|
this.back()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
clone(e) {
|
||||||
|
this.componentList.push(this.deepClone(e))
|
||||||
|
},
|
||||||
|
|
||||||
|
onChange(e) {
|
||||||
|
if (e.indexOf('Chart') > -1) {
|
||||||
|
this.$refs[`chart${this.activeIndex}`][0].refresh()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
deepClone(data, hash = new WeakMap()) {
|
||||||
|
if (typeof data !== 'object' || data === null) {
|
||||||
|
throw new TypeError('传入参数不是对象')
|
||||||
|
}
|
||||||
|
if (hash.has(data)) {
|
||||||
|
return hash.get(data)
|
||||||
|
}
|
||||||
|
let newData = {}
|
||||||
|
const dataKeys = Object.keys(data)
|
||||||
|
dataKeys.forEach(value => {
|
||||||
|
const currentDataValue = data[value]
|
||||||
|
if (typeof currentDataValue !== "object" || currentDataValue === null) {
|
||||||
|
newData[value] = currentDataValue
|
||||||
|
} else if (Array.isArray(currentDataValue)) {
|
||||||
|
newData[value] = [...currentDataValue]
|
||||||
|
} else if (currentDataValue instanceof Set) {
|
||||||
|
newData[value] = new Set([...currentDataValue])
|
||||||
|
} else if (currentDataValue instanceof Map) {
|
||||||
|
newData[value] = new Map([...currentDataValue])
|
||||||
|
} else {
|
||||||
|
hash.set(data, data)
|
||||||
|
newData[value] = this.deepClone(currentDataValue, hash)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
return newData
|
||||||
|
},
|
||||||
|
|
||||||
|
onContextmenu(e, index) {
|
||||||
|
this.menuX = e.clientX + 10
|
||||||
|
this.menuY = e.clientY + 10
|
||||||
|
this.activeIndex = index
|
||||||
|
this.isShowMenu = true
|
||||||
|
|
||||||
|
e.preventDefault()
|
||||||
|
},
|
||||||
|
|
||||||
|
copyLayer() {
|
||||||
|
const layer = this.deepClone(this.componentList[this.activeIndex])
|
||||||
|
this.componentList.push(layer)
|
||||||
|
},
|
||||||
|
|
||||||
|
removeLayer() {
|
||||||
|
this.componentList.splice(this.activeIndex, 1)
|
||||||
|
this.activeIndex = -1
|
||||||
|
},
|
||||||
|
|
||||||
|
onActivated(index) {
|
||||||
|
this.activeIndex = index
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
onDrag(x, y, index) {
|
||||||
|
this.$set(this.componentList[index], 'left', x)
|
||||||
|
this.$set(this.componentList[index], 'top', y)
|
||||||
|
},
|
||||||
|
|
||||||
|
onResizing(x, y, w, h, index, type) {
|
||||||
|
this.$set(this.componentList[index], 'left', x)
|
||||||
|
this.$set(this.componentList[index], 'top', y)
|
||||||
|
this.$set(this.componentList[index], 'width', w)
|
||||||
|
this.$set(this.componentList[index], 'height', h)
|
||||||
|
|
||||||
|
if (type.indexOf('Chart') > -1) {
|
||||||
|
// this.$refs[`chart${index}`][0].watchResize()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
initCanvas() {
|
||||||
|
var widthScale = (this.middleWidth - this.widthPaddingTools) / this.bigscreenWidth
|
||||||
|
var heightScale = (this.middleHeight - this.widthPaddingTools) / this.bigscreenHeight
|
||||||
|
this.heightScale = Math.min(widthScale, heightScale)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|||||||
@@ -1,141 +1,142 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="render-element" style="width: 100%; height: 100%;">
|
<div class="render-element" style="width: 100%; height: 100%;">
|
||||||
<ai-dv-display v-if="data.type === 'display'" :title="data.title" :list="data[data.dataType]"></ai-dv-display>
|
<ai-dv-display v-if="data.type === 'display'" :title="data.title" :list="values"></ai-dv-display>
|
||||||
<ai-dv-panel
|
<ai-dv-panel
|
||||||
style="height: 100%; width: 100%;"
|
style="height: 100%; width: 100%;"
|
||||||
v-if="data.type !== 'display'"
|
v-if="data.type !== 'display'"
|
||||||
:title="data.title"
|
:title="data.title"
|
||||||
:border="data.border || ''">
|
:border="data.border || ''">
|
||||||
<AiDvSummary v-if="data.type === 'summary'" :summaryTitle="data.summaryTitle" :key="`summary${index}`" :type="data.display" :data="data[data.dataType]"/>
|
<AiDvSummary v-if="data.type === 'summary'" :summaryTitle="data.summaryTitle" :key="`summary${index}`" :type="data.display" :data="values"/>
|
||||||
<AiSwiper v-else-if="data.type === 'swiper'" :heigth="'100%'" :data="data[data.dataType]"/>
|
<AiSwiper v-else-if="data.type === 'swiper'" :heigth="'100%'" :data="values"/>
|
||||||
<dv-scroll-board
|
<dv-scroll-board
|
||||||
v-if="data.type === 'table'"
|
v-if="data.type === 'table'"
|
||||||
:class="'dvScrollBoard' + theme"
|
:class="'dvScrollBoard' + theme"
|
||||||
:config="formatTable(data[data.dataType], data.isShowIndex, data.rowNum)"
|
:config="formatTable(values, data.isShowIndex, data.rowNum)"
|
||||||
:key="data.height"
|
:key="data.height"
|
||||||
:theme="theme"
|
:theme="theme"
|
||||||
:style="{height: data.height + 'px', width: '100%'}" />
|
:style="{height: data.height + 'px', width: '100%'}"/>
|
||||||
<ai-echart
|
<ai-echart
|
||||||
v-else-if="data.type === 'barChart1'"
|
v-else-if="data.type === 'barChart1'"
|
||||||
style="height: 100%; width: 100%;"
|
style="height: 100%; width: 100%;"
|
||||||
:ref="'chart' + index"
|
:ref="'chart' + index"
|
||||||
:key="`chart${index}`"
|
:key="`chart${index}`"
|
||||||
:theme="theme"
|
:theme="theme"
|
||||||
:data="data[data.dataType]"
|
:data="values"
|
||||||
:ops="data.config"/>
|
:ops="data.config"/>
|
||||||
<ai-echart
|
<ai-echart
|
||||||
v-else-if="data.type === 'barChart2'"
|
v-else-if="data.type === 'barChart2'"
|
||||||
style="height: 100%; width: 100%;"
|
style="height: 100%; width: 100%;"
|
||||||
:ref="'chart' + index"
|
:ref="'chart' + index"
|
||||||
:theme="theme"
|
:theme="theme"
|
||||||
:key="`chart${index}`"
|
:key="`chart${index}`"
|
||||||
:data="data[data.dataType]"
|
:data="values"
|
||||||
:ops="data.config"/>
|
:ops="data.config"/>
|
||||||
<ai-echart
|
<ai-echart
|
||||||
v-else-if="data.type === 'barChart3'"
|
v-else-if="data.type === 'barChart3'"
|
||||||
style="height: 100%; width: 100%;"
|
style="height: 100%; width: 100%;"
|
||||||
:ref="'chart' + index"
|
:ref="'chart' + index"
|
||||||
:key="`chart${index}`"
|
:key="`chart${index}`"
|
||||||
:theme="theme"
|
:theme="theme"
|
||||||
:data="data[data.dataType]"
|
:data="values"
|
||||||
:ops="data.config"/>
|
:ops="data.config"/>
|
||||||
<ai-echart
|
<ai-echart
|
||||||
v-else-if="data.type === 'barChart5'"
|
v-else-if="data.type === 'barChart5'"
|
||||||
style="height: 100%; width: 100%;"
|
style="height: 100%; width: 100%;"
|
||||||
:ref="'chart' + index"
|
:ref="'chart' + index"
|
||||||
:key="`chart${index}`"
|
:key="`chart${index}`"
|
||||||
:theme="theme"
|
:theme="theme"
|
||||||
:data="data[data.dataType]"
|
:data="values"
|
||||||
:ops="data.config"/>
|
:ops="data.config"/>
|
||||||
<ai-echart
|
<ai-echart
|
||||||
v-else-if="data.type === 'barChart7'"
|
v-else-if="data.type === 'barChart7'"
|
||||||
style="height: 100%; width: 100%;"
|
style="height: 100%; width: 100%;"
|
||||||
:ref="'chart' + index"
|
:ref="'chart' + index"
|
||||||
:key="`chart${index}`"
|
:key="`chart${index}`"
|
||||||
:theme="theme"
|
:theme="theme"
|
||||||
:data="data[data.dataType]"
|
:data="values"
|
||||||
:ops="data.config"/>
|
:ops="data.config"/>
|
||||||
<ai-echart
|
<ai-echart
|
||||||
v-else-if="data.type === 'barChart8'"
|
v-else-if="data.type === 'barChart8'"
|
||||||
style="height: 100%; width: 100%;"
|
style="height: 100%; width: 100%;"
|
||||||
:ref="'chart' + index"
|
:ref="'chart' + index"
|
||||||
:key="`chart${index}`"
|
:key="`chart${index}`"
|
||||||
:theme="theme"
|
:theme="theme"
|
||||||
:data="data[data.dataType]"
|
:data="values"
|
||||||
:ops="data.config"/>
|
:ops="data.config"/>
|
||||||
<ai-echart
|
<ai-echart
|
||||||
v-else-if="data.type === 'barChart9'"
|
v-else-if="data.type === 'barChart9'"
|
||||||
style="height: 100%; width: 100%;"
|
style="height: 100%; width: 100%;"
|
||||||
:ref="'chart' + index"
|
:ref="'chart' + index"
|
||||||
:key="`chart${index}`"
|
:key="`chart${index}`"
|
||||||
:theme="theme"
|
:theme="theme"
|
||||||
:data="data[data.dataType]"
|
:data="values"
|
||||||
:ops="data.config"/>
|
:ops="data.config"/>
|
||||||
<ai-echart
|
<ai-echart
|
||||||
v-else-if="data.type === 'lineChart1'"
|
v-else-if="data.type === 'lineChart1'"
|
||||||
style="height: 100%; width: 100%;"
|
style="height: 100%; width: 100%;"
|
||||||
:ref="'chart' + index"
|
:ref="'chart' + index"
|
||||||
:key="`chart${index}`"
|
:key="`chart${index}`"
|
||||||
:theme="theme"
|
:theme="theme"
|
||||||
:data="data[data.dataType]"
|
:data="values"
|
||||||
:ops="lineChart1"/>
|
:ops="lineChart1"/>
|
||||||
<ai-echart
|
<ai-echart
|
||||||
v-else-if="data.type === 'lineChart2'"
|
v-else-if="data.type === 'lineChart2'"
|
||||||
style="height: 100%; width: 100%;"
|
style="height: 100%; width: 100%;"
|
||||||
:ref="'chart' + index"
|
:ref="'chart' + index"
|
||||||
:key="`chart${index}`"
|
:key="`chart${index}`"
|
||||||
:theme="theme"
|
:theme="theme"
|
||||||
:data="data[data.dataType]"
|
:data="values"
|
||||||
:ops="lineChart2"/>
|
:ops="lineChart2"/>
|
||||||
<ai-echart
|
<ai-echart
|
||||||
v-else-if="data.type === 'lineChart3'"
|
v-else-if="data.type === 'lineChart3'"
|
||||||
style="height: 100%; width: 100%;"
|
style="height: 100%; width: 100%;"
|
||||||
:ref="'chart' + index"
|
:ref="'chart' + index"
|
||||||
:key="`chart${index}`"
|
:key="`chart${index}`"
|
||||||
:theme="theme"
|
:theme="theme"
|
||||||
:data="data[data.dataType]"
|
:data="values"
|
||||||
:ops="data.config"/>
|
:ops="data.config"/>
|
||||||
<ai-echart
|
<ai-echart
|
||||||
v-else-if="data.type === 'lineChart4'"
|
v-else-if="data.type === 'lineChart4'"
|
||||||
style="height: 100%; width: 100%;"
|
style="height: 100%; width: 100%;"
|
||||||
:ref="'chart' + index"
|
:ref="'chart' + index"
|
||||||
:key="`chart${index}`"
|
:key="`chart${index}`"
|
||||||
:theme="theme"
|
:theme="theme"
|
||||||
:data="data[data.dataType]"
|
:data="values"
|
||||||
:ops="data.config"/>
|
:ops="data.config"/>
|
||||||
<ai-echart
|
<ai-echart
|
||||||
v-else-if="data.type === 'lineChart5'"
|
v-else-if="data.type === 'lineChart5'"
|
||||||
style="height: 100%; width: 100%;"
|
style="height: 100%; width: 100%;"
|
||||||
:ref="'chart' + index"
|
:ref="'chart' + index"
|
||||||
:key="`chart${index}`"
|
:key="`chart${index}`"
|
||||||
:theme="theme"
|
:theme="theme"
|
||||||
:data="data[data.dataType]"
|
:data="values"
|
||||||
:ops="lineChart5"/>
|
:ops="lineChart5"/>
|
||||||
<ai-echart
|
<ai-echart
|
||||||
v-else-if="data.type === 'pieChart'"
|
v-else-if="data.type === 'pieChart'"
|
||||||
style="height: 100%; width: 100%;"
|
style="height: 100%; width: 100%;"
|
||||||
:ref="'chart' + index"
|
:ref="'chart' + index"
|
||||||
:key="`chart${index}`"
|
:key="`chart${index}`"
|
||||||
:theme="theme"
|
:theme="theme"
|
||||||
:data="data[data.dataType]"
|
:data="values"
|
||||||
:ops="pieChart"/>
|
:ops="pieChart"/>
|
||||||
<ai-echart
|
<ai-echart
|
||||||
v-else-if="data.type === 'pieChart1'"
|
v-else-if="data.type === 'pieChart1'"
|
||||||
style="height: 100%; width: 100%;"
|
style="height: 100%; width: 100%;"
|
||||||
:ref="'chart' + index"
|
:ref="'chart' + index"
|
||||||
:key="`chart${index}`"
|
:key="`chart${index}`"
|
||||||
:theme="theme"
|
:theme="theme"
|
||||||
:data="data[data.dataType]"
|
:data="values"
|
||||||
:ops="pieChart1"/>
|
:ops="pieChart1"/>
|
||||||
<ai-echart
|
<ai-echart
|
||||||
v-else-if="data.type === 'pieChart3'"
|
v-else-if="data.type === 'pieChart3'"
|
||||||
style="height: 100%; width: 100%;"
|
style="height: 100%; width: 100%;"
|
||||||
:ref="'chart' + index"
|
:ref="'chart' + index"
|
||||||
:key="`chart${index}`"
|
:key="`chart${index}`"
|
||||||
:theme="theme"
|
:theme="theme"
|
||||||
:data="data[data.dataType]"
|
:data="values"
|
||||||
:ops="pieChart3"/>
|
:ops="pieChart3"/>
|
||||||
<ai-map :markers="data[data.dataType]" v-else-if="data.type=='map'" :mask="data.mask === '1'" :areaId="data.areaId || user.info.areaId" map-style="amap://styles/e51987628aee5206d4c9ca8c6e98b4f7"/>
|
<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"></ai-monitor>
|
<ai-monitor :src="data.src" v-else-if="data.type === 'monitor'" :type="data.monitorType"></ai-monitor>
|
||||||
<video style="width: 100%; height: 100%; object-fit: fill;" loop :src="data.src" autoplay v-else-if="data.type === 'video'"></video>
|
<video style="width: 100%; height: 100%; object-fit: fill;" loop :src="data.src" autoplay v-else-if="data.type === 'video'"></video>
|
||||||
<AiDvPartyOrg style="width: 100%; height: 100%;" v-else-if="data.type === 'partyOrg'" :instance="instance"></AiDvPartyOrg>
|
<AiDvPartyOrg style="width: 100%; height: 100%;" v-else-if="data.type === 'partyOrg'" :instance="instance"></AiDvPartyOrg>
|
||||||
@@ -144,124 +145,201 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { mapState } from 'vuex'
|
import {mapState} from 'vuex'
|
||||||
import AiSwiper from './AiSwiper.vue'
|
import AiSwiper from './AiSwiper.vue'
|
||||||
import pieChart from 'dvcp-dv-ui/components/AiEchart/template/pie/pieChart2'
|
import pieChart from 'dvcp-dv-ui/components/AiEchart/template/pie/pieChart2'
|
||||||
import pieChart1 from 'dvcp-dv-ui/components/AiEchart/template/pie/pieChart1'
|
import pieChart1 from 'dvcp-dv-ui/components/AiEchart/template/pie/pieChart1'
|
||||||
import pieChart3 from 'dvcp-dv-ui/components/AiEchart/template/pie/pieChart3'
|
import pieChart3 from 'dvcp-dv-ui/components/AiEchart/template/pie/pieChart3'
|
||||||
import lineChart1 from 'dvcp-dv-ui/components/AiEchart/template/line/lineChart1'
|
import lineChart1 from 'dvcp-dv-ui/components/AiEchart/template/line/lineChart1'
|
||||||
import lineChart2 from 'dvcp-dv-ui/components/AiEchart/template/line/lineChart2'
|
import lineChart2 from 'dvcp-dv-ui/components/AiEchart/template/line/lineChart2'
|
||||||
import lineChart5 from 'dvcp-dv-ui/components/AiEchart/template/line/lineChart5'
|
import lineChart5 from 'dvcp-dv-ui/components/AiEchart/template/line/lineChart5'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'RenderElement',
|
name: 'RenderElement',
|
||||||
|
|
||||||
props: ['data', 'index', 'theme', 'instance'],
|
props: ['data', 'index', 'theme', 'instance'],
|
||||||
|
|
||||||
components: {
|
components: {
|
||||||
AiSwiper
|
AiSwiper
|
||||||
},
|
},
|
||||||
|
|
||||||
data () {
|
data() {
|
||||||
|
return {
|
||||||
|
lineChart1,
|
||||||
|
lineChart2,
|
||||||
|
lineChart5,
|
||||||
|
pieChart,
|
||||||
|
pieChart1,
|
||||||
|
pieChart3,
|
||||||
|
map: null,
|
||||||
|
lib: null
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
computed: {
|
||||||
|
...mapState(['user']),
|
||||||
|
values() {
|
||||||
|
return this.data?.[this.data.dataType]?.map(e => {
|
||||||
|
return {...e, lng: e['经度'], lat: e['纬度'], label: e['地区名称']}
|
||||||
|
}) || []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
formatTable(data, isShowIndex, rowNum) {
|
||||||
|
if (!data.length) {
|
||||||
|
return {
|
||||||
|
header: [],
|
||||||
|
data: []
|
||||||
|
}
|
||||||
|
}
|
||||||
|
let rows = []
|
||||||
|
const header = data.map(v => {
|
||||||
|
return v[Object.keys(v)[0]]
|
||||||
|
})
|
||||||
|
Object.keys(data[0]).forEach((item, index) => {
|
||||||
|
if (index !== 0) {
|
||||||
|
rows.push(item)
|
||||||
|
}
|
||||||
|
})
|
||||||
return {
|
return {
|
||||||
lineChart1,
|
header: header,
|
||||||
lineChart2,
|
data: rows.map(item => {
|
||||||
lineChart5,
|
return data.map(v => {
|
||||||
pieChart,
|
return v[item]
|
||||||
pieChart1,
|
})
|
||||||
pieChart3
|
}),
|
||||||
|
headerBGC: 'transparent',
|
||||||
|
evenRowBGC: 'transparent',
|
||||||
|
oddRowBGC: 'rgba(0, 133, 255, 0.2)',
|
||||||
|
headerHeight: 42,
|
||||||
|
rowNum: rowNum || 7,
|
||||||
|
index: isShowIndex === '1',
|
||||||
|
waitTime: 8000,
|
||||||
|
carousel: 'page',
|
||||||
|
indexHeader: '排名',
|
||||||
|
align: ['center', 'center', 'center', 'center', 'center']
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
handleMapClick(count = 0) {
|
||||||
computed: {
|
let {lib: AMap, map} = this
|
||||||
...mapState(['user'])
|
if (AMap) {
|
||||||
},
|
let infoWin = new AMap.InfoWindow({content: ""})
|
||||||
|
map.clearMap()
|
||||||
methods: {
|
let markers = this.values.filter(e=>e.lng).map(e => {
|
||||||
formatTable(data, isShowIndex, rowNum) {
|
return new AMap.Marker({
|
||||||
if (!data.length) {
|
map,
|
||||||
return {
|
label: e.label,
|
||||||
header: [],
|
icon: e.icon,
|
||||||
data: []
|
position: [e.lng, e.lat]
|
||||||
}
|
}).on('click', ({target}) => {
|
||||||
}
|
map.clearInfoWindow()
|
||||||
|
markers?.map(m => m.getIcon() == e.selectedIcon && m.setIcon(e.icon))
|
||||||
let rows = []
|
target.setIcon(e.selectedIcon)
|
||||||
const header = data.map(v => {
|
infoWin.setContent([
|
||||||
return v[Object.keys(v)[0]]
|
`<div class="infoWin">`,
|
||||||
|
`<b>${e.label}</b>`,
|
||||||
|
`<div>累计成交金额：${e['累计成交金额(万)']}万元</div>`,
|
||||||
|
`<div>金融产品：${e['金融产品(万)']}万元</div>`,
|
||||||
|
`<div>融资需求：${e['融资需求(万)']}万元</div>`,
|
||||||
|
'</div>'
|
||||||
|
].join(''))
|
||||||
|
infoWin.open(map, [e.lng, e.lat])
|
||||||
|
})
|
||||||
})
|
})
|
||||||
|
map.setFitView(markers)
|
||||||
Object.keys(data[0]).forEach((item, index) => {
|
} else if (count < 10) {
|
||||||
if (index !== 0) {
|
console.log("正在加载...%s", count)
|
||||||
rows.push(item)
|
setTimeout(() => this.handleMapClick(++count), 1000)
|
||||||
}
|
}
|
||||||
})
|
}
|
||||||
|
},
|
||||||
return {
|
mounted() {
|
||||||
header: header,
|
if (this.data.type == 'map') {
|
||||||
data: rows.map(item => {
|
this.handleMapClick()
|
||||||
return data.map(v => {
|
|
||||||
return v[item]
|
|
||||||
})
|
|
||||||
}),
|
|
||||||
headerBGC: 'transparent',
|
|
||||||
evenRowBGC: 'transparent',
|
|
||||||
oddRowBGC: 'rgba(0, 133, 255, 0.2)',
|
|
||||||
headerHeight: 42,
|
|
||||||
rowNum: rowNum || 7,
|
|
||||||
index: isShowIndex === '1',
|
|
||||||
waitTime: 8000,
|
|
||||||
carousel: 'page',
|
|
||||||
indexHeader: '排名',
|
|
||||||
align: ['center', 'center', 'center', 'center', 'center']
|
|
||||||
}
|
|
||||||
},
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.render-element {
|
.render-element {
|
||||||
::v-deep .dvScrollBoard1 {
|
::v-deep .dvScrollBoard1 {
|
||||||
|
|
||||||
.header {
|
.header {
|
||||||
background: rgba(0, 0, 0, 0.1)!important;
|
background: rgba(0, 0, 0, 0.1) !important;
|
||||||
|
|
||||||
.header-item {
|
.header-item {
|
||||||
color: #FFBB73!important;
|
color: #FFBB73 !important;
|
||||||
font-size: 16px!important;
|
font-size: 16px !important;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.rows {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #FFFFFF;
|
||||||
|
line-height: 21px;
|
||||||
|
text-shadow: 0px 2px 4px rgba(117, 9, 9, 0.5);
|
||||||
|
background: linear-gradient(180deg, #FFF6C7 0%, #FF9A02 100%);
|
||||||
|
-webkit-background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
|
||||||
|
& > div:nth-of-type(2n - 1) {
|
||||||
|
background-color: transparent !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
& > div:nth-of-type(2n) {
|
||||||
|
background-color: rgba(0, 0, 0, 0.1) !important;
|
||||||
|
}
|
||||||
|
|
||||||
.rows {
|
.index {
|
||||||
font-size: 16px;
|
color: #fff;
|
||||||
font-weight: 600;
|
text-shadow: none;
|
||||||
color: #FFFFFF;
|
background: #BD4921 !important;
|
||||||
line-height: 21px;
|
-webkit-background-clip: inherit;
|
||||||
text-shadow: 0px 2px 4px rgba(117, 9, 9, 0.5);
|
-webkit-text-fill-color: #fff;
|
||||||
background: linear-gradient(180deg, #FFF6C7 0%, #FF9A02 100%);
|
|
||||||
-webkit-background-clip: text;
|
|
||||||
-webkit-text-fill-color: transparent;
|
|
||||||
|
|
||||||
& > div:nth-of-type(2n - 1) {
|
|
||||||
background-color: transparent!important;
|
|
||||||
}
|
|
||||||
|
|
||||||
& > div:nth-of-type(2n) {
|
|
||||||
background-color: rgba(0, 0, 0, 0.1)!important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.index {
|
|
||||||
color: #fff;
|
|
||||||
text-shadow: none;
|
|
||||||
background: transparent;
|
|
||||||
background-color: #BD4921!important;
|
|
||||||
-webkit-background-clip: inherit;
|
|
||||||
-webkit-text-fill-color: #fff;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
::v-deep.amap-info-contentContainer {
|
||||||
|
.amap-info-content {
|
||||||
|
background: #0A3257;
|
||||||
|
border: 1px solid #7BE5FF;
|
||||||
|
padding: 16px;
|
||||||
|
font-family: PingFangSC-Semibold, PingFang SC;
|
||||||
|
|
||||||
|
.infoWin {
|
||||||
|
& > b {
|
||||||
|
display: block;
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #FFFFFF;
|
||||||
|
margin-bottom: 13px;
|
||||||
|
}
|
||||||
|
|
||||||
|
& > div {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #7BE5FF;
|
||||||
|
|
||||||
|
& + div {
|
||||||
|
margin-top: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.amap-info-sharp {
|
||||||
|
border-top-color: #0A3257;
|
||||||
|
|
||||||
|
&:after {
|
||||||
|
border-top-color: #7BE5FF;
|
||||||
|
filter: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -44,10 +44,10 @@ const components = [
|
|||||||
apiData: [],
|
apiData: [],
|
||||||
dataType: 'staticData',
|
dataType: 'staticData',
|
||||||
staticData: [
|
staticData: [
|
||||||
{ name: '阿斯达', v1: 23 },
|
{name: '阿斯达', v1: 23},
|
||||||
{ name: '水电费', v1: 12 },
|
{name: '水电费', v1: 12},
|
||||||
{ name: '凡哥', v1: 67 },
|
{name: '凡哥', v1: 67},
|
||||||
{ name: '党费', v1: 98 }
|
{name: '党费', v1: 98}
|
||||||
],
|
],
|
||||||
config: barChart1,
|
config: barChart1,
|
||||||
dynamicData: []
|
dynamicData: []
|
||||||
@@ -73,10 +73,10 @@ const components = [
|
|||||||
api: '',
|
api: '',
|
||||||
apiData: [],
|
apiData: [],
|
||||||
staticData: [
|
staticData: [
|
||||||
{ name: '阿斯达', v1: 23 },
|
{name: '阿斯达', v1: 23},
|
||||||
{ name: '水电费', v1: 12 },
|
{name: '水电费', v1: 12},
|
||||||
{ name: '凡哥', v1: 67 },
|
{name: '凡哥', v1: 67},
|
||||||
{ name: '党费', v1: 98 }
|
{name: '党费', v1: 98}
|
||||||
],
|
],
|
||||||
config: barChart2,
|
config: barChart2,
|
||||||
dynamicData: []
|
dynamicData: []
|
||||||
@@ -102,10 +102,10 @@ const components = [
|
|||||||
api: '',
|
api: '',
|
||||||
apiData: [],
|
apiData: [],
|
||||||
staticData: [
|
staticData: [
|
||||||
{ name: '阿斯达', v1: 23 },
|
{name: '阿斯达', v1: 23},
|
||||||
{ name: '水电费', v1: 12 },
|
{name: '水电费', v1: 12},
|
||||||
{ name: '凡哥', v1: 67 },
|
{name: '凡哥', v1: 67},
|
||||||
{ name: '党费', v1: 98 }
|
{name: '党费', v1: 98}
|
||||||
],
|
],
|
||||||
config: barChart3,
|
config: barChart3,
|
||||||
dynamicData: []
|
dynamicData: []
|
||||||
@@ -131,10 +131,10 @@ const components = [
|
|||||||
apiData: [],
|
apiData: [],
|
||||||
dataType: 'staticData',
|
dataType: 'staticData',
|
||||||
staticData: [
|
staticData: [
|
||||||
{ name: '阿斯达', v1: 23 },
|
{name: '阿斯达', v1: 23},
|
||||||
{ name: '水电费', v1: 12 },
|
{name: '水电费', v1: 12},
|
||||||
{ name: '凡哥', v1: 67 },
|
{name: '凡哥', v1: 67},
|
||||||
{ name: '党费', v1: 98 }
|
{name: '党费', v1: 98}
|
||||||
],
|
],
|
||||||
config: barChart5,
|
config: barChart5,
|
||||||
dynamicData: []
|
dynamicData: []
|
||||||
@@ -159,10 +159,10 @@ const components = [
|
|||||||
apiData: [],
|
apiData: [],
|
||||||
dataType: 'staticData',
|
dataType: 'staticData',
|
||||||
staticData: [
|
staticData: [
|
||||||
{ name: '阿斯达', v1: 23 },
|
{name: '阿斯达', v1: 23},
|
||||||
{ name: '水电费', v1: 12 },
|
{name: '水电费', v1: 12},
|
||||||
{ name: '凡哥', v1: 67 },
|
{name: '凡哥', v1: 67},
|
||||||
{ name: '党费', v1: 98 }
|
{name: '党费', v1: 98}
|
||||||
],
|
],
|
||||||
config: barChart7,
|
config: barChart7,
|
||||||
dynamicData: []
|
dynamicData: []
|
||||||
@@ -188,10 +188,10 @@ const components = [
|
|||||||
apiData: [],
|
apiData: [],
|
||||||
dataType: 'staticData',
|
dataType: 'staticData',
|
||||||
staticData: [
|
staticData: [
|
||||||
{ name: '阿斯达', v1: 23 },
|
{name: '阿斯达', v1: 23},
|
||||||
{ name: '水电费', v1: 12 },
|
{name: '水电费', v1: 12},
|
||||||
{ name: '凡哥', v1: 67 },
|
{name: '凡哥', v1: 67},
|
||||||
{ name: '党费', v1: 98 }
|
{name: '党费', v1: 98}
|
||||||
],
|
],
|
||||||
config: barChart8,
|
config: barChart8,
|
||||||
dynamicData: []
|
dynamicData: []
|
||||||
@@ -217,10 +217,10 @@ const components = [
|
|||||||
apiData: [],
|
apiData: [],
|
||||||
dataType: 'staticData',
|
dataType: 'staticData',
|
||||||
staticData: [
|
staticData: [
|
||||||
{ name: '阿斯达', v1: 23 },
|
{name: '阿斯达', v1: 23},
|
||||||
{ name: '水电费', v1: 12 },
|
{name: '水电费', v1: 12},
|
||||||
{ name: '凡哥', v1: 67 },
|
{name: '凡哥', v1: 67},
|
||||||
{ name: '党费', v1: 98 }
|
{name: '党费', v1: 98}
|
||||||
],
|
],
|
||||||
config: barChart9,
|
config: barChart9,
|
||||||
dynamicData: []
|
dynamicData: []
|
||||||
@@ -251,10 +251,10 @@ const components = [
|
|||||||
dataY: [],
|
dataY: [],
|
||||||
dataType: 'staticData',
|
dataType: 'staticData',
|
||||||
staticData: [
|
staticData: [
|
||||||
{ name: '阿斯达', v1: 23, v2: 33 },
|
{name: '阿斯达', v1: 23, v2: 33},
|
||||||
{ name: '水电费', v1: 12, v2: 34 },
|
{name: '水电费', v1: 12, v2: 34},
|
||||||
{ name: '凡哥', v1: 67, v2: 25 },
|
{name: '凡哥', v1: 67, v2: 25},
|
||||||
{ name: '党费', v1: 98, v2: 85 }
|
{name: '党费', v1: 98, v2: 85}
|
||||||
],
|
],
|
||||||
config: lineChart1,
|
config: lineChart1,
|
||||||
sourceDataId: '',
|
sourceDataId: '',
|
||||||
@@ -280,10 +280,10 @@ const components = [
|
|||||||
apiData: [],
|
apiData: [],
|
||||||
dataType: 'staticData',
|
dataType: 'staticData',
|
||||||
staticData: [
|
staticData: [
|
||||||
{ name: '阿斯达', v1: 23, v2: 33 },
|
{name: '阿斯达', v1: 23, v2: 33},
|
||||||
{ name: '水电费', v1: 12, v2: 34 },
|
{name: '水电费', v1: 12, v2: 34},
|
||||||
{ name: '凡哥', v1: 67, v2: 25 },
|
{name: '凡哥', v1: 67, v2: 25},
|
||||||
{ name: '党费', v1: 98, v2: 85 }
|
{name: '党费', v1: 98, v2: 85}
|
||||||
],
|
],
|
||||||
config: lineChart2,
|
config: lineChart2,
|
||||||
sourceDataId: '',
|
sourceDataId: '',
|
||||||
@@ -309,10 +309,10 @@ const components = [
|
|||||||
apiData: [],
|
apiData: [],
|
||||||
dataType: 'staticData',
|
dataType: 'staticData',
|
||||||
staticData: [
|
staticData: [
|
||||||
{ name: '阿斯达', v1: 23, v2: 33 },
|
{name: '阿斯达', v1: 23, v2: 33},
|
||||||
{ name: '水电费', v1: 12, v2: 34 },
|
{name: '水电费', v1: 12, v2: 34},
|
||||||
{ name: '凡哥', v1: 67, v2: 25 },
|
{name: '凡哥', v1: 67, v2: 25},
|
||||||
{ name: '党费', v1: 98, v2: 85 }
|
{name: '党费', v1: 98, v2: 85}
|
||||||
],
|
],
|
||||||
config: lineChart3,
|
config: lineChart3,
|
||||||
sourceDataId: '',
|
sourceDataId: '',
|
||||||
@@ -338,10 +338,10 @@ const components = [
|
|||||||
apiData: [],
|
apiData: [],
|
||||||
dataType: 'staticData',
|
dataType: 'staticData',
|
||||||
staticData: [
|
staticData: [
|
||||||
{ name: '阿斯达', v1: 23, v2: 33 },
|
{name: '阿斯达', v1: 23, v2: 33},
|
||||||
{ name: '水电费', v1: 12, v2: 34 },
|
{name: '水电费', v1: 12, v2: 34},
|
||||||
{ name: '凡哥', v1: 67, v2: 25 },
|
{name: '凡哥', v1: 67, v2: 25},
|
||||||
{ name: '党费', v1: 98, v2: 85 }
|
{name: '党费', v1: 98, v2: 85}
|
||||||
],
|
],
|
||||||
config: lineChart4,
|
config: lineChart4,
|
||||||
sourceDataId: '',
|
sourceDataId: '',
|
||||||
@@ -367,10 +367,10 @@ const components = [
|
|||||||
apiData: [],
|
apiData: [],
|
||||||
dataType: 'staticData',
|
dataType: 'staticData',
|
||||||
staticData: [
|
staticData: [
|
||||||
{ name: '阿斯达', v1: 23, v2: 33 },
|
{name: '阿斯达', v1: 23, v2: 33},
|
||||||
{ name: '水电费', v1: 12, v2: 34 },
|
{name: '水电费', v1: 12, v2: 34},
|
||||||
{ name: '凡哥', v1: 67, v2: 25 },
|
{name: '凡哥', v1: 67, v2: 25},
|
||||||
{ name: '党费', v1: 98, v2: 85 }
|
{name: '党费', v1: 98, v2: 85}
|
||||||
],
|
],
|
||||||
config: lineChart5,
|
config: lineChart5,
|
||||||
sourceDataId: '',
|
sourceDataId: '',
|
||||||
@@ -402,10 +402,10 @@ const components = [
|
|||||||
apiData: [],
|
apiData: [],
|
||||||
dataType: 'staticData',
|
dataType: 'staticData',
|
||||||
staticData: [
|
staticData: [
|
||||||
{ name: '阿斯达', v1: 23, v2: 33 },
|
{name: '阿斯达', v1: 23, v2: 33},
|
||||||
{ name: '水电费', v1: 12, v2: 34 },
|
{name: '水电费', v1: 12, v2: 34},
|
||||||
{ name: '凡哥', v1: 67, v2: 25 },
|
{name: '凡哥', v1: 67, v2: 25},
|
||||||
{ name: '党费', v1: 98, v2: 85 }
|
{name: '党费', v1: 98, v2: 85}
|
||||||
],
|
],
|
||||||
config: pieChart,
|
config: pieChart,
|
||||||
sourceDataId: '',
|
sourceDataId: '',
|
||||||
@@ -431,10 +431,10 @@ const components = [
|
|||||||
apiData: [],
|
apiData: [],
|
||||||
dataType: 'staticData',
|
dataType: 'staticData',
|
||||||
staticData: [
|
staticData: [
|
||||||
{ name: '阿斯达', v1: 23, v2: 33 },
|
{name: '阿斯达', v1: 23, v2: 33},
|
||||||
{ name: '水电费', v1: 12, v2: 34 },
|
{name: '水电费', v1: 12, v2: 34},
|
||||||
{ name: '凡哥', v1: 67, v2: 25 },
|
{name: '凡哥', v1: 67, v2: 25},
|
||||||
{ name: '党费', v1: 98, v2: 85 }
|
{name: '党费', v1: 98, v2: 85}
|
||||||
],
|
],
|
||||||
config: pieChart1,
|
config: pieChart1,
|
||||||
sourceDataId: '',
|
sourceDataId: '',
|
||||||
@@ -460,10 +460,10 @@ const components = [
|
|||||||
apiData: [],
|
apiData: [],
|
||||||
dataType: 'staticData',
|
dataType: 'staticData',
|
||||||
staticData: [
|
staticData: [
|
||||||
{ name: '阿斯达', v1: 23, v2: 33 },
|
{name: '阿斯达', v1: 23, v2: 33},
|
||||||
{ name: '水电费', v1: 12, v2: 34 },
|
{name: '水电费', v1: 12, v2: 34},
|
||||||
{ name: '凡哥', v1: 67, v2: 25 },
|
{name: '凡哥', v1: 67, v2: 25},
|
||||||
{ name: '党费', v1: 98, v2: 85 }
|
{name: '党费', v1: 98, v2: 85}
|
||||||
],
|
],
|
||||||
config: pieChart1,
|
config: pieChart1,
|
||||||
sourceDataId: '',
|
sourceDataId: '',
|
||||||
@@ -500,9 +500,9 @@ const components = [
|
|||||||
dataType: 'staticData',
|
dataType: 'staticData',
|
||||||
dynamicData: [],
|
dynamicData: [],
|
||||||
staticData: [
|
staticData: [
|
||||||
{ name: '列1', v: 23, v2: 3 },
|
{name: '列1', v: 23, v2: 3},
|
||||||
{ name: '列2', v: 12, v2: 4 },
|
{name: '列2', v: 12, v2: 4},
|
||||||
{ name: '列2', v: 12, v2: 4 }
|
{name: '列2', v: 12, v2: 4}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
@@ -526,6 +526,8 @@ const components = [
|
|||||||
left: 0,
|
left: 0,
|
||||||
top: 0,
|
top: 0,
|
||||||
mask: '2',
|
mask: '2',
|
||||||
|
pulseLines: 1,
|
||||||
|
mapStyle:"e51987628aee5206d4c9ca8c6e98b4f7",
|
||||||
areaId: '',
|
areaId: '',
|
||||||
zIndex: 1,
|
zIndex: 1,
|
||||||
apiData: [],
|
apiData: [],
|
||||||
@@ -728,4 +730,4 @@ const components = [
|
|||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
|
||||||
export { components }
|
export {components}
|
||||||
|
|||||||
@@ -101,7 +101,7 @@ export default {
|
|||||||
this.dashboard = JSON.parse(res.data.config).dashboard
|
this.dashboard = JSON.parse(res.data.config).dashboard
|
||||||
|
|
||||||
this.componentList.forEach((item, index) => {
|
this.componentList.forEach((item, index) => {
|
||||||
if (item.dataType !== 'staticData' && ((item.type.indexOf('Chart') > -1) || item.type === 'display' || item.type === 'table' || item.type === 'summary')) {
|
if (item.dataType !== 'staticData' && ((item.type.indexOf('Chart') > -1) || ['display', 'table', 'map', 'summary'].includes(item.type))) {
|
||||||
this.getSourceData(item, index)
|
this.getSourceData(item, index)
|
||||||
}
|
}
|
||||||
if (item.type === 'monitor' && item.monitorType === 'cmcc') {
|
if (item.type === 'monitor' && item.monitorType === 'cmcc') {
|
||||||
@@ -174,9 +174,8 @@ export default {
|
|||||||
...obj
|
...obj
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
}
|
} else dynamicData = res.data
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$set(this.componentList[index], item.dataType, dynamicData)
|
this.$set(this.componentList[index], item.dataType, dynamicData)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user