monitor_v3 / hg-monitor-web · Commits

Go to a project

Authored by wangtao
Commit e9b1244d2040c57b154f4f5a4a188e1a7da7e8da 2 parents d0920786 5eeee212 wangfeng-mj ... master-500-dev master-500-dev-0327 master-500-dev-joke master-500-dev-lushangqing master-500-dev-lzc master-500-dev-xwx master-500-dev-yuanjinpeng master-500-dev-ztq master-500-dev-ztq1 master-500-prod master-500-prod-joke-new master-500-prod-lushangqing master-mj master-mj-610 master-mj-joke master-mj-yuanjinpeng master-mj-ztq master-prod-500-lushangqing wangfeng-500-dev

Merge branch 'master-500-dev' of http://113.200.75.45:82/monitor_v3/hg-monitor-w… 

…eb into master-500-dev
Inline Side-by-side
Showing 46 changed files with 3959 additions and 176 deletions

Too many changes to show.
Reload with full diff Plain diff Email patch

To preserve performance only 46 of 46+ files are displayed.

... ... @@ -30,6 +30,24 @@ layui.define(['form', 'admin', 'laydate', 'common','sessions','reskpilist'], fun
,range: true
});
var resType = localStorage.getItem("currentResType");
// 获取合并通知开关是否开启
getNoticeMergeFlag();
function getNoticeMergeFlag(){
admin.req({
url: common.domainName + '/api-web/manage/ddic/findSucDdics/noticeMergeFlag'
, method: 'POST'
, async: false
, success: function (res) {
$.each(res.data, function (i, v) {
if(v.ddicCode == 'on'){
$('#noticeMergeTab').show();
}
});
}
})
}
//编辑
if(data && data.id){
admin.req({
... ... @@ -48,6 +66,14 @@ layui.define(['form', 'admin', 'laydate', 'common','sessions','reskpilist'], fun
$("#alarmPolicyType").val(res.object.policyType);
}
});
// 获取通知合并策略的表达式
admin.req({
url:domainName + '/api-web/policyMerge/get?noticeMergePolicyId='+data.id
,done:function (res){
$("#noticeMergeFlagExpr").val(res.data[0].noticeMergeExpr);
}
});
}else{
$("#seriousTimes").val('00:00:00 - 23:59:59');
$("#importantTimes").val('00:00:00 - 23:59:59');
... ... @@ -179,7 +205,85 @@ layui.define(['form', 'admin', 'laydate', 'common','sessions','reskpilist'], fun
data.seriousTimes = $("#seriousTimes").val();
data.importantTimes = $("#importantTimes").val();
data.commonlyTimes = $("#commonlyTimes").val();
var that = this;
if(!data.kpiId){
layer.msg("请先选择指标！", {
icon: 7
, time: 3000
});
return false;
}
if(!data.kpiId || data.kpiId == ''){
layer.msg("请先选择指标！", {
icon: 7
, time: 3000
});
return false;
}
if(!data.alarmContentExpr || data.alarmContentExpr == ''){
layer.msg("请先填写告警内容描述表达式！", {
icon: 7
, time: 3000
});
return false;
}
if(!data.alarmContentExpr || data.alarmContentExpr == ''){
layer.msg("请先填写告警内容描述表达式！", {
icon: 7
, time: 3000
});
return false;
}
var importantPolicy = data.seriousPolicy;
var importantExpr = data.importantPolicy;
var commonlyPolicy = data.commonlyPolicy;
if((!importantPolicy || importantPolicy == '') && (!importantExpr || importantExpr == '') && (!commonlyPolicy || commonlyPolicy == '')){
layer.msg("严重、重要和一般告警的表达式必须有一项不为空！", {
icon: 7
, time: 3000
});
return false;
}
if(!data.noticeMergeFlagExpr || data.noticeMergeFlagExpr == ''){
layer.msg("请先填写通知合并策略描述表达式！", {
icon: 7
, time: 3000
});
return false;
}
/**
* 保存通知合并策略
*/
var noticeMergeFlagExpr = $("#noticeMergeFlagExpr").val()
function saveNoticeMerge(id){
var noticeMergeData = {
"mergePolicyId": id,
"mergePolicyName": data.alarmPolicyName,
"mergePolicyDesc": data.alarmPolicyName,
"noticeMergeExpr": noticeMergeFlagExpr,
"policyType": data.policyType,
"kpiId": data.kpiId
}
admin.req({
url : domainName + '/api-web/policyMerge/save?access_token='+accessToken
,data:JSON.stringify(noticeMergeData)
,type:'post'
,contentType: "application/json; charset=utf-8"
,done:function (res){
if(!res.success){
layer.msg(res.msg ? res.msg : '通知合并策略保存失败', { offset: '15px' , icon: 7 , time: 1000 });
}
}
});
}
charToExpr(data, 'alarmContentExpr');
charToExpr(data, 'cleanPolicy');
charToExpr(data, 'commonlyExpr');
... ... @@ -187,6 +291,7 @@ layui.define(['form', 'admin', 'laydate', 'common','sessions','reskpilist'], fun
charToExpr(data, 'seriousExpr');
form.on('submit(add-alarmpolicy-form)',function () {
delete data.noticeMergeFlagExpr;
admin.req({
url : domainName + '/api-web/alarmPolicy/save?access_token='+accessToken
,data:JSON.stringify(data)
... ... @@ -194,6 +299,9 @@ layui.define(['form', 'admin', 'laydate', 'common','sessions','reskpilist'], fun
,contentType: "application/json; charset=utf-8"
,done:function (res){
if(res.success){
// 保存通知合并策略
saveNoticeMerge(res.str);
localStorage.setItem("detailPageOfcustomPolicyId",res.str)
layer.msg(res.msg, { offset: '15px' , icon: 1 , time: 1000 },function (){
localStorage.removeItem("currentResType");
... ... @@ -263,4 +371,4 @@ layui.define(['form', 'admin', 'laydate', 'common','sessions','reskpilist'], fun
$('#add-alarmpolicy-form').find('[name="policyType"]').attr("disabled","disabled");
}
});
});
\ No newline at end of file
});
... ...
... ... @@ -443,6 +443,7 @@ layui.define(['table', 'form', 'admin', 'layer', 'common','sessions'], function
//查看资源订阅列表
$(".view-alarmsubscribe-resource").on("click",function (){
if($(this).text() == '0'){
layer.msg('暂无订阅资源，请先订阅！', {icon: 7, time: 3000});
return false;
}
... ... @@ -714,6 +715,7 @@ layui.define(['table', 'form', 'admin', 'layer', 'common','sessions'], function
//查看指标订阅列表
$(".view-alarmsubscribe-kpi").on("click",function (){
if($(this).text() == '0'){
layer.msg('暂无订阅指标，请先订阅！', {icon: 7, time: 3000});
return false;
}
var subId = $(this).data("id");
... ... @@ -776,6 +778,10 @@ layui.define(['table', 'form', 'admin', 'layer', 'common','sessions'], function
//查看资源类型订阅列表
$(".view-alarmsubscribe-resType").on("click", function () {
if($(this).text() == '0'){
layer.msg('暂无订阅资源类型，请先订阅！', {icon: 7, time: 3000});
return false;
}
var subId = $(this).data("id");
common.openWin("template/res/typeSubscribeList", "选择资源类型", {
subId: subId,
... ... @@ -788,6 +794,10 @@ layui.define(['table', 'form', 'admin', 'layer', 'common','sessions'], function
//查看业务类型订阅列表
$(".view-alarmsubscribe-busId").on("click", function () {
if($(this).text() == '0'){
layer.msg('暂无订阅业务系统，请先订阅！', {icon: 7, time: 3000});
return false;
}
var subId = $(this).data("id");
common.openWin("template/res/typeSubscribeList", "选择业务系统", {
subId: subId,
... ...
... ... @@ -87,7 +87,9 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common',
keyword: $("#checkTemplate_keyword").val(),
resType:resType
}
, height: 'full-200'
//lsq 弹框中空白太多,高度调整 2022-06-07
// , height: 'full-200'
, height: 'full-445'
, cellMinWidth: 80
, page: {
layout: ['count', 'prev', 'page', 'next', 'limit', 'skip']
... ...
... ... @@ -660,6 +660,7 @@ layui.define(['xmSelect', 'md5'], function (exports) {
layer.open(Object.assign({
title: [name, 'font-size:18px;'],
type: 1,
id:(new Date()).getTime(),
area: area,
resize: false,
shadeClose: true,//开启遮罩层
... ...
... ... @@ -24,10 +24,42 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
//资源详细页面相关调用函数，包含各种展示类型的
let editKpiList = [];
let statusKpiList=[];//lsq 状态指标数据 2022-06-08
var obj = {
detailTimer:[],
timerTime: 180000,
sessions: layui.sessions,
getStatusKpiList:function (){
//start lsq 根据kpiid获取是否是指标状态 2022-05-23
if(statusKpiList.length != 0){
return statusKpiList;
}
statusKpiList = [];
admin.req({
url: common.domainName + '/api-web/manage/kpi/page?' +
'isWarning=&isTrend=&kpiLevel=&ignoreCnt=&startTime=&endTime=&kpiPower=',
data: {
page:1,limit:99999,
kpiName: '',resType: '',kpiIdent: 2,kpiCategory: '',
kpiDataType:'',kpiUnit:'',isWarning:'',isTrend:'',
kpiLevel:'',ignoreCnt:'',startTime:'',endTime:'',kpiPower:''
},
success(response) {
let arr=[];
if (response && response.success) {
arr=response.data;
arr.map(item=>{
statusKpiList.push(item.kpiId)
})
} else {
// layer.msg('状态指标获取失败!', {icon: 2});
}
},
error(){
// layer.msg('状态指标获取失败!', {icon: 2});
}
});
},
// 获取编辑指标
getEditKpiList:function (){
var editFlag = localStorage.getItem("editFlag");//是否编辑状态
... ... @@ -74,6 +106,9 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
{"flag": "base","name": "最近采集时间","id": "KPIF74D9D2B","value": "2019-12-16 10:04:54","status": "0" }]}
*/
renderText: function (targetId, resId, kpiId, fn, hasTotal,flag,isBasic) {
//start lsq 状态信息的状态也增加下探 202-06-08
let statusF=false;//是否为状态信息
//end lsq 2022-06-08
var url = "/api-web/detail/block?resId=" + resId + "&kpiId=" + kpiId + "&hasTotal=" + hasTotal;
if (flag) {
url += '&flag=' + flag;
... ... @@ -97,6 +132,12 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
var fontColor='';
var valueStr = '';
var titleStr = '';
//start lsq 判断当前kpiId是否在状态指标数据列表中 2022-06-08
let status=statusKpiList.indexOf(v.id);
if(status!=-1){
statusF=true;
}
//end lsq 2022-06-08
if(v.id == 'KPIE13DD9A3' || v.id == 'KPI02786E8D'){
valueStr = laytpl($("#linkStateDetailTpl").html()).render({linkStateList: v.value});
//获取flag
... ... @@ -124,10 +165,17 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
var tips = '<a class="detail_row_menu hide">\n' +
'<img style="width: 17px;height: 17px;" src="/src/style/img/icon_row_menu.png">\n' +
'</a>'
var tips = '<a class="detail_row_menu hide" data-statusf='+statusF+' data-id='+v.id+' data-flag='+v.flag+
' data-name='+v.name+' data-kpiname='+v.name+' data-iswarning=1 data-ident=1' +
' data-trend=0 data-unit="" data-hidem="hidem" data-nature="true" ' +
// ' data-restype='+((data && data[0])?data[0].resType:"")+'>\n' +
' data-restype='+(v.resType?v.resType:"")+'>\n' +
'<img style="width: 17px;height: 17px;" src="/src/style/img/icon_row_menu.png">\n' +
'</a>'
var menuId = "";
if (v.id == 'KPIE13DD9A3' || v.id == 'KPI02786E8D') {
if (v.id == 'KPIE13DD9A3' || v.id == 'KPI02786E8D' || status!=-1) {
v.name = v.name + tips;
menuId = "id=\"" + targetId + "_detail_row_menu\"";
menuId = "id=\"" + targetId + "_detail_row_menu\" class='statusMenu'";
}
var $html = addIconByValue(valueStr);
var resStyle = obj.alarmEleMatchStyle(v.flag, v.id);
... ... @@ -139,23 +187,27 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
fn && fn();
//初始化监听告警压制需要的数据
var rowMenu = $('#' + targetId).find('.detail_row_menu').eq(0);
rowMenu.attr("data-id", kpiIdList);
rowMenu.attr("data-flag", flags);
rowMenu.attr("data-name", "监控连接状态");
rowMenu.attr("data-kpiname", "监控连接状态");
rowMenu.attr("data-iswarning", "1");
rowMenu.attr("data-ident", "1");
rowMenu.attr("data-trend", "0");
rowMenu.attr("data-unit", "");
rowMenu.attr('data-hidem', 'true');
rowMenu.attr('data-nature', 'true');//性能趋势
// rowMenu.attr('data-canca', data.canCA);
// rowMenu.attr('data-incaing', data.inCAing);
// rowMenu.attr('data-restype', data.resType);
rowMenu.attr('data-restype', (data && data[0])?data[0].resType:'');
if(!statusF){
var rowMenu = $('#' + targetId).find('.detail_row_menu').eq(0);
rowMenu.attr("data-id", kpiIdList);
rowMenu.attr("data-flag", flags);
rowMenu.attr("data-name", "监控连接状态");
rowMenu.attr("data-kpiname", "监控连接状态");
rowMenu.attr("data-iswarning", "1");
rowMenu.attr("data-ident", "1");
rowMenu.attr("data-trend", "0");
rowMenu.attr("data-unit", "");
rowMenu.attr('data-hidem', 'true');
rowMenu.attr('data-nature', 'true');//性能趋势
// rowMenu.attr('data-canca', data.canCA);
// rowMenu.attr('data-incaing', data.inCAing);
// rowMenu.attr('data-restype', data.resType);
rowMenu.attr('data-restype', (data && data[0])?data[0].resType:'');
}
//监听告警压制等操作配置
$('#' + targetId + "_detail_row_menu").hover(function () {
// $('#' + targetId + "_detail_row_menu").hover(function () {
$('#' + targetId + "_detail_row_menu.statusMenu").hover(function () {
var $that = $(this);
var $btn = $that.find(".detail_row_menu");
if ($btn.length > 0) {
... ... @@ -175,6 +227,9 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
* @param cols 指定列（一组key value为一列）
*/
renderTextCols: function (targetId, resId, kpiId, cols, isBasic) {
//start lsq 状态信息的状态也增加下探 202-06-08
let statusF=false;//是否为状态信息
//end lsq 2022-06-08
var url = "/api-web/detail/block?resId=" + resId + "&kpiId=" + kpiId;
if (isBasic) {
url += '&isBasic=' + isBasic;
... ... @@ -184,6 +239,12 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
}).done(function (res) {
var flags = "";
var kpiIdList= "";
//start lsq 判断当前kpiId是否在状态指标数据列表中 2022-06-08
let status=statusKpiList.indexOf(v.id);
if(status!=-1){
statusF=true;
}
//end lsq 2022-06-08
var data = res.data;
if (data.length > 0) {
var dataArr = common.splieceGroup(data, cols);
... ... @@ -215,13 +276,21 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
//获取kpi
kpiIdList += ar.id + ",";
}
var tips = '<a class="detail_row_menu hide">\n' +
//start lsq 更改下探图标的属性值 2022-06-08
/* var tips = '<a class="detail_row_menu hide">\n' +
'<img style="width: 17px;height: 17px;" src="/src/style/img/icon_row_menu.png">\n' +
'</a>'*/
var tips = '<a class="detail_row_menu hide" data-statusf='+statusF+' data-id='+v.id+' data-flag='+v.flag+
' data-name='+v.name+' data-kpiname='+v.name+' data-iswarning=1 data-ident=1' +
' data-trend=0 data-unit="" data-hidem="hidem" data-nature="true" ' +
' data-restype='+(v.resType?v.resType:"")+'>\n' +
'<img style="width: 17px;height: 17px;" src="/src/style/img/icon_row_menu.png">\n' +
'</a>'
//end lsq 2022-06-08
var menuId = "";
if (ar.id == 'KPIE13DD9A3' || ar.id == 'KPI02786E8D') {
if (ar.id == 'KPIE13DD9A3' || ar.id == 'KPI02786E8D' || status!=-1) {
ar.name = ar.name + tips;
menuId = "id=\"" + targetId + "_detail_row_menu\"";
menuId = "id=\"" + targetId + "_detail_row_menu\" class='statusMenu'";
}
var $html = addIconByValue(valueStr);
var resStyle = obj.alarmEleMatchStyle(ar.flag, ar.id);
... ... @@ -243,20 +312,24 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
$("#" + targetId).html(li);
}
//初始化监听告警压制需要的数据
var rowMenu = $('#' + targetId).find('.detail_row_menu').eq(0);
rowMenu.attr("data-id", kpiIdList);
rowMenu.attr("data-flag", flags);
rowMenu.attr("data-name", "监控连接状态");
rowMenu.attr("data-kpiname", "监控连接状态");
rowMenu.attr("data-iswarning", "1");
rowMenu.attr("data-ident", "1");
rowMenu.attr("data-trend", "0");
rowMenu.attr("data-unit", "");
rowMenu.attr('data-hidem', 'true');
rowMenu.attr('data-nature', 'true');//性能趋势
rowMenu.attr('data-restype', (data && data[0])?data[0].resType:'');
if(!statusF){
var rowMenu = $('#' + targetId).find('.detail_row_menu').eq(0);
rowMenu.attr("data-id", kpiIdList);
rowMenu.attr("data-flag", flags);
rowMenu.attr("data-name", "监控连接状态");
rowMenu.attr("data-kpiname", "监控连接状态");
rowMenu.attr("data-iswarning", "1");
rowMenu.attr("data-ident", "1");
rowMenu.attr("data-trend", "0");
rowMenu.attr("data-unit", "");
rowMenu.attr('data-hidem', 'true');
rowMenu.attr('data-nature', 'true');//性能趋势
rowMenu.attr('data-restype', (data && data[0])?data[0].resType:'');
}
//监听告警压制等操作配置
$('#' + targetId + "_detail_row_menu").hover(function () {
// $('#' + targetId + "_detail_row_menu").hover(function () {
$('#' + targetId + "_detail_row_menu.statusMenu").hover(function () {
var $that = $(this);
var $btn = $that.find(".detail_row_menu");
if ($btn.length > 0) {
... ... @@ -4138,6 +4211,8 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
var canCA = $menu.data('canca');
var inCAing = $menu.data('incaing');
var nature = $menu.data('nature');
//lsq 状态信息无其他下探 2022-06-08
var statusF = $menu.data('statusf');
var menubox = '<div class="detail_menubox" id="detail_menubox_id" style="color:#666;"><ul>';
if (!nature) {
menubox +=
... ... @@ -4150,8 +4225,10 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
if (!nature) {
menubox += '<li type="t"><i class="layui-icon">&#xe62c;</i>性能趋势</li>';
}
// if(!statusF){
menubox += '<li type="n"><i class="layui-icon">&#xe758;</i>压制次数</li>';
// }
// Start Wang 2022/3/28 14:06 833:屏蔽纳入容量预测按钮 https://hgkj.zentaopm.com/task-view-833.html
// 后面计划将功能作为配置项
// if (canCA) {
... ... @@ -4182,45 +4259,25 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
flag = flag.replace(/^\s+|\s+$/g, "");
}
//start lsq 根据kpiid获取是否是指标状态 2022-05-23
admin.req({
url: common.domainName + '/api-web/manage/kpi/page?' +
'isWarning=&isTrend=&kpiLevel=&ignoreCnt=&startTime=&endTime=&kpiPower=',
data: {
page:1,limit:99999,
kpiName: '',resType: '',kpiIdent: 2,kpiCategory: '',
kpiDataType:'',kpiUnit:'',isWarning:'',isTrend:'',
kpiLevel:'',ignoreCnt:'',startTime:'',endTime:'',kpiPower:''
},
success(response) {
let arr=[];
if (response && response.success) {
arr=response.data;
let idArr=[];
let idStr='';
if(id.indexOf(',')!=-1){
idArr=id.split(',');
idStr=idArr[0];
}else{
idStr=id;
}
let isKpi=false;
arr.map(item=>{
if(idStr==item.kpiId){
isKpi=true;
}
})
if(isKpi){
let menuboxStr = '<li type="link-status-kpi"><i class="layui-icon">&#xe758;</i>状态指标</li>';
$("#detail_menubox_id ul").append(menuboxStr)
}
} else {
// layer.msg('状态指标获取失败!', {icon: 2});
}
},
error(){
// layer.msg('状态指标获取失败!', {icon: 2});
//start lsq 根据kpiid获取是否是指标状态 2022-05-23
let idArr=[];
let idStr='';
if(id.indexOf(',')!=-1){
idArr=id.split(',');
idStr=idArr[0];
}else{
idStr=id;
}
let isKpi=false;
statusKpiList.map(item=>{
if(idStr==item){
isKpi=true;
}
});
})
if(isKpi){
let menuboxStr = '<li type="link-status-kpi"><i class="layui-icon">&#xe758;</i>状态指标</li>';
$("#detail_menubox_id ul").append(menuboxStr)
}
setTimeout(function (){
//end lsq 2022-05-23
//菜单点击事件
... ... @@ -4289,7 +4346,8 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
}
});
}
//lsq 页面加载完就调用一下获取状态指标列表数据 2022-06-08
obj.getStatusKpiList();
//对外暴露的接口
exports('commonDetail', obj);
});
... ...
... ... @@ -162,6 +162,12 @@ layui.define(['common', 'swiper', 'admin','commonDetail','mxClient','sessions','
// currentBizId = bizlist[0].busId;
}
$.each(bizlist,function (i,v) {
if (bizlist[0].title == v.title) {
$("#"+v.busId).show();
}
});
//点击业务区域弹出提示框
$('#indexbizhealth [data-index-banner-item="type"]').on("contextmenu", function (e) {
$('[type="t"]').show();
... ... @@ -305,6 +311,29 @@ layui.define(['common', 'swiper', 'admin','commonDetail','mxClient','sessions','
$("#indexActiveAlarmList").html('<li style="width:390px;"><p>无告警</p></li>');
});
}
var resourceHealthTips ;
$(".detail_base_info").hover(function() {
openMsg();
}, function() {
layer.close(resourceHealthTips);
});
function openMsg() {
resourceHealthTips = layer.tips("<span style='color:#585858;'>" +
"按照积分制方式计算业务系统健康状态，即图标颜色：<br>" +
"&nbsp;&nbsp;&nbsp;&nbsp;• 告警：1个严重告警计10分；1个重要告警计5分；1个一般告警计1分<br>" +
"&nbsp;&nbsp;&nbsp;&nbsp;• 所有计分累加<br>" +
"&nbsp;&nbsp;&nbsp;&nbsp;起始分为0分，最后得分为计分和；<br>" +
"<br>" +
"得分与健康状态关系：<br>" +
"&nbsp;&nbsp;&nbsp;&nbsp;• 0：状态正常，无告警，颜色为<a style='color: #00a522'>绿色</a><br>" +
"&nbsp;&nbsp;&nbsp;&nbsp;• 大于0且小于等于10：普通问题，最多1个严重告警，颜色为<a style='color: #a4910a'>深黄</a><br>" +
"&nbsp;&nbsp;&nbsp;&nbsp;• 大于10且小于等于30：一般问题，最多3个严重告警，颜色为<a style='color: #e2c705'>黄色</a><br>" +
"&nbsp;&nbsp;&nbsp;&nbsp;• 大于30且小于等于50：严重问题，最多5个严重告警，颜色为<a style='color: #ffaf00'>橙色</a><br>" +
"&nbsp;&nbsp;&nbsp;&nbsp;• 大于50且小于等于100：比较严重，最多10个严重告警，颜色为<a style='color: #f65f0b'>深橙</a><br>" +
"&nbsp;&nbsp;&nbsp;&nbsp;• 大于100：非常严重，10个严重告警以上，颜色为<a style='color: #d81e06'>红色<br>" +
"</span>",
'.detail_base_info',{tips:[2,'#F0F0F0'], time:0,area: ['auto', 'auto']});
}
/**
* 首页右下角两个功能的时间
... ... @@ -338,14 +367,15 @@ layui.define(['common', 'swiper', 'admin','commonDetail','mxClient','sessions','
setDefault('select-content-ul',warnVal,'#warn-text-view');
setDefault('select-content-ul-bus',busVal,'#bus-text-view');
// Start 告警级别默认为严重告警，点击左下角选择告警级别，页面的小红点切换不同告警的数量，item根据告警数量进行排序 LSQ 2021/12/29 19:37
$(".select-total").hide();
$(".select-serious").hide();
$(".select-important").hide();
$(".select-normal").hide();
var itemArr=$(".index-banner-item");
itemArr.map((index,item)=>{
if($(item).data('serious')=='0'){
$(item).find('.select-serious').hide();
if($(item).data('total')=='0'){
$(item).find('.select-total').hide();
}
$(item).css('order',$(item).data('serious'))
})
... ...
... ... @@ -113,6 +113,8 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common',
if (configDeptPwdOpen == 1){
_html += ' <button data-id="'+d.orgId+'" data-password="'+d.orgPassword+'" lay-tips="设置部门默认密码" type="button" class="layui-btn layui-btn-xs layui-btn-normal pwd-org-btn"><i class="layui-icon layui-icon-set"></i></button>';
}
_html +='<button data-orgid="'+d.orgId+'" lay-tips="业务授权" type="button" class="layui-btn layui-btn-xs layui-btn-normal org_busType_authorization_btn"><i class="layui-icon layui-icon-menu-fill"></i></button>';
_html += '</div>';
return _html;
}
... ... @@ -182,6 +184,11 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common',
}
openEditHtml($(this).data("id"))
})
//start lsq 业务授权
$('.org_busType_authorization_btn').unbind().on('click',function () {
busTypeAuthorization($(this).data('orgid'))
});
}
, error(error) {
layer.close(loading)
... ... @@ -189,6 +196,29 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common',
})
}
//start lsq 业务类型授权2022-06-10
function busTypeAuthorization(orgId) {
var orgIds = [];
if (orgId){ //增加操作栏中业务类型授权
orgIds.push(orgId);
}else{
}
if(orgIds.length < 1){
layer.msg("请勾选需要赋权的部门！", { offset: '15px' , icon: 7 , time: 2000 });
}else{
layer.open({
title: ['业务授权', 'font-size:18px;'],
type: 2,
area: ['90%','80%'],
resize:false,
content: ['/vue3/index.html#/vue3/orgBustype?orgId=' + orgId, 'no'],
cancel: function () {
clearTimeout();
}
});
}
}
function saveDeptPwd(conf) {
loading = layer.load(2);
admin.req({
... ...
... ... @@ -191,9 +191,12 @@ layui.define(['table', 'form', 'admin', 'layer', 'upload', 'common', 'sessions',
}
},
{
title: '操作', fixed: 'right', align: 'center',minWidth: 230,
title: '操作', fixed: 'right', align: 'center',minWidth: 280,
templet: '<div>' +
'<button data-id="{{d.id}}" lay-tips="删除" type="button" class="layui-btn layui-btn-xs layui-btn-normal user_delete_btn"><i class="layui-icon layui-icon-delete"></i></button>'+
//lsq 新增变更按钮 2022-05-30
'<button data-username="{{d.username}}" data-nickname="{{d.nickname}}" lay-tips="人员相关业务变更" type="button" class="layui-btn layui-btn-xs layui-btn-normal user_batch_change_leaders_btn"><i class="layui-icon layui-icon-edit"></i></button>'+
'<button data-id="{{d.id}}" lay-tips="删除" type="button" class="layui-btn layui-btn-xs layui-btn-normal user_delete_btn"><i class="layui-icon layui-icon-delete"></i></button>'+
'<button data-id="{{d.id}}" data-username="{{d.username}}" lay-tips="重置密码" type="button" class="layui-btn layui-btn-xs layui-btn-normal user_pass_btn"><i class="layui-icon layui-icon-password"></i></button>'+
'<button data-username="{{d.username}}" lay-tips="资源类型授权" type="button" class="layui-btn layui-btn-xs layui-btn-normal user_resType_authorization_btn"><i class="layui-icon layui-icon-app"></i></button>'+
'<button data-username="{{d.username}}" lay-tips="业务授权" type="button" class="layui-btn layui-btn-xs layui-btn-normal user_busType_authorization_btn"><i class="layui-icon layui-icon-menu-fill"></i></button>'+
... ... @@ -283,6 +286,39 @@ layui.define(['table', 'form', 'admin', 'layer', 'upload', 'common', 'sessions',
}
})
}
//start lsq 人员相关业务批量变更 2022-05-30
$('.user_batch_change_leaders_btn').unbind().on('click',function () {
let param = {
username: $(this).data('username'),
resName: ''
}
let urlParams='';
for(let key in param){
if(param[key]){
urlParams+=key+'='+param[key]+'&'
}
}
urlParams=urlParams.substr(0,urlParams.length-1);
let title=`
<div style="display: flex;justify-content: space-between; align-items: center;">
<span>"`+$(this).data('nickname')+`"相关业务批量变更</span>
</div>
`;
layer.open({
title: [title, 'font-size:18px;'],
type: 2,
area: ['80%', '90%'],
shadeClose: true,//开启遮罩层
id: 'batch_change_leaders',
content: ['/vue3/index.html#/vue3/batchChangeLeaders?'+urlParams, 'no'],
success:function (layero,index){
},
cancel: function () {
// clearTimeout(obj.lineTimer);
}
});
});
//end lsq 2022-05-30
// 配置默认首页
$('.user-config-default-index').unbind('click').on('click', function () {
var username = $(this).data('username');
... ...
... ... @@ -229,12 +229,24 @@ layui.extend({
var loginIndex = 'default';
// let loginSkin = sessionStorage.getItem("loginSkin");
//lsq 从cookie中获取登录皮肤 2022-03-31
let loginSkin = admin.getCookie("loginSkin");
if(loginSkin && ["default",'skin1','skin2'].indexOf(loginSkin) != -1){
loginIndex = loginSkin;
}
path = path + '-' + loginIndex;
//start lsq 从配置文件中获取登录皮肤 2022-06-07
// let loginSkin = admin.getCookie("loginSkin");
// http.get(window.location.origin + '/config/getConfig',{configName:'url'},function(res){
$.ajax({
url: '/config/getConfig',
data: {
configName: 'login'
},
async: false,
success(response) {
let loginSkin = response.skin;
if(loginSkin && ["default",'skin1','skin2'].indexOf(loginSkin) != -1){
loginIndex = loginSkin;
}
path = path + '-' + loginIndex;
}
});
//end lsq 2022-06-07
}
container.render(path).done(function(){
admin.pageType = 'alone';
... ...
... ... @@ -62,13 +62,13 @@
</fieldset>
<div class="layui-tab layui-tab-card">
<ul class="layui-tab-title">
<li class="layui-this">告警内容</li>
<li class="layui-this"><span style="color:red">*</span>告警内容</li>
<li>严重</li>
<li>重要</li>
<li>一般</li>
<li>一般告警</li>
<li>过滤</li>
<li>消除</li>
<!-- <li>告警内容表达式</li>-->
<li id="noticeMergeTab" style="display: none"><span style="color:red">*</span>通知合并策略</li>
</ul>
<div class="layui-tab-content">
<div class="layui-tab-item layui-show content-tab-item">
... ... @@ -355,50 +355,19 @@
</div>
</div>
</div>
<!-- <div class="layui-tab-item">-->
<!-- <div class="content-box-group">-->
<!-- <div class="box-group-left">告警内容表达式</div>-->
<!-- <div class="box-group-right">-->
<!-- <div class="layui-form-item">-->
<!-- <div class="layui-input-block">-->
<!-- <input type="radio" name="alarmcotent-policy-type" data-flag="alarmcotent" value="1" title="基础" checked lay-filter="alarm-policy-rule-type">-->
<!-- <input type="radio" name="alarmcotent-policy-type" data-flag="alarmcotent" value="2" title="正则" lay-filter="alarm-policy-rule-type">-->
<!-- <input type="radio" name="alarmcotent-policy-type" data-flag="alarmcotent" value="3" title="自定义"lay-filter="alarm-policy-rule-type">-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="layui-form-item cont-base" id="alarmcotent-policy-box">-->
<!-- <div class="layui-input-inline smallwith">-->
<!-- <select class="alarmcotent_condition">-->
<!-- <option value="0">大于</option>-->
<!-- <option value="1">小于</option>-->
<!-- <option value="2">等于</option>-->
<!-- <option value="3">大于等于</option>-->
<!-- <option value="4">小于等于</option>-->
<!-- <option value="5">字符串等于</option>-->
<!-- <option value="6">字符串包含</option>-->
<!-- <option value="7">字符串前匹配</option>-->
<!-- <option value="8">字符串后匹配</option>-->
<!-- </select>-->
<!-- </div>-->
<!-- <div class="layui-input-inline smallwith">-->
<!-- <input type="tel" autocomplete="off" class="layui-input" flag="alarmcotent_value">-->
<!-- </div>-->
<!-- <div class="layui-form-mid layui-word-aux"><i data-id="alarmcotent-policy-box" class="layui-icon oper-icon policy-input-add">&#xe624;</i></div>-->
<!-- <div class="layui-form-mid layui-word-aux"><i data-id="alarmcotent-policy-box" class="layui-icon oper-icon policy-input-del hide">&#xe67e;</i></div>-->
<!-- </div>-->
<!-- <div class="layui-form-item cont-base">-->
<!-- <div class="layui-input-block">-->
<!-- <a class="layui-btn layui-btn-sm layui-btn-normal createpolicybtn" data-flag="alarmcotent">生成策略</a>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="layui-form-item cont-other">-->
<!-- <div class="layui-input-block">-->
<!-- <textarea placeholder="请输入内容" class="layui-textarea" name="alarmContentExpr" id="alarmcotentPolicy"></textarea>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<div class="layui-tab-item content-tab-item">
<!-- 通知合并策略 -->
<div class="content-box-group">
<div class="box-group-left" style="text-align: center">通知合并策略<br/>描述表达式</div>
<div class="box-group-right">
<div class="layui-form-item">
<div class="layui-input-block">
<textarea placeholder="请输入内容" class="layui-textarea" id="noticeMergeFlagExpr" name="noticeMergeFlagExpr"></textarea>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
... ... @@ -408,4 +377,4 @@
layui.use('alarmpolicyAdd', function (fn) {
fn({{d}});
});
</script>
\ No newline at end of file
</script>
... ...
<article>
<style>
label.task-choose-resname {
color: #fff;
background-color: #1e9fff;
min-height: 27px;
font-size: 12px;
display: inline-block;
margin-top: 5px;
line-height: 27px;
padding-left: 8px;
min-width: 223px;
margin-left: 15px;
}
</style>
<div class="layui-card">
<form class="layui-form layui-form-pane" lay-filter="form-task-bindchecktemp"
onsubmit="return false;">
... ... @@ -47,7 +33,7 @@
<button class="layui-btn layui-btn-primary hide" id="btn-task-bindchecktemp-unselectres"><i
class="layui-icon">&#xe640;</i>取消选择
</button>
<div id="txt-task-bindchecktemp-res"></div>
<div id="txt-task-bindchecktemp-res" style="position: absolute;margin-top: -27px;margin-left: 120px"></div>
</div>
</div>
</div>
... ... @@ -83,4 +69,4 @@
layui.use('taskbindchecktemp', function (fn) {
fn({{ d }});
});
</script>
\ No newline at end of file
</script>
... ...
... ... @@ -22,12 +22,16 @@
<textarea name="remark" placeholder="请输入备注" class="layui-textarea"></textarea>
</div>
</div>
<div class="layui-form-item">
<!--start lsq 搜索按钮位置调整 2022-06-07-->
<div class="layui-form-item" style="display: flex;align-items: center;">
<label class="layui-form-label">用户绑定</label>
<div class="layui-input-block tags-input" style="height: auto">
<!-- <div class="layui-input-block tags-input" style="height: auto">-->
<div class=" tags-input" style="height: auto">
<div class="tags" id="selecte_usergroup_id_user"></div>
</div>
<div class="layui-form-mid layui-word-aux" style="padding: 0!important;position: relative;top: -28px;left: 98%"><i class="layui-icon form-btn-icon" id="usergroup-form-select-users">&#xe615;</i></div>
<!-- style="padding: 0!important;position: relative;top: -28px;left: 98%"【-->
<div class="layui-form-mid layui-word-aux" style="margin-left:6px;"><i class="layui-icon form-btn-icon" id="usergroup-form-select-users">&#xe615;</i></div>
<!--end lsq 2022-06-07-->
</div>
<button id="btn-usergroup-submit" class="hide" lay-submit lay-filter="btn-usergroup-submit">提交</button>
</form>
... ...
... ... @@ -34,6 +34,7 @@
<option value="1">中</option>
<option value="2">良</option>
<option value="3">优</option>
<option value="none">未监控</option>
</select>
</div>
</div>
... ... @@ -54,6 +55,7 @@
<option value="">=连接状态=</option>
<option value="normal">成功</option>
<option value="unnormal">失败</option>
<option value="9">未监控</option>
</select>
</div>
</div>
... ... @@ -126,6 +128,7 @@
<option value="1">中</option>
<option value="2">良</option>
<option value="3">优</option>
<option value="none">未监控</option>
</select>
</div>
</div>
... ... @@ -226,6 +229,17 @@
<span><i class="layui-badge-dot layui-bg-red"></i>中</span>
</li>
<li>
{{# if(item.healthNone != null){
if(item.healthNone == '0'){
}}
<div><span class="layui-badge layui-bg-gray">{{ item.healthNone }}</span></div>
{{# } else { }}
<div><span class="layui-badge" style="background: gray">{{ item.healthNone }}</span></div>
{{# } } }}
<span><i class="layui-badge-dot" style="background: gray"></i>未监控</span>
</li>
</ul>
</div>
</div>
... ... @@ -268,16 +282,18 @@
<div class="num">
<span class="green" lay-tips="健康状态：优" data-value="3" data-target="biz_resStatus" id="normal_biz">0</span>/
<span class="orange" lay-tips="健康状态: 良" data-value="2" data-target="biz_resStatus" id="worse_biz">0</span>/
<span class="red" lay-tips="健康状态: 中" data-value="1" data-target="biz_resStatus" id="worst_biz">0</span>
<span class="red" lay-tips="健康状态: 中" data-value="1" data-target="biz_resStatus" id="worst_biz">0</span>/
<span class="gray" lay-tips="健康状态: 未监控" data-value="none" data-target="biz_resStatus" id="healthNone_biz">0</span>
</div>
</div>
<div class="info-box-count">
<i></i>
<label>资源状态</label>
<div class="num">
<span class="blue" lay-tips="资源状态：未监控" data-value="new" data-target="biz_state" id="newstate_biz">0</span>/
<span class="green" lay-tips="资源状态：监控中" data-value="monitor" data-target="biz_state" id="monitorstate_biz">0</span>/
<span class="red" lay-tips="资源状态：暂停监控" data-value="stop" data-target="biz_state" id="stopstate_biz">0</span>
<span class="red" lay-tips="资源状态：暂停监控" data-value="stop" data-target="biz_state" id="stopstate_biz">0</span>/
<span class="gray" lay-tips="资源状态：未监控" data-value="new" data-target="biz_state" id="newstate_biz">0</span>
</div>
</div>
<div class="info-box-count">
... ... @@ -285,7 +301,8 @@
<label>连接状态</label>
<div class="num">
<span class="green" lay-tips="连接状态：成功" data-value="normal" data-target="bizlink_state" id="linksuccess_biz">0</span>/
<span class="red" lay-tips="连接状态：失败" data-value="unnormal" data-target="bizlink_state" id="linkfail_biz">0</span>
<span class="red" lay-tips="连接状态：失败" data-value="unnormal" data-target="bizlink_state" id="linkfail_biz">0</span>/
<span class="gray" lay-tips="连接状态：未监控" data-value="9" data-target="bizlink_state" id="linkNone_biz">0</span>
</div>
</div>
<!-- <div class="info-box-count">
... ... @@ -316,6 +333,7 @@
<span class="green" lay-tips="健康状态：优" data-value="3" data-target="biz_treetable_resStatus" id="tree_normal_biz">0</span>/
<span class="orange" lay-tips="健康状态: 良" data-value="2" data-target="biz_treetable_resStatus" id="tree_worse_biz">0</span>/
<span class="red" lay-tips="健康状态: 中" data-value="1" data-target="biz_treetable_resStatus" id="tree_worst_biz">0</span>
<span class="red" lay-tips="健康状态: 未监控" data-value="none" data-target="biz_treetable_resStatus" id="tree_healthNone_biz">0</span>
</div>
</div>
<div class="info-box-count">
... ...
... ... @@ -28,6 +28,7 @@
<option value="1">中</option>
<option value="2">良</option>
<option value="3">优</option>
<option value="none">未监控</option>
</select>
</div>
</div>
... ... @@ -37,6 +38,7 @@
<option value="">=连接状态=</option>
<option value="normal">成功</option>
<option value="unnormal">失败</option>
<option value="9">未监控</option>
</select>
</div>
</div>
... ... @@ -216,16 +218,17 @@
<div class="num">
<span class="green" lay-tips="健康状态：优" data-value="3" data-target="biz_reslist_resStatus" data-field="normal">0</span>/
<span class="orange" lay-tips="健康状态: 良" data-value="2" data-target="biz_reslist_resStatus" data-field="worse">0</span>/
<span class="red" lay-tips="健康状态: 中" data-value="1" data-target="biz_reslist_resStatus" data-field="worst">0</span>
<span class="red" lay-tips="健康状态: 中" data-value="1" data-target="biz_reslist_resStatus" data-field="worst">0</span>/
<span class="gray" lay-tips="连接状态：未监控" data-value="none" data-target="biz_reslist_resStatus" data-field="healthNone">0</span>
</div>
</div>
<div class="info-box-count">
<i></i>
<label>资源状态</label>
<div class="num">
<span class="blue" lay-tips="资源状态：未监控" data-value="new" data-target="biz_reslist_state" data-field="newstate">0</span>/
<span class="green" lay-tips="资源状态：监控中" data-value="monitor" data-target="biz_reslist_state" data-field="monitorstate">0</span>/
<span class="red" lay-tips="资源状态：暂停监控" data-value="stop" data-target="biz_reslist_state" data-field="stopstate">0</span>
<span class="red" lay-tips="资源状态：暂停监控" data-value="stop" data-target="biz_reslist_state" data-field="stopstate">0</span>/
<span class="gray" lay-tips="资源状态：未监控" data-value="new" data-target="biz_reslist_state" data-field="newstate">0</span>
</div>
</div>
<div class="info-box-count div-link-state" style="display: none">
... ... @@ -233,7 +236,8 @@
<label>连接状态</label>
<div class="num">
<span class="green" lay-tips="连接状态：成功" data-value="normal" data-target="biz_reslist_link_state" data-field="linksuccess">0</span>/
<span class="red" lay-tips="连接状态：失败" data-value="unnormal" data-target="biz_reslist_link_state" data-field="linkfail">0</span>
<span class="red" lay-tips="连接状态：失败" data-value="unnormal" data-target="biz_reslist_link_state" data-field="linkfail">0</span>/
<span class="gray" lay-tips="连接状态：未监控" data-value="9" data-target="biz_reslist_link_state" data-field="linkNone">0</span>
</div>
</div>
<!-- <div class="info-box-count">
... ...
... ... @@ -52,6 +52,7 @@
<option value="1">中</option>
<option value="2">良</option>
<option value="3">优</option>
<option value="none">未监控</option>
</select>
</div>
</div>
... ... @@ -72,6 +73,7 @@
<option value="">=连接状态=</option>
<option value="normal">成功</option>
<option value="unnormal">失败</option>
<option value="9">未监控</option>
</select>
</div>
</div>
... ... @@ -230,6 +232,17 @@
<span><i class="layui-badge-dot layui-bg-red"></i>中</span>
</li>
<li>
{{# if(item.healthNone != null){
if(item.healthNone == '0'){
}}
<div><span class="layui-badge layui-bg-gray">{{ item.healthNone }}</span></div>
{{# } else { }}
<div><span class="layui-badge" style="background: gray">{{ item.healthNone }}</span></div>
{{# } } }}
<span><i class="layui-badge-dot" style="background: gray"></i>未监控</span>
</li>
</ul>
</div>
</div>
... ... @@ -431,16 +444,18 @@
<div class="num">
<span class="green" lay-tips="健康状态：优" data-value="3" data-target="domain_resStatus" id="normal_domain"></span>/
<span class="orange" lay-tips="健康状态: 良" data-value="2" data-target="domain_resStatus" id="worse_domain"></span>/
<span class="red" lay-tips="健康状态: 中" data-value="1" data-target="domain_resStatus" id="worst_domain"></span>
<span class="red" lay-tips="健康状态: 中" data-value="1" data-target="domain_resStatus" id="worst_domain"></span>/
<span class="gray" lay-tips="健康状态: 未监控" data-value="none" data-target="domain_resStatus" id="healthNone_domain">0</span>
</div>
</div>
<div class="info-box-count">
<i></i>
<label>资源状态</label>
<div class="num">
<span class="blue" lay-tips="资源状态：未监控" data-value="new" data-target="domain_state" id="newstate_domain"></span>/
<span class="green" lay-tips="资源状态：监控中" data-value="monitor" data-target="domain_state" id="monitorstate_domain"></span>/
<span class="red" lay-tips="资源状态：暂停监控" data-value="stop" data-target="domain_state" id="stopstate_domain"></span>
<span class="red" lay-tips="资源状态：暂停监控" data-value="stop" data-target="domain_state" id="stopstate_domain"></span>/
<span class="gray" lay-tips="资源状态：未监控" data-value="new" data-target="domain_state" id="newstate_domain"></span>
</div>
</div>
<div class="info-box-count">
... ... @@ -448,7 +463,8 @@
<label>连接状态</label>
<div class="num">
<span class="green" lay-tips="连接状态：成功" data-value="normal" data-target="domainlink_state" id="linksuccess_domain"></span>/
<span class="red" lay-tips="连接状态：失败" data-value="unnormal" data-target="domainlink_state" id="linkfail_domain"></span>
<span class="red" lay-tips="连接状态：失败" data-value="unnormal" data-target="domainlink_state" id="linkfail_domain"></span>/
<span class="gray" lay-tips="连接状态：未监控" data-value="9" data-target="domainlink_state" id="linkNone_domain">0</span>
</div>
</div>
<!-- <div class="info-box-count">
... ...
... ... @@ -295,6 +295,8 @@
<i class="{{bizClas}}"></i>
<span>{{item.title}}<a class="layui-icon bizcard-view-topo {{isBiz ? '' : 'hide'}}" data-busid="{{item.busId}}" style="color: #FEB61E; margin-left: 10px" lay-tips="查看业务拓扑"><i class="iconfont">&#XE515;</i></a></span>
<div class="index-banner-title-desc"><span>{{item.countTxt}}</span></div>
<i id="{{item.busId}}" class="iconfont detail_base_info" style="color:rgb(30,159,255);display: none;">&#xe61e;</i>
</div>
<div class="index-banner-group-list">
{{# layui.each(item.bizList, function(index, item){ }}
... ...
... ... @@ -78,6 +78,7 @@
<option value="1">中</option>
<option value="2">良</option>
<option value="3">优</option>
<option value="none">未监控</option>
</select>
</div>
</div>
... ... @@ -98,6 +99,7 @@
<option value="">=连接状态=</option>
<option value="normal">成功</option>
<option value="unnormal">失败</option>
<option value="9">未监控</option>
</select>
</div>
</div>
... ... @@ -230,7 +232,7 @@
<option value="1">中</option>
<option value="2">良</option>
<option value="3">优</option>
</select>
<option value="none">未监控</option> </select>
</div>
</div>
<div class="layui-inline">
... ... @@ -336,6 +338,17 @@
<span><i class="layui-badge-dot layui-bg-red"></i>中</span>
</li>
<li>
{{# if(item.healthNone != null){
if(item.healthNone == '0'){
}}
<div><span class="layui-badge layui-bg-gray">{{ item.healthNone }}</span></div>
{{# } else { }}
<div><span class="layui-badge" style="background: gray">{{ item.healthNone }}</span></div>
{{# } } }}
<span><i class="layui-badge-dot" style="background: gray"></i>未监控</span>
</li>
</ul>
</div>
</div>
... ... @@ -365,16 +378,18 @@
<div class="num">
<span class="green" lay-tips="健康状态：优" data-value="3" data-target="resStatus " id="normal_res">0</span>/
<span class="orange" lay-tips="健康状态: 良" data-value="2" data-target="resStatus" id="worse_res">0</span>/
<span class="red" lay-tips="健康状态: 中" data-value="1" data-target="resStatus" id="worst_res">0</span>
<span class="red" lay-tips="健康状态: 中" data-value="1" data-target="resStatus" id="worst_res">0</span>/
<span class="gray" lay-tips="健康状态: 未监控" data-value="none" data-target="resStatus" id="healthNone_res">0</span>
</div>
</div>
<div class="info-box-count">
<i></i>
<label>资源状态</label>
<div class="num">
<span class="blue" lay-tips="资源状态：未监控" data-value="new" data-target="state" id="newstate_res">0</span>/
<span class="green" lay-tips="资源状态：监控中" data-value="monitor" data-target="state" id="monitorstate_res">0</span>/
<span class="red" lay-tips="资源状态：暂停监控" data-value="stop" data-target="state" id="stopstate_res">0</span>
<span class="red" lay-tips="资源状态：暂停监控" data-value="stop" data-target="state" id="stopstate_res">0</span>/
<span class="gray" lay-tips="资源状态：未监控" data-value="new" data-target="state" id="newstate_res">0</span>
</div>
</div>
<div class="info-box-count">
... ... @@ -382,7 +397,8 @@
<label>连接状态</label>
<div class="num">
<span class="green" lay-tips="连接状态：成功" data-value="normal" data-target="link_state" id="linksuccess_res">0</span>/
<span class="red" lay-tips="连接状态：失败" data-value="unnormal" data-target="link_state" id="linkfail_res">0</span>
<span class="red" lay-tips="连接状态：失败" data-value="unnormal" data-target="link_state" id="linkfail_res">0</span>/
<span class="gray" lay-tips="连接状态：未监控" data-value="9" data-target="bizlink_state" id="linkNone_res">0</span>
</div>
</div>
<!-- <div class="info-box-count">
... ... @@ -412,16 +428,17 @@
<div class="num">
<span class="green" lay-tips="健康状态：优" data-value="3" data-target="treetable_resStatus" id="tree_normal_res">0</span>/
<span class="orange" lay-tips="健康状态: 良" data-value="2" data-target="treetable_resStatus" id="tree_worse_res">0</span>/
<span class="red" lay-tips="健康状态: 中" data-value="1" data-target="treetable_resStatus" id="tree_worst_res">0</span>
<span class="red" lay-tips="健康状态: 中" data-value="1" data-target="treetable_resStatus" id="tree_worst_res">0</span>/
<span class="gray" lay-tips="健康状态: 未监控" data-value="1" data-target="treetable_resStatus" id="tree_healthNone_res">0</span>
</div>
</div>
<div class="info-box-count">
<i></i>
<label>资源状态</label>
<div class="num">
<span class="blue" lay-tips="资源状态：未监控" data-value="new" data-target="treetable_res_state" id="tree_newstate_res">0</span>/
<span class="green" lay-tips="资源状态：监控中" data-value="monitor" data-target="treetable_res_state" id="tree_monitorstate_res">0</span>/
<span class="red" lay-tips="资源状态：暂停监控" data-value="stop" data-target="treetable_res_state" id="tree_stopstate_res">0</span>
<span class="red" lay-tips="资源状态：暂停监控" data-value="stop" data-target="treetable_res_state" id="tree_stopstate_res">0</span>/
<span class="gray" lay-tips="资源状态：未监控" data-value="new" data-target="treetable_res_state" id="tree_newstate_res">0</span>
</div>
</div>
<!--<div class="info-box-count">
... ...
... ... @@ -141,3 +141,10 @@ custom-class="config-dialog"
.margin-top-bottom-10{
margin:10px 0;
}
.tree-table .el-table td.el-table__cell div{
display: flex;
align-items: center;
}
.tree-table .el-table .el-table__cell.is-center div{
justify-content: center;
}+
\ No newline at end of file
... ...
<div >
<!-- 表格-->
<el-table :border="showBorder" v-loading="loading" :size="size" ref="multipleTable" @selection-change="handleSelectionChange" :data="dataList" stripe header-row-class-name="tbl-header-class" :height="height"
style="width: 100%;margin: 0px 0px; font-size:13.5px;" :row-key="getRowKeys" :expand-row-keys="expands">
style="width: 100%;margin: 0px 0px; font-size:13.5px;" :row-key="getRowKeys" :expand-row-keys="expands" :default-expand-all="defaultExpand"
@select="handleSelect" @select-all="handleSelectAll"
>
<el-table-column type="expand" v-if="showExpand">
<template #default="scope">
... ...
... ... @@ -98,10 +98,15 @@ export default {
type: String,
default: 'id'
},
//是否默认展开所有行
//默认展开哪行
expands:{
type: Array,
default: []
},
//是否默认展开所有行
defaultExpand:{
type:Boolean,
default:false
}
},
data() {
... ... @@ -150,6 +155,7 @@ export default {
let params = {
page: currentPage.value, limit: pageSize.value
}
proxy.$refs.multipleTable.clearSelection();
emit('loaddata', params)
}
... ... @@ -224,6 +230,44 @@ export default {
return val;
}
//设置父节点选中后children也选中
let setChecked=(row)=>{
let arr=[];
if(row.children){
row.children.map(j=>{
arr.push(j)
setChecked(j)
})
}
toggleSelection(arr)
}
//勾选数据行的Checkbox事件
let handleSelect=(selection, row)=>{
setChecked(row);
emit('handleSelect',selection)
}
//勾选全选checkbox事件
let handleSelectAll=(selection)=>{
const isSelect=selection.some(el=>{
const tableDataIds=props.dataList.map(j=>j[props.getRowKeys])
return tableDataIds.includes(el.id)
})
const isCancel=!props.dataList.every(el=>{
const selectIds=selection.map(j=>j[props.getRowKeys])
return selectIds.includes(el.id)
})
if(isSelect){
setChecked(selection);
}
if(isCancel){
props.dataList.map(el=>{
setChecked(el);
})
}
emit('handleSelectAll',selection)
}
// 挂载完
Vue.onMounted(() => {
//callback();
... ... @@ -240,6 +284,8 @@ export default {
})
return {
handleSelect,
handleSelectAll,
toggleSelection,
handleSelectionChange,
// multipleSelection,
... ...
... ... @@ -126,6 +126,17 @@ const routes = [{
name: 'connectScatter',
component: () => myImport('views/connectScatter/index')
},
{
path: '/vue3/batchChangeLeaders',
name: 'batchChangeLeaders',
component: () => myImport('views/batchChangeLeaders/index')
},
//部门业务关系
{
path: '/vue3/orgBustype',
name: 'orgBustype',
component: () => myImport('views/orgBustype/index')
},
];
// hash模式： createWebHashHistory
... ...
<el-row>
<el-col :span="24" class="search">
<div class="condition" style="display: flex;">
<el-form-item style="margin-right: 6px;margin-bottom: 10px;width: 300px">
<el-input v-model="data.searchParams.keywords" placeholder="关键字支持：名称、负责人、业务描述"></el-input>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button @click="getList">查询</el-button>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button type="primary" @click="removeRel">取消</el-button>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button type="primary" @click="changeUser">变更</el-button>
</el-form-item>
</div>
</el-col>
</el-row>
<el-row style="font-size: 12px;color: grey;padding: 6px;">
{{item.ddicDesc}}
</el-row>
<el-row class="margin-bottom-50" style="margin-top: 3px">
<el-col :span="24" class="table-height">
<cm-table-page :columns="data.columns"
:dataList="data.tableData"
:treeProps="{ children: 'children', hasChildren: 'hasChildren' }"
:total="data.count"
:pageSize="data.searchParams.limit"
@loaddata="loadTableDataList"
@selectionChange="selectionChange"
:showIndex="true"
:showSelection="true"
:showBorder="true"
:loading="loading"
:showPage="true"
:showTools="false"
:height="(height - 200)">
<template #default="{row,prop,column}">
</template>
</cm-table-page>
</el-col>
</el-row>
<ChangeUsersList :show="data.userDialogFlag" @hideDialog="showUserDialog" @savebtn="saveRel"></ChangeUsersList>
... ...
export default {
name: 'resourceTypePer',
template: '',
components: {
'ChangeUsersList': Vue.defineAsyncComponent(
() => myImport('views/batchChangeLeaders/changeUsersList/index')
),
},
data() {
},
props: {
item:{
type:Object,
default:{}
}
},
setup: function (props, {attrs, slots, emit}) {
const {proxy} = Vue.getCurrentInstance();
//列表高度
let height = Vue.ref(window.innerHeight);
let data = Vue.ref({
searchParams: {
"page": 1,
"limit": 50,
"keywords": "",
"userName": proxy.$route.query.username,
"subId": ""
},
userDialogFlag : false,
count: 0,
columns: [{
prop: "subName",
label: "订阅名称",
width: "250",
sortable: true,
align: 'center'
}, {
prop: "subType",
label: "订阅类型",
width: "120",
sortable: true,
align: 'center',
render: function (row) {
switch (row.subType) {
case '1':
return '告警订阅'
break;
case '2':
return '报表订阅'
break;
case '3':
return '系统通知订阅'
break;
case '4':
return '采集器异常订阅'
break;
}
}
}, {
prop: "subWay",
label: "通知类型",
width: "120",
sortable: true,
align: 'center',
render: function (row) {
switch (row.subWay){
case 'wechat':
return '<div class="iconfont icon-weixin" style="font-size: 22px"></div>'
break;
case 'email':
return '<div class="iconfont icon-youxiang" style="font-size: 22px"></div>'
break;
case 'message':
return '<div class="iconfont icon-duanxinqunfa" style="font-size: 22px"></div>'
break;
}
}
},{
prop: "tempType",
label: "通知说明",
width: "300",
sortable: true,
align: 'center',
render: (d) => {
var sendWay = '';
switch (d.subWay){
case 'wechat':
sendWay = '微信'
break;
case 'email':
sendWay = '邮箱';
break;
case 'message':
sendWay = '短信';
break;
}
var unit = d.sentFrequency && d.sentFrequency.indexOf("?")>0?"":"分钟一次";
return `${sendWay}通知${d.sendTotal}次；频率${d.sentFrequency}${unit}`;
}
}, {
prop: "userTotal",
label: "订阅人数",
sortable: true,
align: 'center'
}, {
prop: "times",
label: "允许通知时间段",
sortable: true,
align: 'center'
}, {
prop: "syncFlag",
label: "同步状态",
sortable: true,
align: 'center',
render: (row) => {
switch (row.syncFlag) {
case '0':
return '未同步'
case '1':
return '已同步';
}
}
}],
tableData: [],
// 表格选中
checkArr:[]
})
const getList = () => {
proxy.$http.post(`/api-web/personnelChange/getList/alarmSubPer`, data.value.searchParams, function (res) {
if (res && res.success) {
let dataVal = data.value;
let list = res.data;
let count = res.count;
dataVal.tableData = list;
dataVal.count = count;
}
})
}
// 展示用户选择
let showUserDialog = (flg) =>{
data.value.userDialogFlag = flg;
}
let saveRel = (obj) =>{
// 获取选中
let arr = data.value.checkArr;
if(arr.length == 0){
proxy.$global.showMsg('请至少选择一项','warning');
return;
}
let params = {
targetUserName: obj.selectModel.join(''),
"userName": proxy.$route.query.username,
"subId": arr.join(',')
}
if(params.targetUserName == params.userName){
proxy.$global.showMsg('变更用户不能与变更前用户一致，请修改！','warning');
return;
}
proxy.$http.post(`/api-web/personnelChange/update/alarmSubPer`,params, function (res) {
if (res && res.success) {
proxy.$global.showMsg('变更成功！');
showUserDialog(false);
// 刷新表格
getList();
}
})
}
// 变更
let changeUser = () =>{
// 获取选中
let arr = data.value.checkArr;
if(arr.length == 0){
proxy.$global.showMsg('请至少选择一项','warning');
return;
}
showUserDialog(true);
}
/**
* 取消
*/
let removeRel = () =>{
let arr = data.value.checkArr;
if(arr.length == 0){
proxy.$global.showMsg('请至少选择一项','warning');
return;
}
data.value.searchParams.subId = arr.join(',')
proxy.$global.confirm("确定取消相关资源？", function () {
proxy.$http.post(`/api-web/personnelChange/remove/alarmSubPer`, data.value.searchParams , function (res) {
if (res && res.success) {
proxy.$global.showMsg('取消成功！');
getList()
}
})
});
}
//重新加载表格数据
let loadTableDataList = ({page, limit}) => {
let dataVal = data.value;
dataVal.page = page;
dataVal.limit = limit;
getList();
}
// 表格全选事件
let selectionChange = (val) => {
let checkArr = [];
val.map(item => {
checkArr.push(item.subId)
})
data.value.checkArr = checkArr;
let isCheck = (list, checkArr) => {
list.forEach((v, i) => {
v.checked = checkArr.includes(v.subId);
if (v.children) {
isCheck(v.children, checkArr);
}
});
}
isCheck(data.value.tableData, checkArr);
}
// 挂载完
Vue.onMounted(() => {
getList();
})
return {
height,
data,
getList,
changeUser,
showUserDialog,
removeRel,
loadTableDataList,
selectionChange,
saveRel
}
}
}
... ...
<el-row>
<el-col :span="24" class="search">
<div class="condition" style="display: flex;">
<el-form-item style="margin-right: 6px;margin-bottom: 10px;width: 300px">
<el-input v-model="data.searchParams.keywords" placeholder="关键字支持：名称、负责人、业务描述"></el-input>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button @click="getList">查询</el-button>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button type="primary" @click="removeRel">取消</el-button>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button type="primary" @click="changeUser">变更</el-button>
</el-form-item>
</div>
</el-col>
</el-row>
<el-row style="font-size: 12px;color: grey;padding: 6px;">
{{item.ddicDesc}}
</el-row>
<el-row class="margin-bottom-50" style="margin-top: 3px">
<el-col :span="24" class="table-height">
<cm-table-page :columns="data.columns"
:dataList="data.tableData"
:treeProps="{ children: 'children', hasChildren: 'hasChildren' }"
:total="data.count"
:pageSize="data.searchParams.limit"
@loaddata="loadTableDataList"
@selectionChange="selectionChange"
:showIndex="true"
:showSelection="true"
:showBorder="true"
:loading="loading"
:showPage="true"
:showTools="false"
:height="(height - 200)">
<template #default="{row,prop,column}">
</template>
</cm-table-page>
</el-col>
</el-row>
<ChangeUsersList :show="data.userDialogFlag" @hideDialog="showUserDialog" @savebtn="saveRel"></ChangeUsersList>
... ...
export default {
name: 'autoPatrolPortPer',
template: '',
components: {
'ChangeUsersList': Vue.defineAsyncComponent(
() => myImport('views/batchChangeLeaders/changeUsersList/index')
),
},
data() {
},
props: {
item:{
type:Object,
default:{}
}
},
setup: function (props, {attrs, slots, emit}) {
const {proxy} = Vue.getCurrentInstance();
//列表高度
let height = Vue.ref(window.innerHeight);
let data = Vue.ref({
searchParams: {
"page": 1,
"limit": 50,
"keywords": "",
"userName": proxy.$route.query.username,
"reportId": ""
},
userDialogFlag: false,
count: 0,
columns: [{
prop: "docName",
label: "文档名称",
width: "300",
sortable: true,
align: 'center'
}, {
prop: "frequencyType",
label: "调度类型",
width: "120",
sortable: true,
align: 'center',
render:(d)=>{
switch (d.frequencyType) {
case 'quarter':
return '季度'
case 'month':
return '每月'
case 'day':
return '每日'
case 'hour':
return '小时'
case 'year':
return '每年'
case 'week':
return '每周'
}
}
}, {
prop: "inspectionType",
label: "报表类型",
width: "100",
sortable: true,
align: 'center',
render: (d) => {
switch (d.reportType) {
case 'yxjk':
return '运行监控'
case 'jkjc':
return '健康检查'
case 'lxwh':
return '例行维护'
case 'gzfx':
return '故障分析'
case 'fxbg':
return '分析报告'
}
}
}, {
prop: "runningFlag",
label: "启用/禁用",
width: "120",
sortable: true,
align: 'center',
render: (d) => {
switch (d.runningFlag) {
case '1':
return '启用'
default :
return '禁用'
}
}
},{
prop: "templatePath",
label: "模板地址",
sortable: true,
align: 'left'
}],
tableData: [],
// 表格选中
checkArr: []
})
const getList = () => {
proxy.$http.post(`/api-web/personnelChange/getList/autoPatrolPortPer`, data.value.searchParams, function (res) {
if (res && res.data) {
let dataVal = data.value;
let list = res.data;
let count = res.count;
dataVal.tableData = list;
dataVal.count = count;
}
})
}
// 展示用户选择
let showUserDialog = (flg) => {
data.value.userDialogFlag = flg;
}
let saveRel = (obj) => {
// 获取选中
let arr = data.value.checkArr;
if (arr.length == 0) {
proxy.$global.showMsg('请至少选择一项', 'warning');
return;
}
let params = {
targetUserName: obj.selectModel.join(''),
"userName": proxy.$route.query.username,
"reportId": arr.join(',')
}
if (params.targetUserName == params.userName) {
proxy.$global.showMsg('变更用户不能与变更前用户一致，请修改！', 'warning');
return;
}
proxy.$http.post(`/api-web/personnelChange/update/autoPatrolPortPer`, params, function (res) {
if (res && res.success) {
proxy.$global.showMsg('变更成功！');
showUserDialog(false);
// 刷新表格
getList();
}
})
}
// 变更
let changeUser = () => {
// 获取选中
let arr = data.value.checkArr;
if (arr.length == 0) {
proxy.$global.showMsg('请至少选择一项', 'warning');
return;
}
showUserDialog(true);
}
/**
* 取消
*/
let removeRel = () => {
let arr = data.value.checkArr;
if (arr.length == 0) {
proxy.$global.showMsg('请至少选择一项', 'warning');
return;
}
data.value.searchParams.reportId = arr.join(',')
proxy.$global.confirm("确定取消相关资源？", function () {
proxy.$http.post(`/api-web/personnelChange/remove/autoPatrolPortPer`, data.value.searchParams, function (res) {
if (res && res.success) {
proxy.$global.showMsg('取消成功！');
getList()
}
})
});
}
//重新加载表格数据
let loadTableDataList = ({page, limit}) => {
let dataVal = data.value;
dataVal.page = page;
dataVal.limit = limit;
getList();
}
// 表格全选事件
let selectionChange = (val) => {
let checkArr = [];
val.map(item => {
checkArr.push(item.id)
})
data.value.checkArr = checkArr;
let isCheck = (list, checkArr) => {
list.forEach((v, i) => {
v.checked = checkArr.includes(v.id);
if (v.children) {
isCheck(v.children, checkArr);
}
});
}
isCheck(data.value.tableData, checkArr);
}
// 挂载完
Vue.onMounted(() => {
getList();
})
return {
height,
data,
getList,
changeUser,
showUserDialog,
removeRel,
loadTableDataList,
selectionChange,
saveRel
}
}
}
... ...
<el-row>
<el-col :span="24" class="search">
<div class="condition" >
<el-form ref=“form” style="display: flex;">
<el-form-item style="margin-right: 6px;margin-bottom: 10px;width: 300px">
<el-input v-model="search.keyword" placeholder="关键字支持：业务名称"></el-input>
</el-form-item>
<!--<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-select filterable clearable v-model="search.resType" placeholder="请选择资源类型">
<el-option
v-for="item in resTypeOptions"
:key="item.resTypeCode"
:label="item.resTypeName"
:value="item.resTypeCode">
</el-option>
</el-select>
</el-form-item>-->
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button @click="getListData" >查询</el-button>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button type="primary" @click="changeAdmin()" style="margin-left: 6px">变更</el-button>
</el-form-item>
</el-form>
</div>
</el-col>
</el-row>
<!--<el-row style="margin-bottom: 10px;">
<div class="flex-div-start">
&lt;!&ndash; <el-button type="primary" @click="changeCancel()" size="small">取消</el-button>&ndash;&gt;
<el-button type="primary" @click="changeAdmin()" size="small" style="margin-left: 6px">变更</el-button>
</div>
</el-row>-->
<el-row style="font-size: 12px;color: grey;padding: 6px;">
{{item.ddicDesc}}
</el-row>
<el-row class="margin-bottom-50" style="margin-top: 3px">
<el-col :span="24" class="table-height">
<cm-table-page :columns="columns"
:dataList="resourceData"
:total="count"
:pageSize="search.limit"
@loaddata="loadTableDataList"
@selectionChange="selectionChange"
:showIndex="true"
:showSelection="true"
:showBorder="true"
:loading="loading"
:showPage="true"
:showTools="false"
:height="(height - 200)">
<template #default="{row,prop,column}">
<div v-if="prop == 'showType'">
<el-select v-if="row.resType == 'HOST_X86SERVER'" v-model="row.showType" placeholder="">
<el-option
v-for="item in showTypeList"
:key="item.value"
:label="item.name"
:value="item.value"
>
</el-option>
</el-select>
</div>
</template>
</cm-table-page>
</el-col>
</el-row>
<ChangeUsersList :show="show" :isTwoGroup="isTwoGroup" :isMulti="isMulti" @hideDialog="hideDialog" @savebtn="savebtn"></ChangeUsersList>
... ...
export default {
name: 'bizLeader',
template: '',
components: {
'ChangeUsersList': Vue.defineAsyncComponent(
() => myImport('views/batchChangeLeaders/changeUsersList/index')
),
},
data() {
},
props: {
item:{
type:Object,
default:{}
}
},
setup: function (props, {attrs, slots, emit}) {
const {proxy} = Vue.getCurrentInstance();
//接收从用户列表中选中的用户
let userName=Vue.ref(proxy.$route.query.username);
//变更人员弹框
let show=Vue.ref(false);
//变更人员列表是否多选
let isMulti=Vue.ref(false);
//变更人员列表是否是两组
let isTwoGroup=Vue.ref(false);
//配置列表总数
let count = Vue.ref(0);
//列表高度
let height = Vue.ref(window.innerHeight);
//加载
let loading = Vue.ref(true);
//选中数据
let pitch = Vue.ref([]);
let showTypeList=Vue.ref([]);
let search = Vue.ref({
resType: '',
keyword: '',
page: 1,
limit: 50,
});
let resTypeOptions=Vue.ref([])
const columns = [
{
prop: 'busTypeName',
label: '业务类型名称',
sortable: true,
align: 'center',
},
{
prop: 'admin',
label: '负责人',
sortable: true,
align: 'center',
},
{
prop: 'busTypeDesc',
label: '业务类型描述',
sortable: true,
align: 'center',
},
{
prop: 'isUse',
label: '是否使用',
sortable: true,
align: 'center',
render: function (row) {
switch (row.isUse) {
case 0:
return '否';
case 1:
return '是';
default:
return '';
}
}
},
{
prop: 'important',
label: '重要程度',
sortable: true,
align: 'center',
render: function (row) {
switch (row.important) {
case 1:
return '核心';
case 2:
return '重要';
case 3:
return '一般';
case 9:
return '虚拟业务';
default:
return '';
}
}
},
{
prop: 'sort',
label: '排序',
sortable: true,
align: 'center',
},
{
prop: 'showType',
label: '展示类型',
sortable: true,
align: 'center',
/* render: function (row) {
}*/
}
];
//列表数据
let resourceData = Vue.ref([]);
//获取列表数据
const getListData = () => {
resourceData.value=[];
loading.value = true;
//定义列表参数
let getParams = {
resType:search.value.resType,
keywords:search.value.keyword,
userName:userName.value,
page: search.value.page,
limit: search.value.limit
};
proxy.$http.post("/api-web/personnelChange/getList/bizLeader", getParams, function (res) {
if (res && res.data) {
resourceData.value = res.data ? res.data : [];
count.value = res.count;
loading.value = false;
}
})
}
//重新加载表格数据
let loadTableDataList = ({page, limit}) => {
search.value.page=page;
search.value.limit=limit;
getListData();
}
let busIds=Vue.ref('');//选中的ids
//表格全选事件
let selectionChange = (val) => {
pitch.value = val;
let arr=[];
pitch.value.map(item=>{
arr.push(item.busId)
})
busIds.value=arr.join(",");//选中的值
}
//获取资源类型数据
let getResourceTypoe=()=>{
proxy.$http.get(`/api-web/manage/restype/list`, {}, function (res) {
if (res && res.data) {
resTypeOptions.value=res.data
}
})
}
//获取展示类型的字典数据
let initShowType=()=>{
proxy.$http.post("/api-web/manage/ddic/findSucDdics/DETAILS_POWER", {}, function (res) {
if (res && res.data) {
let arr=res.data;
if(arr && arr.length>0){
arr.map(v=>{
showTypeList.value.push({
name: v.ddicName
,value: v.ddicCode.substring(v.ddicCode.lastIndexOf("_")+1,v.ddicCode.length)
});
})
}
}
})
}
//批量取消相关资源
let changeCancel = () => {
if(pitch.value.length<1){
proxy.$global.showMsg('请至少选择一项','warning');
}else{
proxy.$global.confirm("确定取消相关资源？", function () {
let parmas={
userName:userName.value,
busId:busIds.value
}
proxy.$http.post(`/api-web/personnelChange/remove/bizLeader`, parmas, function (res) {
if (res && res.success) {
proxy.$global.showMsg('取消成功！');
getListData()
}
})
});
}
}
//变更负责人
let changeAdmin = () => {
if(pitch.value.length<1){
proxy.$global.showMsg('请至少选择一项','warning');
}else{
show.value=true;
}
}
//变更人员的弹框关闭后
let hideDialog =(flag)=>{
show.value=flag;
}
//变更人员的弹框保存后
let savebtn =(obj)=>{
show.value=false;
//obj.selectModel 选中的用户组（一个/主负责人) obj.selectModelSecond 辅负责人，都是数组
let targetUserName='';
if(obj.selectModel){
targetUserName=obj.selectModel.join(',')
}
let params={
busId:busIds.value,
targetUserName:targetUserName,
userName:userName.value,
}
proxy.$http.post(`/api-web/personnelChange/update/bizLeader`, params, function (res) {
if (res && res.success) {
proxy.$global.showMsg('变更成功！');
getListData()
}
})
}
// 挂载完
Vue.onMounted(() => {
initShowType();
getResourceTypoe();
getListData();
})
return {
isMulti,
isTwoGroup,
show,
initShowType,
showTypeList,
search,
resTypeOptions,
changeCancel,
count,
hideDialog,
savebtn,
changeAdmin,
getResourceTypoe,
resourceData,
columns,
height,
loading,
selectionChange,
getListData,
loadTableDataList,
userName
}
}
}
... ...
<el-row>
<el-col :span="24" class="search">
<div class="condition" style="display: flex;">
<el-form-item style="margin-right: 6px;margin-bottom: 10px;width: 300px">
<el-input v-model="data.searchParams.keywords" placeholder="关键字支持：名称、负责人、业务描述"></el-input>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button @click="getList">查询</el-button>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button type="primary" @click="removeRel">取消</el-button>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button type="primary" @click="changeUser">变更</el-button>
</el-form-item>
</div>
</el-col>
</el-row>
<el-row style="font-size: 12px;color: grey;padding: 6px;">
{{item.ddicDesc}}
</el-row>
<el-row class="margin-bottom-50" style="margin-top: 3px">
<el-col :span="24" class="table-height tree-table">
<cm-table-page :columns="data.columns"
:dataList="data.tableData"
:total="data.count"
:pageSize="data.searchParams.limit"
@loaddata="loadTableDataList"
@selectionChange="selectionChange"
:showIndex="true"
:showSelection="true"
:showBorder="true"
:loading="loading"
:showPage="true"
:showTools="false"
:getRowKeys="'busId'"
:defaultExpand="true"
:height="(height - 200)">
<template #default="{row,prop,column}">
</template>
</cm-table-page>
</el-col>
</el-row>
<ChangeUsersList :show="data.userDialogFlag" @hideDialog="showUserDialog" @savebtn="saveRel"></ChangeUsersList>
... ...
export default {
name: 'resourceTypePer',
template: '',
components: {
'ChangeUsersList': Vue.defineAsyncComponent(
() => myImport('views/batchChangeLeaders/changeUsersList/index')
),
},
data() {
},
props: {
item:{
type:Object,
default:{}
}
},
setup: function (props, {attrs, slots, emit}) {
const {proxy} = Vue.getCurrentInstance();
//列表高度
let height = Vue.ref(window.innerHeight);
let data = Vue.ref({
searchParams: {
"page": 1,
"limit": 50,
"keywords": "",
"userName": proxy.$route.query.username,
"busId": ""
},
userDialogFlag : false,
count: 0,
columns: [{
prop: "busTypeName",
label: "名称",
width: "250",
sortable: true,
align: 'left'
}, {
prop: "nickname",
label: "负责人",
width: "120",
sortable: true,
align: 'center'
}, {
prop: "busTypeDesc",
label: "业务描述",
width: "200",
sortable: true,
align: 'center'
}, {
prop: "isUse",
label: "是否使用",
sortable: true,
align: 'center',
render: (row) => {
switch (row.isUse) {
case 0:
return '否';
case 1:
return '是';
default:
return '';
}
}
}, {
prop: "important",
label: "重要程度",
sortable: true,
align: 'center',
render: (row) => {
switch (row.important) {
case 1:
return '核心';
case 2:
return '重要';
case 3:
return '一般';
case 9:
return '虚拟业务';
default:
return '';
}
}
}, {
prop: "sort",
label: "排序",
sortable: true,
align: 'center'
}],
tableData: [],
// 表格选中
checkArr:[]
})
const getList = () => {
proxy.$http.post(`/api-web/personnelChange/getList/bizPer`, data.value.searchParams, function (res) {
if (res && res.data) {
let dataVal = data.value;
let list = res.data;
let count = res.count;
let tableData = list.filter(function (v) {
if (v.parentId == '0') {
// 获取子节点
let childs = list.filter(function (v1) {
if (v1.parentId != '0' && v1.parentId == v.busId) {
// 获取子节点
return v1;
}
}).sort(function (a, b) {
return a.sort - b.sort
})
v.children = childs;
return v;
}
}).sort(function (a, b) {
return a.sort - b.sort
})
dataVal.tableData = tableData;
dataVal.count = count;
}
})
}
// 展示用户选择
let showUserDialog = (flg) =>{
data.value.userDialogFlag = flg;
}
let saveRel = (obj) =>{
// 获取选中
let arr = data.value.checkArr;
if(arr.length == 0){
proxy.$global.showMsg('请至少选择一项','warning');
return;
}
let params = {
targetUserName: obj.selectModel.join(''),
"userName": proxy.$route.query.username,
"busId": arr.join(',')
}
if(params.targetUserName == params.userName){
proxy.$global.showMsg('变更用户不能与变更前用户一致，请修改！','warning');
return;
}
proxy.$http.post(`/api-web/personnelChange/update/bizPer`,params, function (res) {
if (res && res.success) {
proxy.$global.showMsg('变更成功！');
showUserDialog(false);
// 刷新表格
getList();
}
})
}
// 变更
let changeUser = () =>{
// 获取选中
let arr = data.value.checkArr;
if(arr.length == 0){
proxy.$global.showMsg('请至少选择一项','warning');
return;
}
showUserDialog(true);
}
/**
* 取消
*/
let removeRel = () =>{
let arr = data.value.checkArr;
if(arr.length == 0){
proxy.$global.showMsg('请至少选择一项','warning');
return;
}
data.value.searchParams.busId = arr.join(',')
proxy.$global.confirm("确定取消相关资源？", function () {
proxy.$http.post(`/api-web/personnelChange/remove/bizPer`, data.value.searchParams , function (res) {
if (res && res.success) {
proxy.$global.showMsg('取消成功！');
getList()
}
})
});
}
//重新加载表格数据
let loadTableDataList = ({page, limit}) => {
let dataVal = data.value;
dataVal.page = page;
dataVal.limit = limit;
getList();
}
// 表格全选事件
let selectionChange = (val) => {
let checkArr = [];
val.map(item => {
checkArr.push(item.busId)
})
data.value.checkArr = checkArr;
let isCheck = (list, checkArr) => {
list.forEach((v, i) => {
v.checked = checkArr.includes(v.busId);
if (v.children) {
isCheck(v.children, checkArr);
}
});
}
isCheck(data.value.tableData, checkArr);
}
// 挂载完
Vue.onMounted(() => {
getList();
})
return {
height,
data,
getList,
changeUser,
showUserDialog,
removeRel,
loadTableDataList,
selectionChange,
saveRel
}
}
}
... ...
<cm-dialog :title="title" width="500px" :showDialogVisible="show" @hidedialog="hidedialog" @okfunc="getUser">
<template v-slot>
<el-row >
<el-col :span="24" class="table-height">
<span v-if="isTwoGroup">主负责人：</span>
<el-select
v-model="selectModel"
:multiple="isMulti"
placeholder="请选择用户"
style="width:80%"
clearable
filterable
>
<el-option
v-for="item in userList"
:key="item.username"
:label="item.nickname"
:value="item.username"
>
<div >
<span>{{item.orgName}}/{{item.nickname}}</span>
</div>
</el-option>
</el-select>
</el-col>
</el-row>
<el-row v-if="isTwoGroup" style="margin-top:10px;">
<el-col :span="24">
<span>辅负责人：</span>
<el-select
v-model="selectModelSecond"
multiple
placeholder="请选择用户"
style="width:80%"
clearable
filterable
>
<el-option
v-for="item in userListSecond"
:key="item.username"
:label="item.nickname"
:value="item.username"
>
<div >
<span>{{item.orgName}}/{{item.nickname}}</span>
</div>
</el-option>
</el-select>
</el-col>
</el-row>
</template>
</cm-dialog>
\ No newline at end of file
... ...
export default {
name: 'changeUsersList',
template: '',
components: {
},
data() {
},
props: {
title: {
type: String,
default: '用户列表'
},
show:{
type:Boolean,
default: false
},
//是否为多选
isMulti:{
type:Boolean,
default:false
},
//如果是主/辅负责人时为true
isTwoGroup:{
type:Boolean,
default:false
}
},
setup: function (props, {attrs, slots, emit}) {
const {proxy} = Vue.getCurrentInstance();
let height=Vue.ref(window.innerHeight);
let selectModel=Vue.ref([]);
let selectModelSecond=Vue.ref([]);
let hidedialog = () => {
emit('hideDialog', false);
}
let getUser = () =>{
let obj={}
let arr=[];
if(props.isMulti){
arr=selectModel.value
}else{
arr=[selectModel.value];
}
if(props.isTwoGroup){
obj={
selectModel: arr,
selectModelSecond: selectModelSecond.value
}
}else{
obj={
selectModel: arr,
}
}
emit('savebtn', obj);
}
let search=Vue.ref({
username:'',
nickname:'',
enabled:'',
orgId:'',
roles:'',
limit:999999,
page:1
})
let userList=Vue.ref([]);
let userListSecond=Vue.ref([]);
let count=Vue.ref(0);
//获取所有用户
let getAllUser = () =>{
proxy.$http.get('/api-user/users', search.value, function (res) {
if (res && res.data) {
userList.value=res.data;
userListSecond.value=res.data;
count.value=res.count;
}
})
}
// 挂载完
Vue.onMounted(() => {
getAllUser();
})
return {
selectModel,
height,
selectModelSecond,
getAllUser,
userList,
userListSecond,
count,
hidedialog,
getUser,
search
}
}
}
\ No newline at end of file
... ...
<el-row>
<el-col :span="24" class="search">
<div class="condition" style="display: flex;">
<el-form-item style="margin-right: 6px;margin-bottom: 10px;width: 300px">
<el-input v-model="data.searchParams.keywords" placeholder="关键字支持：名称、负责人、业务描述"></el-input>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button @click="getList">查询</el-button>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button type="primary" @click="removeRel">取消</el-button>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button type="primary" @click="changeUser">变更</el-button>
</el-form-item>
</div>
</el-col>
</el-row>
<el-row style="font-size: 12px;color: grey;padding: 6px;">
{{item.ddicDesc}}
</el-row>
<el-row class="margin-bottom-50" style="margin-top: 3px">
<el-col :span="24" class="table-height">
<cm-table-page :columns="data.columns"
:dataList="data.tableData"
:treeProps="{ children: 'children', hasChildren: 'hasChildren' }"
:total="data.count"
:pageSize="data.searchParams.limit"
@loaddata="loadTableDataList"
@selectionChange="selectionChange"
:showIndex="true"
:showSelection="true"
:showBorder="true"
:loading="loading"
:showPage="true"
:showTools="false"
:height="(height - 200)">
<template #default="{row,prop,column}">
</template>
</cm-table-page>
</el-col>
</el-row>
<ChangeUsersList :show="data.userDialogFlag" @hideDialog="showUserDialog" @savebtn="saveRel"></ChangeUsersList>
... ...
export default {
name: 'fileManagePer',
template: '',
components: {
'ChangeUsersList': Vue.defineAsyncComponent(
() => myImport('views/batchChangeLeaders/changeUsersList/index')
),
},
data() {
},
props: {
item:{
type:Object,
default:{}
}
},
setup: function (props, {attrs, slots, emit}) {
const {proxy} = Vue.getCurrentInstance();
//列表高度
let height = Vue.ref(window.innerHeight);
let data = Vue.ref({
searchParams: {
"page": 1,
"limit": 50,
"keywords": "",
"userName": proxy.$route.query.username,
"docId": ""
},
userDialogFlag: false,
count: 0,
columns: [{
prop: "name",
label: "名称",
width: "350",
sortable: true,
align: 'center'
}, {
prop: "docNo",
label: "文档编号",
width: "100",
sortable: true,
align: 'center'
}, {
prop: "createUserName",
label: "创建用户",
width: "100",
sortable: true,
align: 'center'
}, {
prop: "localPath",
label: "文档地址",
sortable: true,
align: 'left'
}],
tableData: [],
// 表格选中
checkArr: []
})
const getList = () => {
proxy.$http.post(`/api-web/personnelChange/getList/fileManagePer`, data.value.searchParams, function (res) {
if (res && res.data) {
let dataVal = data.value;
let list = res.data;
let count = res.count;
dataVal.tableData = list;
dataVal.count = count;
}
})
}
// 展示用户选择
let showUserDialog = (flg) => {
data.value.userDialogFlag = flg;
}
let saveRel = (obj) => {
// 获取选中
let arr = data.value.checkArr;
if (arr.length == 0) {
proxy.$global.showMsg('请至少选择一项', 'warning');
return;
}
let params = {
targetUserName: obj.selectModel.join(''),
"userName": proxy.$route.query.username,
"docId": arr.join(',')
}
if (params.targetUserName == params.userName) {
proxy.$global.showMsg('变更用户不能与变更前用户一致，请修改！', 'warning');
return;
}
proxy.$http.post(`/api-web/personnelChange/update/fileManagePer`, params, function (res) {
if (res && res.success) {
proxy.$global.showMsg('变更成功！');
showUserDialog(false);
// 刷新表格
getList();
}
})
}
// 变更
let changeUser = () => {
// 获取选中
let arr = data.value.checkArr;
if (arr.length == 0) {
proxy.$global.showMsg('请至少选择一项', 'warning');
return;
}
showUserDialog(true);
}
/**
* 取消
*/
let removeRel = () => {
let arr = data.value.checkArr;
if (arr.length == 0) {
proxy.$global.showMsg('请至少选择一项', 'warning');
return;
}
data.value.searchParams.docId = arr.join(',')
proxy.$global.confirm("确定取消相关资源？", function () {
proxy.$http.post(`/api-web/personnelChange/remove/fileManagePer`, data.value.searchParams, function (res) {
if (res && res.success) {
proxy.$global.showMsg('取消成功！');
getList()
}
})
});
}
//重新加载表格数据
let loadTableDataList = ({page, limit}) => {
let dataVal = data.value;
dataVal.page = page;
dataVal.limit = limit;
getList();
}
// 表格全选事件
let selectionChange = (val) => {
let checkArr = [];
val.map(item => {
checkArr.push(item.id)
})
data.value.checkArr = checkArr;
let isCheck = (list, checkArr) => {
list.forEach((v, i) => {
v.checked = checkArr.includes(v.id);
if (v.children) {
isCheck(v.children, checkArr);
}
});
}
isCheck(data.value.tableData, checkArr);
}
// 挂载完
Vue.onMounted(() => {
getList();
})
return {
height,
data,
getList,
changeUser,
showUserDialog,
removeRel,
loadTableDataList,
selectionChange,
saveRel
}
}
}
... ...
<div class="batchChange-container" style="padding:10px;">
<el-row >
<el-col :span="22">
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
<el-tab-pane v-for="(item,index) in tabData" :key="index" :label="item.ddicName" :name="item.ddicCode">
</el-tab-pane>
</el-tabs>
</el-col>
<el-col :span="2">
<div style="padding:0 10px 6px;border-bottom: 2px solid var(--el-border-color-light);">
<el-button type="primary" @click="exportClick()" size="small" style="margin-left: 6px">导出</el-button>
</div>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<component :is="activeName" :item="itemInfo" ref="roomDetail" />
</el-col>
</el-row>
</div>
<cm-dialog :title="title" width="500px" :showDialogVisible="show" @hidedialog="hidedialog" @okfunc="okExport">
<template v-slot>
<el-row>
<el-col :span="24">
<el-radio-group v-model="isAll">
<el-radio :label="1">导出全部</el-radio>
<el-radio :label="0">导出部分</el-radio>
</el-radio-group>
</el-col>
</el-row>
<el-row v-if="isAll==0">
<el-col :span="24" class="table-height">
<el-select
v-model="selectModel"
placeholder="请选择需要导出的页签"
multiple
style="width:80%"
clearable
filterable>
<el-option
v-for="item in tabData"
:key="item.ddicCode"
:label="item.ddicName"
:value="item.ddicCode"
/>
</el-select>
</el-col>
</el-row>
</template>
</cm-dialog>
... ...
export default {
name: 'batchChangeLeaders',
template: '',
components: {
//选项卡组件
'resourcePer': Vue.defineAsyncComponent(
() => myImport('views/batchChangeLeaders/resourcePer/index')
),
'resourceLeader': Vue.defineAsyncComponent(
() => myImport('views/batchChangeLeaders/resourceLeader/index')
),
'resourceTypePer': Vue.defineAsyncComponent(
() => myImport('views/batchChangeLeaders/resourceTypePer/index')
),
'bizPer': Vue.defineAsyncComponent(
() => myImport('views/batchChangeLeaders/bizPer/index')
),
'bizLeader': Vue.defineAsyncComponent(
() => myImport('views/batchChangeLeaders/bizLeader/index')
),
'alarmSubPer': Vue.defineAsyncComponent(
() => myImport('views/batchChangeLeaders/alarmSubPer/index')
),
'rolePer': Vue.defineAsyncComponent(
() => myImport('views/batchChangeLeaders/rolePer/index')
),
'topoPer': Vue.defineAsyncComponent(
() => myImport('views/batchChangeLeaders/topoPer/index')
),
'autoPatrolPortPer': Vue.defineAsyncComponent(
() => myImport('views/batchChangeLeaders/autoPatrolPortPer/index')
),
'fileManagePer': Vue.defineAsyncComponent(
() => myImport('views/batchChangeLeaders/fileManagePer/index')
),
},
data() {
},
props: {
},
setup: function (props, {attrs, slots, emit}) {
const {proxy} = Vue.getCurrentInstance();
const tabData=Vue.ref();//页签列表数据
const activeName = Vue.ref('');//标签页显示的页签名称
let itemInfo = Vue.ref({});
let selectModel=Vue.ref([]);//导出列表选中的数据
let title=Vue.ref('导出列表');//导出列表弹框名称
let show=Vue.ref(false);//导出列表弹框是否显示
let isAll=Vue.ref(1);//导出全部或者部分
//页签点击事件
const handleClick = (tab, event) => {
//console.log(tab, event)
let code = tab.props.name;
tabData.value.filter((item) =>{
if(item.ddicCode == code) {
itemInfo.value = item;
}
})
}
//导出点击事件
const exportClick=()=>{
show.value=true;
}
//导出全部按钮点击事件
const clickAll=()=>{
let arr=[];
tabData.value.map(item=>{
arr.push(item.ddicCode)
})
selectModel.value=arr;
}
//导出弹框关闭事件
let hidedialog=(flag)=>{
show.value=flag;
}
//导出弹框确认事件
let okExport=()=>{
let params={
userName:proxy.$route.query.username,
}
if(isAll.value==0){
if(selectModel.value && selectModel.value.length>0){
params.code=selectModel.value.join(',');
}else{
proxy.$global.showMsg('请选择导出所需列表','warning');
return;
}
}else{
params.code='';
}
proxy.$http.downloadFile("/api-web/personnelChange/export", params);
}
//获取需变更的选项卡数据
let getBatchChangeData=()=>{
proxy.$http.post("/api-web/manage/ddic/findSucDdics/batch_change_leaders", {}, function (res) {
if (res && res.data && res.data.length>0) {
tabData.value = res.data.sort((a,b)=>a.ddicSort-b.ddicSort);
activeName.value=tabData.value[0].ddicCode;
itemInfo.value = tabData.value[0];
}
})
}
// 挂载完
Vue.onMounted(() => {
getBatchChangeData();
})
return {
getBatchChangeData,
activeName,
handleClick,
tabData,
selectModel,
title,
show,
exportClick,
hidedialog,
okExport,
clickAll,
isAll,
itemInfo
}
}
}
... ...
<el-row>
<el-col :span="24" class="search">
<div class="condition" >
<el-form ref=“form” style="display: flex;">
<el-form-item style="margin-right: 6px;margin-bottom: 10px;width: 300px">
<el-input v-model="search.keyword" placeholder="关键字支持：资源名称、IP"></el-input>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-select filterable clearable v-model="search.resType" placeholder="请选择资源类型">
<el-option
v-for="item in resTypeOptions"
:key="item.resTypeCode"
:label="item.resTypeName"
:value="item.resTypeCode">
</el-option>
</el-select>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button @click="getListData">查询</el-button>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button type="primary" @click="changeCancel()" >取消</el-button>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button type="primary" @click="changeAdmin()" style="margin-left: 6px">变更</el-button>
</el-form-item>
</el-form>
</div>
</el-col>
</el-row>
<!--<el-row style="margin-bottom: 10px;">
<div class="flex-div-start">
<el-button type="primary" @click="changeCancel()" size="small">取消</el-button>
<el-button type="primary" @click="changeAdmin()" size="small" style="margin-left: 6px">变更</el-button>
</div>
</el-row>-->
<el-row style="font-size: 12px;color: grey;padding: 6px;">
{{item.ddicDesc}}
</el-row>
<el-row class="margin-bottom-50" style="margin-top: 3px">
<el-col :span="24" class="table-height">
<cm-table-page :columns="columns"
:dataList="resourceData"
:total="count"
:pageSize="search.limit"
@loaddata="loadTableDataList"
@selectionChange="selectionChange"
:showIndex="true"
:showSelection="true"
:showBorder="true"
:loading="loading"
:showPage="true"
:showTools="false"
:height="(height - 200)">
<template #default="{row,prop,column}">
<div v-if="prop == 'paramDesc'">
<el-select v-if="row.resType == 'HOST_X86SERVER'" v-model="row.showType" placeholder="">
<el-option
v-for="item in showTypeList"
:key="item.value"
:label="item.name"
:value="item.value"
>
</el-option>
</el-select>
</div>
</template>
</cm-table-page>
</el-col>
</el-row>
<ChangeUsersList :show="show" :isTwoGroup="isTwoGroup" :isMulti="isMulti" @hideDialog="hideDialog" @savebtn="savebtn"></ChangeUsersList>
... ...
export default {
name: 'resourceLeader',
template: '',
components: {
'ChangeUsersList': Vue.defineAsyncComponent(
() => myImport('views/batchChangeLeaders/changeUsersList/index')
),
},
data() {
},
props: {
item:{
type:Object,
default:{}
}
},
setup: function (props, {attrs, slots, emit}) {
const {proxy} = Vue.getCurrentInstance();
//接收从用户列表中选中的用户
let userName=Vue.ref(proxy.$route.query.username);
//变更人员弹框
let show=Vue.ref(false);
//变更人员列表是否多选
let isMulti=Vue.ref(false);
//变更人员列表是否是两组
let isTwoGroup=Vue.ref(false);
//配置列表总数
let count = Vue.ref(0);
//列表高度
let height = Vue.ref(window.innerHeight);
//加载
let loading = Vue.ref(true);
//选中数据
let pitch = Vue.ref([]);
let showTypeList=Vue.ref([]);
let search = Vue.ref({
resType: '',
keyword: '',
page: 1,
limit: 50,
});
let resTypeOptions=Vue.ref([])
const columns = [
{
prop: 'resName',
label: '资源名称',
sortable: true,
align: 'center',
render: function (row) {
if(!row.resName){
return row.resCode;
}
return row.resName;
}
},
{
prop: 'ip',
label: 'IP地址',
sortable: true,
align: 'center',
},
{
prop: 'port',
label: '端口号',
sortable: true,
align: 'center',
},
{
prop: 'resMainAdmin',
label: '负责人',
sortable: true,
align: 'center',
render: function (row) {
let text = "";
let preFix = "";
if(row.resMainAdmin && row.resMainAdmin.includes(userName.value)){
// 主要负责人
text = row.resMainAdmin
preFix = "主";
} else {
// 辅负责人
text = row.resAuxiliaryAdmin
preFix = "辅";
}
return `<div style="display: flex">
<div style='width: 22px;height: 22px;border-radius: 50%;line-height: 22px;border: solid 1px #5fafff;font-size: 12px;font-weight: bold;margin-right: 3px'>
${preFix}
</div>
${text}
</div>`;
}
},
{
prop: 'resTypeName',
label: '资源类型',
sortable: true,
align: 'center',
},
{
prop: 'state',
label: '资源状态',
sortable: true,
align: 'center',
render: function (row) {
switch (row.state) {
case "new" :
return '<span style="background-color: #eee;color:#666;border-radius: 100px;padding:0 8px;display: inline-block;height:24px;line-height: 24px;">未监控</span>'
case "monitor" :
return '<span style="background-color: #0BAC33;color:#fff;border-radius: 100px;padding:0 8px;display: inline-block;height:24px;line-height: 24px;">监控中</span>'
case "stop" :
return '<span style="background-color: #d81e06;color:#fff;border-radius: 100px;padding:0 8px;display: inline-block;height:24px;line-height: 24px;">暂停</span>'
default :
return '<span style="background-color: #eee;color:#666;border-radius: 100px;padding:0 8px;display: inline-block;height:24px;line-height: 24px;">未监控</span>'
}
}
},
{
prop: 'resCategory',
label: '资源分类',
sortable: true,
align: 'center',
/* render: function (row) {
}*/
}
];
//列表数据
let resourceData = Vue.ref([]);
//获取列表数据
const getListData = () => {
loading.value = true;
//定义列表参数
let getParams = {
resType:search.value.resType,
keywords:search.value.keyword,
userName:userName.value,
page: search.value.page,
limit: search.value.limit
};
proxy.$http.post("/api-web/personnelChange/getList/resourceLeader", getParams, function (res) {
if (res && res.data) {
resourceData.value = res.data ? res.data : [];
count.value = res.count;
loading.value = false;
}
})
}
//重新加载表格数据
let loadTableDataList = ({page, limit}) => {
search.value.page=page;
search.value.limit=limit;
getListData();
}
let resIds=Vue.ref('');//选中的ids
//表格全选事件
let selectionChange = (val) => {
pitch.value = val;
let arr=[];
pitch.value.map(item=>{
arr.push(item.resId)
})
resIds.value=arr.join(",");//选中的值
}
//获取资源类型数据
let getResourceTypoe=()=>{
proxy.$http.get(`/api-web/manage/restype/list`, {}, function (res) {
if (res && res.data) {
resTypeOptions.value=res.data
}
})
}
//获取展示类型的字典数据
let initShowType=()=>{
proxy.$http.post("/api-web/manage/ddic/findSucDdics/DETAILS_POWER", {}, function (res) {
if (res && res.data) {
let arr=res.data;
if(arr && arr.length>0){
arr.map(v=>{
showTypeList.value.push({
name: v.ddicName
,value: v.ddicCode.substring(v.ddicCode.lastIndexOf("_")+1,v.ddicCode.length)
});
})
}
}
})
}
//批量取消相关资源
let changeCancel = () => {
if(pitch.value.length<1){
proxy.$global.showMsg('请至少选择一项','warning');
}else{
proxy.$global.confirm("确定取消相关资源？", function () {
let parmas={
userName:userName.value,
resId:resIds.value
}
proxy.$http.post(`/api-web/personnelChange/remove/resourceLeader`, parmas, function (res) {
if (res && res.success) {
proxy.$global.showMsg('取消成功！');
getListData()
}
})
});
}
}
//变更负责人
let changeAdmin = () => {
if(pitch.value.length<1){
proxy.$global.showMsg('请至少选择一项','warning');
}else{
show.value=true;
}
}
//变更人员的弹框关闭后
let hideDialog =(flag)=>{
show.value=flag;
}
//变更人员的弹框保存后
let savebtn =(obj)=>{
show.value=false;
//obj.selectModel 选中的用户组（一个/主负责人) obj.selectModelSecond 辅负责人，都是数组
let targetUserName='';
if(obj.selectModel){
targetUserName=obj.selectModel.join(',')
}
let params={
resId:resIds.value,
targetUserName:targetUserName,
userName:userName.value,
}
proxy.$http.post(`/api-web/personnelChange/update/resourceLeader`, params, function (res) {
if (res && res.success) {
proxy.$global.showMsg('变更成功！');
getListData()
}
})
}
// 挂载完
Vue.onMounted(() => {
initShowType();
getResourceTypoe();
getListData();
})
return {
isMulti,
isTwoGroup,
show,
initShowType,
showTypeList,
search,
resTypeOptions,
changeCancel,
count,
hideDialog,
savebtn,
changeAdmin,
getResourceTypoe,
resourceData,
columns,
height,
loading,
selectionChange,
getListData,
loadTableDataList,
userName
}
}
}
... ...
<el-row>
<el-col :span="24" class="search">
<div class="condition" >
<el-form ref=“form” style="display: flex;">
<el-form-item style="margin-right: 6px;margin-bottom: 10px;width: 300px">
<el-input v-model="search.keyword" placeholder="关键字支持：资源名称、IP"></el-input>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-select filterable clearable v-model="search.resType" placeholder="请选择资源类型">
<el-option
v-for="item in resTypeOptions"
:key="item.resTypeCode"
:label="item.resTypeName"
:value="item.resTypeCode">
</el-option>
</el-select>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button @click="getListData" >查询</el-button>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button type="primary" @click="changeCancel()">取消</el-button>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button type="primary" @click="changeAdmin()" style="margin-left: 6px">变更</el-button>
</el-form-item>
</el-form>
</div>
</el-col>
</el-row>
<!--<el-row style="margin-bottom: 10px;">
<div class="flex-div-start">
<el-button type="primary" @click="changeCancel()" size="small">取消</el-button>
<el-button type="primary" @click="changeAdmin()" size="small" style="margin-left: 6px">变更</el-button>
</div>
</el-row>-->
<el-row style="font-size: 12px;color: grey;padding: 6px;">
{{item.ddicDesc}}
</el-row>
<el-row class="margin-bottom-50" style="margin-top: 3px">
<el-col :span="24" class="table-height">
<cm-table-page :columns="columns"
:dataList="resourceData"
:total="count"
:pageSize="search.limit"
@loaddata="loadTableDataList"
@selectionChange="selectionChange"
:showIndex="true"
:showSelection="true"
:showBorder="true"
:loading="loading"
:showPage="true"
:showTools="false"
:height="(height - 200)">
<template #default="{row,prop,column}">
<div v-if="prop == 'paramDesc'">
<el-select v-if="row.resType == 'HOST_X86SERVER'" v-model="row.showType" placeholder="">
<el-option
v-for="item in showTypeList"
:key="item.value"
:label="item.name"
:value="item.value"
>
</el-option>
</el-select>
</div>
</template>
</cm-table-page>
</el-col>
</el-row>
<ChangeUsersList :show="show" :isTwoGroup="isTwoGroup" :isMulti="isMulti" @hideDialog="hideDialog" @savebtn="savebtn"></ChangeUsersList>
... ...
export default {
name: 'resourcePer',
template: '',
components: {
'ChangeUsersList': Vue.defineAsyncComponent(
() => myImport('views/batchChangeLeaders/changeUsersList/index')
),
},
data() {
},
props: {
item:{
type:Object,
default:{}
}
},
setup: function (props, {attrs, slots, emit}) {
const {proxy} = Vue.getCurrentInstance();
//接收从用户列表中选中的用户
let userName=Vue.ref(proxy.$route.query.username);
//变更人员弹框
let show=Vue.ref(false);
//变更人员列表是否多选
let isMulti=Vue.ref(false);
//变更人员列表是否是两组
let isTwoGroup=Vue.ref(false);
//配置列表总数
let count = Vue.ref(0);
//列表高度
let height = Vue.ref(window.innerHeight);
//加载
let loading = Vue.ref(true);
//选中数据
let pitch = Vue.ref([]);
let showTypeList=Vue.ref([]);
let search = Vue.ref({
resType: '',
keyword: '',
page: 1,
limit: 50,
});
let resTypeOptions=Vue.ref([])
const columns = [
{
prop: 'resName',
label: '资源名称',
sortable: true,
align: 'center',
},
{
prop: 'ip',
label: 'IP地址',
sortable: true,
align: 'center',
},
{
prop: 'port',
label: '端口号',
sortable: true,
align: 'center',
},
{
prop: 'admin',
label: '负责人',
sortable: true,
align: 'center',
},
{
prop: 'resTypeName',
label: '资源类型',
sortable: true,
align: 'center',
},
{
prop: 'state',
label: '资源状态',
sortable: true,
align: 'center',
render: function (row) {
switch (row.state) {
case "new" :
return '<span style="background-color: #eee;color:#666;border-radius: 100px;padding:0 8px;display: inline-block;height:24px;line-height: 24px;">未监控</span>'
case "monitor" :
return '<span style="background-color: #0BAC33;color:#fff;border-radius: 100px;padding:0 8px;display: inline-block;height:24px;line-height: 24px;">监控中</span>'
case "stop" :
return '<span style="background-color: #d81e06;color:#fff;border-radius: 100px;padding:0 8px;display: inline-block;height:24px;line-height: 24px;">暂停</span>'
default :
return '<span style="background-color: #eee;color:#666;border-radius: 100px;padding:0 8px;display: inline-block;height:24px;line-height: 24px;">未监控</span>'
}
}
},
{
prop: 'paramDesc',
label: '展示类型',
sortable: true,
align: 'center',
/* render: function (row) {
}*/
}
];
//列表数据
let resourceData = Vue.ref([]);
//获取列表数据
const getListData = () => {
// resourceData.value=[];
loading.value = true;
//定义列表参数
let getParams = {
resType:search.value.resType,
keywords:search.value.keyword,
userName:userName.value,
page: search.value.page,
limit: search.value.limit
};
proxy.$http.post("/api-web/personnelChange/getList/resourcePer", getParams, function (res) {
if (res && res.data) {
resourceData.value = res.data ? res.data : [];
count.value = res.count;
loading.value = false;
}
})
}
//重新加载表格数据
let loadTableDataList = ({page, limit}) => {
search.value.page=page;
search.value.limit=limit;
getListData();
}
let resIds=Vue.ref('');//选中的ids
//表格全选事件
let selectionChange = (val) => {
pitch.value = val;
let arr=[];
pitch.value.map(item=>{
arr.push(item.resId)
})
resIds.value=arr.join(",");//选中的值
/*proxy.resourceData.map((v, i) => {
v.checked = false;
});
let selectData = val;
if (selectData.length > 0) {
selectData.map((item, index) => {
proxy.resourceData.map((v, i) => {
if (item.id == v.id) {
v.checked = true;
}
})
})
} else {
proxy.resourceData.map((v, i) => {
v.checked = false;
})
}*/
}
//获取资源类型数据
let getResourceTypoe=()=>{
proxy.$http.get(`/api-web/manage/restype/list`, {}, function (res) {
if (res && res.data) {
resTypeOptions.value=res.data
}
})
}
//获取展示类型的字典数据
let initShowType=()=>{
proxy.$http.post("/api-web/manage/ddic/findSucDdics/DETAILS_POWER", {}, function (res) {
if (res && res.data) {
let arr=res.data;
if(arr && arr.length>0){
arr.map(v=>{
showTypeList.value.push({
name: v.ddicName
,value: v.ddicCode.substring(v.ddicCode.lastIndexOf("_")+1,v.ddicCode.length)
});
})
}
}
})
}
//批量取消相关资源
let changeCancel = () => {
if(pitch.value.length<1){
proxy.$global.showMsg('请至少选择一项','warning');
}else{
proxy.$global.confirm("确定取消相关资源？", function () {
let parmas={
userName:userName.value,
resId:resIds.value
}
proxy.$http.post(`/api-web/personnelChange/remove/resourcePer`, parmas, function (res) {
if (res && res.success) {
proxy.$global.showMsg('取消成功！');
getListData()
}
})
});
}
}
//变更负责人
let changeAdmin = () => {
if(pitch.value.length<1){
proxy.$global.showMsg('请至少选择一项','warning');
}else{
show.value=true;
}
}
//变更人员的弹框关闭后
let hideDialog =(flag)=>{
show.value=flag;
}
//变更人员的弹框保存后
let savebtn =(obj)=>{
show.value=false;
//obj.selectModel 选中的用户组（一个/主负责人) obj.selectModelSecond 辅负责人，都是数组
let targetUserName='';
if(obj.selectModel){
targetUserName=obj.selectModel.join(',')
}
let params={
resId:resIds.value,
targetUserName:targetUserName,
userName:userName.value,
}
proxy.$http.post(`/api-web/personnelChange/update/resourcePer`, params, function (res) {
if (res && res.success) {
proxy.$global.showMsg('变更成功！');
getListData()
}
})
}
// 挂载完
Vue.onMounted(() => {
initShowType();
getResourceTypoe();
getListData();
})
return {
isMulti,
isTwoGroup,
show,
initShowType,
showTypeList,
search,
resTypeOptions,
changeCancel,
count,
hideDialog,
savebtn,
changeAdmin,
getResourceTypoe,
resourceData,
columns,
height,
loading,
selectionChange,
getListData,
loadTableDataList,
userName
}
}
}
... ...
<el-row>
<el-col :span="24" class="search">
<div class="condition" >
<el-form ref=“form” style="display: flex;">
<el-form-item style="margin-right: 6px;margin-bottom: 10px;width: 300px">
<el-input v-model="search.keyword" placeholder="关键字支持：资源类型名称"></el-input>
</el-form-item>
<!-- <el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-select filterable clearable v-model="search.resType" placeholder="请选择资源类型">
<el-option
v-for="item in resTypeOptions"
:key="item.resTypeCode"
:label="item.resTypeName"
:value="item.resTypeCode">
</el-option>
</el-select>
</el-form-item>-->
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button @click="getListData">查询</el-button>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button type="primary" @click="changeCancel()" >取消</el-button>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button type="primary" @click="changeAdmin()" style="margin-left: 6px">变更</el-button>
</el-form-item>
</el-form>
</div>
</el-col>
</el-row>
<!--<el-row style="margin-bottom: 10px;">
<div class="flex-div-start">
<el-button type="primary" @click="changeCancel()" size="small">取消</el-button>
<el-button type="primary" @click="changeAdmin()" size="small" style="margin-left: 6px">变更</el-button>
</div>
</el-row>-->
<el-row style="font-size: 12px;color: grey;padding: 6px;">
{{item.ddicDesc}}
</el-row>
<el-row class="margin-bottom-50" style="margin-top: 3px">
<el-col :span="24" class="table-height tree-table">
<cm-table-page :columns="columns"
:dataList="resourceData"
:total="count"
:pageSize="search.limit"
@loaddata="loadTableDataList"
@selectionChange="selectionChange"
:showIndex="true"
:showSelection="true"
:showBorder="true"
:loading="loading"
:showPage="true"
:showTools="false"
:getRowKeys="'resTypeId'"
:defaultExpand="true"
:height="(height - 200)">
<template #default="{row,prop,column}">
<div v-if="prop == 'showType'">
<el-select v-if="row.resType == 'HOST_X86SERVER'" v-model="row.showType" placeholder="">
<el-option
v-for="item in showTypeList"
:key="item.value"
:label="item.name"
:value="item.value"
>
</el-option>
</el-select>
</div>
</template>
</cm-table-page>
</el-col>
</el-row>
<ChangeUsersList :show="show" :isTwoGroup="isTwoGroup" :isMulti="isMulti" @hideDialog="hideDialog" @savebtn="savebtn"></ChangeUsersList>
... ...
export default {
name: 'resourceTypePer',
template: '',
components: {
'ChangeUsersList': Vue.defineAsyncComponent(
() => myImport('views/batchChangeLeaders/changeUsersList/index')
),
},
data() {
},
props: {
item:{
type:Object,
default:{}
}
},
setup: function (props, {attrs, slots, emit}) {
const {proxy} = Vue.getCurrentInstance();
//接收从用户列表中选中的用户
let userName=Vue.ref(proxy.$route.query.username);
//变更人员弹框
let show=Vue.ref(false);
//变更人员列表是否多选
let isMulti=Vue.ref(false);
//变更人员列表是否是两组
let isTwoGroup=Vue.ref(false);
//配置列表总数
let count = Vue.ref(0);
//列表高度
let height = Vue.ref(window.innerHeight);
//加载
let loading = Vue.ref(true);
//选中数据
let pitch = Vue.ref([]);
//展示类型
let showTypeList=Vue.ref([]);
//采集类型
let ddicCollType = Vue.ref([]);
let search = Vue.ref({
resType: '',
keyword: '',
page: 1,
limit: 50,
});
let resTypeOptions=Vue.ref([])
const columns = [
{
prop: 'resTypeName',
label: '资源类型名称',
sortable: true,
align: 'center',
},
{
prop: 'resTypeCode',
label: '编码',
sortable: true,
align: 'center',
},
{
prop: 'resTypeDesc',
label: '类别',
sortable: true,
align: 'center',
},
{
prop: 'collType',
label: '采集类型',
sortable: true,
align: 'center',
render: function (row) {
let collType='';
ddicCollType.value.map(item=>{
if(row.collType==item.value){
collType=item.name
}
})
return collType;
}
},
{
prop: 'forbidden',
label: '是否启用',
sortable: true,
align: 'center',
render: function (row) {
let str='';
if(row.forbidden==0){
str='启用';
}else{
str='禁用';
}
return str;
}
},
{
prop: 'showType',
label: '展示类型',
sortable: true,
align: 'center',
/* render: function (row) {
}*/
},
{
prop: 'createTime',
label: '创建时间',
align: 'center'
},
];
//列表数据
let resourceData = Vue.ref([]);
//获取列表数据
const getListData = () => {
// resourceData.value=[];
loading.value = true;
//定义列表参数
let getParams = {
resType:search.value.resType,
keywords:search.value.keyword,
userName: userName.value,
page: search.value.page,
limit: search.value.limit
};
proxy.$http.post("/api-web/personnelChange/getList/resourceTypePer", getParams, function (res) {
if (res && res.data) {
resourceData.value = handleTree(res.data, 'resTypeCode', 'parentId')
count.value = res.count;
loading.value = false;
}else{
resourceData.value=[];
}
})
}
//组装树结构
let handleTree=(data, id, parentId, children)=> {
let config = {
id: id || 'id',
parentId: parentId || 'parentId',
childrenList: children || 'children'
};
var childrenListMap = {};
var nodeIds = {};
var tree = [];
for (let d of data) {
let parentId = d[config.parentId];
if (childrenListMap[parentId] == null) {
childrenListMap[parentId] = [];
}
nodeIds[d[config.id]] = d;
childrenListMap[parentId].push(d);
}
for (let d of data) {
let parentId = d[config.parentId];
if (nodeIds[parentId] == null) {
tree.push(d);
}
}
for (let t of tree) {
adaptToChildrenList(t);
}
function adaptToChildrenList(o) {
if (childrenListMap[o[config.id]] !== null) {
o[config.childrenList] = childrenListMap[o[config.id]];
}
if (o[config.childrenList]) {
for (let c of o[config.childrenList]) {
adaptToChildrenList(c);
}
}
}
return tree;
}
//重新加载表格数据
let loadTableDataList = ({page, limit}) => {
search.value.page=page;
search.value.limit=limit;
selectionChange([])
getListData();
}
let resTypeId=Vue.ref('');//选中的ids
//表格全选事件
let selectionChange = (val) => {
pitch.value = val;
let arr=[];
pitch.value.map(item=>{
arr.push(item.resTypeId)
})
resTypeId.value=arr.join(",");//选中的值
}
//获取资源类型数据
let getResourceTypoe=()=>{
proxy.$http.get(`/api-web/manage/restype/list`, {}, function (res) {
if (res && res.data) {
resTypeOptions.value=res.data
}
})
}
//获取展示类型的字典数据
let initShowType=()=>{
proxy.$http.post("/api-web/manage/ddic/findSucDdics/DETAILS_POWER", {}, function (res) {
if (res && res.data) {
let arr=res.data;
if(arr && arr.length>0){
arr.map(v=>{
showTypeList.value.push({
name: v.ddicName
,value: v.ddicCode.substring(v.ddicCode.lastIndexOf("_")+1,v.ddicCode.length)
});
})
}
}
})
}
//获取采集类型的字典数据
let initCollType=()=>{
proxy.$http.post("/api-web/manage/ddic/findSucDdics/collType", {}, function (res) {
if (res && res.data) {
let arr=res.data;
if(arr && arr.length>0){
arr.map(v=>{
ddicCollType.value.push({
name: v.ddicName
,value: v.ddicCode
});
})
}
}
})
}
//批量取消负责的相关资源
let changeCancel = () => {
if(pitch.value.length<1){
proxy.$global.showMsg('请至少选择一项','warning');
}else{
proxy.$global.confirm("确定取消负责的相关资源？", function () {
let parmas={
userName:userName.value,
resTypeId:resTypeId.value
}
proxy.$http.post(`/api-web/personnelChange/remove/resourceTypePer`, parmas, function (res) {
if (res && res.success) {
proxy.$global.showMsg('取消成功！');
getListData()
}
})
});
}
}
//变更负责人
let changeAdmin = () => {
if(pitch.value.length<1){
proxy.$global.showMsg('请至少选择一项','warning');
}else{
show.value=true;
}
}
//变更人员的弹框关闭后
let hideDialog =(flag)=>{
show.value=flag;
}
//变更人员的弹框保存后
let savebtn =(obj)=>{
show.value=false;
//obj.selectModel 选中的用户组（一个/主负责人) obj.selectModelSecond 辅负责人，都是数组
let targetUserName='';
if(obj.selectModel){
targetUserName=obj.selectModel.join(',')
}
let params={
resTypeId:resTypeId.value,
targetUserName:targetUserName,
userName:userName.value,
}
proxy.$http.post(`/api-web/personnelChange/update/resourceTypePer`, params, function (res) {
if (res && res.success) {
proxy.$global.showMsg('变更成功！');
getListData()
}
})
}
// 挂载完
Vue.onMounted(() => {
initShowType();
initCollType();
getResourceTypoe();
getListData();
})
return {
isMulti,
isTwoGroup,
show,
initShowType,
initCollType,
showTypeList,
ddicCollType,
search,
resTypeOptions,
changeCancel,
count,
hideDialog,
savebtn,
changeAdmin,
getResourceTypoe,
resourceData,
columns,
height,
loading,
selectionChange,
getListData,
loadTableDataList,
}
}
}
... ...
<el-row>
<el-col :span="24" class="search">
<div class="condition" >
<el-form ref=“form” style="display: flex;">
<el-form-item style="margin-right: 6px;margin-bottom: 10px;width: 300px">
<el-input v-model="search.keyword" placeholder="关键字支持：角色名称"></el-input>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button @click="getListData" >查询</el-button>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button type="primary" @click="changeCancel()" >取消</el-button>
</el-form-item>
</el-form>
</div>
</el-col>
</el-row>
<!--<el-row style="margin-bottom: 10px;">
<div class="flex-div-start">
<el-button type="primary" @click="changeCancel()" size="small">取消</el-button>
&lt;!&ndash; <el-button type="primary" @click="changeAdmin()" size="small" style="margin-left: 6px">变更</el-button>&ndash;&gt;
</div>
</el-row>-->
<el-row style="font-size: 12px;color: grey;padding: 6px;">
{{item.ddicDesc}}
</el-row>
<el-row class="margin-bottom-50" style="margin-top: 3px">
<el-col :span="24" class="table-height">
<cm-table-page :columns="columns"
:dataList="resourceData"
:total="count"
:pageSize="search.limit"
@loaddata="loadTableDataList"
@selectionChange="selectionChange"
:showIndex="true"
:showSelection="true"
:showBorder="true"
:loading="loading"
:showPage="true"
:showTools="false"
:height="(height - 200)">
<template #default="{row,prop,column}">
</template>
</cm-table-page>
</el-col>
</el-row>
<ChangeUsersList :show="show" :isTwoGroup="isTwoGroup" :isMulti="isMulti" @hideDialog="hideDialog" @savebtn="savebtn"></ChangeUsersList>
... ...
export default {
name: 'rolePer',
template: '',
components: {
'ChangeUsersList': Vue.defineAsyncComponent(
() => myImport('views/batchChangeLeaders/changeUsersList/index')
),
},
data() {
},
props: {
item:{
type:Object,
default:{}
}
},
setup: function (props, {attrs, slots, emit}) {
const {proxy} = Vue.getCurrentInstance();
//接收从用户列表中选中的用户
let userName=Vue.ref(proxy.$route.query.username);
//变更人员弹框
let show=Vue.ref(false);
//变更人员列表是否多选
let isMulti=Vue.ref(false);
//变更人员列表是否是两组
let isTwoGroup=Vue.ref(false);
//配置列表总数
let count = Vue.ref(0);
//列表高度
let height = Vue.ref(window.innerHeight);
//加载
let loading = Vue.ref(true);
//选中数据
let pitch = Vue.ref([]);
let search = Vue.ref({
resType: '',
keyword: '',
page: 1,
limit: 50,
});
const columns = [
{
prop: 'name',
label: '角色名称',
sortable: true,
align: 'center',
},
{
prop: 'code',
label: '角色编码',
sortable: true,
align: 'center',
},
{
prop: 'remark',
label: '角色备注',
sortable: true,
align: 'center',
}
];
//列表数据
let resourceData = Vue.ref([]);
//获取列表数据
const getListData = () => {
resourceData.value=[];
loading.value = true;
//定义列表参数
let getParams = {
resType:search.value.resType,
keywords:search.value.keyword,
userName:userName.value,
page: search.value.page,
limit: search.value.limit
};
proxy.$http.post("/api-web/personnelChange/getList/rolePer", getParams, function (res) {
if (res && res.data) {
resourceData.value = res.data ? res.data : [];
count.value = res.count;
loading.value = false;
}
})
}
//重新加载表格数据
let loadTableDataList = ({page, limit}) => {
search.value.page=page;
search.value.limit=limit;
getListData();
}
let roleIds=Vue.ref('');//选中的ids
//表格全选事件
let selectionChange = (val) => {
pitch.value = val;
let arr=[];
pitch.value.map(item=>{
arr.push(item.id)
})
roleIds.value=arr.join(",");//选中的值
}
//批量取消相关资源
let changeCancel = () => {
if(pitch.value.length<1){
proxy.$global.showMsg('请至少选择一项','warning');
}else{
proxy.$global.confirm("确定取消相关资源？", function () {
let parmas={
userName:userName.value,
roleId:roleIds.value
}
proxy.$http.post(`/api-web/personnelChange/remove/rolePer`, parmas, function (res) {
if (res && res.success) {
proxy.$global.showMsg('取消成功！');
getListData()
}
})
});
}
}
//变更负责人
let changeAdmin = () => {
if(pitch.value.length<1){
proxy.$global.showMsg('请至少选择一项','warning');
}else{
show.value=true;
}
}
//变更人员的弹框关闭后
let hideDialog =(flag)=>{
show.value=flag;
}
//变更人员的弹框保存后
let savebtn =(obj)=>{
show.value=false;
//obj.selectModel 选中的用户组（一个/主负责人) obj.selectModelSecond 辅负责人，都是数组
let targetUserName='';
if(obj.selectModel){
targetUserName=obj.selectModel.join(',')
}
let params={
roleId:roleIds.value,
targetUserName:targetUserName,
userName:userName.value,
}
proxy.$http.post(`/api-web/personnelChange/update/rolePer`, params, function (res) {
if (res && res.success) {
proxy.$global.showMsg('变更成功！');
getListData()
}
})
}
// 挂载完
Vue.onMounted(() => {
getListData();
})
return {
isMulti,
isTwoGroup,
show,
search,
changeCancel,
count,
hideDialog,
savebtn,
changeAdmin,
resourceData,
columns,
height,
loading,
selectionChange,
getListData,
loadTableDataList,
userName
}
}
}
... ...
<el-row>
<el-col :span="24" class="search">
<div class="condition" style="display: flex;">
<el-form-item style="margin-right: 6px;margin-bottom: 10px;width: 300px">
<el-input v-model="data.searchParams.keywords" placeholder="关键字支持：名称、负责人、业务描述"></el-input>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button @click="getList">查询</el-button>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button type="primary" @click="removeRel">取消</el-button>
</el-form-item>
<el-form-item style="margin-right: 6px;margin-bottom: 10px;">
<el-button type="primary" @click="changeUser">变更</el-button>
</el-form-item>
</div>
</el-col>
</el-row>
<el-row style="font-size: 12px;color: grey;padding: 6px;">
{{item.ddicDesc}}
</el-row>
<el-row class="margin-bottom-50" style="margin-top: 3px">
<el-col :span="24" class="table-height">
<cm-table-page :columns="data.columns"
:dataList="data.tableData"
:treeProps="{ children: 'children', hasChildren: 'hasChildren' }"
:total="data.count"
:pageSize="data.searchParams.limit"
@loaddata="loadTableDataList"
@selectionChange="selectionChange"
:showIndex="true"
:showSelection="true"
:showBorder="true"
:loading="loading"
:showPage="true"
:showTools="false"
:height="(height - 200)">
<template #default="{row,prop,column}">
</template>
</cm-table-page>
</el-col>
</el-row>
<ChangeUsersList :show="data.userDialogFlag" @hideDialog="showUserDialog" @savebtn="saveRel"></ChangeUsersList>
... ...
export default {
name: 'resourceTypePer',
template: '',
components: {
'ChangeUsersList': Vue.defineAsyncComponent(
() => myImport('views/batchChangeLeaders/changeUsersList/index')
),
},
data() {
},
props: {
item:{
type:Object,
default:{}
}
},
setup: function (props, {attrs, slots, emit}) {
const {proxy} = Vue.getCurrentInstance();
//列表高度
let height = Vue.ref(window.innerHeight);
let data = Vue.ref({
searchParams: {
"page": 1,
"limit": 50,
"keywords": "",
"userName": proxy.$route.query.username,
"jtopoId": ""
},
userDialogFlag : false,
count: 0,
columns: [{
prop: "topoName",
label: "名称",
width: "250",
sortable: true,
align: 'center'
},
{
prop: "isDefault",
label: "默认状态",
sortable: true,
align: 'center',
render: (row) => {
//1是默认，0为非默认
switch (row.isDefault) {
case 0:
return '非默认';
case 1:
return '默认';
default:
return '';
}
}
}, {
prop: "createUser",
label: "创建人",
sortable: true,
align: 'center',
}, {
prop: "createTime",
label: "创建时间",
sortable: true,
align: 'center'
}, {
prop: "remark",
label: "备注",
sortable: true,
align: 'center'
}],
tableData: [],
// 表格选中
checkArr:[]
})
const getList = () => {
proxy.$http.post(`/api-web/personnelChange/getList/topoPer`, data.value.searchParams, function (res) {
if (res && res.data) {
let dataVal = data.value;
let list = res.data;
let count = res.count;
let tableData = list.filter(function (v) {
if (v.parentId == '0') {
// 获取子节点
let childs = list.filter(function (v1) {
if (v1.parentId != '0' && v1.parentId == v.jtopoId) {
// 获取子节点
return v1;
}
}).sort(function (a, b) {
return a.sort - b.sort
})
v.children = childs;
return v;
}
}).sort(function (a, b) {
return a.sort - b.sort
})
dataVal.tableData = list;
dataVal.count = count;
}
})
}
// 展示用户选择
let showUserDialog = (flg) =>{
data.value.userDialogFlag = flg;
}
let saveRel = (obj) =>{
// 获取选中
let arr = data.value.checkArr;
if(arr.length == 0){
proxy.$global.showMsg('请至少选择一项','warning');
return;
}
let params = {
targetUserName: obj.selectModel.join(''),
"userName": proxy.$route.query.username,
"jtopoId": arr.join(',')
}
if(params.targetUserName == params.userName){
proxy.$global.showMsg('变更用户不能与变更前用户一致，请修改！','warning');
return;
}
proxy.$http.post(`/api-web/personnelChange/update/topoPer`,params, function (res) {
if (res && res.success) {
proxy.$global.showMsg('变更成功！');
showUserDialog(false);
// 刷新表格
getList();
}
})
}
// 变更
let changeUser = () =>{
// 获取选中
let arr = data.value.checkArr;
if(arr.length == 0){
proxy.$global.showMsg('请至少选择一项','warning');
return;
}
showUserDialog(true);
}
/**
* 取消
*/
let removeRel = () =>{
let arr = data.value.checkArr;
if(arr.length == 0){
proxy.$global.showMsg('请至少选择一项','warning');
return;
}
data.value.searchParams.jtopoId = arr.join(',')
proxy.$global.confirm("确定取消相关资源？", function () {
proxy.$http.post(`/api-web/personnelChange/remove/topoPer`, data.value.searchParams , function (res) {
if (res && res.success) {
proxy.$global.showMsg('取消成功！');
getList()
}
})
});
}
//重新加载表格数据
let loadTableDataList = ({page, limit}) => {
let dataVal = data.value;
dataVal.page = page;
dataVal.limit = limit;
getList();
}
// 表格全选事件
let selectionChange = (val) => {
let checkArr = [];
val.map(item => {
checkArr.push(item.jtopoId)
})
data.value.checkArr = checkArr;
let isCheck = (list, checkArr) => {
list.forEach((v, i) => {
v.checked = checkArr.includes(v.jtopoId);
if (v.children) {
isCheck(v.children, checkArr);
}
});
}
isCheck(data.value.tableData, checkArr);
}
// 挂载完
Vue.onMounted(() => {
getList();
})
return {
height,
data,
getList,
changeUser,
showUserDialog,
removeRel,
loadTableDataList,
selectionChange,
saveRel
}
}
}
... ...
<div class="container" :style="{'height':height+'px','max-height':height+'px'}">
<div class="cm-card" :style="{'min-height':height+'px','max-height':height+'px','height':'100%'}">
<div class="search" style="margin:6px 0;">
<div class="condition">
<el-input style="width:160px" v-model="search.keyWords" placeholder="请输入关键字"></el-input>
<el-button size="small" type="primary" style="margin-left: 6px;" @click="getDataList">查询</el-button>
<el-button size="small" type="primary" @click="addConfig">新增关系</el-button>
<el-button size="small" type="primary" @click="delConfig">删除关系</el-button>
</div>
</div>
<div class="search-table">
<cm-table-page :columns="tableData.columns" :dataList="tableData.dataList"
:showIndex="true"
:total="tableData.count"
@loaddata = "loaddata"
:showSelection="true"
@selectionChange="selectionChange"
:showBorder="true"
:loading="false"
:pageSize="search.limit"
:showPage="true"
:showTools="true"
:height="height - 110">
<template #default="{row,prop,column}">
<div v-if="prop=='showType'">
<el-select v-model="row.showType" placeholder="">
<el-option
v-for="item in showTypeList"
:key="item.value"
:label="item.name"
:value="item.value"
>
</el-option>
</el-select>
</div>
</template>
<template #tools="{scope}">
<div class="list-handle">
<i class="el-icon-delete" title="删除关系" style="cursor: pointer;" @click="handleDelete(scope.row)"></i>
<!-- <i style="margin-left:6px;cursor: pointer;" class="el-icon-edit" title="修改" @click="handleEdit(scope.row)"></i>-->
</div>
</template>
</cm-table-page>
</div>
</div>
</div>
<!--弹框-->
<cm-dialog :title="dialog.title" width="80%" :showDialogVisible="dialog.show" @okfunc="saveConfig" @hidedialog="hideDialog" :showFooter="true">
<template v-slot>
<div class="add-container" style="height:400px;padding:0 10px;">
<!-- <div class="cm-card" :style="{'min-height':height+'px','max-height':height+'px','height':'100%'}">-->
<div class="search" style="margin:6px 0;">
<div class="condition" style="display: flex;">
<el-input style="width:160px" v-model="search.keyWordsUn" placeholder="请输入关键字"></el-input>
<el-button size="small" type="primary" style="margin-left: 6px;" @click="getDataListUnauth">查询</el-button>
</div>
</div>
<div class="search-table">
<cm-table-page :columns="tableData.columns" :dataList="tableData.dataListUn"
:showIndex="true"
:total="tableData.countUn"
@loaddata = "loaddataUn"
:showSelection="true"
@selectionChange="selectionChangeUn"
:showBorder="true"
:loading="false"
:pageSize="search.limitUn"
:showPage="true"
:showTools="false"
:height="'360'">
<template #default="{row,prop,column}">
<div v-if="prop=='showType'">
<el-select v-model="row.showType" placeholder="">
<el-option
v-for="item in showTypeList"
:key="item.value"
:label="item.name"
:value="item.value"
>
</el-option>
</el-select>
</div>
</template>
</cm-table-page>
</div>
</div>
<!-- </div>-->
</template>
</cm-dialog>
... ...