工位订单日期时间显示修改

pages/home/components/workOrderCard.vue

@@ -45,7 +45,7 @@
 </template>
 
 <script>
-	export default {
+export default {
 	name: "OrderCard",
 	props: {
 		dataItem: {
@@ -61,57 +61,18 @@
 	},
 	computed: {
 		photo() {
-				return this.dataItem.photo? JSON.parse(this.dataItem.photo):"";
+			return this.dataItem.photo ? JSON.parse(this.dataItem.photo) : "";
 		},
 		useTime() {
 			const start = this.dataItem.reserve_start_time;
-				const endTime = this.dataItem.reserve_end_time;
-
-				function formatTimeRange(startTimeStr, endTimeStr) {
-					if (!startTimeStr || !endTimeStr) return "未设置";
-					
-					// 解析开始时间为Date对象
-					const startTime = new Date(startTimeStr.replace(/-/g, '/'));
-					const endTime = new Date(endTimeStr.replace(/-/g, '/'));
-					
-					if (isNaN(startTime.getTime()) || isNaN(endTime.getTime())) {
-						console.error("无效的时间格式");
-						return "时间格式错误";
-					}
-					
-					// 格式化年份：YYYY年
-					const formatYear = (date) => {
-						return date.getFullYear() + '年';
-					};
-					
-					// 格式化月份和日期：MM月DD
-					const formatMonthDay = (date) => {
-						const month = String(date.getMonth() + 1).padStart(2, "0");
-						const day = String(date.getDate()).padStart(2, "0");
-						return `${month}月${day}`;
-					};
-					
-					// 格式化时间部分：HH:MM
-					const formatTimePart = (date) => {
-						const hours = String(date.getHours()).padStart(2, "0");
-						const minutes = String(date.getMinutes()).padStart(2, "0");
-						return `${hours}:${minutes}`;
-					};
-					
-					// 判断是否同一天
-					const isSameDay = startTime.getFullYear() === endTime.getFullYear() &&
-									  startTime.getMonth() === endTime.getMonth() &&
-									  startTime.getDate() === endTime.getDate();
-					
-					if (isSameDay) {
-						// 同一天：2025年05月29 12:30-13:30
-						return `${formatYear(startTime)}${formatMonthDay(startTime)} ${formatTimePart(startTime)}-${formatTimePart(endTime)}`;
-					} else {
-						// 跨天：2025年05月29 12:30-2025年05月30 13:30
-						return `${formatYear(startTime)}${formatMonthDay(startTime)} ${formatTimePart(startTime)}-${formatYear(endTime)}${formatMonthDay(endTime)} ${formatTimePart(endTime)}`;
-					}
-				}
-				return formatTimeRange(start, endTime);
+			const end = this.dataItem.reserve_end_time;
+			if (!start || !end) return "未设置";
+			const startDate = new Date(start.replace(/-/g, '/'));
+			const endDate = new Date(end.replace(/-/g, '/'));
+			if (isNaN(startDate.getTime()) || isNaN(endDate.getTime())) return "时间格式错误";
+			const pad = (n) => String(n).padStart(2, "0");
+			const fmt = (d) => `${pad(d.getMonth() + 1)}.${pad(d.getDate())} ${pad(d.getHours())}:${pad(d.getMinutes())}`;
+			return `${fmt(startDate)}-${fmt(endDate)}`;
 		},
 		stateText() {
 			const textList = [
@@ -152,20 +113,20 @@
 			this.$emit("goRefund", this.dataItem);
 		}
 	},
-	};
+};
 </script>
 
 <style lang="less" scoped>
-	.order-card {
+.order-card {
 	position: relative; // 必须加，确保父容器有定位
 	padding: 24rpx 20rpx 0rpx;
 	margin: 0rpx 30rpx 20rpx 30rpx;
 	background-color: #fff;
 	border-radius: 12px;
 	/* box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); */
-	}
+}
 
-	.orderNumBox {
+.orderNumBox {
 	display: flex;
 	align-items: center;
 	justify-content: space-between;
@@ -200,35 +161,35 @@
 		background-image: url("/static/images/icons/tabBj2.png");
 		color: #999999 !important;
 	}
-	}
+}
 
-	/* 订单编号 */
-	.order-id {
+/* 订单编号 */
+.order-id {
 	width: 530rpx;
 	font-size: 28rpx;
 	color: #333333;
-	}
+}
 
-	/* 服务信息容器 */
-	.service-container {
+/* 服务信息容器 */
+.service-container {
 	display: flex;
 	align-items: center;
 	padding-bottom: 24rpx;
 	border-bottom: 1px solid #f6f5f5;
 	width: 100%;
-	}
+}
 
-	/* 服务图片 */
-	.service-img {
+/* 服务图片 */
+.service-img {
 	width: 172rpx;
 	height: 168rpx;
 	border-radius: 24rpx;
 	margin-right: 30rpx;
 	flex-shrink: 0;
-	}
+}
 
-	/* 服务信息 */
-	.service-info {
+/* 服务信息 */
+.service-info {
 	display: flex;
 	flex-direction: column;
 	justify-content: space-between;
@@ -267,28 +228,28 @@
 		text-align: left;
 		font-style: normal;
 	}
-	}
+}
 
-	.service_subTitle {
+.service_subTitle {
 	font-size: 26rpx;
 	line-height: 26rpx;
 	color: #666666;
 	margin-top: 18rpx;
-	}
+}
 
 
 
-	.service-address {
+.service-address {
 	font-weight: 400;
 	font-size: 26rpx;
 	color: #999999;
 	line-height: 33rpx;
 	text-align: left;
 	font-style: normal;
-	}
+}
 
-	/* 时间信息 */
-	.time-info {
+/* 时间信息 */
+.time-info {
 	font-weight: 400;
 	font-size: 26rpx;
 	color: #333333;
@@ -297,18 +258,18 @@
 	font-style: normal;
 	padding-bottom: 20rpx;
 	margin-top: 28rpx;
-	}
+}
 
-	/* 按钮组 */
-	.button-group {
+/* 按钮组 */
+.button-group {
 	display: flex;
 	justify-content: flex-end;
 	gap: 30rpx;
 	padding-bottom: 30rpx;
-	}
+}
 
-	/* 通用按钮样式 */
-	.btn {
+/* 通用按钮样式 */
+.btn {
 	white-space: nowrap;
 	width: 100rpx;
 	height: 32rpx;
@@ -327,17 +288,17 @@
 	line-height: 64rpx;
 	// padding: 0 28rpx;
 
-	}
+}
 
-	/* 取消按钮 */
-	.cancel-btn {
+/* 取消按钮 */
+.cancel-btn {
 	border: 2rpx solid #979797;
 	color: #333333;
-	}
+}
 
-	/* 接单按钮 */
-	.accept-btn {
+/* 接单按钮 */
+.accept-btn {
 	border: 2rpx solid #E8101E;
 	color: #E8101E;
-	}
+}
 </style>