|
@@ -38,33 +38,50 @@
|
|
|
<template v-for="(item, index) in leftItem">
|
|
|
<div class="steps" :key="index">
|
|
|
<div class="steps-left">
|
|
|
- <img v-if="!!item.id" src="@assets/img/point_yiwancheng@2x.png" alt />
|
|
|
- <img v-else src="@assets/img/point_weiwancheng@2x.png" alt />
|
|
|
- <div class="steps-left-line" v-if="index !== leftItem.length - 1"></div>
|
|
|
+ <img v-if="!!leftItem[1].id" src="@assets/img/point_yiwancheng@2x.png" alt />
|
|
|
+ <img
|
|
|
+ v-else-if="!leftItem[1].id && index !== leftItem.length - 1"
|
|
|
+ src="@assets/img/point_weiwancheng@2x.png"
|
|
|
+ alt
|
|
|
+ />
|
|
|
+ <div class="steps-left-line" v-if="index !== leftItem.length - 1 && !!leftItem[leftItem.length - 2].id"></div>
|
|
|
+ <div class="steps-left-line" v-else-if="index !== leftItem.length - 2"></div>
|
|
|
</div>
|
|
|
<div class="steps-right">
|
|
|
- <div class="steps-right-title">
|
|
|
- <span v-if="index == 0">{{ !!item.id ? '开始任务 ' : '待执行' }}</span>
|
|
|
- <span v-else>{{ item.pointName }}</span>
|
|
|
- <span class="status" v-if="index !== 0" :class="!!item.id ? '' : 'grad'">{{
|
|
|
- !!item.id ? '已完成' : '未完成'
|
|
|
- }}</span>
|
|
|
+ <!-- 待开始 开始 -->
|
|
|
+ <div class="steps-right-title" v-if="index == 0">
|
|
|
+ <span>{{ !!leftItem[1].id ? '开始任务 ' : '待执行' }}</span>
|
|
|
</div>
|
|
|
- <div class="steps-right-content">{{ item.checkTime }}</div>
|
|
|
- <div class="steps-right-content">
|
|
|
- <span>巡更结果:</span>
|
|
|
- <span>{{ item.result || '-' }}</span>
|
|
|
+ <!-- 点位状态 -->
|
|
|
+ <div class="steps-right-title" v-else-if="index !== 0 && index !== leftItem.length - 1">
|
|
|
+ <span>{{ item.pointName }}</span>
|
|
|
+ <span class="status" :class="!!item.id ? '' : 'grad'">{{ !!item.id ? '已完成' : '未完成' }}</span>
|
|
|
</div>
|
|
|
- <div class="steps-right-content">
|
|
|
- <span>图片/视频:</span>
|
|
|
- <template v-if="!!item.picturePath">
|
|
|
- <div class="imgVdio" v-for="items in item.picturePath.split(',')" :key="items">
|
|
|
- <video v-if="typeVideo(items)" :src="items" @click="lookVideos(items)"></video>
|
|
|
- <el-image class="imgs" v-else :src="items" :preview-src-list="[items]">
|
|
|
- <div slot="error" class="image-slot">--</div>
|
|
|
- </el-image>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
+ <div class="steps-right-title" v-else>
|
|
|
+ <span>{{ !!leftItem[leftItem.length - 2].id ? '结束任务 ' : '' }}</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="steps-right-content" v-if="index == 0">{{ leftItem[1].startTime }}</div>
|
|
|
+ <template v-else-if="index !== 0 && index !== leftItem.length - 1">
|
|
|
+ <div class="steps-right-content">{{ item.checkTime }}</div>
|
|
|
+ <div class="steps-right-content">
|
|
|
+ <span>巡更结果:</span>
|
|
|
+ <span>{{ item.result || '-' }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="steps-right-content">
|
|
|
+ <span>图片/视频:</span>
|
|
|
+ <template v-if="!!item.picturePath">
|
|
|
+ <div class="imgVdio" v-for="items in item.picturePath.split(',')" :key="items">
|
|
|
+ <video v-if="typeVideo(items)" :src="items" @click="lookVideos(items)"></video>
|
|
|
+ <el-image class="imgs" v-else :src="items" :preview-src-list="[items]">
|
|
|
+ <div slot="error" class="image-slot">--</div>
|
|
|
+ </el-image>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <div class="steps-right-content" v-else>
|
|
|
+ {{ leftItem[1].endTime }}
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -127,7 +144,18 @@ export default {
|
|
|
result: null
|
|
|
}
|
|
|
],
|
|
|
- ...data
|
|
|
+ ...data,
|
|
|
+ [
|
|
|
+ {
|
|
|
+ checkTime: null,
|
|
|
+ id: null,
|
|
|
+ picturePath: null,
|
|
|
+ pointId: null,
|
|
|
+ pointStatus: null,
|
|
|
+ recordId: null,
|
|
|
+ result: null
|
|
|
+ }
|
|
|
+ ]
|
|
|
];
|
|
|
});
|
|
|
},
|
|
@@ -237,10 +265,16 @@ export default {
|
|
|
.steps-left-line {
|
|
|
width: 2px;
|
|
|
height: calc(100% - 40px);
|
|
|
+ min-height: 20px;
|
|
|
margin: 10px auto;
|
|
|
background-color: $mainBgColor;
|
|
|
}
|
|
|
}
|
|
|
+ &:last-child {
|
|
|
+ .steps-left-line {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ }
|
|
|
.steps-right {
|
|
|
width: calc(100% - 15px);
|
|
|
line-height: 30px;
|