feat：改路由

src/router/index.js

@@ -141,13 +141,13 @@ export const constantRoutes = [
         }
       },
       {
-        component: () => import('@/views/dataList/product/index'),
+        component: () => import('@/views/taskList/index'),
         meta: {
           icon: '',
           title: '跟踪文档详情'
         },
-        name: 'taskListDetails',
-        path: 'taskListDetails',
+        name: 'taskListIndex',
+        path: 'taskListIndex',
         hidden: true
       },
       // {

src/views/dataList/dashboard/index.vue

@@ -94,8 +94,10 @@ export default {
     // 搜索左侧
     seatchInitLeft() {
         this.loadingLeft = true
-        // listCustomer(this.queryParams)
-        //   .then(response => {
+        doctaskFinddifferenceSearch({
+          
+        })
+          .then(response => {
             if (this.queryParamsLeft.pageContent === 0) {
               this.queryParamsLeft.pageContent = 0 
               for (let i = 0; i < 10; i++) {
@@ -166,11 +168,11 @@ export default {
                   })  
                 }
                 this.queryParamsLeft.pageNo = page
-        // })
-        // .catch(error => {
-        //   this.loading = false;
-        // });
             }
+        })
+        .catch(error => {
+          this.loading = false;
+        });
         setTimeout(() => {
           this.loadingLeft = false
         }, 1000);

src/views/system/customer/index.vue

@@ -323,7 +323,7 @@ export default {
     routerTaskListDetails(row) {
       try {
         this.$router.push({
-          name: 'taskListDetails',
+          path: '/documentManagement/taskListIndex',
           query: {
             id: row.docDocumentId,
             name: row.name

src/views/taskList/index.vue

+<template>
+<div class="app-container">
+    <!-- 头部 -->
+    <div class="seachData" ref="seachDatas">
+        <div class="seachData-left">
+          <i class="el-icon-arrow-left left-span" @click="blackTaskList"></i>
+          <span>{{title ? title + '文档跟踪报告' : '文档跟踪报告'}}</span>
+        </div>
+    </div>
+    <div class="content">
+        <div class="content-left scroll">
+            <div v-if="loading" class="content-right-content loading loading-left">
+                <div class="loading-div">
+                    <i class="el-icon-loading loading-center"></i>
+                    <div>加载中...</div>
+                </div>
+            </div>
+            <div class="content-left-center scroll">
+                <div v-if="deleteCenter.length && !loading">
+                    <div class="delete-center" v-for="(item, index) in deleteCenter" :key="index">
+                        <div class="title">
+                            <span class="title-span">{{item.docTitle}}</span>
+                            <span>更新日期:</span>
+                            <span class="time">{{dateFilter(item.updateTime)}}</span>
+                            <span>共1处更新</span>
+                        </div>
+                        <div class="center">
+                          <div class="center-delete">
+                            <div class="center-delete-tab green">新版</div>
+                            <div class="center-delete-text" v-html="item.paragraphAfter"></div>
+                          </div>
+                          <div class="center-delete">
+                            <div class="center-delete-tab gray">旧版</div>
+                            <div class="center-delete-text" v-html="item.paragraphBefore"></div>
+                          </div>
+                        </div>
+                    </div>
+                </div>
+                <div class="none" v-else-if="!deleteCenter.length && !loading">
+                    暂无数据
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+</template>
+
+<script>
+// 接口调用方法
+import {
+  doctaskFinddifference
+} from "@/api/system/product";
+export default {
+  data() {
+    return {
+        title: '', // 跟踪文档标题抬头
+        deleteId: '', // 详情id
+        tableHeights: 0, // table高度
+        loading: false,
+        deleteCenter: []
+    }
+  },
+  watch: {
+  },
+  created() {
+    this.init()
+    this.$nextTick(() => {
+        this.tableHeight();
+    })
+  },
+  computed: {
+    // 计算过的height
+    tableHeightCount() {
+      return this.tableHeights
+    }
+  },
+  methods: {
+    //   初始化
+    init() {
+        console.log(this.$route.query, 'this.$route.query')
+        this.title = this.$route.query.name
+        this.deleteId =  this.$route.query.id
+        this.searchCustomer()
+    },
+    // 返回跟踪文档
+    blackTaskList() {
+      this.$router.push({
+        path: '/documentManagement/taskList'
+      })
+    },
+    dateFilter(time) {    
+      if (!time) { 
+        // 当时间是null或者无效格式时我们返回空        
+        return '-'    
+      } else {        
+        const date = new Date(time) // 时间戳为10位需*1000，时间戳为13位的话不需乘1000        
+        const dateNumFun = (num) => num < 10 ? `0${num}` : num // 使用箭头函数和三目运算以及es6字符串的简单操作。因为只有一个操作不需要{} ，目的就是数字小于10，例如9那么就加上一个0，变成09，否则就返回本身。        // 这是es6的解构赋值。        
+        const [Y, M, D, h, m, s] = [            
+            date.getFullYear(),            
+            dateNumFun(date.getMonth() + 1),            
+            dateNumFun(date.getDate()),            
+            dateNumFun(date.getHours()),            
+            dateNumFun(date.getMinutes()),            
+            dateNumFun(date.getSeconds())        
+        ]        
+        return `${Y}-${M}-${D} ${h}:${m}:${s}` // 一定要注意是反引号，否则无效。    
+      }
+    },
+    searchCustomer() {
+        this.loading = true;
+        doctaskFinddifference(this.deleteId)
+          .then(response => {
+            if (response.code === 200) {
+              let content = response.content.value
+              for (let a = 0; a < content.length; a++) {
+                let difWordAfter = content[a].difWordAfter
+                let url = content[a].docUrl
+                if (content[a].paragraphAfter.indexOf(difWordAfter) >= 0) {
+                  let values = content[a].paragraphAfter.split(difWordAfter);
+                  content[a].paragraphAfter = values.join(
+                    `<a style="color: rgba(250, 0, 0, 1);" href="${url}" target="_blank">${difWordAfter}</a>`
+                  )
+                }
+              }
+              this.$set(this, 'deleteCenter', content)
+            }
+            this.loading = false
+            this.$nextTick(() => {
+              this.customerListHeights = this.$refs.customerListHeight.offsetHeight
+            })
+        })
+        .catch(error => {
+          this.loading = false;
+        });
+    },
+    // 计算高度
+    tableHeight() {
+      let height = document.documentElement.clientHeight - 128
+      this.tableHeights = height < 580 ? 580 : height
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+@import '@/views/main.scss';
+.app-container {
+    .content {
+        top: 64px;
+        background: #fafafa;
+    }
+}
+.seachData {
+    .seachData-left {
+        padding-left: 46px;
+    }
+}
+.left-span {
+    margin-right: 18px;
+    color: #0052D9;
+    font-size: 26px;
+    text-align: center;
+    width: 18px;
+    cursor: pointer;
+}
+.delete-center {
+    width: 100%;
+    margin-bottom: 16px;
+    padding: 32px 36px;
+    background: #fff;
+    &:first-child {
+        margin-top: 16px;
+    }
+    .title {
+        font-size: 18px;
+        color: rgba(0, 0, 0, 0.9000);
+        .time {
+            margin-right: 24px;
+        }
+        .title-span {
+          margin-right: 16px;
+        }
+    }
+    .center {
+        width: 100%;
+        display: flex;
+        .center-delete {
+            width: 50%;
+            margin-top: 24px;
+        }
+        .center-delete-tab {
+            width: 44px;
+            height: 24px;
+            line-height: 24px;
+            text-align: center;
+            border-radius: 4px;
+            &.green {
+                background: #c8ffe8;
+                color: #4ec192;
+            }
+            &.gray {
+                background: rgba(0, 0, 0, 0.2000);
+                color: #8a8888;
+            }
+        }
+        .center-delete-text {
+            margin-top: 24px;
+            text-align: left;
+            font-size: 14px;
+            line-height: 20px;
+            color: rgba(0, 0, 0, 0.6);
+            word-break: break-all;
+        }
+    }
+}
+.content-left-center {
+    .none {
+        position: absolute;
+        left: 50%;
+        top: 50%;
+        transform: translate(-50%, -50%);
+        color: #8a8888;
+        font-size: 16px;
+    }
+}
+</style>
\ No newline at end of file