From 9971cd369bc112f50f77cb91b6f90b03df179e41 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8C=83=E5=BC=BA=E5=BC=BA?= <787203167>
Date: Tue, 27 Feb 2024 18:03:41 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AF=B9=E6=8E=A5=E6=9D=A1=E6=AC=BE=E6=AF=94?=
 =?UTF-8?q?=E5=AF=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 jero-web/src/api/documentToolApi.js           |   3 +
 .../documentComparison/DocumentComparison.vue |  33 ++-
 .../documentComparison/comparisonOfTerms.vue  |   4 +-
 .../comparisonTermsView.vue                   |  83 +++++---
 .../modules/viewDifferenceModal.vue           | 198 ++++++++++++++++++
 5 files changed, 279 insertions(+), 42 deletions(-)
 create mode 100644 jero-web/src/views/documentTool/documentComparison/modules/viewDifferenceModal.vue

diff --git a/jero-web/src/api/documentToolApi.js b/jero-web/src/api/documentToolApi.js
index c2872a8..21862df 100644
--- a/jero-web/src/api/documentToolApi.js
+++ b/jero-web/src/api/documentToolApi.js
@@ -67,6 +67,8 @@ const getSplitMenusByInfo = (params) => getAction('/split/sarFileSplitMenu/getSp
 const documentSplitView = (params) => postAction('/laws/DocumentTool/documentSplit/queryDocumentSplitDetail', params)
 // 文档对比-文档对比-条款对比对比按钮
 const clauseComparisonEvent = (params) => postAction('/compare/sarFileCompareItem/clauseComparisonEvent', params)
+// 文档对比-文档对比-条款对比对比按钮
+const getComparisonTermsViewList = (params) => getAction('/compare/sarItemsCompareHis/page', params)
 
 
 // 文档对比-文档对比-自动匹配
@@ -147,6 +149,7 @@ export {
   getSplitMenusByInfo,
   documentSplitView,
   clauseComparisonEvent,
+  getComparisonTermsViewList,
   clauseComparison,
   addFullTextComment,
   deleteComparisonResult,
diff --git a/jero-web/src/views/documentTool/documentComparison/DocumentComparison.vue b/jero-web/src/views/documentTool/documentComparison/DocumentComparison.vue
index c8089d1..8aaf049 100644
--- a/jero-web/src/views/documentTool/documentComparison/DocumentComparison.vue
+++ b/jero-web/src/views/documentTool/documentComparison/DocumentComparison.vue
@@ -277,18 +277,31 @@ export default {
     },
     // 对比结果按钮点击
     comparisonResultsClick (item) {
-      if (item.releaseState === 'draft') {
-        item.isDisplay = 2
+      if (item.compareType === 'item') {
+        this.$router.push({
+          path: '/documentTool/comparisonTermsView',
+          query: {
+            id: item.id,
+            titleLeft: item.titleLeft,
+            titleRight: item.titleRight,
+            serialNumberLeft: item.serialNumberLeft,
+            serialNumberRight: item.serialNumberRight
+          }
+        })
       } else {
-        item.isDisplay = 1
-      }
-      this.$router.push({
-        path: '/documentTool/ComparisonResults',
-        query: {
-          id: item.id,
-          isDisplay: item.isDisplay
+        if (item.releaseState === 'draft') {
+          item.isDisplay = 2
+        } else {
+          item.isDisplay = 1
         }
-      })
+        this.$router.push({
+          path: '/documentTool/ComparisonResults',
+          query: {
+            id: item.id,
+            isDisplay: item.isDisplay
+          }
+        })
+      }
     },
     // 撤回按钮点击
     subscribe (record) {
diff --git a/jero-web/src/views/documentTool/documentComparison/comparisonOfTerms.vue b/jero-web/src/views/documentTool/documentComparison/comparisonOfTerms.vue
index 0c559a0..28fc3ea 100644
--- a/jero-web/src/views/documentTool/documentComparison/comparisonOfTerms.vue
+++ b/jero-web/src/views/documentTool/documentComparison/comparisonOfTerms.vue
@@ -159,7 +159,9 @@ export default {
   },
   methods: {
     handleBack () {
-
+      this.$router.push({
+        path: '/documentTool/documentComparison'
+      })
     },
     // 左侧树选择
     onSelectLeft (selectedKeys, exports) {
diff --git a/jero-web/src/views/documentTool/documentComparison/comparisonTermsView.vue b/jero-web/src/views/documentTool/documentComparison/comparisonTermsView.vue
index 88d0b82..7a85f9b 100644
--- a/jero-web/src/views/documentTool/documentComparison/comparisonTermsView.vue
+++ b/jero-web/src/views/documentTool/documentComparison/comparisonTermsView.vue
@@ -5,6 +5,9 @@
                         need-custom-back-func
                         @back="handleBack">
     <div class="can-scroll-content">
+      <div class="can-scroll-content-header">
+         {{$route.query.titleLeft + ' ' + $route.query.serialNumberLeft + ' —— ' + $route.query.titleRight + ' ' + $route.query.serialNumberRight}}
+      </div>
         <j-table
           ref="table"
           size="middle"
@@ -14,32 +17,26 @@
           :loading="loading"
           :pagination="ipagination"
           :scroll="{x: '100%', y: yScrollHeight}"
+          @operationClick="operationClick"
           :operation-list="operationList">
-
-          <!--新文本跳转标准详情-->
-          <template v-slot:newTextDetail="{text, record}">
-            <a-tooltip overlay-class-name="tooltip-style">
-              <template slot="title">{{ text || text === 0 ? text : global.emptyLine }}</template>
-              <div class="table-text can-click-table-text" v-if="text || text === 0" @click="toDetailPage('new', record)">{{
-                text
-                }}
-              </div>
-              <div v-else class="table-text">{{ global.emptyLine }}</div>
-            </a-tooltip>
-          </template>
         </j-table>
     </div>
+    <viewDifferenceModal ref="viewDifferenceModalRef"/>
   </internal-detail-page>
 </template>
 
 <script>
 import InternalDetailPage from '../../../components/InternalDetailPage.vue'
 import JTable from '../../../components/jero/JTable.vue'
+import { JeroListMixin } from '../../../mixins/JeroListMixin.js'
+import viewDifferenceModal from './modules/viewDifferenceModal'
 export default {
   name: 'comparisonTermsView',
+  mixins: [JeroListMixin],
   components: {
     InternalDetailPage,
-    JTable
+    JTable,
+    viewDifferenceModal
   },
   data () {
     return {
@@ -48,39 +45,39 @@ export default {
       columns: [
         {
           title: '旧条款号',
-          dataIndex: 'serialNumberLeft',
+          dataIndex: 'oldItemsNum',
           width: 170,
-          ellipsis: true,
+          ellipsis: true
         },
         {
           title: '旧条款名称',
-          dataIndex: 'serialNumberLeft',
+          dataIndex: 'oldItemsName',
           width: 170,
-          ellipsis: true,
+          ellipsis: true
         },
         {
           title: '新条款号',
-          dataIndex: 'serialNumberLeft',
+          dataIndex: 'newItemsNum',
           width: 170,
-          ellipsis: true,
+          ellipsis: true
         },
         {
           title: '新条款名称',
-          dataIndex: 'serialNumberLeft',
+          dataIndex: 'newItemsName',
           width: 170,
-          ellipsis: true,
+          ellipsis: true
         },
         {
           title: '比对时间',
-          dataIndex: 'serialNumberLeft',
+          dataIndex: 'createTime',
           width: 170,
-          ellipsis: true,
+          ellipsis: true
         },
         // 操作
         {
           title: this.$t('operation'),
           fixed: 'right',
-          width: 250,
+          width: 100,
           scopedSlots: { customRender: 'action' }
         }
       ],
@@ -88,22 +85,46 @@ export default {
       operationList: [
         {
           text: '查看差异',
-          clickEvent: 'viewDifference'
-        },
-      ]
+          clickEvent: 'viewDifferenceClick'
+        }
+      ],
+      pageNo: 1,
+      pageSize: 10,
+      standHisId: this.$route.query.id,
+      url: {
+        list: '/compare/sarItemsCompareHis/page'
+      }
+    }
+  },
+  watch: {
+    standHisId: {
+      immediate: true,
+      handler (val) {
+        this.queryParam.standHisId = val
+      }
     }
   },
   methods: {
     handleBack () {
-
+      this.$router.push({
+        path: '/documentTool/documentComparison'
+      })
     },
-    viewDifference () {
-
+    viewDifferenceClick (item) {
+      console.log(item)
+      this.$refs.viewDifferenceModalRef.open(item)
     }
   }
 }
 </script>
 
 <style scoped>
-
+.can-scroll-content{
+  padding: 24px;
+  box-sizing: border-box;
+}
+.can-scroll-content-header{
+  font-size: 16px;
+  margin-bottom: 12px;
+}
 </style>
diff --git a/jero-web/src/views/documentTool/documentComparison/modules/viewDifferenceModal.vue b/jero-web/src/views/documentTool/documentComparison/modules/viewDifferenceModal.vue
new file mode 100644
index 0000000..296ab8e
--- /dev/null
+++ b/jero-web/src/views/documentTool/documentComparison/modules/viewDifferenceModal.vue
@@ -0,0 +1,198 @@
+<template>
+  <j-modal
+    title="比对结果"
+    width="80%"
+    :visible="visible"
+    :confirm-loading="confirmLoading"
+    :maskClosable="false"
+    switchFullscreen
+    @cancel="visible = false">
+    <div class="can-scroll-content">
+      <div class="detail-content-top">
+        相似度：<span style="color: red">{{similarityDegree}}</span> <span>（{{textContent}}）</span>
+      </div>
+      <div class="detail-content">
+        <!--左边的文档-->
+        <div class="detail-content-left">
+          <!--左侧标准信息-->
+          <div class="detail-content-left-container">
+            <div class="detail-content-left-scroll">
+              <div class="detail-content-left-item">
+                <div class="detail-content-item-text" style="margin-bottom: 10px;color: #040B29" v-html="textLeft">
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <!--右侧文档-->
+        <div class="detail-content-right">
+          <!--右侧标准信息-->
+          <div class="detail-content-right-container">
+            <div class="detail-content-right-scroll">
+              <div class="detail-content-right-item">
+                <div class="detail-content-item-text" v-html="textRight">
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </j-modal>
+</template>
+
+<script>
+export default {
+  name: 'viewDifferenceModal',
+  data () {
+    return {
+      confirmLoading: false,
+      visible: false,
+      textLeft: '',
+      textRight: '',
+      similarityDegree: '',
+      textContent: ''
+    }
+  },
+  methods: {
+    open (item) {
+      this.textLeft = item.oldItemsText
+      this.textRight = item.newItemsText
+      this.similarityDegree = item.similarityDegree
+      if (parseFloat(item.similarityDegree) < parseFloat('75%')) {
+        this.textContent = '不相似'
+      } else if (parseFloat(item.similarityDegree) >= parseFloat('75%') && parseFloat(item.similarityDegree) !== parseFloat('100%')) {
+        this.textContent = '相似'
+      } else if (parseFloat(item.similarityDegree) === parseFloat('100%')) {
+        this.textContent = '相同'
+      }
+      this.visible = true
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+  .can-scroll-content {
+    height: calc(100% - 52px);
+    overflow: auto;
+  }
+
+  .detail-content {
+    height: calc(100% - 12px);
+    /*background-color: #eff1f4;*/
+  }
+
+  .detail-content-left {
+    width: 50%;
+    float: left;
+    height: 100%;
+    border-right: 2px #EFF1F3 solid;
+    box-sizing: border-box;
+    border-bottom: 2px #EFF1F3 solid;
+    /*display: flex;*/
+  }
+
+  .detail-content-right {
+    width: 50%;
+    height: 100%;
+    float: left;
+    box-sizing: border-box;
+    border-bottom: 2px #EFF1F3 solid;
+    /*display: flex;*/
+  }
+
+  .item-model {
+    width: calc(100% - 232px);
+  }
+  .detail-content-left-container {
+    height: calc(100vh - 300px);
+    width: 100%;
+    display: inline-block;
+    overflow-y: auto;
+    transition: all 1s;
+    border-radius: 4px;
+    scroll-behavior: smooth;
+    flex: 1;
+  }
+
+  .detail-content-right-container {
+    height: calc(100vh - 300px);
+    width: 100%;
+    overflow-y: auto;
+    display: inline-block;
+    transition: all 1s;
+    scroll-behavior: smooth;
+    flex: 1;
+
+    .standard-name {
+      margin-right: 0;
+    }
+  }
+
+  .detail-content-left-scroll {
+    width: calc(100% - 20px);
+    display: inline-block;
+    height: calc(100% - 10px);
+    margin: 0 10px 0 10px;
+    overflow: auto;
+    background-color: white;
+    border-radius: 7px;
+  }
+
+  .detail-content-right-scroll {
+    width: calc(100% - 10px);
+    display: inline-block;
+    height: calc(100% - 10px);
+    margin-left: 10px;
+    overflow: auto;
+    border-radius: 7px;
+    background-color: white;
+  }
+
+  .detail-content-left-item {
+    padding: 16px 20px;
+    box-sizing: border-box;
+    border: 1px solid #fff;
+    cursor: pointer;
+    background-color: white;
+  }
+
+  .detail-content-right-item {
+    padding: 16px 20px;
+    box-sizing: border-box;
+    /*border: 1px solid #EFF1F3;*/
+    cursor: pointer;
+    background-color: white;
+  }
+
+  .detail-content-left-item:last-child {
+    margin-bottom: 0;
+  }
+
+  .detail-content-item-text {
+    font-size: 16px;
+    font-weight: 400;
+    color: #040B29;
+    word-break: break-word;
+
+    /deep/ table {
+      width: 100%;
+    }
+
+    /deep/ img {
+      max-width: 100%;
+    }
+  }
+
+  ::-webkit-scrollbar {
+    width: 3px;
+  }
+
+  .detail-content-top {
+    padding: 12px 24px;
+    box-sizing: border-box;
+    border-bottom: 2px solid #EFF1F3 ;
+    font-size: 16px;
+  }
+</style>