u

code/base-project/base-app/src/app/(tabs)/_layout.tsx

@@ -2,19 +2,22 @@ import type { TabbarItem } from '@/components/custom/Tabbar'
 import CustomTabbar from '@/components/custom/Tabbar'
 import { toast } from '@/utils/toast'
 
+export const unstable_settings = {
+  initialRouteName: 'money',
+}
+
 export default function TabsLayout() {
   const tabbarOptions: TabbarItem[] = [
-    {
-      name: 'user',
-      href: '/user',
-      icon: 'CircleCheckBig',
-    },
-
     {
       name: 'money',
       href: '/money',
       icon: 'CircleDollarSign',
     },
+    {
+      name: 'user',
+      href: '/user',
+      icon: 'CircleCheckBig',
+    },
     {
       name: 'app',
       icon: 'LayoutGrid',
@@ -37,6 +40,7 @@ export default function TabsLayout() {
       icon: 'Heart',
     },
   ]
+
   return (
     <CustomTabbar data={tabbarOptions} />
   )

code/base-project/base-app/src/app/(tabs)/money.tsx

@@ -1,9 +1,53 @@
-import { Text, View } from 'react-native'
+import { LinearGradient } from 'expo-linear-gradient'
+import { useState } from 'react'
+import { Pressable, Text, View } from 'react-native'
+import { useSafeAreaInsets } from 'react-native-safe-area-context'
 
 export default function Money() {
+  const insets = useSafeAreaInsets()
+  const [active, setActive] = useState<'明细' | '视图'>('明细')
+
   return (
-    <View>
-      <Text>Money</Text>
-    </View>
+    <LinearGradient
+      colors={['#fffaf0', '#fefefe', '#f0fff4']}
+      start={{ x: 0, y: 0 }}
+      end={{ x: 1, y: 1 }}
+      style={{
+        flex: 1,
+        paddingTop: insets.top,
+        paddingBottom: insets.bottom,
+        paddingLeft: insets.left,
+        paddingRight: insets.right,
+      }}
+    >
+      <View style={{ flexDirection: 'row' }}>
+        {['明细', '视图'].map((item) => {
+          const isActive = active === item
+          return (
+            <Pressable
+              key={item}
+              onPress={() => setActive(item as '明细' | '视图')}
+              style={{ alignItems: 'center', paddingVertical: 12 }}
+            >
+              <Text style={{ fontSize: isActive ? 22 : 16, color: isActive ? '#333' : '#888', fontWeight: isActive ? '600' : '400' }}>
+                {item}
+              </Text>
+              {/* 底部指示线 */}
+              {isActive && (
+                <View
+                  style={{
+                    marginTop: 4,
+                    height: 2,
+                    width: 24,
+                    backgroundColor: '#007AFF',
+                    borderRadius: 1,
+                  }}
+                />
+              )}
+            </Pressable>
+          )
+        })}
+      </View>
+    </LinearGradient>
   )
 }

code/base-project/base-app/src/app/(tabs)/user.tsx

@@ -1,9 +1,83 @@
-import { Text, View } from 'react-native'
+import { router } from 'expo-router'
+import { StyleSheet, Text, View } from 'react-native'
+import { AButton } from '@/components/common/ao'
+import { useUserStore } from '@/store/user'
 
 export default function User() {
+  const userInfo = useUserStore(state => state.userInfo)
+
+  if (!userInfo) {
+    return (
+      <View style={styles.container}>
+        <Text style={styles.empty}>未登录</Text>
+      </View>
+    )
+  }
+
+  const genderText = userInfo.gender === 1 ? '男' : userInfo.gender === 2 ? '女' : '未设置'
+
   return (
-    <View>
-      <Text>User</Text>
+    <View style={styles.container}>
+      <Text style={styles.title}>个人信息</Text>
+      <View style={styles.infoBox}>
+        <Text style={styles.item}>
+          账号：
+          {userInfo.account}
+        </Text>
+        <Text style={styles.item}>
+          用户名：
+          {userInfo.username}
+        </Text>
+        <Text style={styles.item}>
+          ID：
+          {userInfo.id}
+        </Text>
+        <Text style={styles.item}>
+          序号：
+          {userInfo.seqNo}
+        </Text>
+        <Text style={styles.item}>
+          性别：
+          {genderText}
+        </Text>
+        {userInfo.rememberMe && <Text style={styles.item}>已开启记住我功能</Text>}
+      </View>
+
+      <AButton onPress={() => {
+        router.replace('/auth')
+      }}
+      >
+        跳转到登陆页面
+      </AButton>
     </View>
   )
 }
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: '#fff',
+    padding: 20,
+  },
+  title: {
+    fontSize: 20,
+    fontWeight: 'bold',
+    marginBottom: 16,
+  },
+  infoBox: {
+    backgroundColor: '#f8f8f8',
+    borderRadius: 12,
+    padding: 16,
+  },
+  item: {
+    fontSize: 16,
+    marginBottom: 8,
+    color: '#333',
+  },
+  empty: {
+    textAlign: 'center',
+    marginTop: 100,
+    fontSize: 18,
+    color: '#888',
+  },
+})