add an example of sort data by table (#1236)

Author: PanJiaChen

src/views/table/complexTable.vue

@@ -24,8 +24,9 @@
       border
       fit
       highlight-current-row
-      style="width: 100%;">
-      <el-table-column :label="$t('table.id')" align="center" width="65">
+      style="width: 100%;"
+      @sort-change="sortChange">
+      <el-table-column :label="$t('table.id')" prop="id" sortable="custom" align="center" width="65">
         <template slot-scope="scope">
           <span>{{ scope.row.id }}</span>
         </template>
@@ -233,6 +234,20 @@ export default {
       })
       row.status = status
     },
+    sortChange(data) {
+      const { prop, order } = data
+      if (prop === 'id') {
+        this.sortByID(order)
+      }
+    },
+    sortByID(order) {
+      if (order === 'ascending') {
+        this.listQuery.sort = '+id'
+      } else {
+        this.listQuery.sort = '-id'
+      }
+      this.handleFilter()
+    },
     resetTemp() {
       this.temp = {
         id: undefined,