🐞 fix: 修复订单详情页偏左的问题

src/pages/store/orders/orderDetail/index.vue

@@ -1,9 +1,10 @@
 <template>
   <div class="store-page order-detail-page">
-    <Breadcrumb />
+    <div class="order-detail-page__inner">
+      <Breadcrumb />
 
-    <a-spin :loading="loading" class="store-spin">
-      <div class="detail-stack">
+      <a-spin :loading="loading" class="store-spin">
+        <div class="detail-stack">
         <!-- 待支付横幅 -->
         <div v-if="data?.state === 0 && hasPay" class="pay-banner">
           <div class="pay-banner__info">
@@ -66,8 +67,9 @@
           <a-button @click="$router.push('/store/myOrder')">返回订单列表</a-button>
           <a-button type="outline" @click="$router.push('/store/goodsList')">继续购物</a-button>
         </div>
-      </div>
-    </a-spin>
+        </div>
+      </a-spin>
+    </div>
   </div>
 </template>
 
@@ -242,7 +244,6 @@ function openPaymentWindow(payUrl, formData) {
   flex-direction: column;
   gap: 16px;
   width: 100%;
-  max-width: 900px;
 }
 
 .pay-banner {

src/pages/store/orders/orderList/index.vue

@@ -133,19 +133,6 @@ GetNotice()
 <style lang="less" scoped>
 @import '@/styles/store-theme.less';
 
-.order-page {
-  width: 100%;
-  max-width: none;
-  padding-left: 24px;
-  padding-right: 24px;
-}
-
-.order-page__inner {
-  width: 100%;
-  max-width: 720px;
-  margin: 0 auto;
-}
-
 .page-header {
   display: flex;
   flex-wrap: wrap;

src/styles/store-theme.less

@@ -48,6 +48,27 @@
   margin-right: auto;
 }
 
+// 云商城订单 — 列表与详情在内容区居中
+.order-page,
+.order-detail-page {
+  width: 100%;
+  max-width: none;
+}
+
+.order-page__inner {
+  width: 100%;
+  max-width: 720px;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.order-detail-page__inner {
+  width: 100%;
+  max-width: 900px;
+  margin-left: auto;
+  margin-right: auto;
+}
+
 // Arco Spin 默认为 inline-block，会导致子内容宽度塌陷
 .store-spin {
   display: block !important;