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

…eb into master-500-dev

@@ -30,6 +30,24 @@ layui.define(['form', 'admin', 'laydate', 'common','sessions','reskpilist'], fun
             ,range: true
             ,range: true
         });
         });
         var resType = localStorage.getItem("currentResType");
         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){
         if(data && data.id){
             admin.req({
             admin.req({
@@ -48,6 +66,14 @@ layui.define(['form', 'admin', 'laydate', 'common','sessions','reskpilist'], fun
                     $("#alarmPolicyType").val(res.object.policyType);
                     $("#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{
         }else{
             $("#seriousTimes").val('00:00:00 - 23:59:59');
             $("#seriousTimes").val('00:00:00 - 23:59:59');
             $("#importantTimes").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.seriousTimes = $("#seriousTimes").val();
             data.importantTimes = $("#importantTimes").val();
             data.importantTimes = $("#importantTimes").val();
             data.commonlyTimes = $("#commonlyTimes").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, 'alarmContentExpr');
             charToExpr(data, 'cleanPolicy');
             charToExpr(data, 'cleanPolicy');
             charToExpr(data, 'commonlyExpr');
             charToExpr(data, 'commonlyExpr');
@@ -187,6 +291,7 @@ layui.define(['form', 'admin', 'laydate', 'common','sessions','reskpilist'], fun
             charToExpr(data, 'seriousExpr');
             charToExpr(data, 'seriousExpr');
 
 
             form.on('submit(add-alarmpolicy-form)',function () {
             form.on('submit(add-alarmpolicy-form)',function () {
+                delete data.noticeMergeFlagExpr;
                 admin.req({
                 admin.req({
                     url : domainName +  '/api-web/alarmPolicy/save?access_token='+accessToken
                     url : domainName +  '/api-web/alarmPolicy/save?access_token='+accessToken
                     ,data:JSON.stringify(data)
                     ,data:JSON.stringify(data)
@@ -194,6 +299,9 @@ layui.define(['form', 'admin', 'laydate', 'common','sessions','reskpilist'], fun
                     ,contentType: "application/json; charset=utf-8"
                     ,contentType: "application/json; charset=utf-8"
                     ,done:function (res){
                     ,done:function (res){
                         if(res.success){
                         if(res.success){
+                            // 保存通知合并策略
+                            saveNoticeMerge(res.str);
+
                             localStorage.setItem("detailPageOfcustomPolicyId",res.str)
                             localStorage.setItem("detailPageOfcustomPolicyId",res.str)
                             layer.msg(res.msg, { offset: '15px' , icon: 1 , time: 1000 },function (){
                             layer.msg(res.msg, { offset: '15px' , icon: 1 , time: 1000 },function (){
                                 localStorage.removeItem("currentResType");
                                 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");
             $('#add-alarmpolicy-form').find('[name="policyType"]').attr("disabled","disabled");
         }
         }
     });
     });
-});
+});

@@ -443,6 +443,7 @@ layui.define(['table', 'form', 'admin', 'layer', 'common','sessions'], function
                 //查看资源订阅列表
                 //查看资源订阅列表
                 $(".view-alarmsubscribe-resource").on("click",function (){
                 $(".view-alarmsubscribe-resource").on("click",function (){
                     if($(this).text() == '0'){
                     if($(this).text() == '0'){
+                        layer.msg('暂无订阅资源，请先订阅！', {icon: 7, time: 3000});
                         return false;
                         return false;
                     }
                     }
 
 
@@ -714,6 +715,7 @@ layui.define(['table', 'form', 'admin', 'layer', 'common','sessions'], function
                 //查看指标订阅列表
                 //查看指标订阅列表
                 $(".view-alarmsubscribe-kpi").on("click",function (){
                 $(".view-alarmsubscribe-kpi").on("click",function (){
                     if($(this).text() == '0'){
                     if($(this).text() == '0'){
+                        layer.msg('暂无订阅指标，请先订阅！', {icon: 7, time: 3000});
                         return false;
                         return false;
                     }
                     }
                     var subId = $(this).data("id");
                     var subId = $(this).data("id");
@@ -776,6 +778,10 @@ layui.define(['table', 'form', 'admin', 'layer', 'common','sessions'], function
 
 
                 //查看资源类型订阅列表
                 //查看资源类型订阅列表
                 $(".view-alarmsubscribe-resType").on("click", function () {
                 $(".view-alarmsubscribe-resType").on("click", function () {
+                    if($(this).text() == '0'){
+                        layer.msg('暂无订阅资源类型，请先订阅！', {icon: 7, time: 3000});
+                        return false;
+                    }
                     var subId = $(this).data("id");
                     var subId = $(this).data("id");
                     common.openWin("template/res/typeSubscribeList", "选择资源类型", {
                     common.openWin("template/res/typeSubscribeList", "选择资源类型", {
                         subId: subId,
                         subId: subId,
@@ -788,6 +794,10 @@ layui.define(['table', 'form', 'admin', 'layer', 'common','sessions'], function
 
 
                 //查看业务类型订阅列表
                 //查看业务类型订阅列表
                 $(".view-alarmsubscribe-busId").on("click", function () {
                 $(".view-alarmsubscribe-busId").on("click", function () {
+                    if($(this).text() == '0'){
+                        layer.msg('暂无订阅业务系统，请先订阅！', {icon: 7, time: 3000});
+                        return false;
+                    }
                     var subId = $(this).data("id");
                     var subId = $(this).data("id");
                     common.openWin("template/res/typeSubscribeList", "选择业务系统", {
                     common.openWin("template/res/typeSubscribeList", "选择业务系统", {
                         subId: subId,
                         subId: subId,

@@ -87,7 +87,9 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common',
                 keyword: $("#checkTemplate_keyword").val(),
                 keyword: $("#checkTemplate_keyword").val(),
                 resType:resType
                 resType:resType
             }
             }
-            , height: 'full-200'
+            //lsq 弹框中空白太多,高度调整 2022-06-07
+            // , height: 'full-200'
+            , height: 'full-445'
             , cellMinWidth: 80
             , cellMinWidth: 80
             , page: {
             , page: {
                 layout: ['count', 'prev', 'page', 'next', 'limit', 'skip']
                 layout: ['count', 'prev', 'page', 'next', 'limit', 'skip']

@@ -660,6 +660,7 @@ layui.define(['xmSelect', 'md5'], function (exports) {
                 layer.open(Object.assign({
                 layer.open(Object.assign({
                     title: [name, 'font-size:18px;'],
                     title: [name, 'font-size:18px;'],
                     type: 1,
                     type: 1,
+                    id:(new Date()).getTime(),
                     area: area,
                     area: area,
                     resize: false,
                     resize: false,
                     shadeClose: true,//开启遮罩层
                     shadeClose: true,//开启遮罩层

@@ -24,10 +24,42 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
     //资源详细页面相关调用函数，包含各种展示类型的
     //资源详细页面相关调用函数，包含各种展示类型的
 
 
     let editKpiList = [];
     let editKpiList = [];
+    let statusKpiList=[];//lsq 状态指标数据 2022-06-08
     var obj = {
     var obj = {
         detailTimer:[],
         detailTimer:[],
         timerTime: 180000,
         timerTime: 180000,
         sessions: layui.sessions,
         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 (){
         getEditKpiList:function (){
             var editFlag = localStorage.getItem("editFlag");//是否编辑状态
             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"  }]}
         {"flag": "base","name": "最近采集时间","id": "KPIF74D9D2B","value": "2019-12-16 10:04:54","status": "0"  }]}
          */
          */
         renderText: function (targetId, resId, kpiId, fn, hasTotal,flag,isBasic) {
         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;
             var url = "/api-web/detail/block?resId=" + resId + "&kpiId=" + kpiId + "&hasTotal=" + hasTotal;
             if (flag) {
             if (flag) {
                 url += '&flag=' + flag;
                 url += '&flag=' + flag;
@@ -97,6 +132,12 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
                     var fontColor='';
                     var fontColor='';
                     var valueStr = '';
                     var valueStr = '';
                     var titleStr = '';
                     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'){
                     if(v.id == 'KPIE13DD9A3' || v.id == 'KPI02786E8D'){
                         valueStr = laytpl($("#linkStateDetailTpl").html()).render({linkStateList: v.value});
                         valueStr = laytpl($("#linkStateDetailTpl").html()).render({linkStateList: v.value});
                         //获取flag
                         //获取flag
@@ -124,10 +165,17 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
                     var tips = '<a class="detail_row_menu hide">\n' +
                     var tips = '<a class="detail_row_menu hide">\n' +
                         '<img style="width: 17px;height: 17px;" src="/src/style/img/icon_row_menu.png">\n' +
                         '<img style="width: 17px;height: 17px;" src="/src/style/img/icon_row_menu.png">\n' +
                         '</a>'
                         '</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 = "";
                     var menuId = "";
-                    if (v.id == 'KPIE13DD9A3' ||  v.id == 'KPI02786E8D') {
+                    if (v.id == 'KPIE13DD9A3' ||  v.id == 'KPI02786E8D' || status!=-1) {
                         v.name = v.name + tips;
                         v.name = v.name + tips;
-                        menuId = "id=\"" + targetId + "_detail_row_menu\"";
+                        menuId = "id=\"" + targetId + "_detail_row_menu\"  class='statusMenu'";
                     }
                     }
                     var $html = addIconByValue(valueStr);
                     var $html = addIconByValue(valueStr);
                     var resStyle = obj.alarmEleMatchStyle(v.flag, v.id);
                     var resStyle = obj.alarmEleMatchStyle(v.flag, v.id);
@@ -139,23 +187,27 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
                 fn && fn();
                 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 $that = $(this);
                     var $btn = $that.find(".detail_row_menu");
                     var $btn = $that.find(".detail_row_menu");
                     if ($btn.length > 0) {
                     if ($btn.length > 0) {
@@ -175,6 +227,9 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
          * @param cols 指定列（一组key value为一列）
          * @param cols 指定列（一组key value为一列）
          */
          */
         renderTextCols: function (targetId, resId, kpiId, cols, isBasic) {
         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;
             var url = "/api-web/detail/block?resId=" + resId + "&kpiId=" + kpiId;
             if (isBasic) {
             if (isBasic) {
                 url += '&isBasic=' + isBasic;
                 url += '&isBasic=' + isBasic;
@@ -184,6 +239,12 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
             }).done(function (res) {
             }).done(function (res) {
                 var flags = "";
                 var flags = "";
                 var kpiIdList= "";
                 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;
                 var data = res.data;
                 if (data.length > 0) {
                 if (data.length > 0) {
                     var dataArr = common.splieceGroup(data, cols);
                     var dataArr = common.splieceGroup(data, cols);
@@ -215,13 +276,21 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
                                 //获取kpi
                                 //获取kpi
                                 kpiIdList += ar.id + ",";
                                 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' +
                                 '<img style="width: 17px;height: 17px;" src="/src/style/img/icon_row_menu.png">\n' +
                                 '</a>'
                                 '</a>'
+                            //end lsq 2022-06-08
                             var menuId = "";
                             var menuId = "";
-                            if (ar.id == 'KPIE13DD9A3' ||  ar.id == 'KPI02786E8D') {
+                            if (ar.id == 'KPIE13DD9A3' ||  ar.id == 'KPI02786E8D' || status!=-1) {
                                 ar.name = ar.name + tips;
                                 ar.name = ar.name + tips;
-                                menuId = "id=\"" + targetId + "_detail_row_menu\"";
+                                menuId = "id=\"" + targetId + "_detail_row_menu\" class='statusMenu'";
                             }
                             }
                             var $html = addIconByValue(valueStr);
                             var $html = addIconByValue(valueStr);
                             var resStyle = obj.alarmEleMatchStyle(ar.flag, ar.id);
                             var resStyle = obj.alarmEleMatchStyle(ar.flag, ar.id);
@@ -243,20 +312,24 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
                     $("#" + targetId).html(li);
                     $("#" + 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 $that = $(this);
                     var $btn = $that.find(".detail_row_menu");
                     var $btn = $that.find(".detail_row_menu");
                     if ($btn.length > 0) {
                     if ($btn.length > 0) {
@@ -4138,6 +4211,8 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
             var canCA = $menu.data('canca');
             var canCA = $menu.data('canca');
             var inCAing = $menu.data('incaing');
             var inCAing = $menu.data('incaing');
             var nature = $menu.data('nature');
             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>';
             var menubox = '<div class="detail_menubox" id="detail_menubox_id" style="color:#666;"><ul>';
             if (!nature) {
             if (!nature) {
                 menubox +=
                 menubox +=
@@ -4150,8 +4225,10 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
             if (!nature) {
             if (!nature) {
                 menubox += '<li type="t"><i class="layui-icon">&#xe62c;</i>性能趋势</li>';
                 menubox += '<li type="t"><i class="layui-icon">&#xe62c;</i>性能趋势</li>';
             }
             }
-
+            // if(!statusF){
             menubox += '<li type="n"><i class="layui-icon">&#xe758;</i>压制次数</li>';
             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
             // Start Wang 2022/3/28 14:06 833:屏蔽纳入容量预测按钮 https://hgkj.zentaopm.com/task-view-833.html
             // 后面计划将功能作为配置项
             // 后面计划将功能作为配置项
             // if (canCA) {
             // if (canCA) {
@@ -4182,45 +4259,25 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
                 flag = flag.replace(/^\s+|\s+$/g, "");
                 flag = flag.replace(/^\s+|\s+$/g, "");
             }
             }
             //start lsq 根据kpiid获取是否是指标状态 2022-05-23
             //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 (){
             setTimeout(function (){
                 //end lsq 2022-05-23
                 //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);
     exports('commonDetail', obj);
 });
 });

@@ -162,6 +162,12 @@ layui.define(['common', 'swiper', 'admin','commonDetail','mxClient','sessions','
                                             // currentBizId = bizlist[0].busId;
                                             // 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) {
                                         $('#indexbizhealth [data-index-banner-item="type"]').on("contextmenu", function (e) {
                                             $('[type="t"]').show();
                                             $('[type="t"]').show();
@@ -305,6 +311,29 @@ layui.define(['common', 'swiper', 'admin','commonDetail','mxClient','sessions','
                 $("#indexActiveAlarmList").html('<li style="width:390px;"><p>无告警</p></li>');
                 $("#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',warnVal,'#warn-text-view');
             setDefault('select-content-ul-bus',busVal,'#bus-text-view');
             setDefault('select-content-ul-bus',busVal,'#bus-text-view');
 
 
+
             // Start 告警级别默认为严重告警，点击左下角选择告警级别，页面的小红点切换不同告警的数量，item根据告警数量进行排序 LSQ 2021/12/29 19:37
             // Start 告警级别默认为严重告警，点击左下角选择告警级别，页面的小红点切换不同告警的数量，item根据告警数量进行排序 LSQ 2021/12/29 19:37
-            $(".select-total").hide();
+            $(".select-serious").hide();
             $(".select-important").hide();
             $(".select-important").hide();
             $(".select-normal").hide();
             $(".select-normal").hide();
             var itemArr=$(".index-banner-item");
             var itemArr=$(".index-banner-item");
             itemArr.map((index,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'))
                 $(item).css('order',$(item).data('serious'))
             })
             })

@@ -113,6 +113,8 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common',
                                     if (configDeptPwdOpen == 1){
                                     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-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>';
                                     _html += '</div>';
                                     return _html;
                                     return _html;
                                 }
                                 }
@@ -182,6 +184,11 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common',
                        }
                        }
                        openEditHtml($(this).data("id"))
                        openEditHtml($(this).data("id"))
                    })
                    })
+                   //start lsq 业务授权
+                   $('.org_busType_authorization_btn').unbind().on('click',function () {
+
+                       busTypeAuthorization($(this).data('orgid'))
+                   });
                }
                }
                , error(error) {
                , error(error) {
                    layer.close(loading)
                    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) {
         function saveDeptPwd(conf) {
             loading = layer.load(2);
             loading = layer.load(2);
             admin.req({
             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>' +
                     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-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_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>'+
                                 '<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 () {
                 $('.user-config-default-index').unbind('click').on('click', function () {
                     var username = $(this).data('username');
                     var username = $(this).data('username');

@@ -229,12 +229,24 @@ layui.extend({
             var loginIndex = 'default';
             var loginIndex = 'default';
             // let loginSkin = sessionStorage.getItem("loginSkin");
             // let loginSkin = sessionStorage.getItem("loginSkin");
             //lsq 从cookie中获取登录皮肤 2022-03-31
             //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(){
         container.render(path).done(function(){
         admin.pageType = 'alone';
         admin.pageType = 'alone';

@@ -62,13 +62,13 @@
     </fieldset>
     </fieldset>
     <div class="layui-tab layui-tab-card">
     <div class="layui-tab layui-tab-card">
         <ul class="layui-tab-title">
         <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>过滤</li>
             <li>消除</li>
             <li>消除</li>
-<!--            <li>告警内容表达式</li>-->
+            <li id="noticeMergeTab" style="display: none"><span style="color:red">*</span>通知合并策略</li>
         </ul>
         </ul>
         <div class="layui-tab-content">
         <div class="layui-tab-content">
             <div class="layui-tab-item layui-show content-tab-item">
             <div class="layui-tab-item layui-show content-tab-item">
@@ -355,50 +355,19 @@
                     </div>
                     </div>
                 </div>
                 </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>
     </div>
     </div>
 
 
@@ -408,4 +377,4 @@
     layui.use('alarmpolicyAdd', function (fn) {
     layui.use('alarmpolicyAdd', function (fn) {
         fn({{d}});
         fn({{d}});
     });
     });
-</script>
+</script>

 <article>
 <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">
     <div class="layui-card">
         <form class="layui-form layui-form-pane" lay-filter="form-task-bindchecktemp"
         <form class="layui-form layui-form-pane" lay-filter="form-task-bindchecktemp"
               onsubmit="return false;">
               onsubmit="return false;">
@@ -47,7 +33,7 @@
                         <button class="layui-btn layui-btn-primary hide" id="btn-task-bindchecktemp-unselectres"><i
                         <button class="layui-btn layui-btn-primary hide" id="btn-task-bindchecktemp-unselectres"><i
                             class="layui-icon">&#xe640;</i>取消选择
                             class="layui-icon">&#xe640;</i>取消选择
                         </button>
                         </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>
                 </div>
             </div>
             </div>
@@ -83,4 +69,4 @@
   layui.use('taskbindchecktemp', function (fn) {
   layui.use('taskbindchecktemp', function (fn) {
     fn({{ d }});
     fn({{ d }});
   });
   });
-</script>
+</script>

@@ -22,12 +22,16 @@
                 <textarea name="remark" placeholder="请输入备注" class="layui-textarea"></textarea>
                 <textarea name="remark" placeholder="请输入备注" class="layui-textarea"></textarea>
             </div>
             </div>
         </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>
             <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 class="tags" id="selecte_usergroup_id_user"></div>
             </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>
         </div>
         <button id="btn-usergroup-submit" class="hide" lay-submit lay-filter="btn-usergroup-submit">提交</button>
         <button id="btn-usergroup-submit" class="hide" lay-submit lay-filter="btn-usergroup-submit">提交</button>
     </form>
     </form>

@@ -34,6 +34,7 @@
                                             <option value="1">中</option>
                                             <option value="1">中</option>
                                             <option value="2">良</option>
                                             <option value="2">良</option>
                                             <option value="3">优</option>
                                             <option value="3">优</option>
+                                            <option value="none">未监控</option>
                                         </select>
                                         </select>
                                     </div>
                                     </div>
                                 </div>
                                 </div>
@@ -54,6 +55,7 @@
                                             <option value="">=连接状态=</option>
                                             <option value="">=连接状态=</option>
                                             <option value="normal">成功</option>
                                             <option value="normal">成功</option>
                                             <option value="unnormal">失败</option>
                                             <option value="unnormal">失败</option>
+                                            <option value="9">未监控</option>
                                         </select>
                                         </select>
                                     </div>
                                     </div>
                                 </div>
                                 </div>
@@ -126,6 +128,7 @@
                                             <option value="1">中</option>
                                             <option value="1">中</option>
                                             <option value="2">良</option>
                                             <option value="2">良</option>
                                             <option value="3">优</option>
                                             <option value="3">优</option>
+                                            <option value="none">未监控</option>
                                         </select>
                                         </select>
                                     </div>
                                     </div>
                                 </div>
                                 </div>
@@ -226,6 +229,17 @@
 
 
                         <span><i class="layui-badge-dot layui-bg-red"></i>中</span>
                         <span><i class="layui-badge-dot layui-bg-red"></i>中</span>
                     </li>
                     </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>
                 </ul>
             </div>
             </div>
         </div>
         </div>
@@ -268,16 +282,18 @@
             <div class="num">
             <div class="num">
                 <span class="green" lay-tips="健康状态：优" data-value="3" data-target="biz_resStatus" id="normal_biz">0</span>/
                 <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="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>
         </div>
         <div class="info-box-count">
         <div class="info-box-count">
             <i></i>
             <i></i>
             <label>资源状态</label>
             <label>资源状态</label>
             <div class="num">
             <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="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>
         </div>
         <div class="info-box-count">
         <div class="info-box-count">
@@ -285,7 +301,8 @@
             <label>连接状态</label>
             <label>连接状态</label>
             <div class="num">
             <div class="num">
                 <span class="green" lay-tips="连接状态：成功" data-value="normal" data-target="bizlink_state" id="linksuccess_biz">0</span>/
                 <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>
         </div>
         <!-- <div class="info-box-count">
         <!-- <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="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="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="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>
         </div>
         <div class="info-box-count">
         <div class="info-box-count">

@@ -28,6 +28,7 @@
                                             <option value="1">中</option>
                                             <option value="1">中</option>
                                             <option value="2">良</option>
                                             <option value="2">良</option>
                                             <option value="3">优</option>
                                             <option value="3">优</option>
+                                            <option value="none">未监控</option>
                                         </select>
                                         </select>
                                     </div>
                                     </div>
                                 </div>
                                 </div>
@@ -37,6 +38,7 @@
                                             <option value="">=连接状态=</option>
                                             <option value="">=连接状态=</option>
                                             <option value="normal">成功</option>
                                             <option value="normal">成功</option>
                                             <option value="unnormal">失败</option>
                                             <option value="unnormal">失败</option>
+                                            <option value="9">未监控</option>
                                         </select>
                                         </select>
                                     </div>
                                     </div>
                                 </div>
                                 </div>
@@ -216,16 +218,17 @@
             <div class="num">
             <div class="num">
                 <span class="green" lay-tips="健康状态：优" data-value="3" data-target="biz_reslist_resStatus" data-field="normal">0</span>/
                 <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="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>
         </div>
         <div class="info-box-count">
         <div class="info-box-count">
             <i></i>
             <i></i>
             <label>资源状态</label>
             <label>资源状态</label>
             <div class="num">
             <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="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>
         </div>
         <div class="info-box-count div-link-state" style="display: none">
         <div class="info-box-count div-link-state" style="display: none">
@@ -233,7 +236,8 @@
             <label>连接状态</label>
             <label>连接状态</label>
             <div class="num">
             <div class="num">
                 <span class="green" lay-tips="连接状态：成功" data-value="normal" data-target="biz_reslist_link_state" data-field="linksuccess">0</span>/
                 <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>
         </div>
         <!--          <div class="info-box-count">
         <!--          <div class="info-box-count">

@@ -52,6 +52,7 @@
                                             <option value="1">中</option>
                                             <option value="1">中</option>
                                             <option value="2">良</option>
                                             <option value="2">良</option>
                                             <option value="3">优</option>
                                             <option value="3">优</option>
+                                            <option value="none">未监控</option>
                                         </select>
                                         </select>
                                     </div>
                                     </div>
                                 </div>
                                 </div>
@@ -72,6 +73,7 @@
                                             <option value="">=连接状态=</option>
                                             <option value="">=连接状态=</option>
                                             <option value="normal">成功</option>
                                             <option value="normal">成功</option>
                                             <option value="unnormal">失败</option>
                                             <option value="unnormal">失败</option>
+                                            <option value="9">未监控</option>
                                         </select>
                                         </select>
                                     </div>
                                     </div>
                                 </div>
                                 </div>
@@ -230,6 +232,17 @@
 
 
                         <span><i class="layui-badge-dot layui-bg-red"></i>中</span>
                         <span><i class="layui-badge-dot layui-bg-red"></i>中</span>
                     </li>
                     </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>
                 </ul>
             </div>
             </div>
         </div>
         </div>
@@ -431,16 +444,18 @@
             <div class="num">
             <div class="num">
                 <span class="green" lay-tips="健康状态：优" data-value="3" data-target="domain_resStatus" id="normal_domain"></span>/
                 <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="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>
         </div>
         <div class="info-box-count">
         <div class="info-box-count">
             <i></i>
             <i></i>
             <label>资源状态</label>
             <label>资源状态</label>
             <div class="num">
             <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="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>
         </div>
         <div class="info-box-count">
         <div class="info-box-count">
@@ -448,7 +463,8 @@
             <label>连接状态</label>
             <label>连接状态</label>
             <div class="num">
             <div class="num">
                 <span class="green" lay-tips="连接状态：成功" data-value="normal" data-target="domainlink_state" id="linksuccess_domain"></span>/
                 <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>
         </div>
         <!--          <div class="info-box-count">
         <!--          <div class="info-box-count">

@@ -295,6 +295,8 @@
                     <i class="{{bizClas}}"></i>
                     <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>
                     <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>
                     <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>
                 <div class="index-banner-group-list">
                 <div class="index-banner-group-list">
                     {{# layui.each(item.bizList, function(index, item){ }}
                     {{# layui.each(item.bizList, function(index, item){ }}

@@ -78,6 +78,7 @@
                                             <option value="1">中</option>
                                             <option value="1">中</option>
                                             <option value="2">良</option>
                                             <option value="2">良</option>
                                             <option value="3">优</option>
                                             <option value="3">优</option>
+                                            <option value="none">未监控</option>
                                         </select>
                                         </select>
                                     </div>
                                     </div>
                                 </div>
                                 </div>
@@ -98,6 +99,7 @@
                                             <option value="">=连接状态=</option>
                                             <option value="">=连接状态=</option>
                                             <option value="normal">成功</option>
                                             <option value="normal">成功</option>
                                             <option value="unnormal">失败</option>
                                             <option value="unnormal">失败</option>
+                                            <option value="9">未监控</option>
                                         </select>
                                         </select>
                                     </div>
                                     </div>
                                 </div>
                                 </div>
@@ -230,7 +232,7 @@
                                             <option value="1">中</option>
                                             <option value="1">中</option>
                                             <option value="2">良</option>
                                             <option value="2">良</option>
                                             <option value="3">优</option>
                                             <option value="3">优</option>
-                                        </select>
+                                            <option value="none">未监控</option>                                        </select>
                                     </div>
                                     </div>
                                 </div>
                                 </div>
                                 <div class="layui-inline">
                                 <div class="layui-inline">
@@ -336,6 +338,17 @@
 
 
                         <span><i class="layui-badge-dot layui-bg-red"></i>中</span>
                         <span><i class="layui-badge-dot layui-bg-red"></i>中</span>
                     </li>
                     </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>
                 </ul>
             </div>
             </div>
         </div>
         </div>
@@ -365,16 +378,18 @@
             <div class="num">
             <div class="num">
                 <span class="green" lay-tips="健康状态：优" data-value="3" data-target="resStatus " id="normal_res">0</span>/
                 <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="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>
         </div>
         <div class="info-box-count">
         <div class="info-box-count">
             <i></i>
             <i></i>
             <label>资源状态</label>
             <label>资源状态</label>
             <div class="num">
             <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="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>
         </div>
         <div class="info-box-count">
         <div class="info-box-count">
@@ -382,7 +397,8 @@
             <label>连接状态</label>
             <label>连接状态</label>
             <div class="num">
             <div class="num">
                 <span class="green" lay-tips="连接状态：成功" data-value="normal" data-target="link_state" id="linksuccess_res">0</span>/
                 <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>
         </div>
         <!--          <div class="info-box-count">
         <!--          <div class="info-box-count">
@@ -412,16 +428,17 @@
             <div class="num">
             <div class="num">
                 <span class="green" lay-tips="健康状态：优" data-value="3" data-target="treetable_resStatus" id="tree_normal_res">0</span>/
                 <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="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>
         </div>
         <div class="info-box-count">
         <div class="info-box-count">
             <i></i>
             <i></i>
             <label>资源状态</label>
             <label>资源状态</label>
             <div class="num">
             <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="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>
         </div>
         <!--<div class="info-box-count">
         <!--<div class="info-box-count">

@@ -141,3 +141,10 @@ custom-class="config-dialog"
 .margin-top-bottom-10{
 .margin-top-bottom-10{
     margin:10px 0;
     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;
+}+

 <div >
 <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"
     <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">
         <el-table-column type="expand" v-if="showExpand">
             <template #default="scope">
             <template #default="scope">

@@ -98,10 +98,15 @@ export default {
             type: String,
             type: String,
             default: 'id'
             default: 'id'
         },
         },
-        //是否默认展开所有行
+        //默认展开哪行
         expands:{
         expands:{
             type: Array,
             type: Array,
             default: []
             default: []
+        },
+        //是否默认展开所有行
+        defaultExpand:{
+            type:Boolean,
+            default:false
         }
         }
     },
     },
     data() {
     data() {
@@ -150,6 +155,7 @@ export default {
             let params = {
             let params = {
                 page: currentPage.value, limit: pageSize.value
                 page: currentPage.value, limit: pageSize.value
             }
             }
+            proxy.$refs.multipleTable.clearSelection();
 
 
             emit('loaddata', params)
             emit('loaddata', params)
         }
         }
@@ -224,6 +230,44 @@ export default {
             return val;
             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(() => {
         Vue.onMounted(() => {
             //callback();
             //callback();
@@ -240,6 +284,8 @@ export default {
         })
         })
 
 
         return {
         return {
+            handleSelect,
+            handleSelectAll,
             toggleSelection,
             toggleSelection,
             handleSelectionChange,
             handleSelectionChange,
             // multipleSelection,
             // multipleSelection,

@@ -126,6 +126,17 @@ const routes = [{
 		name: 'connectScatter',
 		name: 'connectScatter',
 		component: () => myImport('views/connectScatter/index')
 		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
 // 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>

+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
+        }
+    }
+}

+<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>
+