✨ feat(Order): 优化订单页面布局，调整表格样式并改善分页组件位置

src/views/order/index.vue

@@ -32,7 +32,7 @@
       <!-- Table -->
       <!-- 内容居中 -->
       <Empty v-if="tableData.length==0" class="flex-1" img="/src/assets/img/orderList/暂无支付记录.svg" text="No order information available at the moment"></Empty>
-      <el-table v-else :data="tableData" class="w-full" :cell-style="{ textAlign: 'center' }"
+      <el-table v-else :data="tableData" class="w-full flex-1 " :cell-style="{ textAlign: 'center'}"
         :header-cell-style="{ textAlign: 'center' }">
         <el-table-column prop="orderNumber" label="Order Number" width="120" />
         <el-table-column prop="employeeId" label="Employee ID" width="120" />
@@ -53,14 +53,13 @@
           </template>
         </el-table-column>
       </el-table>
-
-
-    </div>
-    <!-- Pagination -->
-    <div class="fixed bottom-5 right-5 flex items-center justify-between">
+    <div class="flex items-center justify-end mt-2">
       <el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize" :page-sizes="[10, 20, 30, 40, 50]"
         :total="total" layout="prev, pager, next, sizes" />
     </div>
+
+    </div>
+
   </div>
 </template>
 
@@ -168,4 +167,7 @@ const handleDetails = (row) => {
   --el-color-info:white;
   --el-input-border-color:#f67f20;
 }
+:deep(.el-table .cell){
+  white-space: nowrap;
+}
 </style>