diff --git a/UI2.0/src/js/command-record.js b/UI2.0/src/js/command-record.js
index 842002f8f7c27025984f38c4ddc1d4c29b6f469a..0e4aeb7776ab06bd08f3ca31a4f606f28436e12c 100644
--- a/UI2.0/src/js/command-record.js
+++ b/UI2.0/src/js/command-record.js
@@ -1,16 +1,109 @@
 import { defineComponent } from "vue";
+import axios from "./utils/AxiosConfig";
 
 export default defineComponent({
+  data() {
+    return{
+      curPage: 1,
+      recordNum: 0,
+      recordList: [],
+      recordType: 'command',
+      descriptionList: []
+    }
+  },
   methods: {
-    onOfflineClick() {
-      this.$router.push({
-        path: "/offline",
-      });
+    getRecordNum(type) {
+      var url = '/v1/UI/' + type + '/initialPage'
+      axios(url, {
+        uid: this.$store.state.User.userInfo.userId,
+      }, "get").then(res => {
+        res = JSON.parse(res)
+        this.recordNum = res.count
+      })
+    },
+    getRecordList(type) {
+      var url = '/v1/UI/' + type + '/getList'
+      axios(url, {
+        uid: this.$store.state.User.userInfo.userId,
+        pageNum: this.curPage,
+        pageSize: 15
+      }, "get").then(res => {
+        res = JSON.parse(res)
+        this.recordList = res.data
+        for(var i = 0; i < this.recordList.length; i++){
+          this.descriptionList[i] = this.recordList[i].description
+        }
+      })
     },
-    onOnlineClick() {
-      this.$router.push({
-        path: "/online",
-      });
+    getRecord(type) {
+      this.getRecordNum(type)
+      this.getRecordList(type)
+      this.recordType = type
+      this.curPage = 1
     },
+    getRecordDetail(type, id, mid) {
+      if(typeof(type) == 'undefined'){
+        if(this.recordType == 2) {
+          this.$router.push({
+            path: "/offline",
+            query: {id: id}
+          });
+        }else {
+          this.$router.push({
+            path: "/online",
+            query: {id: id}
+          });
+        }
+      }else if(type == 'tuning') {
+        this.$router.push({
+          path: "/offline",
+          query: {id: mid}
+        });
+      }else {
+        this.$router.push({
+          path: "/online",
+          query: {id: mid}
+        });
+      }
+    },
+    updateRecordDescription(index, id) {
+      if(this.recordList[index].description == this.descriptionList[index]) {
+        return
+      }
+      var url = '/v1/UI/' + this.recordType + '/updateDescription'
+      if(this.recordType == 'tuning'){
+        axios(url, {
+          tid: id,
+          description: this.descriptionList[index]
+        }, "get").then(res => {
+          res = JSON.parse(res)
+          if(res.status) {
+            this.recordList[index].description = this.descriptionList[index]
+          }else {
+            this.descriptionList[index] = this.recordList[index].description
+          }
+        })
+      }else {
+        axios(url, {
+          cid: id,
+          description: this.descriptionList[index]
+        }, "get").then(res => {
+          res = JSON.parse(res)
+          if(res.status) {
+            this.recordList[index].description = this.descriptionList[index]
+          }else {
+            this.descriptionList[index] = this.recordList[index].description
+          }
+        })
+      }
+    }
+  },
+  watch:{
+    curPage: function(){
+      this.getRecord(this.recordType)
+    }
   },
+  mounted() {
+    this.getRecord('command')
+  }
 });
\ No newline at end of file
diff --git a/UI2.0/src/pages/Command-record.vue b/UI2.0/src/pages/Command-record.vue
index 9dc5622462b553b2d2b9ad512654398ba32fd19f..2ebacdeddadb1f235a2876ac1cbbba63b1ac4620 100644
--- a/UI2.0/src/pages/Command-record.vue
+++ b/UI2.0/src/pages/Command-record.vue
@@ -27,15 +27,17 @@
                 border-bottom-left-radius: 4px;
                 margin-left: 32px;
               "
+              @click="getRecord('command')"
             >
               全部
             </button>
-            <button style="width: 95px">离线调优</button>
+            <button style="width: 95px" @click="getRecord('tuning')">离线调优</button>
             <button
               style="
                 border-top-right-radius: 4px;
                 border-bottom-right-radius: 4px;
               "
+              @click="getRecord('analysis')"
             >
               在线调优
             </button>
@@ -47,322 +49,85 @@
             </form>
           </div>
         </div>
-        <div style="width: 1792px; height: 750px">
+        <div style="width: 1792px; max-height: 950px">
           <table class="record-list">
-            <tr>
-              <th style="padding-left: 24px">序号</th>
-              <th style="padding-left: 13px; width: 300px">
-                <a style="margin-right: 8px">|</a>命令/ID
-              </th>
-              <th style="padding-left: 13px">
-                <a style="margin-right: 8px">|</a>IP地址
-              </th>
-              <th style="padding-left: 13px">
-                <a style="margin-right: 8px">|</a>任务状态
-                <img src="../assets/common/filter-default.png" />
-              </th>
-              <th style="padding-left: 13px">
-                <a style="margin-right: 8px">|</a>开始时间
-                <q-icon
-                  name="unfold_more"
-                  style="font-size: 17px; margin-left: 2px"
-                ></q-icon>
-              </th>
-              <th style="padding-left: 13px; width: 600px">
-                <a style="margin-right: 8px">|</a>描述
-              </th>
-              <th style="padding-left: 13px; width: 150px">
-                <a style="margin-right: 8px">|</a>操作
-              </th>
-            </tr>
-            <tr>
-              <td>1</td>
-              <td><q-icon name="edit"></q-icon>compress-1627891392965</td>
-              <td>9.10.33.13</td>
-              <td>
-                <div class="row">
-                  <div class="state-icon state-icon-running"></div>
-                  <div>运行中</div>
-                </div>
-              </td>
-              <td>2021-11-22 11:23:00</td>
-              <td><input type="text" placeholder="--双击输入描述信息--" /></td>
-              <td>
-                <button class="operation-btn" @click="onOfflineClick">
-                  详情
-                </button>
-                <button class="operation-btn">删除</button>
-              </td>
-            </tr>
-            <tr class="alt">
-              <td>2</td>
-              <td><q-icon name="edit"></q-icon>compress-1627891392964</td>
-              <td>9.10.33.13</td>
-              <td>
-                <div class="row">
-                  <div class="state-icon state-icon-finish"></div>
-                  <div>已完成</div>
-                </div>
-              </td>
-              <td>2021-11-22 11:23:00</td>
-              <td><input type="text" placeholder="--双击输入描述信息--" /></td>
-              <td>
-                <button class="operation-btn" @click="onOnlineClick">
-                  详情
-                </button>
-                <button class="operation-btn">删除</button>
-              </td>
-            </tr>
-            <tr>
-              <td>3</td>
-              <td><q-icon name="edit"></q-icon>compress-1627891392963</td>
-              <td>9.10.33.13</td>
-              <td>
-                <div class="row">
-                  <div class="state-icon state-icon-running"></div>
-                  <div>失败</div>
-                </div>
-              </td>
-              <td>2021-11-22 11:23:00</td>
-              <td><input type="text" placeholder="--双击输入描述信息--" /></td>
-              <td>
-                <button class="operation-btn">详情</button>
-                <button class="operation-btn">删除</button>
-              </td>
-            </tr>
-            <tr>
-              <td>4</td>
-              <td><q-icon name="edit"></q-icon>compress-1627891392962</td>
-              <td>9.10.33.13</td>
-              <td>
-                <div class="row">
-                  <div class="state-icon state-icon-running"></div>
-                  <div>运行中</div>
-                </div>
-              </td>
-              <td>2021-11-22 11:23:00</td>
-              <td><input type="text" placeholder="--双击输入描述信息--" /></td>
-              <td>
-                <button class="operation-btn">详情</button>
-                <button class="operation-btn">删除</button>
-              </td>
-            </tr>
-            <tr>
-              <td>5</td>
-              <td><q-icon name="edit"></q-icon>compress-1627891392961</td>
-              <td>9.10.33.13</td>
-              <td>
-                <div class="row">
-                  <div class="state-icon state-icon-finish"></div>
-                  <div>已完成</div>
-                </div>
-              </td>
-              <td>2021-11-22 11:23:00</td>
-              <td><input type="text" placeholder="--双击输入描述信息--" /></td>
-              <td>
-                <button class="operation-btn">详情</button>
-                <button class="operation-btn">删除</button>
-              </td>
-            </tr>
-            <tr>
-              <td>6</td>
-              <td><q-icon name="edit"></q-icon>compress-1627891392960</td>
-              <td>9.10.33.13</td>
-              <td>
-                <div class="row">
-                  <div class="state-icon state-icon-failed"></div>
-                  <div>失败</div>
-                </div>
-              </td>
-              <td>2021-11-22 11:23:00</td>
-              <td><input type="text" placeholder="--双击输入描述信息--" /></td>
-              <td>
-                <button class="operation-btn">详情</button>
-                <button class="operation-btn">删除</button>
-              </td>
-            </tr>
-            <tr>
-              <td>7</td>
-              <td><q-icon name="edit"></q-icon>compress-1627891392959</td>
-              <td>9.10.33.13</td>
-              <td>
-                <div class="row">
-                  <div class="state-icon state-icon-running"></div>
-                  <div>运行中</div>
-                </div>
-              </td>
-              <td>2021-11-22 11:23:00</td>
-              <td><input type="text" placeholder="--双击输入描述信息--" /></td>
-              <td>
-                <button class="operation-btn">详情</button>
-                <button class="operation-btn">删除</button>
-              </td>
-            </tr>
-            <tr class="alt">
-              <td>8</td>
-              <td><q-icon name="edit"></q-icon>compress-1627891392958</td>
-              <td>9.10.33.13</td>
-              <td>
-                <div class="row">
-                  <div class="state-icon state-icon-finish"></div>
-                  <div>已完成</div>
-                </div>
-              </td>
-              <td>2021-11-22 11:23:00</td>
-              <td><input type="text" placeholder="--双击输入描述信息--" /></td>
-              <td>
-                <button class="operation-btn">详情</button>
-                <button class="operation-btn">删除</button>
-              </td>
-            </tr>
-            <tr>
-              <td>9</td>
-              <td><q-icon name="edit"></q-icon>compress-1627891392957</td>
-              <td>9.10.33.13</td>
-              <td>
-                <div class="row">
-                  <div class="state-icon state-icon-failed"></div>
-                  <div>失败</div>
-                </div>
-              </td>
-              <td>2021-11-22 11:23:00</td>
-              <td><input type="text" placeholder="--双击输入描述信息--" /></td>
-              <td>
-                <button class="operation-btn">详情</button>
-                <button class="operation-btn">删除</button>
-              </td>
-            </tr>
-            <tr>
-              <td>10</td>
-              <td><q-icon name="edit"></q-icon>compress-1627891392956</td>
-              <td>9.10.33.13</td>
-              <td>
-                <div class="row">
-                  <div class="state-icon state-icon-running"></div>
-                  <div>运行中</div>
-                </div>
-              </td>
-              <td>2021-11-22 11:23:00</td>
-              <td><input type="text" placeholder="--双击输入描述信息--" /></td>
-              <td>
-                <button class="operation-btn">详情</button>
-                <button class="operation-btn">删除</button>
-              </td>
-            </tr>
-            <tr class="alt">
-              <td>11</td>
-              <td><q-icon name="edit"></q-icon>compress-1627891392955</td>
-              <td>9.10.33.13</td>
-              <td>
-                <div class="row">
-                  <div class="state-icon state-icon-finish"></div>
-                  <div>已完成</div>
-                </div>
-              </td>
-              <td>2021-11-22 11:23:00</td>
-              <td><input type="text" placeholder="--双击输入描述信息--" /></td>
-              <td>
-                <button class="operation-btn">详情</button>
-                <button class="operation-btn">删除</button>
-              </td>
-            </tr>
-            <tr>
-              <td>12</td>
-              <td><q-icon name="edit"></q-icon>compress-1627891392954</td>
-              <td>9.10.33.13</td>
-              <td>
-                <div class="row">
-                  <div class="state-icon state-icon-failed"></div>
-                  <div>失败</div>
-                </div>
-              </td>
-              <td>2021-11-22 11:23:00</td>
-              <td><input type="text" placeholder="--双击输入描述信息--" /></td>
-              <td>
-                <button class="operation-btn">详情</button>
-                <button class="operation-btn">删除</button>
-              </td>
-            </tr>
-            <tr>
-              <td>13</td>
-              <td><q-icon name="edit"></q-icon>compress-1627891392953</td>
-              <td>9.10.33.13</td>
-              <td>
-                <div class="row">
-                  <div class="state-icon state-icon-failed"></div>
-                  <div>失败</div>
-                </div>
-              </td>
-              <td>2021-11-22 11:23:00</td>
-              <td><input type="text" placeholder="--双击输入描述信息--" /></td>
-              <td>
-                <button class="operation-btn">详情</button>
-                <button class="operation-btn">删除</button>
-              </td>
-            </tr>
-            <tr>
-              <td>14</td>
-              <td><q-icon name="edit"></q-icon>compress-1627891392952</td>
-              <td>9.10.33.13</td>
-              <td>
-                <div class="row">
-                  <div class="state-icon state-icon-running"></div>
-                  <div>运行中</div>
-                </div>
-              </td>
-              <td>2021-11-22 11:23:00</td>
-              <td><input type="text" placeholder="--双击输入描述信息--" /></td>
-              <td>
-                <button class="operation-btn">详情</button>
-                <button class="operation-btn">删除</button>
-              </td>
-            </tr>
-            <tr>
-              <td>15</td>
-              <td><q-icon name="edit"></q-icon>compress-1627891392951</td>
-              <td>9.10.33.13</td>
-              <td>
-                <div class="row">
-                  <div class="state-icon state-icon-failed"></div>
-                  <div>失败</div>
-                </div>
-              </td>
-              <td>2021-11-22 11:23:00</td>
-              <td><input type="text" placeholder="--双击输入描述信息--" /></td>
-              <td>
-                <button class="operation-btn">详情</button>
-                <button class="operation-btn">删除</button>
-              </td>
-            </tr>
+            <thead>
+              <tr>
+                <th style="padding-left: 24px">序号</th>
+                <th style="padding-left: 13px; width: 300px">
+                  <a style="margin-right: 8px">|</a>命令/ID
+                </th>
+                <th style="padding-left: 13px">
+                  <a style="margin-right: 8px">|</a>IP地址
+                </th>
+                <th style="padding-left: 13px">
+                  <a style="margin-right: 8px">|</a>任务状态
+                  <img src="../assets/common/filter-default.png" />
+                </th>
+                <th style="padding-left: 13px">
+                  <a style="margin-right: 8px">|</a>开始时间
+                  <q-icon
+                    name="unfold_more"
+                    style="font-size: 17px; margin-left: 2px"
+                  ></q-icon>
+                </th>
+                <th style="padding-left: 13px; width: 600px">
+                  <a style="margin-right: 8px">|</a>描述
+                </th>
+                <th style="padding-left: 13px; width: 150px">
+                  <a style="margin-right: 8px">|</a>操作
+                </th>
+              </tr>
+            </thead>
+            <tbody>
+              <tr v-for="(item, index) in recordList">
+                <td>{{ index+1 }}</td>
+                <td><q-icon name="edit"></q-icon>{{ item.name }}</td>
+                <td>{{ item.ip }}</td>
+                <td>
+                  <div>
+                    <div class="row" v-show="item.status == 'running'">
+                      <div class="state-icon state-icon-running" ></div>
+                      <div>running</div>
+                    </div>
+                    <div class="row" v-show="item.status == 'finished'">
+                      <div class="state-icon state-icon-finish" ></div>
+                      <div>finished</div>
+                    </div>
+                    <div class="row" v-show="item.status == 'failed'">
+                      <div class="state-icon state-icon-failed" ></div>
+                      <div>failed</div>
+                    </div>                    
+                  </div>
+                </td>
+                <td>{{ item.date }}</td>
+                <td><q-input outlined placeholder="--双击输入描述信息--" v-model="descriptionList[index]"
+                    @blur="updateRecordDescription(index, item.id)"  @keyup.enter="updateRecordDescription(index, item.id)"/></td>
+                <td>
+                  <button class="operation-btn" @click="getRecordDetail(item.type, item.id, item.mid)">
+                    详情
+                  </button>
+                  <button class="operation-btn">删除</button>
+                </td>
+              </tr>
+            </tbody>
           </table>
         </div>
         <div
           class="row"
           style="justify-content: space-between; margin: 24px 32px 32px 32px"
         >
-          <div style="padding-top: 8px">共100条数据</div>
+          <div style="padding-top: 8px">共{{recordNum}}条数据</div>
           <div>
+
             <div style="float: left">
-              <select class="select_page">
-                <option>5条/页</option>
-                <option>10条/页</option>
-                <option selected>15条/页</option>
-              </select>
-            </div>
-            <div style="float: left">
-              <ul class="pagination">
-                <li>
-                  <a href=""><q-icon name="chevron_left"></q-icon></a>
-                </li>
-                <li><a class="active" href="">1</a></li>
-                <li><a href="">2</a></li>
-                <li><a href="">3</a></li>
-                <li><a href="">4</a></li>
-                <li><a href="">5</a></li>
-                <li>
-                  <a href=""><q-icon name="chevron_right"></q-icon></a>
-                </li>
-              </ul>
+              <q-pagination
+                v-model="curPage"
+                :max="recordNum % 15 == 0 && recordNum != 0 ? recordNum / 15 : recordNum / 15 + 1"
+                direction-links
+                flat
+                color="blue"
+              />
             </div>
           </div>
         </div>