From 85a1ce799ade86355925b20afc8f12d3989ba55f Mon Sep 17 00:00:00 2001
From: liyuanchao <438964165@qq.com>
Date: Tue, 26 Aug 2025 17:31:30 +0800
Subject: [PATCH] =?UTF-8?q?=E5=B7=A5=E5=8D=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 common/config.js                          |   2 +-
 pages/sys/user/myRepair/addRepair.vue     |   2 +-
 pages/sys/user/myRepair/myRepair.vue      |   8 +-
 pages/sys/workbench/order/orderDetail.vue | 592 ++++++++++------------
 4 files changed, 271 insertions(+), 333 deletions(-)

diff --git a/common/config.js b/common/config.js
index 2d5d5b3..b5f9682 100644
--- a/common/config.js
+++ b/common/config.js
@@ -30,5 +30,5 @@ const config = {
 config.baseUrl = 'http://183.230.235.66:11010/api';
 
 
-// config.baseUrl = 'http://9143b75.r28.cpolar.top';
+// config.baseUrl = 'http://378a061a.r28.cpolar.top'
 export default config;
diff --git a/pages/sys/user/myRepair/addRepair.vue b/pages/sys/user/myRepair/addRepair.vue
index 45077f6..992ed2f 100644
--- a/pages/sys/user/myRepair/addRepair.vue
+++ b/pages/sys/user/myRepair/addRepair.vue
@@ -21,7 +21,7 @@
 					<text class="text-type">{{ selectedType }}</text>
 					<image class="right-arrow" src="/static/ic_right_arrow_g.png" />
 				</view>
-				<view class="add-repair-label">问题详情 <text class="add-repair-optional">(非必填)</text></view>
+				<view class="add-repair-label">备注 <text class="add-repair-optional">(非必填)</text></view>
 				<textarea v-model="repairInfo.remark" class="add-repair-detail-textarea"
 					placeholder="如果以上报事不能解决您的问题，可以在这里填写说明" />
 
diff --git a/pages/sys/user/myRepair/myRepair.vue b/pages/sys/user/myRepair/myRepair.vue
index 75a696b..6e0d919 100644
--- a/pages/sys/user/myRepair/myRepair.vue
+++ b/pages/sys/user/myRepair/myRepair.vue
@@ -23,7 +23,7 @@
 
 			<!-- 有数据时 -->
 			<view v-else class="repair-list-box">
-				<view v-for="(item, idx) in records" :key="idx" class="repair-card" @click="showDetail(item)">
+				<view v-for="(item, idx) in records" :key="idx" class="repair-card" @click="goDetail(item)">
 					<view class="repair-row">
 						<view class="repair-no">工单号：{{ item.orderNo }}</view>
 						<view class="repair-status" :class="getStatusColor(item.status)">
@@ -172,6 +172,12 @@
 				};
 				return statusMap[status] || '';
 			},
+			goDetail(item) {
+			  const itemStr = encodeURIComponent(JSON.stringify(item));
+			  uni.navigateTo({
+			    url: "/pages/sys/workbench/order/orderDetail?item=" + itemStr,
+			  });
+			},
 			showDetail(item) {
 				this.detailItem = item;
 				if (item.status == 0) {
diff --git a/pages/sys/workbench/order/orderDetail.vue b/pages/sys/workbench/order/orderDetail.vue
index 54f15bd..a9d92e8 100644
--- a/pages/sys/workbench/order/orderDetail.vue
+++ b/pages/sys/workbench/order/orderDetail.vue
@@ -1,330 +1,262 @@
-<template>
-	<view class="page-container">
-		<view class="top-line" />
-		<!-- 工单状态进度 -->
-		<view class="repair-detail-progress-box">
-			<view class="repair-detail-progress">
-				<view v-for="(step, idx) in progressSteps" :key="idx" class="repair-detail-step">
-					<view
-						:class="['repair-detail-dot', detailStep >= idx ? 'active' : '', (detailStep === idx && detailStatus !== '已结束') ? 'current' : '']">
-					</view>
-					<view v-if="idx < progressSteps.length - 1"
-						:class="['repair-detail-line', detailStep > idx ? 'active' : '']"></view>
-				</view>
-			</view>
-			<view class="repair-detail-progress-labels">
-				<view v-for="(step, idx) in progressSteps" :key="idx" class="repair-detail-label">{{ step }}
-				</view>
-			</view>
-		</view>
-
-		<!-- 工单详情 -->
-		<view class="detail-list">
-			<view class="detail-value"><text class="detail-key">工单编号：</text>{{ detail.orderNo }}</view>
-			<view class="detail-value"><text class="detail-key">工单名称：</text>{{ detail.orderName }}</view>
-			<view class="detail-value"><text class="detail-key">工单类型：</text>{{ detail.typeName }}</view>
-			<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 remark"><text>备注：</text>{{ detail.remark }}</view>
-			<view class="detail-value"><text class="detail-key">工单图片：</text></view>
-			<view class="image-list" v-if="orderImgUrls.length > 0">
-				<u-image 
-					v-for="(imgUrl, index) in orderImgUrls" 
-					:key="index" 
-					:src="imgUrl"
-					width="200rpx" 
-					height="200rpx" 
-					border-radius="10rpx"
-					@click="previewImage(orderImgUrls, index)"
-					style="margin-right: 20rpx; margin-bottom: 20rpx;"
-					mode="aspectFill"
-				></u-image>
-			</view>
-
-		</view>
-
-		<!-- 底部操作按钮 -->
-		<view
-			v-if="((!this.isManager&&this.detailStep != 0) || (this.isManager&&this.detailStep == 0))&&this.detailStep!=3"
-			class="btn-group">
-			<button class="btn ghost"
-				@click="transfer(1)">{{this.isManager ? '指派':this.detailStep == 2 ? '完成':'开始'}}</button>
-			<button v-if="this.detailStep == 1" class="btn primary" @click="transfer(2)">转派</button>
-		</view>
-
-		<SelectUser :visible.sync="showSelect" :list="users" :multiple="false" @confirm="onConfirm" />
-	</view>
-</template>
-
-<script>
-	import SelectUser from '@/components/SelectUser.vue'
-	export default {
-		components: {
-			SelectUser
-		},
-		data() {
-			return {
-				detailStep: 0,
-				detailStatus: '',
-				progressSteps: ['创建工单', '已接单', '处理中', '已结束'],
-				currentStatus: 2, // 0: 待分配，1: 已接单，2: 处理中，3: 已完成
-				detail: {},
-				isManager: false,
-				showSelect: false,
-				users: [],
-				orderImgUrls: [] // 添加用于存储处理后的图片URL数组
-			};
-		},
-		onLoad(options) {
-			this.isManager = this.vuex_user.roles[0].roleId == 1
-			if (options.item) {
-				const item = JSON.parse(decodeURIComponent(options.item));
-				this.detail = item;
-				// 现在可以使用item对象了
-				// 进度映射
-				this.getStepInfo()
-				// 处理图片URL
-				
-				this.getImageUrl()
-			}
-			if ((this.isManager && this.detailStep == 0) || (!this.isManager && this.detailStep == 1)) {
-				this.getHandler()
-			}
-		},
-		methods: {
-			goBack() {
-				uni.navigateBack();
-			},
-			async getImageUrl() {
-				if (!this.detail.orderImgUrl) return;
-				
-				const imgIds = this.detail.orderImgUrl.split(',');
-				const res = await this.$u.api.getImageUrl({}, imgIds);
-				if (res.code == 200 && res.data) {
-					// 提取res.data数组中每个对象的url字段
-					this.orderImgUrls = res.data.map(item => item.url);
-				}	
-			},
-
-			async getHandler() {
-				let handlers = await this.$u.api.getHandler3({}, this.detail.type);
-				if (handlers.code === 200) {
-					this.users = [...this.users, ...handlers.data];
-				}
-			},
-			getStepInfo(){
-				if (this.detail.status == 0) {
-					this.detailStep = 0;
-					this.detailStatus = '创建工单';
-				} else if (this.detail.status == 4) {
-					this.detailStep = 3;
-					this.detailStatus = '已结束';
-				} else if (this.detail.status == 3) {
-					this.detailStep = 2;
-					this.detailStatus = '处理中';
-				} else {
-					this.detailStep = 1;
-					this.detailStatus = '已接单';
-				}
-			},
-			previewImage(urls, index) {
-				// 使用uView的图片预览组件
-				  // 过滤掉空值
-				  const validUrls = urls.filter(url => url && url.trim() !== '')
-				  uni.previewImage({
-				    urls: validUrls,
-				    current: validUrls[index], // current 必须是 url，而不是索引
-				    indicator: 'number', // 显示数字指示器
-				    backgroundColor: '#000'
-				  })
-			},
-			async onConfirm(selected) {
-				let params = this.detail
-				params.handler = selected[0].value
-				params.status = 1
-				let res = await this.$u.api.updateOrder2(params);
-				if (res.code == '200') {
-					// 关闭页面前发送事件通知前页面刷新
-					uni.$emit('refreshData', '');
-					this.detail.handler = selected.value
-					this.detail.status = 1
-					this.getStepInfo()
-				}
-			},
-			async submit() {
-				let params = this.detail
-				if(this.detail.status == 1||this.detail.status == 2){
-					params.status = 3
-				}else {
-					params.status = 4
-				}
-				let res = await this.$u.api.updateOrder2(params);
-				if (res.code == '200') {
-					// 关闭页面前发送事件通知前页面刷新
-					uni.$emit('refreshData', '');
-					this.detail.status = params.status
-					this.getStepInfo()
-				}
-			},
-			transfer(type) {
-				if (this.isManager || type == 2) {
-					this.showSelect = true
-				} else {
-					this.submit()
-				}
-			},
-		}
-	};
-</script>
-
-<style scoped>
-	.page-container {
-		background: #fff;
-	}
-
-	.top-line {
-		width: 100vw;
-		height: 3rpx;
-		background: #ECECEC;
-	}
-
-	.repair-detail-progress-box {
-		height: 107rpx;
-		margin-bottom: 41rpx;
-		display: flex;
-		flex-direction: column;
-		justify-content: center;
-		align-items: stretch;
-	}
-
-	.repair-detail-progress {
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-		margin-bottom: 5rpx;
-		margin-left: 85rpx;
-		width: 100%;
-	}
-
-	.repair-detail-step {
-		display: flex;
-		align-items: center;
-		flex: 1;
-		position: relative;
-	}
-
-	.repair-detail-dot {
-		width: 22rpx;
-		height: 22rpx;
-		border-radius: 50%;
-		background: #BDBDBD;
-		border: 2rpx solid #BDBDBD;
-		position: relative;
-		z-index: 2;
-	}
-
-	.repair-detail-dot.active {
-		background: #2186FF;
-		border-color: #2186FF;
-	}
-
-	.repair-detail-dot.current {
-		background: #EF8D00;
-		border-color: #EF8D00;
-	}
-
-	.repair-detail-line {
-		flex: 1;
-		height: 4rpx;
-		background: #BDBDBD;
-		margin: 0 2rpx;
-		z-index: 1;
-	}
-
-	.repair-detail-line.active {
-		background: #2186FF;
-	}
-
-	.repair-detail-progress-labels {
-		display: flex;
-		justify-content: space-between;
-		margin-left: 0;
-		width: 100%;
-	}
-
-	.repair-detail-label {
-		font-size: 22rpx;
-		color: #888;
-		text-align: center;
-		flex: 1;
-		position: relative;
-		top: 8rpx;
-	}
-
-	.detail-list {
-		font-size: 28rpx;
-		line-height: 2em;
-		margin-left: 40rpx;
-	}
-
-	.detail-key {
-		color: #595858;
-	}
-
-	.detail-value {
-		margin-bottom: 30rpx;
-		color: ##2F2F2F;
-	}
-
-	.remark {
-		white-space: pre-line;
-	}
-
-	.link {
-		color: #007CFF;
-		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;
-		margin-top: 60rpx;
-	}
-
-	.btn {
-		width: 276rpx;
-		height: 88rpx;
-		padding: 20rpx;
-		font-size: 30rpx;
-		border-radius: 50rpx;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-	}
-
-	.primary {
-		background-color: #1890ff;
-		color: #fff;
-	}
-
-	.ghost {
-		background-color: #fff;
-		color: #1890ff;
-		border: 2rpx solid #1890ff;
-	}
-</style>
\ No newline at end of file
+<template>
+  <view class="page-container">
+    <view class="top-line" />
+
+    <view class="item-bg"><text class="detail-key">工单编号：</text>{{ detail.orderNo }}</view>
+    <view class="item-bg">
+      <view class="item-title">上报人信息</view>
+      <view class="detail-key">发起人：{{ detail.initiatorPeople }}</view>
+      <view class="detail-key">联系电话：{{ detail.initiatorPhone }}</view>
+    </view>
+    <view class="item-bg">
+      <view class="item-title">保修信息</view>
+      <view class="detail-key">工单名称：{{ detail.orderName }}</view>
+      <view class="detail-key">工单类型：{{ detail.typeName }}</view>
+      <view class="detail-key">处理地点：{{ detail.location }}</view>
+      <view class="detail-key">备注：{{ detail.remark }}</view>
+      <view class="detail-value"><text class="detail-key">工单图片：</text></view>
+      <view class="image-list" v-if="orderImgUrls.length > 0">
+        <u-image 
+          v-for="(imgUrl, index) in orderImgUrls" 
+          :key="index" 
+          :src="imgUrl"
+          width="200rpx" 
+          height="200rpx" 
+          border-radius="10rpx"
+          @click="previewImage(orderImgUrls, index)"
+          style="margin-right: 20rpx; margin-bottom: 20rpx;"
+          mode="aspectFill"
+        ></u-image>
+      </view>
+    </view>
+
+    <view v-if="detail.status>1" class="item-bg">
+      <view class="item-title">负责人信息</view>
+      <view class="detail-key">负责人：{{ detail.handlerText }}</view>
+      <view class="detail-key">联系电话：{{ detail.handlerPhone }}</view>
+    </view>
+
+    <!-- 纵向进度条 -->
+  <view class="item-bg">
+        <view class="item-title">进度跟踪</view>
+        <view v-for="(status, index) in detail.recordVoList" :key="index" class="repair-detail-step">
+          <view  class="step-left">
+            <text class="step-date">{{ status.createTime.substring(0,11)}}</text>
+            <text class="step-time">{{ status.createTime.substring(11,16) }}</text>
+          </view>
+          <view  class="step-dot-container">
+            <view class="repair-detail-dot" ></view>
+            <!-- 固定高度连线 -->
+            <view 
+              v-if="index < detail.recordVoList.length - 1" class="repair-detail-line"
+            ></view>
+          </view>
+          <view   class="step-right">
+            <text class="step-name">{{  getStatusLabel(status.status) }}</text>
+          </view>
+        </view>
+      </view>
+
+    <!-- 底部操作按钮 -->
+    <view
+      v-if="((!isManager && detailStep != 0) || (isManager && detailStep == 0)) && detailStep != 3&&!isNaomalUser"
+      class="btn-group">
+      <button class="btn ghost"
+        @click="transfer(1)">{{ isManager ? '指派' : (detailStep == 2 ? '完成' : '开始') }}</button>
+      <button v-if="detailStep == 1" class="btn primary" @click="transfer(2)">转派</button>
+    </view>
+	<view class="kg">	
+	</view>
+    <SelectUser :visible.sync="showSelect" :list="users" :multiple="false" @confirm="onConfirm" />
+  </view>
+</template>
+
+<script>
+import SelectUser from '@/components/SelectUser.vue'
+export default {
+  components: { SelectUser },
+  data() {
+    return {
+      detailStep: 0,
+      detailStatus: '',
+      currentStatus: 2,
+      detail: {},
+      isManager: false,
+	  isNaomalUser:true,
+      showSelect: false,
+      users: [],
+      orderImgUrls: []
+    };
+  },
+  onLoad(options) {
+    this.isManager = this.vuex_user?.roles?.[0]?.roleId < 3
+	this.isNaomalUser = this.vuex_user?.roles?.[0]?.roleId >10
+    if (options.item) {
+      const item = JSON.parse(decodeURIComponent(options.item));
+      this.detail = item;
+      this.getStepInfo()
+      this.getImageUrl()
+    }
+    if ((this.isManager && this.detailStep == 0) || (!this.isManager && this.detailStep == 1)) {
+      this.getHandler()
+    }
+  },
+  methods: {
+    goBack() { uni.navigateBack(); },
+    async getImageUrl() {
+      if (!this.detail.orderImgUrl) return;
+      const imgIds = this.detail.orderImgUrl.split(',');
+      const res = await this.$u.api.getImageUrl({}, imgIds.join(','));
+      if (res.code == 200 && res.data) this.orderImgUrls = res.data.map(item => item.url);
+    },
+    async getHandler() {
+      let handlers = await this.$u.api.getHandler3({}, this.detail.type);
+      if (handlers.code === 200) this.users = [...this.users, ...handlers.data];
+    },
+    getStepInfo() {
+      let currentIndex = 0;
+      if (this.detail.status == 0) currentIndex = 0;
+      else if (this.detail.status == 1) currentIndex = 1;
+      else if (this.detail.status == 3) currentIndex = 2;
+      else if (this.detail.status == 4) currentIndex = 3;
+      this.detailStep = currentIndex;
+
+    },
+	getStatusLabel(status) {
+	  const statusMap = {
+	    0: "创建工单",
+	    1: "已接单",
+	    2: "已接单",
+	    3: "处理中",
+	    4: "已完成",
+	  };
+	  return statusMap[status] || "";
+	},
+    previewImage(urls, index) {
+      const validUrls = urls.filter(url => url && url.trim() !== '');
+      const currentIndex = validUrls.indexOf(urls[index]);
+      uni.previewImage({
+        urls: validUrls,
+        current: currentIndex >= 0 ? currentIndex : 0,
+        indicator: 'number',
+        backgroundColor: '#000'
+      })
+    },
+    async onConfirm(selected) {
+      let params = this.detail
+      params.handler = selected[0].value
+      params.status = 1
+      let res = await this.$u.api.updateOrder2(params);
+      if (res.code == '200') {
+        uni.$emit('refreshData', '');
+		if(!this.isManager){
+			uni.navigateBack(); 
+			return
+		}
+        this.detail.handler = selected.value
+        this.detail.status = 1
+		const d = new Date();
+		const z = n => n.toString().padStart(2, '0');
+		let time = `${d.getFullYear()}-${z(d.getMonth()+1)}-${z(d.getDate())} ${z(d.getHours())}:${z(d.getMinutes())}:${z(d.getSeconds())}`;
+		let step =  {}
+		step.id= this.detail.recordVoList[0].id,
+		step.orderId= this.detail.recordVoList[0].orderId,
+		step.status= '1',
+		step.handler='',
+		step.handlerName='',
+		step.createTime= time			
+		this.detail.recordVoList.push(step)
+        this.getStepInfo()
+      }
+    },
+    async submit() {
+      let params = this.detail
+      if (this.detail.status == 1 || this.detail.status == 2) params.status = 3
+      else params.status = 4
+      let res = await this.$u.api.updateOrder2(params);
+      if (res.code == 200) {
+        uni.$emit('refreshData', '');
+        this.detail.status = params.status
+		if(params.status ==3){
+			this.detail.handlerText = this.vuex_user.nickName
+			this.detail.handlerPhone = this.vuex_user.phonenumber
+		}
+		const d = new Date();
+		const z = n => n.toString().padStart(2, '0');
+		let time = `${d.getFullYear()}-${z(d.getMonth()+1)}-${z(d.getDate())} ${z(d.getHours())}:${z(d.getMinutes())}:${z(d.getSeconds())}`;
+		let step =  {}
+		step.id= this.detail.recordVoList[0].id,
+		step.orderId= this.detail.recordVoList[0].orderId,
+		step.status= params.status,
+		step.handler='',
+		step.handlerName='',
+		step.createTime= time
+		this.detail.recordVoList.push(step)
+        this.getStepInfo()
+      }
+    },
+
+
+    transfer(type) {
+      if (this.isManager || type == 2) this.showSelect = true
+      else this.submit()
+    }
+  }
+}
+</script>
+
+<style scoped>
+.page-container { background: #f7f7f7; height: 100vh; }
+.top-line { width: 100vw; height: 3rpx; background: #ECECEC; }
+.item-bg{ background: #fff; border-radius: 20rpx; margin-top: 10px; margin-left: 25rpx; margin-right: 25rpx; padding: 25rpx; }
+.item-title{ color: #000; font-size: 28rpx; font-weight: 600; margin-bottom: 20rpx; }
+
+.repair-detail-step-container { display: flex; flex-direction: column; }
+.repair-detail-step {
+  display: flex;
+  flex-direction: row;
+  margin-bottom: 20rpx;
+}
+.step-left { flex: 1; display: flex; flex-direction: column; align-items: flex-end; padding-right: 20rpx; }
+.step-date { font-size: 24rpx; color: #333; }
+.step-time { font-size: 24rpx; color: #666; margin-top: 10rpx; }
+.step-dot-container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  width: 40rpx;
+}
+.repair-detail-dot {
+  width: 22rpx;
+  height: 22rpx;
+  border-radius: 50%;
+  background: #BDBDBD;
+  border: 2rpx solid #BDBDBD;
+  z-index: 2;
+  background: #2186FF;
+  border-color: #2186FF;
+}
+
+/* 固定高度连线 */
+.repair-detail-line {
+  width: 4rpx;
+  height: 80rpx; /* 每条线的高度 */
+  background: #BDBDBD;
+  margin-top: 2rpx;
+  background: #2186FF;
+}
+
+.step-right { flex: 1; display: flex; flex-direction: column; padding-left: 20rpx; }
+.step-name { font-size: 28rpx; color: #333; font-weight: bold; margin-bottom: 6rpx; }
+.step-desc { font-size: 24rpx; color: #666; }
+.detail-key { color: #222; font-size: 28rpx; margin-bottom: 20rpx; }
+.detail-value { margin-bottom: 30rpx; color: #2F2F2F; }
+.image-list { display: flex; flex-wrap: wrap; margin-top: 20rpx; }
+.btn-group { display: flex; justify-content: space-around; margin-top: 60rpx; }
+.btn { width: 276rpx; height: 88rpx; padding: 20rpx; font-size: 30rpx; border-radius: 50rpx; display: flex; align-items: center; justify-content: center; }
+.primary { background-color: #1890ff; color: #fff; }
+.ghost { background-color: #fff; color: #1890ff; border: 2rpx solid #1890ff; }
+.kg{
+	height: 60rpx;
+}
+</style>