Jelajahi Sumber

✨ feat(tabbar): replace explore tab with orders tab

- update tab bar configuration to replace "发现" tab with "订单" tab
- change tab icon to clipboard-document-list icon
- update routing configuration for orders tab

✨ feat(orders): enhance order pages

- add Navbar component to orders page with "我的订单" title
- wrap orders page with TabBarLayout
- update import path for OrderStatus type to local types
- remove unused React import in orders page
- fix class name template literal formatting in status tabs
yourname 3 bulan lalu
induk
melakukan
fdcf12d191

+ 2 - 2
mini/src/app.config.ts

@@ -33,8 +33,8 @@ export default defineAppConfig({
         text: '首页'
       },
       {
-        pagePath: 'pages/explore/index',
-        text: '发现'
+        pagePath: 'pages/orders/index',
+        text: '订单'
       },
       {
         pagePath: 'pages/profile/index',

+ 6 - 6
mini/src/layouts/tab-bar-layout.tsx

@@ -17,10 +17,10 @@ const tabBarItems: TabBarItem[] = [
     selectedIconClass: 'i-heroicons-home-20-solid',
   },
   {
-    key: 'explore',
-    title: '发现',
-    iconClass: 'i-heroicons-magnifying-glass-20-solid',
-    selectedIconClass: 'i-heroicons-magnifying-glass-20-solid',
+    key: 'orders',
+    title: '订单',
+    iconClass: 'i-heroicons-clipboard-document-list-20-solid',
+    selectedIconClass: 'i-heroicons-clipboard-document-list-20-solid',
   },
   {
     key: 'profile',
@@ -37,8 +37,8 @@ export const TabBarLayout: React.FC<TabBarLayoutProps> = ({ children, activeKey,
       case 'home':
         Taro.switchTab({ url: '/pages/home/index' })
         break
-      case 'explore':
-        Taro.switchTab({ url: '/pages/explore/index' })
+      case 'orders':
+        Taro.switchTab({ url: '/pages/orders/index' })
         break
       case 'profile':
         Taro.switchTab({ url: '/pages/profile/index' })

+ 1 - 1
mini/src/pages/order-detail/index.tsx

@@ -3,7 +3,7 @@ import { View, Text, ScrollView, Button } from '@tarojs/components';
 import Taro from '@tarojs/taro';
 import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
 import { orderClient } from '@/api';
-import { OrderStatus } from '@d8d/server/share/order.types';
+import { OrderStatus } from '@/types/order.types';
 
 const OrderDetailPage = () => {
   const [orderId, setOrderId] = useState<number | null>(null);

+ 13 - 7
mini/src/pages/orders/index.tsx

@@ -1,9 +1,11 @@
-import React, { useState, useEffect } from 'react';
+import { useState, useEffect } from 'react';
 import { View, Text, ScrollView, Button } from '@tarojs/components';
 import Taro from '@tarojs/taro';
 import { useQuery } from '@tanstack/react-query';
 import { orderClient } from '@/api';
-import { OrderStatus } from '@d8d/server/share/order.types';
+import { OrderStatus } from '@/types/order.types';
+import { TabBarLayout } from '@/layouts/tab-bar-layout';
+import { Navbar } from '@/components/ui/navbar';
 
 // 订单状态选项卡
 const statusTabs = [
@@ -203,7 +205,12 @@ const OrdersPage = () => {
   }
 
   return (
-    <View className="min-h-screen bg-background">
+    <TabBarLayout activeKey="orders" className='bg-background'>
+      <Navbar
+        title="我的订单"
+        leftIcon=""
+        rightIcon=""
+      />
       {/* 状态选项卡 */}
       <View className="bg-white border-b border-border">
         <ScrollView
@@ -215,11 +222,10 @@ const OrdersPage = () => {
             {statusTabs.map((tab) => (
               <View
                 key={tab.key}
-                className={`px-4 py-2 rounded-full mr-3 cursor-pointer transition-colors ${
-                  currentTab === tab.key
+                className={`px-4 py-2 rounded-full mr-3 cursor-pointer transition-colors ${currentTab === tab.key
                     ? 'bg-primary text-primary-foreground'
                     : 'bg-muted text-muted-foreground'
-                }`}
+                  }`}
                 onClick={() => handleTabChange(tab.key)}
               >
                 <Text className="text-sm font-medium">{tab.label}</Text>
@@ -252,7 +258,7 @@ const OrdersPage = () => {
           ))
         )}
       </ScrollView>
-    </View>
+    </TabBarLayout>
   );
 };