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

Merge branch 'dev-2.0' of https://git.mesalab.cn/nezha/nezha-fronted into dev-2.0

Browse Source
This commit is contained in:
@changcode
2021-05-14 17:51:14 +08:00
parent b68ac91ea9 b1b784b67a
commit edd082216d
41 changed files with 363 additions and 269 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
nezha-fronted/build/script/buildEnd.sh
View File

@@ -15,7 +15,11 @@ if [[ 'all' == "${BUILD_MODE}" ]];then
\cp -rf ../static/Tiles/ $DIST_PATH/static/ \cp -rf ../static/Tiles/ $DIST_PATH/static/
fi fi
echo 'start create zip...' echo 'start create zip...'
find ./ * -exec touch -t $(date +%Y%m%d0000.00) {} \;
#find ./ * -exec touch -t $(date +%Y%m%d0000.00) {} \;
find ./ * -exec touch -t 202104301200.00 {} \;
zip -rX nz-gui.zip ./* >/dev/null zip -rX nz-gui.zip ./* >/dev/null
MD5=$(md5sum nz-gui.zip |awk '{print $1}'|cut -c 1-8) MD5=$(md5sum nz-gui.zip |awk '{print $1}'|cut -c 1-8)

14
nezha-fronted/build/webpack.prod.conf.js
View File

@@ -197,13 +197,13 @@ if(process.env.NODE_ENV == 'development'){
onBuildStart: ['/bin/bash '+path.join(__dirname,'script')+'/buildStart.sh'], onBuildStart: ['/bin/bash '+path.join(__dirname,'script')+'/buildStart.sh'],
onBuildEnd: ['/bin/bash '+path.join(__dirname,'script')+'/buildEnd.sh '+process.env.BUILD_MODE] onBuildEnd: ['/bin/bash '+path.join(__dirname,'script')+'/buildEnd.sh '+process.env.BUILD_MODE]
}), }),
new fileManagerPlugin({ // new fileManagerPlugin({
onStart:[ // onStart:[
{ // {
delete:[path.join(__dirname,'../dist/') ] // delete:[path.join(__dirname,'../dist/') ]
} // }
], // ],
}) // })
) )
} }

2
nezha-fronted/src/components/charts/chart-alert-list.vue
View File

@@ -301,7 +301,7 @@ export default {
return (key, value) => { return (key, value) => {
if (key == 'type') { if (key == 'type') {
if (value == 1) { if (value == 1) {
value = this.$t('project.project.project') value = this.$t('project.project.projectName')
} else if (value == 2) { } else if (value == 2) {
value = this.$t('module.module.module') value = this.$t('module.module.module')
} else if (value == 3) { } else if (value == 3) {

2
nezha-fronted/src/components/charts/chart-detail.vue
View File

@@ -357,7 +357,7 @@ export default {
path: this.$t('project.endpoint.path'), path: this.$t('project.endpoint.path'),
param: this.$t('project.endpoint.param'), param: this.$t('project.endpoint.param'),
state: this.$t('alert.list.state'), state: this.$t('alert.list.state'),
project: this.$t('project.project.project'), project: this.$t('project.project.projectName'),
module: this.$t('project.module.module') module: this.$t('project.module.module')
} }
} }

2
nezha-fronted/src/components/charts/line-chart-block.vue
View File

@@ -184,7 +184,7 @@
<loading :ref="'localLoadingScreen'+chartIndex"></loading> <loading :ref="'localLoadingScreen'+chartIndex"></loading>
</el-dialog> </el-dialog>
</div> </div>
<span class="vue-resizable-handle" @mousedown="startResize" v-if="filter.from != $CONSTANTS.fromRoute.rule && !isLock"></span> <span class="vue-resizable-handle" @mousedown="startResize" v-if="!isLock"></span>
</div> </div>
</div> </div>
</template> </template>

336
nezha-fronted/src/components/common/alert/alertLabel.vue
View File

@@ -1,129 +1,125 @@
<template> <template>
<div :class="calcHeight(that.position,that)" :style="calcPosition(that.position,that)" ref="alertLabels"> <div :class="calcHeight(that.position,that)" :style="calcPosition(that.position,that)" ref="alertLabels">
<div class="alert-label-info" v-if="type==='asset'" v-loading="loading"> <div class="alert-label-info" v-if="type==='asset'" v-loading="loading">
<div class="alert-label-box"> <div class="alert-label-box">
<div class="alert-label-title">ID</div> <div class="alert-label-title">ID</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.id:''}}</div> <div class="alert-label-value">{{alertLabelData && alertLabelData.id ? alertLabelData.id : '--'}}</div>
</div> </div>
<div class="alert-label-box"> <div class="alert-label-box">
<div class="alert-label-title">SN</div> <div class="alert-label-title">Name</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.sn:''}}</div> <div class="alert-label-value">{{alertLabelData && alertLabelData.name ? alertLabelData.name : '--'}}</div>
</div> </div>
<div class="alert-label-box"> <div class="alert-label-box">
<div class="alert-label-title">Host</div> <div class="alert-label-title">SN</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.host:''}}</div> <div class="alert-label-value">{{alertLabelData && alertLabelData.sn ? alertLabelData.sn:'--'}}</div>
</div> </div>
<div class="alert-label-box"> <div class="alert-label-box">
<div class="alert-label-title">State</div> <div class="alert-label-title">ManageIp</div>
<div class="alert-label-value">{{alertLabelData?(alertStateStr(alertLabelData.state)):''}}</div> <div class="alert-label-value">{{alertLabelData && alertLabelData.manageIp ? alertLabelData.manageIp : '--'}}</div>
</div> </div>
<div class="alert-label-box"> <div class="alert-label-box">
<div class="alert-label-title">Ping</div> <div class="alert-label-title">State</div>
<div class="alert-label-value"> <div class="alert-label-value">{{alertLabelData && alertLabelData.state && alertLabelData.state.name ? alertLabelData.state.name : '--'}}</div>
<div v-if="alertLabelData" :class="{'active-icon green':alertLabelData.pingStatus == 1,'active-icon red':alertLabelData.pingStatus == 0}"></div> </div>
<span v-if="alertLabelData">{{alertLabelData.pingRtt?alertLabelData.pingRtt+'ms':''}}</span> <div class="alert-label-box">
</div> <div class="alert-label-title">Ping</div>
</div> <div class="alert-label-value">
<div class="alert-label-box"> <div v-if="alertLabelData" :class="{'green-bg': alertLabelData && alertLabelData.pingInfo && alertLabelData.pingInfo.status === 1,'red-bg': alertLabelData && alertLabelData.pingInfo && alertLabelData.pingInfo.status === 0}" class="active-icon"></div>
<div class="alert-label-title">Asset Type</div> <span v-if="alertLabelData">{{alertLabelData && alertLabelData.pingInfo && alertLabelData.pingInfo.rtt ? alertLabelData.pingInfo.rtt + 'ms':'--'}}</span>
<div class="alert-label-value">{{alertLabelData?alertLabelData.assetType:''}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Vendor</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.vendor:''}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Model</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.model:''}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">PingLastReply</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.pingLastReply:''}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Alert</div>
<div class="alert-label-value">
<span v-if="alertLabelData" :class="{danger:alertLabelData.alert>0,success:alertLabelData.alert<=0}">{{alertLabelData.alert + alertActiveStr()}}</span>
</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">DC</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.dataCenter:''}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Endpoint</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.endpoint:''}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Administrator</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.principal:''}}</div>
</div> </div>
</div> </div>
<div class="alert-label-box">
<div class="alert-label-title">Asset Type</div>
<div class="alert-label-value">{{alertLabelData && alertLabelData.type && alertLabelData.type.name ? alertLabelData.type.name:'--'}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Brand</div>
<div class="alert-label-value">{{alertLabelData && alertLabelData.brand && alertLabelData.brand.name ? alertLabelData.brand.name : '--'}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Model</div>
<div class="alert-label-value">{{alertLabelData && alertLabelData.model && alertLabelData.model.name ? alertLabelData.model.name : '--'}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">PingLastReply</div>
<div class="alert-label-value">{{alertLabelData && alertLabelData.pingInfo && alertLabelData.pingInfo.lastUpdate ? alertLabelData.pingInfo.lastUpdate : '--'}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Alert</div>
<div class="alert-label-value">
<span v-if="alertLabelData" :class="alertLabelData && alertLabelData.alertNum > 0 ? 'danger' : 'success'">{{alertLabelData && alertLabelData.alertNum ? alertLabelData.alertNum : 0 + ' ' + alertActiveStr()}}</span>
</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">DC</div>
<div class="alert-label-value">{{alertLabelData && alertLabelData.dc && alertLabelData.dc.name ? alertLabelData.dc.name : '--'}}</div>
</div>
</div>
<div class="alert-label-info" v-if="type==='module'" v-loading="loading"> <div class="alert-label-info" v-if="type==='module'" v-loading="loading">
<div class="alert-label-box"> <div class="alert-label-box">
<div class="alert-label-title">ID</div> <div class="alert-label-title">ID</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.id:''}}</div> <div class="alert-label-value">{{alertLabelData && alertLabelData.id ? alertLabelData.id : '--'}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Name</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.name:''}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Project</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.project.name:''}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Description</div>
<div class="alert-label-value">{{alertLabelData?(alertLabelData.remark?alertLabelData.remark:'-'):''}}</div>
</div>
</div> </div>
<div class="alert-label-box">
<div class="alert-label-title">Name</div>
<div class="alert-label-value">{{alertLabelData && alertLabelData.name ? alertLabelData.name : '--'}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Project</div>
<div class="alert-label-value">{{alertLabelData && alertLabelData.project && alertLabelData.project.name ?alertLabelData.project.name : '--'}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Description</div>
<div class="alert-label-value">{{alertLabelData && alertLabelData.remark ? alertLabelData.remark : '-'}}</div>
</div>
</div>
<div class="alert-label-info" v-if="type==='project'" v-loading="loading"> <div class="alert-label-info" v-if="type==='project'" v-loading="loading">
<div class="alert-label-box"> <div class="alert-label-box">
<div class="alert-label-title">ID</div> <div class="alert-label-title">ID</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.id:''}}</div> <div class="alert-label-value">{{alertLabelData && alertLabelData ? alertLabelData.id : '--'}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Name</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.name:''}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Description</div>
<div class="alert-label-value">{{alertLabelData?(alertLabelData.remark?alertLabelData.remark:'-'):''}}</div>
</div>
</div> </div>
<div class="alert-label-box">
<div class="alert-label-title">Name</div>
<div class="alert-label-value">{{alertLabelData && alertLabelData ? alertLabelData.name : '--'}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Description</div>
<div class="alert-label-value">{{alertLabelData && alertLabelData.remark ? alertLabelData.remark : '--'}}</div>
</div>
</div>
<div class="alert-label-info" v-if="type==='endpoint'" v-loading="loading"> <div class="alert-label-info" v-if="type==='endpoint'" v-loading="loading">
<div class="alert-label-box"> <div class="alert-label-box">
<div class="alert-label-title">ID</div> <div class="alert-label-title">ID</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.id:''}}</div> <div class="alert-label-value">{{alertLabelData && alertLabelData.id ? alertLabelData.id : '--'}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Project</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.project.name:''}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Module</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.module.name:''}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Labels</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.labels:''}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Host</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.host:''}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Port</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.port:''}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Path</div>
<div class="alert-label-value">{{alertLabelData?alertLabelData.path:''}}</div>
</div>
</div> </div>
<div class="alert-label-box">
<div class="alert-label-title">Project</div>
<div class="alert-label-value">{{alertLabelData && alertLabelData.project && alertLabelData.project.name ? alertLabelData.project.name : '--'}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Module</div>
<div class="alert-label-value">{{alertLabelData && alertLabelData.module && alertLabelData.module.name ? alertLabelData.module.name : '--'}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Labels</div>
<div class="alert-label-value">{{alertLabelData && alertLabelData.labels ? alertLabelData.labels : '--'}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Host</div>
<div class="alert-label-value">{{alertLabelData && alertLabelData.host ? alertLabelData.host : '--'}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Port</div>
<div class="alert-label-value">{{alertLabelData && alertLabelData.port ? alertLabelData.port : '--'}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Path</div>
<div class="alert-label-value">{{alertLabelData && alertLabelData.path ? alertLabelData.path : '--'}}</div>
</div>
</div>
</div> </div>
</template> </template>
@@ -181,6 +177,28 @@ export default {
}, },
components: { components: {
},
watch: {
id: {
immediate: true,
deep: true,
handler (n) {
this.init()
}
},
that: {
immediate: true,
deep: true,
handler (n) {
}
},
LRTriangle: {
immediate: true,
deep: true,
handler (n) {
}
}
}, },
computed: { computed: {
calcPosition () { calcPosition () {
@@ -215,6 +233,49 @@ export default {
} }
}, },
methods: { methods: {
init () {
this.loading = true
if (this.type === 'asset') {
this.$get('asset/asset/' + this.id).then((res) => {
if (res.msg === 'success') {
this.loading = false
this.alertLabelData = res.data
} else {
this.$message.error(res.msg)
}
})
}
if (this.type === 'project') {
this.$get('monitor/project/' + this.id).then((res) => {
if (res.msg === 'success') {
this.loading = false
this.alertLabelData = res.data
} else {
this.$message.error(res.msg)
}
})
}
if (this.type === 'module') {
this.$get('monitor/module/' + this.id).then((res) => {
if (res.msg === 'success') {
this.loading = false
this.alertLabelData = res.data
} else {
this.$message.error(res.msg)
}
})
}
if (this.type === 'endpoint') {
this.$get('monitor/endpoint/' + this.id).then((res) => {
if (res.msg === 'success') {
this.loading = false
this.alertLabelData = res.data
} else {
this.$message.error(res.msg)
}
})
}
},
alertActiveStr () { alertActiveStr () {
return this.$t('overall.active') return this.$t('overall.active')
}, },
@@ -226,48 +287,7 @@ export default {
} }
} }
}, },
mounted () { mounted () {},
if (this.type === 'asset') {
this.$get('/asset/info?id=' + this.id).then((res) => {
if (res.msg === 'success') {
this.loading = false
this.alertLabelData = res.data.Basic
} else {
this.$message.error(res.msg)
}
})
}
if (this.type === 'project') {
this.$get('/project?id=' + this.id).then((res) => {
if (res.msg === 'success') {
this.loading = false
this.alertLabelData = res.data.list[0]
} else {
this.$message.error(res.msg)
}
})
}
if (this.type === 'module') {
this.$get('/module?id=' + this.id).then((res) => {
if (res.msg === 'success') {
this.loading = false
this.alertLabelData = res.data.list[0]
} else {
this.$message.error(res.msg)
}
})
}
if (this.type === 'endpoint') {
this.$get('/endpoint?id=' + this.id).then((res) => {
if (res.msg === 'success') {
this.loading = false
this.alertLabelData = res.data.list[0]
} else {
this.$message.error(res.msg)
}
})
}
},
beforeDestroy () { beforeDestroy () {
} }

13
nezha-fronted/src/components/common/bottomBox/bottomBox.vue
View File

@@ -58,6 +58,8 @@
<panel-tab-new v-if="from === fromRoute.chartTemp && targetTab === 'panel'" v-show="subResizeShow" :detail="detail" :from="from" :tabs="tabs.chartTemp.chartTempTabTitle" :obj="obj" :targetTab.sync="targetTab" @changeTab="changeTab"></panel-tab-new> <panel-tab-new v-if="from === fromRoute.chartTemp && targetTab === 'panel'" v-show="subResizeShow" :detail="detail" :from="from" :tabs="tabs.chartTemp.chartTempTabTitle" :obj="obj" :targetTab.sync="targetTab" @changeTab="changeTab"></panel-tab-new>
<!--alertRule Tab--> <!--alertRule Tab-->
<alertMessageTabNew v-if="from === fromRoute.alertRule && targetTab === 'alertRuleAlertMessage'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.alertRule.alertRule" @changeTab="changeTab" :targetTab="targetTab"></alertMessageTabNew> <alertMessageTabNew v-if="from === fromRoute.alertRule && targetTab === 'alertRuleAlertMessage'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.alertRule.alertRule" @changeTab="changeTab" :targetTab="targetTab"></alertMessageTabNew>
<!--model 下滑-->
<asset-tab v-if="(from === fromRoute.model) && targetTab === 'asset'" :tabs="tabs.model" ref="assetTab" :from="from" :obj="obj" @changeTab="changeTab" @exit="closeSubList"></asset-tab>
</div> </div>
</div> </div>
</div> </div>
@@ -157,26 +159,29 @@ export default {
moduleTabTitle: [ moduleTabTitle: [
// { prop: 'panel', name: 'Detail' }, // { prop: 'panel', name: 'Detail' },
{ prop: 'endpoint', name: this.$t('asset.endpoint') }, { prop: 'endpoint', name: this.$t('asset.endpoint') },
{ prop: 'moduleAlertMessage', name: 'Alerts' } { prop: 'moduleAlertMessage', name: this.$t('overall.alert') }
] ]
}, },
endpoint: { endpoint: {
endpointTabTitle: [ endpointTabTitle: [
// { prop: 'panel', name: 'Detail' }, // { prop: 'panel', name: 'Detail' },
{ prop: 'endpointQuery', name: 'Query' }, { prop: 'endpointQuery', name: 'Query' },
{ prop: 'endpointAlertMessage', name: 'Alerts' } { prop: 'endpointAlertMessage', name: this.$t('overall.alert') }
] ]
}, },
chartTemp: { chartTemp: {
chartTempTabTitle: [ chartTempTabTitle: [
{ prop: 'panel', name: 'Template preview' } { prop: 'panel', name: this.$t('overall.tempPrev') }
] ]
}, },
alertRule: { alertRule: {
alertRule: [ alertRule: [
{ prop: 'alertRuleAlertMessage', name: 'Alerts' } { prop: 'alertRuleAlertMessage', name: this.$t('overall.alert') }
] ]
}, },
model: [
{ prop: 'asset', name: this.$t('asset.assets'), active: true }
],
dc: { dc: {
cabinet: [ cabinet: [
{ prop: 'cabinet', name: this.$t('config.dc.cabinets'), active: true }, { prop: 'cabinet', name: this.$t('config.dc.cabinets'), active: true },

10
nezha-fronted/src/components/common/bottomBox/nzBottomDataList.vue
View File

@@ -2,7 +2,7 @@
<div> <div>
<div class="top-tools top-tools--sub"> <div class="top-tools top-tools--sub">
<div class="top-tool-left"> <div class="top-tool-left">
<div class="sub-list-title">{{title}}：<slot name="title"></slot></div> <div class="sub-list-title">{{bottomHeaderTitle}}：<slot name="title"></slot></div>
<div class="sub-list-tabs"> <div class="sub-list-tabs">
<div v-for="tab in tabs" :key="tab.prop" :class="{'sub-list-tab--active': tab.active || tab.prop=== targetTab}" class="sub-list-tab" @click="changeTab(tab.prop)">{{tab.name}}</div> <div v-for="tab in tabs" :key="tab.prop" :class="{'sub-list-tab--active': tab.active || tab.prop=== targetTab}" class="sub-list-tab" @click="changeTab(tab.prop)">{{tab.name}}</div>
</div> </div>
@@ -82,8 +82,12 @@ export default {
default: true default: true
}, },
title: { title: {
type: String, type: String
default: 'Name' }
},
computed: {
bottomHeaderTitle () {
return this.title || this.$t('overall.name')
} }
}, },
data () { data () {

4
nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTab.vue
View File

@@ -198,7 +198,7 @@ export default {
disabled: false disabled: false
}, { }, {
id: 20, id: 20,
name: this.$t('project.project.project'), name: this.$t('project.project.projectName'),
type: 'project', type: 'project',
label: 'project', label: 'project',
disabled: false disabled: false
@@ -272,7 +272,7 @@ export default {
return (key, value) => { return (key, value) => {
if (key == 'type') { if (key == 'type') {
if (value == 1) { if (value == 1) {
value = this.$t('project.project.project') value = this.$t('project.project.projectName')
} else if (value == 2) { } else if (value == 2) {
value = this.$t('module.module.module') value = this.$t('module.module.module')
} else if (value == 3) { } else if (value == 3) {

5
nezha-fronted/src/components/common/bottomBox/tabs/assetTab.vue
View File

@@ -52,6 +52,7 @@ import subDataListMixin from '@/components/common/mixin/subDataList'
import nzBottomDataList from '@/components/common/bottomBox/nzBottomDataList' import nzBottomDataList from '@/components/common/bottomBox/nzBottomDataList'
import assetTable from '@/components/common/table/asset/assetTable' import assetTable from '@/components/common/table/asset/assetTable'
import assetBox from '@/components/common/rightBox/asset/assetBox' import assetBox from '@/components/common/rightBox/asset/assetBox'
import {fromRoute} from "@/components/common/js/constants";
export default { export default {
name: 'assetTab', name: 'assetTab',
mixins: [dataListMixin, subDataListMixin], mixins: [dataListMixin, subDataListMixin],
@@ -193,6 +194,10 @@ export default {
deep: true, deep: true,
handler (n, o) { handler (n, o) {
this.searchLabel.dcIds = n.id this.searchLabel.dcIds = n.id
if ( this.from === fromRoute.model) {
delete this.searchLabel.dcIds
this.searchLabel.modelIds = n.id
}
this.getTableData() this.getTableData()
} }
} }

4
nezha-fronted/src/components/common/bottomBox/tabs/endpointTab.vue
View File

@@ -193,7 +193,7 @@ export default {
prop: 'id', prop: 'id',
show: true show: true
}, { }, {
label: this.$t('project.project.project'), label: this.$t('project.project.projectName'),
prop: 'project', prop: 'project',
show: true, show: true,
width: '120' width: '120'
@@ -288,7 +288,7 @@ export default {
readonly: true readonly: true
}, { }, {
id: 34, id: 34,
name: this.$t('project.project.project'), name: this.$t('project.project.projectName'),
// name: this.$t('asset.asset'), // name: this.$t('asset.asset'),
type: 'input', type: 'input',
label: 'projectName', label: 'projectName',

2
nezha-fronted/src/components/common/bottomBox/tabs/endpointTabNew.vue
View File

@@ -32,7 +32,7 @@
</template> </template>
</nz-bottom-data-list> </nz-bottom-data-list>
<transition name="right-box"> <transition name="right-box">
<edit-endpoint-box-new v-if="rightBox.editShow" :module="object" @close="closeRightEditBox" :disabled="true" :type="'edit'"></edit-endpoint-box-new> <edit-endpoint-box-new v-if="rightBox.editShow" :module="object" @close="closeRightEditBox" :disabled="true" :optionType="'edit'"></edit-endpoint-box-new>
</transition> </transition>
</div> </div>
</template> </template>

16
nezha-fronted/src/components/common/deleteButton.vue
View File

@@ -1,6 +1,11 @@
<template> <template>
<div :class="['delete-button',(deleteObjs.length<1?'':'delete-button-light')]"> <div :class="['delete-button',(deleteObjs.length<1?'':'delete-button-light')]">
<button :id="id" :class="{'nz-btn-disabled' : deleteObjs.length<1}" class="top-tool-btn top-tool-btn--delete" @click="batchDelete"><span><i class="nz-icon nz-icon-delete" ></i></span></button> <button v-if="this.type === 'button'" :id="id" :class="{'nz-btn-disabled' : deleteObjs.length<1}" class="top-tool-btn top-tool-btn--delete" @click="batchDelete">
<span><i class="nz-icon nz-icon-delete" ></i></span>
</button>
<div v-if="this.type === 'link'" :id="id" :class="{'nz-btn-disabled' : deleteObjs.length<1}" class="top-tool-btn top-tool-btn--delete" @click="batchDelete">
<span><i class="nz-icon nz-icon-delete" ></i>{{title}}</span>
</div>
</div> </div>
</template> </template>
@@ -12,7 +17,14 @@ export default {
deleteObjs: Array, deleteObjs: Array,
api: String, api: String,
clickFunction: Function, clickFunction: Function,
id: String id: String,
type: {
type: String,
default: 'button'
},
title: {
type: String
}
}, },
methods: { methods: {
batchDelete: function () { batchDelete: function () {

4
nezha-fronted/src/components/common/header.vue
View File

@@ -18,7 +18,7 @@
</template> </template>
<template v-for="(item, index) in linkData"> <template v-for="(item, index) in linkData">
<el-menu-item :key="index" :index="'0-' + index"> <el-menu-item :key="index" :index="'0-' + index">
<span class="linkTitle"><a :href='item.url' :title="item.name" class="nz-a" rel="noopener norefferrer" target="_blank">{{item.name}}</a></span> <span class="linkTitle"><a :href='item.url' :title="item.name" class="nz-a" rel="noopener noreferrer" target="_blank">{{item.name}}</a></span>
</el-menu-item> </el-menu-item>
</template> </template>
</el-submenu> </el-submenu>
@@ -253,7 +253,7 @@ export default {
}, },
createMenu: [ // 新增按钮内容 createMenu: [ // 新增按钮内容
{ {
label: this.$t('project.project.project'), label: this.$t('project.project.projectName'),
url: 'project', url: 'project',
type: 1, type: 1,
permission: 'header_add_project' permission: 'header_add_project'

2
nezha-fronted/src/components/common/js/common.js
View File

@@ -10,7 +10,7 @@ export function resetZIndex (e) {
} }
export function getUUID () { export function getUUID () {
function S4 () { function S4 () {
return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1) return (((1 + window.crypto.getRandomValues(new Uint32Array(10))[0]) * 0x10000) | 0).toString(16).substring(1)
} }
return (S4() + S4() + '-' + S4() + '-' + S4() + '-' + S4() + '-' + S4() + S4() + S4()) return (S4() + S4() + '-' + S4() + '-' + S4() + '-' + S4() + '-' + S4() + S4() + S4())

4
nezha-fronted/src/components/common/js/radomcolor/randomcolor.js
View File

@@ -1,4 +1,4 @@
function randomcolor () { function randomcolor () {/*
let e = null let e = null
const t = {} const t = {}
r('monochrome', null, [ r('monochrome', null, [
@@ -309,7 +309,7 @@ function randomcolor () {
return [t, Math.round(n * s / (o < 1 ? o : 2 - o) * 1e4) / 100, o / 2 * 100] return [t, Math.round(n * s / (o < 1 ? o : 2 - o) * 1e4) / 100, o / 2 * 100]
} }
return n() return n()
} */}
export { export {
randomcolor randomcolor

8
nezha-fronted/src/components/common/language/cn.js
View File

@@ -122,7 +122,11 @@ const cn = {
moreOption: '更多选项', moreOption: '更多选项',
copy: '复制', copy: '复制',
silence: '静默', silence: '静默',
labels: '标签' labels: '标签',
editType: '类型',
searchCondition: '搜索条件',
batchDel: '批量删除',
tempPrev: '模板预览'
}, },
setup: { setup: {
step0: '欢迎', step0: '欢迎',
@@ -1193,7 +1197,7 @@ const cn = {
}, },
project: { project: {
project: '名称', project: '名称',
projectName: '系统名称', projectName: '系统',
editProject: '编辑系统', editProject: '编辑系统',
description: '描述', description: '描述',
createProject: '新增系统' createProject: '新增系统'

8
nezha-fronted/src/components/common/language/en.js
View File

@@ -127,7 +127,11 @@ const en = {
labels: 'Labels', labels: 'Labels',
moreOption: 'More option', moreOption: 'More option',
copy: 'Copy', copy: 'Copy',
silence: 'Silence' silence: 'Silence',
editType: 'Type',
searchCondition: 'Search condition',
batchDel: 'Batches delete',
tempPrev: 'Template preview'
}, },
pageSize: '/page', pageSize: '/page',
setup: { setup: {
@@ -1203,7 +1207,7 @@ const en = {
}, },
project: { project: {
project: 'Name', // "系统" project: 'Name', // "系统"
projectName: 'Project name', // "系统名称" projectName: 'Project', // "系统名称"
editProject: 'Edit project', // "编辑系统" editProject: 'Edit project', // "编辑系统"
description: 'Description', // "描述" description: 'Description', // "描述"
createProject: 'New project'// "新增系统" createProject: 'New project'// "新增系统"

1
nezha-fronted/src/components/common/mixin/table.js
View File

@@ -26,7 +26,6 @@ export default {
tableOperation ([command, row, param]) { tableOperation ([command, row, param]) {
switch (command) { switch (command) {
case 'edit': { case 'edit': {
console.info(1, command, row)
this.$emit('edit', row) this.$emit('edit', row)
break break
} }

4
nezha-fronted/src/components/common/popBox/topToolMoreOptions.vue
View File

@@ -158,7 +158,7 @@ export default {
rollbackImport () { rollbackImport () {
let url let url
if (this.importUrl.indexOf('asset') > -1) { if (this.importUrl.indexOf('asset') > -1) {
url = '/asset/cancelImport' url = '/asset/asset/cancelImport'
} else if (this.importUrl.indexOf('endpoint') > -1) { } else if (this.importUrl.indexOf('endpoint') > -1) {
url = '/monitor/endpoint/cancelImport' url = '/monitor/endpoint/cancelImport'
} else if (this.importUrl.indexOf('rule') > -1) { } else if (this.importUrl.indexOf('rule') > -1) {
@@ -227,7 +227,7 @@ export default {
let url = null let url = null
if (this.importUrl.indexOf('asset') > -1) { if (this.importUrl.indexOf('asset') > -1) {
url = '/asset/template' url = '/asset/asset/template'
} else if (this.importUrl.indexOf('rule') > -1) { } else if (this.importUrl.indexOf('rule') > -1) {
url = '/alert/rule/template' url = '/alert/rule/template'
} else if (this.importUrl.indexOf('panel') > -1) { } else if (this.importUrl.indexOf('panel') > -1) {

8
nezha-fronted/src/components/common/project/L5/CanvasProps.vue
View File

@@ -1884,8 +1884,14 @@ export default {
outline: none; outline: none;
} }
/deep/ .el-input-number:focus {
.el-input-number__decrease, .el-input-number__increase {
visibility: visible;
outline: none;
}
}
/deep/ .el-input-number:focus-within { /deep/ .el-input-number:focus-within {
/deep/ .el-input-number__decrease, /deep/ .el-input-number__increase { .el-input-number__decrease, .el-input-number__increase {
visibility: visible; visibility: visible;
outline: none; outline: none;
} }

4
nezha-fronted/src/components/common/project/popData/alertTable.vue
View File

@@ -203,7 +203,7 @@ export default {
return (key, value) => { return (key, value) => {
if (key == 'type') { if (key == 'type') {
if (value == 1) { if (value == 1) {
value = this.$t('project.project.project') value = this.$t('project.project.projectName')
} else if (value == 2) { } else if (value == 2) {
value = this.$t('module.module.module') value = this.$t('module.module.module')
} else if (value == 3) { } else if (value == 3) {
@@ -284,7 +284,7 @@ export default {
disabled: false disabled: false
}, { }, {
id: 22, id: 22,
name: this.$t('project.project.project'), name: this.$t('project.project.projectName'),
type: 'project', type: 'project',
label: 'project', label: 'project',
disabled: false disabled: false

2
nezha-fronted/src/components/common/project/popData/assetTable.vue
View File

@@ -130,7 +130,7 @@ export default {
return (key, value) => { return (key, value) => {
if (key == 'type') { if (key == 'type') {
if (value == 1) { if (value == 1) {
value = this.$t('project.project.project') value = this.$t('project.project.projectName')
} else if (value == 2) { } else if (value == 2) {
value = this.$t('module.module.module') value = this.$t('module.module.module')
} else if (value == 3) { } else if (value == 3) {

2
nezha-fronted/src/components/common/project/popData/endpointTable.vue
View File

@@ -116,7 +116,7 @@ export default {
return (key, value) => { return (key, value) => {
if (key == 'type') { if (key == 'type') {
if (value == 1) { if (value == 1) {
value = this.$t('project.project.project') value = this.$t('project.project.projectName')
} else if (value == 2) { } else if (value == 2) {
value = this.$t('module.module.module') value = this.$t('module.module.module')
} else if (value == 3) { } else if (value == 3) {

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

@@ -13,7 +13,7 @@
<div class="right-box-form-box right-box__container" style="overflow: hidden"> <div class="right-box-form-box right-box__container" style="overflow: hidden">
<el-form class="right-box-form right-box-form-left" label-position = "top" ref="addEndpoint" :model="endpoint" :rules="rules"> <el-form class="right-box-form right-box-form-left" label-position = "top" ref="addEndpoint" :model="endpoint" :rules="rules">
<!--project--> <!--project-->
<el-form-item :label='$t("project.project.project")' prop="projectId" class="select-warp"> <el-form-item :label='$t("project.project.projectName")' prop="projectId" class="select-warp">
<el-select @change="((val) => {changeProject(val)})" value-key="id" popper-class="config-dropdown" v-model="currentProjectCopy" placeholder="" size="small" id="add-endpoint-project"> <el-select @change="((val) => {changeProject(val)})" value-key="id" popper-class="config-dropdown" v-model="currentProjectCopy" placeholder="" size="small" id="add-endpoint-project">
<el-option v-for="item in projectList" :key="item.id" :label="item.name" :value="item" :id="'project-'+item.id"></el-option> <el-option v-for="item in projectList" :key="item.id" :label="item.name" :value="item" :id="'project-'+item.id"></el-option>
</el-select> </el-select>

4
nezha-fronted/src/components/common/rightBox/asset/assetBatchEditBox.vue
View File

@@ -3,14 +3,14 @@
<div class="right-box__header"> <div class="right-box__header">
<div class="header__title">{{$t('asset.batchEditAsset')}}</div> <div class="header__title">{{$t('asset.batchEditAsset')}}</div>
<div class="header__operation"> <div class="header__operation">
<span><i class="nz-icon nz-icon-close"></i></span> <span @click="esc"><i class="nz-icon nz-icon-close"></i></span>
</div> </div>
</div> </div>
<div class="right-box__container"> <div class="right-box__container">
<div class="container__form"> <div class="container__form">
<!-- Edit type --> <!-- Edit type -->
<el-form ref="assetEditForm" :model="editData" :rules="rules" label-position="top" label-width="120px"> <el-form ref="assetEditForm" :model="editData" :rules="rules" label-position="top" label-width="120px">
<el-form-item :label="$t('overall.name')" prop="editType"> <el-form-item :label="$t('overall.editType')" prop="editType">
<el-select v-model="editData.editType" class="right-box__select" popper-class="right-box-select-dropdown prevent-clickoutside" size="small" value-key="value"> <el-select v-model="editData.editType" class="right-box__select" popper-class="right-box-select-dropdown prevent-clickoutside" size="small" value-key="value">
<el-option v-for="type in assetConstants.editTypeOptions" :key="type.value" :label="type.label" :value="type.value"/> <el-option v-for="type in assetConstants.editTypeOptions" :key="type.value" :label="type.label" :value="type.value"/>
</el-select> </el-select>

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

@@ -373,7 +373,7 @@ export default {
disabled: false disabled: false
}, { }, {
id: 34, id: 34,
name: this.$t('project.project.project'), name: this.$t('project.project.projectName'),
// name: this.$t('asset.asset'), // name: this.$t('asset.asset'),
type: 'input', type: 'input',
label: 'projectName', label: 'projectName',

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

@@ -17,7 +17,7 @@
<div class="right-box-form-box"> <div class="right-box-form-box">
<el-form class="right-box-form right-box-form-left" :model="editEndpoint" label-position = "top" label-width="120px" :rules="rules" ref="endpointForm"> <el-form class="right-box-form right-box-form-left" :model="editEndpoint" label-position = "top" label-width="120px" :rules="rules" ref="endpointForm">
<!--project--> <!--project-->
<el-form-item :label="$t('project.project.project')" prop="project.id"> <el-form-item :label="$t('project.project.projectName')" prop="project.id">
<el-select @change="((val) => {changeProject(val);})" value-key="id" popper-class="config-dropdown" v-model="editEndpoint.projectId" placeholder="" size="small" id="edit-endpoint-input-project"> <el-select @change="((val) => {changeProject(val);})" value-key="id" popper-class="config-dropdown" v-model="editEndpoint.projectId" placeholder="" size="small" id="edit-endpoint-input-project">
<el-option :id="'edit-project-'+item.id" v-for="item in projectList" :key="item.id" :label="item.name" :value="item.id"></el-option> <el-option :id="'edit-project-'+item.id" v-for="item in projectList" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select> </el-select>

26
nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
View File

@@ -27,7 +27,7 @@
<el-input placeholder="" maxlength="64" show-word-limit v-model="editEndpoint.name" size="small" id="module-box-input-name"></el-input> <el-input placeholder="" maxlength="64" show-word-limit v-model="editEndpoint.name" size="small" id="module-box-input-name"></el-input>
</el-form-item> </el-form-item>
<!--project--> <!--project-->
<el-form-item :label='$t("project.project.project")' prop="projectId"> <el-form-item :label='$t("project.project.projectName")' prop="projectId">
<el-select value-key="id" popper-class="config-dropdown" v-model="editEndpoint.projectId" placeholder="" size="small" id="module-box-input-project" @change="changeProject" :disabled="disabled"> <el-select value-key="id" popper-class="config-dropdown" v-model="editEndpoint.projectId" placeholder="" size="small" id="module-box-input-project" @change="changeProject" :disabled="disabled">
<el-option :id="'module-project-'+item.id" v-for="item in projectList" :key="item.id" :label="item.name" :value="item.id"></el-option> <el-option :id="'module-project-'+item.id" v-for="item in projectList" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select> </el-select>
@@ -121,18 +121,18 @@
</el-form-item> </el-form-item>
<transition name="el-zoom-in-top"> <transition name="el-zoom-in-top">
<div v-show="showAllBasicOption" > <div v-show="showAllBasicOption" >
<!--name pattern--> <!-- &lt;!&ndash;name pattern&ndash;&gt;-->
<el-form-item :label='$t("project.endpoint.pattern")' prop="pattern" class="half-form-item"> <!-- <el-form-item :label='$t("project.endpoint.pattern")' prop="pattern" class="half-form-item">-->
<!-- <el-input placeholder="" v-model=""></el-input>--> <!-- &lt;!&ndash; <el-input placeholder="" v-model=""></el-input>&ndash;&gt;-->
<el-autocomplete <!-- <el-autocomplete-->
class="inline-input" <!-- class="inline-input"-->
size="small" <!-- size="small"-->
id="module-box-input-pattern" <!-- id="module-box-input-pattern"-->
v-model="editEndpoint.endpointNameTmpl" <!-- v-model="editEndpoint.endpointNameTmpl"-->
:fetch-suggestions="querySearch" <!-- :fetch-suggestions="querySearch"-->
placeholder="请输入内容" <!-- placeholder="请输入内容"-->
></el-autocomplete> <!-- ></el-autocomplete>-->
</el-form-item> <!-- </el-form-item>-->
<!--scrape_interval--> <!--scrape_interval-->
<el-form-item :label='$t("project.endpoint.scrape_interval")' prop="scrape_interval" class="half-form-item"> <el-form-item :label='$t("project.endpoint.scrape_interval")' prop="scrape_interval" class="half-form-item">
<el-input :placeholder='$t("project.endpoint.scrape_interval_placeholder")' v-model.number="editEndpoint.configs.scrape_interval" size="small" id="module-box-input-scrape_interval"> <el-input :placeholder='$t("project.endpoint.scrape_interval_placeholder")' v-model.number="editEndpoint.configs.scrape_interval" size="small" id="module-box-input-scrape_interval">

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

@@ -122,7 +122,7 @@
id="module-box-input-pattern" id="module-box-input-pattern"
v-model="editModule.endpointNameTmpl" v-model="editModule.endpointNameTmpl"
:fetch-suggestions="querySearch" :fetch-suggestions="querySearch"
placeholder="请输入内容" :placeholder="$t('overall.placeHolder')"
></el-autocomplete> ></el-autocomplete>
</el-form-item> </el-form-item>
<!--scrape_interval--> <!--scrape_interval-->

4
nezha-fronted/src/components/common/table/alert/alertMessageTable.vue
View File

@@ -128,7 +128,7 @@ import table from '@/components/common/mixin/table'
import nzAlertTag from '../../../page/alert/nzAlertTag' import nzAlertTag from '../../../page/alert/nzAlertTag'
import chartDataFormat from '../../../charts/chartDataFormat' import chartDataFormat from '../../../charts/chartDataFormat'
import alertRuleInfo from '../../alert/alertRuleInfo' import alertRuleInfo from '../../alert/alertRuleInfo'
import alertLabel from '../../alert/alertLabel2' import alertLabel from '../../alert/alertLabel'
import { calcDurationByStringTimeB } from '../../js/tools' import { calcDurationByStringTimeB } from '../../js/tools'
export default { export default {
name: 'alertMessageTable', name: 'alertMessageTable',
@@ -224,7 +224,7 @@ export default {
return (key, value) => { return (key, value) => {
if (key == 'type') { if (key == 'type') {
if (value == 1) { if (value == 1) {
value = this.$t('project.project.project') value = this.$t('project.project.projectName')
} else if (value == 2) { } else if (value == 2) {
value = this.$t('module.module.module') value = this.$t('module.module.module')
} else if (value == 3) { } else if (value == 3) {

19
nezha-fronted/src/components/common/table/settings/modelTable.vue
View File

@@ -60,13 +60,14 @@
fixed="right"> fixed="right">
<div slot="header" class="table-operation-title">{{$t('overall.option')}}</div> <div slot="header" class="table-operation-title">{{$t('overall.option')}}</div>
<div slot-scope="scope" class="table-operation-items"> <div slot-scope="scope" class="table-operation-items">
<button class="table-operation-item" @click="showBottomBox('operationLogTab', scope.row)"><i class="nz-icon nz-icon-view1"></i></button> <button class="table-operation-item" @click="$emit('edit', scope.row)"><i class="nz-icon nz-icon-edit"></i></button>
<!-- <button class="table-operation-item" @click="showBottomBox('operationLogTab', scope.row)"><i class="nz-icon nz-icon-view1"></i></button>-->
<el-dropdown size="medium" trigger="hover" @command="tableOperation"> <el-dropdown size="medium" trigger="hover" @command="tableOperation">
<div class="table-operation-item table-operation-item--more"> <div class="table-operation-item table-operation-item--more">
<span>…</span><i class="nz-icon nz-icon-arrow-down"></i> <span>…</span><i class="nz-icon nz-icon-arrow-down"></i>
</div> </div>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item> <!-- <el-dropdown-item :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>-->
<el-dropdown-item :command="['delete', scope.row]" :disabled="scope.row.id === 1"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> <el-dropdown-item :command="['delete', scope.row]" :disabled="scope.row.id === 1"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
</el-dropdown> </el-dropdown>
@@ -88,19 +89,19 @@ export default {
prop: 'id', prop: 'id',
show: true, show: true,
width: 80, width: 80,
sortable:'custom' sortable: 'custom'
}, { }, {
label: this.$t('config.model.name'), label: this.$t('config.model.name'),
prop: 'name', prop: 'name',
show: true, show: true,
width: 160, width: 450,
sortable:'custom' sortable: 'custom'
}, { }, {
label: this.$t('config.model.brand'), label: this.$t('config.model.brand'),
prop: 'brand', prop: 'brand',
show: true, show: true,
width: 160 width: 160,
,sortable:'custom' sortable: 'custom'
}, { }, {
label: this.$t('config.model.remark'), label: this.$t('config.model.remark'),
prop: 'remark', prop: 'remark',
@@ -110,7 +111,7 @@ export default {
prop: 'assetNum', prop: 'assetNum',
show: true, show: true,
width: 200, width: 200,
sortable:'custom' sortable: 'custom'
} }
] ]
} }
@@ -118,7 +119,7 @@ export default {
methods: { methods: {
}, },
created() { created () {
}, },
computed: { computed: {

2
nezha-fronted/src/components/layout/container.vue
View File

@@ -20,7 +20,7 @@ export default {
height: calc(100% - 50px); height: calc(100% - 50px);
background-color: #f6f6f6; background-color: #f6f6f6;
width: 100%; width: 100%;
padding-right: 10px;
&>div { &>div {
height: 100%; height: 100%;
} }

4
nezha-fronted/src/components/layout/header.vue
View File

@@ -11,7 +11,7 @@
<el-dropdown-item v-for="(item, index) in linkData" :key="index" :index="'0-' + index"> <el-dropdown-item v-for="(item, index) in linkData" :key="index" :index="'0-' + index">
<span class="link-title"> <span class="link-title">
<i class="nz-icon nz-icon-link"></i> <i class="nz-icon nz-icon-link"></i>
<a :href='item.url' :title="item.name" class="nz-a" target="_blank">{{item.name}}</a> <a :href='item.url' rel="noopener noreferrer" :title="item.name" class="nz-a" target="_blank">{{item.name}}</a>
</span> </span>
</el-dropdown-item> </el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
@@ -79,7 +79,7 @@ export default {
// 顶部菜单相关 // 顶部菜单相关
createMenu: [ // 新增按钮内容 createMenu: [ // 新增按钮内容
{ {
label: this.$t('project.project.project'), label: this.$t('project.project.projectName'),
url: 'project', url: 'project',
type: 1, type: 1,
permission: 'header_add_project' permission: 'header_add_project'

45
nezha-fronted/src/components/page/alert/alertMessage.vue
View File

@@ -89,7 +89,7 @@
<div slot="title"> <div slot="title">
{{$t("project.endpoint.dialogTitle")}} {{$t("project.endpoint.dialogTitle")}}
<div class="float-right panel-calendar dialog-tool" style="display: flex"> <div class="float-right panel-calendar dialog-tool" style="display: flex">
<pick-time v-model="searchTime" :refresh-data-func="queryChartDate" :use-chart-unit="false" :use-refresh="false" style="height: 28px;" @unitChange="chartUnitChange"></pick-time> <pick-time v-model="searchTimeDialog" :refresh-data-func="queryChartDate" :use-chart-unit="false" :use-refresh="false" style="height: 28px;" @unitChange="chartUnitChange"></pick-time>
</div> </div>
</div> </div>
<chart ref="messageChart" :unit="chartUnit" name="alertMessageChart"></chart> <chart ref="messageChart" :unit="chartUnit" name="alertMessageChart"></chart>
@@ -132,6 +132,7 @@ export default {
sameLabels: ['instance', 'module', 'project', 'asset', 'endpoint', 'datacenter'], sameLabels: ['instance', 'module', 'project', 'asset', 'endpoint', 'datacenter'],
legend: [], legend: [],
searchTime: [], searchTime: [],
searchTimeDialog: [],
searchTimeSelect: bus.getTimezontDateRange(), searchTimeSelect: bus.getTimezontDateRange(),
currentMsg: {}, currentMsg: {},
chartUnit: 5, chartUnit: 5,
@@ -193,7 +194,7 @@ export default {
return (key, value) => { return (key, value) => {
if (key == 'type') { if (key == 'type') {
if (value == 1) { if (value == 1) {
value = this.$t('project.project.project') value = this.$t('project.project.projectName')
} else if (value == 2) { } else if (value == 2) {
value = this.$t('module.module.module') value = this.$t('module.module.module')
} else if (value == 3) { } else if (value == 3) {
@@ -227,10 +228,12 @@ export default {
}) })
}, },
messageDetail (row) { messageDetail (row) {
this.currentMsg = { ...row } this.$get('/alert/rule/' + row.alertRule.id).then(res => {
this.graphShow = true this.currentMsg = { ...row, alertRule: { ...res.data } }
this.$nextTick(() => { this.graphShow = true
this.queryChartDate() this.$nextTick(() => {
this.queryChartDate()
})
}) })
}, },
queryMessage (alertMessage) { queryMessage (alertMessage) {
@@ -245,7 +248,7 @@ export default {
// const end = this.searchTime[1] ? this.searchTime[1] : getTime(0, 'h') // const end = this.searchTime[1] ? this.searchTime[1] : getTime(0, 'h')
const start = this.currentMsg.startAt const start = this.currentMsg.startAt
const end = this.currentMsg.endAt const end = this.currentMsg.endAt
this.searchTime = [start, end] this.searchTimeDialog = [start, end]
const timeDiff = (new Date(end).getTime() - new Date(start).getTime()) / 1000 / (24 * 60 * 60) const timeDiff = (new Date(end).getTime() - new Date(start).getTime()) / 1000 / (24 * 60 * 60)
let step = '15s' let step = '15s'
if (timeDiff < 1) { if (timeDiff < 1) {
@@ -321,7 +324,7 @@ export default {
chartData.name += '}' chartData.name += '}'
const legend = { const legend = {
name: chartData.name, name: chartData.name,
alias: alias, alias: chartData.name,
isGray: false isGray: false
} }
this.legend.push(legend) this.legend.push(legend)
@@ -342,7 +345,7 @@ export default {
this.$refs.messageChart.endLoading() this.$refs.messageChart.endLoading()
}) })
} catch (err) { } catch (err) {
this.$message.error(err) // this.$message.error(err)
this.$refs.messageChart.endLoading() this.$refs.messageChart.endLoading()
} }
}) })
@@ -410,13 +413,14 @@ export default {
promQueryParamConvert (obj) { promQueryParamConvert (obj) {
let r = '(' + obj.alertRule.expr + ')' let r = '(' + obj.alertRule.expr + ')'
let intoLabels = false let intoLabels = false
obj.labels = JSON.parse(obj.labels)
if (Object.keys(obj.labels).length > 0) { if (Object.keys(obj.labels).length > 0) {
r += (function () { r += (function () {
let group = ' and ' + '(group({' let group = ' and ' + '(group({'
let by = ' by (' let by = ' by ('
for (const k in obj.labels) { for (const k in obj.labels) {
if (k != 'alertname' && k != 'severity') { if (k != 'alertname' && k != 'severity' && k != 'severity_id') {
intoLabels = true intoLabels = true
group += k group += k
group += '=' group += '='
@@ -581,7 +585,26 @@ export default {
this.$refs.dataTable.$refs.dataTable.bodyWrapper.scrollTop = 0 this.$refs.dataTable.$refs.dataTable.bodyWrapper.scrollTop = 0
} }
this.getTableData() this.getTableData()
} },
computeDistance (str) {
let width = 0
const html = document.createElement('span')
html.innerText = str
html.className = 'getTextWidth'
document.querySelector('body').appendChild(html)
width = document.querySelector('.getTextWidth').offsetWidth
document.querySelector('.getTextWidth').remove()
return Number('-' + (width + 5))
},
returnMarkArea () {
if (this.currentMsg) {
if (this.currentMsg.alertRule.operator == '>' || this.currentMsg.alertRule.operator == '>=') {
return [{ yAxis: this.currentMsg.alertRule.threshold }, {}]
} else {
return [{}, { yAxis: this.currentMsg.alertRule.threshold }]
}
}
},
} }
} }
</script> </script>

46
nezha-fronted/src/components/page/asset/asset.vue
View File

@@ -10,30 +10,36 @@
@search="search" @search="search"
> >
<template v-slot:top-tool-right> <template v-slot:top-tool-right>
<button id="asset-filter" :class="{ 'is-focus': dataListLayout.indexOf('clickSearch') > -1 }" class="top-tool-btn margin-r-10" @click.stop="showClickSearch"> <button id="asset-create-asset" v-has="'asset_add'" :title="$t('overall.createAsset')" class="top-tool-btn" @click.stop="add">
<i class="nz-icon nz-icon-funnel"></i> <i class="nz-icon nz-icon-create-square"></i>
</button> </button>
<export-excel <top-tool-more-options
ref="export" id="model"
id="asset-list" :params="filter"
:params="searchLabel" :permissions="{
:permissions="{import: 'asset_add', export: 'asset_view'}" import: 'asset_add',
class="top-tool-export margin-r-10" export: 'asset_view'
export-file-name="asset" }"
class="top-tool-export margin-l-10 margin-r-10"
export-file-name="chart"
export-url="/asset/asset/export" export-url="/asset/asset/export"
import-url="/asset/asset/import" import-url="/asset/asset/import"
@afterImport="getTableData" @afterImport="getTableData"
> >
<template slot="optionZone"> <template v-slot:before>
<button id="asset-create-asset" v-has="'asset_add'" :title="$t('overall.createAsset')" class="top-tool-btn" @click.stop="add"> <div>
<i class="nz-icon nz-icon-create-square"></i> <el-dropdown-item>
</button> <div id="asset-batch-asset" v-has="'asset_edit'" @click.stop="batchEdit"><i class="nz-icon nz-icon-batch-edit"></i>{{$t('overall.batchEdit')}}</div>
</el-dropdown-item>
<el-dropdown-item>
<div id="asset-filte" :class="{ 'is-focus': dataListLayout.indexOf('clickSearch') > -1 }" v-has="'asset_edit'" @click.stop="showClickSearch"><i class="nz-icon nz-icon-funnel"></i>{{$t('overall.searchCondition')}}</div>
</el-dropdown-item>
<el-dropdown-item>
<delete-button :type="'link'" :title="$t('overall.batchDel')" id="asset-list-batch-delete" v-has="'asset_delete'" :api="url" :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true"></delete-button>
</el-dropdown-item>
</div>
</template> </template>
</export-excel> </top-tool-more-options>
<button id="asset-batch-asset" v-has="'asset_edit'" :title="$t('overall.batchEdit')" class="top-tool-btn margin-r-10" @click.stop="batchEdit">
<i class="nz-icon nz-icon-batch-edit"></i>
</button>
<delete-button id="asset-list-batch-delete" v-has="'asset_delete'" :api="url" :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true"></delete-button>
</template> </template>
<template v-slot:search> <template v-slot:search>
<click-search ref="clickSearch" :select-value.sync="selectValue" :title-search-list="titleSearchList" @reload="reloadTable"/> <click-search ref="clickSearch" :select-value.sync="selectValue" :title-search-list="titleSearchList" @reload="reloadTable"/>
@@ -85,7 +91,6 @@
</template> </template>
<script> <script>
import exportXLSX from '@/components/common/exportXLSX'
import deleteButton from '@/components/common/deleteButton' import deleteButton from '@/components/common/deleteButton'
import assetBox from '@/components/common/rightBox/asset/assetBox' import assetBox from '@/components/common/rightBox/asset/assetBox'
import assetBatchEditBox from '@/components/common/rightBox/asset/assetBatchEditBox' import assetBatchEditBox from '@/components/common/rightBox/asset/assetBatchEditBox'
@@ -93,6 +98,7 @@ import nzDataList from '@/components/common/table/nzDataList'
import dataListMixin from '@/components/common/mixin/dataList' import dataListMixin from '@/components/common/mixin/dataList'
import assetTable from '@/components/common/table/asset/assetTable' import assetTable from '@/components/common/table/asset/assetTable'
import clickSearch from '@/components/common/labelFilter/clickSearch' import clickSearch from '@/components/common/labelFilter/clickSearch'
import topToolMoreOptions from '@/components/common/popBox/topToolMoreOptions'
export default { export default {
name: 'asset', name: 'asset',
@@ -103,7 +109,7 @@ export default {
assetBatchEditBox, assetBatchEditBox,
assetTable, assetTable,
clickSearch, clickSearch,
'export-excel': exportXLSX topToolMoreOptions
}, },
mixins: [dataListMixin], mixins: [dataListMixin],
data () { data () {

2
nezha-fronted/src/components/page/dashboard/explore/explore.vue
View File

@@ -86,7 +86,7 @@
<div v-show="showIntroduce" class="introduce-view"> <div v-show="showIntroduce" class="introduce-view">
<div class="info-room"> <div class="info-room">
<div class="col-md-9 doc-content"> <div class="col-md-9 doc-content">
<h1 class="page-header">Query examples<a class="header-anchor" href="https://prometheus.io/docs/prometheus/latest/querying/examples/" target="_blank" rel="noopener norefferrer"><i style="font-size: 16px;" class="nz-icon nz-icon-link1"></i></a></h1> <h1 class="page-header">Query examples<a class="header-anchor" href="https://prometheus.io/docs/prometheus/latest/querying/examples/" target="_blank" rel="noopener noreferrer"><i style="font-size: 16px;" class="nz-icon nz-icon-link1"></i></a></h1>
<div class="content-divider"></div> <div class="content-divider"></div>
<h2 > <h2 >
Simple time series selection Simple time series selection

2
nezha-fronted/src/components/page/dashboard/overview/chartConfig.vue
View File

@@ -458,7 +458,7 @@ const tooltipPieOption = {
{ {
type: 'pie', type: 'pie',
animation: false, animation: false,
center: ['25%', '60%'], center: ['25%', '53%'],
radius: [36, 48], radius: [36, 48],
data: [], data: [],
label: { label: {

3
nezha-fronted/src/components/page/dashboard/overview/overview2.scss
View File

@@ -621,6 +621,9 @@
padding-bottom: 5px; padding-bottom: 5px;
box-shadow: 1px 2px 4px 0 rgba(0, 0, 0, 0.12), -1px 1px 4px -1px rgba(205, 205, 205, 0.47); box-shadow: 1px 2px 4px 0 rgba(0, 0, 0, 0.12), -1px 1px 4px -1px rgba(205, 205, 205, 0.47);
} }
#tooltip-chart--endpoint{
margin-bottom: 10px;
}
} }
} }
.over-num{ .over-num{

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

@@ -1,7 +1,7 @@
<template> <template>
<div class="panel list-page"> <div class="panel list-page">
<div class="main-list"> <div class="main-list">
<div class="main-container"> <div class="main-container" style="padding-right: 0">
<div class="top-tools"> <div class="top-tools">
<div v-if="panelData.length == 0" class="top-tool-left" style="margin-left: 10px;"> <div v-if="panelData.length == 0" class="top-tool-left" style="margin-left: 10px;">
<button id="panel-add-panel" class="nz-btn nz-btn-style-light nz-btn-size-small" @click="toAdd"><i class="nz-icon nz-icon-create-square"></i>&nbsp;&nbsp;{{$t("dashboard.panel.createPanelTitleSec")}}</button> <button id="panel-add-panel" class="nz-btn nz-btn-style-light nz-btn-size-small" @click="toAdd"><i class="nz-icon nz-icon-create-square"></i>&nbsp;&nbsp;{{$t("dashboard.panel.createPanelTitleSec")}}</button>

2
nezha-fronted/src/libs/bus.js
View File

@@ -103,7 +103,6 @@ export default new Vue({
'm+': time.getMinutes(), // 分 'm+': time.getMinutes(), // 分
's+': time.getSeconds(), // 秒 's+': time.getSeconds(), // 秒
'q+': Math.floor((time.getMonth() + 3) / 3), // 季度 'q+': Math.floor((time.getMonth() + 3) / 3), // 季度
a: time.getHours() > 12 ? 'pm' : 'am',
S: time.getMilliseconds(), // 毫秒 S: time.getMilliseconds(), // 毫秒
w: week w: week
} }
@@ -117,7 +116,6 @@ export default new Vue({
: ((`00${o[k]}`).substr((`${o[k]}`).length))) : ((`00${o[k]}`).substr((`${o[k]}`).length)))
} }
}) })
fm = fm.replace('h', time.getHours() > 12 ? time.getHours() - 12 : time.getHours())
return fm return fm
}, },
// 格式化tag为字符串表达式 // 格式化tag为字符串表达式