gfwleak/nezha-nezha-fronted
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat： panel页面 的删除 复制功能

Browse Source
This commit is contained in:
zhangyu
2021-12-08 16:20:03 +08:00
parent c4f7e2ede7
commit f587dd2ed1
6 changed files with 111 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
nezha-fronted/src/components/chart/chartHeader.vue
View File

@@ -65,14 +65,23 @@ export default {
this.$emit('refresh')
},
editChart () {
this.$emit('edit-chart', this.chartInfo)
this.$store.dispatch('dispatchEditChart', this.chartInfo)
// this.$emit('edit-chart', this.chartInfo)
this.$store.dispatch('dispatchEditChart', {
chart: this.chartInfo,
type: 'edit'
})
},
removeChart () {
this.$emit('delChart', this.chartInfo)
this.$store.dispatch('dispatchDelChart', {
chart: this.chartInfo,
type: 'delete'
})
},
duplicate () {
this.$store.dispatch('dispatchEditChart', {
chart: this.chartInfo,
type: 'duplicate'
})
},
clickos () {
this.dropdownMenuShow = false

6
nezha-fronted/src/components/common/login.vue
View File

@@ -149,9 +149,9 @@ export default {
methods: {
...mapActions(['loginSuccess']),
login () {
if (this.loading || !this.license.valid || !this.license.token) {
return
}
// if (this.loading || !this.license.valid || !this.license.token) {
// return
// }
if (this.validateLogin() && (this.$route.path == '/' || this.$route.path == '/login')) {
this.loading = true
this.$post('/sys/login', this.loginData).then(res => {

4
nezha-fronted/src/components/common/rightBox/chart/chartRightBox.vue
View File

@@ -171,8 +171,8 @@ export default {
this.$put('visual/panel/chart', params).then(response => {
if (response.code === 200) {
this.$message({ duration: 1000, type: 'success', message: this.$t('tip.saveSuccess') })
this.esc(true)
this.$emit('on-create-success')
this.esc(true)
} else {
this.$message.error(response.msg)
}
@@ -181,8 +181,8 @@ export default {
this.$post('visual/panel/chart', params).then(response => {
if (response.code === 200) {
this.$message({ duration: 1000, type: 'success', message: this.$t('tip.saveSuccess') })
this.esc(true)
this.$emit('on-create-success')
this.esc(true)
} else {
this.$message.error(response.msg)
}

2
nezha-fronted/src/components/common/rightBox/chart/systemChartConfig.vue
View File

@@ -461,7 +461,7 @@ export default {
this.groupList = system.group
this.selectList = system.select
}
this.$refs.chartForm.clearValidate()
this.$refs.chartForm && this.$refs.chartForm.clearValidate()
}
} else {
this.$message.error(res.msg)

85
nezha-fronted/src/components/page/dashboard/panel.vue
View File

@@ -43,7 +43,7 @@
<pick-time id="panel" ref="pickTime" v-model="searchTime" :refresh-data-func="dateChange" :use-chart-unit="false" class="margin-r-10"></pick-time>
<button id="panel-add-chart" v-has="'panel_chart_add'" :title="$t('overall.createChart')" class="top-tool-btn margin-r-10"
type="button" @click="addChart">
type="button" @click="addChartBefore">
<i class="nz-icon-create-square nz-icon"></i>
</button>
@@ -120,7 +120,7 @@
<!-- @on-delete-success="delChartOk"-->
<!-- ></chart-box>-->
<chart-right-box
v-if="rightBox.chart.show"
v-if="chartRightBoxShow"
ref="addChartModal"
:chart="chart"
:from="fromRoute.panel"
@@ -278,6 +278,14 @@ export default {
chartTempBox,
chartRightBox
},
computed: {
chartRightBoxShow () {
return this.$store.getters.getShowRightBox
},
delChartFlag () {
return this.$store.getters.getDelChart
}
},
methods: {
// 刷新
Refresh () {
@@ -355,7 +363,6 @@ export default {
this.chart = this.newChart()
this.chart.panelId = this.showPanel.id
this.chart.panelName = this.showPanel.name
this.rightBox.chart.show = true
},
addChartByTemp () {
this.chart = JSON.parse(JSON.stringify(this.blankChartTemp))
@@ -380,7 +387,6 @@ export default {
this.chart.panelId = this.showPanel.id
this.chart.panelName = this.showPanel.name
this.chart.isGroup = true
this.rightBox.chart.show = true
},
newChart () {
return JSON.parse(JSON.stringify(this.blankChart))
@@ -391,7 +397,7 @@ export default {
this.chart = JSON.parse(JSON.stringify(data))
this.chart.panelId = this.showPanel.id
this.chart.panelName = this.showPanel.name
this.rightBox.chart.show = true
this.chart.id = ''
} else {
this.$get('visual/panel/chart/' + data.id).then(res => {
if (res.code === 200) {
@@ -403,7 +409,6 @@ export default {
if (!this.chart.groupId || this.chart.groupId == -1) {
this.chart.groupId = ''
}
this.rightBox.chart.show = true
} else {
this.$message.error(res.msg)
}
@@ -411,7 +416,8 @@ export default {
}
},
closeChartBox (refresh) {
this.rightBox.chart.show = false
// this.rightBox.chart.show = false
this.$store.dispatch('clearPanel')
/* if (refresh) {
this.getData(this.filter)
} */
@@ -442,26 +448,7 @@ export default {
type: 'success',
message: this.$t('tip.deleteSuccess')
})
this.rightBox.chart.show = false
const chartList = this.$refs.chartList.dataList
for (let i = 0; i < chartList.length; i++) {
/* if (chartList[i].id === data.id) {
chartList.splice(i, 1)
}
if (chartList[i].type === 'group') {
chartList[i].children = chartList[i].children.filter((item) => item.id !== data.id)
} */
// if(data.next != -1){
// if(chartList[i].id === data.next){
// nextChart = chartList[i]
// }
// }
// if(data.prev != 0){
// if(chartList[i].id === data.prev){
// prevChart = chartList[i]
// }
// }
}
this.getData(this.filter)
// this.$refs.chartList.loadChartData(this.scrollbarWrap.scrollTop)
// if(nextChart&&prevChart){ //删除图表为中间位置
// prevChart.next = nextChart.id;
@@ -736,6 +723,32 @@ export default {
},
load () {
},
addChartBefore () {
this.$store.dispatch('dispatchEditChart', {
chart: '',
type: 'add'
})
},
disposeChart () {
const chartInfo = this.$store.getters.getChart
const groupId = this.$store.getters.getGroupId
const type = this.$store.getters.getType
if (type === 'add') {
this.addChart()
}
if (type === 'edit') {
this.editChart(chartInfo)
}
if (type === 'addGroupItem') {
this.addGroupItem(groupId)
}
if (type === 'delete') {
this.delChart(chartInfo)
}
if (type === 'duplicate') {
this.editChart(chartInfo, true)
}
}
},
created () {
@@ -761,6 +774,24 @@ export default {
localStorage.setItem('panelTime', JSON.stringify(n))
}
},
chartRightBoxShow: {
immediate: false,
deep: true,
handler (n) {
if (n) {
this.disposeChart()
}
}
},
delChartFlag: {
immediate: false,
deep: true,
handler (n) {
if (n) {
this.disposeChart()
}
}
},
$route: {
immediate: true,
handler () {

46
nezha-fronted/src/store/panel.js
View File

@@ -2,7 +2,9 @@ const panel = {
state: {
showRightBox: false,
chart: '',
delChart: false
delChart: false,
groupId: '',
type: ''
},
mutations: {
setShowRightBox (state, flag) {
@@ -12,12 +14,20 @@ const panel = {
state.chart = chart
},
setDelChart (state, flag) {
state.chart = flag
state.delChart = flag
},
clean (state) {
setType (state, type) {
state.type = type
},
setGroupId (state, id) {
state.groupId = id
},
cleanPanel (state) {
state.showRightBox = false
state.chart = ''
state.delChart = false
state.groupId = ''
state.type = ''
}
},
getters: {
@@ -27,23 +37,35 @@ const panel = {
getChart (state) {
return state.chart
},
getType (state) {
return state.type
},
getGroupId (state) {
return state.groupId
},
getDelChart (state) {
return state.delChart
}
},
actions: {
dispatchShowRightBox (flag) {
this.store.commit('setShowRightBox', flag)
dispatchShowRightBox (store,flag) {
store.commit('setShowRightBox', flag)
},
dispatchChart (chart) {
this.store.commit('setShowRightBox', chart)
dispatchChart (store, chart) {
store.commit('setShowRightBox', chart)
},
dispatchDelChart (flag) {
this.store.commit('setChart', flag)
dispatchDelChart (store, playload) {
store.commit('setDelChart', true)
store.commit('setChart', playload.chart)
store.commit('setType', playload.type)
},
dispatchEditChart (chart) {
this.store.commit('setShowRightBox', true)
this.store.commit('setChart', chart)
dispatchEditChart (store, playload) {
store.commit('setShowRightBox', true)
store.commit('setChart', playload.chart)
store.commit('setType', playload.type)
},
clearPanel (store) {
store.commit('cleanPanel')
}
}
}