修改问题管理

jero-web/src/views/projectManagement/projectNonConformance/moudles/addModel.vue

@@ -501,6 +501,7 @@
   import { mapGetters } from 'vuex'
   import axios from 'axios'
   import Vue from 'vue'
+  import { ImagePreview } from 'vant'
 
   const toolbarOptions = [
     ['bold', 'italic', 'underline', 'strike'],        // toggled buttons
@@ -723,7 +724,7 @@
           //   return
           // }
 
-          this.formInline.progressTrackingList.push({ progressTracking: text, isDescription: false })
+          this.formInline.progressTrackingList.push({ progressTracking: text, isDescription: true })
         }
       },
       Standardselectioninput(val) {
@@ -799,6 +800,10 @@
         }
         if (this.formInline.progressTrackingList == null) {
           this.formInline.progressTrackingList = []
+        } else {
+          this.formInline.progressTrackingList.forEach(val => {
+            val.isDescription = true
+          })
         }
         if (this.formInline.approvalEvidenceLinkList == null) {
           this.formInline.approvalEvidenceLinkList = [{}]
@@ -837,7 +842,7 @@
         //     this.formInline.progressTrackingList.splice(0, 1)
         //   }
         // })
-        this.formInline.progressTrackingList.push({ progressTracking: text, isDescription: false })
+        this.formInline.progressTrackingList.push({ progressTracking: text, isDescription: true })
 
         // this.formInline.progressTrackingList.splice(this.index + 1, 1, { progressTracking: text })
         console.log(this.formInline.progressTrackingList)
@@ -1052,7 +1057,14 @@
       },
       progressTrackingOpenClick(e) {
         if (e.target.localName == 'img') {
-          this.$refs.viewImgRef.getData(e.target.currentSrc)
+          ImagePreview(
+            {
+              images: [
+                e.target.currentSrc
+              ],
+              closeable: true
+            })
+          // this.$refs.viewImgRef.getData(e.target.currentSrc)
         }
       }
     }
@@ -1308,6 +1320,7 @@
   .progressTrackingListClass:last-child {
     margin-bottom: 0;
   }
+
   ::v-deep .text-box-index-text-top img {
     max-width: 100% !important;
   }

jero-web/src/views/projectManagement/projectNonConformance/moudles/detilModel.vue

@@ -167,9 +167,27 @@
                         :title="$t('progresstracking')">{{$t('progresstracking')}}</span>
                 </div>
                 <div class="itemModel">
-                  <div class="text-box" v-for="(item,index) in formInline.progressTrackingList" :key="index">
+                  <div v-for="(item,index) in formInline.progressTrackingList" :key="index">
+                    <div class="text-box" v-if="!item.isDescription">
                       <div class="text-box-index-text-top" @click="progressTrackingOpenClick($event)"
                            v-html="item.progressTracking"></div>
+                      <div class="text-box-index-text-right">
+                        <div class="text-box-index-text-right-text" @click="openClick(item)">
+                          <img src="../../../../assets/progressExit.png" alt="">
+                          <span style="margin-left: 2px">{{$t('putAway')}}</span>
+                        </div>
+                      </div>
+                    </div>
+                    <div class="text-box-index" v-if="item.isDescription">
+                      <div class="text-box-index-text" @click="progressTrackingOpenClick($event)"
+                           v-html="item.progressTracking"></div>
+                      <div class="text-box-index-text-right">
+                        <div class="text-box-index-text-right-text" @click="openClick(item)">
+                          <img src="../../../../assets/medieProgress.png" alt="">
+                          <span style="margin-left: 2px">{{$t('open')}}</span>
+                        </div>
+                      </div>
+                    </div>
                   </div>
                 </div>
               </div>
@@ -224,6 +242,7 @@
   import moment from 'moment'
   import viewImg from './viewImg'
   import { mapGetters } from 'vuex'
+  import { ImagePreview } from 'vant'
 
   export default {
     name: 'fillAdd',
@@ -280,7 +299,7 @@
         },
         formInline: {
           fileLinkList: [{}],
-          progressTrackingList: [{}],
+          progressTrackingList: [],
           approvalEvidenceLinkList: [{}],
           dutyTerritory: undefined,
           projectId: undefined,
@@ -362,6 +381,14 @@
         } else if (row.projectType == 'numberPlatform' || row.projectType == 'carPlatform') {
           this.getPlatform(row.projectType)
         }
+        if (this.formInline.progressTrackingList && this.formInline.progressTrackingList.length > 0) {
+          this.formInline.progressTrackingList.forEach(res => {
+            res.isDescription = true
+          })
+
+        } else {
+          this.formInline.progressTrackingList = []
+        }
         // if (this.formInline.dutyTerritory != null) {
         //   this.formInline.dutyTerritory = this.formInline.dutyTerritory.split(',')
         // } else {
@@ -377,7 +404,6 @@
           }
         })
         this.formInline = { ...this.formInline }
-        console.log(this.formInline)
         this.visible = true
         this.disabled = true
         this.$nextTick(() => {
@@ -401,8 +427,19 @@
       },
       progressTrackingOpenClick(e) {
         if (e.target.localName == 'img') {
-          this.$refs.viewImgRef.getData(e.target.currentSrc)
+          ImagePreview(
+            {
+              images: [
+                e.target.currentSrc
+              ],
+              closeable: true
+            })
+          // this.$refs.viewImgRef.getData(e.target.currentSrc)
         }
+      },
+      openClick(item) {
+        item.isDescription = !item.isDescription
+        this.formInline = { ...this.formInline }
       }
     }
   }
@@ -512,14 +549,6 @@
     word-break: break-word;
   }
 
-  .text-box {
-    width: 100%;
-    height: 200px;
-    display: inline-block;
-    border: 1px solid #ccc;
-    padding: 0 15px;
-    margin-bottom: 10px;
-  }
 
   .itemModel-text {
     box-sizing: border-box;
@@ -538,12 +567,13 @@
 
   .text-box {
     width: 100%;
-    height: 200px;
+    height: auto;
     display: inline-block;
     border: 1px solid #ccc;
     padding: 0;
     border-radius: 4px;
     position: relative;
+    margin-bottom: 10px;
   }
 
   ::v-deep .text-box-index-text-top p {
@@ -590,7 +620,7 @@
   .itemModel-text-box {
     width: 100%;
     white-space: pre-wrap;
-    height: 200px;
+    height: auto;
     display: inline-block;
     border: 1px solid #ccc;
     border-radius: 4px;
@@ -605,4 +635,46 @@
   ::v-deep .text-box-index-text-top img {
     max-width: 100% !important;
   }
+
+  .text-box-index-text-right {
+    position: absolute;
+    display: flex;
+    align-items: center;
+    top: 13px;
+    right: 2px;
+  }
+
+  .text-box-index-text-right-text {
+    font-size: 14px;
+    font-family: PingFang SC, PingFang SC;
+    font-weight: 400;
+    color: #01A0AC;
+    display: flex;
+    align-items: center;
+    margin-right: 10px;
+    cursor: pointer;
+  }
+
+  .text-box-index {
+    width: 100%;
+    height: 46px;
+    display: inline-block;
+    padding: 0 15px;
+    border: 1px solid #ccc;
+    border-radius: 4px 4px 0px 0px;
+    white-space: pre-wrap;
+    overflow: hidden;
+    position: relative;
+    margin-bottom: 6px;
+  }
+
+  .text-box-index-text {
+    width: 100%;
+    overflow: hidden;
+    white-space: pre-wrap;
+  }
+
+  ::v-deep .text-box-index-text .text-class {
+    background: #fff !important;
+  }
 </style>