forked from github/dataease
Merge pull request #1789 from dataease/pr@dev@refactor_plugin_view
refactor: 完善视图插件
This commit is contained in:
commit
7f2cc0e0da
@ -65,8 +65,12 @@ export default {
|
||||
this.refId = uuid.v1
|
||||
},
|
||||
methods: {
|
||||
chartResize() {
|
||||
/* chartResize() {
|
||||
this.$refs[this.refId] && this.$refs[this.refId].chartResize && this.$refs[this.refId].chartResize()
|
||||
}, */
|
||||
callPluginInner(param) {
|
||||
const { methodName, methodParam } = param
|
||||
this.$refs[this.refId] && this.$refs[this.refId][methodName] && this.$refs[this.refId][methodName](methodParam)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -298,7 +298,9 @@ export default {
|
||||
}
|
||||
// 如果gap有变化刷新
|
||||
if (this.preCanvasPanel && this.preCanvasPanel.gap !== newVal.panel.gap) {
|
||||
this.$refs[this.element.propValue.id].chartResize()
|
||||
this.chart.isPlugin
|
||||
? this.$refs[this.element.propValue.id].callPluginInner({ methodName: 'chartResize' })
|
||||
: this.$refs[this.element.propValue.id].chartResize()
|
||||
}
|
||||
this.preCanvasPanel = deepCopy(newVal.panel)
|
||||
},
|
||||
@ -313,7 +315,9 @@ export default {
|
||||
this.changeIndex++
|
||||
this.chartResize(this.changeIndex)
|
||||
} else {
|
||||
this.$refs[this.element.propValue.id].chartResize()
|
||||
this.chart.isPlugin
|
||||
? this.$refs[this.element.propValue.id].callPluginInner({ methodName: 'chartResize' })
|
||||
: this.$refs[this.element.propValue.id].chartResize()
|
||||
}
|
||||
}
|
||||
},
|
||||
@ -333,7 +337,7 @@ export default {
|
||||
},
|
||||
'chartType': function(newVal, oldVal) {
|
||||
// this.isPlugin = this.plugins.some(plugin => plugin.value === this.chart.type)
|
||||
if (newVal === 'map' && newVal !== oldVal) {
|
||||
if ((newVal === 'map' || newVal === 'buddle-map') && newVal !== oldVal) {
|
||||
this.initAreas()
|
||||
}
|
||||
},
|
||||
@ -360,6 +364,10 @@ export default {
|
||||
bindPluginEvent() {
|
||||
bus.$on('plugin-chart-click', this.chartClick)
|
||||
bus.$on('plugin-jump-click', this.jumpClick)
|
||||
bus.$on('plugin-add-view-track-filter', this.addViewTrackFilter)
|
||||
},
|
||||
addViewTrackFilter(linkageParam) {
|
||||
this.$store.commit('addViewTrackFilter', linkageParam)
|
||||
},
|
||||
// 根据仪表板的缩放比例,修改视图内部参数
|
||||
mergeScale() {
|
||||
@ -477,7 +485,7 @@ export default {
|
||||
|
||||
chartClick(param) {
|
||||
if (this.drillClickDimensionList.length < this.chart.drillFields.length - 1) {
|
||||
this.chart.type === 'map' && this.sendToChildren(param)
|
||||
(this.chart.type === 'map' || this.chart.type === 'buddle-map') && this.sendToChildren(param)
|
||||
this.drillClickDimensionList.push({ dimensionList: param.data.dimensionList })
|
||||
this.getData(this.element.propValue.viewId)
|
||||
} else if (this.chart.drillFields.length > 0) {
|
||||
@ -547,17 +555,22 @@ export default {
|
||||
resetDrill() {
|
||||
const length = this.drillClickDimensionList.length
|
||||
this.drillClickDimensionList = []
|
||||
if (this.chart.type === 'map') {
|
||||
if (this.chart.type === 'map' || this.chart.type === 'buddle-map') {
|
||||
this.backToParent(0, length)
|
||||
const current = this.$refs[this.element.propValue.id]
|
||||
current && current.registerDynamicMap && current.registerDynamicMap(null)
|
||||
|
||||
if (this.chart.isPlugin) {
|
||||
current && current.callPluginInner({ methodName: 'registerDynamicMap', methodParam: null })
|
||||
} else {
|
||||
current && current.registerDynamicMap && current.registerDynamicMap(null)
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
drillJump(index) {
|
||||
const length = this.drillClickDimensionList.length
|
||||
this.drillClickDimensionList = this.drillClickDimensionList.slice(0, index)
|
||||
if (this.chart.type === 'map') {
|
||||
if (this.chart.type === 'map' || this.chart.type === 'buddle-map') {
|
||||
this.backToParent(index, length)
|
||||
}
|
||||
this.getData(this.element.propValue.viewId)
|
||||
@ -576,7 +589,11 @@ export default {
|
||||
|
||||
this.currentAcreaNode = tempNode
|
||||
const current = this.$refs[this.element.propValue.id]
|
||||
current && current.registerDynamicMap && current.registerDynamicMap(this.currentAcreaNode.code)
|
||||
if (this.chart.isPlugin) {
|
||||
current && current.callPluginInner({ methodName: 'registerDynamicMap', methodParam: this.currentAcreaNode.code })
|
||||
} else {
|
||||
current && current.registerDynamicMap && current.registerDynamicMap(this.currentAcreaNode.code)
|
||||
}
|
||||
},
|
||||
|
||||
// 切换下一级地图
|
||||
@ -593,7 +610,11 @@ export default {
|
||||
const nextNode = currentNode.children.find(item => item.name === name)
|
||||
this.currentAcreaNode = nextNode
|
||||
const current = this.$refs[this.element.propValue.id]
|
||||
nextNode && current && current.registerDynamicMap && current.registerDynamicMap(nextNode.code)
|
||||
if (this.chart.isPlugin) {
|
||||
nextNode && current && current.callPluginInner({ methodName: 'registerDynamicMap', methodParam: nextNode.code })
|
||||
} else {
|
||||
nextNode && current && current.registerDynamicMap && current.registerDynamicMap(nextNode.code)
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@ -622,7 +643,12 @@ export default {
|
||||
const areaNode = this.findEntityByname(name, [])
|
||||
if (!areaNode) return
|
||||
const current = this.$refs[this.element.propValue.id]
|
||||
current && current.registerDynamicMap && current.registerDynamicMap(areaNode.code)
|
||||
|
||||
if (this.chart.isPlugin) {
|
||||
current && current.callPluginInner({ methodName: 'registerDynamicMap', methodParam: areaNode.code })
|
||||
} else {
|
||||
current && current.registerDynamicMap && current.registerDynamicMap(areaNode.code)
|
||||
}
|
||||
},
|
||||
// 根据地名获取areaCode
|
||||
findEntityByname(name, array) {
|
||||
@ -650,7 +676,9 @@ export default {
|
||||
if (this.$refs[this.element.propValue.id]) {
|
||||
this.timeMachine = setTimeout(() => {
|
||||
if (index === this.changeIndex) {
|
||||
this.$refs[this.element.propValue.id].chartResize()
|
||||
this.chart.isPlugin
|
||||
? this.$refs[this.element.propValue.id].callPluginInner({ methodName: 'chartResize' })
|
||||
: this.$refs[this.element.propValue.id].chartResize()
|
||||
}
|
||||
this.destroyTimeMachine()
|
||||
}, 50)
|
||||
|
@ -829,6 +829,7 @@
|
||||
<div ref="imageWrapper" style="height: 100%">
|
||||
<plugin-com
|
||||
v-if="httpRequest.status && chart.type && view.isPlugin"
|
||||
ref="dynamicChart"
|
||||
:component-name="chart.type + '-view'"
|
||||
:obj="{chart}"
|
||||
class="chart-class"
|
||||
@ -1221,7 +1222,7 @@ export default {
|
||||
},
|
||||
'chartType': function(newVal, oldVal) {
|
||||
this.view.isPlugin = this.$refs['cu-chart-type'] && this.$refs['cu-chart-type'].currentIsPlugin(newVal)
|
||||
if (newVal === 'map' && newVal !== oldVal) {
|
||||
if ((newVal === 'map' || newVal === 'buddle-map') && newVal !== oldVal) {
|
||||
this.initAreas()
|
||||
}
|
||||
this.$emit('typeChange', newVal)
|
||||
@ -1249,6 +1250,7 @@ export default {
|
||||
bus.$on('show-edit-filter', this.showEditFilter)
|
||||
bus.$on('calc-data', this.calcData)
|
||||
bus.$on('plugins-calc-style', this.calcStyle)
|
||||
bus.$on('plugin-chart-click', this.chartClick)
|
||||
},
|
||||
initTableData(id) {
|
||||
if (id != null) {
|
||||
@ -2096,7 +2098,7 @@ export default {
|
||||
chartClick(param) {
|
||||
if (this.drillClickDimensionList.length < this.view.drillFields.length - 1) {
|
||||
// const isSwitch = (this.chart.type === 'map' && this.sendToChildren(param))
|
||||
if (this.chart.type === 'map') {
|
||||
if (this.chart.type === 'map' || this.chart.type === 'buddle-map') {
|
||||
if (this.sendToChildren(param)) {
|
||||
this.drillClickDimensionList.push({ dimensionList: param.data.dimensionList })
|
||||
// this.getData(this.param.id)
|
||||
@ -2119,16 +2121,22 @@ export default {
|
||||
resetDrill() {
|
||||
const length = this.drillClickDimensionList.length
|
||||
this.drillClickDimensionList = []
|
||||
if (this.chart.type === 'map') {
|
||||
if (this.chart.type === 'map' || this.chart.type === 'buddle-map') {
|
||||
this.backToParent(0, length)
|
||||
this.currentAcreaNode = null
|
||||
this.$refs.dynamicChart && this.$refs.dynamicChart.registerDynamicMap && this.$refs.dynamicChart.registerDynamicMap(null)
|
||||
const current = this.$refs.dynamicChart
|
||||
if (this.view.isPlugin) {
|
||||
current && current.callPluginInner({ methodName: 'registerDynamicMap', methodParam: null })
|
||||
} else {
|
||||
current && current.registerDynamicMap && current.registerDynamicMap(null)
|
||||
}
|
||||
// this.$refs.dynamicChart && this.$refs.dynamicChart.registerDynamicMap && this.$refs.dynamicChart.registerDynamicMap(null)
|
||||
}
|
||||
},
|
||||
drillJump(index) {
|
||||
const length = this.drillClickDimensionList.length
|
||||
this.drillClickDimensionList = this.drillClickDimensionList.slice(0, index)
|
||||
if (this.chart.type === 'map') {
|
||||
if (this.chart.type === 'map' || this.chart.type === 'buddle-map') {
|
||||
this.backToParent(index, length)
|
||||
}
|
||||
|
||||
@ -2148,7 +2156,13 @@ export default {
|
||||
}
|
||||
|
||||
this.currentAcreaNode = tempNode
|
||||
this.$refs.dynamicChart && this.$refs.dynamicChart.registerDynamicMap && this.$refs.dynamicChart.registerDynamicMap(this.currentAcreaNode.code)
|
||||
// this.$refs.dynamicChart && this.$refs.dynamicChart.registerDynamicMap && this.$refs.dynamicChart.registerDynamicMap(this.currentAcreaNode.code)
|
||||
const current = this.$refs.dynamicChart
|
||||
if (this.view.isPlugin) {
|
||||
current && current.callPluginInner({ methodName: 'registerDynamicMap', methodParam: this.currentAcreaNode.code })
|
||||
} else {
|
||||
current && current.registerDynamicMap && current.registerDynamicMap(this.currentAcreaNode.code)
|
||||
}
|
||||
},
|
||||
|
||||
// 切换下一级地图
|
||||
@ -2166,22 +2180,17 @@ export default {
|
||||
if (!nextNode || !nextNode.code) return null
|
||||
// this.view.customAttr.areaCode = nextNode.code
|
||||
this.currentAcreaNode = nextNode
|
||||
this.$refs.dynamicChart && this.$refs.dynamicChart.registerDynamicMap && this.$refs.dynamicChart.registerDynamicMap(nextNode.code)
|
||||
// this.$refs.dynamicChart && this.$refs.dynamicChart.registerDynamicMap && this.$refs.dynamicChart.registerDynamicMap(nextNode.code)
|
||||
const current = this.$refs.dynamicChart
|
||||
if (this.view.isPlugin) {
|
||||
nextNode && current && current.callPluginInner({ methodName: 'registerDynamicMap', methodParam: nextNode.code })
|
||||
} else {
|
||||
nextNode && current && current.registerDynamicMap && current.registerDynamicMap(nextNode.code)
|
||||
}
|
||||
return nextNode
|
||||
}
|
||||
},
|
||||
// 根据地名获取areaCode
|
||||
// findEntityByname(name, array) {
|
||||
// if (array === null || array.length === 0) array = this.places
|
||||
// for (let index = 0; index < array.length; index++) {
|
||||
// const node = array[index]
|
||||
// if (node.name === name) return node
|
||||
// if (node.children && node.children.length > 0) {
|
||||
// const temp = this.findEntityByname(name, node.children)
|
||||
// if (temp) return temp
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
findEntityByCode(code, array) {
|
||||
if (array === null || array.length === 0) array = this.places
|
||||
for (let index = 0; index < array.length; index++) {
|
||||
|
@ -79,8 +79,11 @@ export default {
|
||||
const { eventName, eventParam } = param
|
||||
bus.$emit(eventName, eventParam)
|
||||
},
|
||||
chartResize() {
|
||||
/* chartResize() {
|
||||
this.$refs[this.refId] && this.$refs[this.refId].chartResize && this.$refs[this.refId].chartResize()
|
||||
}, */
|
||||
callPluginInner(param) {
|
||||
this.$refs[this.refId] && this.$refs[this.refId].callPluginInner && this.$refs[this.refId].callPluginInner(param)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user