jiangping
2024-11-27 bc87b51e20a0adf0badf2033ede93cafeb5fc147
admin/src/views/workorder/components/detail.vue
@@ -1,5 +1,5 @@
<template>
  <GlobalWindow width="820px" title="工单详情" :visible.sync="visible" :confirm-working="isWorking" @close="close"
  <GlobalWindow width="900px" title="工单详情" :visible.sync="visible" :confirm-working="isWorking" @close="close"
    @confirm="confirm">
    <div class="main">
      <div class="title">
@@ -10,50 +10,68 @@
          <div class="status gray" v-if="info.dealStatus == 2">已处理</div>
        </div>
      </div>
      <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.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="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.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>
            </div>
          </div>
        </div>
        <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>
            </div>
          </div>
        </div>
      </div>
@@ -85,8 +103,8 @@
          </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"
                :show-file-list="false" :on-success="uploadAvatarSuccess" :on-error="uploadError"
              <el-upload class="avatar-uploader" :data="uploadData" multiple :limit="6" :auto-upload="true"
                :action="uploadImgUrl" :show-file-list="false" :on-success="uploadAvatarSuccess" :on-error="uploadError"
                :before-upload="beforeUpload">
                <div class="upload_wrap">
                  <i class="el-icon-plus avatar-uploader-icon"></i>
@@ -178,9 +196,9 @@
        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({
@@ -326,6 +344,46 @@
      width: 100%;
    }
  }
  .main_content{
    display: flex;
    .side{
      width: 240px;
      .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 {