合并

VUECODE/smart-property-manage/src/views/ticket/details.vue

       <el-form-item style="padding-left:1%;" label="工单号:">
         <span>{{listQuery.id}}</span>
       </el-form-item>
-      <el-form-item style='padding-left:230px' label="工单类型:">
+      <el-form-item style='margin-left:330px' label="工单类型:">
         <span v-if="listQuery.type==='1'">{{'投诉'}}</span>
         <span v-if="listQuery.type==='2'">报修
           <span v-if="listQuery.repairType==='0'">{{'(公共区域)'}}</span>
         </span>
         <span v-if="listQuery.type==='3'">{{'联系物业'}}</span>
       </el-form-item>
-      <el-form-item style='padding-left:230px' label="发起时间:">
+      <el-form-item style='margin-left:330px' label="发起时间:">
         <span>{{ formatDate(listQuery.createDate) }}</span>
            <!-- <span>{{ listQuery.createDate }}</span> -->
       </el-form-item>
-      <el-form-item style='padding-left:230px' label="发起人:">
+      <el-form-item style='margin-left:330px' label="发起人:">
         <span>{{listQuery.createUserNmae}}</span>
       </el-form-item>
-      <el-form-item style='padding-left:200px' label="发起人联系方式:">
+      <el-form-item style='margin-left:300px' label="发起人联系方式:">
         <span>{{listQuery.loginName}}</span>
       </el-form-item>
       </div>
     </template>
     </div>
 
-        <hr width="100%"/>
+        <hr width="101%"/>
 <div class="stepComponent" >
     <div class="stepsTitle">
       <div style="float:left;width:2px;height:20px; background:#219AFF;"></div> 
         <span>&nbsp;&nbsp;沟通记录</span>
     </div>
     <!-- 一下状态是数据库的所有状态，如需要加状态，页面得加相同状态的div -->
-    <div class="approvalProcess" >
+    <div class="approvalProcess">
         <el-steps :active="7" finish-status="success" direction="vertical">
           <el-step :title="item.statusName+'_________'+formatDate(item.createDate)" v-for="item in approvalProcessProject">
             <template slot="description">
-             <div class="step-row">
+             <div class="step-row" >
                <tr v-if="item.status - 0 === 5"><td>评价：</td><td><el-rate
                 v-model="listQuery.score"
                 disabled
                 score-template="{value}">
               </el-rate></td></tr>
               <tr v-if="item.status - 0 === 5"><td>评语：</td><td>{{listQuery.comment}}</td></tr>
-               <!-- <div v-if="item.status - 0 === 5" style="float:left">评价<el-rate
-                v-model="value5"
-                disabled
-                show-score
-                text-color="#ff9900"
-                score-template="{value}">
-              </el-rate>
-              </div> -->
                <table width="100%" border="0" cellspacing="0" cellpadding="0" class="processing_content"  v-for="itemContent in item.statusContent" >
                          <tr> 
                            <td>                        
                             	<div class="processing_content_detail" style="float:left;width:70%">
-                                    <span>{{itemContent.userName}}:{{itemContent.content}}                                 
+                                    <span>{{itemContent.userName}}:{{itemContent.content}}                               
                                     <span style="color:#219AFF"></span>
                                     </span>
-                                    </div>
-                              <div class="processing_content_detail" style="float:right;"><span ><i class="el-icon-time"></i>{{formatDate(itemContent.createDate)}}</span> </div>
+                                    </div>                    
                             </td>
                           </tr>
                           <tr>
                             <td>
-                            	<div class="processing_content_detail" style="float:left;width:70%">
+                            	<div class="processing_content_detail" style="float:left;width:90%">
                                 <div style="float:left;width: 2px;height: 20px; background:#C7D4E9;margin-left:10px;margin-right:10px"></div> 
                                 <!-- <img :src="contentImgURL.imageUrl"  v-for="contentImgURL in itemContent.imgURL" preview preview-text="描述"  width="200" style="margin:5px;"> -->
-                                <img v-for="contentImgURL in itemContent.imgURL" :src="contentImgURL.imageUrl" preview width="100" height="100"  style="margin:5px;">                                                      
-                                </div>                           
+                                        <img v-for="contentImgURL in itemContent.imgURL" :src="contentImgURL.imageUrl" preview width="100" height="100"  style="margin:5px;">
+                                          <div><span ><i class="el-icon-time"></i>{{formatDate(itemContent.createDate)}}</span> </div>
+                                          <div> <hr style="height:1px;border:none;border-top:1px solid #FF8888;"  width="200%"/></div>                                          
+                                </div>                                                       
                             </td>
                           </tr>
-                </table>
-                
-               
+                </table>                       
            </div>
          </template>
            </el-step>
         </div>
         <div v-if="listQuery.status==='3'">
         <div>
-        <span>流程操作(压缩测试)</span>
+        <span>流程操作</span>
         </div>
         <br>
           <div>   
           <img :src="dialogImageUrl" width="100%" alt="">
           </el-dialog>
         </el-form-item>
-        <!-- <el-form-item label="图片附件">
-        <el-upload
-          :limit="8"
-          :on-preview="handlePictureCardPreviewIO"
-          :on-remove="handleRemoveIO"
-          :on-success="handleSuccessContentImgIO"
-          :file-list="listQuery.imgIO"
-          :show-file-list="Ass"
-          name="uploadFiles"
-          action="http://106.14.20.193:8086/property-api/uploadimage"
-          list-type="picture-card">
-          <i class="el-icon-plus"/>
-        </el-upload>
-        <el-dialog :visible.sync="dialogVisible">
-          <img :src="dialogImageUrlIO" width="100%" alt="">
-        </el-dialog>
-      </el-form-item> -->
         <el-button type="primary" @click="succeedClick">提交</el-button>
         </div>
         </div>
 export default {
   data() {
     return {
-      imgUploadUrl: 'http://106.14.20.193:8086/property-api/uploadimage',
       listQuery: {
         id: '',
         userName: '',
         const resDate=res.data
         this.listQuery=resDate
         this.approvalProcessProject = resDate.recordList
-        //  for(let i = 0;i<resDate.recordListzz;i++){
-        //      this.imgURL=resDate.recordList[i]
-        //  }
-      // console.log('this.imgURL',this.imgURL)
       }).catch(() => {
         console.log('error TicketEdit')
       })
     },
+    //对话的图片控件
     handlePictureCardPreview(file) { // 配图文件列表中已上传的文件时的钩子
       this.dialogImageUrl = file.url
       this.dialogVisible = true
     },
+    //对话的图片控件
     handleRemove(file, fileList) { // 配图移除时
       this.contentImgAA = []
       for (let i = 0; i < fileList.length; i++) {
       }
       console.log('file',file, fileList)
     },
+    //对话的图片控件
     handleSuccessContentImg(response, file, fileList) { // 配图上传成功时回调
       const resImg = response.data[0]
       console.log('resImg',resImg)
       this.contentImgAA.push(resImg)
     },
-    //流程
-    handlePictureCardPreviewIO(file) { // 流程
+    //流程的图片
+    handlePictureCardPreviewIO(file) {
       this.dialogImageUrlIO = file.url
       this.dialogVisible = true
     },
+     //流程的图片
     handleRemoveIO(file, fileList) { // 流程配图移除时
       this.contentImgIO = []
       for (let i = 0; i < fileList.length; i++) {
       }
       console.log('file',file, fileList)
     },
+    //流程的图片
     handleSuccessContentImgIO(response, file, fileList) { // 流程配图上传成功时回调
       const resImg = response.data[0]
       this.contentImgIO.push(resImg)
       }
       return new Blob([ia], { type: mimeString });
     },
-
+    // 时间处理
     formatDate(val) {
       var value = new Date(val)
       var year = value.getFullYear()
          loading.close()
          return
       }
-        //  console.log("contentImg",this.listQuery.contentImg)
-        console.log('this.listQuery.img',this.listQuery.img)
-        console.log('sss',this.listQuery.textContent)
-        this.listQuery.img=this.contentImgAA
-      this.$store.dispatch('AddRecordComment', this.listQuery,).then((res) => {
-          this.Ass=false
-          this.contentImgAA=[]
-          this.dataQuery()
-          this.Ass=true
-          loading.close()
+         this.listQuery.img=this.contentImgAA
+         this.$store.dispatch('AddRecordComment', this.listQuery,).then((res) => {
+         this.Ass=false
+         this.contentImgAA=[]
+         this.dataQuery()
+         this.Ass=true
+         loading.close()
       }).catch(() => {
         console.log('error addRecordComment')
       })
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })  
-        console.log('sss',this.listQuery.textContent)
         this.$store.dispatch('AddRecord', this.listQuery).then((res) => {
           this.dataQuery()
            loading.close()
            this.$message({
           message: '分配成功',
           type: 'success'
-        })
-      
+        })    
       }).catch(() => {
         console.log('error AddRecord')
       })
 </script>
 <style scoped>
   .stepComponent{
-  
       width: 100%-20px;
       padding: 10px 10px 10px 10px;
       margin: 10px 10px 10px 10px;
   .approvalProcess{
       color: #9EADC4;
       font-size: 14px;
-      /* width: 100%; */
+      width: 100%;
       margin-left:20px;
       margin-right:0px;
       margin-top:10px;
   }
-  .processing_content{
+  /* .processing_content{
     background-color: #D9E5F9;
-  }
+  } */
   .processing_content_detail{
      margin-left: 10px;
      margin-top: 3.5px;
      display:inline-block;
   }
   .step-row{
-     min-width:500px;
+     min-width:400px;
      margin-bottom:12px;
      margin-top:12px;
   }
   float:right;width:218px;
 }
 .textarea-inherit {
-        width: 90%;
+        width: 100%;
         overflow: auto;
         word-break: break-all; 
     }
     .select-inherit {
-        width: 90%;
+        width: 100%;
         
     }
+    .table-finally{
+    padding-right: 10%;
+    }
 </style>