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

fix: asset弹框内交互bug修复

Browse Source 
dc联动、各种操作点击交互bug
This commit is contained in:
chenjinsong
2020-01-08 09:16:34 +08:00
parent aaf608bb7d
commit 1763eee5df
8 changed files with 106 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -26,7 +26,7 @@
<el-input type="text" placeholder="" v-model="idc.location" size="mini"></el-input> <el-input type="text" placeholder="" v-model="idc.location" size="mini"></el-input>
</el-form-item> </el-form-item>
<el-form-item :label="$t('asset.createAssetTab.principal')" prop="principal"> <el-form-item :label="$t('asset.createAssetTab.principal')" prop="principal">
<el-select v-model="idc.principal" clearable size="mini"> <el-select v-model="idc.principal" clearable size="mini" placeholder="">
<el-option v-for="item in principals" :key="item.id" :label="item.username" :value="item.userId"></el-option> <el-option v-for="item in principals" :key="item.id" :label="item.username" :value="item.userId"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
@@ -108,7 +108,6 @@
} }
}, },
openBox:function(){ openBox:function(){
console.log("show")
this.popBox.show=true; this.popBox.show=true;
}, },
getUserData() { getUserData() {
@@ -125,7 +124,6 @@
if(valide){ if(valide){
const h = temp.$createElement; const h = temp.$createElement;
if(!temp.idc.id){ if(!temp.idc.id){
console.log("save")
temp.$post('idc', temp.idc).then(response => { temp.$post('idc', temp.idc).then(response => {
if (response.code === 200) { if (response.code === 200) {
temp.$message({duration: 1000, type: 'success', message: temp.$t("tip.deleteSuccess")}); temp.$message({duration: 1000, type: 'success', message: temp.$t("tip.deleteSuccess")});
@@ -136,7 +134,6 @@
} }
}) })
}else{ }else{
console.log("edit")
this.$put('idc', temp.idc).then(response => { this.$put('idc', temp.idc).then(response => {
if (response.code === 200) { if (response.code === 200) {
temp.$message({duration: 1000, type: 'success', message: temp.$t("tip.deleteSuccess")}); temp.$message({duration: 1000, type: 'success', message: temp.$t("tip.deleteSuccess")});
@@ -201,7 +198,6 @@
this.title = this.$t('asset.createAssetTab.AddIdcTab.title'); this.title = this.$t('asset.createAssetTab.AddIdcTab.title');
this.popBox.isEdit=false; this.popBox.isEdit=false;
this.resetData(); this.resetData();
console.log("reset")
} }
} }
}, },

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

@@ -57,7 +57,12 @@
<el-menu-item :index="'3-' + index"> <el-menu-item :index="'3-' + index">
<div @click="jumpToAsset('asset',item.id)"> <div @click="jumpToAsset('asset',item.id)">
<span>{{item.name}}</span> <span>{{item.name}}</span>
<el-popover <idc-config-box :post-idc="item" placement="left" @after="getIDCOptionData" :button-class="'menu-edit'">
<template v-slot:optionZone>
<i class="el-icon-edit-outline" @click="getIDCOptionData(item.id)" style="color: inherit"></i>
</template>
</idc-config-box>
<!--<el-popover
placement="bottom" placement="bottom"
v-model="item[item.name]" v-model="item[item.name]"
trigger="click" trigger="click"
@@ -118,7 +123,7 @@
<div @click.stop="getIDCOptionData(item.id)" slot="reference" class="menu-edit"> <div @click.stop="getIDCOptionData(item.id)" slot="reference" class="menu-edit">
<i style="color: inherit" class="el-icon-edit-outline"></i> <i style="color: inherit" class="el-icon-edit-outline"></i>
</div> </div>
</el-popover> </el-popover>-->
</div> </div>
</el-menu-item> </el-menu-item>
</template> </template>
@@ -334,8 +339,11 @@
} }
}, },
jumpToAsset(data, id) { jumpToAsset(data, id) {
this.$store.state.assetData.moduleData = data; if (id != this.$store.state.assetData.selectedData) {
this.$store.state.assetData.selectedData = id; this.$store.state.assetData = {selectedData: id, step: this.$store.state.assetData.step+1};
} else {
this.$store.state.assetData.step = this.$store.state.assetData.step+1;
}
this.jumpTo(data); this.jumpTo(data);
}, },
jumpToProject(p) { jumpToProject(p) {
@@ -723,3 +731,9 @@
border-bottom-right-radius: 8px; border-bottom-right-radius: 8px;
} }
</style> </style>
<style>
.menu-edit {
line-height: 36px;
float: right;
}
</style>

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

@@ -111,6 +111,7 @@ const en = {
}, },
tip: { tip: {
confirmDelete: "Confirm Delete?", confirmDelete: "Confirm Delete?",
assetConfirmDelete: 'Its associated Endpoints and Alert Rules will also be deleted, confirm delete?',
yes: "Yes", yes: "Yes",
no: "No", no: "No",
deleteSuccess: "Successfully Deleted", deleteSuccess: "Successfully Deleted",

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

@@ -4,7 +4,7 @@
<div class="sidebar-title">Asset</div> <div class="sidebar-title">Asset</div>
<div class="sidebar-info"> <div class="sidebar-info">
<!--<div class="sidebar-info-header">ALL</div>--> <!--<div class="sidebar-info-header">ALL</div>-->
<el-checkbox-group v-model="checkList" size="small" @change="getSingleAsset(checkList)"> <el-checkbox-group v-model="checkList" size="small" @change="getSingleAsset()">
<el-checkbox class="sidebar-info-item" :class="{'sidebar-info-item-active': checkList.indexOf(item.id) != -1}" <el-checkbox class="sidebar-info-item" :class="{'sidebar-info-item-active': checkList.indexOf(item.id) != -1}"
v-for="(item,key) in checkListData" :key="key" :label=item.id> v-for="(item,key) in checkListData" :key="key" :label=item.id>
<span>{{item.name}}</span> <span>{{item.name}}</span>
@@ -205,7 +205,8 @@
{ {
label: this.$t("asset.tableTitle.id"), label: this.$t("asset.tableTitle.id"),
prop: 'ID', prop: 'ID',
show: false, show: true,
width: 60
}, { }, {
label: this.$t("asset.tableTitle.assetType"), label: this.$t("asset.tableTitle.assetType"),
prop: '资产类型', prop: '资产类型',
@@ -328,10 +329,14 @@
}, },
watch: { watch: {
getData: { getData: {
handler(oldVal, newVal) { handler(newVal) {
this.checkList.splice(0, 1, newVal.selectedData); if (this.checkList.indexOf(newVal.selectedData) >= 0) {
this.pageObj.idcIds = newVal.selectedData; this.checkList.splice(this.checkList.indexOf(newVal.selectedData), 1);
this.getAssetData() } else {
this.checkList.push(newVal.selectedData);
}
this.getSingleAsset();
this.getAssetData();
}, },
deep: true, deep: true,
}, },
@@ -346,7 +351,7 @@
}, },
created() { created() {
this.checkList.push(this.$store.state.assetData.selectedData) this.checkList.push(this.$store.state.assetData.selectedData)
this.getSingleAsset(this.checkList) this.getSingleAsset()
}, },
methods: { methods: {
@@ -361,7 +366,8 @@
window.open(routeData.href); window.open(routeData.href);
}, },
getAssetData(data) { getAssetData(data) {
this.$get('asset', this.pageObj).then(response => { this.searchLabel = Object.assign(this.pageObj, this.searchLabel);
this.$get('asset', this.searchLabel).then(response => {
if (response.code === 200) { if (response.code === 200) {
this.tableData = response.data.list; this.tableData = response.data.list;
this.pageObj.total = response.data.total this.pageObj.total = response.data.total
@@ -388,59 +394,44 @@
item.name = this.addIdcData.popName item.name = this.addIdcData.popName
} }
this.$put(data, item).then(res => { this.$put(data, item).then(res => {
const h = this.$createElement;
if (res.code === 200) { if (res.code === 200) {
this.$notify({ this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
message: h('i', {style: 'color: teal'}, '修改成功'),
duration: 2000
});
this.getAssetData(); this.getAssetData();
} else { } else {
this.$notify({ this.$message.error(res.msg);
message: h('i', {style: 'color: teal'}, res.msg),
duration: 2000
})
} }
}) })
}, },
addNewData(type) { addNewData(type) {
if (type === 'IDC') { if (type === 'IDC') {
this.$post('idc', this.addIdcData).then(res => { this.$post('idc', this.addIdcData).then(res => {
const h = this.$createElement;
if (res.code === 200) { if (res.code === 200) {
const h = this.$createElement; const h = this.$createElement;
this.$notify({ this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
message: h('i', {style: 'color: teal'}, '添加成功'),
duration: 2000
});
this.getIDCOptionData() this.getIDCOptionData()
this.getAssetData() this.getAssetData()
} else { } else {
this.$notify({ this.$message.error(res.msg);
message: h('i', {style: 'color: teal'}, '添加成功'),
duration: 2000
});
} }
}) })
} }
}, },
deleteData(data, item) { deleteData(data, item) {
this.$delete(data + "?ids=" + item).then(response => { this.$confirm(this.$t("tip.assetConfirmDelete"), {
const h = this.$createElement; confirmButtonText: this.$t("tip.yes"),
if (response.code === 200) { cancelButtonText: this.$t("tip.no"),
this.$notify({ type: 'warning'
message: h('i', {style: 'color: teal'}, '删除成功'), }).then(() => {
duration: 2000 this.$delete(data + "?ids=" + item).then(response => {
}); if (response.code === 200) {
this.getAssetData() this.$message({duration: 2000, type: 'success', message: this.$t("tip.deleteSuccess")});
this.getIDCOptionData() this.getAssetData();
} else { this.getIDCOptionData();
this.$notify({ } else {
message: h('i', {style: 'color: teal'}, response.msg), this.$message.error(response.msg);
duration: 2000 }
}); })
} });
})
}, },
markOptionData(data) { markOptionData(data) {
data.forEach(item => { data.forEach(item => {
@@ -511,15 +502,16 @@
} }
} }
, ,
getSingleAsset(data) { getSingleAsset() {
let result = [] if (this.checkList.length > 0 ) {
if (data[0] === '') { if (this.checkList[0] === '') {
result = data.slice(1); this.checkList.splice(0, 1);
this.pageObj.idcIds = result.join(',') this.getSingleAsset();
} else { } else {
this.pageObj.idcIds = data.join(',') this.pageObj.idcIds = this.checkList.join(',');
}
this.getAssetData();
} }
this.getAssetData()
}, },
pageNo(val) { pageNo(val) {
this.pageObj.pageNo = val; this.pageObj.pageNo = val;
@@ -547,11 +539,18 @@
} }
}, },
flushData() { flushData() {
this.getSingleAsset();
this.getAssetData(); this.getAssetData();
this.getIDCOptionData(); this.getIDCOptionData();
}, },
search() { search(searchObj) {
this.searchLabel = {};
for (let item in searchObj) {
if (searchObj[item]) {
this.$set(this.searchLabel, item, searchObj[item]);
}
}
this.getAssetData();
} }
}, },
mounted() { mounted() {

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

@@ -822,11 +822,11 @@
} }
} }
}, },
computed: { /*computed: {
getData() { getData() {
return this.$store.state.assetData return this.$store.state.assetData
} }
}, },*/
watch: { watch: {
allModelUlData(newVal) { allModelUlData(newVal) {
if (newVal) { if (newVal) {
@@ -887,7 +887,7 @@
if (response.code === 200) { if (response.code === 200) {
this.IDCOptionData = response.data.list; this.IDCOptionData = response.data.list;
this.markOptionData(this.IDCOptionData) this.markOptionData(this.IDCOptionData)
this.$store.state.assetData.idcData = this.IDCOptionData; //this.$store.state.assetData.idcData = this.IDCOptionData;
this.$emit('refreshData'); this.$emit('refreshData');
} }
}) })
@@ -1263,7 +1263,7 @@
this.cabinetSelectedData.remark = '' this.cabinetSelectedData.remark = ''
}, },
editing(item) { editing(item) {
console.log(item) //console.log(item)
}, },
getSingleIDCData(data, item, itemData) { getSingleIDCData(data, item, itemData) {
if (item !== 'edit') { if (item !== 'edit') {

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

@@ -63,16 +63,16 @@
> >
<span v-if="!item.isEdit">{{ item.value }}</span> <span v-if="!item.isEdit">{{ item.value }}</span>
<span class="config-dropdown-label-input" v-if="item.isEdit" @click.stop="editing(item)"> <span class="config-dropdown-label-input" v-if="item.isEdit" @click.stop="editing(item)">
<el-input type="text" v-model="item.value" size="mini"/> <el-input type="text" v-model="item.value" size="mini"/>
</span> </span>
<span class="config-dropdown-btn" @click.stop="editOptionData(item,'type')"> <span class="config-dropdown-btn" @click.stop="editOptionData(item,'type')">
<i class="el-icon-edit-outline" v-if="!item.isEdit"></i> <i class="el-icon-edit-outline" v-if="!item.isEdit"></i>
<i class="el-icon-check" v-if="item.isEdit" <i class="el-icon-check" v-if="item.isEdit"
@click="editData('sys/dict/update',item)"></i> @click="editData('sys/dict/update',item)"></i>
</span> </span>
<span class="config-dropdown-btn config-dropdown-btn-delete" @click.stop="delOptionData(item)"> <span class="config-dropdown-btn config-dropdown-btn-delete" @click.stop="delOptionData(item)">
<i class="el-icon-delete"></i> <i class="el-icon-delete"></i>
</span> </span>
</el-option> </el-option>
</el-select> </el-select>
<div class="right-box-row-btn right-box-row-btn-small" v-if="!tabView"> <div class="right-box-row-btn right-box-row-btn-small" v-if="!tabView">
@@ -861,11 +861,11 @@
} }
} }
}, },
computed: { /*computed: {
getData() { getData() {
return this.$store.state.assetData return this.$store.state.assetData
} }
}, },*/
watch: { watch: {
allModelUlData(newVal) { allModelUlData(newVal) {
if (newVal) { if (newVal) {
@@ -961,7 +961,7 @@
if (response.code === 200) { if (response.code === 200) {
this.IDCOptionData = response.data.list; this.IDCOptionData = response.data.list;
this.markOptionData(this.IDCOptionData) this.markOptionData(this.IDCOptionData)
this.$store.state.assetData.idcData = this.IDCOptionData //this.$store.state.assetData.idcData = this.IDCOptionData
this.$emit('refreshData'); this.$emit('refreshData');
} }
}) })
@@ -1205,7 +1205,6 @@
type: 'warning' type: 'warning'
}).then(() => { }).then(() => {
this.$delete(data + "?ids=" + item).then(response => { this.$delete(data + "?ids=" + item).then(response => {
const h = this.$createElement;
if (response.code === 200) { if (response.code === 200) {
this.$message({duration: 2000, type: 'success', message: this.$t("tip.deleteSuccess")}); this.$message({duration: 2000, type: 'success', message: this.$t("tip.deleteSuccess")});
this.getAssetData(); this.getAssetData();
@@ -1326,6 +1325,24 @@
} }
}, },
delOptionData(data) { delOptionData(data) {
this.$confirm(this.$t("tip.confirmDelete"), {
confirmButtonText: this.$t("tip.yes"),
cancelButtonText: this.$t("tip.no"),
type: 'warning'
}).then(() => {
this.$delete("/sys/dict/delete?ids=" + data.id).then(response => {
if (response.code === 200) {
this.$message({duration: 2000, type: 'success', message: this.$t("tip.deleteSuccess")});
this.getAssetData();
this.getAssetTypeOptionData();
this.getVendorOptionData();
this.getAllModelOptionData(this.assetType);
this.getModelOptionData(this.assetType, this.vendorCode);
} else {
this.$message.error(response.msg);
}
})
});
}, },
tabControl(data) { tabControl(data) {
if (data === 'close') { if (data === 'close') {

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

@@ -84,7 +84,7 @@
<span v-for="p in scope.row.paramObj">{{p.key}}={{p.value}}，</span> <span v-for="p in scope.row.paramObj">{{p.key}}={{p.value}}，</span>
</span> </span>
<span v-else-if="item.prop == 'lastUpdate'">{{dateFormat(scope.row.lastUpdate)}}</span> <span v-else-if="item.prop == 'lastUpdate'">{{dateFormat(scope.row.lastUpdate)}}</span>
<span v-else-if="item.prop == 'state'">{{scope.row.state == 1 ? 'up' : ''}}{{scope.row.state == 0 ? 'down' : ''}}</span> <span v-else-if="item.prop == 'state'" :style="{color: scope.row.state == 0 ? 'red' : (scope.row.state == 0 ? 'green' : '')}">{{scope.row.state == 1 ? 'up' : ''}}{{scope.row.state == 0 ? 'down' : ''}}</span>
<span v-else>{{scope.row[item.prop]}}</span> <span v-else>{{scope.row[item.prop]}}</span>
</template> </template>
</el-table-column> </el-table-column>

3
nezha-fronted/src/store/index.js
View File

@@ -6,8 +6,7 @@ const store = new Vuex.Store({
state: { state: {
assetData:{ assetData:{
selectedData:'', selectedData:'',
moduleData:'', step: 0
idcData:''
}, },
currentProject: { currentProject: {
id: '', id: '',