monitor_v3 / hg-monitor-web · Commits

Go to a project

Authored by xwx
Commit 0ad61b56b3cb78fd5dc90eb9ecb78dd3bec6ce97 1 parent 351b26d5

快照管理、快照概览所属业务系统及所属业务系统负责人弹框展示

Inline Side-by-side
Showing 4 changed files with 153 additions and 47 deletions
... ... @@ -89,31 +89,45 @@
</el-tooltip>
</div>
<div v-if="prop == 'busTypeName'">
<div v-if="row.busTypeName != null && row.busTypeName.indexOf(',') != -1" v-for="item in row.busTypeName.split(',')">
<el-tooltip placement="top">
<template #content>{{item}}</template>
<el-tag style="margin: 2px;" type="info" class="mx-1" effect="light">{{item}}</el-tag>
</el-tooltip>
<div v-if="(row.busTypeName || '').split(',').length <= '3'">
<div v-if="row.busTypeName != null && row.busTypeName.indexOf(',') != -1" v-for="item in row.busTypeName.split(',')">
<el-tooltip placement="top">
<template #content>{{item}}</template>
<el-tag style="margin: 2px;" type="info" class="mx-1" effect="light">{{item}}</el-tag>
</el-tooltip>
</div>
<div v-else-if="row.busTypeName != null && row.busTypeName.indexOf(',') == -1 ">
<el-tooltip placement="top">
<template #content>{{row.busTypeName}}</template>
<el-tag type="info" class="mx-1" effect="light">{{row.busTypeName}}</el-tag>
</el-tooltip>
</div>
</div>
<div v-else-if="row.busTypeName != null && row.busTypeName.indexOf(',') == -1 ">
<el-tooltip placement="top">
<template #content>{{row.busTypeName}}</template>
<el-tag type="info" class="mx-1" effect="light">{{row.busTypeName}}</el-tag>
</el-tooltip>
<div v-else>
<el-button @click="goBus(row)" size="small" type="text">
<span>共计：{{row.nickname.split(',').length}}个业务</span>
</el-button>
</div>
</div>
<div v-if="prop == 'nickname'">
<div v-if="row.nickname != null && row.nickname.indexOf(',') != -1" v-for="item in row.nickname.split(',')">
<el-tooltip placement="top">
<template #content>{{item}}</template>
<el-tag style="margin: 2px;" type="info" class="mx-1" effect="light">{{item}}</el-tag>
</el-tooltip>
<div v-if="(row.nickname || '').split(',').length <= '3'">
<div v-if="row.nickname != null && row.nickname.indexOf(',') != -1" v-for="item in row.nickname.split(',')">
<el-tooltip placement="top">
<template #content>{{item}}</template>
<el-tag style="margin: 2px;" type="info" class="mx-1" effect="light">{{item}}</el-tag>
</el-tooltip>
</div>
<div v-else-if="row.nickname != null && row.nickname.indexOf(',') == -1 ">
<el-tooltip placement="top">
<template #content>{{row.nickname}}</template>
<el-tag type="info" class="mx-1" effect="light">{{row.nickname}}</el-tag>
</el-tooltip>
</div>
</div>
<div v-else-if="row.nickname != null && row.nickname.indexOf(',') == -1 ">
<el-tooltip placement="top">
<template #content>{{row.nickname}}</template>
<el-tag type="info" class="mx-1" effect="light">{{row.nickname}}</el-tag>
</el-tooltip>
<div v-else>
<el-button @click="goBus(row)" size="small" type="text">
<span>共计：{{row.nickname.split(',').length}}个业务负责人</span>
</el-button>
</div>
</div>
<div v-if="prop == 'admin'">
... ... @@ -148,4 +162,13 @@
</div>
</div>
<cm-dialog :showDialogVisible="showBus" :showFooter="false" :title="title" @hidedialog="cancelBtn"
width="700px">
<template v-slot>
<div class="dialog">
<div v-model="busType" v-for="item in busType" style="display: inline-block">
<el-tag type="info" class="mx-1" effect="light">{{item}}</el-tag>
</div>
</div>
</template>
</cm-dialog>
... ...
... ... @@ -52,14 +52,14 @@ export default {
label: '所属业务系统',
sortable: true,
align: 'center',
width: '280'
width: '270'
},
{
prop: 'nickname',
label: '业务系统负责人',
sortable: true,
align: 'center',
width: '140'
width: '150'
},
{
prop: 'createUser',
... ... @@ -135,6 +135,9 @@ export default {
let bizCharts = Vue.ref('')
let devCharts = Vue.ref('')
let snapshotCharts = Vue.ref('')
let showBus = Vue.ref(false);
let title = Vue.ref('');
let busType = Vue.ref();
let getEcharts = ()=>{
bizCharts = echarts.init(bizChartsRefs.value);
let bizOption = {
... ... @@ -407,6 +410,26 @@ export default {
proxy.$global.openDetail(row.resId, row.resType, proxy);
}
//查看业务系统
let goBus = (row) => {
title.value = row.resName+'所属业务系统信息';
let busTypeAdmin = [];
for (let i = 0; i < row.busTypeName.split(',').length; i++) {
for (let j = 0; j < row.nickname.split(',').length; j++) {
if (i==j){
busTypeAdmin.push(row.busTypeName.split(',')[i]+'('+row.nickname.split(',')[i]+')')
}
}
}
busType.value = busTypeAdmin;
showBus.value = true;
}
//关闭弹框
let cancelBtn = () => {
showBus.value = false;
}
Vue.onMounted(()=>{
getEcharts();
getDataList();
... ... @@ -432,7 +455,12 @@ export default {
loaddata,
handleDel,
handleDetail,
goResDetail
goResDetail,
goBus,
showBus,
cancelBtn,
title,
busType
}
}
}
... ...
... ... @@ -73,31 +73,45 @@
</el-tooltip>
</div>
<div v-if="prop == 'busTypeName'">
<div v-if="row.busTypeName != null && row.busTypeName.indexOf(',') != -1" v-for="item in row.busTypeName.split(',')">
<el-tooltip placement="top">
<template #content>{{item}}</template>
<el-tag style="margin: 2px;" type="info" class="mx-1" effect="light">{{item}}</el-tag>
</el-tooltip>
<div v-if="(row.busTypeName || '').split(',').length <= '3'">
<div v-if="row.busTypeName != null && row.busTypeName.indexOf(',') != -1" v-for="item in row.busTypeName.split(',')">
<el-tooltip placement="top">
<template #content>{{item}}</template>
<el-tag style="margin: 2px;" type="info" class="mx-1" effect="light">{{item}}</el-tag>
</el-tooltip>
</div>
<div v-else-if="row.busTypeName != null && row.busTypeName.indexOf(',') == -1 ">
<el-tooltip placement="top">
<template #content>{{row.busTypeName}}</template>
<el-tag type="info" class="mx-1" effect="light">{{row.busTypeName}}</el-tag>
</el-tooltip>
</div>
</div>
<div v-else-if="row.busTypeName != null && row.busTypeName.indexOf(',') == -1 ">
<el-tooltip placement="top">
<template #content>{{row.busTypeName}}</template>
<el-tag type="info" class="mx-1" effect="light">{{row.busTypeName}}</el-tag>
</el-tooltip>
<div v-else>
<el-button @click="goBus(row)" size="small" type="text">
<span>共计：{{row.nickname.split(',').length}}个业务</span>
</el-button>
</div>
</div>
<div v-if="prop == 'nickname'">
<div v-if="row.nickname != null && row.nickname.indexOf(',') != -1" v-for="item in row.nickname.split(',')">
<el-tooltip placement="top">
<template #content>{{item}}</template>
<el-tag style="margin: 2px;" type="info" class="mx-1" effect="light">{{item}}</el-tag>
</el-tooltip>
<div v-if="(row.nickname || '').split(',').length <= '3'">
<div v-if="row.nickname != null && row.nickname.indexOf(',') != -1" v-for="item in row.nickname.split(',')">
<el-tooltip placement="top">
<template #content>{{item}}</template>
<el-tag style="margin: 2px;" type="info" class="mx-1" effect="light">{{item}}</el-tag>
</el-tooltip>
</div>
<div v-else-if="row.nickname != null && row.nickname.indexOf(',') == -1 ">
<el-tooltip placement="top">
<template #content>{{row.nickname}}</template>
<el-tag type="info" class="mx-1" effect="light">{{row.nickname}}</el-tag>
</el-tooltip>
</div>
</div>
<div v-else-if="row.nickname != null && row.nickname.indexOf(',') == -1 ">
<el-tooltip placement="top">
<template #content>{{row.nickname}}</template>
<el-tag type="info" class="mx-1" effect="light">{{row.nickname}}</el-tag>
</el-tooltip>
<div v-else>
<el-button @click="goBus(row)" size="small" type="text">
<span>共计：{{row.nickname.split(',').length}}个业务负责人</span>
</el-button>
</div>
</div>
<div v-if="prop == 'admin'">
... ... @@ -128,3 +142,15 @@
</div>
</div>
</div>
<cm-dialog :showDialogVisible="showBus" :showFooter="false" :title="title" @hidedialog="cancelBtn"
width="700px">
<template v-slot>
<div class="dialog">
<div v-model="busType" v-for="item in busType" style="display: inline-block">
<el-tag type="info" class="mx-1" effect="light">{{item}}</el-tag>
</div>
</div>
</template>
</cm-dialog>
... ...
... ... @@ -47,14 +47,14 @@ export default {
label: '所属业务系统',
sortable: true,
align: 'center',
width: '280'
width: '270'
},
{
prop: 'nickname',
label: '业务系统负责人',
sortable: true,
align: 'center',
width: '140'
width: '150'
},
{
prop: 'createUser',
... ... @@ -203,6 +203,9 @@ export default {
let devCharts = Vue.ref('');
let snapshotCharts = Vue.ref('');
let peopleSSCharts = Vue.ref('');
let showBus = Vue.ref(false);
let title = Vue.ref('');
let busType = Vue.ref();
let getEcharts = ()=>{
bizCharts = echarts.init(bizChartsRefs.value);
let bizOption = {
... ... @@ -425,6 +428,27 @@ export default {
proxy.$global.openNewWin('template/detail/snapshot_detail', row.createUser+'在'+row.createTime+'创建的'+row.resName+'的快照', {resId:row.resId,'batchNo':row.batchNo},false);
}
//查看业务系统
let goBus = (row) => {
title.value = row.resName+'所属业务系统信息';
let busTypeAdmin = [];
for (let i = 0; i < row.busTypeName.split(',').length; i++) {
for (let j = 0; j < row.nickname.split(',').length; j++) {
if (i==j){
busTypeAdmin.push(row.busTypeName.split(',')[i]+'('+row.nickname.split(',')[i]+')')
}
}
}
busType.value = busTypeAdmin;
showBus.value = true;
}
//关闭弹框
let cancelBtn = () => {
showBus.value = false;
}
//查看资源详情
let goResDetail = (row) => {
proxy.$global.openDetail(row.resId, row.resType, proxy);
... ... @@ -462,7 +486,12 @@ export default {
handleChangeDatetime,
handleDel,
goResDetail,
handleDetail
handleDetail,
goBus,
showBus,
cancelBtn,
title,
busType
}
}
}
... ...