fix: settings 细节问题

This commit is contained in:
@changcode
2021-04-30 15:12:34 +08:00
parent 918b9b60f1
commit 35062498f6
8 changed files with 135 additions and 158 deletions

View File

@@ -33,7 +33,7 @@
</el-form-item>
<!--authProtocol-->
<el-form-item :label='$t("config.assetType.authProtocol")' prop="authProtocol">
<el-select class="right-box__select" popper-class="right-box-select-dropdown prevent-clickoutside" v-model="editAssetType.authProtocol" placeholder="请选择">
<el-select class="right-box__select" popper-class="right-box-select-dropdown prevent-clickoutside" v-model="editAssetType.authProtocol" placeholder="Please select">
<el-option :key="option.value" v-for="option in assetConstants.assetType.authProtocolOptions" :value="option.value" :label="option.label"></el-option>
</el-select>
</el-form-item>

View File

@@ -2,7 +2,7 @@
<div v-clickoutside="{obj:editPromServer,func:clickOutside}" class="right-box right-box-prom">
<!-- begin--标题-->
<div class="right-box__header">
<div class="right-box__header">{{editPromServer.id ? ($t("config.promServer.editProm") + " ID" + editPromServer.id) : $t("config.promServer.createProm")}}</div>
<div class="header__title">{{editPromServer.id ? ($t("config.promServer.editProm") + " ID" + editPromServer.id) : $t("config.promServer.createProm")}}</div>
<div class="header__operation">
<span v-cancel="{obj: editPromServer, func: esc}"><i class="nz-icon nz-icon-close"></i></span>
</div>

View File

@@ -1,44 +1,31 @@
<template>
<transition name="right-box-580">
<div class="right-box right-box-asset" v-clickoutside="{obj:editAssetMeta,func:clickOutside}">
<!-- begin--顶部按钮-->
<div class="right-box-top-btns right-box-form-delete">
<button @click="del" class="nz-btn nz-btn-size-normal nz-btn-size-alien" id="alert-box-del" type="button"
v-has="'alert_silence_delete'" v-if="editAssetMeta.id">
<span class="right-box-top-btn-icon"><i class="nz-icon nz-icon-delete"></i></span>
<span class="right-box-top-btn-txt">{{$t('overall.delete')}}</span>
</button>
</div>
<!-- end--顶部按钮-->
<!-- begin--标题-->
<div class="right-box__header">
<div class="header__title">{{editAssetMeta.id ? $t("config.assetLabel.editMeta") + " ID" + editAssetMeta.id :
$t("config.assetLabel.addMeta")}}</div>
$t("config.assetLabel.addMeta")}}
</div>
<div class="header__operation">
<span v-cancel="{obj: editAssetMeta, func: esc}"><i class="nz-icon nz-icon-close"></i></span>
</div>
</div>
<!-- end--标题-->
<!-- begin--表单-->
<div class="right-box__container">
<el-form class="right-box-form right-box-form-left" label-width="120px" :model="editAssetMeta" label-position = "top" ref="editAssetMetaForm" :rules="rules">
<div class="container__form">
<el-form label-width="120px" :model="editAssetMeta" label-position = "top" ref="editAssetMetaForm" :rules="rules">
<el-form-item :label='$t("config.assetLabel.name")' prop="name">
<el-input placeholder="" show-word-limit v-model="editAssetMeta.name" size="small" id="editAssetMeta-box-input-name"></el-input>
</el-form-item>
<el-form-item :label='$t("config.assetLabel.key")' prop="metaKey">
<el-input placeholder="" show-word-limit v-model="editAssetMeta.metaKey" size="small" id="editAssetMeta-box-input-key"></el-input>
</el-form-item>
<el-form-item :label='$t("config.assetLabel.group")' prop="groupId">
<!-- <el-input placeholder="" show-word-limit v-model="editAssetMeta.group" size="small" id="editAssetMeta-box-input-group"></el-input>-->
<el-select v-model="editAssetMeta.groupId" size="small" :popper-class="'nz-meta-group-box'" :popper-append-to-body="false">
<el-select v-model="editAssetMeta.groupId" size="small" class="right-box__select" popper-class="right-box-select-dropdown prevent-clickoutside" :popper-append-to-body="false">
<el-option v-for="(item, index) in groupData" :key="index" :value="item.id" :label="item.name"></el-option>
</el-select>
</el-form-item>
<el-form-item :label='$t("config.assetLabel.search")' prop="search">
<!-- <el-input placeholder="" show-word-limit v-model="editAssetMeta.search" size="small" id="editAssetMeta-box-input-search"></el-input>-->
<el-switch
@change="switchSearch"
v-model="editAssetMeta.search"
@@ -47,9 +34,7 @@
:inactive-value="0">
</el-switch>
</el-form-item>
<el-form-item :label='$t("config.assetLabel.display")' prop="display">
<!-- <el-input placeholder="" show-word-limit v-model="editAssetMeta.display" size="small" id="editAssetMeta-box-input-display"></el-input>-->
<el-switch
v-model="editAssetMeta.display"
active-color="#ee9d3f"
@@ -57,7 +42,6 @@
:inactive-value="0">
</el-switch>
</el-form-item>
<el-form-item :label='$t("config.assetLabel.type")' prop="type">
<el-select v-model="editAssetMeta.type" size="small" class="right-box__select" placeholder='请选择' popper-class="right-box-select-dropdown prevent-clickoutside" :popper-append-to-body="false" @change="selectType">
<el-option v-for="(item, index) in typeData" :key="index" :value="item.value" :disabled="item.disabled">
@@ -65,7 +49,6 @@
</el-option>
</el-select>
</el-form-item>
<div class="right-box-sub-title" style="margin-bottom: 20px" v-if="showParam">
<span>{{$t('config.assetLabel.params')}}</span>
<span @click="addParam" class="float-right" style="height: 19px;display: inline-block;line-height: 1;" v-if="editAssetMeta.type!=='datetime'">
@@ -75,7 +58,6 @@
</span>
</div>
<el-form-item prop="param" v-if="showParam" class="asset-meta-param">
<!-- <el-input placeholder="" show-word-limit v-model="editAssetMeta.param" size="small" id="editAssetMeta-box-input-param"></el-input>-->
<div v-if="editAssetMeta.type==='radio' || editAssetMeta.type==='checkbox' || editAssetMeta.type==='select'" class="meta-option-box">
<el-row class="asset-meta-param-row asset-meta-param-header">
<el-col :span="12">
@@ -94,9 +76,7 @@
</el-col>
<el-col :span="6">
<el-radio v-if="editAssetMeta.type==='radio' || editAssetMeta.type==='select'" v-model = "item.check" :label="true" @change="radioChange(index)">{{$t('config.assetLabel.default')}}</el-radio>
<el-checkbox v-else v-model="item.check" @change="checkBoxChange"> {{$t('config.assetLabel.default')}}</el-checkbox>
</el-col>
<el-col :span="6">
<div class="">
@@ -110,7 +90,6 @@
</el-col>
</el-row>
</div>
<div v-if="editAssetMeta.type==='datetime'">
<el-row style="margin-bottom: 10px">
<span class="datetime-header">{{$t('config.assetLabel.dateType')}}: </span>
@@ -129,7 +108,6 @@
</el-switch>
</el-row>
</div>
<div v-if="editAssetMeta.type==='double'">
<el-row>
<span class="datetime-header">{{$t('config.assetLabel.decimals')}}: </span>
@@ -137,17 +115,16 @@
</el-row>
</div>
</el-form-item>
<el-form-item :label='$t("overall.remark")' prop="remark">
<el-input placeholder="" maxlength="512" type="textarea" show-word-limit v-model="editAssetMeta.remark" size="small" id="editAssetMeta-box-input-remark"></el-input>
</el-form-item>
<el-form-item :label='$t("config.assetLabel.example")'>
<assetTagEx :type="editAssetMeta.type" :param="editAssetMeta.param"/>
</el-form-item>
</el-form>
</div>
</div>
<!-- end--表单-->
<!-- begin--底部按钮-->

View File

@@ -2,7 +2,7 @@
<div class="right-box right-box-dc" v-clickoutside="{obj:editDc,func:clickOutside}">
<!-- begin--标题-->
<div class="right-box__header">
<div class="right-box__header">{{editDc.id ? ($t("config.dc.editDc") + " ID" + editDc.id) : $t("config.dc.createDc")}}</div>
<div class="header__title">{{editDc.id ? ($t("config.dc.editDc") + " ID" + editDc.id) : $t("config.dc.createDc")}}</div>
<div class="header__operation">
<span v-cancel="{obj: editDc, func: esc}"><i class="nz-icon nz-icon-close"></i></span>
</div>

View File

@@ -2,7 +2,7 @@
<div v-clickoutside="{obj:editExprTemp,func:clickOutside}" class="right-box right-box-alert-config">
<!-- begin--标题-->
<div class="right-box__header">
<div class="right-box__header">{{editExprTemp.id ? $t("config.exprTemp.edit") + " ID" + editExprTemp.id :
<div class="header__title">{{editExprTemp.id ? $t("config.exprTemp.edit") + " ID" + editExprTemp.id :
$t("config.exprTemp.create")}}
</div>
<div class="header__operation">

View File

@@ -2,7 +2,7 @@
<div class="right-box right-box-mib" v-clickoutside="{obj:editMib,func:clickOutside}" >
<!-- begin--标题-->
<div class="right-box__header">
<div class="right-box__header">{{editMib.id ? ($t("config.mib.editMib") + " ID" + editMib.id) : $t("config.mib.createMib")}}</div>
<div class="header__title">{{editMib.id ? ($t("config.mib.editMib") + " ID" + editMib.id) : $t("config.mib.createMib")}}</div>
<div class="header__operation">
<span v-cancel="{obj: editMib, func: esc}"><i class="nz-icon nz-icon-close"></i></span>
</div>

View File

@@ -2,7 +2,7 @@
<div class="right-box right-box-credential" v-clickoutside="{obj:editCredential,func:clickOutside}">
<!-- begin--标题-->
<div class="right-box__header">
<div class="right-box__header">{{editCredential.id ? ($t("config.mib.credential.edit") + " ID" + editCredential.id) : $t("config.mib.credential.create")}}</div>
<div class="header__title">{{editCredential.id ? ($t("config.mib.credential.edit") + " ID" + editCredential.id) : $t("config.mib.credential.create")}}</div>
<div class="header__operation">
<span v-cancel="{obj: editCredential, func: esc}"><i class="nz-icon nz-icon-close"></i></span>
</div>
@@ -17,14 +17,14 @@
<el-form-item :label='$t("config.mib.credential.remark")' prop="remark">
<el-input placeholder="" v-model="editCredential.remark" size="small" id="credential-box-input-remark"></el-input>
</el-form-item>
<el-form-item :label='$t("config.mib.credential.type")' prop="type" class="half-form-item">
<el-select v-model="editCredential.type" class="right-box-row-with-btn" placeholder="" id="credential-box-input-type" popper-class="chart-box-dropdown-small" @change="typeChange">
<el-form-item :label='$t("config.mib.credential.type")' prop="type">
<el-select v-model="editCredential.type" placeholder="" id="credential-box-input-type" class="right-box__select" popper-class="right-box-select-dropdown prevent-clickoutside" @change="typeChange">
<el-option v-for="item in $CONSTANTS.snmpProtocolTypes" :key="item.value" :label="item.label" :value="item.value">
<span class="panel-dropdown-label-txt" >{{item.label}}</span>
</el-option>
</el-select>
</el-form-item>
<el-form-item :label='$t("config.mib.credential.port")' prop="port" class="half-form-item" >
<el-form-item :label='$t("config.mib.credential.port")' prop="port" >
<el-input placeholder="" v-model.number="editCredential.port" size="small" id="credential-box-input-port"></el-input>
</el-form-item>
<el-form-item label='Read community' prop="readCommunity" v-if="editCredential.type ===1 || editCredential.type === 2">
@@ -33,38 +33,38 @@
<el-form-item label='Write community' prop="writeCommunity" v-if="editCredential.type ===1 || editCredential.type === 2">
<el-input placeholder="" v-model="editCredential.config.writeCommunity" size="small" id="credential-box-input-writeCommunity" type="password" show-password></el-input>
</el-form-item>
<el-form-item label="Username" prop="username" v-if="editCredential.type === 3" class="half-form-item">
<el-form-item label="Username" prop="username" v-if="editCredential.type === 3">
<el-input placeholder="" v-model="editCredential.config.username" size="small" id="credential-box-input-username"></el-input>
</el-form-item>
<el-form-item label="Content name" prop="contextname" v-if="editCredential.type === 3" class="half-form-item">
<el-form-item label="Content name" prop="contextname" v-if="editCredential.type === 3">
<el-input placeholder="" v-model="editCredential.config.contextname" size="small" id="credential-box-input-contextname"></el-input>
</el-form-item>
<div class="right-box-sub-title" v-if="editCredential.type === 3">{{$t('config.mib.credential.auth')}}</div>
<div style="margin-bottom: 20px;width: 100%"></div>
<el-form-item :label='$t("config.mib.credential.method")' prop="authProtocol" v-if="editCredential.type === 3" class="half-form-item">
<el-select v-model="editCredential.config.authProtocol" class="right-box-row-with-btn" placeholder="" id="credential-box-input-type" popper-class="chart-box-dropdown-small">
<el-form-item :label='$t("config.mib.credential.method")' prop="authProtocol" v-if="editCredential.type === 3">
<el-select v-model="editCredential.config.authProtocol" placeholder="" id="credential-box-input-type" class="right-box__select" popper-class="right-box-select-dropdown prevent-clickoutside">
<el-option v-for="item in $CONSTANTS.snmpAuthMethod" :key="item.value" :label="item.label" :value="item.value">
<span class="panel-dropdown-label-txt" >{{item.label}}</span>
</el-option>
</el-select>
</el-form-item>
<el-form-item :label='$t("config.mib.credential.pin")' prop="authPin" v-if="editCredential.type === 3" class="half-form-item">
<el-form-item :label='$t("config.mib.credential.pin")' prop="authPin" v-if="editCredential.type === 3">
<el-input placeholder="" v-model="editCredential.config.authPin" size="small" id="credential-box-input-authPin" type="password" show-password></el-input>
</el-form-item>
<div class="right-box-sub-title" v-if="editCredential.type === 3">{{$t('config.mib.credential.encryption')}}</div>
<div style="margin-bottom: 20px;width: 100%"></div>
<el-form-item :label='$t("config.mib.credential.method")' prop="privProtocol" v-if="editCredential.type === 3" class="half-form-item">
<el-select v-model="editCredential.config.privProtocol" class="right-box-row-with-btn" placeholder="" id="credential-box-input-type" popper-class="chart-box-dropdown-small" :disabled="!editCredential.config.authProtocol || editCredential.config.authProtocol === ''">
<el-form-item :label='$t("config.mib.credential.method")' prop="privProtocol" v-if="editCredential.type === 3">
<el-select v-model="editCredential.config.privProtocol" placeholder="" id="credential-box-input-type" class="right-box__select" popper-class="right-box-select-dropdown prevent-clickoutside" :disabled="!editCredential.config.authProtocol || editCredential.config.authProtocol === ''">
<el-option v-for="item in $CONSTANTS.snmpEncryptionMethod" :key="item.value" :label="item.label" :value="item.value">
<span class="panel-dropdown-label-txt" >{{item.label}}</span>
</el-option>
</el-select>
</el-form-item>
<el-form-item :label='$t("config.mib.credential.pin")' prop="privPin" v-if="editCredential.type === 3" class="half-form-item">
<el-form-item :label='$t("config.mib.credential.pin")' prop="privPin" v-if="editCredential.type === 3">
<el-input placeholder="" v-model="editCredential.config.privPin" size="small" id="credential-box-input-privPin" :disabled="!editCredential.config.authProtocol || editCredential.config.authProtocol === ''" type="password" show-password></el-input>
</el-form-item>
</el-form>

View File

@@ -197,7 +197,7 @@
<!-- varType -->
<el-form-item :label="$t('dashboard.panel.chartForm.varType')" v-if="from === 'temp'">
<el-select id="chart-box-group" v-model="editChart.varType" :disabled="!!editChart.id" class="form-item--end-with-btn" clearable placeholder="" popper-class="chart-box-dropdown-small prevent-clickoutside" size="small" value-key="chartType">
<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>
</el-option>