吉安感知网项目-前端
chenyao
3 days ago 35fb4a40571d69b85caede7348101d71789b5fb3
applications/task-work-order/src/views/orderView/orderManage/eventManage/ViewDiaLog.vue
@@ -72,12 +72,17 @@
            </div>
            <div class="img_flow">
               <div class="imgurl">
                  <el-image
                  <el-image v-if="eventInfo.attachmentType === 1"
                     :src="eventInfo.eventImageUrl"
                     :preview-src-list="[eventInfo.eventImageUrl]"
                     fit="cover"
                     preview-teleported
                  />
                  <div class="video-btn" v-if="eventInfo.attachmentType === 3" @click="videoClick(eventInfo)">
                     <el-icon :size="30" color="#fff">
                        <VideoPlay />
                     </el-icon>
                  </div>
               </div>
               <div class="flow">
                  <div v-if="disposeRecords.length === 0">
@@ -86,7 +91,7 @@
                  <div v-else class="flow-card" v-for="item in disposeRecords" :key="item.id">
                     <div class="flow-row1">
                        <span class="flow-name">{{ item.disposeUserName }}</span>
                        <span class="flow-status">{{ item.disposeStatusName }}</span>
                        <span class="flow-status card-status" :class="statusClass(item.disposeStatus)">{{ item.disposeStatusName }}</span>
                     </div>
                     <div class="flow-row2">{{ item.disposeContent }}</div>
                     <div class="flow-row3" v-if="item.attachUrl?.length">
@@ -114,6 +119,7 @@
         </div>
      </div>
   </el-dialog>
   <VideoPlayDialog ref="videoPlayDialogRef" v-if="VideoShow" v-model="VideoShow" :playUrl="eventInfo.eventImageUrl" />
</template>
<script setup>
@@ -121,11 +127,15 @@
import { getDetailFull } from './eventManageApi'
import OrderStepBar from './OrderStepBar.vue'
import { ref } from 'vue'
import { VideoPlay } from '@element-plus/icons-vue'
import VideoPlayDialog from '@/components/VideoPlayDialog.vue'
const visible = defineModel()
const eventInfo = ref({})
const disposeRecords = ref([])
const statusFlows = ref([])
const VideoShow = ref(false)
const videoPlayDialogRef = ref(null)
// 获取状态文本
const getStatusLabel = status => {
@@ -137,6 +147,14 @@
      4: '已完成',
   }
   return map[status] || '未知'
}
// 状态样式类名
const statusClass = status => {
   if (status === 1) return 'status-processing'
   if (status === 3) return 'status-handled'
   if (status === 4) return 'status-completed'
   return ''
}
// 兼容事件记录接口中不同版本的字段名称
@@ -152,9 +170,15 @@
   }
}
function videoClick(eventInfo) {
   // currentVideo.value = eventInfo
   VideoShow.value = true
}
// 打开弹框
async function open({ row } = {}) {
   if (!row?.id) return
   console.log(row, '9098')
   const res = await getDetailFull({ id: row.id })
   const detail = res?.data?.data || {}
   eventInfo.value = detail.eventInfo || {}
@@ -216,6 +240,44 @@
               width: 100%;
            }
         }
         .video-btn {
      width: 100%;
      height:100%;
      position: relative;
      overflow: hidden;
      border-radius: 4px;
      background: linear-gradient(135deg, rgba(76, 52, 255, 0.14), rgba(76, 52, 255, 0) 48%),
         linear-gradient(180deg, #f4f5ff 0%, #e9ecff 100%);
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.7);
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      &::before {
         content: '';
         position: absolute;
         inset: 0;
         background-image: linear-gradient(
            90deg,
            rgba(76, 52, 255, 0.05) 0,
            rgba(76, 52, 255, 0.05) 1px,
            transparent 1px,
            transparent 12px
         );
         opacity: 0.42;
      }
      .el-icon {
         position: relative;
         z-index: 1;
         width: 42px;
         height: 42px;
         border-radius: 50%;
         background: rgba(76, 52, 255, 0.72);
         box-shadow: 0 4px 12px rgba(76, 52, 255, 0.2);
      }
   }
         .flow {
            margin-left: 10px;
            flex: 1;
@@ -265,6 +327,25 @@
                  font-size: 12px;
                  color: #999;
               }
               .card-status {
                  font-family: Source Han Sans CN, Source Han Sans CN;
                  font-weight: 400;
                  font-size: 14px;
                  padding: 2px 6px;
                  border-radius: 4px;
                  color: #ffffff;
                  background: #999;
                  &.status-processing {
                     background: #1d6fe9;
                  }
                  &.status-handled {
                     background: #e6a23c;
                  }
                  &.status-completed {
                     background: #00b578;
                  }
               }
            }
         }
      }
@@ -291,6 +372,8 @@
   .processBox {
      display: flex;
      flex-direction: column;
      height: 650px;
      overflow: auto;
      .process {
         height: 100%;