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

NEZ-2816 feat：页面权限添加 国际化调整 以及编辑框的完善

Browse Source
This commit is contained in:
zhangyu
2023-05-15 14:26:56 +08:00
parent 41405e8617
commit c1f00b2f1f
4 changed files with 176 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
nezha-fronted/src/assets/css/components/common/rightBox/asset/assetDiscoveryBox.scss
View File

@@ -2,7 +2,7 @@
.schedule-type { .schedule-type {
.el-radio-group { .el-radio-group {
width: 100%; width: 100%;
.el-radio-button--medium { .el-radio-button--small {
width: 25%; width: 25%;
.el-radio-button__inner { .el-radio-button__inner {
display: inline-block; display: inline-block;
@@ -11,8 +11,57 @@
} }
.el-radio-button__orig-radio:checked + .el-radio-button__inner{ .el-radio-button__orig-radio:checked + .el-radio-button__inner{
background: unset !important; background: unset !important;
color: $--color-warning; color: $--color-warning !important;
} }
} }
} }
//.el-form-item__content .el-checkbox-button.line-feed {
//
//}
//.el-form-item__content .el-checkbox-button.line-feed .el-checkbox-button__inner{
// //border-top: 0;
// margin-top: -2px;
//}
.months-box {
width: 100%;
height: 176px;
//border-bottom:1px solid #ddd;
//border-right:1px solid #ddd;
position: relative;
.right-border {
height: 176px;
border-right: 1px solid #ddd;
position: absolute;
top: 0;
right: 0;
}
.bottom-border {
width: 100%;
border-bottom: 1px solid #ddd;
position: absolute;
bottom: 1px;
left: 0;
}
}
.days-item {
width: calc(100% / 7 + 1px) !important;
text-align: center;
float: left;
border:1px solid #ddd;
height: 36px;box-sizing: border-box;
line-height: 36px;
margin-left: -1px;
margin-top: -1px;
cursor: pointer;
transition: all .5s;
}
.days-item-1,.days-item-8,.days-item-15,.days-item-22,.days-item-29 {
//margin-left: 0;
}
.days-item.is-checked{
z-index: 1;
background: $--color-warning;
border-color: $--border-select-color;
color: $--color-white;
}
} }

124
nezha-fronted/src/components/common/rightBox/asset/assetDiscoveryBox.vue
View File

@@ -2,7 +2,7 @@
<div v-clickoutside="{obj:editAssetDiscovery,func:clickOutside}" class="right-box right-box-prom asset-discovery-right-box"> <div v-clickoutside="{obj:editAssetDiscovery,func:clickOutside}" class="right-box right-box-prom asset-discovery-right-box">
<!-- begin--标题--> <!-- begin--标题-->
<div class="right-box__header"> <div class="right-box__header">
<div class="header__title">{{editAssetDiscovery.id ? ($t("config.agent.editProm")) : $t("overall.createPrometheusServer")}}</div> <div class="header__title">{{editAssetDiscovery.id ? ($t("asset.discoveryAdd")) : $t("asset.discoveryEdit")}}</div>
<div class="header__operation"> <div class="header__operation">
<span v-cancel="{obj: editAssetDiscovery, func: esc}"><i class="nz-icon nz-icon-close" :title="$t('overall.close')"></i></span> <span v-cancel="{obj: editAssetDiscovery, func: esc}"><i class="nz-icon nz-icon-close" :title="$t('overall.close')"></i></span>
</div> </div>
@@ -11,7 +11,7 @@
<!-- begin--表单--> <!-- begin--表单-->
<div class="right-box__container"> <div class="right-box__container">
<div class="container__form"> <div class="container__form">
<el-form ref="agentForm" :model="editAssetDiscovery" :rules="rules" label-position = "top" label-width="120px"> <el-form ref="assetDiscoveryForm" :model="editAssetDiscovery" :rules="rules" label-position = "top" label-width="120px">
<!-- name--> <!-- name-->
<el-form-item :label='$t("overall.name")' prop="name"> <el-form-item :label='$t("overall.name")' prop="name">
<el-input placeholder="" maxlength="64" show-word-limit v-model="editAssetDiscovery.name" size="small" id="asset-discovery-box-input-name"></el-input> <el-input placeholder="" maxlength="64" show-word-limit v-model="editAssetDiscovery.name" size="small" id="asset-discovery-box-input-name"></el-input>
@@ -39,24 +39,56 @@
<!-- schedule.type--> <!-- schedule.type-->
<el-form-item :label='$t("alert.config.schedEnable")' prop="schedule.type" class="schedule-type"> <el-form-item :label='$t("alert.config.schedEnable")' prop="schedule.type" class="schedule-type">
<!-- <el-input placeholder="" maxlength="64" show-word-limit v-model="editAssetDiscovery.schedule.type" size="small" id="asset-discovery-box-input-type"></el-input>--> <!-- <el-input placeholder="" maxlength="64" show-word-limit v-model="editAssetDiscovery.schedule.type" size="small" id="asset-discovery-box-input-type"></el-input>-->
<el-radio-group v-model="editAssetDiscovery.schedule.type" size="medium"> <el-radio-group v-model="editAssetDiscovery.schedule.type" size="small" @change="changeType">
<el-radio-button :label="1">One time only</el-radio-button> <el-radio-button :label="1">{{$t('backup.only')}}</el-radio-button>
<el-radio-button :label="2">Daily</el-radio-button> <el-radio-button :label="2">{{$t('backup.Daily')}}</el-radio-button>
<el-radio-button :label="3">Weekly</el-radio-button> <el-radio-button :label="3">{{$t('backup.Weekly')}}</el-radio-button>
<el-radio-button :label="4">Monthly</el-radio-button> <el-radio-button :label="4">{{$t('backup.Monthly')}}</el-radio-button>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
<!-- schedule.stime --> <!-- schedule.stime -->
<el-form-item :label='$t(" Start at")' prop="schedule.stime"> <el-form-item :label='$t("asset.discoveryStartAt")' prop="schedule.stime">
<el-input placeholder="" maxlength="64" show-word-limit v-model="editAssetDiscovery.schedule.stime" size="small" id="asset-discovery-box-input-stime"></el-input> <my-date-picker
v-model="editAssetDiscovery.schedule.stime"
type="datetime"
style="width: 100%"
size="small"
placeholder="Start time"
:value-format="timeFormatStrToDatePickFormat()"
:format="timeFormatStrToDatePickFormat()"
>
</my-date-picker>
</el-form-item> </el-form-item>
<!-- schedule.repeat --> <!-- schedule.repeat -->
<el-form-item :label='$t("Repeat every")' prop="schedule.repeat"> <el-form-item :label='$t("asset.discoveryRepeatEvery")' prop="schedule.repeat" v-if="editAssetDiscovery.schedule.type === 2 || editAssetDiscovery.schedule.type === 3">
<el-input placeholder="" maxlength="64" show-word-limit v-model="editAssetDiscovery.schedule.repeat" size="small" id="asset-discovery-box-input-repeat"></el-input> <el-input placeholder="" v-model.number="editAssetDiscovery.schedule.repeat" size="small" id="asset-discovery-box-input-repeat">
<template slot="append">{{editAssetDiscovery.schedule.type === 2? $t('backup.day') : $t('el.datepicker.week')}}</template>
</el-input>
</el-form-item> </el-form-item>
<!-- schedule.nums --> <!-- schedule.nums -->
<el-form-item :label='$t("nums")' prop="schedule.nums"> <el-form-item :label='$t("backup.WeekOn")' prop="schedule.nums" v-if="editAssetDiscovery.schedule.type === 3">
<el-input placeholder="" maxlength="64" show-word-limit v-model="editAssetDiscovery.schedule.nums" size="small" id="asset-discovery-box-input-nums"></el-input> <el-checkbox-group v-model="editAssetDiscovery.schedule.nums" size="medium" @change="clearNumsError()">
<el-checkbox-button v-for="num in weeks" :label="num" :key="num">{{weekStr[num]}}</el-checkbox-button>
</el-checkbox-group>
</el-form-item>
<el-form-item :label='$t("backup.DayOfMonth")' prop="schedule.nums" v-if="editAssetDiscovery.schedule.type === 4">
<div class="months-box">
<div
@click="checkItem(num)"
v-for="num in months"
:label="num"
:key="num"
class='days-item'
:class="{
'is-checked': editAssetDiscovery.schedule.nums.indexOf(num) !== -1,
'line-feed': num > 7
}"
>
{{num < 32 ? num : $t('asset.discoveryLast')}}
</div>
<div class="right-border"></div>
<div class="bottom-border"></div>
</div>
</el-form-item> </el-form-item>
<!--remark--> <!--remark-->
<el-form-item :label="$t('overall.remark')"> <el-form-item :label="$t('overall.remark')">
@@ -81,7 +113,7 @@
</div> </div>
</template> </template>
<script> <script>
import { noSpecialChar } from '@/components/common/js/validate' import { noSpecialChar, arrLength } from '@/components/common/js/validate'
import editRigthBox from '@/components/common/mixin/editRigthBox' import editRigthBox from '@/components/common/mixin/editRigthBox'
export default { export default {
name: 'agentBox', name: 'agentBox',
@@ -112,11 +144,23 @@ export default {
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } { required: true, message: this.$t('validate.required'), trigger: 'blur' }
], ],
'schedule.nums': [ 'schedule.nums': [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } { required: true, message: this.$t('validate.required'), trigger: 'blur' },
{ validator: noSpecialChar, trigger: 'blur' }
] ]
}, },
editAssetDiscovery: {}, editAssetDiscovery: {},
credentialData: [] credentialData: [],
weeks: 7,
weekStr: [
this.$t('week.Mon'),
this.$t('week.Tue'),
this.$t('week.Wed'),
this.$t('week.Thu'),
this.$t('week.Fri'),
this.$t('week.Sat'),
this.$t('week.Sun')
],
months: 32
} }
}, },
created () { created () {
@@ -137,13 +181,49 @@ export default {
clickOutside () { clickOutside () {
this.esc(false) this.esc(false)
}, },
clearNumsError () {
this.$refs.assetDiscoveryForm.clearValidate('schedule.nums')
},
checkItem (num) {
this.$refs.assetDiscoveryForm.clearValidate('schedule.nums')
if (this.editAssetDiscovery.schedule.nums.indexOf(num) !== -1) {
this.editAssetDiscovery.schedule.nums = this.editAssetDiscovery.schedule.nums.filter(item => item != num)
} else {
this.editAssetDiscovery.schedule.nums.push(num)
}
},
changeType () {
this.$refs.assetDiscoveryForm.clearValidate('schedule.nums')
this.$refs.assetDiscoveryForm.clearValidate('schedule.repeat')
switch (this.editAssetDiscovery.schedule.type) {
case 1:
this.editAssetDiscovery.schedule.repeat = ''
this.editAssetDiscovery.schedule.nums = []
break
case 2:
this.editAssetDiscovery.schedule.repeat = 1
this.editAssetDiscovery.schedule.nums = []
break
case 3:
this.editAssetDiscovery.schedule.repeat = 1
this.editAssetDiscovery.schedule.nums = []
break
case 4:
this.editAssetDiscovery.schedule.repeat = ''
this.editAssetDiscovery.schedule.nums = []
break
}
},
/* 保存 */ /* 保存 */
save () { save () {
this.$refs.agentForm.validate(valid => { this.$refs.assetDiscoveryForm.validate(valid => {
if (valid) { if (valid) {
this.prevent_opt.save = true this.prevent_opt.save = true
console.log(this.editAssetDiscovery)
const params = this.$loadsh.cloneDeep(this.editAssetDiscovery)
params.schedule.stime = this.momentStrToTimestamp(params.schedule.stime)
if (this.editAssetDiscovery.id) { if (this.editAssetDiscovery.id) {
this.$put('/tool/discovery', this.editAssetDiscovery).then(response => { this.$put('/tool/discovery', params).then(response => {
if (response.code === 200) { if (response.code === 200) {
this.$message({ duration: 1000, type: 'success', message: this.$t('tip.saveSuccess') }) this.$message({ duration: 1000, type: 'success', message: this.$t('tip.saveSuccess') })
this.esc(true) this.esc(true)
@@ -153,7 +233,7 @@ export default {
this.prevent_opt.save = false this.prevent_opt.save = false
}) })
} else { } else {
this.$post('/tool/discovery', this.editAssetDiscovery).then(response => { this.$post('/tool/discovery', params).then(response => {
if (response.code === 200) { if (response.code === 200) {
this.$message({ duration: 1000, type: 'success', message: this.$t('tip.saveSuccess') }) this.$message({ duration: 1000, type: 'success', message: this.$t('tip.saveSuccess') })
this.esc(true) this.esc(true)
@@ -173,7 +253,11 @@ export default {
assetDiscovery: { assetDiscovery: {
immediate: true, immediate: true,
handler (n) { handler (n) {
this.editAssetDiscovery = this.$loadsh.cloneDeep(n) const editAssetDiscovery = this.$loadsh.cloneDeep(n)
if (editAssetDiscovery.schedule && editAssetDiscovery.schedule.stime) {
editAssetDiscovery.schedule.stime = this.momentTz(editAssetDiscovery.schedule.stime)
}
this.editAssetDiscovery = this.$loadsh.cloneDeep(editAssetDiscovery)
} }
} }
} }

19
nezha-fronted/src/components/common/table/asset/assetDiscoveryTable.vue
View File

@@ -66,15 +66,16 @@
<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.stop><i class="nz-icon nz-icon-view1"></i></button>--> <!-- <button class="table-operation-item" @click.stop><i class="nz-icon nz-icon-view1"></i></button>-->
<button class="table-operation-item" @click="$emit('showBottomBox', 'assetDiscoveryTab', scope.row)" :title="$t('overall.view')"><i class="nz-icon nz-icon-view1"></i></button> <button class="table-operation-item" v-has="['asset_discovery_view']" @click="$emit('showBottomBox', 'assetDiscoveryTab', scope.row)" :title="$t('overall.view')"><i class="nz-icon nz-icon-view1"></i></button>
<el-dropdown size="medium" v-has="['asset_label_edit','asset_label_delete']" trigger="click" @command="tableOperation"> <el-dropdown size="medium" v-has="['asset_discovery_edit','asset_label_delete']" trigger="click" @command="tableOperation">
<div class="table-operation-item table-operation-item--more" :title="$t('overall.moreOperations')"> <div class="table-operation-item table-operation-item--more" :title="$t('overall.moreOperations')">
<i class="nz-icon nz-icon-more3"></i> <i class="nz-icon nz-icon-more3"></i>
</div> </div>
<el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top"> <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
<el-dropdown-item v-has="'asset_label_edit'" :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 v-has="'asset_discovery_edit'" :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 v-has="'asset_label_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>--> <!-- <el-dropdown-item v-has="'asset_label_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>-->
<el-dropdown-item v-has="'asset_label_delete'" :command="['delete-rel', scope.row, {forceDeleteShow:false, single:true}]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> <el-dropdown-item v-has="'asset_discovery_del'" :command="['delete-rel', scope.row, {forceDeleteShow:false, single:true}]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
<el-dropdown-item v-has="'asset_discovery_edit'" :command="['force', scope.row]"><i class="nz-icon nz-icon-a-Diagnosisresult"></i><span class="operation-dropdown-text">{{$t('asset.discoveryForce')}}</span></el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
</el-dropdown> </el-dropdown>
</div> </div>
@@ -220,15 +221,15 @@ export default {
statusToStr (status) { statusToStr (status) {
switch (status) { switch (status) {
case '1' : case '1' :
return 'Saving' return this.$t('asset.discoverySaving')
case '2' : case '2' :
return 'Running' return this.$t('asset.discoveryRunning')
case '3' : case '3' :
return 'Scheduled' return this.$t('asset.discoveryScheduled')
case '4' : case '4' :
return 'Failed' return this.$t('asset.discoveryFailed')
case '5' : case '5' :
return 'Finished' return this.$t('asset.discoveryFinished')
} }
} }
} }

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

@@ -10,7 +10,7 @@
@search="search" @search="search"
> >
<template v-slot:top-tool-right> <template v-slot:top-tool-right>
<button id="meta-add-meta" v-has="'asset_label_add'" :title="$t('overall.createLabel')" class="top-tool-btn margin-r-10" <button id="meta-add-meta" v-has="'asset_discovery_edit'" :title="$t('overall.createLabel')" class="top-tool-btn margin-r-10"
type="button" @click="add"> type="button" @click="add">
<i class="nz-icon nz-icon-create-square"></i> <i class="nz-icon nz-icon-create-square"></i>
</button> </button>
@@ -21,15 +21,15 @@
:params="searchLabel" :params="searchLabel"
:params2="searchCheckBox" :params2="searchCheckBox"
:permissions="{ :permissions="{
import: 'asset_add', import: 'asset_discovery_edit',
export: 'asset_edit' export: 'asset_discovery_view'
}" }"
class="top-tool-export margin-l-10 margin-r-10" class="top-tool-export margin-l-10 margin-r-10"
export-file-name="asset" export-file-name="asset"
export-url="/asset/asset/export" export-url="/asset/asset/export"
import-url="/asset/asset/import" import-url="/asset/asset/import"
@afterImport="getTableData" @afterImport="getTableData"
v-has="['asset_add','asset_edit','asset_delete']" v-has="['asset_discovery_view','asset_discovery_edit','asset_discovery_el']"
> >
<template v-slot:before> <template v-slot:before>
<div> <div>
@@ -43,7 +43,7 @@
:type="'link'" :type="'link'"
:title="$t('overall.batchDel')" :title="$t('overall.batchDel')"
id="asset-list-batch-delete" id="asset-list-batch-delete"
v-has="'asset_delete'" v-has="'asset_discovery_del'"
:api="url" :api="url"
:delete-objs="batchDeleteObjs" :delete-objs="batchDeleteObjs"
@after="getTableData" @after="getTableData"
@@ -66,6 +66,7 @@
@del="del" @del="del"
@edit="edit" @edit="edit"
@copy="copy" @copy="copy"
@force="force"
@orderBy="tableDataSort" @orderBy="tableDataSort"
@reload="getTableData" @reload="getTableData"
@selectionChange="selectionChange" @selectionChange="selectionChange"
@@ -154,9 +155,9 @@ export default {
snmpCredentialIds: '', snmpCredentialIds: '',
schedule: { schedule: {
type: 1, type: 1,
stime: '2021-01-10 10:10:10', stime: '',
repeat: 1, repeat: 1,
nums: [1, 2, 3, 4, 5, 6, 7] nums: []
} }
}, },
blankMetaGroup: { blankMetaGroup: {
@@ -194,6 +195,9 @@ export default {
} }
this.rightBox.metaShow = true this.rightBox.metaShow = true
}, },
force (item) {
console.log(item)
},
closeRightBox (refresh) { closeRightBox (refresh) {
this.rightBox.show = false this.rightBox.show = false
if (refresh) { if (refresh) {