update

src/components/OrderList.vue

@@ -82,7 +82,11 @@
           <!-- 配送时段 -->
           <el-table-column label="配送时段" min-width="120">
             <template #default="scope">
-              <div v-if="scope.row.delivery_date && scope.row.time_period_name">
+              <div v-if="scope.row.delivery_date && scope.row.time_period_name"
+                   :class="{
+                     'time-in-progress': getDeliveryTimeStatus(scope.row.delivery_date, scope.row.time_period_name) === 'in-progress',
+                     'time-expired': getDeliveryTimeStatus(scope.row.delivery_date, scope.row.time_period_name) === 'expired'
+                   }">
                 <div>{{ scope.row.delivery_date }}</div>
                 <div>{{ scope.row.time_period_name }}</div>
               </div>
@@ -240,6 +244,36 @@ export default {
       }
     }
     
+    // 判断配送时段与当前时间的关系
+    const getDeliveryTimeStatus = (deliveryDate, timePeriodName) => {
+      if (!deliveryDate || !timePeriodName) return 'normal';
+      
+      // 解析配送日期
+      const [year, month, day] = deliveryDate.split('-').map(Number);
+      
+      // 解析时间段 (假设格式为 "12:00-14:00")
+      const timeRange = timePeriodName.match(/(\d{1,2}):(\d{2})-(\d{1,2}):(\d{2})/);
+      if (!timeRange) return 'normal';
+      
+      const [_, startHour, startMinute, endHour, endMinute] = timeRange.map(Number);
+      
+      // 创建配送时段的开始和结束时间
+      const startTime = new Date(year, month - 1, day, startHour, startMinute);
+      const endTime = new Date(year, month - 1, day, endHour, endMinute);
+      
+      // 获取当前时间
+      const now = new Date();
+      
+      // 判断当前时间是否在配送时段内
+      if (now >= startTime && now <= endTime) {
+        return 'in-progress'; // 当前时间在配送时段内
+      } else if (now > endTime) {
+        return 'expired'; // 当前时间已超过配送时段
+      } else {
+        return 'upcoming'; // 配送时段还未开始
+      }
+    };
+    
     // 添加窗口大小变化事件监听
     onMounted(() => {
       window.addEventListener('resize', handleResize)
@@ -373,7 +407,8 @@ export default {
       handleReset,
       handleStatusChange,
       handleSizeChange,
-      handleCurrentChange
+      handleCurrentChange,
+      getDeliveryTimeStatus
     }
   }
 }
@@ -386,6 +421,17 @@ export default {
   overflow: hidden;
 }
 
+/* 配送时段状态样式 */
+.time-in-progress {
+  color: #e6a23c;
+  font-weight: bold;
+}
+
+.time-expired {
+  color: #f56c6c;
+  font-weight: bold;
+}
+
 .page-header {
   margin-bottom: 20px;
   display: flex;