From b0363833a40b0b92742ffc15994b8d733a19cd7c Mon Sep 17 00:00:00 2001
From: wangwenrui <wangwenrui@zdjizhi.com>
Date: Wed, 8 Apr 2020 19:18:30 +0800
Subject: [PATCH] =?UTF-8?q?fix:asset=E6=B7=BB=E5=8A=A0impi=E9=85=8D?=
 =?UTF-8?q?=E7=BD=AE=20&=20upload=E7=BB=84=E4=BB=B6=E6=94=B9=E4=B8=BA?=
 =?UTF-8?q?=E5=8F=AF=E6=8B=96=E6=8B=BD=E4=B8=8A=E4=BC=A0=20&=20=E7=B3=BB?=
 =?UTF-8?q?=E7=BB=9F=E9=85=8D=E7=BD=AE=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 nezha-fronted/src/components/cli/webSSH.vue   |   8 +-
 .../src/components/common/exportXLSX.vue      |   8 +-
 .../src/components/common/js/validate.js      |   1 +
 .../src/components/common/language/en.js      |   8 +
 nezha-fronted/src/components/common/login.vue |   4 +
 .../components/common/rightBox/assetBox.vue   | 307 +++---------------
 .../src/components/common/rightBox/mibBox.vue |  23 +-
 .../src/components/page/asset/WebSSH.vue      |   5 +-
 .../components/page/asset/accountConfig.vue   |   6 +-
 .../src/components/page/asset/cloneChat.vue   |   5 +-
 .../src/components/page/asset/newChat.vue     |   7 +-
 .../src/components/page/config/system.vue     |  48 ++-
 .../page/dashboard/overview/overview.vue      |   3 +-
 13 files changed, 148 insertions(+), 285 deletions(-)

diff --git a/nezha-fronted/src/components/cli/webSSH.vue b/nezha-fronted/src/components/cli/webSSH.vue
index 83293e11e..607ea8c5f 100644
--- a/nezha-fronted/src/components/cli/webSSH.vue
+++ b/nezha-fronted/src/components/cli/webSSH.vue
@@ -79,14 +79,16 @@
 
             <el-row >
               <el-col :span="24">
-                <el-upload class="upload-demo"
+                <el-upload drag class="upload-demo"
                            ref="uploadFile" action=""
                            :file-list="uploadFileList"
                            :on-change="handleChange"
                            :auto-upload="false" >
-                  <button type="button" class="nz-btn nz-btn-size-normal nz-btn-style-normal">
+                  <i class="el-icon-upload"></i>
+                  <div class="el-upload__text">{{$t('overall.dragFileTip')}}，{{$t('overall.or')}}&nbsp;<em>{{$t('overall.clickUpload')}}</em></div>
+                  <!--<button type="button" class="nz-btn nz-btn-size-normal nz-btn-style-normal">
                     <span class="top-tool-btn-txt" >{{$t('webshell.fileSelect')}}</span>
-                  </button>
+                  </button>-->
                 </el-upload>
               </el-col>
             </el-row>
diff --git a/nezha-fronted/src/components/common/exportXLSX.vue b/nezha-fronted/src/components/common/exportXLSX.vue
index d9abc84dd..63b97d671 100644
--- a/nezha-fronted/src/components/common/exportXLSX.vue
+++ b/nezha-fronted/src/components/common/exportXLSX.vue
@@ -12,11 +12,13 @@
       <el-dialog :visible.sync="importBox.show" :title="importBox.title" :modal-append-to-body='false' :show-close="true" :width="importBox.width" @close="closeDialog" class="nz-dialog" :close-on-click-modal="importBox.type!=3">
         <div v-if="importBox.type==1">
           <div class="upload-body">
-            <el-upload class="upload-demo" ref="uploadExcel" action="" :file-list="importFileList" :on-change="importChange"  :auto-upload="false" accept=".xlsx,.xls">
+            <el-upload drag class="upload-demo" ref="uploadExcel"  action="" :file-list="importFileList" :on-change="importChange"  :auto-upload="false" accept=".xlsx,.xls">
               <div slot="tip" class="el-upload__tip" >{{$t('overall.importTip')}}</div>
-              <button type="button" class="nz-btn nz-btn-size-normal nz-btn-style-normal">
+              <i class="el-icon-upload"></i>
+              <div class="el-upload__text">{{$t('overall.dragFileTip')}}，{{$t('overall.or')}}&nbsp;<em>{{$t('overall.clickUpload')}}</em></div>
+              <!--<button type="button" class="nz-btn nz-btn-size-normal nz-btn-style-normal">
                 <span class="top-tool-btn-txt" >{{$t('overall.upload')}}</span>
-              </button>
+              </button>-->
             </el-upload>
           </div>
           <div slot="footer" class="footer">
diff --git a/nezha-fronted/src/components/common/js/validate.js b/nezha-fronted/src/components/common/js/validate.js
index 50b61086a..1f238dfc2 100644
--- a/nezha-fronted/src/components/common/js/validate.js
+++ b/nezha-fronted/src/components/common/js/validate.js
@@ -3,6 +3,7 @@ import ca from "element-ui/src/locale/lang/ca";
 
 export function host(rule, value, callback) {
   const hostReg = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])(\:\d{0,5})?$/
+  console.log(value)
   setTimeout(() => {
     if (hostReg.test(value)) {
       callback()
diff --git a/nezha-fronted/src/components/common/language/en.js b/nezha-fronted/src/components/common/language/en.js
index 9c7bdcf38..66c561e7b 100644
--- a/nezha-fronted/src/components/common/language/en.js
+++ b/nezha-fronted/src/components/common/language/en.js
@@ -58,6 +58,9 @@ const en = {
     exportAll:'all',
     importFile:'please upload file',
     importTip:'only allowed xlsx/xls file',
+    dragFileTip:'Drag file here',
+    or:'or',
+    clickUpload:'click to upload',
     upload:'upload',
     template:'Template',
     active: 'active',
@@ -314,6 +317,11 @@ const en = {
       notInStock: 'Not in stock',//'出库'
       assetInfo:'Asset information',//'资产信息'
       assetType:'Asset type',//'资产类型'
+      impi:{
+        title:'IMPI',
+        host:'Host',
+        port:'Port',
+      },
       assetTypeTab:{
         assetType:'Asset type',//'资产类型'
         addAssetType:'New asset type',//'新增资产类型'
diff --git a/nezha-fronted/src/components/common/login.vue b/nezha-fronted/src/components/common/login.vue
index ee29af551..62b2e32bd 100644
--- a/nezha-fronted/src/components/common/login.vue
+++ b/nezha-fronted/src/components/common/login.vue
@@ -54,6 +54,10 @@ export default {
             sessionStorage.setItem("nz-username", this.loginData.username);
             localStorage.setItem("nz-username", this.loginData.username);
             localStorage.setItem('nz-language', this.lang);
+            localStorage.setItem('nz-sys-name',res.data.systemName);
+            localStorage.setItem('nz-sys-timezone',res.data.timezone);
+            localStorage.setItem('nz-sys-default-cabinet-usize',res.data.defaultCabinetUsize);
+            localStorage.setItem('nz-sys-man-terminal-num',res.data.maxTerminalNum);
             this.$i18n.locale = this.lang;
             bus.$emit('login');
             this.$router.push({
diff --git a/nezha-fronted/src/components/common/rightBox/assetBox.vue b/nezha-fronted/src/components/common/rightBox/assetBox.vue
index dbccdb2ce..b553c0578 100644
--- a/nezha-fronted/src/components/common/rightBox/assetBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/assetBox.vue
@@ -124,12 +124,25 @@
             </div>
             <span v-if="tabView">{{assetData.purchaseDate}}</span>
           </el-form-item>
+          <!------------------------------------------impi---------------------------------------------->
+          <div v-if="assetType == 1">
+            <div class="right-box-sub-title">{{$t('asset.createAssetTab.impi.title')}}</div>
+            <div class="line-100 right-box-line"></div>
+            <el-form-item :label="$t('asset.createAssetTab.impi.host')" class="right-box-form-content" prop="impi.host">
+              <el-input v-model="assetData.impi.host" size="small" v-if="!tabView"></el-input>
+              <span v-if="tabView">{{assetData.impi.host}}</span>
+            </el-form-item>
+            <el-form-item :label="$t('asset.createAssetTab.impi.port')" class="right-box-form-content" prop="impi.port">
+              <el-input v-model="assetData.impi.port" size="small" v-if="!tabView"></el-input>
+              <span v-if="tabView">{{assetData.impi.port}}</span>
+            </el-form-item>
+          </div>
           <div class="right-box-sub-title">{{$t('asset.createAssetTab.location')}}</div>
           <div class="line-100 right-box-line"></div>
           <!------------------------------------------IDC---------------------------------------------->
-          <!--<el-form-item :label="$t('asset.createAssetTab.dcName')" class="right-box-form-content" prop="idcId">
+          <el-form-item :label="$t('asset.createAssetTab.dcName')" class="right-box-form-content" prop="idcId">
             <template v-if="!tabView">
-&lt;!&ndash;              <el-select popper-class="asset-dropdown" size="mini" v-model="assetData.idcId" clearable @change="getSingleIDCData" class="right-box-row-with-btn" placeholder="">&ndash;&gt;
+<!--              <el-select popper-class="asset-dropdown" size="mini" v-model="assetData.idcId" clearable @change="getSingleIDCData" class="right-box-row-with-btn" placeholder="">-->
               <el-select popper-class="asset-dropdown" size="small" v-model="assetData.idcId" clearable @change="getSingleIDCData"  placeholder="">
                 <el-option
                   :id="'asset-edit-idc-op-'+item.id"
@@ -141,9 +154,9 @@
                   <span class="asset-dropdown-label-txt">{{ item.name }}</span>
                 </el-option>
               </el-select>
-&lt;!&ndash;              <div class="right-box-row-btn ">&ndash;&gt;
-&lt;!&ndash;                <idc-config-box placement="left" @after="getIDCOptionData"></idc-config-box>&ndash;&gt;
-&lt;!&ndash;              </div>&ndash;&gt;
+<!--              <div class="right-box-row-btn ">-->
+<!--                <idc-config-box placement="left" @after="getIDCOptionData"></idc-config-box>-->
+<!--              </div>-->
             </template>
             <span v-if="tabView">{{assetViewData.idcName}}</span>
           </el-form-item>
@@ -159,10 +172,10 @@
           <el-divider></el-divider>
 
 
-          &lt;!&ndash;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;cabinet&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&ndash;&gt;
+          <!------------------------------------------cabinet---------------------------------------------->
           <el-form-item :label="$t('asset.createAssetTab.cabinet')" class="right-box-form-content">
             <template v-if="!tabView">
-&lt;!&ndash;              <el-select clearable v-model="assetData.cabinetId" clearable class="right-box-row-with-btn" popper-class="asset-dropdown"&ndash;&gt;
+<!--              <el-select clearable v-model="assetData.cabinetId" clearable class="right-box-row-with-btn" popper-class="asset-dropdown"-->
               <el-select clearable v-model="assetData.cabinetId" clearable  popper-class="asset-dropdown"
                          :disabled="assetData.idcId==''?true:false" size="small" placeholder=""
                          @change="getSingleCabinetData">
@@ -174,38 +187,23 @@
                   :value="item.id"
                 >
                   <span class="asset-dropdown-label-txt">{{ item.name }}</span>
-&lt;!&ndash;                  <div class="asset-dropdown-label-icons">&ndash;&gt;
-&lt;!&ndash;                    <span class="asset-dropdown-btn asset-dropdown-btn-delete"&ndash;&gt;
-&lt;!&ndash;                          @click.stop="deleteData('cabinet',item.id)" :id="'asset-edit-cabinet-op-del-'+item.id">&ndash;&gt;
-&lt;!&ndash;                      <i class="el-icon-delete"></i>&ndash;&gt;
-&lt;!&ndash;                    </span>&ndash;&gt;
-&lt;!&ndash;                    <cabinet-config-box placement="left" :post-cabinet="item" button-class="asset-dropdown-btn" @after="getCabinetOptionData">&ndash;&gt;
-&lt;!&ndash;                      <i slot="optionZone" class="nz-icon nz-icon-edit"></i>&ndash;&gt;
-&lt;!&ndash;                    </cabinet-config-box>&ndash;&gt;
-&lt;!&ndash;                  </div>&ndash;&gt;
+<!--                  <div class="asset-dropdown-label-icons">-->
+<!--                    <span class="asset-dropdown-btn asset-dropdown-btn-delete"-->
+<!--                          @click.stop="deleteData('cabinet',item.id)" :id="'asset-edit-cabinet-op-del-'+item.id">-->
+<!--                      <i class="el-icon-delete"></i>-->
+<!--                    </span>-->
+<!--                    <cabinet-config-box placement="left" :post-cabinet="item" button-class="asset-dropdown-btn" @after="getCabinetOptionData">-->
+<!--                      <i slot="optionZone" class="nz-icon nz-icon-edit"></i>-->
+<!--                    </cabinet-config-box>-->
+<!--                  </div>-->
                 </el-option>
               </el-select>
 
-&lt;!&ndash;              <div class="right-box-row-btn ">&ndash;&gt;
-&lt;!&ndash;                <cabinet-config-box placement="left" :post-cabinet="addCabinetData"  @after="getCabinetOptionData"></cabinet-config-box>&ndash;&gt;
-&lt;!&ndash;              </div>&ndash;&gt;
+<!--              <div class="right-box-row-btn ">-->
+<!--                <cabinet-config-box placement="left" :post-cabinet="addCabinetData"  @after="getCabinetOptionData"></cabinet-config-box>-->
+<!--              </div>-->
             </template>
             <span v-if="tabView">{{assetViewData.cabinetName}}</span>
-          </el-form-item>-->
-          <el-form-item :label="$t('asset.editAssetTab.location')">
-            <el-cascader  :props="locationCascaderProps" popper-class="location-selector" size="small" style="width: 100%" id="locationSelector" ref="locationSelector" @visible-change="locationSelectorExpand" v-clickoutside="closeDropdown" >
-              <template slot-scope="{node,data}">
-                <label class="el-checkbox cabinet-u-label" :for="node.value" v-if="node.isLeaf" :class="{'is-disabled':data.occupy == true}">
-                  <span class="el-checkbox__input">
-                        <input type="checkbox" name="cabinetU" :value="node.value" class="el-checkbox__original" aria-hidden="true" :id="node.value" @change="cabinetUStateChange" :checked="data.occupy == true || data.checked ==true?'checked':''" :disabled="data.occupy == true"/>
-                        <span class="el-checkbox__inner" :class="{'is-disabled is-disabled-bg is-disabled-check':data.occupy == true}"></span>
-                  </span>
-                  <span class="el-checkbox__label" style="width: 100px;;" :class="{'is-disabled':data.occupy == true}">{{node.label}}</span>
-                </label>
-              </template>
-            </el-cascader>
-            {{this.checkedUStart?this.checkedUStart.value:''}}
-            {{this.checkedUEnd?this.checkedUEnd.value:''}}
           </el-form-item>
           <el-form-item :label="$t('asset.editAssetTab.uSize')">
             <span>{{cabinetSelectedData.uSize}}</span>
@@ -222,9 +220,9 @@
             <account-config-box v-for="(item,index) in assetData.accounts" :is-edit="!tabView" :account="item" :key="index" ref="accountConfigBox" @setValidateResult="setAccountValideResult" :is-allowed-change-protocol="changeProtocolSwitch" @protocol-type-change="protocolTypeChange"></account-config-box>
           </template>
 
-          <template v-if="!pageObj.id">
+          <template v-if="!pageObj.id && !exporterDisableSwitch">
             <el-form-item :label="$t('asset.createAssetTab.exporter')" class="exporter-label">
-              <el-switch class="exporter-switch" v-model="assetData.exporter" active-color="#ee9d3f" active-value="1" inactive-value="0" :disabled="exporterDisableSwitch"></el-switch>
+              <el-switch class="exporter-switch" v-model="assetData.exporter" active-color="#ee9d3f" active-value="1" inactive-value="0" :show="!exporterDisableSwitch"></el-switch>
             </el-form-item>
             <div class="line-100 right-box-line" style="margin-top: -16px;"></div>
           </template>
@@ -249,6 +247,7 @@
 <script>
   import accountConfig from '../../page/asset/accountConfig';
   import {host} from '../js/validate';
+  import {port} from '../js/validate'
   export default {
     name: "assetEditUnit",
     props: ["editUnitShow", "editUnitId"],
@@ -256,7 +255,6 @@
       'account-config-box': accountConfig,
     },
     data() {
-      let $temp=this;
       return {
         visible: '',
         vendorModelData: '',
@@ -270,6 +268,10 @@
           cabinetId: '',
           modelId: '',
           assetType: '',
+          impi:{
+            host:'',
+            port:'',
+          },
           accounts: [{
             id: '',
             authType: 1,
@@ -435,6 +437,12 @@
           idcId: [
             {required: true, message: this.$t('validate.required'), trigger: 'change'}
           ],
+          'impi.host':[
+            {validator:host,trigger:'blur'}
+          ],
+          'impi.port':[
+            {validator:port,trigger:'blur'}
+          ]
         },
         cabRules: {
           name: [
@@ -451,15 +459,7 @@
         module:{},
         accountValideResult:true,
         changeProtocolSwitch:true,
-        exporterDisableSwitch:false,
-        locationCascaderProps:{
-          lazy:true,
-          lazyLoad:$temp.locationLazyMethod
-        },
-        cabinetUState:[],
-        checkedUStart:null,//记录前一次选中的节点
-        checkedUEnd:null,//记录前一次选中的节点
-        storedTriggerMethod:null,
+        exporterDisableSwitch:false
       }
     },
     /*computed: {
@@ -522,216 +522,6 @@
       }
     },
     methods: {
-      closeDropdown:function(){
-        this.$refs.locationSelector.dropDownVisible = false;
-        this.$refs.locationSelector.toggleDropDownVisible=this.storedTriggerMethod;
-      },
-      locationSelectorExpand:function(flag){
-        this.storedTriggerMethod=this.$refs.locationSelector.toggleDropDownVisible;
-        if(flag){
-          this.$refs.locationSelector.toggleDropDownVisible=(value)=>{}
-          document.querySelector('#locationSelector').onclick=()=>{
-            this.$refs.locationSelector.dropDownVisible = !this.$refs.locationSelector.dropDownVisible;
-          }
-        }
-      },
-      cabinetUStateChange:function(e){
-        let defaultUsize=1;
-        if(this.assetData.modelId && this.assetData.modelId !=''){
-          let currentModel=this.allModelUlData.find((item,index)=>{
-            return item.id= this.assetData.modelId[1];
-          })
-          console.log(currentModel)
-          if(currentModel && currentModel.usize){
-            defaultUsize=currentModel.usize;
-          }
-        }
-
-        if(e.target.checked == true ){//选中
-          if(!this.checkedUStart){//第一次选中
-            let range=this.findEnoughCabinet(e.target.value,defaultUsize);
-            if(range[0] != -1&&range[1] != -1){
-              this.changeRange(range[0],range[1])
-              this.checkedUStart=this.cabinetUState[range[0]];
-              this.checkedUEnd=this.cabinetUState[range[1]];
-            }else{
-              e.target.checked = false;
-              console.warn("don't have enough cabinet");
-            }
-          }else{//第二次选中
-            if(this.checkedUStart.value - e.target.value  >1 ){ //在选中的之前选择且不连续
-              this.changeRange(e.target.value -1,this.checkedUStart.value -2)
-              this.checkedUStart=this.cabinetUState[e.target.value -1]
-            }else if(e.target.value - this.checkedUEnd.value > 1){//在选中的之后选择且不连续
-              this.changeRange(this.checkedUEnd.value,e.target.value -1);
-              this.checkedUEnd=this.cabinetUState[e.target.value -1]
-            }else if(this.checkedUStart.value - e.target.value  == 1){
-              this.checkedUStart=this.cabinetUState[e.target.value-1]
-            }else if(e.target.value - this.checkedUEnd.value == 1){
-              this.checkedUEnd=this.cabinetUState[e.target.value-1]
-            }
-          }
-        }else{//取消选中
-          if(e.target.value ==  this.checkedUStart.value){//消减头部
-            if(this.checkedUEnd.value - this.checkedUStart.value >= defaultUsize){
-              this.$set(this.cabinetUState[e.target.value -1],'checked',false);
-              this.checkedUStart = this.cabinetUState[e.target.value];
-            }else{
-              this.changeRange(this.checkedUStart.value-1,this.checkedUEnd.value-1,false);
-              this.checkedUStart=null;
-              this.checkedUEnd=null;
-            }
-          }else if(e.target.value ==  this.checkedUEnd.value){//消减尾部
-            if(this.checkedUEnd.value - this.checkedUStart.value >= defaultUsize) {
-              this.$set(this.cabinetUState[e.target.value - 1], 'checked', false);
-              this.checkedUEnd = this.cabinetUState[e.target.value - 2];
-            }else{
-              this.changeRange(this.checkedUStart.value-1,this.checkedUEnd.value-1,false);
-              this.checkedUStart=null;
-              this.checkedUEnd=null;
-            }
-          }else{//截断
-            if(this.checkedUEnd.value - this.checkedUStart.value < defaultUsize){//刚好是model 的usize
-              this.changeRange(this.checkedUStart.value-1,this.checkedUEnd.value-1,false);
-              this.checkedUStart=null;
-              this.checkedUEnd=null;
-            }else{
-              if(e.target.value - this.checkedUStart.value >= defaultUsize){ //低位的机柜足够
-                this.changeRange(this.checkedUStart.value-1,e.target.value -2 );
-                this.changeRange(e.target.value -1 ,this.checkedUEnd.value-1,false);
-                this.checkedUEnd=this.cabinetUState[e.target.value -2];
-              }else{ //低位的机柜不够
-                this.changeRange(this.checkedUStart.value-1,this.checkedUStart.value-1+defaultUsize-1);
-                e.target.checked=true;//解决无法改变当前点击的checkbox状态
-                this.changeRange(this.checkedUStart.value-1+defaultUsize, this.checkedUEnd.value -1,false);
-                this.checkedUEnd=this.cabinetUState[this.checkedUStart.value-1+defaultUsize-1];
-              }
-            }
-          }
-        }
-        this.modifyInput();
-      },
-      modifyInput:function(){
-        let input=document.querySelector('#locationSelector input');
-        let arr=input.value.split('/');
-        if(this.checkedUStart && this.checkedUEnd){
-          arr[arr.length-1]=this.checkedUStart.value +'-' +this.checkedUEnd.value;
-        }else{
-          arr[arr.length-1]='';
-        }
-        let value='';
-        arr.forEach((item,index)=>{
-          value +=item +'/';
-        })
-        input.value=value.substr(0,value.length-1);
-      },
-      changeRange:function(start, end,state=true){
-        if(start == -1 || end ==-1){
-          return;
-        }
-        let startIndex=start;
-        while(startIndex <= end){
-          this.$set(this.cabinetUState[startIndex],'checked',state);
-          startIndex++;
-        }
-      },
-      findEnoughCabinet:function(clickIndex,defaultSize){
-        if(defaultSize == 1){
-          return [clickIndex-1,clickIndex-1];
-        }
-        let left=this.cabinetUState.slice(0,clickIndex-1).reverse();
-        let right=this.cabinetUState.slice(clickIndex,this.cabinetUState.length);
-        let leftCount=0;
-        for(let i=0;i<left.length;i++){
-          let node=left[i];
-          if(!node.occupy){
-            leftCount++
-          }else{
-            break;
-          }
-        }
-        let rightCount=0;
-        for(let i=0;i<right.length;i++){
-          let node=right[i];
-          if(!node.occupy){
-            rightCount++
-          }else{
-            break;
-          }
-        }
-        if(rightCount >= defaultSize-1){
-          return [clickIndex-1,clickIndex-1+defaultSize-1]
-        }else if(leftCount + rightCount >= defaultSize -1){
-          return [clickIndex -1 -(defaultSize-1 - rightCount),clickIndex -1 + rightCount]
-        }else{
-          return [-1,-1]
-        }
-      },
-      locationLazyMethod:function(node,resolve){
-        if(node.level == 0){
-          this.$get('idc').then(response=>{
-            if(response.code == 200){
-              let idcInfos=response.data.list;
-              let nodes=idcInfos.map((item,index)=>{
-                item.label=item.name;
-                item.value=item.id;
-                item.leaf=false;
-                return item;
-              })
-              return resolve(nodes)
-            }else{
-              this.$message.error(response.msg);
-              return resolve([]);
-            }
-          })
-        }else if(node.level == 1){
-          this.$get('cabinet?idcId='+node.value).then(response=>{
-            if(response.code == 200){
-              let cabinetInfos=response.data.list;
-              let nodes=cabinetInfos.map((item,index)=>{
-                item.label=item.name;
-                item.value=item.id;
-                item.leaf=false;
-                return item;
-              })
-              return resolve(nodes)
-            }else{
-              this.$message.error(response.msg);
-              return resolve([]);
-            }
-          })
-        }else if(node.level == 2){
-          console.log(1111)
-          this.$get('cabinet/u?id='+node.value).then(response=>{
-            if(response.code == 200){
-              let nodes=[];
-              for(let i=1;i<=response.data.total;i++){
-                let node={
-                  label:i,
-                  value:i,
-                  occupy:false,
-                  checked:false,
-                  leaf:true,
-                }
-                if(response.data.occupy.find((item=>{return i == item}))){
-                  node.occupy=true;
-                }
-                nodes.push(node)
-              }
-              if(this.cabinetUState&& this.cabinetUState.length>0){
-                this.changeRange(0,this.cabinetUState.length-1,false)
-              }
-              this.cabinetUState=nodes;
-              this.checkedUStart=null;
-              this.checkedUEnd=null;
-              return resolve(nodes)
-            }else{
-              this.$message.error(response.msg);
-              return resolve([]);
-            }
-          })
-        }
-      },
       clickos() {
         this.sendStateData('close');
       },
@@ -787,6 +577,7 @@
               this.assetViewData.cabinetName = response.data.list[0].cabinet == null ? '' : response.data.list[0].cabinet.name
               this.getCabinetOptionData(response.data.list[0].idc.id)
               this.assetType = response.data.list[0].model.type.code
+              this.assetData.impi=response.data.list[0].impi?response.data.list[0].impi:{host:'',port:''};
               this.assetData.sn = response.data.list[0].sn
               this.assetData.host = response.data.list[0].host
               this.assetData.state = response.data.list[0].state
@@ -925,6 +716,10 @@
           cabinetId: '',
           modelId: '',
           assetType: '',
+          impi:{
+            host:'',
+            port:'',
+          },
           accounts: [{
             id: '',
             authType: 1,
diff --git a/nezha-fronted/src/components/common/rightBox/mibBox.vue b/nezha-fronted/src/components/common/rightBox/mibBox.vue
index dc8a93ddb..28751f2ec 100644
--- a/nezha-fronted/src/components/common/rightBox/mibBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/mibBox.vue
@@ -22,10 +22,10 @@
       <el-scrollbar class="right-box-form-box">
         <el-form class="right-box-form" :model="currentMib" label-position="top" :rules="rules" ref="mibForm">
           <!--mib名称-->
-          <el-form-item :label='$t("overall.name")' prop="name">
+          <!--<el-form-item :label='$t("overall.name")' prop="name">
             <el-input v-if="rightBox.isEdit" placeholder="" maxlength="64" show-word-limit v-model.trim="currentMib.name" size="small"></el-input>
             <div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{currentMib.name}}</div>
-          </el-form-item>
+          </el-form-item>-->
 
           <el-form-item :label='$t("config.mib.models")' prop="models" :rules="[{validator:checkModels,trigger:'change'}]" class="add-required">
             <el-cascader
@@ -55,15 +55,18 @@
             <div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{currentMib.remark}}</div>
           </el-form-item>
           <el-form-item :label="$t('config.mib.mibFile')" prop="file" :rules="[{validator:checkMibFile,trigger:'change'}]" :class="{'add-required':!currentMib.id}">
-            <el-upload v-if="rightBox.isEdit" :multiple="false" action="" :file-list="uploadFileList" :on-change="uploadChange"  :auto-upload="false" accept="" :on-remove="afterClearFile" ref="mibFileUpload">
+            <el-upload drag v-if="rightBox.isEdit" :multiple="false" action="" :file-list="uploadFileList" :on-change="uploadChange"  :auto-upload="false" accept="" :on-remove="afterClearFile" ref="mibFileUpload" class="mib-upload right-box-form-row">
               <div slot="tip" class="el-upload__tip" >
-                <span v-if="!currentMib.fileName">{{$t('config.mib.uploadTip')}}</span>
-                <span v-else>{{currentMib.fileName}}</span>
+               <!-- <span v-if="!currentMib.fileName">{{$t('config.mib.uploadTip')}}</span>
+                <span v-else>{{currentMib.fileName}}</span>-->
+                <span v-if="currentMib.fileName">{{currentMib.fileName}}</span>
                 <span v-if="uploadErrorMsg" style="color: #F56C6C"><br>{{uploadErrorMsg}}</span>
               </div>
-              <button type="button" class="nz-btn nz-btn-size-normal nz-btn-style-normal">
+              <i class="el-icon-upload"></i>
+              <div class="el-upload__text">{{$t('overall.dragFileTip')}}，{{$t('overall.or')}}&nbsp;<em>{{$t('overall.clickUpload')}}</em></div>
+             <!-- <button type="button" class="nz-btn nz-btn-size-normal nz-btn-style-normal">
                 <span class="top-tool-btn-txt" >{{$t('overall.upload')}}</span>
-              </button>
+              </button>-->
             </el-upload>
             <div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{currentMib.fileName}}</div>
           </el-form-item>
@@ -334,6 +337,12 @@
     color: #F56C6C;
     margin-right: 4px;
   }
+  .mib-upload .el-upload{
+    width: 100%;
+  }
+  .mib-upload /deep/.el-upload-dragger{
+    width: 100% !important;
+  }
 </style>
 <style scoped>
   /*去除上传文件动画start*/
diff --git a/nezha-fronted/src/components/page/asset/WebSSH.vue b/nezha-fronted/src/components/page/asset/WebSSH.vue
index e3a8698db..739663e26 100644
--- a/nezha-fronted/src/components/page/asset/WebSSH.vue
+++ b/nezha-fronted/src/components/page/asset/WebSSH.vue
@@ -38,13 +38,16 @@
             <el-input v-model="uploadFile.path"></el-input>
             <div style="padding-top: 20px">
                 <el-upload
+                        drag
                         class="upload-demo"
                         ref="upload"
                         action=""
                         :on-change="handleChange"
                         :auto-upload="false"
                 >
-                    <el-button size="small" type="primary">{{$t('asset.createAssetTab.clickToUpload')}}</el-button>
+                   <!-- <el-button size="small" type="primary">{{$t('asset.createAssetTab.clickToUpload')}}</el-button>-->
+                  <i class="el-icon-upload"></i>
+                  <div class="el-upload__text">{{$t('overall.dragFileTip')}}，{{$t('overall.or')}}&nbsp;<em>{{$t('overall.clickUpload')}}</em></div>
                 </el-upload>
             </div>
             <span slot="footer" class="dialog-footer">
diff --git a/nezha-fronted/src/components/page/asset/accountConfig.vue b/nezha-fronted/src/components/page/asset/accountConfig.vue
index 65d2194dc..df888dcb3 100644
--- a/nezha-fronted/src/components/page/asset/accountConfig.vue
+++ b/nezha-fronted/src/components/page/asset/accountConfig.vue
@@ -40,13 +40,13 @@
         <el-form-item :label="$t('asset.createAssetTab.password')" v-show="isEdit&&(account.authType==1 || account.protocol == 'TELNET')" >
           <el-input autocomplete="new-password" size="small" type="password" v-model="account.pwd"/>
         </el-form-item>
+        <el-form-item :label="this.$t('asset.createAssetTab.ssh')" v-show="isEdit&&(account.authType==2 && account.protocol == 'SSH')" prop="file">
+          <el-input  rows="4" type="textarea" placeholder="" v-model="account.privateKey" size="small"></el-input>
+        </el-form-item>
         <el-form-item :label="$t('asset.createAssetTab.port')" prop="port" style="display: inline-block">
           <el-input size="small" v-model.number="account.port" v-show="isEdit"/>
           <div class="right-box-form-content-txt" v-show="!isEdit">{{account.port}}</div>
         </el-form-item>
-        <el-form-item :label="this.$t('asset.createAssetTab.ssh')" v-show="isEdit&&(account.authType==2 && account.protocol == 'SSH')" prop="file">
-          <el-input  rows="4" type="textarea" placeholder="" v-model="account.privateKey" size="small"></el-input>
-        </el-form-item>
       </el-form>
 
       <div class="telnet-option" v-show="isEdit && account.protocol=='TELNET'">
diff --git a/nezha-fronted/src/components/page/asset/cloneChat.vue b/nezha-fronted/src/components/page/asset/cloneChat.vue
index 9c43ec77b..9019d2270 100644
--- a/nezha-fronted/src/components/page/asset/cloneChat.vue
+++ b/nezha-fronted/src/components/page/asset/cloneChat.vue
@@ -38,13 +38,16 @@
             <el-input v-model="uploadFile.path"></el-input>
             <div style="padding-top: 20px">
                 <el-upload
+                        drag
                         class="upload-demo"
                         ref="upload"
                         action=""
                         :on-change="handleChange"
                         :auto-upload="false"
                 >
-                    <el-button size="small" type="primary">{{$t('asset.createAssetTab.clickToUpload')}}</el-button>
+<!--                    <el-button size="small" type="primary">{{$t('asset.createAssetTab.clickToUpload')}}</el-button>-->
+                  <i class="el-icon-upload"></i>
+                  <div class="el-upload__text">{{$t('overall.dragFileTip')}}，{{$t('overall.or')}}&nbsp;<em>{{$t('overall.clickUpload')}}</em></div>
                 </el-upload>
             </div>
             <span slot="footer" class="dialog-footer">
diff --git a/nezha-fronted/src/components/page/asset/newChat.vue b/nezha-fronted/src/components/page/asset/newChat.vue
index 64024327a..0770a9444 100644
--- a/nezha-fronted/src/components/page/asset/newChat.vue
+++ b/nezha-fronted/src/components/page/asset/newChat.vue
@@ -38,13 +38,16 @@
             <el-input v-model="uploadFile.path"></el-input>
             <div style="padding-top: 20px">
                 <el-upload
+                        drag
                         class="upload-demo"
                         ref="upload"
                         action=""
                         :on-change="handleChange"
                         :auto-upload="false"
                 >
-                    <el-button size="small" type="primary">{{$t('asset.createAssetTab.clickToUpload')}}</el-button>
+<!--                    <el-button size="small" type="primary">{{$t('asset.createAssetTab.clickToUpload')}}</el-button>-->
+                  <i class="el-icon-upload"></i>
+                  <div class="el-upload__text">{{$t('overall.dragFileTip')}}，{{$t('overall.or')}}&nbsp;<em>{{$t('overall.clickUpload')}}</em></div>
                 </el-upload>
             </div>
             <span slot="footer" class="dialog-footer">
@@ -174,4 +177,4 @@ export default {
     left: 300px;
     top:19px
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/nezha-fronted/src/components/page/config/system.vue b/nezha-fronted/src/components/page/config/system.vue
index b2f2155a5..98eec0b7f 100644
--- a/nezha-fronted/src/components/page/config/system.vue
+++ b/nezha-fronted/src/components/page/config/system.vue
@@ -52,7 +52,10 @@
                 <el-input v-model.number="basic.storage_local_retention" ></el-input><span class="nz-input-append">h</span>
               </el-form-item>
               <el-form-item :label="$t('config.system.basic.timezone')" prop="timezone">
-                <el-input v-model.number="basic.timezone" ></el-input>
+<!--                <el-input v-model.number="basic.timezone" ></el-input>-->
+                <el-select v-model="basic.timezone">
+                  <el-option v-for="(item,index) in timezoneOption" :label="item.label" :value="item.value"></el-option>
+                </el-select>
               </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('basicForm')" style="top:2px">{{$t('overall.reset')}}</el-button>
@@ -156,11 +159,11 @@
           <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  prop="type">
-                <el-checkbox-group v-model="reset.type">
-                  <div v-for="(item,index) in resetOptions" :key="item.value+index">
-                    <el-checkbox :value="item.value"   :label="item.label" :disabled="true" :checked="true"></el-checkbox>
-                  </div>
-                </el-checkbox-group>
+<!--                <el-checkbox-group v-model="reset.type">-->
+<!--                  <div v-for="(item,index) in resetOptions" :key="item.value+index">-->
+<!--                    <el-checkbox :value="item.value"   :label="item.label" :disabled="true" :checked="true"></el-checkbox>-->
+<!--                  </div>-->
+<!--                </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" >
@@ -215,7 +218,7 @@
               asset_ping_interval:[{required:true,message:this.$t('validate.required'),trigger:'blur'},{validator:positiveInteger,trigger:'blur'}],
               scrape_interval:[{required:true,message:this.$t('validate.required'),trigger:'blur'},{validator:positiveInteger,trigger:'blur'}],
               storage_local_retention:[{required:true,message:this.$t('validate.required'),trigger:'blur'},{validator:positiveInteger,trigger:'blur'}],
-              timezone:[{validator:integer,trigger:'blur'},{validator:timezone,trigger:'blur' }],
+              timezone:[{required:true,message:this.$t('validate.required'),trigger:'blur'}],
             },
             basicRules2:{
               system_name:[{required:true,message:this.$t('validate.required'),trigger:'blur'},],
@@ -223,8 +226,35 @@
               alert_api:[{required:true,message:this.$t('validate.required'),trigger:'blur'},,{validator:host,trigger: 'blur'}],
               scrape_interval:[{required:true,message:this.$t('validate.required'),trigger:'blur'},{validator:positiveInteger,trigger:'blur'}],
               storage_local_retention:[{required:true,message:this.$t('validate.required'),trigger:'blur'},{validator:positiveInteger,trigger:'blur'}],
-              timezone:[{validator:integer,trigger:'blur'},{validator:timezone,trigger:'blur' }],
+              timezone:[{required:true,message:this.$t('validate.required'),trigger:'blur'}],
             },
+            timezoneOption:[
+              {label:'UTC-12:00',value:'-12'},
+              {label:'UTC-11:00',value:'-11'},
+              {label:'UTC-10:00',value:'-10'},
+              {label:'UTC-09:00',value:'-9'},
+              {label:'UTC-08:00',value:'-8'},
+              {label:'UTC-07:00',value:'-7'},
+              {label:'UTC-06:00',value:'-6'},
+              {label:'UTC-05:00',value:'-5'},
+              {label:'UTC-04:00',value:'-4'},
+              {label:'UTC-03:00',value:'-3'},
+              {label:'UTC-02:00',value:'-2'},
+              {label:'UTC-01:00',value:'-1'},
+              {label:'UTC 00:00',value:'0'},
+              {label:'UTC+01:00',value:'1'},
+              {label:'UTC+02:00',value:'2'},
+              {label:'UTC+03:00',value:'3'},
+              {label:'UTC+04:00',value:'4'},
+              {label:'UTC+05:00',value:'5'},
+              {label:'UTC+06:00',value:'6'},
+              {label:'UTC+07:00',value:'7'},
+              {label:'UTC+08:00',value:'8'},
+              {label:'UTC+09:00',value:'9'},
+              {label:'UTC+10:00',value:'10'},
+              {label:'UTC+11:00',value:'11'},
+              {label:'UTC+12:00',value:'12'},
+            ],
             email:{
               email_enable: 'on',
               email_smtp_host: '',
@@ -458,6 +488,8 @@
   .system-tabs .el-tabs--border-card{
     webkit-box-shadow: unset !important;
     box-shadow: unset !important;
+    height: 100%;
+    border-bottom: unset;
   }
   .sys-reset-label .el-checkbox__original:checked + span{
     background-color: orange;
diff --git a/nezha-fronted/src/components/page/dashboard/overview/overview.vue b/nezha-fronted/src/components/page/dashboard/overview/overview.vue
index 00007b933..77bf4e4c8 100644
--- a/nezha-fronted/src/components/page/dashboard/overview/overview.vue
+++ b/nezha-fronted/src/components/page/dashboard/overview/overview.vue
@@ -13,7 +13,7 @@
       <div class="overview-right content-right" id="mainDisplay">
         <!--标题-->
         <div class="overview-content-header">
-          <div class="header-title" :class="{'hide-div':!isFullScreen}">{{$t('dashboard.overview.contentTitle')}}</div>
+          <div class="header-title" :class="{'hide-div':!isFullScreen}">{{systemName&&systemName != 'undefined'&&systemName != null?systemName: $t('dashboard.overview.contentTitle')}}</div>
           <div class="header-tool">
             <div class="tool-container">
               <div class="time">{{sysTime}}</div>
@@ -104,6 +104,7 @@
     props:[],
     data(){
       return {
+        systemName:localStorage.getItem('nz-sys-name'),
         storedAssetStatData:null,
         assetStatData:{},
         typeFilter: 'typeStat',