You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
74 lines
2.0 KiB
74 lines
2.0 KiB
3 years ago
|
<template>
|
||
|
<div>
|
||
|
<el-tag v-for="(item,index) in kpiItemList" :key="index" size="small" class="match-item">
|
||
|
<span class="match-item-name">{{ item.itemName }}
|
||
|
(<span class="match-item-kpi">{{ item.kpiName }}</span>)
|
||
|
</span>
|
||
|
</el-tag>
|
||
|
</div>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
import cloneDeep from 'lodash/cloneDeep'
|
||
|
import { findItem, findPathArray } from '@/utils/tree'
|
||
|
|
||
|
export default {
|
||
|
props: {
|
||
|
type: { type: Number, default: 4 },
|
||
|
value: { type: Array, default: () => [] }
|
||
|
},
|
||
|
data() {
|
||
|
return {
|
||
|
options_kpi: [],
|
||
|
kpiItemList: []
|
||
|
}
|
||
|
},
|
||
|
watch: {
|
||
|
value: {
|
||
|
handler(newVal, oldVal) {
|
||
|
if (this.options_kpi.length === 0) { this.getOptionsKPI() }
|
||
|
const arrayData = cloneDeep(newVal)
|
||
|
const itemList = []
|
||
|
// this.getOptionsKPI()
|
||
|
arrayData.forEach(id => {
|
||
|
const valueList = findPathArray(this.options_kpi, id, 'value', 'children')
|
||
|
const itemParentInfo = findItem(this.options_kpi, valueList[(valueList.length - 2) || 0], 'value', 'children')
|
||
|
const itemInfo = findItem(this.options_kpi, id, 'value', 'children')
|
||
|
|
||
|
console.log(valueList, itemParentInfo, itemInfo, this.options_kpi)
|
||
|
|
||
|
itemList.push({
|
||
|
itemName: itemParentInfo.label,
|
||
|
kpiName: itemInfo.label
|
||
|
})
|
||
|
})
|
||
|
|
||
|
this.kpiItemList = itemList
|
||
|
},
|
||
|
immediate: true
|
||
|
}
|
||
|
},
|
||
|
created() { },
|
||
|
mounted() { },
|
||
|
methods: {
|
||
|
async getOptionsKPI() {
|
||
|
if (this.type === 4 && window.SITE_CONFIG.dict_colExport) {
|
||
|
this.options_kpi = window.SITE_CONFIG.dict_colExport
|
||
|
} else if (this.type === 2 && window.SITE_CONFIG.dict_colChart) {
|
||
|
this.options_kpi = window.SITE_CONFIG.dict_colChart
|
||
|
} else {
|
||
|
const { data: res } = await this.$http.get('/table/dict/optionsColumn', { params: { type: this.type }})
|
||
|
this.options_kpi = res.data
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
}
|
||
|
</script>
|
||
|
|
||
|
<style lang="scss">
|
||
|
.match-item{
|
||
|
margin-right: 5px;
|
||
|
}
|
||
|
</style>
|