NEZ-2446 feat： web terminal 新页面开发（通过浏览器新标签页方式打开）

nezha-fronted/src/assets/css/components/cli/fileDirectory.scss

@@ -104,10 +104,12 @@
   .file-size{
     width: 15%;
     display: inline-block;
+    position: relative;
   }
   .file-date{
     width: 25%;
     display: inline-block;
+    position: relative;
   }
   .file-opt{
     width: 14%;
@@ -116,6 +118,27 @@
       margin-right: 20px;
     }
   }
+  .file-arrow-header{
+  display: inline-flex;align-items: center;width: 100%
+}
+  .nz-arrow-box{
+    display: flex;flex-direction: column;align-items: center;margin-left: 7px
+  }
+  .nz-arrow-up{
+    margin-bottom: 5px;
+  }
+  .nz-arrow-up.is-select{
+    border-bottom:5px solid $--color-primary; /* 定义底部颜色 */
+  }
+  .nz-arrow-down.is-select{
+    border-top:5px solid $--color-primary; /* 定义底部颜色 */
+  }
+  .nz-icon-caret-up {
+    position: absolute;
+  }
+  .nz-icon-caret-down {
+    position: absolute;
+  }
   .file-item{
     font-family: Roboto-Regular;
     font-size: 14px;
@@ -153,3 +176,25 @@
     }
   }
 }
+div.nz-arrow-up {
+  width:0px;
+  height:0px;
+  border-left:5px solid transparent;  /* 右透明 */
+  border-right:5px solid transparent; /*右透明 */
+  border-bottom:5px solid $--color-text-disabled; /* 定义底部颜色 */
+  font-size:0px;
+  line-height:0px;
+  cursor: pointer;
+}
+/* css3三角形（向下 ▼） */
+div.nz-arrow-down {
+  width:0px;
+  height:0px;
+  border-left:5px solid transparent;
+  border-right:5px solid transparent;
+  border-top:5px solid $--color-text-disabled;
+  font-size:0px;
+  line-height:0px;
+  cursor: pointer;
+}
+

nezha-fronted/src/components/chart/chartDataFormat.js

@@ -700,7 +700,6 @@ const unitOptions = [
 ]
 const units = []
 window.addEventListener('load', function () {
-  console.log(13213)
   if (units.length < 1) {
     unitOptions.forEach((item, index) => {
       item.children.forEach((n, i) => {

nezha-fronted/src/components/cli/console.vue

@@ -300,7 +300,6 @@ export default {
       // 错误
       this.terminalSocket.onerror = (e) => {
         this.isLogin = false
-        console.log(this.isLogin, 'close')
       }
       // 选中 复制
       this.term.on('selection', function () {})

nezha-fronted/src/components/cli/consoleNew.vue

@@ -126,7 +126,6 @@ export default {
         authPinTip: this.$loadsh.get(this.terminal, 'custom.authPinTip', '')
       }
       this.$post('/terminal/login', params).then(res => {
-        console.log(res)
         if (res.code == 200) {
           this.terminal.uuid = res.data.uuid
           this.$forceUpdate()
@@ -234,7 +233,6 @@ export default {
       // 错误
       this.terminalSocket.onerror = (e) => {
         this.terminal.isLogin = false
-        console.log(this.terminal.isLogin, 'close')
       }
       // 选中 复制
       this.term.on('selection', function () {})
@@ -262,7 +260,6 @@ export default {
       this.term && this.term.setOption('fontSize', fontSize)
       const consoleBox = document.getElementById('ternimalContainer' + this.idIndex)
       const width = document.body.clientWidth// 可视宽度
-      console.log(consoleBox.offsetHeight)
       let height = parseInt(consoleBox.offsetHeight)
       if (height == null || !height) { height = this.termimalHeight }
       const winStyle = {
@@ -306,6 +303,12 @@ export default {
       this.animateCSS(this.$refs.fileDirectory.$el, animationClass).then((message) => {
         this.fileDirectoryShow = show
       })
+    },
+    enterStr (message) {
+      this.terminalSocket.send(message)
+      setTimeout(()=>{
+        this.terminalSocket.send('\n')
+      }, 100)
     }
   },
   mounted () {

nezha-fronted/src/components/cli/fileDirectory.vue

@@ -32,11 +32,35 @@
           {{$t('overall.name')}}
         </div>
         <div class="text-ellipsis file-size">
+          <div class="file-arrow-header" >
+            <div>
               {{$t('backup.size')}}
             </div>
+            <div class="nz-arrow-box">
+              <div class="nz-arrow-up" :class="{
+            'is-select': sizeOrderType === 'asc'
+            }" @click="orderBy('sizeOrderType','asc' , 'size')"></div>
+              <div class="nz-arrow-down" :class="{
+            'is-select': sizeOrderType === 'desc'
+            }" @click="orderBy('sizeOrderType','desc', 'size')"></div>
+            </div>
+          </div>
+        </div>
         <div class="text-ellipsis file-date">
+          <div class="file-arrow-header">
+            <div>
               {{$t('issue.createTime')}}
             </div>
+            <div class="nz-arrow-box" style="">
+              <div class="nz-arrow-up" :class="{
+            'is-select': dateOrderType === 'asc'
+            }" @click="orderBy('dateOrderType','asc', 'cts')"></div>
+              <div class="nz-arrow-down" :class="{
+            'is-select': dateOrderType === 'desc'
+            }" @click="orderBy('dateOrderType','desc', 'cts')"></div>
+            </div>
+          </div>
+        </div>
         <div class="text-ellipsis file-opt">
           {{$t('overall.option')}}
         </div>
@@ -217,8 +241,11 @@ export default {
   data () {
     return {
       fileDirectory: '/',
+      sizeOrderType: 0,
+      dateOrderType: 0,
       breadcrumb: [],
       fileList: [],
+      oldFileList: [],
       newFolderBoxShow: false,
       folder: '',
       fileDirectoryLoading: false,
@@ -288,7 +315,6 @@ export default {
       this.editPathShow = false
     },
     goEditPath () {
-      console.log('123123123')
       this.getSftpPath(this.editPath)
       setTimeout(() => {
         this.editPath = ''
@@ -302,7 +328,6 @@ export default {
       }
     },
     showFileInfo (item) {
-      console.log(item)
       this.fileInfo = item
       this.fileInfoShow = true
     },
@@ -344,6 +369,7 @@ export default {
           this.fileDirectoryLoading = false
           this.fileDirectory = res.data.path
           this.fileList = res.data.list
+          this.oldFileList = res.data.list
           this.editPath = ''
           this.breadcrumb = res.data.path.split('/').filter(item => item)
         } else {
@@ -475,6 +501,15 @@ export default {
       }
       return '-'
     },
+    orderBy (key, orderType, order) {
+      if (this[key] == orderType) {
+        this[key] = 0
+        this.fileList = this.oldFileList
+      } else {
+        this[key] = orderType
+        this.fileList = this.$loadsh.orderBy(this.oldFileList, order, orderType)
+      }
+    },
     tableOperation ([command, row, param]) {
       switch (command) {
         case 'rename':

nezha-fronted/src/components/cli/fileListState.vue

@@ -110,7 +110,6 @@ export default {
   methods: {
     bytes: chartDataFormat.getUnit(7).compute,
     customColorMethod (percentage, item) {
-      console.log(item)
       if (percentage < 100) {
         return '#3B92F1'
       } else {

nezha-fronted/src/components/cli/terminal.vue

@@ -11,7 +11,7 @@
     </div>
     <fileListState v-clickoutside="hideFileState" ref="fileListState"/>
     <webSSHNew ref="websshNew" />
-    <el-input :placeholder="'发送文本到所有SSH终端'" size="small"  class="shell-input" v-model="message"/>
+    <el-input :placeholder="'发送文本到所有SSH终端'" size="small"  class="shell-input" v-model="message" @keyup.enter.native="sendMessage"/>
   </div>
 </template>
 
@@ -59,7 +59,6 @@ export default {
       )
     }
     window.addEventListener('message', function (e) {
-      console.log(e)
       if (e.data) {
         try {
           const data = JSON.parse(e.data)
@@ -81,6 +80,9 @@ export default {
     },
     hideFileState () {
       this.$refs.fileListState.fileStateShow(false, this.fileListStateType)
+    },
+    sendMessage () {
+      this.$refs.websshNew.sendMessage(this.message)
     }
   },
   beforeDestroy  () {

nezha-fronted/src/components/cli/webSSHNew.vue

@@ -610,12 +610,12 @@ export default {
         })
       } else {
         console.terminal.username = ''
+        console.terminal.terminalType = this.customConnect.authProtocol
         this.editableTabsValue = newTabName
         this.editableTabs.push(console)
       }
     },
     duplicate (item, index) {
-      console.log(item, index)
       if (item.terminal.assetId) {
         const newTabName = ++this.tabIndex + ''
         this.editableTabsValue = newTabName
@@ -652,7 +652,6 @@ export default {
       }
     },
     reconnect (item, index) {
-      console.log(item, index)
       this.$refs['console' + index][0].reconnect()
     },
     showFileDir (item, index) {
@@ -660,6 +659,11 @@ export default {
     },
     closeShell (item, index) {
       this.removeTab(item.name)
+    },
+    sendMessage (message) {
+      this.editableTabs.forEach((item, index) => {
+        this.$refs['console' + index][0].enterStr(message)
+      })
     }
   },
   watch: {

nezha-fronted/src/components/layout/home.vue

@@ -60,7 +60,6 @@ export default {
     }
   },
   mounted () {
-    console.log(this.$router, this.$route)
   },
   destroyed () {
     localStorage.removeItem('moduleProjectId')

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

@@ -4,7 +4,6 @@ import vm from '../../../../entrance/app/main'
 import exportHtml from '../../../../entrance/exportHtml/exportHtml'
 // const vm = window.dataJson ? exportHtml : app
 window.addEventListener('load', function () {
-  console.log(123213)
   if (!window.dataJson) {
     commonOption.toolbox.feature.dataZoom.title.zoom = vm.$i18n.t('overall.toolBox.zoom')
     commonOption.toolbox.feature.dataZoom.title.back = vm.$i18n.t('overall.toolBox.back')

nezha-fronted/src/store/terminalFile.js

@@ -26,7 +26,6 @@ const terminalFile = {
       if (!state.messageFunction) {
         state.messageFunction = true
         window.addEventListener('message', function (e) {
-          console.log(e)
           const data = JSON.parse(e.data) // e.data  里面有自己所传的所有参数  可以根据参数做自己的判断
           if (data.close) {
             state.externalTerminal = false
@@ -39,11 +38,8 @@ const terminalFile = {
         state.externalTerminalWindow = ''
       }
       if (item && state.externalTerminal) {
-        console.log('onloda', state.externalTerminalWindow)
         state.externalTerminalWindow.addEventListener('load', () => {
-          console.log(123123123123123)
           setTimeout(() => {
-            console.log('time')
             state.externalTerminalWindow.postMessage(
               JSON.stringify(item)
             )