Merge pull request #1789 from dataease/pr@dev@refactor_plugin_view

refactor: 完善视图插件
This commit is contained in:
fit2cloud-chenyw 2022-02-18 17:45:15 +08:00 committed by GitHub
commit 7f2cc0e0da
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 76 additions and 32 deletions

View File

@ -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)
}
}
}

View File

@ -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)

View File

@ -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++) {

View File

@ -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)
}
}
}