import { getTopology, setTopology, dealImg, topologyImg } from '@/components/common/js/common' import bus from '@/libs/bus' import axios from 'axios' import { getMetricTypeValue } from '@/components/common/js/tools' export default { methods: { topoResize (id) { getTopology(id).resize() }, initEdit (id) { getTopology(id).lock(0) getTopology(id).stopAnimate() if (getTopology(id).data().pens) { getTopology(id).data().pens.forEach(item => { this.calcNode(item) }) } getTopology(id).render() getTopology(id).centerView() }, calcNode (node) { // 处理节点数据 node = { id: node.id, ...node.data.params } getTopology(this.meta2dId)._setValue(node) }, getQueryValues (elements, startTime, endTime) { this.meta2dLoading = true return new Promise(resolve => { const step = bus.getStep(startTime, endTime) endTime = parseInt(endTime / 1000) startTime = parseInt(startTime / 1000) const urlPre = '/prom' elements = elements.filter(item => item.state && item.expression) const requests = elements.map((element) => { // query_range let query = `${urlPre}/api/v1/query_range?start=${startTime}&end=${endTime}&step=${step}` query += `&nullType=${'null'}` if (element.filter) { query += `&filter=${element.filter}` } query += `&query=${encodeURIComponent(element.expression)}` return this.$get(query) }) axios.all(requests).then((res) => { const arr = [] res.forEach((request, index) => { arr.push({ type: 'title', name: elements[index].name }) if (request.code === 200 && request.status === 'success') { request.data.result.forEach((r, rindex) => { let legend = '' if (!r.metric) { r.metric = {} } if (r.metric.__name__) { legend += `${r.metric.__name__}{` } const tagKeysArr = Object.keys(r.metric) tagKeysArr.forEach(tagKey => { if (tagKey !== '__name__' && tagKey !== 'legend' && tagKey !== 'values' && tagKey !== '$value') { legend += `${tagKey}="${r.metric[tagKey]}",` } }) if (legend.endsWith(',')) { legend = legend.substr(0, legend.length - 1) } if (r.metric.__name__) { legend += '}' } if (!legend && elements) { legend = elements[index].expression } const obj = { type: 'item', id: rindex + elements[index].name + JSON.stringify(r.metric), name: this.handleLegendAlias(legend, elements[index].legend, r.metric), values: r.values, metric: r.metric || {}, elements: elements[index], parent: elements[index].name } arr.push(obj) }) } }) this.meta2dLoading = false this.$store.dispatch('dispatchSetQueryValues', arr) resolve(arr) }) }) }, handleLegendAlias (legend, aliasExpression, params) { const self = this const myParams = JSON.parse(JSON.stringify(params)) myParams.$labels = JSON.parse(JSON.stringify(params)) myParams.$value = myParams.value if (/\{\{.+\}\}/.test(aliasExpression)) { const labelValue = aliasExpression.replace(/(\{\{.+?\}\})/g, function (i) { const label = i.substr(i.indexOf('{{') + 2, i.indexOf('}}') - i.indexOf('{{') - 2) if (!legend) { return label } let value = null if (params && self.$loadsh.get(myParams, label)) { value = self.$loadsh.get(myParams, label) } if (label) { const reg = new RegExp(label + '=".+?"', 'g') if (reg.test(legend)) { const ans = legend.match(reg) let find = '' ans.forEach(item => { const index = legend.indexOf(item) if (legend[index - 1] !== '_') { find = item } }) value = find.substr(find.indexOf('"') + 1, find.lastIndexOf('"') - find.indexOf('"') - 1) } } return value || '' }) return labelValue } else { if (!aliasExpression) { return legend // let result =legend.substr(legend.indexOf('"') + 1,legend.lastIndexOf('"') - legend.indexOf('"') - 1); // return result } return aliasExpression } }, clacTopoData (data, queryValues) { // 主要处理 属性为原始属性 处理动画属性对原始属性的影响 return new Promise(resolve => { // 处理加载数据 if (!data.pens) { data.pens = [] } data.pens.forEach(pen => { if (pen.isNz) { if (pen.data.legend) { const findItem = queryValues.find(query => query.name === pen.data.legend && query.parent === pen.data.parent) console.log(findItem) if (findItem) { pen.data.value = getMetricTypeValue(findItem.values, this.params.statistic || 'last') this.selectMapping(pen) } } } else { // 处理 le5le的数据 } }) resolve(data) }) }, selectMapping (pen) { let mapping = '' const show = pen.data.enable.valueMapping const valueMapping = pen.data.valueMapping const value = pen.data.value if (show && valueMapping) { valueMapping.forEach(item => { if (item.type === 'value') { if (value == item.value) { mapping = item } } if (item.type === 'range') { if (value >= item.from && value < item.to) { mapping = item } } if (item.type === 'regx') { const reg = new RegExp(item.regx) if (reg.test(value)) { mapping = item } } }) if (mapping) { this.drawPen(pen, mapping) } } }, drawPen (pen, mapping) { if (!pen.type) { pen.background = mapping.color.bac pen.color = mapping.color.border pen.textColor = mapping.color.text } else { pen.animateColor = mapping.color.bac pen.borderColor = mapping.color.border pen.color = mapping.color.text if (pen.lineAnimateType) { pen.autoPlay = true } } } } }