feat(knowledge): 优化知识库页面结构和样式

-调整了知识库页面的布局结构
- 优化了任务轨迹页面的样式
- 改进了上传任务详情的展示方式
- 统一了代码格式和风格

src/router/generatedRouter/index.js

@@ -1,48 +1,48 @@
-import layout from "@/views/app/layout/index.vue";
-import redirect from "@/views/app/redirect/index.vue";
+import layout from '@/views/app/layout/index.vue'
+import redirect from '@/views/app/redirect/index.vue'
 
 export default [
   {
-    path: "/knowledge",
-    name: "home",
+    path: '/knowledge',
+    name: 'home',
     component: layout,
-    redirect: "/knowledge/list",
+    redirect: '/knowledge/list',
     meta: {
-      title: "AI知识库",
-      icon: "el-icon-s-home",
+      title: 'AI知识库',
+      icon: 'el-icon-s-home',
       affix: true
     },
     children: [
       {
-        path: "/knowledge/list",
-        name: "home",
+        path: '/knowledge/list',
+        name: 'home',
         component: redirect,
-        redirect: "/knowledge/list",
+        redirect: '/knowledge/list',
         meta: {
-          title: "知识库",
-          icon: "el-icon-s-home",
+          title: '知识库',
+          icon: 'el-icon-s-home',
           affix: true
         },
         children: [
           {
-            path: "/knowledge/list",
-            name: "home",
-            component: () => import("@/views/knowledge/index.vue"),
+            path: '/knowledge/list',
+            name: 'home',
+            component: () => import('@/views/knowledge/index.vue'),
             meta: {
               breadcrumb: false,
-              title: "知识库",
-              icon: "el-icon-s-home"
+              title: '知识库',
+              icon: 'el-icon-s-home'
             }
           },
           {
-            path: "/knowledge/detail",
-            name: "detail",
+            path: '/knowledge/detail',
+            name: 'detail',
             component: redirect,
-            redirect: "/knowledge/detail",
+            redirect: '/knowledge/detail',
             hidden: true,
             meta: {
-              title: "知识库详情",
-              icon: "el-icon-s-home"
+              title: '知识库详情',
+              icon: 'el-icon-s-home'
             },
             children: [
               {
@@ -52,45 +52,56 @@ export default [
                 meta: {
                   breadcrumb: false,
                   title: '知识库详情',
+                  icon: 'el-icon-s-home'
+                }
+              },
+
+              {
+                path: '/knowledge/detail',
+                name: 'detail',
+                component: () => import('@/views/knowledge/detail/index.vue'),
+                meta: {
+                  breadcrumb: false,
+                  title: '知识库详情',
+                  icon: 'el-icon-s-home'
+                }
+              },
+              {
+                path: '/knowledge/detail/create',
+                name: 'create',
+                component: () => import('@/views/knowledge/detail/create.vue'),
+                meta: {
+                  title: '知识库新增',
+                  icon: 'el-icon-s-home'
+                }
+              }
+            ]
+          }
+        ]
+      },
+      {
+        path: '/knowledge/track',
+        name: 'question',
+        component: redirect,
+        redirect: '/knowledge/track',
+        meta: {
+          title: '任务轨迹',
           icon: 'el-icon-s-home',
+          affix: true
         },
-              },
-
-
+        children: [
           {
-                path: "/knowledge/detail",
-                name: "detail",
-                component: () => import("@/views/knowledge/detail/index.vue"),
+            path: '/knowledge/track',
+            name: 'track',
+            component: () => import('@/views/knowledge/track/Index.vue'),
             meta: {
               breadcrumb: false,
-                  title: "知识库详情",
-                  icon: "el-icon-s-home"
-                }
-              },
-              {
-                path: "/knowledge/detail/create",
-                name: "create",
-                component: () => import("@/views/knowledge/detail/create.vue"),
-                meta: {
-                  title: "知识库新增",
-                  icon: "el-icon-s-home"
-                }
-              }
-            ]
-          },
-          {
-            path: "/knowledge/track",
-            name: "track",
-            component: () => import("@/views/knowledge/track/Index.vue"),
-            meta: {
-              breadcrumb: false,
-              title: "任务轨迹",
-              icon: "el-icon-s-home"
+              title: '任务轨迹',
+              icon: 'el-icon-s-home'
             }
           }
         ]
       }
-
     ]
   }
-];
+]

src/views/knowledge/track/Index.vue

@@ -1,6 +1,6 @@
 <script>
-import { getDocByPage } from "@/api/knowledge/task-page";
-import KnowledgeInfo from "@/views/knowledge/track/views/knowledge-info/Index.vue";
+import { getDocByPage } from '@/api/knowledge/task-page'
+import KnowledgeInfo from '@/views/knowledge/track/views/knowledge-info/Index.vue'
 
 export default {
   components: {
@@ -13,13 +13,13 @@ export default {
       tabList: [],
       currentPage: 1,
       form: {
-        knowledge: "",
-        knowledgeName: "",
-        uploadUser: "",
-        taskStatus: "",
-        taskTime: ""
+        knowledge: '',
+        knowledgeName: '',
+        uploadUser: '',
+        taskStatus: '',
+        taskTime: ''
+      }
     }
-    };
   },
   computed: {},
   methods: {
@@ -27,66 +27,68 @@ export default {
       const payload = {
         page: this.currentPage,
         pageSize: 10,
-        docId: ""
-      };
+        docId: ''
+      }
 
       getDocByPage(payload).then(res => {
-        this.tabList = res.content.content.list ? res.content.content.list : [];
-        console.log(res.content.content.list ? res.content.content.list : []);
-      });
+        this.tabList = res.content.content.list ? res.content.content.list : []
+        console.log(res.content.content.list ? res.content.content.list : [])
+      })
     },
     handleActiveInfo(scope) {
-      this.infoDialogVisible = true;
-      console.log(scope.row);
+      this.infoDialogVisible = true
+      console.log(scope.row)
 
-      this.activeForm = scope.row;
+      this.activeForm = scope.row
     }
   },
   beforeMount() {
-    console.log(`onMounted`);
-    this.getTableData();
+    console.log(`onMounted`)
+    this.getTableData()
+  }
 }
-};
 </script>
 
 <template>
-  <div>
-    <el-card>
+  <div class="container">
+    <el-card shadow="hover">
       <!-- 知识库信息 -->
       <div>
-        <el-form>
+        <el-form label-width="120px">
           <el-row>
             <el-col :span="8">
               <el-form-item label="知识库">
-                <el-select v-model="form.knowledge">
-                </el-select>
+                <el-select v-model="form.knowledge"> </el-select>
               </el-form-item>
             </el-col>
 
             <el-col :span="8">
               <el-form-item label="知识文件名称">
-                <el-select v-model="form.knowledgeName">
-                </el-select>
+                <el-select v-model="form.knowledgeName"> </el-select>
               </el-form-item>
             </el-col>
 
             <el-col :span="8">
               <el-form-item label="上传用户">
-                <el-select v-model="form.uploadUser">
-                </el-select>
+                <el-select v-model="form.uploadUser"> </el-select>
               </el-form-item>
             </el-col>
 
             <el-col :span="8">
               <el-form-item label="任务状态">
-                <el-select v-model="form.taskStatus">
-                </el-select>
+                <el-select v-model="form.taskStatus"> </el-select>
               </el-form-item>
             </el-col>
             <el-col :span="8">
               <el-form-item label="任务时间">
-                <el-date-picker v-model="form.taskTime" type="daterange" unlink-panels
-                                range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
+                <el-date-picker
+                  v-model="form.taskTime"
+                  type="daterange"
+                  unlink-panels
+                  range-separator="至"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期"
+                >
                 </el-date-picker>
               </el-form-item>
             </el-col>
@@ -97,18 +99,12 @@ export default {
       <!-- 任务列表 -->
       <div>
         <el-table :data="tabList" style="width: 100%">
-          <el-table-column prop="taskCode" label="任务号" width="180">
-          </el-table-column>
-          <el-table-column prop="docTypeName" label="知识库" width="180">
-          </el-table-column>
-          <el-table-column prop="fileName" label="知识文件名称">
-          </el-table-column>
-          <el-table-column prop="processStatus" label="上传状态">
-          </el-table-column>
-          <el-table-column prop="createdUser" label="上传用户">
-          </el-table-column>
-          <el-table-column prop="uploadDate" label="上传时间">
-          </el-table-column>
+          <el-table-column prop="taskCode" label="任务号" width="180"> </el-table-column>
+          <el-table-column prop="docTypeName" label="知识库" width="180"> </el-table-column>
+          <el-table-column prop="fileName" label="知识文件名称"> </el-table-column>
+          <el-table-column prop="processStatus" label="上传状态"> </el-table-column>
+          <el-table-column prop="createdUser" label="上传用户"> </el-table-column>
+          <el-table-column prop="uploadDate" label="上传时间"> </el-table-column>
           <el-table-column prop="processStatus" label="操作">
             <template slot-scope="scope">
               <el-button type="primary" size="mini" @click="handleActiveInfo(scope)">查看详情</el-button>
@@ -116,8 +112,7 @@ export default {
           </el-table-column>
         </el-table>
         <!-- 弹出提示框， 里面是各种详情内容 -->
-        <el-dialog title="提示" :visible.sync="infoDialogVisible" width="60%"
-                   :before-close="() => infoDialogVisible = false">
+        <el-dialog title="上传任务详情" :visible.sync="infoDialogVisible" width="60%" :before-close="() => (infoDialogVisible = false)">
           <knowledge-info :form="activeForm"></knowledge-info>
         </el-dialog>
       </div>

src/views/knowledge/track/views/knowledge-info/Index.vue

@@ -2,8 +2,7 @@
 export default {
   name: 'index',
   data() {
-        return {
-        }
+    return {}
   },
   props: {
     form: {
@@ -27,10 +26,10 @@ export default {
 
 <template>
   <div>
-        <el-card class="box-card">
-            <div slot="header" class="clearfix">
-                <span>上传任务详情</span>
-            </div>
+    <!--    <el-card class="box-card" shadow="hover">-->
+    <!--      <div slot="header" class="clearfix">-->
+    <!--        <span>上传任务详情</span>-->
+    <!--      </div>-->
     <div class="card-body">
       <el-form ref="form" :model="form" label-width="80px">
         <el-row>
@@ -84,9 +83,16 @@ export default {
             </el-form-item>
           </el-col>
           <el-col :span="3">
-                            <el-button type="primary" size="small"
-                                @click="() => { form.processStatus = form.processStatus === 1 ? 2 : 1 }">switch
-                                status</el-button>
+            <el-button
+              type="primary"
+              size="small"
+              @click="
+                () => {
+                  form.processStatus = form.processStatus === 1 ? 2 : 1
+                }
+              "
+              >switch status</el-button
+            >
           </el-col>
         </el-row>
 
@@ -115,7 +121,7 @@ export default {
         </el-row>
       </el-form>
     </div>
-        </el-card>
+    <!--    </el-card>-->
   </div>
 </template>