fix: asset弹框内交互bug修复

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

@@ -861,11 +861,11 @@
}
}
},
computed: {
/*computed: {
getData() {
return this.$store.state.assetData
}
},
},*/
watch: {
allModelUlData(newVal) {
if (newVal) {
@@ -961,7 +961,7 @@
if (response.code === 200) {
this.IDCOptionData = response.data.list;
this.markOptionData(this.IDCOptionData)
this.$store.state.assetData.idcData = this.IDCOptionData
//this.$store.state.assetData.idcData = this.IDCOptionData
this.$emit('refreshData');
}
})
@@ -1205,7 +1205,6 @@
type: 'warning'
}).then(() => {
this.$delete(data + "?ids=" + item).then(response => {
const h = this.$createElement;
if (response.code === 200) {
this.$message({duration: 2000, type: 'success', message: this.$t("tip.deleteSuccess")});
this.getAssetData();
@@ -1326,6 +1325,24 @@
}
},
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) {
if (data === 'close') {

View File

@@ -84,7 +84,7 @@
<span v-for="p in scope.row.paramObj">{{p.key}}={{p.value}}</span>
</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>
</template>
</el-table-column>

View File

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