修复轮播图编辑器
This commit is contained in:
@@ -294,6 +294,7 @@ export default {
|
|||||||
},
|
},
|
||||||
currLayout: {
|
currLayout: {
|
||||||
set(v) {
|
set(v) {
|
||||||
|
console.log(v)
|
||||||
this.componentList.splice(this.activeIndex, 1, v)
|
this.componentList.splice(this.activeIndex, 1, v)
|
||||||
},
|
},
|
||||||
get() {
|
get() {
|
||||||
@@ -351,7 +352,7 @@ export default {
|
|||||||
this.form.images = []
|
this.form.images = []
|
||||||
this.isShowAddImg = false
|
this.isShowAddImg = false
|
||||||
},
|
},
|
||||||
|
//置顶图层
|
||||||
setTop() {
|
setTop() {
|
||||||
const maxZindex = Math.max.apply(Math, this.componentList.map(item => {
|
const maxZindex = Math.max.apply(Math, this.componentList.map(item => {
|
||||||
return item.zIndex
|
return item.zIndex
|
||||||
@@ -359,7 +360,7 @@ export default {
|
|||||||
|
|
||||||
this.$set(this.componentList[this.activeIndex], 'zIndex', maxZindex + 1)
|
this.$set(this.componentList[this.activeIndex], 'zIndex', maxZindex + 1)
|
||||||
},
|
},
|
||||||
|
//置底图层
|
||||||
setBottom() {
|
setBottom() {
|
||||||
const item = this.componentList[this.activeIndex]
|
const item = this.componentList[this.activeIndex]
|
||||||
this.componentList.splice(this.activeIndex, 1)
|
this.componentList.splice(this.activeIndex, 1)
|
||||||
@@ -404,6 +405,7 @@ export default {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
//从资产中新建时使用
|
||||||
clone(e) {
|
clone(e) {
|
||||||
this.componentList.push(this.deepClone(e))
|
this.componentList.push(this.deepClone(e))
|
||||||
},
|
},
|
||||||
@@ -456,12 +458,12 @@ export default {
|
|||||||
|
|
||||||
e.preventDefault()
|
e.preventDefault()
|
||||||
},
|
},
|
||||||
|
//复制图层功能
|
||||||
copyLayer() {
|
copyLayer() {
|
||||||
const layer = this.deepClone(this.componentList[this.activeIndex])
|
const layer = this.deepClone(this.componentList[this.activeIndex])
|
||||||
this.componentList.push(layer)
|
this.componentList.push(layer)
|
||||||
},
|
},
|
||||||
|
//删除图层功能
|
||||||
removeLayer() {
|
removeLayer() {
|
||||||
this.componentList.splice(this.activeIndex, 1)
|
this.componentList.splice(this.activeIndex, 1)
|
||||||
this.activeIndex = -1
|
this.activeIndex = -1
|
||||||
|
|||||||
@@ -37,7 +37,7 @@
|
|||||||
<chart-picker v-model="chart.chart"/>
|
<chart-picker v-model="chart.chart"/>
|
||||||
</config-item>
|
</config-item>
|
||||||
<datasource-picker v-model="chart.ds" :instance="instance"
|
<datasource-picker v-model="chart.ds" :instance="instance"
|
||||||
@input="chart={...chart,...chart.ds},$emit('change')"/>
|
@input="chart={...chart,...chart.ds},$emit('change',options)"/>
|
||||||
<config-item label="数据维度" v-if="chart.dataType !== 'staticData'">
|
<config-item label="数据维度" v-if="chart.dataType !== 'staticData'">
|
||||||
<code-editor v-model="chart.djson" lang="json" theme="github" width="100%" height="100"
|
<code-editor v-model="chart.djson" lang="json" theme="github" width="100%" height="100"
|
||||||
placeholder="参照echarts配置数据维度,为一个数组,数组的第一个值为维度值"
|
placeholder="参照echarts配置数据维度,为一个数组,数组的第一个值为维度值"
|
||||||
@@ -54,7 +54,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="layout-config__group" v-else>
|
<div class="layout-config__group" v-else>
|
||||||
<h2>基础设置</h2>
|
<h2>基础设置</h2>
|
||||||
<datasource-picker v-model="options" :instance="instance" @input="$emit('change')"/>
|
<datasource-picker :options="options" :instance="instance" @input="v=>$emit('change',v)"/>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="options.dataType!='staticData'&&options.type=='monitor'&&['cmcc','slw'].includes(options.monitorType)"
|
<div v-if="options.dataType!='staticData'&&options.type=='monitor'&&['cmcc','slw'].includes(options.monitorType)"
|
||||||
class="layout-config__group">
|
class="layout-config__group">
|
||||||
@@ -154,6 +154,7 @@ export default {
|
|||||||
list: [],
|
list: [],
|
||||||
showMapEditor: false,
|
showMapEditor: false,
|
||||||
form: {},
|
form: {},
|
||||||
|
datasource:{}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
|||||||
@@ -1,22 +1,22 @@
|
|||||||
<template>
|
<template>
|
||||||
<section class="datasourcePicker">
|
<section class="datasourcePicker">
|
||||||
<config-item label="数据类型">
|
<config-item label="数据类型">
|
||||||
<ai-select v-model="options.dataType" placeholder="请选择数据类型" :select-list="dataTypes"/>
|
<ai-select v-model="source.dataType" placeholder="请选择数据类型" :select-list="dataTypes"/>
|
||||||
</config-item>
|
</config-item>
|
||||||
<div class="codeEditor" v-if="['htmlData','staticData'].includes(options.dataType)">
|
<div class="codeEditor" v-if="['htmlData','staticData'].includes(source.dataType)">
|
||||||
<ai-dialog-btn :modal="false" dialog-title="编辑器" :customFooter="false"
|
<ai-dialog-btn :modal="false" dialog-title="编辑器" :customFooter="false"
|
||||||
@confirm="changeData" @open="content=contentstr">
|
@confirm="changeData(JSON.parse(content))" @open="content=contentstr">
|
||||||
<code-editor slot="btn" readonly :value="contentstr" :lang="dataLang" theme="github" width="100%" height="250"/>
|
<code-editor slot="btn" readonly :value="contentstr" :lang="dataLang" theme="github" width="100%" height="250"/>
|
||||||
<code-editor v-model="content" :lang="dataLang" theme="github" width="100%" height="440" wrap/>
|
<code-editor v-model="content" :lang="dataLang" theme="github" width="100%" height="440" wrap/>
|
||||||
</ai-dialog-btn>
|
</ai-dialog-btn>
|
||||||
</div>
|
</div>
|
||||||
<config-item v-else-if="options.dataType === 'dynamicData'" label="数据源">
|
<config-item v-else-if="source.dataType === 'dynamicData'" label="数据源">
|
||||||
<ai-select v-model="options.sourceDataId" placeholder="请选择数据源" :instance="instance"
|
<ai-select v-model="source.sourceDataId" placeholder="请选择数据源" :instance="instance"
|
||||||
:prop="{label:'description'}" @change="changeData"
|
:prop="{label:'description'}" @change="changeData"
|
||||||
action="/app/appdiylargescreen/allDatasourceByPage"/>
|
action="/app/appdiylargescreen/allDatasourceByPage"/>
|
||||||
</config-item>
|
</config-item>
|
||||||
<config-item label="接口地址" v-else-if="options.dataType === 'apiData'">
|
<config-item label="接口地址" v-else-if="source.dataType === 'apiData'">
|
||||||
<el-input size="small" v-model="options.api" @change="changeData" placeholder="请输入数据接口URL"/>
|
<el-input size="small" v-model="source.api" @change="changeData" placeholder="请输入数据接口URL"/>
|
||||||
</config-item>
|
</config-item>
|
||||||
</section>
|
</section>
|
||||||
</template>
|
</template>
|
||||||
@@ -45,22 +45,28 @@ export default {
|
|||||||
return {
|
return {
|
||||||
dataTypes: Object.entries(DvCompData.types).map(e => ({id: e[0], label: e[1]})),
|
dataTypes: Object.entries(DvCompData.types).map(e => ({id: e[0], label: e[1]})),
|
||||||
content: "",
|
content: "",
|
||||||
sourceData: []
|
loading: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
contentstr: v => JSON.stringify(v.options.staticData),
|
contentstr: v => JSON.stringify(v.options.staticData),
|
||||||
dataLang: v => v.options.dataType == 'htmlData' ? 'html' : 'json'
|
dataLang: v => v.options.dataType == 'htmlData' ? 'html' : 'json',
|
||||||
|
source: {
|
||||||
|
set(v) {
|
||||||
|
console.log(v)
|
||||||
|
this.$emit("input", v)
|
||||||
|
},
|
||||||
|
get() {
|
||||||
|
return this.options
|
||||||
|
}
|
||||||
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
updateOptions() {
|
changeData(sdata) {
|
||||||
this.$emit("input", this.options)
|
this.source.dataType == 'staticData' ? this.source.staticData = sdata :
|
||||||
},
|
new DvCompData(this.source.dataType, this.source, this.instance).getData().then(data => {
|
||||||
changeData() {
|
this.source[this.source.dataType] = data
|
||||||
new DvCompData(this.options.dataType, this.options, this.instance).getData().then(data => {
|
})
|
||||||
this.options[this.options.dataType] = data
|
|
||||||
this.updateOptions()
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user