refactor: 商品页底部栏改造为微信支付分绿色风格

- 按钮从暖黄色改为微信支付分绿(#00B74B)，文字改为"扫码开门"并在前加入支付分图标
- "微信支付分 | 550分以上优享"移至按钮下方，按钮与文案居中对齐
- 移除底部"返回"按钮（导航栏已有返回键）
- 页面标题改为"富玉小食堂"
- 优化结算完成页布局

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

haha-mp/src/pages.json

@@ -57,6 +57,14 @@
 				"navigationBarTextStyle": "black"
 			}
 		},
+		{
+			"path": "pages/orderComplete/orderComplete",
+			"style": {
+				"navigationBarTitleText": "微信支付分订单",
+				"navigationBarBackgroundColor": "#07C160",
+				"navigationBarTextStyle": "white"
+			}
+		},
 		{
 			"path": "pages/announcement/announcement",
 			"style": {
@@ -108,7 +116,7 @@
 		{
 			"path": "pages/products/products",
 			"style": {
-				"navigationBarTitleText": "柜内商品",
+				"navigationBarTitleText": "富玉小食堂",
 				"navigationBarBackgroundColor": "#FFD700",
 				"navigationBarTextStyle": "black"
 			}

haha-mp/src/pages/orderComplete/orderComplete.vue

@@ -16,24 +16,27 @@
 
       <!-- 弧线下内容 -->
       <view class="body-content">
-        <!-- 成功图标 -->
-        <view class="success-icon-wrapper">
-          <view class="success-icon">
-            <view class="check-stem" />
+        <!-- 成功状态居中区 -->
+        <view class="success-status">
+          <!-- 成功图标 -->
+          <view class="success-icon-wrapper">
+            <view class="success-icon">
+              <view class="check-stem" />
+            </view>
           </view>
+          <text class="success-title">已完成</text>
         </view>
-        <text class="success-title">已完成</text>
-        <text class="success-subtitle">计入按时支付记录</text>
+        <!-- <text class="success-subtitle">计入按时支付记录</text> -->
         <!-- 商户信息 -->
         <view class="card merchant-card">
-          <view class="merchant-header">
+          <!-- <view class="merchant-header">
             <view class="merchant-icon-wrapper">
               <view class="merchant-icon">
                 <text class="merchant-icon-text">柜</text>
               </view>
             </view>
             <text class="merchant-name">AI零售柜</text>
-          </view>
+          </view> -->
           <view class="merchant-info-row">
             <text class="info-label">先享服务</text>
             <text class="info-value">自助先购后付</text>
@@ -283,11 +286,20 @@ $wechat-green: #07C160;
   padding: 0 24rpx;
 }
 
-/* 成功图标 */
+/* 成功状态 - 垂直居中 */
+.success-status {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  min-height: 160rpx;
+  margin-top: -60rpx;
+  padding: 0;
+}
+
 .success-icon-wrapper {
   display: flex;
   justify-content: center;
-  margin-top: 40rpx;
   margin-bottom: 16rpx;
   animation: successPop 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
 }
@@ -318,11 +330,13 @@ $wechat-green: #07C160;
 }
 
 .success-title {
+  display: block;
+  width: 100%;
   font-size: 40rpx;
   font-weight: 700;
   color: #1a1a1a;
   text-align: center;
-  margin-bottom: 12rpx;
+  margin-bottom: 36rpx;
   letter-spacing: 2rpx;
 }
 

haha-mp/src/pages/products/products.vue

@@ -97,15 +97,19 @@
 
     <!-- 底部操作栏 -->
     <view v-if="!loading && !errorMsg" class="bottom-bar">
-      <view class="bottom-trust">
-        <BrandSlogan type="standard" :compact="true" />
-      </view>
       <view class="bottom-actions">
-        <view class="btn-back" @click="goBack">返回</view>
         <view class="btn-open" @click="handleOpenDoor">
-          {{ opening ? '处理中...' : '开门购物' }}
+          <image
+            class="btn-open__logo"
+            src="/static/icons/payscore-button.png"
+            mode="aspectFit"
+          />
+          <text>{{ opening ? '处理中...' : '扫码开门' }}</text>
         </view>
       </view>
+      <view class="bottom-trust">
+        <BrandSlogan type="standard" :compact="true" />
+      </view>
     </view>
   </view>
 </template>
@@ -678,39 +682,26 @@ const goBack = () => {
 .bottom-trust {
   display: flex;
   justify-content: center;
-  margin-bottom: $spacing-sm;
+  margin-top: $spacing-sm;
 }
 
 .bottom-actions {
   display: flex;
-  gap: $spacing-sm;
-}
-
-.btn-back {
-  flex: 2;
-  text-align: center;
-  padding: 22rpx 0;
-  border-radius: $radius-xl;
-  font-size: 28rpx;
-  font-weight: 500;
-  color: $color-text-secondary;
-  background: $color-bg-tertiary;
-
-  &:active {
-    background: $color-border;
-  }
+  justify-content: center;
 }
 
 .btn-open {
-  flex: 3;
-  text-align: center;
-  padding: 22rpx 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 10rpx;
+  padding: 22rpx 120rpx;
   border-radius: $radius-xl;
   font-size: 30rpx;
   font-weight: 600;
-  color: $color-text-primary;
-  background: linear-gradient(135deg, $color-primary, $color-primary-dark);
-  box-shadow: 0 6rpx 20rpx rgba(255, 160, 0, 0.3);
+  color: $color-bg-primary;
+  background: linear-gradient(135deg, #00B74B, #009A3F);
+  box-shadow: 0 6rpx 20rpx rgba(0, 183, 75, 0.3);
   animation: btn-breathe 2.4s $ease-in-out infinite;
 
   &:active {
@@ -720,6 +711,12 @@ const goBack = () => {
   }
 }
 
+.btn-open__logo {
+  width: 36rpx;
+  height: 36rpx;
+  flex-shrink: 0;
+}
+
 @keyframes btn-breathe {
   0%, 100% {
     transform: scale(1);

haha-mp/src/static/icons/payscore-green.svg

@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80 80">
+  <rect width="80" height="80" rx="18" fill="#FFFFFF"/>
+  <g transform="translate(40,38)" fill="none" stroke="#07C160" stroke-width="4" stroke-linecap="round" stroke-linejoin="round">
+    <path d="M-17,-12 C-17,-20 -9,-26 1,-26 C11,-26 18,-20 18,-12 C18,-5 13,1 7,3 L11,10 L2,5 C-5,4 -8,1 -13,-5 C-15.5,-7 -17,-9.5 -17,-12 Z"/>
+  </g>
+  <text x="40" y="54" text-anchor="middle" fill="#07C160" font-family="system-ui,-apple-system,sans-serif" font-size="18" font-weight="700">¥</text>
+</svg>