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

NEZ-356 feat：asset左侧天机设备总数量

Browse Source
This commit is contained in:
zhangyu
2020-07-17 19:00:00 +08:00
parent 81ef842a12
commit 24f185f672
2 changed files with 61 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
nezha-fronted/src/assets/stylus/main.scss
View File

@@ -491,10 +491,11 @@ li{
} }
.sidebar-info-item-txt { .sidebar-info-item-txt {
display: inline-block; display: inline-block;
width: 120px; width: 100px;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
vertical-align: middle;
} }
.side-bar-menu-edit { .side-bar-menu-edit {
line-height: 20px; line-height: 20px;
@@ -871,8 +872,8 @@ li{
transform: scaleX(1); transform: scaleX(1);
opacity: 1; opacity: 1;
transition: transform .5s transition: transform .5s
cubic-bezier(.23, 1, .32, 1), opacity .5s cubic-bezier(.23, 1, .32, 1), opacity .5s
cubic-bezier(.23, 1, .32, 1); cubic-bezier(.23, 1, .32, 1);
transform-origin: right center; transform-origin: right center;
} }
.right-box-enter, .right-box-leave-active { .right-box-enter, .right-box-leave-active {

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

@@ -11,11 +11,12 @@
<el-checkbox class="sidebar-info-item" :class="{'sidebar-info-item-active': indOf(checkList, item.id)}" <el-checkbox class="sidebar-info-item" :class="{'sidebar-info-item-active': indOf(checkList, item.id)}"
v-for="(item,key) in checkListData" :key="key" :label=item.id> v-for="(item,key) in checkListData" :key="key" :label=item.id>
<div class="sidebar-info-item-txt"> <div class="sidebar-info-item-txt">
<el-popover v-if="item.name.length > 16" trigger="hover" placement="top-start" :content="item.name" > <el-popover v-if="item.name.length > 14" trigger="hover" placement="top-start" :content="item.name" >
<span slot="reference">{{item.name}}</span> <span slot="reference">{{item.name}}</span>
</el-popover> </el-popover>
<span v-else>{{item.name}}</span> <span v-else>{{item.name}}</span>
</div> </div>
<el-badge class="mark" :value="item.total" max="99"/>
</el-checkbox> </el-checkbox>
</el-checkbox-group> </el-checkbox-group>
</el-collapse-item> </el-collapse-item>
@@ -23,11 +24,12 @@
<el-checkbox-group v-model="assetTypeCheckList" size="small" @change="changeAssetTypeCheckBox"> <el-checkbox-group v-model="assetTypeCheckList" size="small" @change="changeAssetTypeCheckBox">
<el-checkbox class="sidebar-info-item" :class="{'sidebar-info-item-active': indOf(assetTypeCheckList, item.id)}" v-for="(item,key) in assetTypeCheckListData" :key="key" :label=item.id> <el-checkbox class="sidebar-info-item" :class="{'sidebar-info-item-active': indOf(assetTypeCheckList, item.id)}" v-for="(item,key) in assetTypeCheckListData" :key="key" :label=item.id>
<div class="sidebar-info-item-txt"> <div class="sidebar-info-item-txt">
<el-popover v-if="item.value.length > 16" trigger="hover" placement="top-start" :content="item.value" > <el-popover v-if="item.name.length > 14" trigger="hover" placement="top-start" :content="item.name" >
<span slot="reference">{{item.value}}</span> <span slot="reference">{{item.name}}</span>
</el-popover> </el-popover>
<span v-else>{{item.value}}</span> <span v-else>{{item.name}}</span>
</div> </div>
<el-badge class="mark" :value="item.total" max="99"/>
</el-checkbox> </el-checkbox>
</el-checkbox-group> </el-checkbox-group>
</el-collapse-item> </el-collapse-item>
@@ -35,11 +37,12 @@
<el-checkbox-group v-model="vendorCheckList" size="small" @change="changeVendorCheckBox"> <el-checkbox-group v-model="vendorCheckList" size="small" @change="changeVendorCheckBox">
<el-checkbox class="sidebar-info-item" :class="{'sidebar-info-item-active': indOf(vendorCheckList, item.id)}" v-for="(item,key) in vendorCheckListData" :key="key" :label=item.id> <el-checkbox class="sidebar-info-item" :class="{'sidebar-info-item-active': indOf(vendorCheckList, item.id)}" v-for="(item,key) in vendorCheckListData" :key="key" :label=item.id>
<div class="sidebar-info-item-txt"> <div class="sidebar-info-item-txt">
<el-popover v-if="item.value.length > 16" trigger="hover" placement="top-start" :content="item.value" > <el-popover v-if="item.name.length > 14" trigger="hover" placement="top-start" :content="item.name" >
<span slot="reference">{{item.value}}</span> <span slot="reference">{{item.name}}</span>
</el-popover> </el-popover>
<span v-else>{{item.value}}</span> <span v-else>{{item.name}}</span>
</div> </div>
<el-badge class="mark" :value="item.total" max="99"/>
</el-checkbox> </el-checkbox>
</el-checkbox-group> </el-checkbox-group>
</el-collapse-item> </el-collapse-item>
@@ -52,6 +55,7 @@
</el-popover> </el-popover>
<span v-else>{{item.label}}</span> <span v-else>{{item.label}}</span>
</div> </div>
<el-badge class="mark" :value="item.total" max="99"/>
</el-checkbox> </el-checkbox>
</el-checkbox-group> </el-checkbox-group>
</el-collapse-item> </el-collapse-item>
@@ -464,7 +468,7 @@
getFlushData: { getFlushData: {
handler(newVal, oldVal) { handler(newVal, oldVal) {
if (newVal === true) { if (newVal === true) {
this.getIDCOptionData(); this.getLeftMenuList();
this.getAssetData() this.getAssetData()
} }
} }
@@ -601,28 +605,15 @@
this.$refs.assetEditUnit.getIDCOptionData(); this.$refs.assetEditUnit.getIDCOptionData();
} }
}, },
getIDCOptionData() { // getIDCOptionData() {
this.$get('idc').then(response => { // this.$get('idc').then(response => {
if (response.code === 200) { // if (response.code === 200) {
this.checkListData = this.IDCOptionData = response.data.list; // // console.log(response.data);
this.markOptionData(this.IDCOptionData) // // this.checkListData = this.IDCOptionData = response.data.list;
} // // this.markOptionData(this.IDCOptionData)
}) // }
}, // })
getAssetTypeData:function(){ // },
this.$get('sys/dict/all?type=assetType').then(response => {
if (response.code === 200) {
this.assetTypeCheckListData = response.data
}
})
},
getVendorData:function(){
this.$get('sys/dict/all?type=vendor').then(response => {
if (response.code === 200) {
this.vendorCheckListData = response.data
}
})
},
getPingData:function(){ getPingData:function(){
this.pingCheckListData=[ this.pingCheckListData=[
{label:'up',value:1}, {label:'up',value:1},
@@ -665,7 +656,7 @@
if (res.code === 200) { if (res.code === 200) {
const h = this.$createElement; const h = this.$createElement;
this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")}); this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
this.getIDCOptionData() this.getLeftMenuList()
this.getAssetData() this.getAssetData()
} else { } else {
this.$message.error(res.msg); this.$message.error(res.msg);
@@ -683,7 +674,7 @@
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();
this.getIDCOptionData(); this.getLeftMenuList();
} else { } else {
this.$message.error(response.msg); this.$message.error(response.msg);
} }
@@ -855,9 +846,6 @@
flushData() { flushData() {
this.getSingleAsset(); this.getSingleAsset();
this.getAssetData(); this.getAssetData();
this.getIDCOptionData();
this.getAssetTypeData();
this.getVendorData();
}, },
closeAllPop:function(){ closeAllPop:function(){
this.$refs.idcConfigBox.forEach((item)=>{ this.$refs.idcConfigBox.forEach((item)=>{
@@ -993,7 +981,28 @@
} }
this.$set(this.searchLabel, "orderBy", orderBy); this.$set(this.searchLabel, "orderBy", orderBy);
this.getAssetData(); this.getAssetData();
} },
// 获取左侧菜单数据
getLeftMenuList(){
this.$get('asset/filter').then(response => {
if (response.code === 200) {
console.log(response.data);
//dc
this.checkListData = this.IDCOptionData = response.data.dc;
this.markOptionData(this.IDCOptionData);
// AssetType
this.assetTypeCheckListData = response.data.assetType;
// vendor
this.vendorCheckListData = response.data.vendor;
// ping
this.pingCheckListData= response.data.ping.map(item=>{
item.label=item.name;
item.value=item.status;
return item
})
}
})
},
}, },
created() { created() {
this.getUserData(); this.getUserData();
@@ -1001,6 +1010,7 @@
this.getPingData(); this.getPingData();
}, },
mounted() { mounted() {
this.getLeftMenuList()//获取左侧菜单列表
//是否存在分页缓存 //是否存在分页缓存
let pageSize = localStorage.getItem('nz-pageSize-' + localStorage.getItem('nz-username') + '-' + this.tableId); let pageSize = localStorage.getItem('nz-pageSize-' + localStorage.getItem('nz-username') + '-' + this.tableId);
if (pageSize != 'undefined' && pageSize != null) { if (pageSize != 'undefined' && pageSize != null) {
@@ -1086,4 +1096,15 @@
.link{ .link{
position: relative; position: relative;
} }
/deep/ .el-badge__content{
width: 15px;
}
.mark{
vertical-align: middle;
display: inline-flex;
}
/*/deep/ .sidebar-info-item .el-checkbox__label{*/
/*padding-right: 15px;*/
/*width: calc(100% - 32px);*/
/*}*/
</style> </style>