From 78dfc1102828566ad04c1e9c15bc829e009baaad Mon Sep 17 00:00:00 2001
From: zhangyu <m13716206235@163.com>
Date: Wed, 15 Jul 2020 18:32:25 +0800
Subject: [PATCH] =?UTF-8?q?NEZ-354=20=20feat=20=EF=BC=9A=E8=A1=A8=E6=A0=BC?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E6=A0=B9=E6=8D=AE=E5=AD=97=E6=AE=B5=E6=8E=92?=
 =?UTF-8?q?=E5=BA=8F=E7=9A=84=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/page/alert/config.vue      | 47 ++++++++++++-
 .../src/components/page/alert/list.vue        | 46 ++++++++++++-
 .../src/components/page/asset/asset.vue       | 43 ++++++++++++
 .../src/components/page/config/account.vue    | 17 ++++-
 .../src/components/page/config/dc.vue         | 43 +++++++++++-
 .../src/components/page/config/mib.vue        | 47 ++++++++++++-
 .../src/components/page/config/model.vue      | 66 +++++++++++++++++--
 .../components/page/config/operationlog.vue   | 54 ++++++++++++++-
 .../src/components/page/config/promServer.vue | 54 ++++++++++++++-
 .../components/page/config/terminallog.vue    | 53 ++++++++++++++-
 .../src/components/page/project/project.vue   | 46 ++++++++++++-
 11 files changed, 495 insertions(+), 21 deletions(-)

diff --git a/nezha-fronted/src/components/page/alert/config.vue b/nezha-fronted/src/components/page/alert/config.vue
index 40f0a67f2..cfaf926c1 100644
--- a/nezha-fronted/src/components/page/alert/config.vue
+++ b/nezha-fronted/src/components/page/alert/config.vue
@@ -40,7 +40,9 @@
           v-scrollBar:el-table="'large'"
           v-loading="loading"
           :cell-class-name="messageStyle"
-          style="width: 100%;">
+          style="width: 100%;"
+          @sort-change="tableDataSort"
+        >
           <el-table-column
             :resizable="false"
             v-for="(item, index) in tablelable"
@@ -50,7 +52,8 @@
             :label="item.label"
             show-overflow-tooltip
             min-width="110px"
-
+            :sortable="sortableShow(item.prop)"
+            :prop="propTitle(item.prop)"
           >
             <template slot-scope="scope" :column="item">
               <div v-if="item.prop == 'option'" class="content-right-options">
@@ -434,6 +437,10 @@
         this.getTableData();
       },
       search: function (searchObj) {
+        let orderBy='';
+        if(this.searchLabel.orderBy){
+          orderBy=this.searchLabel.orderBy
+        }
         this.searchLabel = {};
         this.pageObj.pageNo = 1;
         for (let item in searchObj) {
@@ -441,6 +448,9 @@
             this.$set(this.searchLabel, item, searchObj[item]);
           }
         }
+        if(orderBy){
+          this.$set(this.searchLabel, 'orderBy', orderBy);
+        }
         this.getTableData();
       },
       // 全屏
@@ -533,6 +543,39 @@
         detail.push({label: this.$t("alert.message"), value: obj.alertNum});*/
         return detail;
       },
+      //是否需要排序
+      sortableShow(prop){
+        switch(prop){
+          case 'id':
+          case 'alertName':
+          case 'threshold':
+          case 'severity':
+            return'custom';
+          default : return false;
+        }
+      },
+      // prop字段
+      propTitle(prop){
+        switch(prop){
+          case 'id': return'ar.id';
+          case 'alertName': return'ar.alert_name';
+          case 'threshold': return'ar.threshold';
+          case 'severity': return'ar.severity';
+          default : return prop;
+        }
+      },
+      // 数据排序
+      tableDataSort(item){
+        let orderBy='';
+        if(item.order==='ascending'){
+          orderBy=item.prop;
+        }
+        if(item.order==='descending'){
+          orderBy='-'+item.prop;
+        }
+        this.$set(this.searchLabel, "orderBy", orderBy);
+        this.getTableData();
+      },
     },
     watch: {
       showSubList(n) {
diff --git a/nezha-fronted/src/components/page/alert/list.vue b/nezha-fronted/src/components/page/alert/list.vue
index c087196bf..7f0e19842 100644
--- a/nezha-fronted/src/components/page/alert/list.vue
+++ b/nezha-fronted/src/components/page/alert/list.vue
@@ -49,7 +49,8 @@
           v-loading="loading"
           :cell-class-name="labelsClassName"
           @selection-change="selectChange"
-          style="width: 100%;">
+          style="width: 100%;"
+          @sort-change="tableDataSort">
           <el-table-column
             :resizable="false"
             type="selection"
@@ -66,6 +67,8 @@
             :label="item.label"
             :show-overflow-tooltip="item.prop != 'labels'"
             min-width="110px"
+            :sortable="sortableShow(item.prop)"
+            :prop="propTitle(item.prop)"
           >
             <template slot-scope="scope" :column="item">
               <template v-if="item.prop == 'alertRule'">
@@ -836,6 +839,10 @@
         this.getAlertList();
       },
       search: function (searchObj) {
+        let orderBy='';
+        if(this.searchLabel.orderBy){
+          orderBy=this.searchLabel.orderBy
+        }
         this.searchLabel = {};
         this.pageObj.pageNo = 1;
         for (let item in searchObj) {
@@ -847,6 +854,9 @@
             }
           }
         }
+        if(orderBy){
+          this.$set(this.searchLabel, 'orderBy', orderBy);
+        }
         this.getAlertList();
       },
       viewRule: function (id) {
@@ -895,6 +905,40 @@
         this.$refs.projectBox.show(false, false);
         this.$refs.moduleBox.show(false, false);
         this.viewAssetState = false;
+      },
+      //是否需要排序
+      sortableShow(prop){
+        switch(prop){
+          case 'alertRule':
+          case 'severity':
+          case 'startAt':
+          case 'endAt':
+            return'custom';
+          default : return false;
+        }
+      },
+      // prop字段
+      propTitle(prop){
+        switch(prop){
+          case 'alertRule': return'ar.alert_name';
+          case 'severity': return'am.severity';
+          case 'startAt': return'am.start_at';
+          case 'endAt': return'am.end_at';
+          default : return prop;
+        }
+      },
+      // 数据排序
+      tableDataSort(item){
+        let orderBy='';
+        if(item.order==='ascending'){
+          orderBy=item.prop;
+        }
+        if(item.order==='descending'){
+          orderBy='-'+item.prop;
+        }
+        this.pageObj.orderBy=orderBy;
+        this.$set(this.searchLabel, "orderBy", orderBy);
+        this.getAlertList();
       }
     },
     watch: {
diff --git a/nezha-fronted/src/components/page/asset/asset.vue b/nezha-fronted/src/components/page/asset/asset.vue
index 4a626eccb..f00d866c1 100644
--- a/nezha-fronted/src/components/page/asset/asset.vue
+++ b/nezha-fronted/src/components/page/asset/asset.vue
@@ -92,6 +92,7 @@
                 tooltip-effect="light"
                 ref="assetTable"
                 :cell-class-name="messageStyle"
+                @sort-change="tableDataSort"
               >
                 <el-table-column
                   :resizable="false"
@@ -104,6 +105,8 @@
                   :show-overflow-tooltip="item.prop != 'Alert' || item.prop != 'Module'"
                   min-width="110px"
                   :class-name="item.prop == 'option' ? 'content-right-options' : ''"
+                  :sortable="sortableShow(item.prop)"
+                  :prop="propTitle(item.prop)"
                 >
                   <template slot-scope="scope" :column="item">
                     <div v-if="item.prop=='ID'">
@@ -863,6 +866,10 @@
         })
       },
       search(searchObj) {
+        let orderBy='';
+        if(this.searchLabel.orderBy){
+          orderBy=this.searchLabel.orderBy
+        }
         this.searchLabel = {};
         this.pageObj.pageNo = 1;
         for (let item in searchObj) {
@@ -870,6 +877,9 @@
             this.$set(this.searchLabel, item, searchObj[item]);
           }
         }
+        if(orderBy){
+          this.$set(this.searchLabel, 'orderBy', orderBy);
+        }
         this.getAssetData();
       },
       convertToDetail(obj) {
@@ -948,6 +958,39 @@
         let seconds=time.getSeconds() > 9 ? time.getSeconds():('0'+time.getSeconds());
         return this.$t('asset.assetStatPre')+year+ds+month+ds+day+' '+hours+ts+minutes+ts+seconds;
 
+      },
+      //是否需要排序
+      sortableShow(prop){
+        switch(prop){
+          case 'ID':
+          case 'HOST':
+          case 'SN':
+          case 'purchaseDate':
+            return'custom';
+          default : return false;
+        }
+      },
+      // prop字段
+      propTitle(prop){
+        switch(prop){
+          case 'ID': return'ass.id';
+          case 'HOST': return'ass.host';
+          case 'SN': return'ass.sn';
+          case 'purchaseDate': return'ass.purchase_date';
+          default : return prop;
+        }
+      },
+      // 数据排序
+      tableDataSort(item){
+        let orderBy='';
+        if(item.order==='ascending'){
+          orderBy=item.prop;
+        }
+        if(item.order==='descending'){
+          orderBy='-'+item.prop;
+        }
+        this.$set(this.searchLabel, "orderBy", orderBy);
+        this.getAssetData();
       }
     },
     created() {
diff --git a/nezha-fronted/src/components/page/config/account.vue b/nezha-fronted/src/components/page/config/account.vue
index 3655fefae..1cb88ae57 100644
--- a/nezha-fronted/src/components/page/config/account.vue
+++ b/nezha-fronted/src/components/page/config/account.vue
@@ -59,7 +59,8 @@
           :height="mainTableHeight"
           v-loading="loading"
           v-scrollBar:el-table="'large'"
-          style="width: 100%;">
+          style="width: 100%;"
+          @sort-change="tableDataSort">
           <el-table-column
             :resizable="false"
             v-for="(item, index) in tablelable"
@@ -67,6 +68,8 @@
             :width="item.width"
             :key="`col-${index}`"
             :label="item.label"
+            :sortable="item.prop!='option'&&item.prop!='status'?'custom':false"
+            :prop="item.prop"
           >
             <template slot-scope="scope" :column="item">
               <div v-if="item.prop == 'option'" class="content-right-options">
@@ -452,6 +455,18 @@
         }
         this.getTableData();
       },
+      // 数据排序
+      tableDataSort(item){
+        let orderBy='';
+        if(item.order==='ascending'){
+          orderBy=item.prop;
+        }
+        if(item.order==='descending'){
+          orderBy='-'+item.prop;
+        }
+        this.$set(this.searchLabel, "orderBy", orderBy);
+        this.getTableData();
+      },
     },
     computed: {
       isCurrentUser() {
diff --git a/nezha-fronted/src/components/page/config/dc.vue b/nezha-fronted/src/components/page/config/dc.vue
index f5fd23f2f..13257a4bc 100644
--- a/nezha-fronted/src/components/page/config/dc.vue
+++ b/nezha-fronted/src/components/page/config/dc.vue
@@ -61,7 +61,8 @@
             ref="dcTable"
             v-loading="loading"
             :cell-class-name="assetStatClassName"
-            style="width: 100%;">
+            style="width: 100%;"
+            @sort-change="tableDataSort">
             <el-table-column
               :resizable="false"
               show-overflow-tooltip
@@ -70,6 +71,8 @@
               :width="item.width"
               :key="`col-${index}`"
               :label="item.label"
+              :sortable="sortableShow(item.prop)"
+              :prop="propTitle(item.prop)"
             >
               <template slot-scope="scope" :column="item">
                 <div v-if="item.prop == 'option'" class="content-right-options">
@@ -414,6 +417,10 @@
         this.getTableData();
       },
       search: function (searchObj) {
+        let orderBy='';
+        if(this.searchLabel.orderBy){
+          orderBy=this.searchLabel.orderBy
+        }
         this.searchLabel = {};
         this.pageObj.pageNo = 1;
         for (let item in searchObj) {
@@ -421,6 +428,9 @@
             this.$set(this.searchLabel, item, searchObj[item]);
           }
         }
+        if(orderBy){
+          this.$set(this.searchLabel, 'orderBy', orderBy);
+        }
         this.getTableData();
       },
       showCabinet:function(dc){
@@ -434,6 +444,37 @@
         /*let temp=this;
         setTimeout(function(){temp.$refs.cabSearchInput.clear_input();},100)*/
       },
+      //是否需要排序
+      sortableShow(prop){
+        switch(prop){
+          case 'id':
+          case 'name':
+          case 'area':
+            return'custom';
+          default : return false;
+        }
+      },
+      // prop字段
+      propTitle(prop){
+        switch(prop){
+          case 'id': return'i.id';
+          case 'name': return'i.name';
+          case 'area': return'sa.name';
+          default : return prop;
+        }
+      },
+      // 数据排序
+      tableDataSort(item){
+        let orderBy='';
+        if(item.order==='ascending'){
+          orderBy=item.prop;
+        }
+        if(item.order==='descending'){
+          orderBy='-'+item.prop;
+        }
+        this.$set(this.searchLabel, "orderBy", orderBy);
+        this.getTableData();
+      },
     },
     watch: {
       cabinetDc: {
diff --git a/nezha-fronted/src/components/page/config/mib.vue b/nezha-fronted/src/components/page/config/mib.vue
index ba419b08d..9355326bd 100644
--- a/nezha-fronted/src/components/page/config/mib.vue
+++ b/nezha-fronted/src/components/page/config/mib.vue
@@ -54,9 +54,10 @@
             </button>
           </div>
         </div>
-        <el-table :data="tableData" border :height="$tableHeight.normal" style="width: 100%;" ref="mibTable" class="nz-table mib-table" v-scrollBar:el-table="'large'" v-loading="loading">
+        <el-table :data="tableData" border :height="$tableHeight.normal" style="width: 100%;" ref="mibTable" class="nz-table mib-table" v-scrollBar:el-table="'large'" v-loading="loading" @sort-change="tableDataSort">
           <el-table-column :resizable="false" v-for="(item, index) in tablelable" v-if="item.show" :width="item.width" :class-name="item.prop == 'modelsDetail'?'detail-column':''"
-                           :key="`col-${index}`" :label="item.label">
+                           :key="`col-${index}`" :label="item.label" :sortable="sortableShow(item.prop)"
+                           :prop="propTitle(item.prop)">
             <template slot-scope="scope" :column="item">
               <template v-if="item.prop == 'updateUser'" >{{scope.row[item.prop].name}}</template>
               <template v-else-if="item.prop == 'fileName' && scope.row[item.prop]" >
@@ -317,6 +318,10 @@
         this.getTableData();
       },
       search: function (searchObj) {
+        let orderBy='';
+        if(this.searchLabel.orderBy){
+          orderBy=this.searchLabel.orderBy
+        }
         this.pageObj.pageNo = 1;
         this.searchLabel = {};
         for (let item in searchObj) {
@@ -324,6 +329,9 @@
             this.$set(this.searchLabel, item, searchObj[item]);
           }
         }
+        if(orderBy){
+          this.$set(this.searchLabel, 'orderBy', orderBy);
+        }
         this.getTableData();
       },
       downloadMib:function(mibId){
@@ -360,7 +368,40 @@
           file:null,
         };
         this.$refs.mibBox.clearData();
-      }
+      },
+      //是否需要排序
+      sortableShow(prop){
+        switch(prop){
+          case 'id':
+          case 'name':
+          case 'filename':
+          case 'updateAt':
+            return'custom';
+          default : return false;
+        }
+      },
+      // prop字段
+      propTitle(prop){
+        switch(prop){
+          case 'id': return'sm.id';
+          case 'name': return'sm.name';
+          case 'filename': return'sm.file_name';
+          case 'updateAt': return'sm.update_at';
+          default : return prop;
+        }
+      },
+      // 数据排序
+      tableDataSort(item){
+        let orderBy='';
+        if(item.order==='ascending'){
+          orderBy=item.prop;
+        }
+        if(item.order==='descending'){
+          orderBy='-'+item.prop;
+        }
+        this.$set(this.searchLabel, "orderBy", orderBy);
+        this.getTableData();
+      },
     },
     mounted: function () {
       //是否存在分页缓存
diff --git a/nezha-fronted/src/components/page/config/model.vue b/nezha-fronted/src/components/page/config/model.vue
index 81209315f..d9c4756c3 100644
--- a/nezha-fronted/src/components/page/config/model.vue
+++ b/nezha-fronted/src/components/page/config/model.vue
@@ -47,10 +47,26 @@
           </div>
           <div class="pagination-top pagination-top-hide display-none"></div>
         </div>
-        <el-table :data="tableData" border style="width: 100%;" ref="modelTable" class="nz-table" v-scrollBar:el-table="'large'"
-                  v-loading="loading" :cell-class-name="assetStatClassName" v-show="mainResizeShow" :height="mainTableHeight">
-          <el-table-column :resizable="false" v-for="(item, index) in tablelable" v-if="item.show" :width="item.width"
-                           :key="`col-${index}`" :label="item.label">
+        <el-table :data="tableData"
+                  border style="width: 100%;"
+                  ref="modelTable"
+                  class="nz-table"
+                  v-scrollBar
+                  :el-table="'large'"
+                  v-loading="loading"
+                  :cell-class-name="assetStatClassName"
+                  v-show="mainResizeShow"
+                  :height="mainTableHeight"
+                  @sort-change="tableDataSort"
+        >
+          <el-table-column :resizable="false"
+                           v-for="(item, index) in tablelable"
+                           v-if="item.show"
+                           :width="item.width"
+                           :key="`col-${index}`"
+                           :label="item.label"
+                           :sortable="sortableShow(item.prop)"
+                           :prop="propTitle(item.prop)">
             <template slot-scope="scope" :column="item">
               <template v-if="item.prop == 'vendor'" >{{scope.row[item.prop].value}}</template>
               <template v-else-if="item.prop == 'type'" >{{scope.row[item.prop].value}}</template>
@@ -319,6 +335,10 @@
         this.getTableData();
       },
       search: function (searchObj) {
+        let orderBy='';
+        if(this.searchLabel.orderBy){
+          orderBy=this.searchLabel.orderBy
+        }
         this.pageObj.pageNo = 1;
         this.searchLabel = {};
         for (let item in searchObj) {
@@ -326,6 +346,9 @@
             this.$set(this.searchLabel, item, searchObj[item]);
           }
         }
+        if(orderBy){
+          this.$set(this.searchLabel, 'orderBy', orderBy);
+        }
         this.getTableData();
       },
       cleanModel() {
@@ -340,7 +363,40 @@
           typeCode: '',
           uSize:1,
         };
-      }
+      },
+      //是否需要排序
+      sortableShow(prop){
+        switch(prop){
+          case 'id':
+          case 'name':
+          case 'type':
+          case 'vendor':
+            return'custom';
+          default : return false;
+        }
+      },
+      // prop字段
+      propTitle(prop){
+        switch(prop){
+          case 'id': return'mo.id';
+          case 'name': return'mo.name';
+          case 'type': return'dict1.value';
+          case 'vendor': return'dict.value';
+          default : return prop;
+        }
+      },
+      // 数据排序
+      tableDataSort(item){
+        let orderBy='';
+        if(item.order==='ascending'){
+          orderBy=item.prop;
+        }
+        if(item.order==='descending'){
+          orderBy='-'+item.prop;
+        }
+        this.$set(this.searchLabel, "orderBy", orderBy);
+        this.getTableData();
+      },
     },
     mounted: function () {
       //是否存在分页缓存
diff --git a/nezha-fronted/src/components/page/config/operationlog.vue b/nezha-fronted/src/components/page/config/operationlog.vue
index cc9ccc6db..17893ab18 100644
--- a/nezha-fronted/src/components/page/config/operationlog.vue
+++ b/nezha-fronted/src/components/page/config/operationlog.vue
@@ -53,7 +53,9 @@
         v-loading="loading"
         v-scrollBar:el-table="'large'"
         :cell-class-name="messageStyle"
-        style="width: 100%;">
+        style="width: 100%;"
+        @sort-change="tableDataSort"
+      >
         <el-table-column
           :resizable="false"
           v-for="(item, index) in tablelable"
@@ -61,6 +63,8 @@
           :width="item.width"
           :key="`col-${index}`"
           :label="item.label"
+          :sortable="sortableShow(item.prop)"
+          :prop="propTitle(item.prop)"
         >
           <template slot-scope="scope" :column="item">
             <span v-if="item.prop == 'time'">
@@ -313,6 +317,10 @@
         this.getTableData();
       },
       search: function (searchObj) {
+        let orderBy='';
+        if(this.searchLabel.orderBy){
+          orderBy=this.searchLabel.orderBy
+        }
         this.searchLabel = {};
         this.pageObj.pageNo = 1;
         for (let item in searchObj) {
@@ -320,8 +328,50 @@
             this.$set(this.searchLabel, item, searchObj[item]);
           }
         }
+        if(orderBy){
+          this.$set(this.searchLabel, 'orderBy', orderBy);
+        }
         this.getTableData();
-      }
+      },
+      //是否需要排序
+      sortableShow(prop){
+        switch(prop){
+          case 'id':
+          case 'username':
+          case 'ip':
+          case 'operation':
+          case 'type':
+          case 'createDate':
+          case 'time':
+            return'custom';
+          default : return false;
+        }
+      },
+      // prop字段
+      propTitle(prop){
+        switch(prop){
+          case 'id': return 'sl.id';
+          case 'username': return 'sl.username';
+          case 'ip': return 'sl.ip';
+          case 'operation': return 'sl.operation';
+          case 'type': return 'sl.type';
+          case 'createDate': return 'sl.create_date';
+          case 'time': return 'sl.time';
+          default : return prop;
+        }
+      },
+      // 数据排序
+      tableDataSort(item){
+        let orderBy='';
+        if(item.order==='ascending'){
+          orderBy=item.prop;
+        }
+        if(item.order==='descending'){
+          orderBy='-'+item.prop;
+        }
+        this.$set(this.searchLabel, "orderBy", orderBy);
+        this.getTableData();
+      },
     },
     computed: {
       isCurrentUser() {
diff --git a/nezha-fronted/src/components/page/config/promServer.vue b/nezha-fronted/src/components/page/config/promServer.vue
index b96fcd066..f138efdd8 100644
--- a/nezha-fronted/src/components/page/config/promServer.vue
+++ b/nezha-fronted/src/components/page/config/promServer.vue
@@ -48,9 +48,15 @@
           <div class="pagination-top pagination-top-hide display-none"></div>
         </div>
         <el-table :data="tableData" border v-show="mainResizeShow" :height="mainTableHeight" style="width: 100%;"
-                  v-loading="loading" ref="promTable" class="nz-table" v-scrollBar:el-table="'large'">
-          <el-table-column :resizable="false" v-for="(item, index) in tablelable" v-if="item.show" :width="item.width"
-                           :key="`col-${index}`" :label="item.label">
+                  v-loading="loading" ref="promTable" class="nz-table" v-scrollBar:el-table="'large'"
+                  @sort-change="tableDataSort">
+          <el-table-column :resizable="false" v-for="(item, index) in tablelable"
+                           v-if="item.show"
+                           :width="item.width"
+                           :key="`col-${index}`"
+                           :label="item.label"
+                           :sortable="sortableShow(item.prop)"
+                           :prop="propTitle(item.prop)">
             <template slot-scope="scope" :column="item">
               <span v-if="item.prop == 'idc'" >{{scope.row[item.prop]?scope.row[item.prop].name:'-'}}</span>
 
@@ -616,6 +622,10 @@
         this.getTableData();
       },
       search: function (searchObj) {
+        let orderBy='';
+        if(this.searchLabel.orderBy){
+          orderBy=this.searchLabel.orderBy
+        }
         this.pageObj.pageNo = 1;
         this.searchLabel = {};
         for (let item in searchObj) {
@@ -623,6 +633,9 @@
             this.$set(this.searchLabel, item, searchObj[item]);
           }
         }
+        if(orderBy){
+          this.$set(this.searchLabel, 'orderBy', orderBy);
+        }
         this.getTableData();
       },
       addNewData(type) {
@@ -695,6 +708,41 @@
           item.show(false)
         })
       },
+      //是否需要排序
+      sortableShow(prop){
+        switch(prop){
+          case 'id':
+          case 'idc':
+          case 'host':
+          case 'port':
+          case 'type':
+            return'custom';
+          default : return false;
+        }
+      },
+      // prop字段
+      propTitle(prop){
+        switch(prop){
+          case 'id': return'id';
+          case 'idc': return'idc_id';
+          case 'host': return'host';
+          case 'port': return'port';
+          case 'type': return'type';
+          default : return prop;
+        }
+      },
+      // 数据排序
+      tableDataSort(item){
+        let orderBy='';
+        if(item.order==='ascending'){
+          orderBy=item.prop;
+        }
+        if(item.order==='descending'){
+          orderBy='-'+item.prop;
+        }
+        this.$set(this.searchLabel, "orderBy", orderBy);
+        this.getTableData();
+      },
     },
     mounted: function () {
       //是否存在分页缓存
diff --git a/nezha-fronted/src/components/page/config/terminallog.vue b/nezha-fronted/src/components/page/config/terminallog.vue
index 55339ea5b..c5640535c 100644
--- a/nezha-fronted/src/components/page/config/terminallog.vue
+++ b/nezha-fronted/src/components/page/config/terminallog.vue
@@ -53,7 +53,8 @@
         v-scrollBar:el-table="'large'"
         v-loading="loading"
         :cell-class-name="messageStyle"
-        style="width: 100%;">
+        style="width: 100%;"
+        @sort-change="tableDataSort">
         <el-table-column
           :resizable="false"
           v-for="(item, index) in tablelable"
@@ -61,6 +62,8 @@
           :width="item.width"
           :key="`col-${index}`"
           :label="item.label"
+          :sortable="sortableShow(item.prop)"
+          :prop="propTitle(item.prop)"
         >
           <template slot-scope="scope" :column="item">
             <span v-if="item.prop == 'lang'">
@@ -333,6 +336,10 @@
         this.getTableData();
       },
       search: function (searchObj) {
+        let orderBy='';
+        if(this.searchLabel.orderBy){
+          orderBy=this.searchLabel.orderBy
+        }
         this.searchLabel = {};
         this.pageObj.pageNo = 1;
         for (let item in searchObj) {
@@ -340,8 +347,50 @@
             this.$set(this.searchLabel, item, searchObj[item]);
           }
         }
+        if(orderBy){
+          this.$set(this.searchLabel, 'orderBy', orderBy);
+        }
         this.getTableData();
-      }
+      },
+      //是否需要排序
+      sortableShow(prop){
+        switch(prop){
+          case 'id':
+          case 'host':
+          case 'port':
+          case 'protocol':
+          case 'user':
+          case 'cmd':
+          case 'time':
+            return'custom';
+          default : return false;
+        }
+      },
+      // prop字段
+      propTitle(prop){
+        switch(prop){
+          case 'id': return 'id';
+          case 'host': return 'host';
+          case 'port': return 'port';
+          case 'protocol': return 'protocol';
+          case 'user': return 'user';
+          case 'cmd': return 'cmd';
+          case 'time': return 'time';
+          default : return prop;
+        }
+      },
+      // 数据排序
+      tableDataSort(item){
+        let orderBy='';
+        if(item.order==='ascending'){
+          orderBy=item.prop;
+        }
+        if(item.order==='descending'){
+          orderBy='-'+item.prop;
+        }
+        this.$set(this.searchLabel, "orderBy", orderBy);
+        this.getTableData();
+      },
     },
     computed: {
       isCurrentUser() {
diff --git a/nezha-fronted/src/components/page/project/project.vue b/nezha-fronted/src/components/page/project/project.vue
index 8351f05e8..7c2e5b005 100644
--- a/nezha-fronted/src/components/page/project/project.vue
+++ b/nezha-fronted/src/components/page/project/project.vue
@@ -94,7 +94,9 @@
           v-show="mainResizeShow"
           ref="endpointTable"
           v-loading="loading"
-          style="width: 100%;">
+          style="width: 100%;"
+          @sort-change="tableDataSort"
+        >
           <el-table-column
             :resizable="false"
             v-for="(item, index) in tablelable"
@@ -103,6 +105,8 @@
             :key="`col-${index}`"
             :label="item.label"
             min-width="110px"
+            :sortable="sortableShow(item.prop)"
+            :prop="propTitle(item.prop)"
           >
             <template slot-scope="scope" :column="item" >
               <span v-if="item.prop == 'asset' && scope.row[item.prop]" class="link" @click="detail(scope.row)">{{scope.row[item.prop].host}}</span>
@@ -578,6 +582,10 @@
       },*/
       //搜索
       endpointSearch: function(searchObj) {
+        let orderBy='';
+        if(this.endpointSearchLabel.orderBy){
+          orderBy=this.endpointSearchLabel.orderBy
+        }
         this.endpointSearchLabel = {};
         this.endpointPageObj.pageNo = 1;
         for (let item in searchObj) {
@@ -585,6 +593,9 @@
             this.$set(this.endpointSearchLabel, item, searchObj[item]);
           }
         }
+        if(orderBy){
+          this.$set(this.endpointSearchLabel, 'orderBy', orderBy);
+        }
         this.getEndpointTableData();
       },
 
@@ -774,6 +785,39 @@
             this.userData = response.data.list
           }
         })
+      },
+      //是否需要排序
+      sortableShow(prop){
+        switch(prop){
+          case 'id':
+          case 'asset':
+          case 'port':
+          case 'path':
+            return'custom';
+          default : return false;
+        }
+      },
+      // prop字段
+      propTitle(prop){
+        switch(prop){
+          case 'id': return'e.id';
+          case 'asset': return'a.host';
+          case 'port': return'e.port';
+          case 'path': return'e.path';
+          default : return prop;
+        }
+      },
+      // 数据排序
+      tableDataSort(item){
+        let orderBy='';
+        if(item.order==='ascending'){
+          orderBy=item.prop;
+        }
+        if(item.order==='descending'){
+          orderBy='-'+item.prop;
+        }
+        this.$set(this.endpointSearchLabel, "orderBy", orderBy);
+        this.getEndpointTableData();
       }
     },
     created() {