|
@@ -10,7 +10,14 @@
|
|
|
<template v-if="item.slot">
|
|
|
<template v-if="item.slot === 'orderType'">
|
|
|
<span v-if="thisItem['orderType'] == 1">业主报修</span>
|
|
|
- <span v-else>内部报修</span>
|
|
|
+ <span v-else-if="thisItem['orderType'] == 2">内部报修</span>
|
|
|
+ <span v-else>--</span>
|
|
|
+ </template>
|
|
|
+ <template v-if="item.slot === 'repairFile' && !!thisItem['repairFile']">
|
|
|
+ <div class="imgVdio" v-for="item in thisItem['repairFile'].split(',')" :key="item">
|
|
|
+ <video v-if="typeVideo(item)" :src="item" @click="lookVideos(item)"></video>
|
|
|
+ <el-image class="imgs" v-else :src="item" :preview-src-list="[item]"></el-image>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
</template>
|
|
|
<template v-else>
|
|
@@ -30,11 +37,19 @@
|
|
|
<template v-if="item.slot">
|
|
|
<template v-if="item.slot === 'urgencyDegree'">
|
|
|
<span v-if="thisItem['urgencyDegree'] == 2" class="redText">紧急</span>
|
|
|
- <span v-else class="greenText">普通</span>
|
|
|
+ <span v-else-if="thisItem['urgencyDegree'] == 1">普通</span>
|
|
|
+ <span v-else>--</span>
|
|
|
</template>
|
|
|
<template v-if="item.slot === 'handleResult'">
|
|
|
<span v-if="thisItem['handleResult'] == 2" class="redText">无法处理</span>
|
|
|
- <span v-else class="greenText">成功处理</span>
|
|
|
+ <span v-else-if="thisItem['handleResult'] == 1" class="greenText">成功处理</span>
|
|
|
+ <span v-else>--</span>
|
|
|
+ </template>
|
|
|
+ <template v-if="item.slot === 'handleFile' && !!thisItem['handleFile']">
|
|
|
+ <div class="imgVdio" v-for="item in thisItem['handleFile'].split(',')" :key="item">
|
|
|
+ <video v-if="typeVideo(item)" :src="item" @click="lookVideos(item)"></video>
|
|
|
+ <el-image class="imgs" v-else :src="item" :preview-src-list="[item]"></el-image>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
</template>
|
|
|
<template v-else>
|
|
@@ -49,11 +64,22 @@
|
|
|
<div class="right">
|
|
|
<div class="list-item">
|
|
|
<div class="formContent-item_title">工单进度追踪</div>
|
|
|
- <div style="height:300px">
|
|
|
- <el-steps direction="vertical" :active="1">
|
|
|
- <el-step title="步骤 1" icon="el-icon-full-screen"></el-step>
|
|
|
- <el-step title="步骤 2" icon="el-icon-full-screen"></el-step>
|
|
|
- <el-step title="步骤 3" icon="el-icon-full-screen" description="这是一段很长很长很长的描述性文字"></el-step>
|
|
|
+ <div style="height: 300px">
|
|
|
+ <el-steps direction="vertical" :active="thisActive">
|
|
|
+ <el-step
|
|
|
+ :title="item.createDate"
|
|
|
+ icon="el-icon-full-screen"
|
|
|
+ v-for="item in thisItem['progressList']"
|
|
|
+ :key="item.id"
|
|
|
+ >
|
|
|
+ <div slot="description">
|
|
|
+ <div v-if="item.type == 1">报修人:{{ thisItem['repairName'] }}</div>
|
|
|
+ <template v-else>
|
|
|
+ <div>处理人:{{ item.name }}</div>
|
|
|
+ <div v-if="!!item.operation">操作:{{ item.operation }}</div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </el-step>
|
|
|
</el-steps>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -99,6 +125,7 @@ export default {
|
|
|
{
|
|
|
label: '图片/视频:',
|
|
|
prop: 'repairFile',
|
|
|
+ slot: 'repairFile',
|
|
|
span: 24
|
|
|
}
|
|
|
],
|
|
@@ -129,10 +156,12 @@ export default {
|
|
|
{
|
|
|
label: '图片/视频:',
|
|
|
prop: 'handleFile',
|
|
|
+ slot: 'handleFile',
|
|
|
span: 24
|
|
|
}
|
|
|
],
|
|
|
- thisItem: {}
|
|
|
+ thisItem: {},
|
|
|
+ thisActive: 0
|
|
|
};
|
|
|
},
|
|
|
|
|
@@ -143,9 +172,34 @@ export default {
|
|
|
.then(({ data, msg, status }) => {
|
|
|
if (status == 0) {
|
|
|
this.thisItem = data;
|
|
|
+ this.thisActive = !!data.progressList.length ? Number(data.progressList.length) - 1 : 0;
|
|
|
}
|
|
|
})
|
|
|
.catch(() => {});
|
|
|
+ },
|
|
|
+ typeVideo(str) {
|
|
|
+ let type = str.slice(str.lastIndexOf('.') + 1, str.length);
|
|
|
+ let videoType = ['mp4'];
|
|
|
+ return videoType.includes(type);
|
|
|
+ },
|
|
|
+ lookVideos(src) {
|
|
|
+ new Promise((resolve) => {
|
|
|
+ this.$store.dispatch('addPopup', {
|
|
|
+ url: '/lookVideo.vue',
|
|
|
+ width: '600px',
|
|
|
+ height: '500px',
|
|
|
+ props: {
|
|
|
+ src: src,
|
|
|
+ callback: resolve
|
|
|
+ },
|
|
|
+ showConfirmButton: true,
|
|
|
+ showCancelButton: true,
|
|
|
+ hideStar: true,
|
|
|
+ title: '查看视频'
|
|
|
+ });
|
|
|
+ }).then(() => {
|
|
|
+ this.mixins_search();
|
|
|
+ });
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
@@ -160,6 +214,13 @@ export default {
|
|
|
/deep/.el-form-item__content {
|
|
|
font-size: 12px;
|
|
|
}
|
|
|
+ /deep/ .el-step__title.is-finish,
|
|
|
+ /deep/ .el-step__title.is-process,
|
|
|
+ /deep/ .el-step__description.is-finish {
|
|
|
+ font-weight: 500 !important;
|
|
|
+ color: #424656 !important;
|
|
|
+ }
|
|
|
+
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
.formContent-item_title {
|
|
@@ -175,4 +236,16 @@ export default {
|
|
|
clear: inherit;
|
|
|
}
|
|
|
}
|
|
|
+.imgVdio {
|
|
|
+ width: 80px;
|
|
|
+ height: 60px;
|
|
|
+ display: inline-block;
|
|
|
+ margin-right: 10px;
|
|
|
+ video,
|
|
|
+ img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|