From a2299a6d4a6f99e9c11132138f5d3e9ec68f03ea Mon Sep 17 00:00:00 2001
From: jiangping <jp@doumee.com>
Date: 星期五, 06 六月 2025 19:19:34 +0800
Subject: [PATCH] 开发更新

---
 admin/src/views/workorder/components/detail.vue |  322 +++++++++++++++++++++++++++++++++++++++--------------
 1 files changed, 236 insertions(+), 86 deletions(-)

diff --git a/admin/src/views/workorder/components/detail.vue b/admin/src/views/workorder/components/detail.vue
index 7246837..039bad0 100644
--- a/admin/src/views/workorder/components/detail.vue
+++ b/admin/src/views/workorder/components/detail.vue
@@ -1,63 +1,102 @@
 <template>
-  <GlobalWindow width="820px" title="宸ュ崟璇︽儏" :visible.sync="visible" :confirm-working="isWorking" @close="close"
-    @confirm="confirm">
+  <GlobalWindow width="100%" title="宸ュ崟璇︽儏" :withFooter="withFooter" :visible.sync="visible" :confirm-working="isWorking"
+    @confirm="confirm" @close="closeView">
     <div class="main">
       <div class="title">
-        <span>宸ュ崟璇︽儏</span>
-        <div>
-          <div class="status primaryColor" v-if="info.dealStatus == 0 || info.dealStatus == null">寰呮寚娲�</div>
-          <div class="status" v-if="info.dealStatus == 1">宸叉寚娲�</div>
-          <div class="status gray" v-if="info.dealStatus == 2">宸插鐞�</div>
+        <div class="title_left">
+          <span>宸ュ崟璇︽儏</span>
+          <div>
+            <div class="status primaryColor" v-if="info.dealStatus == 0 || info.dealStatus == null">寰呮寚娲�</div>
+            <div class="status green" v-if="info.dealStatus == 1">宸叉寚娲�</div>
+            <div class="status gray" v-if="info.dealStatus == 2">宸插鐞�</div>
+          </div>
         </div>
+        <el-button v-if="info.origin === 1 && isShow" @click="openWT">鏌ョ湅闂涓婃姤</el-button>
       </div>
-      <div class="list">
-        <div class="item">
-          <div class="la">浣嶇疆绫诲瀷</div>
-          <div class="val">{{ info.areaType == 0 ? '瀹ゅ唴缁翠慨' : '鍏叡缁翠慨' }}</div>
+      <div class="main_content">
+        <div class="list">
+          <div class="item">
+            <div class="la">浣嶇疆绫诲瀷</div>
+            <div class="val">{{ info.areaType == 0 ? '瀹ゅ唴缁翠慨' : '鍏叡缁翠慨' }}</div>
+          </div>
+          <div class="item">
+            <div class="la">瀵瑰簲浣嶇疆</div>
+            <div class="val">{{ info.projectName }}/{{ info.buildingName }} / {{ info.roomNum || info.floorName }}</div>
+          </div>
+          <div class="item">
+            <div class="la">宸ュ崟鍒嗙被</div>
+            <div class="val">{{ info.categoryName }}</div>
+          </div>
+          <div class="item">
+            <div class="la">鏉ユ簮</div>
+            <div class="val" v-if="info.origin === 0">鑷缓</div>
+            <div class="val" v-if="info.origin === 1">闂杞伐鍗�</div>
+          </div>
+          <div class="item">
+            <div class="la">涓婃姤浜�</div>
+            <div class="val">{{ info.creatorName }}{{ info.creatorCompany ? "-" + info.creatorCompany : '' }}</div>
+          </div>
+          <div class="item">
+            <div class="la">涓婃姤浜虹數璇�</div>
+            <div class="val">{{ info.creatorPhone || info.creatorMobile }}</div>
+          </div>
+          <div class="item">
+            <div class="la">涓婃姤鏃堕棿</div>
+            <div class="val">{{ info.createDate }}</div>
+          </div>
+          <div class="item max" v-if="info.areaType == 0">
+            <div class="la">涓婇棬鏃堕棿</div>
+            <div class="val">{{ info.getDate }}</div>
+          </div>
+          <div class="item max">
+            <div class="la">闂鎻忚堪</div>
+            <div class="val">{{ info.content }}</div>
+          </div>
+          <div class="item max">
+            <div class="la">闂鍥剧墖</div>
+            <div class="value" v-if="info.fileList == null || !info.fileList.length">鏃�</div>
+            <div class="value" v-if="info.fileList != null && info.fileList.length">
+              <div v-for="item in info.fileList" :key="item.id" style="display: inline;margin-right: 20px">
+                <!-- <video v-if="item.fileurlFull && item.fileurlFull.endsWith('.mp4')" ref="videoRef" controls
+                  preload="auto" style="width: 80px;height: 80px;object-fit: contain;" :src="item.fileurlFull" /> -->
+                <el-image v-if="item.type == 0" style="width:80px; height: 80px" :src="item.fileurlFull"
+                  :preview-src-list="[item.fileurlFull]">
+                </el-image>
+              </div>
+            </div>
+          </div>
+          <div v-if="info.fileList && info.fileList.length > 0 && info.fileList.filter(i => i.type == 1).length > 0"
+            class="item max">
+            <div class="la">闂瑙嗛</div>
+            <div class="value">
+              <div v-for="item in info.fileList" :key="item.id" style="display: inline;margin-right: 20px">
+                <video v-if="item.type == 1" ref="videoRef" controls preload="auto"
+                  style="width: 240px;height: 160px;object-fit: contain;" :src="item.fileurlFull" />
+              </div>
+            </div>
+          </div>
         </div>
-        <div class="item">
-          <div class="la">瀵瑰簲浣嶇疆</div>
-          <div class="val">{{ info.buildingName }} / {{ info.roomNum || info.floorName }}</div>
-        </div>
-        <div class="item">
-          <div class="la">宸ュ崟绫诲埆</div>
-          <div class="val">{{ info.categoryName }}</div>
-        </div>
-        <div class="item">
-          <div class="la">涓婃姤浜�</div>
-          <div class="val">{{ info.creatorName }}</div>
-        </div>
-        <div class="item">
-          <div class="la">涓婃姤浜虹數璇�</div>
-          <div class="val">{{ info.creatorPhone }}</div>
-        </div>
-        <div class="item">
-          <div class="la">涓婃姤鏃堕棿</div>
-          <div class="val">{{ info.createDate }}</div>
-        </div>
-        <div class="item max">
-          <div class="la">涓婇棬鏃堕棿</div>
-          <div class="val">{{ info.getDate }}</div>
-        </div>
-        <div class="item max">
-          <div class="la">闂鎻忚堪</div>
-          <div class="val">{{ info.content }}</div>
-        </div>
-        <div class="item max">
-          <div class="la">闂鍥剧墖</div>
-          <div class="value" v-if="info.fileList == null || !info.fileList.length">鏃�</div>
-          <div class="value" v-if="info.fileList != null && info.fileList.length">
-            <div v-for="item in info.fileList" :key="item.id" style="display: inline;margin-right: 20px">
-              <video v-if="item.fileurlFull && item.fileurlFull.endsWith('.mp4')" ref="videoRef" controls preload="auto"
-                style="width: 80px;height: 80px;object-fit: contain;" :src="item.fileurlFull" />
-              <el-image v-else-if="item.fileurlFull" style="width:80px; height: 80px" :src="item.fileurlFull"
-                :preview-src-list="[item.fileurlFull]">
-              </el-image>
+        <div class="side">
+          <div class="title">宸ュ崟娴佽浆璁板綍</div>
+          <div class="flow_list">
+            <div class="item" v-for="item, i in info.logList">
+              <div class="icon">
+                <div class="dian"></div>
+                <div v-if="i < info.logList.length - 1" class="line"></div>
+              </div>
+              <div class="content">
+                <div class="name">{{ item.title }}</div>
+                <div class="time">鎿嶄綔鏃堕棿锛歿{ item.createDate }}</div>
+                <div class="creator">鎿嶄綔浜猴細{{ item.param1 }}</div>
+                <div class="creator" v-if="item.param2">鎸囨淳缁欙細{{ item.param2 }}</div>
+              </div>
             </div>
           </div>
         </div>
       </div>
-      <div class="title">宸ュ崟澶勭悊</div>
+      <div class="title"
+        v-if="info.dealStatus == 2 || info.dealStatus == 0 || (info.dealStatus == 1 && info.dealUserId === userInfo.id)">
+        {{ info.dealStatus == 0 || info.dealStatus == 1 ? '宸ュ崟澶勭悊' : '澶勭悊缁撴灉' }}</div>
       <el-form :model="param" ref="form" :rules="rules">
         <template v-if="info.dealStatus == 0 || info.dealStatus == null">
           <el-form-item label="澶勭悊鏂瑰紡" prop="dealType">
@@ -80,12 +119,12 @@
             <el-date-picker type="datetime" class="w400" v-model="param.getDate" format="yyyy-MM-dd HH:mm"
               value-format="yyyy-MM-dd HH:mm:ss" placeholder="璇烽�夋嫨"></el-date-picker>
           </el-form-item>
-          <el-form-item label="鍥炲鍐呭" prop="dealInfo">
+          <el-form-item label="澶勭悊璇存槑" prop="dealInfo">
             <el-input type="textarea" class="w400" :rows="4" v-model="param.dealInfo" placeholder="璇峰~鍐欒鏄�"></el-input>
           </el-form-item>
           <el-form-item label="鐜板満鍥剧墖">
             <div class="file_list">
-              <el-upload class="avatar-uploader" :data="uploadData" multiple :limit="6" :auto-upload="true" :action="uploadImgUrl"
+              <el-upload class="avatar-uploader" :data="uploadData" :auto-upload="true" :action="uploadImgUrl"
                 :show-file-list="false" :on-success="uploadAvatarSuccess" :on-error="uploadError"
                 :before-upload="beforeUpload">
                 <div class="upload_wrap">
@@ -105,14 +144,18 @@
         <template v-if="info.dealStatus == 2">
           <div class="list">
             <div class="item item2">
-              <div class="la">澶勭悊鏃堕棿锛�</div>
-              <div class="val">{{ info.getDate }}</div>
+              <div class="la">{{ info.dispatchUserId ? '澶勭悊浜�' : '鍥炲浜�' }}锛�</div>
+              <div class="val">{{ info.dealUserName }}{{ info.dealUserCompany ? '-' + info.dealUserCompany : '' }}</div>
             </div>
             <div class="item item2">
-              <div class="la">澶勭悊澶囨敞锛�</div>
+              <div class="la">{{ info.dispatchUserId ? '澶勭悊鏃堕棿' : '鍥炲鏃堕棿' }}锛�</div>
+              <div class="val">{{ info.dealDate || info.getDate }}</div>
+            </div>
+            <div class="item item2">
+              <div class="la">{{ info.dispatchUserId ? '澶勭悊璇存槑' : '鍥炲鍐呭' }}锛�</div>
               <div class="val">{{ info.dealInfo }}</div>
             </div>
-            <div class="item item2">
+            <div v-if="info.dealFileList != null && info.dealFileList.length" class="item item2">
               <div class="la">鐜板満鐓х墖锛�</div>
               <div class="value" v-if="info.dealFileList == null || !info.dealFileList.length">鏃�</div>
               <div class="value" v-if="info.dealFileList != null && info.dealFileList.length">
@@ -128,6 +171,8 @@
           </div>
         </template>
       </el-form>
+      <!--  闂涓婃姤璇︽儏  -->
+      <ProblemReportingDetails ref="problem_Reporting_Details" @close="closeDetails" />
     </div>
   </GlobalWindow>
 </template>
@@ -135,18 +180,24 @@
 <script>
 import GlobalWindow from '@/components/common/GlobalWindow'
 import BaseOpera from '@/components/base/BaseOpera'
+// import ProblemReportingDetails from './problemReportingDetails'
+// import ProblemReportingDetails from '@/views/workorder/components/problemReportingDetails'
 import { detailById, dispatchOrder, dealOrder } from '@/api/workorder/ywWorkorder'
+import { getByWorkorderId } from '@/api/ywProblem'
 import { getUserList } from '@/api/system/user'
 import { Message, Loading } from 'element-ui'
+import { mapState } from 'vuex'
+import dayjs from 'dayjs'
 export default {
+  name: 'detail',
   components: {
-    GlobalWindow
+    GlobalWindow,
+    ProblemReportingDetails: () => import('./problemReportingDetails')
   },
   extends: BaseOpera,
   data() {
     return {
       id: '',
-      visible: false,
       param: {
         dealType: 0
       },
@@ -160,27 +211,59 @@
       uploadImgUrl: process.env.VUE_APP_API_PREFIX + '/visitsAdmin/cloudService/public/uploadBatch',
       dealFileList: [],
       uploadData: {
-        folder: 'HIDDEN_DANGER_FILE'
+        folder: 'YW_WORKORDER_FILE'
       },
+      isShow: true,
+      test: false
     }
   },
   computed: {
     userInfo() {
       return this.$store.state.userInfo
+    },
+    withFooter() {
+      if (this.info) {
+        return this.info.dealStatus === 0 || (this.info.dealStatus === 1 && (this.userInfo.id === this.info.dealUserId));
+      } else {
+        return false;
+      }
     }
   },
   created() {
     this.getStaff()
   },
   methods: {
+    closeDetails() {
+      console.log('1')
+      this.test = false
+    },
+    closeView() {
+      this.$emit('close')
+      this.visible = false
+    },
+    open (title, target, show) {
+      this.title = title
+      this.isShow = show
+      this.id = target.workorderId
+      this.getDetail()
+    },
+    openWT() {
+      getByWorkorderId(this.id)
+        .then(res => {
+          this.test = true
+          this.$nextTick(() => {
+            this.$refs.problem_Reporting_Details.open('闂涓婃姤璇︽儏', res, false)
+          })
+        })
+    },
     confirm() {
       this.$refs['form'].validate((valid) => {
         if (valid) {
           const { param, id, dealFileList, info } = this
           let fn = null
-          if(info.dealStatus == 0 || info.dealStatus == null){
+          if (info.dealStatus == 0 || info.dealStatus == null) {
             fn = param.dealType == 0 ? dispatchOrder : dealOrder
-          }else{
+          } else {
             fn = dealOrder
           }
           fn({
@@ -199,6 +282,10 @@
       const { id } = this
       detailById(id).then(res => {
         this.info = res
+        if (this.info.dealStatus == 1) {
+          this.$set(this.param, 'getDate', dayjs().format('YYYY-MM-DD HH:mm:ss'))
+        }
+        this.visible = true
       })
     },
     getStaff() {
@@ -269,32 +356,41 @@
   padding-top: 20px;
 
   .title {
-    font-weight: 500;
-    font-size: 18px;
-    color: $primary-color;
+    
     margin-bottom: 10px;
     display: flex;
     align-items: center;
-
-    .status {
-      padding: 0 6px;
-      height: 22px;
-      line-height: 22px;
-      border-radius: 2px;
-      border: 1px solid #00BA92;
-      color: #00BA92;
-      font-weight: 400;
-      font-size: 12px;
-      margin-left: 10px;
-    }
-
-    .primaryColor {
-      border: 1px solid $primary-color;
-    }
-
-    .gray {
-      color: gray;
-      border: 1px solid gray;
+    justify-content: space-between;
+    .title_left {
+      display: flex;
+      align-items: center;
+      font-weight: 500;
+      font-size: 18px;
+      color: $primary-color;
+      .status {
+        padding: 0 12px;
+        height: 24px;
+        line-height: 24px;
+        border-radius: 2px;
+        border: 1px solid #00BA92;
+        color: #00BA92;
+        font-weight: 400;
+        font-size: 12px;
+        margin-left: 10px;
+      }
+      .primaryColor {
+        border: 1px solid rgba(63, 126, 239, .2);
+        background-color: rgba(63, 126, 239, .2);
+      }
+      .green {
+        background-color: rgba(83, 183, 148, .2);
+        border: 1px solid rgba(83, 183, 148, .2);
+      }
+      .gray {
+        color: #333333;
+        background-color: rgba(128, 128, 128, .2);
+        border: 1px solid rgba(128, 128, 128, .2);
+      }
     }
   }
 
@@ -308,11 +404,11 @@
 
     .item {
       width: 33.3%;
-      margin-bottom: 12px;
+      margin-bottom: 14px;
 
       .la {
         color: #7f7f7f;
-        margin-top: 2px;
+        margin-bottom: 6px;
       }
     }
 
@@ -320,12 +416,66 @@
       width: 100%;
       display: flex;
       align-items: center;
+
+      .la {
+        margin-bottom: 0;
+        width: 72px;
+      }
     }
 
     .max {
       width: 100%;
     }
   }
+
+  .main_content {
+    display: flex;
+
+    .side {
+      width: 370px;
+
+      .title {
+        font-size: 14px;
+      }
+
+      .flow_list {
+        .item {
+          display: flex;
+
+          .icon {
+            width: 28px;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+
+            .dian {
+              width: 12px;
+              height: 12px;
+              border-radius: 50%;
+              background-color: #e89e42;
+            }
+
+            .line {
+              width: 1px;
+              height: 100%;
+              background-color: #e89e42;
+            }
+          }
+
+          .content {
+            font-size: 12px;
+            color: #999999;
+            padding-bottom: 12px;
+
+            .name {
+              font-size: 13px;
+              color: #333333;
+            }
+          }
+        }
+      }
+    }
+  }
 }
 
 .file_list {

--
Gitblit v1.9.3