订单管理修改 订单详情修改 监控室列表和播放功能

This commit is contained in:
2025-08-10 18:56:52 +08:00
parent f3b45139e4
commit cffe8b855b
12 changed files with 518 additions and 66 deletions

View File

@@ -1,5 +1,5 @@
<template>
<view class="page-container">
<view class="page-container">
<view class="top-line"/>
<!-- 工单状态进度 -->
<view class="repair-detail-progress-box">
@@ -26,12 +26,21 @@
<view class="detail-value"><text class="detail-key">处理地点</text>{{ detail.location }}</view>
<view class="detail-value"><text class="detail-key">创建时间</text>{{ detail.createTime }}</view>
<view class="detail-value"><text class="detail-key">发起单位/</text>{{ detail.initiatorPeople }}</view>
<view class="detail-value"><text class="detail-key">计划完成时间</text>{{ detail.planCompleTime }}</view>
<view class="detail-value">
<text>附件</text>
<text class="link" @click="downloadFile">下载</text>
</view>
<view class="detail-value remark"><text>备注</text>{{ detail.remark }}</view>
<view class="detail-value"><text class="detail-key">工单图片</text></view>
<view class="image-list" v-if="detail.orderImgUrl">
<u-image
v-for="(imgUrl, index) in detail.orderImgUrl.split(',')"
:key="index"
:src="imgUrl"
width="200rpx"
height="200rpx"
border-radius="10rpx"
@click="previewImage(detail.orderImgUrl.split(','), index)"
style="margin-right: 20rpx; margin-bottom: 20rpx;"
></u-image>
</view>
</view>
<!-- 底部操作按钮 -->
@@ -45,41 +54,50 @@
<script>
export default {
data() {
return {
detailStep: 0,
detailStatus: '',
return {
detailStep: 0,
detailStatus: '',
progressSteps: ['创建工单','已接单', '处理中', '已结束'],
currentStatus: 2, // 0: 待分配1: 已接单2: 处理中3: 已完成
detail: {
}
}
};
},
onLoad(options) {
if (options.item) {
const item = JSON.parse(decodeURIComponent(options.item));
},
onLoad(options) {
if (options.item) {
const item = JSON.parse(decodeURIComponent(options.item));
this.detail = item;
console.log("t1",this.detail)
// 现在可以使用item对象了
// 进度映射
if (item.status == 0) {
this.detailStep = 0;
this.detailStatus = '创建工单';
} else if (item.status == 4) {
this.detailStep = 3;
this.detailStatus = '已结束';
} else if(item.status == 3){
this.detailStep = 2;
this.detailStatus = '处理中';
}else {
this.detailStep = 1;
this.detailStatus = '已接单';
}
}
this.detail.orderImgUrl = "https://picsum.photos/80/80?random=3,https://picsum.photos/80/80?random=3,https://picsum.photos/80/80?random=3";
console.log("t1",this.detail)
// 现在可以使用item对象了
// 进度映射
if (item.status == 0) {
this.detailStep = 0;
this.detailStatus = '创建工单';
} else if (item.status == 4) {
this.detailStep = 3;
this.detailStatus = '已结束';
} else if(item.status == 3){
this.detailStep = 2;
this.detailStatus = '处理中';
}else {
this.detailStep = 1;
this.detailStatus = '已接单';
}
}
},
methods: {
goBack() {
uni.navigateBack();
},
previewImage(urls, index) {
// 使用uView的图片预览组件
this.$u.previewImage({
urls: urls.filter(url => url.trim() !== ''),
current: index
});
},
transfer() {
uni.showToast({
title: '转派功能开发中',
@@ -91,8 +109,7 @@
title: '操作成功',
icon: 'success'
});
},
},
downloadFile() {
uni.downloadFile({
url: this.detail.attachment,
@@ -113,10 +130,10 @@
.page-container {
background: #fff;
}
.top-line{
width: 100vw;
height: 3rpx;
background: #ECECEC;
.top-line{
width: 100vw;
height: 3rpx;
background: #ECECEC;
}
.repair-detail-progress-box {
height: 107rpx;
@@ -193,17 +210,17 @@
.detail-list {
font-size: 28rpx;
line-height: 2em;
line-height: 2em;
margin-left: 40rpx;
}
.detail-key{
color: #595858;
}
.detail-value {
margin-bottom: 30rpx;
color: ##2F2F2F;
}
.detail-value {
margin-bottom: 30rpx;
color: ##2F2F2F;
}
.remark {
@@ -215,6 +232,20 @@
text-decoration: underline;
}
.image-list {
display: flex;
flex-wrap: wrap;
margin-top: 20rpx;
}
.image-item {
width: 200rpx;
height: 200rpx;
border-radius: 10rpx;
margin-right: 20rpx;
margin-bottom: 20rpx;
}
.btn-group {
display: flex;
justify-content: space-around;
@@ -222,13 +253,13 @@
}
.btn {
width: 276rpx;
width: 276rpx;
height: 88rpx;
padding: 20rpx;
font-size: 30rpx;
border-radius: 50rpx;
display: flex;
align-items: center;
border-radius: 50rpx;
display: flex;
align-items: center;
justify-content: center;
}