fix:修改chart模板 无法新增修改 以及报错的问题

This commit is contained in:
zhangyu
2021-05-17 20:31:32 +08:00
parent d8dcc69179
commit 606244b89e
14 changed files with 124 additions and 78 deletions

View File

@@ -24,7 +24,7 @@
<el-dropdown-menu style="display: none"></el-dropdown-menu>
<span class="el-dropdown-link chart-title">
<span class="chart-title-text">{{chartData.name}}</span>
<span class="chart-title-icon" v-if="from !== 'chartTemp'" :class="{'visible':caretShow,'hidden':!caretShow}">
<span class="chart-title-icon" :class="{'visible':caretShow,'hidden':!caretShow}">
<span v-if="chartData.remark">
<el-tooltip :content="chartData.remark" placement="top" effect="light">
<i class="nz-icon nz-icon-info-normal"></i>
@@ -33,7 +33,7 @@
<span v-has="'panel_chart_edit'" :title="$t('dashboard.refresh')" class="" @click="refreshChart">
<i class="nz-icon nz-icon-replay"></i>
</span>
<span @click="showAllScreen" class="" :title="$t('dashboard.screen')">
<span @click="showAllScreen" v-if="from !== 'chartTemp'" class="" :title="$t('dashboard.screen')">
<i class="nz-icon nz-icon-maxview"></i>
</span>
<span><i class="el-icon-more" @click.stop="dropdownMenuShow=!dropdownMenuShow"></i></span>

View File

@@ -24,7 +24,7 @@
<el-dropdown-menu style="display: none"></el-dropdown-menu>
<span class="el-dropdown-link chart-title">
<span class="chart-title-text">{{chartData.name}}</span>
<span class="chart-title-icon" v-if="from !== 'chartTemp'" :class="{'visible':caretShow,'hidden':!caretShow}">
<span class="chart-title-icon" :class="{'visible':caretShow,'hidden':!caretShow}">
<span v-if="chartData.remark">
<el-tooltip :content="chartData.remark" placement="top" effect="light">
<i class="nz-icon nz-icon-info-normal"></i>
@@ -33,7 +33,7 @@
<span v-has="'panel_chart_edit'" :title="$t('dashboard.refresh')" class="" @click="refreshChart">
<i class="nz-icon nz-icon-replay"></i>
</span>
<span @click="showAllScreen" class="" :title="$t('dashboard.screen')">
<span @click="showAllScreen" v-if="from !== 'chartTemp'" class="" :title="$t('dashboard.screen')">
<i class="nz-icon nz-icon-maxview"></i>
</span>
<span><i class="el-icon-more" @click.stop="dropdownMenuShow=!dropdownMenuShow"></i></span>

View File

@@ -18,13 +18,13 @@
{{chartData.name}}
<span v-show="!showList" class="collapse-content">({{chartData.children.length}} charts)</span>
</span>
<span class="chart-title-icon" v-if="from !== 'chartTemp'" :class="{'visible':caretShow,'hidden':!caretShow}">
<span class="chart-title-icon" :class="{'visible':caretShow,'hidden':!caretShow}">
<span v-if="chartData.remark">
<el-tooltip :content="chartData.remark" placement="top" effect="light">
<i class="nz-icon nz-icon-info-normal"></i>
</el-tooltip>
</span>
<span v-has="'panel_chart_edit'" :title="$t('dashboard.refresh')" class="" @click="addGroupItemChart">
<span v-has="'panel_chart_edit'" :title="$t('dashboard.panel.createChartTitle')" class="" @click="addGroupItemChart">
<i class="nz-icon nz-icon-plus"></i>
</span>
<!-- <span @click="showAllScreen" class="" :title="$t('dashboard.screen')">-->
@@ -33,16 +33,16 @@
<span><i class="el-icon-more" @click.stop="dropdownMenuShow=!dropdownMenuShow"></i></span>
</span>
<span class="chart-title-icon" v-else :class="{'visible':caretShow,'hidden':!caretShow}">
<span v-has="'panel_chart_edit'" :title="$t('dashboard.refresh')" class="" @click="addGroupItemChart">
<i class="nz-icon nz-icon-plus"></i>
</span>
</span>
<!-- <span class="chart-title-icon" :class="{'visible':caretShow,'hidden':!caretShow}">-->
<!-- <span v-has="'panel_chart_edit'" :title="$t('dashboard.panel.createChartTitle')" class="" @click="addGroupItemChart">-->
<!-- <i class="nz-icon nz-icon-plus"></i>-->
<!-- </span>-->
<!-- </span>-->
</span>
<ul slot="dropdown" v-show="dropdownMenuShow" :id="'dropdownUl'+chartIndex" class="el-dropdown-menu nz-chart-dropdown" style="" >
<li @click="editChart" class="el-dropdown-menu__item">
<i class="nz-icon nz-icon-edit" style="font-size: 16px;"></i><span>{{$t('dashboard.edit')}}</span></li>
<li v-has="'panel_chart_delete'" class="el-dropdown-menu__item" @click="removeChart">
<li v-has="'panel_chart_delete'" v-if="from !== 'chartTemp'" class="el-dropdown-menu__item" @click="removeChart">
<i class="nz-icon nz-icon-delete" style="font-size: 16px;"></i>{{$t('dashboard.delete')}}</li>
<!-- <li @click="duplicate" class="el-dropdown-menu__item" v-has="`${from}_chart_duplicate`">-->
<!-- <i class="el-icon-copy-document" style="font-size: 16px;"></i>{{$t('dashboard.duplicate')}}</li>-->

View File

@@ -677,6 +677,7 @@ export default {
// if(chartInfo.type === 'table'&&chartInfo.param&&chartInfo.param.last == 1){
// return this.$get('/prom/api/v1/query_range?query=' + query + "&start=" + this.$stringTimeParseToUnix(endTime) + "&end=" + this.$stringTimeParseToUnix(endTime) + '&step=' + step);
// }
if (this.from === fromRoute.chartTemp) {
return new Promise(resolve => resolve(chartTempData))
}
@@ -684,6 +685,7 @@ export default {
})
// 一个图表的所有element单独获取数据
axios.all(axiosArr).then((res) => {
if (res.length > 0) {
const series = []
let singleStatRlt = ''
@@ -901,7 +903,6 @@ export default {
}
}
})
if (this.$refs['editChart' + chartItem.id] && this.$refs['editChart' + chartItem.id].length > 0) {
if (chartInfo.type === 'pie') {
series.push(pieSeries)

View File

@@ -24,7 +24,7 @@
<el-dropdown-menu style="display: none"></el-dropdown-menu>
<span class="el-dropdown-link chart-title">
<span class="chart-title-text">{{chartData.name}}</span>
<span class="chart-title-icon" v-if="from !== 'chartTemp'" :class="{'visible':caretShow,'hidden':!caretShow}">
<span class="chart-title-icon" :class="{'visible':caretShow,'hidden':!caretShow}">
<span v-if="chartData.remark">
<el-tooltip :content="chartData.remark" placement="top" effect="light">
<i class="nz-icon nz-icon-info-normal"></i>
@@ -33,7 +33,7 @@
<span v-has="'panel_chart_edit'" :title="$t('dashboard.refresh')" class="" @click="refreshChart">
<i class="nz-icon nz-icon-replay"></i>
</span>
<span @click="showAllScreen" class="" :title="$t('dashboard.screen')">
<span @click="showAllScreen" v-if="from !== 'chartTemp'" class="" :title="$t('dashboard.screen')">
<i class="nz-icon nz-icon-maxview"></i>
</span>
<span><i class="el-icon-more" @click.stop="dropdownMenuShow=!dropdownMenuShow"></i></span>

View File

@@ -24,7 +24,7 @@
<el-dropdown-menu style="display: none"></el-dropdown-menu>
<span class="el-dropdown-link chart-title">
<span class="chart-title-text">{{chartData.name}}</span>
<span class="chart-title-icon" v-if="from !== 'chartTemp'" :class="{'visible':caretShow,'hidden':!caretShow}">
<span class="chart-title-icon" :class="{'visible':caretShow,'hidden':!caretShow}">
<span v-if="chartData.remark">
<el-tooltip :content="chartData.remark" placement="top" effect="light">
<i class="nz-icon nz-icon-info-normal"></i>
@@ -33,7 +33,7 @@
<span v-has="'panel_chart_edit'" :title="$t('dashboard.refresh')" class="" @click="refreshChart">
<i class="nz-icon nz-icon-replay"></i>
</span>
<span @click="showAllScreen" class="" :title="$t('dashboard.screen')">
<span @click="showAllScreen" v-if="from !== 'chartTemp'" class="" :title="$t('dashboard.screen')">
<i class="nz-icon nz-icon-maxview"></i>
</span>
<span><i class="el-icon-more" @click.stop="dropdownMenuShow=!dropdownMenuShow"></i></span>

View File

@@ -25,7 +25,7 @@
<el-dropdown-menu style="display: none"></el-dropdown-menu>
<span class="el-dropdown-link chart-title">
<span class="chart-title-text">{{chartData.name}}</span>
<span class="chart-title-icon" v-if="from !== 'chartTemp'" :class="{'visible':caretShow,'hidden':!caretShow}">
<span class="chart-title-icon" :class="{'visible':caretShow,'hidden':!caretShow}">
<span v-if="chartData.remark">
<el-tooltip :content="chartData.remark" placement="top" effect="light">
<i class="nz-icon nz-icon-info-normal"></i>
@@ -34,7 +34,7 @@
<span v-has="'panel_chart_edit'" :title="$t('dashboard.refresh')" class="" @click="refreshChart">
<i class="nz-icon nz-icon-replay"></i>
</span>
<span @click="showAllScreen" class="" :title="$t('dashboard.screen')">
<span @click="showAllScreen" v-if="from !== 'chartTemp'" class="" :title="$t('dashboard.screen')">
<i class="nz-icon nz-icon-maxview"></i>
</span>
<span><i class="el-icon-more" @click.stop="dropdownMenuShow=!dropdownMenuShow"></i></span>

View File

@@ -12,7 +12,7 @@
<el-dropdown-menu style="display: none"></el-dropdown-menu>
<span class="el-dropdown-link chart-title">
<span class="chart-title-text">{{chartData.name}}</span>
<span class="chart-title-icon" v-if="from !== 'chartTemp'" :class="{'visible':caretShow,'hidden':!caretShow}">
<span class="chart-title-icon" :class="{'visible':caretShow,'hidden':!caretShow}">
<span v-if="chartData.remark">
<el-tooltip :content="chartData.remark" placement="top" effect="light">
<i class="nz-icon nz-icon-info-normal"></i>
@@ -21,7 +21,7 @@
<span v-has="'panel_chart_edit'" :title="$t('dashboard.refresh')" class="" @click="refreshChart">
<i class="nz-icon nz-icon-replay"></i>
</span>
<span @click="showAllScreen" class="" :title="$t('dashboard.screen')">
<span @click="showAllScreen" v-if="from !== 'chartTemp'" class="" :title="$t('dashboard.screen')">
<i class="nz-icon nz-icon-maxview"></i>
</span>
<span><i class="el-icon-more" @click.stop="dropdownMenuShow=!dropdownMenuShow"></i></span>

View File

@@ -38,7 +38,7 @@
<el-dropdown-menu style="display: none"></el-dropdown-menu>
<span class="el-dropdown-link chart-title">
<span class="chart-title-text">{{chartData.name}}</span>
<span class="chart-title-icon" v-if="from !== 'chartTemp'" :class="{'visible':caretShow,'hidden':!caretShow}">
<span class="chart-title-icon" :class="{'visible':caretShow,'hidden':!caretShow}">
<span v-if="chartData.remark">
<el-tooltip :content="chartData.remark" placement="top" effect="light">
<i class="nz-icon nz-icon-info-normal"></i>
@@ -47,7 +47,7 @@
<span v-has="'panel_chart_edit'" :title="$t('dashboard.refresh')" class="" @click="refreshChart">
<i class="nz-icon nz-icon-replay"></i>
</span>
<span @click="showAllScreen" class="" :title="$t('dashboard.screen')">
<span @click="showAllScreen" v-if="from !== 'chartTemp'" class="" :title="$t('dashboard.screen')">
<i class="nz-icon nz-icon-maxview"></i>
</span>
<span><i class="el-icon-more" @click.stop="dropdownMenuShow=!dropdownMenuShow"></i></span>

View File

@@ -12,7 +12,7 @@
<el-dropdown-menu style="display: none"></el-dropdown-menu>
<span class="el-dropdown-link chart-title">
<span class="chart-title-text">{{chartData.name}}</span>
<span class="chart-title-icon" v-if="from !== 'chartTemp'" :class="{'visible':caretShow,'hidden':!caretShow}">
<span class="chart-title-icon" :class="{'visible':caretShow,'hidden':!caretShow}">
<span v-if="chartData.remark">
<el-tooltip :content="chartData.remark" placement="top" effect="light">
<i class="nz-icon nz-icon-info-normal"></i>
@@ -21,7 +21,7 @@
<span v-has="'panel_chart_edit'" :title="$t('dashboard.refresh')" class="" @click="refreshChart">
<i class="nz-icon nz-icon-replay"></i>
</span>
<span @click="showAllScreen" class="" :title="$t('dashboard.screen')">
<span @click="showAllScreen" v-if="from !== 'chartTemp'" class="" :title="$t('dashboard.screen')">
<i class="nz-icon nz-icon-maxview"></i>
</span>
<span><i class="el-icon-more" @click.stop="dropdownMenuShow=!dropdownMenuShow"></i></span>

View File

@@ -9,14 +9,15 @@
:showPagination="false"
>
<template v-slot:title><span :title="obj.name">{{obj.name}}</span></template>
<template v-if="from === fromRoute.asset" v-slot:top-tool-right>
<template v-slot:top-tool-right>
<span v-if="from === fromRoute.asset">
<div class="top-tool-search margin-r-20">
<el-input id="queryPanel" ref="queryPanel" v-model="filter.searchName" class="query-input-inactive" clearable size="small" @blur="blurInput" @clear="clearInput" @focus="focusInput">
<i slot="suffix" class="el-input__icon nz-icon nz-icon-search" style="float: right" @click="focusInput"></i>
</el-input>
</div>
<pick-time ref="pickTime" v-model="searchTime" :refresh-data-func="dateChange" :use-chart-unit="false"></pick-time>
<!-- <export-excel
<!-- <export-excel
id="asset-list"
:params="searchLabel"
:permissions="{import: 'panel_chart_add', export: 'panel_view'}"
@@ -49,6 +50,11 @@
@panelLockChange="panelLockChange"
>
</top-tool-more-options>
</span>
<span v-else> <button @click="panelLock=!panelLock" id="panel-lock" :title='panelLock ? $t("overall.locked") : $t("overall.unlocked")' class="top-tool-btn margin-r-10"
type="button">
<i :class="{'nz-icon nz-icon-lock':panelLock,'nz-icon nz-icon-unlock':!panelLock}"></i>
</button></span>
</template>
<template v-slot>
<div class="panel">
@@ -57,7 +63,8 @@
<div ref="dashboardScrollbar" style="height: 100%; overflow: auto;">
<div class="box-content">
<chart-list :additional-info="obj" :detail="detail" :draggable="draggable" :from="from" :is-model="from == $CONSTANTS.fromRoute.model" @on-edit-chart="editChart"
@on-refresh-time="refreshTime" @on-remove-chart="delChart" ref="chartList" :panel-lock="panelLock" :panel-data-list="panelDataList"></chart-list>
@on-refresh-time="refreshTime" @on-remove-chart="delChart" ref="chartList" :panel-lock="panelLock" :panel-data-list="panelDataList"
@on-add-group-item-chart="addGroupItem"></chart-list>
</div>
</div>
</div>
@@ -193,6 +200,20 @@ export default {
this.rightBox.show = false
if (refresh) {
this.refresh()
if (this.from === fromRoute.chartTemp) {
this.$get('/visual/panel/chart', { ids: this.obj.id, groupId: 0 }).then(res => {
res.data.list.forEach(item => {
if (!item.children) {
item.children = []
}
})
this.panelDataList = res.data.list
if (this.panelDataList.length > 0) {
this.showPanel.id = this.filter.panelId = 0
this.getData(this.filter)
}
})
}
}
},
// 编辑图表信息,打开编辑弹窗
@@ -209,7 +230,28 @@ export default {
confirmButtonText: this.$t('tip.yes'),
cancelButtonText: this.$t('tip.no'),
type: 'warning'
}).then(() => {})
}).then(() => {
this.$delete('visual/panel/chart?ids=' + data.id).then(response => {
if (response.code === 200) {
this.$message({
duration: 2000,
type: 'success',
message: this.$t('tip.deleteSuccess')
})
this.closeRightBox(true)
} else {
this.$message.error(response.msg)
}
})
})
},
addGroupItem (groupId) {
this.chart = this.newChart()
this.chart.groupId = groupId
this.chart.panelId = this.showPanel.id
this.chart.panelName = this.showPanel.name
this.chart.isGroup = true
this.rightBox.show = true
},
delChartOk () {
this.getData(this.filter)
@@ -461,7 +503,7 @@ export default {
setTimeout(() => {
if (n && n.id) {
this.getTableData(n.id)
if ( this.from === fromRoute.asset) {
if (this.from === fromRoute.asset) {
this.searchLabel.assetIds = n.id
}
}

View File

@@ -759,6 +759,7 @@ export default {
}
this.$get('monitor/project/topo', { projectId: this.obj.id }).then(res => {
let data = res.data.topo
// data = JSON.parse(localStorage.getItem('topoData'))
if (!res.data.topo || !data.pens) {
data = {
bkColor: '#FFFFFF',
@@ -802,6 +803,7 @@ export default {
}
data.pens.forEach(item => {
if (item.type === 0 && item.data.imageId) {
console.log(item,item.data.imageId,this.iconArray.find(item1 => item1.id == 44))
item.image = this.iconArray.find(item1 => item1.id == item.data.imageId).image
}
if (item.type === 0) {
@@ -1791,6 +1793,7 @@ export default {
// 保存
saveTopology () {
const topologyData = getTopology(this.topologyIndex).pureData()
console.log(JSON.stringify(topologyData))
let flag = true
const arr = []
this.notModuleIDArr = []

View File

@@ -61,7 +61,7 @@
</template>
</nzDataList>
<transition name="right-box">
<chart-box :chart="object" :show-panel="showPanel" :from="'temp'" @close="closeChartBox" @delete-chart="delChart" @on-create-success="createSuccess" @on-delete-success="delChartOk" @reload="panelReload" @reloadOnlyPanel="panelReloadOnlyPanel" ref="addChartModal" v-if="rightBox.show"></chart-box>
<chart-box :chart="object" :show-panel="showPanel" :from="'chartTemp'" @close="closeChartBox" @delete-chart="delChart" @on-create-success="createSuccess" @on-delete-success="delChartOk" @reload="panelReload" @reloadOnlyPanel="panelReloadOnlyPanel" ref="addChartModal" v-if="rightBox.show"></chart-box>
</transition>
</div>
</template>

View File

@@ -145,13 +145,13 @@
</style>
<template>
<div v-clickoutside="{obj:editChart, func:clickOutside}" :class="boxClass" class="right-box right-box-chart">
<transition v-if="from !== 'temp'" name="right-box">
<transition v-if="from !== 'chartTemp'" name="right-box">
<panel-box v-if="!showPanel.type" ref="panelBox2" :panel="panel" @reload="panelReload"></panel-box>
</transition>
<div class="right-box__header">
<div class="header__title" v-if="from !== 'temp'">{{editChart.id ? $t("dashboard.panel.editChartTitle") : $t("dashboard.panel.createChartTitle")}}</div>
<div class="header__title" v-if="from === 'temp'">{{editChart.id ? $t("dashboard.panel.editChartTempTitle") : $t("dashboard.panel.createChartTempTitle")}}</div>
<div class="header__title" v-if="from !== 'chartTemp'">{{editChart.id ? $t("dashboard.panel.editChartTitle") : $t("dashboard.panel.createChartTitle")}}</div>
<div class="header__title" v-if="from === 'chartTemp'">{{editChart.id ? $t("dashboard.panel.editChartTempTitle") : $t("dashboard.panel.createChartTempTitle")}}</div>
<div class="header__operation">
<span v-cancel="{obj: editChart, func: clickOutside}"><i class="nz-icon nz-icon-close"></i></span>
</div>
@@ -163,7 +163,7 @@
<el-form-item :label='$t("dashboard.panel.chartForm.chartName")' prop="title">
<el-input maxlength="64" show-word-limit size="small" v-model="editChart.name" id="chart-box-title"></el-input>
</el-form-item>
<el-form-item :label="$t('dashboard.panel.title')" prop="panelName" v-if="showPanel.type != 'project' && showPanel.type != 'asset' && showPanel.type != 'model' && from!=='temp'">
<el-form-item :label="$t('dashboard.panel.title')" prop="panelName" v-if="showPanel.type != 'project' && showPanel.type != 'asset' && showPanel.type != 'model' && from!=='chartTemp'">
<select-panel :filter-panel="filterPanel" :panel-lock="true" :disabled="showPanel.type==='dashboard'" :panelData="panelData" :placement="'bottom-start'" @selectPanel="selectPanel" ref="selectPanel">
<template v-slot:header>
<div class="panel-select-header">
@@ -197,7 +197,7 @@
</div>
<!-- varType -->
<el-form-item :label="$t('dashboard.panel.chartForm.varType')" v-if="from === 'temp'">
<el-form-item :label="$t('dashboard.panel.chartForm.varType')" v-if="from === 'chartTemp'">
<el-select id="chart-box-group" v-model="editChart.varType" :disabled="!!editChart.id" class="right-box__select" popper-class="right-box-select-dropdown prevent-clickoutside" clearable placeholder="" size="small" value-key="chartType">
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in varTypeArr">
<span class="panel-dropdown-label-txt" >{{item.name}}</span>
@@ -417,7 +417,7 @@
<button v-if="showPanel.type && showPanel.type == 'model'" id="chart-box-Sync" v-has="'panel_chart_edit'" class="footer__btn" @click="SyncSave">
<span>{{$t('overall.SyncSave')}}</span>
</button>
<button v-else-if="from!=='temp'" id="chart-box-preview" class="footer__btn" @click="preview" >
<button v-else-if="from!=='chartTemp'" id="chart-box-preview" class="footer__btn" @click="preview" >
<span>{{$t('overall.preview')}}</span>
</button>
<button id="chart-box-save" v-has="'panel_chart_add'" :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" class="footer__btn" @click="confirmAdd" >
@@ -858,8 +858,8 @@ export default {
}); */
// panelPromise.then(()=>{
if (this.panelId || this.from === 'temp') {
if (this.from === 'temp') {
if (this.panelId || this.from === 'chartTemp') {
if (this.from === 'chartTemp') {
this.panelId = 0
}
const chartParams = params || this.editChart
@@ -895,7 +895,7 @@ export default {
// 更新图表
updateCharts (params) {
let panelId = this.panelId ? this.panelId : this.chart.panelId
if (this.from === 'temp') {
if (this.from === 'chartTemp') {
panelId = 0
}
const chartParams = params || this.editChart
@@ -907,7 +907,7 @@ export default {
delete chartParams.children
this.$put('visual/panel/chart', chartParams).then(response2 => {
if (response2.code === 200) {
this.esc()
this.esc(true)
this.$message({ duration: 1000, type: 'success', message: this.$t('tip.saveSuccess') })
// this.$refs.chartForm.resetFields();//清空表单
this.$emit('on-create-success', 'update', response2.data, chartParams)
@@ -1730,7 +1730,7 @@ export default {
n.param && !n.param.legendValue && this.$set(this.editChart.param, 'legendValue', { min: 'off', max: 'off', avg: 'off', last: 'off', total: 'off' })
}
this.$set(this.editChart, 'panelName', this.showPanel.name)
if (this.showPanel.id || this.from === 'temp') {
if (this.showPanel.id || this.from === 'chartTemp') {
this.panelId = this.showPanel.id
}
this.$get('visual/panel/chart?panelId=' + this.panelId + '&pageSize=-1').then(response => {