From 59c8fd515b3879b4e25ce5e6c428cd222731a519 Mon Sep 17 00:00:00 2001
From: duanshuwen <duanshuwen@gogpay.cn>
Date: Sun, 5 Oct 2025 15:59:39 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E8=AE=A2=E5=8D=95=E6=A0=B7=E5=BC=8F?=
 =?UTF-8?q?=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Divider/styles/index.scss      | 50 +++++++++++--------
 .../components/OrderCard/styles/index.scss    |  5 ++
 .../order/components/OrderInfo/index.vue      | 11 ++--
 3 files changed, 40 insertions(+), 26 deletions(-)

diff --git a/src/components/Divider/styles/index.scss b/src/components/Divider/styles/index.scss
index 617237f..4f0cc2f 100644
--- a/src/components/Divider/styles/index.scss
+++ b/src/components/Divider/styles/index.scss
@@ -1,30 +1,36 @@
 .divider {
   height: 1px;
   margin: 0 10px;
-  background: linear-gradient(to right, #eee, #eee 5px, transparent 5px, transparent);
+  background: linear-gradient(
+    to right,
+    #eee,
+    #eee 5px,
+    transparent 5px,
+    transparent
+  );
   background-size: 10px 100%;
   position: relative;
 
-  &::before, &::after { 
-    position: absolute;
-    content: '';
-    height: 12px;
-    width: 6px;
-    
-    background-color: #E2EDF2;
-    top: 50%;
-    transform: translateY(-50%);
-  }
+  // &::before, &::after {
+  //   position: absolute;
+  //   content: '';
+  //   height: 12px;
+  //   width: 6px;
 
-  &::before {
-    border-radius: 0 20px 20px 0;
-    top: 0;
-    left: -10px;
-  }
+  //   background-color: #E2EDF2;
+  //   top: 50%;
+  //   transform: translateY(-50%);
+  // }
 
-  &::after {
-    border-radius: 20px 0 0 20px;
-    top: 0;
-    right: -10px;
-  }
-}
\ No newline at end of file
+  // &::before {
+  //   border-radius: 0 20px 20px 0;
+  //   top: 0;
+  //   left: -10px;
+  // }
+
+  // &::after {
+  //   border-radius: 20px 0 0 20px;
+  //   top: 0;
+  //   right: -10px;
+  // }
+}
diff --git a/src/pages-order/order/components/OrderCard/styles/index.scss b/src/pages-order/order/components/OrderCard/styles/index.scss
index f2c55b1..5f1b4dc 100644
--- a/src/pages-order/order/components/OrderCard/styles/index.scss
+++ b/src/pages-order/order/components/OrderCard/styles/index.scss
@@ -4,6 +4,11 @@
   box-shadow: 0px 3px 8px 0 rgba(0, 0, 0, 0.12);
   margin: 12px;
   transition: all 0.3s ease;
+  mask: radial-gradient(circle at 0 57px, #0000 6px, red 0),
+    radial-gradient(circle at right 57px, #0000 6px, red 0);
+  mask-size: 50%;
+  mask-position: 0, 100%;
+  mask-repeat: no-repeat;
 
   &:active {
     transform: scale(0.98);
diff --git a/src/pages-order/order/components/OrderInfo/index.vue b/src/pages-order/order/components/OrderInfo/index.vue
index 4c3d046..80fef17 100644
--- a/src/pages-order/order/components/OrderInfo/index.vue
+++ b/src/pages-order/order/components/OrderInfo/index.vue
@@ -80,7 +80,7 @@ const formattedAmount = computed(() => {
   return amount ? `${parseFloat(amount).toFixed(2)}` : "0.00";
 });
 
-// 按钮文案逻辑
+// 按钮文案逻辑，订单状态 0-待支付 1-待确认 2-待使用 3-已取消 4-退款中 5-已关闭 6-已完成
 const buttonText = computed(() => {
   const status = props.orderData.orderStatus;
   switch (status) {
@@ -88,14 +88,17 @@ const buttonText = computed(() => {
       return "立即支付";
     case "2": // 待使用状态
       return "申请退款";
-    default: // 其他状态
+    case "3": // 已取消状态
+    case "5": // 已关闭状态
+    case "6": // 已完成状态
       return "再次预定";
   }
 });
 
-// 是否显示按钮（退款中状态不显示）
+// 是否显示按钮（待支付、待使用、已取消、已关闭、已完成）
 const shouldShowButton = computed(() => {
-  return props.orderData.orderStatus !== "4"; // 4-退款中
+  const status = props.orderData.orderStatus;
+  return ["0", "2", "3", "5", "6"].includes(status);
 });
 
 // 处理按钮点击事件