Merge branch 'master' of http://113.200.75.45:82/monitor_v3/hg-monitor-web into master-v32-xwx

@@ -136,11 +136,13 @@ layui.define(['laytpl', 'layer'], function(exports){
                 return;
                 return;
             }
             }
             if(e.status == '401'){
             if(e.status == '401'){
-                layer.msg("登录凭证失效，请重新登录验证！", {
-                    icon: 7, time: 3000
-                },function () {
-                    view.exit();
-                });
+                if(localStorage.getItem('access_token')) {
+                    layer.msg("登录凭证失效，请重新登录验证！", {
+                        icon: 7, time: 3000
+                    }, function () {
+                        view.exit();
+                    });
+                }
             }else if(e.status == '500'){
             }else if(e.status == '500'){
                 layer.msg("服务异常，请联系管理员!</br>错误信息："+e.responseJSON["resp_msg"], {
                 layer.msg("服务异常，请联系管理员!</br>错误信息："+e.responseJSON["resp_msg"], {
                     icon: 7, time: 5000
                     icon: 7, time: 5000
@@ -254,7 +256,15 @@ layui.define(['laytpl', 'layer'], function(exports){
         }
         }
 
 
         if(e.status === 404){
         if(e.status === 404){
-          that.render('template/tips/404');
+            if(!localStorage.getItem('access_token')) {
+                layer.msg("登录凭证失效，请重新登录验证！", {
+                    icon: 7, time: 3000
+                }, function () {
+                    view.exit()
+                });
+            } else {
+                that.render('template/tips/404');
+            }
         } else {
         } else {
           that.render('template/tips/error');
           that.render('template/tips/error');
         }
         }

@@ -64,3 +64,11 @@
 .userright .roles{
 .userright .roles{
     border: solid 1px rgb(251, 196, 196);
     border: solid 1px rgb(251, 196, 196);
 }
 }
+/*时间范围组件*/
+.drop-active{
+    background-color: #ecf5ff;
+    color: #66b1ff;
+}
+.select-div{
+    margin-left: 10px;
+}

+<el-row class="dataRange-container">
+    <el-col :span="24">
+        <div class="tabs-div date-flex-div-around">
+            <el-col :span="17">
+                <el-date-picker
+                        class="picker-div"
+                        v-model="dateValue"
+                        type="datetimerange"
+                        range-separator="--"
+                        start-placeholder="开始时间"
+                        end-placeholder="结束时间"
+                        format="YYYY-MM-DD hh:mm:ss"
+                        value-format="YYYY-MM-DD hh:mm:ss"
+                        :shortcuts="shortcuts"
+                        @change="changeDate"
+                >
+                </el-date-picker>
+            </el-col>
+            <el-col :span="7" class="select-div">
+               <!-- <el-select v-model="checkedId" class="m-2" placeholder="聚合频率" size="large">
+                    <el-option
+                            v-for="item in frequencyData"
+                            :key="item.ddicDesc"
+                            :label="item.ddicName"
+                            :value="item.ddicDesc"
+                            @change="changeItem"
+                    >
+                    </el-option>
+                </el-select>-->
+
+                <el-dropdown split-button size="large" type="primary">
+                        聚合频率
+                    <template #dropdown>
+                        <el-dropdown-menu>
+                            <el-dropdown-item :class="{'drop-active':checkedId==item.ddicDesc}" v-for="item in frequencyData"  @click="changeItem(item.ddicDesc,item.ddicName)"
+                                              :key="item.ddicId"
+                                              :command="item.ddicDesc">
+                                {{item.ddicName}}
+                                </el-radio>
+                            </el-dropdown-item>
+                        </el-dropdown-menu>
+                    </template>
+                </el-dropdown>
+            </el-col>
+        </div>
+    </el-col>
+</el-row>

+export default {
+    name: 'dateRange',
+    template: '',
+    components: {},
+    props: {
+        keys:{
+            type:String,
+            default: 'C620C1D453B79095A64314C8215335D5:KPI7054BC34:cpu'
+        },
+        dateValueData:{
+            type:Array,
+            default:[]
+        },
+        intervalGroup:{
+            type:String,
+            default:''
+        }
+    },
+    data () {
+        return {
+
+        }
+    },
+    setup(props, {attrs, slots, emit}){
+        const {proxy} = Vue.getCurrentInstance();
+        //接口参数-开始结束时间
+        let timeScope=Vue.ref();
+        //接口参数-聚合频率
+        // let intervalGroup=Vue.ref(60);
+        //接口参数-资源id:指标id:flag,资源id:指标id:flag
+        let keysVal=props.keys;
+        //聚合频率数据
+        let frequencyData=Vue.ref([
+            {
+                name:'5分钟聚合',
+                val:5,
+                id:'001'
+            },{
+                name:'15分钟聚合',
+                val:15,
+                id:'002'
+            },{
+                name:'1小时聚合',
+                val:60,
+                id:'003'
+            },{
+                name:'12小时聚合',
+                val:720,
+                id:'004'
+            },{
+                name:'1天聚合',
+                val:1440,
+                id:'005'
+            },{
+                name:'不聚合',
+                val:0,
+                id:'006'
+            }
+        ])
+
+        //自定义选择时间
+        let dateValue=Vue.ref();
+        //选中的聚合频率
+        let checkedId=Vue.ref();
+        let commandVal=Vue.ref('聚合频率')
+        //聚合频率选择
+        const changeItem=(val,name)=>{
+            checkedId.value=val;
+            commandVal.value=name;
+            loadPerformance();
+        }
+        //时间控件左侧
+        let shortcuts=Vue.ref([
+            {
+                text: '最近30分钟',
+                value: () => {
+                    const end = new Date();
+                    const start = formatDate(30,'m');
+                    return [start, end]
+                },
+            },
+            {
+                text: '最近1小时',
+                value: () => {
+                    const end = new Date();
+                    const start = formatDate(1,'h');
+                    return [start, end]
+                },
+            },
+            {
+                text: '最近1天',
+                value: () => {
+                    const end = new Date();
+                    const start = formatDate(1,'d');
+                    return [start, end]
+                },
+            },
+            {
+                text: '最近3天',
+                value: () => {
+                    const end = new Date();
+                    const start = formatDate(3,'d');
+                    return [start, end]
+                },
+            },
+            {
+                text: '最近7天',
+                value: () => {
+                    const end = new Date();
+                    const start = formatDate(7,'d');
+                    return [start, end]
+                },
+            },
+            {
+                text: '最近15天',
+                value: () => {
+                    const end = new Date();
+                    const start = formatDate(15,'d');
+                    return [start, end]
+                },
+            },
+            {
+                text: '最近1个月',
+                value: () => {
+                    const end = new Date();
+                    const start = formatDate(1,'M');
+                    return [start, end]
+                },
+            },
+            {
+                text: '最近2个月',
+                value: () => {
+                    const end = new Date();
+                    const start = formatDate(2,'M');
+                    return [start, end]
+                },
+            },
+            {
+                text: '最近3个月',
+                value: () => {
+                    const end = new Date();
+                    const start = formatDate(3,'M');
+                    return [start, end]
+                },
+            },
+            {
+                text: '半年内',
+                value: () => {
+                    const end = new Date();
+                    const start = formatDate(6,'M');
+                    return [start, end]
+                },
+            },
+            {
+                text: '1年内',
+                value: () => {
+                    const end = new Date();
+                    const start = formatDate(12,'M');
+                    return [start, end]
+                },
+            },
+            {
+                text: '全部',
+                value: () => {
+                    const end = new Date();
+                    const start = ''
+                    return [start, end]
+                },
+            },
+        ])
+        //开始时间
+        let startTime=Vue.ref();
+        //结束时间
+        let endTime=Vue.ref();
+        //相差天数
+        let calcDayNum=Vue.ref(0);
+        //时间范围改变选中
+        const changeDate=(val)=>{
+            calcDayNum.value=calcDay(val[0],val[1]);
+            getRate(calcCode(calcDayNum.value))
+
+        }
+        //计算两个日期相差天数
+        const calcDay=(start,end)=>{
+            let endTime = new Date(end).getTime() / 1000 - parseInt(new Date(start).getTime() / 1000);
+            let timeDay = parseInt(endTime / 60 / 60 / 24);        //相差天数
+            return timeDay;
+        }
+        //计算需要传参的code值
+        const calcCode=(val)=>{
+            let code='';
+            if(val>0 && val<7){
+                code='time_scope_DAY';
+            }else if(val>=7 && val<30){
+                code='time_scope_WEEK';
+            }else if(val>=30 && val<90){
+                code='time_scope_MONTH';
+            }else if(val>=90 && val<180){
+                code='time_scope_QUARTER';
+            }else if(val>=180 && val<365){
+                code='time_scope_SEMESTER';
+            }else if(val>=365){
+                code='time_scope_YEAR';
+            }
+            return code;
+        }
+
+        //确定
+        const sureBtn=()=>{
+            let dateValueArr=dateValue.value;
+            if(dateValueArr && dateValueArr.length>0){
+                timeScope.value=dateValueArr.join(',');
+            }else{
+                timeScope.value='';
+            }
+
+            loadPerformance();
+
+        }
+        //查询性能数据-自定义视图
+        const loadPerformance=()=>{
+            let params={
+                timeScope:timeScope.value,
+                intervalGroup:checkedId.value,
+                keys:keysVal
+            }
+            proxy.$http.get(`/api-web/cm-data-range/loadPerformanceCustom`, params, function (res) {
+                if(res && res.data){
+                    emit('callbacksure',res.data)
+                }else{
+                    emit('callbacksure','')
+                }
+
+            })
+        }
+        //转换个位数为 00
+        let timeFormat =(number)=> {
+            return number.length == 1 ? ('0' + number) : number
+        }
+        //获取时间点 转年月日的方法
+        const getDateTime=(newDate)=>{
+            let dateTime='';
+            let year=newDate.getFullYear();//获取当前年
+            let month=timeFormat(newDate.getMonth()+1);//获取当前月
+            let day=timeFormat(newDate.getDate());//获取当前日
+            let hours=timeFormat(newDate.getHours()+'');//获取当前时
+            let minutes=timeFormat(newDate.getMinutes()+'');//获取当前分
+            let seconds=timeFormat(newDate.getSeconds()+'');//获取当前秒
+            dateTime= year+'-'+month+'-'+day+' '+hours+':'+minutes+':'+seconds;
+            return dateTime;
+        }
+        //获取前n段时间的时间点
+        const formatDate=(num,code)=>{
+            let m=num;
+            let myDate=new Date();
+            let lowData='';//当前年月日往前推m个月后获取到的年月日
+            if(code=='m'){
+                //当前时间前n分钟
+                myDate.setMinutes(myDate.getMinutes()-m);
+                lowData =getDateTime(myDate);  //用了上面转年月日的方法
+
+            }else if(code=='h'){
+                //当前时间前n小时
+                myDate.setHours(myDate.getHours()-m)
+                lowData =getDateTime(myDate);  //用了上面转年月日的方法
+            }else if(code=='d'){
+                //当前时间前n天
+                myDate.setDate(myDate.getDate() - m);
+                lowData =getDateTime(myDate);   //用了上面转年月日的方法
+            }else if(code=='M'){
+                //当前时间前n月
+                myDate.setMonth(myDate.getMonth()-m);
+                lowData =getDateTime(myDate);   //用了上面转年月日的方法
+
+            }else{
+
+            }
+            return lowData;
+
+        }
+        //判断是否传值进来
+        const isDetail=()=>{
+            if(props.dateValueData && props.dateValueData.length>0){
+                dateValue.value=props.dateValueData
+                changeDate(dateValue.value);
+            }
+                checkedId.value=props.intervalGroup;
+        }
+
+        //获取聚合频率数据
+        const getRate=(defCode)=>{
+            let param = {
+                ddicName: defCode
+            }
+            proxy.$http.get(`/api-web/ContrastAnalysis/selectTogetherRate`, param, function (res) {
+                if (res && res.data) {
+                    frequencyData.value = res.data;
+
+                }
+                sureBtn();
+            });
+        }
+
+        // 挂载完
+        Vue.onMounted(() => {
+            isDetail();
+
+        })
+        return {
+            commandVal,
+            calcDayNum,
+            calcDay,
+            shortcuts,
+            timeScope,
+            keysVal,
+            startTime,
+            endTime,
+            frequencyData,
+            dateValue,
+            changeItem,
+            checkedId,
+            changeDate,
+            sureBtn,
+            timeFormat,
+            formatDate,
+            getDateTime,
+            loadPerformance
+        }
+
+    }
+
+}

@@ -40,7 +40,9 @@ Promise.all([
         //指标类型数
         //指标类型数
         .component('cm-kpi-type-tree-input', Vue.defineAsyncComponent(() => myImport('components/common/inputkpitree/index')))
         .component('cm-kpi-type-tree-input', Vue.defineAsyncComponent(() => myImport('components/common/inputkpitree/index')))
         //所属系统
         //所属系统
-        .component('cm-biz-type-tree-input', Vue.defineAsyncComponent(() => myImport('components/common/inputbiztypetree/index')));
+        .component('cm-biz-type-tree-input', Vue.defineAsyncComponent(() => myImport('components/common/inputbiztypetree/index')))
+        //时间范围组件
+        .component('cm-date-range', Vue.defineAsyncComponent(() => myImport('components/common/dateRange/index')));
 
 
 
 
 // 	// 自定义指令
 // 	// 自定义指令

@@ -2,26 +2,26 @@
     <el-row>
     <el-row>
         <el-col :span="24">
         <el-col :span="24">
             <div class="set-add-div">
             <div class="set-add-div">
-                <el-row>
+                <el-row style="margin-bottom: 5px;margin-top: 5px">
                     <el-col :span="24">
                     <el-col :span="24">
                         <div class="flex-div-start margin-top-bottom-10">
                         <div class="flex-div-start margin-top-bottom-10">
-                            <el-input style="width:160px;" class="margin-right-10" v-model="keyWords"
+                            <el-input style="width:160px;margin-left: 10px;float: left;" class="margin-right-10" v-model="keyWords"
                                       placeholder="输入关键字"/>
                                       placeholder="输入关键字"/>
-                            <el-dropdown style="margin-top: -15px;">
+                            <el-dropdown style="margin-top: -15px;margin-left: 10px;float: left;">
                                 <el-icon class="el-icon--right">
                                 <el-icon class="el-icon--right">
                                     <arrow-down/>
                                     <arrow-down/>
                                 </el-icon>
                                 </el-icon>
                                 <cm-biz-type-tree-input multiple clearable collapseTags @callback="getBizType"/>
                                 <cm-biz-type-tree-input multiple clearable collapseTags @callback="getBizType"/>
                             </el-dropdown>
                             </el-dropdown>
 
 
-                            <el-dropdown style="margin-top: -15px;margin-left: 10px;">
+                            <el-dropdown style="margin-top: -15px;margin-left: 10px;float: left;">
                                 <el-icon class="el-icon--right">
                                 <el-icon class="el-icon--right">
                                     <arrow-down/>
                                     <arrow-down/>
                                 </el-icon>
                                 </el-icon>
                                 <cm-res-type-tree-input multiple clearable collapseTags @callback="getResType"/>
                                 <cm-res-type-tree-input multiple clearable collapseTags @callback="getResType"/>
                             </el-dropdown>
                             </el-dropdown>
 
 
-                            <div class="flex-div-start">
+                            <div class="flex-div-start" style="float: left;">
 <!--                                <el-button type="primary" @click="onReset()">重置</el-button>-->
 <!--                                <el-button type="primary" @click="onReset()">重置</el-button>-->
                                 <el-button type="primary" @click="onBtnSearch()" style="margin-left: 10px">查询</el-button>
                                 <el-button type="primary" @click="onBtnSearch()" style="margin-left: 10px">查询</el-button>
                             </div>
                             </div>

@@ -5,7 +5,7 @@
                 <el-row>
                 <el-row>
                     <div class="flex-div-start">
                     <div class="flex-div-start">
                         <el-button type="primary" @click="save()" style="margin-left: 10px">新增</el-button>
                         <el-button type="primary" @click="save()" style="margin-left: 10px">新增</el-button>
-                        <el-button type="primary" @click="deleteOther()" style="margin-left: 10px">删除</el-button>
+<!--                        <el-button type="primary" @click="deleteOther()" style="margin-left: 10px">删除</el-button>-->
                         <el-button type="primary" @click="conserve()" style="margin-left: 10px">保存</el-button>
                         <el-button type="primary" @click="conserve()" style="margin-left: 10px">保存</el-button>
                     </div>
                     </div>
                 </el-row>
                 </el-row>

@@ -48,6 +48,8 @@ export default {
         let count = Vue.ref(0);
         let count = Vue.ref(0);
         //列表数据
         //列表数据
         let portSenseConfigData = Vue.ref([]);
         let portSenseConfigData = Vue.ref([]);
+        //数据库的数据
+        let portSenseConfigList = Vue.ref([]);
         //资源数据
         //资源数据
         let resIdArr = Vue.ref([]);
         let resIdArr = Vue.ref([]);
         //列表高度
         //列表高度
@@ -80,6 +82,7 @@ export default {
                     portSenseConfigData.value = res.data ? res.data : [];
                     portSenseConfigData.value = res.data ? res.data : [];
                     count.value = res.count;
                     count.value = res.count;
                     loading.value = false;
                     loading.value = false;
+                    portSenseConfigList.value = res.data ? JSON.parse(JSON.stringify(res.data)) : [];
                 }
                 }
             })
             })
         }
         }
@@ -108,19 +111,17 @@ export default {
         //删除单个数据
         //删除单个数据
         let deleteItem = (row, index) => {
         let deleteItem = (row, index) => {
             proxy.$global.confirm("确认删除吗？", function () {
             proxy.$global.confirm("确认删除吗？", function () {
-                deleteItems([row]);
+                deleteItems(row, index);
             })
             })
         }
         }
         //删除多个或单个
         //删除多个或单个
-        let deleteItems = (list) => {
+        let deleteItems = (row, index) => {
             //新添加未保存的
             //新添加未保存的
-            let filter = list.filter(item => item.id === "");
-            deleteNotSave(filter);
-            if (filter.size === list.size) {
+            let sign = deleteNotSave(row, index);
+            if (sign) {
                 return false;
                 return false;
             }
             }
-            list = list.filter(item => item.id !== "");
-            proxy.$http.post('/api-web/bResourceExtendParam/deleteConfig', list, function (res) {
+            proxy.$http.post('/api-web/bResourceExtendParam/deleteConfig', row, function (res) {
                 if (res && res.success) {
                 if (res && res.success) {
                     proxy.$global.showMsg('删除成功');
                     proxy.$global.showMsg('删除成功');
                     loadTableDataList({page: 1, limit: pageSize.value});
                     loadTableDataList({page: 1, limit: pageSize.value});
@@ -128,16 +129,18 @@ export default {
             })
             })
         }
         }
         //删除新添加但未保存的
         //删除新添加但未保存的
-        let deleteNotSave = (list) => {
-
+        let deleteNotSave = (row, index) => {
+            let sign = false;
+            let list = portSenseConfigData.value;
+            if(row.id === ""){
+                portSenseConfigData.value = list.filter((item, i, array) => index !== i);
+            }
+            if (list.length > portSenseConfigData.value.length) {
+                proxy.$global.showMsg('删除成功');
+                sign = true;
+            }
+            return sign;
         }
         }
-        //删除
-        let deleteOther = () => {
-            let list = pitch.value.map(item => {
-                return item.resId;
-            })
-            deleteItems(list);
-        };
         //新增 添加一行数据
         //新增 添加一行数据
         let save = () => {
         let save = () => {
             let data = {
             let data = {
@@ -207,7 +210,6 @@ export default {
             selectionChange,
             selectionChange,
             deleteItem,
             deleteItem,
             save,
             save,
-            deleteOther,
             getListData,
             getListData,
             loadTableDataList,
             loadTableDataList,
             changePortSense,
             changePortSense,

@@ -29,7 +29,7 @@ layui.define(['table', 'form', 'admin', 'layer', 'laytpl', 'common', 'view', 'se
         var oldBusTypeCode = data && data.busTypeCode ? data.busTypeCode : '';
         var oldBusTypeCode = data && data.busTypeCode ? data.busTypeCode : '';
 
 
         var busType;
         var busType;
-        
+
         // 父业务下拉框
         // 父业务下拉框
         admin.req({
         admin.req({
             url: domainName + '/api-web/manage/bustype/page',
             url: domainName + '/api-web/manage/bustype/page',
@@ -71,10 +71,16 @@ layui.define(['table', 'form', 'admin', 'layer', 'laytpl', 'common', 'view', 'se
                     busType = response.data[0];
                     busType = response.data[0];
                     form.val('form-bustype-edit', busType);
                     form.val('form-bustype-edit', busType);
                     $('form[lay-filter="form-bustype-edit"] input[name="busTypeCode"]').attr('readonly', true);
                     $('form[lay-filter="form-bustype-edit"] input[name="busTypeCode"]').attr('readonly', true);
-                    userSelect.setValue([busType.admin]);
+                    setTimeout(function (){
+                        userSelect.setValue([busType.admin]);
+                    },2000)
+
                     let principal = busType.principal;
                     let principal = busType.principal;
                     let principalLi = principal ? principal.split(",") : [];
                     let principalLi = principal ? principal.split(",") : [];
-                    opsSelect.setValue(principalLi);
+                    setTimeout(function (){
+                        opsSelect.setValue(principalLi);
+                    },2000)
+
 
 
                     //是否启用 1启用 0不启用
                     //是否启用 1启用 0不启用
                     let isUse = busType.isUse || busType.isUse == 0 ? busType.isUse : 1;
                     let isUse = busType.isUse || busType.isUse == 0 ? busType.isUse : 1;
@@ -209,6 +215,7 @@ layui.define(['table', 'form', 'admin', 'layer', 'laytpl', 'common', 'view', 'se
         function initUserSelect() {
         function initUserSelect() {
             $.ajax({
             $.ajax({
                 url: domainName + '/api-user/users/getAll?access_token=' + accessToken,
                 url: domainName + '/api-user/users/getAll?access_token=' + accessToken,
+                sync: false,
                 success: function (res) {
                 success: function (res) {
                     userSelect = xmSelect.render({
                     userSelect = xmSelect.render({
                         el: '.adminUser',
                         el: '.adminUser',
@@ -231,6 +238,7 @@ layui.define(['table', 'form', 'admin', 'layer', 'laytpl', 'common', 'view', 'se
         function initUserSelectOps() {
         function initUserSelectOps() {
             $.ajax({
             $.ajax({
                 url: domainName + '/api-user/users/getAll?access_token=' + accessToken,
                 url: domainName + '/api-user/users/getAll?access_token=' + accessToken,
+                sync: false,
                 success: function (res) {
                 success: function (res) {
                     opsSelect = xmSelect.render({
                     opsSelect = xmSelect.render({
                         el: '#opsProject-username-select',
                         el: '#opsProject-username-select',
@@ -254,4 +262,4 @@ layui.define(['table', 'form', 'admin', 'layer', 'laytpl', 'common', 'view', 'se
         });
         });
 
 
     });
     });
-});
+});

@@ -106,7 +106,6 @@ body{
     align-items: center;
     align-items: center;
     width: 20px;
     width: 20px;
     height: 20px;
     height: 20px;
-    background:rgb(30,159,255);
     border-radius: 2px;
     border-radius: 2px;
     cursor: pointer;
     cursor: pointer;
 }
 }
@@ -176,4 +175,5 @@ body{
 .list-handle{
 .list-handle{
     display: flex;
     display: flex;
     justify-content: space-around;
     justify-content: space-around;
+    color:rgb(30,159,255);
 }
 }

@@ -46,7 +46,7 @@
                         <template #default="scope">
                         <template #default="scope">
                             <div class="list-handle">
                             <div class="list-handle">
                                 <span class="icon-bg">
                                 <span class="icon-bg">
-                                     <i class="icon-list icon-list-delete" title="删除" @click="handleDelete(scope.row)"></i>
+                                     <i class="el-icon-delete" title="删除" @click="handleDelete(scope.row)"></i>
                                 </span>
                                 </span>
                                 <span class="icon-bg">
                                 <span class="icon-bg">
                                      <i class="el-icon-edit-outline" title="修改" @click="handleUpdate(scope.row)"></i>
                                      <i class="el-icon-edit-outline" title="修改" @click="handleUpdate(scope.row)"></i>