perf:reset复选框调整、asset左侧筛选列表bug修复、overview 表格调整

nezha-fronted/src/components/common/bottomBox/tabs/cabinetTab.vue

@@ -94,7 +94,7 @@
           name:'',
           remark:'',
           seq:'',
-          uSize:0
+          uSize:1
         },
         showTopBtn: false, //top按钮是否显示
         loading: false,

nezha-fronted/src/components/common/bottomBox/tabs/endpointQueryTab.vue

@@ -436,7 +436,7 @@
         ],
         panelData: [], //chart-box的panel下拉框数据,
         hideSameLabels: true,
-        sameLabels:['instance','module','project','asset','job','dc'],
+        sameLabels:['instance','module','project','asset','endpoint','datacenter'],
       }
     },
     methods: {

nezha-fronted/src/components/common/language/en.js

@@ -266,11 +266,7 @@ const en = {
     fileSize:'文件过大',//File exceed max size.
     port:'Invalid Port',
     url:'Invalid URL',
-    config: {
+    uSize:'Must be number(1 - 47)'
-      account: {
-
-      }
-    }
   },
   search: {
     searchTip: 'Enter to search',//'点击或回车执行搜索'
@@ -463,7 +459,7 @@ const en = {
       dataCenter: 'DC',//DC
       cabinet: 'Cabinet',//'机柜'
       model: 'Model',//'型号'
-      manufacturer: 'Manufacturer',//'厂商'
+      vendor: 'Vendor',//'厂商'
       procurementDate: 'Purchase date',//'购买日期'
       principal: 'Administrator',//'负责人'
       principalTel: 'Telephone',//'电话'

nezha-fronted/src/components/common/rightBox/cabinetBox.vue

@@ -30,8 +30,8 @@
             <div class="right-box-form-content-txt" v-if="!rightBox.isEdit">{{idc?idc.name:''}}</div>
           </el-form-item>
           <el-form-item :label="this.$t('asset.createAssetTab.AddCabinetTab.uSize')" prop="uSize">
-            <div :class="{'right-box-form-content-txt':!rightBox.isEdit}" >{{cabinet.uSize}}</div>
+            <el-input v-model.number="cabinet.uSize" :max="47" ></el-input>
-            <el-slider v-model.number="cabinet.uSize" :max="47" v-if="rightBox.isEdit"></el-slider>
+<!--            <el-slider v-model.number="cabinet.uSize" :max="47" v-if="rightBox.isEdit"></el-slider>-->
           </el-form-item>
           <el-form-item :label="this.$t('config.dc.remark')">
             <el-input size='mini' v-model="cabinet.remark" type="textarea" :rows="2" v-if="rightBox.isEdit"/>
@@ -70,14 +70,15 @@
             name:'',
             remark:'',
             seq:'',
-            uSize:0
+            uSize:1
           },
           rules:{
             name: [
               {required: true, message: this.$t('validate.required'), trigger: 'blur'}
             ],
             uSize: [
-              {required: true, type: 'number', min: 1, max: 47, message: this.$t('validate.required'), trigger: 'blur'}
+              {required: true,  message: this.$t('validate.required'), trigger: 'blur'},
+              {type: 'number', min: 1, max: 47,message: this.$t('validate.uSize'),trigger: 'blur'}
             ],
           },
         }
@@ -93,7 +94,7 @@
               name:'',
               remark:'',
               seq:'',
-              uSize:0
+              uSize:1
           };
         },
         show(show, isEdit) {

nezha-fronted/src/components/page/asset/asset.vue

@@ -391,7 +391,7 @@
             prop: 'model',
             show: true,
           }, {
-            label: this.$t("asset.tableTitle.manufacturer"),
+            label: this.$t("asset.tableTitle.vendor"),
             prop: 'vendor',
             show: true,
           }, {
@@ -663,7 +663,7 @@
       getPingData:function(){
         this.pingCheckListData=[
           {label:'up',value:1},
-          {label:'down',value:2},
+          {label:'down',value:0},
         ]
       },
       getUserData() {
@@ -819,28 +819,29 @@
         if(this.assetTypeCheckList && this.assetTypeCheckList.length > 0){
           let assetTypeIds=this.assetTypeCheckList.join(',');
           this.pageObj.typeIds=assetTypeIds;
-          this.getAssetData();
         }else{
           this.pageObj.typeIds='';
         }
+        this.getAssetData();
       },
       changeVendorCheckBox:function(){
         if(this.vendorCheckList && this.vendorCheckList.length > 0){
           let vendorIds=this.vendorCheckList.join(',');
           this.pageObj.vendorIds=vendorIds;
-          this.getAssetData();
+
         }else{
           this.pageObj.vendorIds='';
         }
+        this.getAssetData();
       },
       changePingCheckBox:function(){
         if(this.pingCheckList && this.pingCheckList.length > 0){
           let pingStates=this.pingCheckList.join(',');
           this.pageObj.pingStates=pingStates;
-          this.getAssetData();
         }else{
           this.pageObj.pingStates='';
         }
+        this.getAssetData();
       },
       getSingleAsset() {
         let checkedCount = this.checkList.length;

nezha-fronted/src/components/page/config/system.vue

@@ -24,8 +24,8 @@
         </div>
       </div>
     </div>
-    <div class="content-right">
+    <div class="content-right system-tabs">
-      <el-tabs type="border-card" @tab-click="selectTab" v-model="activeTab">
+      <el-tabs type="border-card" @tab-click="selectTab" v-model="activeTab" class="system-tabs">
         <el-tab-pane :label="$t('config.system.basic.basic')" name="basic">
           <div class="system-config-form">
             <el-form :model="basic"  label-width="180px" size="small" ref="basicForm" :rules="basic.asset_ping_switch == 'on'?basicRules:basicRules2" :validate-on-rule-change="false">
@@ -62,7 +62,7 @@
           <div class="system-config-form">
             <el-form :model="email"  label-width="180px" size="small" ref="emailForm" :rules="email.email_enable=='on'?emailRules:{}" :validate-on-rule-change="false">
               <el-form-item :label="$t('config.system.email.enable')" prop="email_enable">
-                <el-checkbox v-model="email.email_enable" true-label="on" false-label="off"></el-checkbox>
+                <el-checkbox v-model="email.email_enable" true-label="on" false-label="off"  @change="switchChange('emailForm')"></el-checkbox>
               </el-form-item>
               <el-form-item :label="$t('config.system.email.smtpHost')" prop="email_smtp_host">
                 <el-input v-model="email.email_smtp_host" :disabled="email.email_enable == 'off'"></el-input>
@@ -139,7 +139,7 @@
                 <el-input v-model="ldap.ldap_mapping"></el-input>
               </el-form-item>
               <el-form-item :label="$t('config.system.ldap.active')" prop="ldap_enable">
-                <el-checkbox v-model="ldap.ldap_enable" true-label='on' false-label='off'></el-checkbox>
+                <el-checkbox v-model="ldap.ldap_enable" true-label='on' false-label='off' @change="switchChange('ldapForm')"></el-checkbox>
               </el-form-item>
               <el-form-item>
                 <el-button class="nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-min-width-100" @click="resetForm('ldapForm')" style="top:2px">{{$t('overall.reset')}}</el-button>
@@ -152,13 +152,23 @@
         <el-tab-pane :label="$t('config.system.reset.reset')" name="reset">
           <div class="system-config-form">
             <el-form :model="reset"  label-width="180px" size="small" ref="resetForm" :rules="resetRules" :validate-on-rule-change="false">
-              <el-form-item :label="$t('config.system.reset.type')" prop="type">
+              <el-form-item  prop="type">
-<!--                <el-select v-model="reset.type" size="small">-->
+<!--                <el-checkbox-group v-model="reset.type">-->
-<!--                  <el-option v-for="(item,index) in resetOptions" :label="item.label" :value="item.value" :key="item.value+index"></el-option>-->
+<!--                  <div v-for="(item,index) in resetOptions" :key="item.value+index">-->
-<!--                </el-select>-->
+<!--                    <el-checkbox :value="item.value"   :label="item.label" ></el-checkbox>-->
-                <el-checkbox-group v-model="reset.type">
+<!--                  </div>-->
-                  <div v-for="(item,index) in resetOptions" :key="item.value+index"><el-checkbox  :label="item.label" :value="item.value"  ></el-checkbox></div>
+<!--                </el-checkbox-group>-->
-                </el-checkbox-group>
+                <div class="el-checkbox-group">
+                  <div v-for="(item,index) in resetOptions" :key="item.value+index" >
+                    <label class="el-checkbox sys-reset-label" :for="item.value" >
+                      <span class="el-checkbox__label" style="width: 100px;;">{{item.label}}</span>
+                      <span class="el-checkbox__input">
+                        <input type="checkbox" name="resetType" :value="item.value" class="el-checkbox__original" aria-hidden="true" :id="item.value" @change="resetCheckBoxChange"/>
+                        <span class="el-checkbox__inner"></span>
+                      </span>
+                    </label>
+                  </div>
+                </div>
               </el-form-item>
               <el-form-item>
                 <el-button class="nz-btn nz-btn-size-normal nz-btn-style-normal nz-btn-min-width-100" @click="resetSys()" style="top:2px">{{$t('overall.reset')}}</el-button>
@@ -384,6 +394,21 @@
                 break;
             }
           },
+          switchChange:function(formName){
+            let $temp=this;
+            $temp.$refs[formName].clearValidate();
+            setTimeout(()=>{
+              $temp.$refs[formName].validate();
+            },100)
+          },
+          resetCheckBoxChange:function(e){
+            if(e.target.checked == true ){
+              this.reset.type.push(e.target.value)
+            }else{
+              let index = this.reset.type.indexOf(e.target.value);
+              this.reset.type.splice(index,1);
+            }
+          },
           jumpTo(data, id) {
             this.$router.push({
               path: "/" + data,
@@ -420,4 +445,15 @@
     line-height: 28px;
     width: 512px;
   }
+  .system-tabs .el-tabs--border-card{
+    webkit-box-shadow: unset !important;
+    box-shadow: unset !important;
+  }
+  .sys-reset-label .el-checkbox__original:checked + span{
+    background-color: orange;
+  }
+  .sys-reset-label .el-checkbox__original:checked + span:after{
+    -webkit-transform: rotate(45deg) scaleY(1);
+    transform: rotate(45deg) scaleY(1);
+  }
 </style>

nezha-fronted/src/components/page/dashboard/overview/chartConfig.vue

@@ -67,6 +67,7 @@
     const mapOptions={
       geo:{
         map:'',
+
         roam:true,//鼠标是否可以控制缩放
         // center:[],//当前视角的中心点，用经纬度表示
         label: { //控制显示地图名称
@@ -78,7 +79,8 @@
           },
         } ,
         itemStyle:{
-          areaColor:'lightgrey', //设置默认状态下地图颜色
+          // areaColor:'lightgrey', //设置默认状态下地图颜色
+
         },
         emphasis:{
           itemStyle: {
@@ -90,6 +92,15 @@
         right:0,
         bottom:0,
       },
+      dataRange:{
+        x: '-1000 px', //图例横轴位置
+        y: '-1000 px', //图例纵轴位置
+        splitList: [
+          { start: 1, end: 1, label: 'astana', color: '#cfc5de' },
+          { start: 2, end: 2, label: '天津', color: '#f1ebd1' },
+          { start: 3, end: 3, label: '上海', color: '#feffdb' },
+          ]
+      },
       tooltip : {
         trigger: 'item',
         type:'cross',

nezha-fronted/src/components/page/dashboard/overview/overview.vue

@@ -180,7 +180,7 @@
               direction:'row',
               total:{ //左侧上方大图标及total信息
                 show:true,
-                direction:'row',
+                direction:'column',
                 num:totalData.inStock,
                 title:this.$t('dashboard.overview.asset.title'),
                 showPopover:true,
@@ -306,7 +306,7 @@
               direction:'row',
               total:{ //左侧上方大图标及total信息
                 show:true,
-                direction:'row',
+                direction:'column',
                 num:data.total,
                 title:this.$t('dashboard.overview.project.project'),
                 showPopover:false,
@@ -378,7 +378,7 @@
               direction:'row',
               total:{ //左侧上方大图标及total信息
                 show:true,
-                direction:'row',
+                direction:'column',
                 num:data.total,
                 title:this.$t('dashboard.overview.project.endpoint'),
                 showPopover:false,

nezha-fronted/src/components/page/dashboard/overview/tableBox.scss

@@ -19,8 +19,10 @@
 }
 .table-screen{
   display: flex;
-  flex-direction: column;
+  //flex-direction: column;
   height: 100%;
+  width: 100%;
+  justify-content: space-around;
 }
 .table-screen .screen-top{
   flex: 1;
@@ -38,7 +40,7 @@
   display: flex;
   flex-direction: column;
   height: 100%;
-  align-items:center;
+  align-items:flex-start;
   justify-content: space-around;
   text-align: center;
 }
@@ -46,6 +48,21 @@
   flex: 1;
   text-align: center;
 }
+.screen-column .screen-col{
+  width: 100%;
+  vertical-align: top;
+}
+.screen-col .col-box{
+  display: flex;
+  width: 100%;
+  text-align: center;
+  align-items: center;
+  justify-content: flex-start;
+}
+.screen-col .col-box div{
+  display: inline-block;
+  text-align: left;
+}
 .super-icon{
 font-size:5rem !important;
 }
@@ -83,4 +100,6 @@ popover-container{
   flex:1;
   content: '';
 }
-
+.column-flex{
+  flex-direction: column;
+}

nezha-fronted/src/components/page/dashboard/overview/tableBox.vue

@@ -2,7 +2,7 @@
     <div class="table-box" :class="{'table-column-box':showData&&showData.screen&&showData.screen.direction=='column'}">
       <loading ref="loading"></loading>
       <template v-if="showData&&showData.screen">
-        <div class="table-box-left" :class="{'table-box-left-half':showData.screen.total.direction == 'column'}" v-show="showData.screen.show">
+        <div class="table-box-left" :class="{'table-box-left-half':showData.screen.total.direction == 'column'&& showData.table.show && !showData.screen.stat.show}" v-show="showData.screen.show">
             <div class="table-screen"  :class="{'fill-flex-cavity':!showData.screen.stat.show&&showData.screen.total.direction != 'column'&&showData.screen.direction!='column'}">
               <div class="screen-top" v-show="showData.screen.total.show" >
                 <div :class="{'screen-row':showData.screen.total.direction == 'row','screen-column':showData.screen.total.direction == 'column'}">
@@ -30,9 +30,23 @@
                 </div>
               </div>
               <div class="screen-bottom" v-show="showData.screen.stat.show">
-                <div class="screen-row">
+                <div :class="{'screen-row':showData.screen.total.direction == 'row','screen-column':showData.screen.total.direction == 'column'}">
-                  <div class="screen-col avg-children-space"><i class="nz-icon nz-icon-arrow-up middle-icon green-icon"></i><span class="middle-font">{{showData.screen.stat.up}}</span></div>
+                  <div class="screen-col avg-children-space">
-                  <div class="screen-col avg-children-space"><i class="nz-icon nz-icon-arrow-down middle-icon red-icon"></i><span class="middle-font">{{showData.screen.stat.down}}</span></div>
+                    <div class="col-box">
+                      <div>
+                        <div><i class="nz-icon nz-icon-arrow-up middle-icon green-icon"></i></div>
+                        <div><span class="middle-font">{{showData.screen.stat.up}}</span></div>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="screen-col avg-children-space">
+                    <div class="col-box">
+                      <div>
+                        <div><i class="nz-icon nz-icon-arrow-down middle-icon red-icon"></i></div>
+                        <div><span class="middle-font">{{showData.screen.stat.down}}</span></div>
+                      </div>
+                    </div>
+                  </div>
                 </div>
               </div>
             </div>