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

fix: asset弹框bug修复、列表关联弹框bug修复

Browse Source 
1.asset弹框部分bug修复
2.关联弹框bug修复
This commit is contained in:
chenjinsong
2020-01-06 20:57:49 +08:00
parent e866023fe3
commit caeb1c0a84
11 changed files with 310 additions and 389 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
nezha-fronted/src/assets/css/main.css
View File

@@ -205,6 +205,35 @@ html {
margin-left: 270px;
padding: 0 15px 0 25px;
}
.content-right-option {
cursor: pointer;
display: inline-block;
margin-right: 6px;
}
.content-right-option i {
color: #6E7274;
}
.content-right-option i:hover {
color: #3E4244;
}
.content-right-option .el-icon-delete {
color: #F98D9A;
}
.content-right-option .el-icon-delete:hover {
color: #D96D7A;
}
.content-right-option .el-icon-view {
color: #60BEFF;
}
.content-right-option .el-icon-view:hover {
color: #409EFF;
}
.content-right-option .el-icon-edit-outline {
color: #6E7274;
}
.content-right-option .el-icon-edit-outline:hover {
color: #3E4244;
}
/* begin--顶部工具栏*/
.top-tools {
padding: 22px 0 13px 0;
@@ -392,10 +421,20 @@ html {
.pop-box {
border: 1px solid #DCDFE6;
border-radius: 4px;
padding: 2px 0 2px 5px;
padding: 2px 0;
}
.pop-box-asset {
height: 160px;
width: 247px;
}
.pop-box-asset li {
height: 24px;
line-height: 24px;
padding: 0 5px;
}
.pop-box-asset input {
vertical-align: top;
width: 90%;
}
.pop-box-active {
background-color: #d8d8d8;
@@ -417,7 +456,7 @@ html {
height: 100%;
}
.right-box-form>.el-form-item {
margin-bottom: 15px;
margin-bottom: 18px;
}
.right-box-form .el-select {
width: 100%;

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

@@ -128,7 +128,7 @@ const en = {
modelName:'New Model',
existModel:'Exist Model'
},
purchaseDate:'Purchase Date',
purchaseDate:'Purchase',
dataSelectTip:'please select data',
dc:'DC',
dcName:'DC Name',
@@ -193,7 +193,7 @@ const en = {
modelName:'新型号名称',
existModel:'已有型号'
},
purchaseDate:'购买日期',
purchaseDate:'Purchase',
dataSelectTip:'please select data',
dc:'DC',
dcName:'DC Name',
@@ -242,19 +242,19 @@ const en = {
},
tableTitle: {
id: 'ID',
assetType: '资产类型',
assetType: 'Asset Type',
device: 'SN',
host: 'Host',
assetState: 'State',
module: 'Module',
alert: 'Alert',
dataCenter: '数据中心',
cabinet: '机柜',
model: '型号',
manufacturer: '厂商',
procurementDate: '购买日期',
principal: '责任人',
principalTel: '责任人电话',
dataCenter: 'Data Center',
cabinet: 'Cabinet',
model: 'Model',
manufacturer: 'Vendor',
procurementDate: 'Purchase',
principal: 'Principal',
principalTel: 'Tel',
option: "Option"
},
tagTableTitle: {

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

@@ -208,9 +208,9 @@
}
},
methods: {
show(show,isEdit) {
show(show, isEdit) {
this.rightBox.show = show;
this.rightBox.isEdit=isEdit
this.rightBox.isEdit = isEdit;
},
/*关闭弹框*/
@@ -230,6 +230,7 @@
this.$message({duration: 1000, type: 'success', message: this.$t("tip.saveSuccess")});
this.$store.commit('moduleListChange');
this.rightBox.show = false;
this.$emit('reload');
} else {
this.$message.error(response.msg);
}

3
nezha-fronted/src/components/common/rightBox/projectBox.vue
View File

@@ -83,6 +83,7 @@
this.rightBox.show = false;
this.$store.commit('projectListChange');
this.$store.commit('setProject', this.project);
this.$emit('reload');
} else {
this.$message.error(response.msg);
}
@@ -107,7 +108,7 @@
saveOrToEdit: function() {
if (!this.rightBox.isEdit) {
this.rightBox.isEdit = true;
this.rightBox.title = this.$t("project.module.editProject") + " ID：" + this.project.id;
this.rightBox.title = this.$t("project.project.editProject") + " ID：" + this.project.id;
} else {
this.save();
}

63
nezha-fronted/src/components/page/alert/config.vue
View File

@@ -2,40 +2,6 @@
.account {
height: 100%;
}
.right-box::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
border-radius: 0;
background: rgba(0,0,0,0.1);
}
.right-box::-webkit-scrollbar-thumb {
border-radius: 5px;
-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
background: rgba(0,0,0,0.2);
}
.right-box::-webkit-scrollbar {
width: 4px;
height: 4px;
}
.right-box {
overflow: auto;
}
.account-list-option {
cursor: pointer;
display: inline-block;
margin-right: 6px;
}
.account-list-option .el-icon-delete {
color: #F98D9A;
}
.account-list-option .el-icon-delete:hover {
color: #D96D7A;
}
.account-list-option .el-icon-view {
color: #60BEFF;
}
.account-list-option .el-icon-view:hover {
color: #409EFF;
}
</style>
<template>
<div class="account">
@@ -69,9 +35,9 @@
>
<template slot-scope="scope" :column="item">
<div v-if="item.prop == 'option'" class="account-list-options">
<span @click="del(scope.row)" class="account-list-option"><i class="el-icon-delete"></i></span>
<span @click="detail(scope.row)" class="account-list-option"><i class="el-icon-view"></i></span>
<span @click="toEdit(scope.row)" class="account-list-option"><i class="el-icon-edit-outline"></i></span>
<span @click="del(scope.row)" class="content-right-option"><i class="el-icon-delete"></i></span>
<span @click="detail(scope.row)" class="content-right-option"><i class="el-icon-view"></i></span>
<span @click="toEdit(scope.row)" class="content-right-option"><i class="el-icon-edit-outline"></i></span>
</div>
<span v-else-if="item.prop == 'severity'">
<span v-if="scope.row[item.prop] == 'high'"><i class="el-icon-arrow-up"></i>&nbsp;{{severityData[1].value}}</span>
@@ -93,8 +59,8 @@
<Pagination :pageObj="pageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
</div>
<alert-config-box :parentAlertRule="alertRule" @reload="getTableData" ref="alertConfigBox"></alert-config-box>
<project-box :project="viewProjectData" ref="projectBox"></project-box>
<module-box :module="viewModuleData" @reload="" ref="moduleBox"></module-box>
<project-box :project="viewProjectData" ref="projectBox" @reload="getTableData"></project-box>
<module-box :module="viewModuleData" @reload="getTableData" ref="moduleBox"></module-box>
<asset-edit-unit :edit-unit-show='viewAsset' @refreshData="" @sendStateData="" ref="assetEditUnit"></asset-edit-unit>
</div>
@@ -227,9 +193,9 @@ export default {
}
],
tableData: [],
viewProjectData:null,
viewModuleData:null,
viewAsset:false,
viewProjectData: {},
viewModuleData: {},
viewAsset: false,
}
},
methods: {
@@ -320,29 +286,28 @@ export default {
}
this.getTableData();
},
viewAlertType:function(type,typeObj){
console.log(typeObj)
viewAlertType: function(type, typeObj){
this.closeViews();
switch (type) {
case 1:
this.viewProjectData=typeObj;
this.viewProjectData = JSON.parse(JSON.stringify(typeObj));
this.$refs.projectBox.show(true);
break;
case 2:
this.fillProject(typeObj);
let tempObj=JSON.parse(typeObj.param)
let tempObj = JSON.parse(typeObj.param)
this.$set(typeObj, 'paramObj', []);
for (let k in tempObj) {
typeObj.paramObj.push({key: k, value: tempObj[k]});
}
this.viewModuleData=typeObj;
this.viewModuleData = JSON.parse(JSON.stringify(typeObj));
this.$refs.moduleBox.show(true);
break;
case 3:
this.viewAsset=true;
this.viewAsset = true;
this.$refs.assetEditUnit.getAssetData(typeObj);
this.$refs.assetEditUnit.tabView=true;
this.$refs.assetEditUnit.tabView = true;
break;
}
},

30
nezha-fronted/src/components/page/alert/list.vue
View File

@@ -214,10 +214,10 @@
</el-table>
<Pagination :pageObj="pageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
</div>
<alert-config-box :parentAlertRule="viewRuleData" @reload="" ref="alertConfigBox"></alert-config-box>
<project-box :project="viewProjectData" ref="projectBox"></project-box>
<module-box :module="viewModuleData" @reload="" ref="moduleBox"></module-box>
<asset-edit-unit :edit-unit-show='viewAssetState' @refreshData="" @sendStateData="" ref="assetEditUnit"></asset-edit-unit>
<alert-config-box :parentAlertRule="viewRuleData" @reload="getAlertList" ref="alertConfigBox"></alert-config-box>
<project-box :project="viewProjectData" ref="projectBox" @reload="getAlertList"></project-box>
<module-box :module="viewModuleData" @reload="getAlertList" ref="moduleBox"></module-box>
<asset-edit-unit :edit-unit-show='viewAssetState' @refreshData="getAlertList" @sendStateData="" ref="assetEditUnit"></asset-edit-unit>
</div>
</template>
@@ -315,9 +315,21 @@ export default {
}
],
tableData: [],
viewRuleData:null,
viewProjectData:null,
viewModuleData:null,
viewRuleData: {
id: '',
alertName: '',
type: '',
linkObject: {id: '', name: ''},
linkId: '',
expr: '',
last: '',
severity: '',
summary: '',
description: '',
receiver: '',
},
viewProjectData: {id: '', name: '', remark: ''},
viewModuleData: {id: '', name: '', project: {}, port: '', path: '', param: '', paramObj: []},
viewAssetState:false,
}
},
@@ -373,7 +385,7 @@ export default {
this.closeViews();
switch (type) {
case 1:
this.viewProjectData=typeObj;
this.viewProjectData = JSON.parse(JSON.stringify(typeObj));
this.$refs.projectBox.show(true);
break;
case 2:
@@ -383,7 +395,7 @@ export default {
for (let k in tempObj) {
typeObj.paramObj.push({key: k, value: tempObj[k]});
}
this.viewModuleData=typeObj;
this.viewModuleData = JSON.parse(JSON.stringify(typeObj));
this.$refs.moduleBox.show(true);
break;

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

@@ -92,6 +92,7 @@
v-for="(item, index) in tableTitle"
v-if="item.show"
min-width="110"
:width="item.width"
:key="`col_${index}`"
:label="item.label"
>
@@ -110,7 +111,7 @@
<span>{{scope.row.host}}</span>
</div>
<div v-if="item.prop=='资产状态'">
<span>{{scope.row.state==1?'在库':'出库'}}</span>
<span>{{scope.row.state==1 ? $t('asset.createAssetTab.inStock') : $t('asset.createAssetTab.notInStock')}}</span>
</div>
<div v-if="item.prop=='Module'">
<div class="tab-input-square">{{scope.row.moduleNum}}</div>
@@ -139,26 +140,31 @@
<div v-if="item.prop=='责任人电话'">
<span>{{scope.row.idc.tel}}</span>
</div>
<div v-if="item.prop == 'option'">
<span @click="ssss(scope.row.id ,scope.row.host)" class="account-list-option"><i
class="el-icon-monitor"></i></span>
<span @click.stop="deleteData('asset',scope.row.id)" class="account-list-option"><i
class="el-icon-delete"></i></span>
<span @click.stop="tagShow('showEdit',scope.row.id)" class="account-list-option"><i
class="el-icon-edit-outline"></i></span>
<span @click.stop="tagShow('showView',scope.row.id)" class="account-list-option"><i
class="el-icon-view"></i></span>
<div v-if="item.prop == 'option'" class="content-right-options">
<span @click.stop="deleteData('asset',scope.row.id)" class="content-right-option"><i
class="el-icon-delete"></i>
</span>
<span @click.stop="tagShow('showView',scope.row.id)" class="content-right-option"><i
class="el-icon-view"></i>
</span>
<span @click.stop="tagShow('showEdit',scope.row.id)" class="content-right-option"><i
class="el-icon-edit-outline"></i>
</span>
<span @click="ssss(scope.row.id ,scope.row.host)" class="content-right-option"><i
class="el-icon-monitor"></i>
</span>
</div>
</template>
</el-table-column>
</el-table>
<Pagination :pageObj="pageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
</div>
<asset-add-unit :add-unit-show='addUnitShow' @refreshData="flushData"
@sendStateData="tabControl"></asset-add-unit>
<asset-edit-unit :edit-unit-show='editUnitShow' @refreshData="flushData" @sendStateData="tabControl"
ref="assetEditUnit"></asset-edit-unit>
</div>
</div>
</template>
<script>
@@ -207,6 +213,7 @@
label: this.$t("asset.tableTitle.host"),
prop: 'HOST',
show: true,
width: 130
}, {
label: this.$t("asset.tableTitle.assetState"),
prop: '资产状态',
@@ -591,7 +598,6 @@
width: 65px;
border-radius: 3px;
text-align: center;
margin-top: 6px;
line-height: 23px;
color: #aaaaaa;
}

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

@@ -14,14 +14,14 @@
<div class="right-box-title">{{$t('asset.createAssetTab.title')}}</div>
<el-scrollbar class="right-box-form-box">
<el-form :model="assetData" label-width="120px" class="right-box-form right-box-form-left">
<el-form-item :label="this.$t('asset.createAssetTab.sn')">
<el-form :model="assetData" label-width="120px" class="right-box-form right-box-form-left" :rules="rules" ref="addAssetForm">
<el-form-item :label="this.$t('asset.createAssetTab.sn')" prop="sn">
<el-input size="mini" v-model="assetData.sn" maxlength="64" show-word-limit/>
</el-form-item>
<el-form-item :label="this.$t('asset.createAssetTab.host')">
<el-form-item :label="this.$t('asset.createAssetTab.host')" prop="host">
<el-input size="mini" v-model="assetData.host"/>
</el-form-item>
<el-form-item :label="this.$t('asset.createAssetTab.state')">
<el-form-item :label="this.$t('asset.createAssetTab.state')" prop="state">
<el-select size="mini" v-model="assetData.state" placeholder="">
<el-option
v-for="item in assetStateOption"
@@ -34,7 +34,7 @@
<div class="asset-sub-title">{{$t('asset.createAssetTab.assetInfo')}}</div>
<div class="line-100 asset-line"></div>
<!------------------------------------------资产类型---------------------------------------------->
<el-form-item :label="this.$t('asset.createAssetTab.assetType')" prop="assetType" class="right-box-form-content">
<el-form-item :label="this.$t('asset.createAssetTab.assetType')" class="right-box-form-content" prop="assetType">
<el-select popper-class="asset-dropdown" size="mini" v-model="assetType" clearable @change="getAllModelOptionData" placeholder=""
@visible-change="cancelEdit" class="right-box-row-with-btn">
<el-option
@@ -114,7 +114,7 @@
</div>
</el-form-item>
<!------------------------------------------厂商/型号---------------------------------------------->
<el-form-item :label="this.$t('asset.createAssetTab.vendor')" class="right-box-form-content">
<el-form-item :label="this.$t('asset.createAssetTab.vendor')" class="right-box-form-content" prop="modelId">
<el-cascader
:options="vendorTypeOptionData"
:key="isResourceShow"
@@ -225,7 +225,7 @@
</el-popover>
</div>
</el-form-item>
<el-form-item :label="this.$t('asset.createAssetTab.purchaseDate')" prop="purchaseDate" class="right-box-form-content">
<el-form-item :label="this.$t('asset.createAssetTab.purchaseDate')" class="right-box-form-content">
<el-date-picker
size="mini"
v-model="assetData.purchaseDate"
@@ -238,7 +238,7 @@
<div class="asset-sub-title">{{$t('asset.createAssetTab.dc')}}</div>
<div class="line-100 asset-line"></div>
<!------------------------------------------IDC---------------------------------------------->
<el-form-item :label="this.$t('asset.createAssetTab.dcName')" class="right-box-form-content">
<el-form-item :label="this.$t('asset.createAssetTab.dcName')" class="right-box-form-content" prop="idcId">
<el-select popper-class="asset-dropdown" size="mini" v-model="assetData.idcId" clearable @change="getSingleIDCData" class="right-box-row-with-btn" placeholder="">
<el-option
v-for="item in IDCOptionData"
@@ -663,7 +663,8 @@
id: '',
sn: '',
host: '',
state: '',
assetType: '',
state: 1,
purchaseDate: '',
idcId: '',
cabinetId: '',
@@ -785,6 +786,23 @@
isResourceShow: 0,
modelClickData: '',
popState: true,
rules: {
sn: [
{required: true, message: this.$t('validate.required'), trigger: 'blur'}
],
host: [
{required: true, message: this.$t('validate.required'), trigger: 'blur'}
],
modelId: [
{required: true, message: this.$t('validate.required'), trigger: 'change'}
],
assetType: [
{required: true, message: this.$t('validate.required'), trigger: 'change'}
],
idcId: [
{required: true, message: this.$t('validate.required'), trigger: 'change'}
],
}
}
},
computed: {
@@ -799,12 +817,16 @@
}
},
assetType(newVal) {
this.assetData.assetType = newVal;
if (newVal == '') {
this.popState = true
} else {
this.popState = false
}
},
'assetData.idcId': function(n, o) {
this.addCabinetData.idcId = n;
}
},
methods: {
cancelEdit(data) {
@@ -892,6 +914,7 @@
})
},
getAllModelOptionData(data) {
this.assetData.assetType = this.assetType;
this.$get('model?typeCode=' + this.assetType).then(response => {
if (response.code === 200) {
this.allModelUlData = response.data.list
@@ -949,19 +972,16 @@
this.$put(data, item).then(res => {
const h = this.$createElement;
if (res.code === 200) {
this.$notify({
message: h('i', {style: 'color: teal'}, '修改成功'),
duration: 2000
})
this.getIDCOptionData()
this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
this.getAssetTypeOptionData();
this.getIDCOptionData();
this.getAllModelOptionData();
this.getCabinetOptionData('')
this.$emit('refreshData', 'true')
if (data === 'cabinet') {
this.getCabinetOptionData(item.idcId);
}
this.$emit('refreshData', 'true');
} else {
this.$notify({
message: h('i', {style: 'color: teal'}, res.msg),
duration: 2000
});
this.$message.error(res.msg);
}
})
},
@@ -970,17 +990,11 @@
this.$post('idc', this.addIdcData).then(res => {
const h = this.$createElement;
if (res.code === 200) {
this.$notify({
message: h('i', {style: 'color: teal'}, '添加成功'),
duration: 2000
});
this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
this.getIDCOptionData()
this.getAssetData()
} else {
this.$notify({
message: h('i', {style: 'color: teal'}, res.msg),
duration: 2000
});
this.$message.error(res.msg);
}
})
}
@@ -998,7 +1012,6 @@
if (type === 'asset') {
let modelId = ''
let authType = ''
console.log(this.assetData.modelId)
if (this.assetData.modelId !== '') {
modelId = this.assetData.modelId.join(',').split(',')[1]
} else {
@@ -1024,16 +1037,10 @@
this.$post('asset', form).then(res => {
const h = this.$createElement;
if (res.code === 200) {
this.$notify({
message: h('i', {style: 'color: teal'}, '添加成功'),
duration: 2000
});
this.sendStateData('close')
this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
this.sendStateData('close');
} else {
this.$notify({
message: h('i', {style: 'color: teal'}, res.msg),
duration: 2000
});
this.$message.error(res.msg);
}
})
this.$emit('refreshData', 'true')
@@ -1042,16 +1049,10 @@
const h = this.$createElement;
this.$post('sys/dict/save', this.addVendorData).then(res => {
if (res.code === 200) {
this.$notify({
message: h('i', {style: 'color: teal'}, '添加成功'),
duration: 2000
});
this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
this.getVendorOptionData()
} else {
this.$notify({
message: h('i', {style: 'color: teal'}, res.msg),
duration: 2000
});
this.$message.error(res.msg);
}
})
}
@@ -1062,17 +1063,11 @@
if (res.code === 200) {
this.getModelOptionData(this.assetType, this.vendorCode)
const h = this.$createElement;
this.$notify({
message: h('i', {style: 'color: teal'}, '添加成功'),
duration: 2000
});
this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
this.getAllModelOptionData(this.assetType)
} else {
const h = this.$createElement;
this.$notify({
message: h('i', {style: 'color: teal'}, res.msg),
duration: 2000
});
this.$message.error(res.msg);
}
})
}
@@ -1083,17 +1078,12 @@
this.$post('cabinet', this.addCabinetData).then(res => {
const h = this.$createElement;
if (res.code === 200) {
this.$notify({
message: h('i', {style: 'color: teal'}, '添加成功'),
duration: 2000
});
this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
this.getCabinetOptionData(this.addCabinetData.idcId)
this.popoverClose('cabinet')
this.popoverClose('cabinet');
this.editPopoverClose('cabinet');
} else {
this.$notify({
message: h('i', {style: 'color: teal'}, res.msg),
duration: 2000
});
this.$message.error(res.msg);
}
})
}
@@ -1136,6 +1126,9 @@
let resultData = []
let modelData = this.allModelUlData
for (let i = 0; i < modelData.length; i++) {
if (!modelData[i].vendor) {
continue;
}
let obj = {}
obj.id = modelData[i].vendor.id
obj.code = modelData[i].vendor.code
@@ -1154,11 +1147,14 @@
}
for (let x = 0; x < result.length; x++) {
for (let y = 0; y < modelData.length; y++) {
if (!modelData[y].vendor) {
continue;
}
if (result[x].code === modelData[y].vendor.code) {
let obj2 = {}
obj2.value = modelData[y].id
obj2.label = modelData[y].name
result[x].children.push(obj2)
let obj2 = {};
obj2.value = modelData[y].id;
obj2.label = modelData[y].name;
result[x].children.push(obj2);
}
}
}
@@ -1290,7 +1286,6 @@
item[item.name] = !item[item.name]
this.cabinetOptionData.forEach(items => {
if (items.id === data) {
console.log(items)
this.popCabinetData.name = items.name
this.popCabinetData.uSize = items.uSize
this.popCabinetData.remark = items.remark

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

@@ -3,7 +3,7 @@
<div class="right-box right-box-add-asset" v-if="editUnitShow" @click="editQuit">
<!--顶部按钮-->
<div class="right-box-top-btns">
<button v-if="!tabView" type="button" @click="" class="nz-btn nz-btn-size-normal nz-btn-style-light">
<button v-if="!tabView" type="button" @click="deleteData('asset', pageObj.id)" class="nz-btn nz-btn-size-normal nz-btn-style-light">
<span class="top-tool-btn-txt">{{$t('overall.delete')}}</span>
</button>
<button v-if="tabView" type="button" @click="tabView=false" class="nz-btn nz-btn-size-normal nz-btn-style-normal">
@@ -21,12 +21,12 @@
<div class="right-box-title">{{this.tabView == true ? $t('asset.asset') : $t('asset.EditAsset')}}</div>
<el-scrollbar class="right-box-form-box">
<el-form ref="form" :model="assetData" label-width="120px" class="right-box-form right-box-form-left">
<el-form-item :label="$t('asset.createAssetTab.sn')">
<el-form ref="form" :model="assetData" label-width="120px" class="right-box-form right-box-form-left" :rules="rules">
<el-form-item :label="$t('asset.createAssetTab.sn')" prop="sn">
<el-input size="mini" v-if="!tabView" v-model="assetData.sn"/>
<span v-if="tabView">{{assetData.sn}}</span>
</el-form-item>
<el-form-item :label="this.$t('asset.createAssetTab.host')">
<el-form-item :label="this.$t('asset.createAssetTab.host')" prop="host">
<el-input size="mini" v-if="!tabView" v-model="assetData.host"/>
<span v-if="tabView">{{assetData.host}}</span>
</el-form-item>
@@ -52,7 +52,7 @@
<div class="asset-sub-title">{{$t('asset.createAssetTab.assetInfo')}}</div>
<div class="line-100 asset-line"></div>
<!------------------------------------------资产类型---------------------------------------------->
<el-form-item :label="$t('asset.createAssetTab.assetType')" class="right-box-form-content">
<el-form-item :label="$t('asset.createAssetTab.assetType')" class="right-box-form-content" prop="assetType">
<el-select popper-class="asset-dropdown" size="mini" v-if="!tabView" v-model="assetType" clearable @visible-change="cancelEdit"
@change="getAllModelOptionData()" class="right-box-row-with-btn">
<el-option
@@ -115,9 +115,11 @@
<span class="config-dropdown-label-input" v-if="item.isEdit" @click.stop="editing">
<el-input class="input-x-mini" v-model="item.value"/>
</span>
<span class="config-dropdown-btn" @click.stop="editOptionData(item,'type',index)">
<i class="el-icon-edit-outline" v-if="!item.isEdit"></i>
<i class="el-icon-check" v-if="item.isEdit" @click="editData('sys/dict/update',item)"></i>
<span v-if="!item.isEdit" class="config-dropdown-btn" @click.stop="editOptionData(item,'type',index)">
<i class="el-icon-edit-outline"></i>
</span>
<span v-if="item.isEdit" class="config-dropdown-btn" @click.stop="editData('sys/dict/update',item, 'assetType')">
<i class="el-icon-check"></i>
</span>
<span class="config-dropdown-btn config-dropdown-btn-delete"
@click.stop="deleteData('/sys/dict/delete',item.id)"><i class="el-icon-delete"></i>
@@ -136,7 +138,7 @@
<span v-if="tabView">{{assetViewData.assetType}}</span>
</el-form-item>
<!------------------------------------------厂商/型号---------------------------------------------->
<el-form-item :label="this.$t('asset.createAssetTab.vendor')" class="right-box-form-content">
<el-form-item :label="this.$t('asset.createAssetTab.vendor')" class="right-box-form-content" prop="modelId">
<template v-if="!tabView">
<el-cascader
:options="vendorTypeOptionData"
@@ -259,7 +261,7 @@
<div class="asset-sub-title">{{$t('asset.createAssetTab.dc')}}</div>
<div class="line-100 asset-line"></div>
<!------------------------------------------IDC---------------------------------------------->
<el-form-item :label="this.$t('asset.createAssetTab.dcName')" class="right-box-form-content">
<el-form-item :label="this.$t('asset.createAssetTab.dcName')" class="right-box-form-content" prop="idcId">
<template v-if="!tabView">
<el-select popper-class="asset-dropdown" size="mini" v-model="assetData.idcId" clearable @change="getSingleIDCData" class="right-box-row-with-btn" placeholder="">
<el-option
@@ -427,10 +429,10 @@
<div class="pop-title">{{$t('asset.createAssetTab.editCabinetTab.title')}}</div>
<!--表单内容-->
<div class="pop-item-wider">
<el-form-item :label="$t('asset.editAssetTab.editCabinetTab.name')">
<el-form-item :label="$t('asset.editAssetTab.editCabinetTab.name')" prop="cabinet.name">
<el-input size="mini" v-model="popCabinetData.name"/>
</el-form-item>
<el-form-item :label="$t('asset.editAssetTab.editCabinetTab.uSize')">
<el-form-item :label="$t('asset.editAssetTab.editCabinetTab.uSize')" prop="cabinet.uSize">
<div>{{popCabinetData.uSize}}</div>
<el-slider v-model="popCabinetData.uSize" :max="47"></el-slider>
</el-form-item>
@@ -439,7 +441,7 @@
type="textarea"
:rows="2"/>
</el-form-item>
<el-form-item :label="$t('asset.editAssetTab.editCabinetTab.DC')">
<el-form-item :label="$t('asset.editAssetTab.editCabinetTab.DC')" prop="cabinet.idcId">
<el-select v-model="popCabinetData.idcId" clearable placeholder="" size="mini" style="width: 100%;">
<el-option
v-for="ite in item.children"
@@ -531,7 +533,7 @@
>
<div class="pop-window-assetType-content">
<div class="pop-top-btns">
<button type="button" @click="editData('idc',item,'CabIDC')" class="nz-btn nz-btn-size-small nz-btn-style-normal">
<button type="button" @click="addNewData('cabinet')" class="nz-btn nz-btn-size-small nz-btn-style-normal">
<span class="top-tool-btn-txt">{{$t('overall.save')}}</span>
</button>
<button type="button" @click="editPopoverClose('cabinet')" class="nz-btn nz-btn-size-small nz-btn-style-light nz-btn-style-square">
@@ -688,6 +690,8 @@
idcId: '',
cabinetId: '',
modelId: '',
assetType: '',
cabinet: {},
accounts: [{
id: '',
authType: '',
@@ -822,6 +826,23 @@
popState: true,
obj: null,
addUnitShow: false,
rules: {
sn: [
{required: true, message: this.$t('validate.required'), trigger: 'blur'}
],
host: [
{required: true, message: this.$t('validate.required'), trigger: 'blur'}
],
modelId: [
{required: true, message: this.$t('validate.required'), trigger: 'change'}
],
assetType: [
{required: true, message: this.$t('validate.required'), trigger: 'change'}
],
idcId: [
{required: true, message: this.$t('validate.required'), trigger: 'change'}
],
}
}
},
computed: {
@@ -832,55 +853,59 @@
watch: {
allModelUlData(newVal) {
if (newVal) {
this.getConnectData()
this.getConnectData();
if (this.pageObj.id != '') {
this.assetData.modelId = [this.obj.model.vendor.code, this.obj.model.id]
}
}
},
assetType(newVal) {
this.assetData.assetType = newVal;
if (newVal == '') {
this.popState = true
} else {
this.popState = false
}
},
'assetData.idcId': function(n, o) {
this.addCabinetData.idcId = n;
}
},
methods: {
cancelEdit(data) {
if (data === false) {
this.getAssetTypeOptionData()
this.getAssetTypeOptionData();
}
},
clickOutSide(data) {
if (data) {
this.editQuit()
this.modelCount = ''
this.editQuit();
this.modelCount = '';
}
},
editQuit() {
for (let i of this.assetTypeOptionData) {
if (i.isEdit === true) {
i.isEdit = false
this.getAssetTypeOptionData()
i.isEdit = false;
this.getAssetTypeOptionData();
}
}
for (let i of this.vendorUlData) {
if (i.isEdit === true) {
i.isEdit = false
this.getVendorOptionData()
i.isEdit = false;
this.getVendorOptionData();
}
}
for (let i of this.modelUlData) {
if (i.isEdit === true) {
i.isEdit = false
this.getModelOptionData(this.assetType, this.vendorCode)
i.isEdit = false;
this.getModelOptionData(this.assetType, this.vendorCode);
}
}
},
getAssetData(data) {
if (data !== undefined) {
this.pageObj.id = data
this.pageObj.id = data;
this.$get('asset', this.pageObj).then(response => {
if (response.code === 200) {
this.obj = response.data.list[0];
@@ -940,7 +965,6 @@
for (let i = 0; i < this.cabinetOptionData.length; i++) {
this.$set(this.cabinetOptionData[i], 'children', this.IDCOptionData)
}
console.log(this.cabinetOptionData)
}
})
},
@@ -969,7 +993,8 @@
})
},
getAllModelOptionData(data) {
this.$get('model?typeCode=' + this.assetType).then(response => {
this.assetData.assetType = this.assetType;
this.$get('model?typeCode=' + this.assetType + '&pageNo=1&pageSize=999').then(response => {
if (response.code === 200) {
this.allModelUlData = response.data.list
}
@@ -1009,17 +1034,12 @@
this.$put('asset', form).then(res => {
const h = this.$createElement;
if (res.code === 200) {
this.$notify({
message: h('i', {style: 'color: teal'}, '修改成功'),
duration: 2000
});
this.pageObj.id = ''
this.$emit('refreshData', 'true')
this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
this.pageObj.id = '';
this.$emit('refreshData', 'true');
this.sendStateData('close');
} else {
this.$notify({
message: h('i', {style: 'color: teal'}, res.msg),
duration: 2000
});
this.$message.error(res.msg);
}
})
} else {
@@ -1036,12 +1056,10 @@
item = obj
}
if (data === 'cabinet') {
item.name = this.popCabinetData.name
item.uSize = this.popCabinetData.uSize
item.remark = this.popCabinetData.remark
console.log(this.popCabinetData.idcId)
item.idcId = this.popCabinetData.idcId
console.log(item)
item.name = this.popCabinetData.name;
item.uSize = this.popCabinetData.uSize;
item.remark = this.popCabinetData.remark;
item.idcId = this.popCabinetData.idcId;
}
if (data === 'idc') {
idcData.id = item.id
@@ -1052,29 +1070,25 @@
item = idcData
}
if (mark === 'CabIDC') {
idcData.id = item.id
idcData.name = this.addCabIDCData.name
idcData.location = this.addCabIDCData.location
idcData.principal = this.addCabIDCData.principal
idcData.tel = this.addCabIDCData.tel
item = idcData
idcData.id = item.id;
idcData.name = this.addCabIDCData.name;
idcData.location = this.addCabIDCData.location;
idcData.principal = this.addCabIDCData.principal;
idcData.tel = this.addCabIDCData.tel;
item = idcData;
}
this.$put(data, item).then(res => {
const h = this.$createElement;
if (res.code === 200) {
this.$notify({
message: h('i', {style: 'color: teal'}, '修改成功'),
duration: 2000
})
this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
this.getIDCOptionData();
this.getCabinetOptionData('')
if (data === 'cabinet') {
this.getCabinetOptionData(item.idcId);
}
this.getAllModelOptionData();
this.getAssetTypeOptionData();
this.$emit('refreshData', 'true')
} else {
this.$notify({
message: h('i', {style: 'color: teal'}, res.msg),
duration: 2000
});
this.$message.error(res.msg);
}
})
}
@@ -1085,17 +1099,11 @@
this.$post('idc', this.addIdcData).then(res => {
if (res.code === 200) {
const h = this.$createElement;
this.$notify({
message: h('i', {style: 'color: teal'}, '添加成功'),
duration: 2000
});
this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
this.getIDCOptionData()
this.getAssetData()
} else {
this.$notify({
message: h('i', {style: 'color: teal'}, res.msg),
duration: 2000
});
this.$message.error(res.msg);
}
})
}
@@ -1104,15 +1112,9 @@
const h = this.$createElement;
if (res.code === 200) {
this.getAssetTypeOptionData()
this.$notify({
message: h('i', {style: 'color: teal'}, '添加成功'),
duration: 2000
});
this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
} else {
this.$notify({
message: h('i', {style: 'color: teal'}, res.msg),
duration: 2000
});
this.$message.error(res.msg);
}
})
}
@@ -1120,16 +1122,10 @@
const h = this.$createElement;
this.$post('sys/dict/save', this.addVendorData).then(res => {
if (res.code === 200) {
this.$notify({
message: h('i', {style: 'color: teal'}, '添加成功'),
duration: 2000
});
this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
this.getVendorOptionData()
} else {
this.$notify({
message: h('i', {style: 'color: teal'}, res.msg),
duration: 2000
});
this.$message.error(res.msg);
}
})
}
@@ -1140,16 +1136,10 @@
const h = this.$createElement;
if (res.code === 200) {
this.getModelOptionData(this.assetType, this.vendorCode)
this.$notify({
message: h('i', {style: 'color: teal'}, '添加成功'),
duration: 2000
});
this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
this.getAllModelOptionData(this.assetType)
} else {
this.$notify({
message: h('i', {style: 'color: teal'}, res.msg),
duration: 2000
});
this.$message.error(res.msg);
}
})
}
@@ -1158,68 +1148,70 @@
this.$post('cabinet', this.addCabinetData).then(res => {
const h = this.$createElement;
if (res.code === 200) {
this.$notify({
message: h('i', {style: 'color: teal'}, '添加成功'),
duration: 2000
});
this.getCabinetOptionData(this.addCabinetData.idcId)
this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
this.getCabinetOptionData(this.addCabinetData.idcId);
this.editPopoverClose('cabinet');
} else {
this.$notify({
message: h('i', {style: 'color: teal'}, res.msg),
duration: 2000
});
this.$message.error(res.msg);
}
})
}
},
deleteData(data, item) {
this.$confirm(this.$t("tip.confirmDelete"), {
confirmButtonText: this.$t("tip.yes"),
cancelButtonText: this.$t("tip.no"),
type: 'warning'
}).then(() => {
this.$delete(data + "?ids=" + item).then(response => {
const h = this.$createElement;
if (response.code === 200) {
this.$notify({
message: h('i', {style: 'color: teal'}, '删除成功'),
duration: 2000
});
this.getAssetData()
this.getIDCOptionData()
this.getVendorOptionData()
this.getCabinetOptionData(this.assetData.idcId)
this.getAllModelOptionData(this.assetType)
this.getModelOptionData(this.assetType, this.vendorCode)
this.$message({duration: 2000, type: 'success', message: this.$t("tip.deleteSuccess")});
this.getAssetData();
this.getIDCOptionData();
this.getVendorOptionData();
this.getCabinetOptionData(this.assetData.idcId);
this.getAllModelOptionData(this.assetType);
this.getModelOptionData(this.assetType, this.vendorCode);
if (data == 'asset') {
this.sendStateData('close');
}
} else {
this.$notify({
message: h('i', {style: 'color: teal'}, response.msg),
duration: 2000
});
this.$message.error(response.msg);
}
})
});
},
markOptionData(data) {
data.forEach(item => {
this.$set(item, 'isEdit', false);
this.$set(item, 'oldName', item.value);
this.$set(item, 'modelOldName', item.name);
this.$set(item, item.name, false)
this.$set(item, item.id, false)
this.$set(item, item.id + item.name, false)
this.$set(item, item.name + item.id, false)
this.$set(item, item.name, false);
this.$set(item, item.id, false);
this.$set(item, item.id + item.name, false);
this.$set(item, item.name + item.id, false);
})
},
getConnectData() {
this.isResourceShow += 1
let resultData = []
let modelData = this.allModelUlData
this.isResourceShow += 1;
let resultData = [];
let modelData = this.allModelUlData;
for (let i = 0; i < modelData.length; i++) {
let obj = {}
obj.id = modelData[i].vendor.id
obj.code = modelData[i].vendor.code
obj.value = modelData[i].vendor.code
obj.label = modelData[i].vendor.value
obj.children = []
resultData.push(obj)
if (!modelData[i].vendor) {
continue;
}
var result = [];
var obj1 = {};
let obj = {};
obj.id = modelData[i].vendor.id;
obj.code = modelData[i].vendor.code;
obj.value = modelData[i].vendor.code;
obj.label = modelData[i].vendor.value;
obj.children = [];
resultData.push(obj);
}
let result = [];
let obj1 = {};
for (let i = 0; i < resultData.length; i++) {
if (!obj1[resultData[i].id]) {
result.push(resultData[i]);
@@ -1228,6 +1220,9 @@
}
for (let x = 0; x < result.length; x++) {
for (let y = 0; y < modelData.length; y++) {
if (!modelData[y].vendor) {
continue;
}
if (result[x].code === modelData[y].vendor.code) {
let obj2 = {}
obj2.value = modelData[y].id
@@ -1341,13 +1336,12 @@
item[item.name] = !item[item.name]
this.cabinetOptionData.forEach(items => {
if (items.id === data) {
this.popCabinetData.name = items.name
this.popCabinetData.uSize = items.uSize
this.popCabinetData.remark = items.remark
this.popCabinetData.name = items.name;
this.popCabinetData.uSize = items.uSize;
this.popCabinetData.remark = items.remark;
this.popCabinetData.idcId = items.idcId;
}
})
console.log(this.cabinetOptionData)
}
},
getSingleAsset(data) {

35
nezha-fronted/src/components/page/config/account.vue
View File

@@ -2,41 +2,6 @@
.account {
height: 100%;
}
.content-right-option {
cursor: pointer;
display: inline-block;
margin-right: 6px;
}
.content-right-option .el-icon-delete {
color: #F98D9A;
}
.content-right-option .el-icon-delete:hover {
color: #D96D7A;
}
.content-right-option .el-icon-view {
color: #60BEFF;
}
.content-right-option .el-icon-view:hover {
color: #409EFF;
}
/* begin--右弹框滑入滑出动画*/
@keyframes slide-in-from-right {
from {right: -800px}
to {right: 0}
}
@keyframes slide-out-to-right {
from {right: 0}
to {right: -800px}
}
.right-box-enter-active {
animation: slide-in-from-right 0.4s;
}
.right-box-leave-active {
animation: slide-out-to-right 0.4s;
}
/* end--右弹框滑入滑出动画*/
</style>
<template>
<div class="account">

57
nezha-fronted/src/components/page/config/promServer.vue
View File

@@ -2,63 +2,6 @@
.prom {
height: 100%;
}
.prom .el-table {
border-radius: 5px;
}
.content-right-option {
cursor: pointer;
display: inline-block;
margin-right: 6px;
}
.content-right-option .el-icon-delete {
color: #F98D9A;
}
.content-right-option .el-icon-delete:hover {
color: #D96D7A;
}
.content-right-option .el-icon-view {
color: #60BEFF;
}
.content-right-option .el-icon-view:hover {
color: #409EFF;
}
.pop-window {
height: 370px;
width: 400px;
}
.pop-window-assetType {
height: 550px;
width: 400px;
}
.pop-window-assetType-content {
padding: 1px 15px 15px 20px;
}
.sidebar-pop-input {
position: absolute;
right: 50px;
width: 200px;
height: 26px;
border-radius: 4px;
border: 1px solid #DCDFE6;
color: #606266;
display: inline-block;
padding: 0px 15px;
}
.sidebar-pop-input-select {
position: absolute;
right: 83px;
width: 200px;
height: 26px;
border-radius: 4px;
border: 1px solid #DCDFE6;
color: #606266;
display: inline-block;
padding: 0px 15px;
}
</style>
<template>
<div class="prom">