diff --git a/src/pages/UserCenter/DesktopLayout/index.vue b/src/pages/UserCenter/DesktopLayout/index.vue
index 884e55e..61833e6 100644
--- a/src/pages/UserCenter/DesktopLayout/index.vue
+++ b/src/pages/UserCenter/DesktopLayout/index.vue
@@ -4,25 +4,31 @@
     class="mt-4 flex flex-col justify-center gap-[10px] md:mt-0 md:h-[668px] md:flex-row md:gap-[20px]"
   >
     <!-- Left Column -->
-    <div class="h-full w-[345px]">
+    <div class="order-1 h-full w-[345px] md:order-none">
       <Transition name="fade" mode="out-in">
         <UserInfo />
       </Transition>
     </div>
 
     <!-- Middle Column -->
-    <div class="flex h-full w-[345px] flex-col gap-[10px] md:gap-[20px]">
-      <DownloadStats />
-      <QuickTools />
+    <div class="contents md:flex md:h-full md:w-[345px] md:flex-col md:gap-[20px]">
+      <div class="order-2 w-[345px] md:order-none md:w-auto">
+        <DownloadStats />
+      </div>
+      <div class="order-last w-[345px] md:order-none md:w-auto">
+        <QuickTools />
+      </div>
     </div>
 
     <!-- Right Column -->
-    <div class="flex h-full w-[345px] flex-col gap-[10px] md:gap-[20px]">
-      <ProxyData />
-      <div class="">
+    <div class="contents md:flex md:h-full md:w-[345px] md:flex-col md:gap-[20px]">
+      <div class="order-3 w-[345px] md:order-none md:w-auto">
+        <ProxyData />
+      </div>
+      <div class="order-4 w-[345px] md:order-none md:w-auto">
         <SalesData @show-history="orderDetailsModalRef?.show()" />
       </div>
-      <div class="">
+      <div class="order-5 w-[345px] md:order-none md:w-auto">
         <RefundData @show-history="refundDetailsModalRef?.show()" />
       </div>
     </div>