修改全文对比得细节问题

2024-02-29 15:19:09 +08:00
parent ac4e7f2cfc
commit 6adbe33288
3 changed files with 240 additions and 10 deletions
@@ -60,10 +60,31 @@
              <div class="detail-content-left-item" @click="detailLeft(index,item)"
                   v-for="(item,index) in resultData.textLeft" :key="index"
                   :class="{'detail-content-item-selected': leftHighlightMenuId === item.menuId,'detail-content-item-saved':item.reviewed + '' === '1'}">
+                <div style="position: relative">
                <div class="detail-content-item-text" style="margin-bottom: 10px;color: #040B29">
                  {{ item.itemsNum + ' ' + item.itemsName }}
                </div>
                <div class="detail-content-item-text" v-html="item.itemsText"></div>
+                  <div @click="addViewRemark(item)" class="addRemarkBtn" v-show="!item.remark && !item.closeBtn">
+                    <a-icon type="plus-circle" class="iconClass" /></div>
+                  <div @click="addViewRemark(item)" class="addRemarkBtn" v-show="item.remark && !item.closeBtn">
+                    <a-icon type="eye"  class="iconClass"/></div>
+                  <div @click="closeView(item)" class="addRemarkBtn" v-show="item.closeBtn">
+                    <a-icon type="close-circle"  class="iconClass"/></div>
+                </div>
+                <div v-if="item.addModalState">
+                  <a-textarea
+                    v-model.trim="item.remark"
+                    :maxlength="500"
+                    placeholder="书写笔记"
+                    :auto-size="{ minRows: 3, maxRows: 5 }"
+                  />
+                  <div style="text-align: right;margin: 10px 0">
+                    <a-button type="primary" @click="modalSave(item)">
+                      提交
+                    </a-button>
+                  </div>
+                </div>
              </div>
            </div>
          </div>
@@ -122,17 +143,39 @@
              <div class="detail-content-right-item" @click="detailRight(index,item)"
                   v-for="(item,index) in resultData.textRight" :key="index"
                   :class="{'detail-content-item-selected': item.menuId === rightHighlightMenuId, 'detail-content-item-saved':item.reviewed + '' === '1'}">
-                <div class="detail-content-item-text" style="margin-bottom: 10px;color: #040B29">
-                  {{ item.itemsNum + ' ' + item.itemsName }}
+                <div style="position: relative">
+                  <div class="detail-content-item-text" style="margin-bottom: 10px;color: #040B29">
+                    {{ item.itemsNum + ' ' + item.itemsName }}
+                  </div>
+                  <div class="detail-content-item-text" v-html="item.itemsText">
+                  </div>
+                  <div @click="addViewRemark(item)" class="addRemarkBtn" v-show="!item.remark && !item.closeBtn">
+                    <a-icon type="plus-circle" class="iconClass" /></div>
+                  <div @click="addViewRemark(item)" class="addRemarkBtn" v-show="item.remark && !item.closeBtn">
+                    <a-icon type="eye"  class="iconClass"/></div>
+                  <div @click="closeView(item)" class="addRemarkBtn" v-show="item.closeBtn">
+                    <a-icon type="close-circle"  class="iconClass"/></div>
                </div>
-                <div class="detail-content-item-text" v-html="item.itemsText">
+                <div v-if="item.addModalState">
+                  <a-textarea
+                    v-model.trim="item.remark"
+                    :maxlength="500"
+                    placeholder="书写笔记"
+                    :auto-size="{ minRows: 3, maxRows: 5 }"
+                  />
+                  <div style="text-align: right;margin: 10px 0">
+                    <a-button type="primary" @click="modalSave(item)">
+                      提交
+                    </a-button>
+                  </div>
+                </div>
+
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
-    </div>
  </internal-detail-page>
 </template>

@@ -141,6 +184,7 @@

 import InternalDetailPage from '../../../components/InternalDetailPage.vue'
 import { getComparisonDetail, clauseComparison } from '../../../api/documentToolApi.js'
+import { postAction } from '../../../api/manage'

 export default {
  name: 'DocumentDataComparison',
@@ -164,6 +208,28 @@ export default {
      rightHighlightMenuId: null, // 右侧高亮数据的menuId
      similarityDegree: '',
      textContent: '',
+      itemLeftIndex: '',
+      itemRightIndex: ''
+    }
+  },
+  watch: {
+    itemRightIndex: {
+      deep: true,
+      handler (newVal, oldVal) {
+        if (oldVal !== '') {
+          this.resultData.textRight[oldVal].addModalState = false
+          this.resultData.textRight[oldVal].closeBtn = false
+        }
+      }
+    },
+    itemLeftIndex: {
+      deep: true,
+      handler (newVal, oldVal) {
+        if (oldVal !== '') {
+          this.resultData.textLeft[oldVal].addModalState = false
+          this.resultData.textLeft[oldVal].closeBtn = false
+        }
+      }
    }
  },
  mounted () {
@@ -191,6 +257,7 @@ export default {
      this.leftTreeSelectedKeys = [item.menuId]
      this.similarityDegree = ''
      this.textContent = ''
+      this.itemLeftIndex = num
      if (item.id === this.dataLeft.id && !this.isMatching) {
        this.dataLeft = {}
        this.leftHighlightMenuId = null
@@ -221,6 +288,7 @@ export default {
      this.rightTreeSelectedKeys = [item.menuId]
      this.similarityDegree = ''
      this.textContent = ''
+      this.itemRightIndex = num
      if (item.id === this.dataRight.id && !this.isMatching) {
        this.dataRight = {}
        this.rightHighlightMenuId = null
@@ -276,6 +344,7 @@ export default {
      const index = this.resultData.textLeft.findIndex(tt => tt.menuId === node.menuId)
      this.dataLeft = this.resultData.textLeft[index]
      this.dataLeft.numIndex = index
+      this.itemLeftIndex = index
      this.leftHighlightMenuId = this.dataLeft.menuId
      this.leftTreeSelectedKeys = [this.dataLeft.menuId]
      this.handleJumpLeftData(index)
@@ -302,6 +371,7 @@ export default {
      const index = this.resultData.textRight.findIndex(tt => tt.menuId === node.menuId)
      this.dataRight = this.resultData.textRight[index]
      this.dataRight.numIndex = index
+      this.itemRightIndex = index
      this.rightHighlightMenuId = this.dataRight.menuId
      this.rightTreeSelectedKeys = [this.dataRight.menuId]
      this.handleJumpRightData(index)
@@ -352,6 +422,45 @@ export default {
    },
    changeRightCatalogueShow () {
      this.rightCatalogueShow = !this.rightCatalogueShow
+    },
+    // 添加笔记
+    addViewRemark (item) {
+      item.addModalState = true
+      item.closeBtn = true
+    },
+    closeView (item) {
+      // if (item.remark !== item.oldRemark) {
+      //   this.$confirm({
+      //     title: '提示',
+      //     content: '<p>笔记内容有修改，是否保存?</p>',
+      //     onOk: () => {
+      //       this.modalSave(item)
+      //       item.closeBtn = false
+      //       item.addModalState = false
+      //     },
+      //     onCancel: () => {
+      //       item.closeBtn = false
+      //       item.addModalState = false
+      //     }
+      //   })
+      // } else {
+      item.closeBtn = false
+      item.addModalState = false
+      // }
+    },
+    modalSave (item) {
+      const query = {
+        remark: item.remark,
+        id: item.id
+      }
+      postAction('/compare/sarFileCompareItem/edit', query).then((res) => {
+        item.oldRemark = item.remark
+        if (res.success) {
+          this.$message.success(res.message)
+        } else {
+          this.$message.warning(res.message)
+        }
+      })
    }
  }
 }
@@ -506,6 +615,7 @@ export default {
    border: 1px solid #EFF1F3;
    cursor: pointer;
    background-color: white;
+    position: relative;
  }

  .detail-content-right-item {
@@ -514,6 +624,7 @@ export default {
    border: 1px solid #EFF1F3;
    cursor: pointer;
    background-color: white;
+    position: relative;
  }

  .detail-content-left-item:last-child {
@@ -681,4 +792,13 @@ export default {
    text-align: right;
    padding-right: 16px;
  }
+  .addRemarkBtn{
+    position: absolute;
+    bottom: 0;
+    right: -10px;
+    /*z-index: 10;*/
+  }
+  .iconClass{
+    font-size: 18px;
+  }
 </style>