oneao/workspace
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

u

Browse Source
This commit is contained in:
oneao committed 2025-11-05 17:30:35 +08:00
1 parent ca2fa3543d
commit 7333e6695f
13 files changed
+211 -105
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

code/base-project/base-app/metro.config.js
+7 -1
View File
@@ -1,7 +1,13 @@
// Learn more https://docs.expo.io/guides/customizing-metro
// metro.config.js
const { getDefaultConfig } = require('expo/metro-config')
const { withNativeWind } = require('nativewind/metro')
/** @type {import('expo/metro-config').MetroConfig} */
const config = getDefaultConfig(__dirname)
config.resolver = {
...config.resolver,
unstable_enablePackageExports: true,
}
module.exports = withNativeWind(config, { input: './src/styles/global.css' })
code/base-project/base-app/package.json
+1
View File
@@ -15,6 +15,7 @@
"@gluestack/ui-next-adapter": "^3.0.3",
"@legendapp/motion": "^2.4.0",
"@react-native-async-storage/async-storage": "2.2.0",
"alova": "^3.3.4",
"expo": "~54.0.20",
"expo-constants": "~18.0.10",
"expo-font": "~14.0.9",
code/base-project/base-app/pnpm-lock.yaml
Generated
+22
View File
@@ -23,6 +23,9 @@ importers:
'@react-native-async-storage/async-storage':
specifier: 2.2.0
version: 2.2.0(react-native@0.81.5(@babel/core@7.28.5)(@types/react@19.1.17)(react@19.1.0))
alova:
specifier: ^3.3.4
version: 3.3.4
expo:
specifier: ~54.0.20
version: 54.0.21(@babel/core@7.28.5)(@expo/metro-runtime@6.1.2)(expo-router@6.0.14)(react-native@0.81.5(@babel/core@7.28.5)(@types/react@19.1.17)(react@19.1.0))(react@19.1.0)
@@ -108,6 +111,9 @@ packages:
resolution: {integrity: sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==}
engines: {node: '>=10'}
'@alova/shared@1.3.1':
resolution: {integrity: sha512-ijSOaFLUFcVzMKSY3avoEE5C03/p9atjMDPBwvNkwnzaCrhv6/m4A121NdadF8YlHCRuifyYfz90IyEdMXTsJg==}
'@antfu/eslint-config@6.2.0':
resolution: {integrity: sha512-ksasd+mJk441HHodwPh3Nhmwo9jSHUmgQyfTxMQM05U7SjDS0fy2KnXnPx0Vhc/CqKiJnx8wGpQCCJibyASX9Q==}
hasBin: true
@@ -2133,6 +2139,10 @@ packages:
ajv@6.12.6:
resolution: {integrity: sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==}
alova@3.3.4:
resolution: {integrity: sha512-UKKqXdvf8aQ4C7m3brO77YWe5CDz8N59PdAUz7M8gowKUUXTutbk0Vk5DRBrCe0hMUyyNMUhdCZ38llGxCViyQ==}
engines: {node: '>= 18.0.0'}
anser@1.4.10:
resolution: {integrity: sha512-hCv9AqTQ8ycjpSd3upOJd7vFwW1JaoYQ7tpham03GJ1ca8/65rqn0RpaWpItOAd6ylW9wAw6luXYPJIyPFVOww==}
@@ -4386,6 +4396,9 @@ packages:
resolution: {integrity: sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==}
engines: {node: '>= 0.6'}
rate-limiter-flexible@5.0.5:
resolution: {integrity: sha512-+/dSQfo+3FYwYygUs/V2BBdwGa9nFtakDwKt4l0bnvNB53TNT++QSFewwHX9qXrZJuMe9j+TUaU21lm5ARgqdQ==}
rc@1.2.8:
resolution: {integrity: sha512-y3bGgqKj3QBdxLbLkomlohkvsA8gdAiUQlSBJnBhfn+BPxg4bc62d8TcBW15wavDfgexCgccckhcZvywyQYPOw==}
hasBin: true
@@ -5306,6 +5319,8 @@ snapshots:
'@alloc/quick-lru@5.2.0': {}
'@alova/shared@1.3.1': {}
'@antfu/eslint-config@6.2.0(@vue/compiler-sfc@3.5.22)(eslint@9.39.0(jiti@1.21.7))(typescript@5.9.3)':
dependencies:
'@antfu/install-pkg': 1.1.0
@@ -8212,6 +8227,11 @@ snapshots:
json-schema-traverse: 0.4.1
uri-js: 4.4.1
alova@3.3.4:
dependencies:
'@alova/shared': 1.3.1
rate-limiter-flexible: 5.0.5
anser@1.4.10: {}
ansi-escapes@4.3.2:
@@ -10899,6 +10919,8 @@ snapshots:
range-parser@1.2.1: {}
rate-limiter-flexible@5.0.5: {}
rc@1.2.8:
dependencies:
deep-extend: 0.6.0
code/base-project/base-app/src/app/auth/login.tsx
+8 -14
View File
@@ -17,6 +17,7 @@ import {
} from '@/components/ui/form-control'
import { CheckIcon, EyeIcon, EyeOffIcon } from '@/components/ui/icon'
import { Input, InputField, InputIcon, InputSlot } from '@/components/ui/input'
import alovaInstance from '@/request'
import { useToast } from '@/utils/toast'
interface LoginForm {
@@ -37,20 +38,13 @@ export default function AuthLogin() {
})
const defaultLogin = () => {
if (form.username === '') {
toast.show({
title: '账号不能为空！',
action: 'error',
})
return
}
if (form.password === '') {
toast.show({
title: '密码不能为空！',
action: 'error',
})
}
//
alovaInstance.Post('/auth/login/default', {
title: 'foo',
body: 'bar',
userId: 1,
}).then((res) => {
console.log(res)
})
}
return (
code/base-project/base-app/src/app/auth/register.tsx
+22 -35
View File
@@ -1,6 +1,6 @@
import type { AFormRef } from '@/components/common/ao'
import { Lock, UserRound } from 'lucide-react-native'
import { useEffect, useRef, useState } from 'react'
import { useRef, useState } from 'react'
import { Image, ScrollView, View } from 'react-native'
import { AForm, AFormItem, AInput } from '@/components/common/ao'
@@ -11,28 +11,16 @@ interface RegisterForm {
username: string
password: string
confirmPassword: string
a: string
b: string
c: string
d: string
e: string
f: string
}
export default function AuthLogin() {
export default function AuthRegister() {
const scrollRef = useRef<ScrollView>(null)
const toast = useToast()
const [form, setForm] = useState<RegisterForm>({
username: '',
password: '',
confirmPassword: '',
a: '',
b: '',
c: '',
d: '',
e: '',
f: '',
})
const [loading, setLoading] = useState(false)
const formRef = useRef<AFormRef>(null)
@@ -41,7 +29,7 @@ export default function AuthLogin() {
setForm(prev => ({ ...prev, [field]: value }))
}
const defaultLogin = () => {
const handleRegister = () => {
if (formRef.current?.validate()) {
setLoading(true)
toast.show({ title: '校验通过，开始注册', action: 'success' })
@@ -55,10 +43,18 @@ export default function AuthLogin() {
return (
<ScrollView ref={scrollRef} style={{ flex: 1 }}>
<View className="flex flex-col items-center px-6">
<Image source={require('@/static/images/logo.png')} style={{ width: 120, height: 120 }} className="my-12" />
<Image
source={require('@/static/images/logo.png')}
style={{ width: 120, height: 120 }}
className="my-12"
/>
<AForm ref={formRef} form={form} scrollRef={scrollRef}>
<AFormItem name="username" label="账号" isRequired>
<AFormItem
name="username"
label="账号"
isRequired
>
<AInput
placeholder="请输入账号"
leftIcon={UserRound}
@@ -70,9 +66,9 @@ export default function AuthLogin() {
<AFormItem
name="password"
label="密码"
isRequired
rules={[
(val: any) => val && !/\d{6}/.test(val) ? '请输入6位数字密码' : null,
{ required: true, message: '密码是必填项' },
{ pattern: /^\d{6}$/, message: '请输入6位数字密码' },
]}
>
<AInput
@@ -87,9 +83,12 @@ export default function AuthLogin() {
<AFormItem
name="confirmPassword"
label="确认密码"
isRequired
rules={[
(val: any) => val !== form.password ? '两次密码不一致' : null,
{ required: true, message: '确认密码是必填项' },
{
validator: val => val === form.password,
message: '两次密码不一致',
},
]}
>
<AInput
@@ -100,21 +99,9 @@ export default function AuthLogin() {
onChange={text => handleInputChange('confirmPassword', text)}
/>
</AFormItem>
{/* 其他表单项 */}
{['a', 'b', 'c', 'd', 'e', 'f'].map(field => (
<AFormItem key={field} name={field} label={field} isRequired>
<AInput
placeholder="请输入"
isPassword
value={form[field]}
onChange={text => handleInputChange(field, text)}
/>
</AFormItem>
))}
</AForm>
<Button className="w-full mb-4" onPress={defaultLogin} disabled={loading}>
<Button className="w-full mb-4" onPress={handleRegister} disabled={loading}>
{loading
? (
<>
code/base-project/base-app/src/components/common/ao/Form.tsx
+17 -30
View File
@@ -1,19 +1,19 @@
import type { ScrollView } from 'react-native'
import React, { createContext, forwardRef, useCallback, useEffect, useImperativeHandle, useRef } from 'react'
import React, { createContext, forwardRef, useCallback, useImperativeHandle, useRef } from 'react'
export interface FormRef {
validate: () => boolean
scrollToField: (name: string) => void // 新增的滚动方法
scrollToField: (name: string) => void
}
interface FormProps<T extends Record<string, any>> {
interface FormProps {
children: React.ReactNode
form: T
scrollRef: React.RefObject<ScrollView>
form: Record<string, any>
scrollRef: React.RefObject<ScrollView | null>
}
interface FormContextType<T = any> {
form: T
interface FormContextType {
form: Record<string, any>
registerValidator: (name: string, validator: () => boolean) => void
unregisterValidator: (name: string) => void
registerFieldPosition: (name: string, y: number) => void
@@ -21,19 +21,16 @@ interface FormContextType<T = any> {
export const FormContext = createContext<FormContextType | undefined>(undefined)
const Form = forwardRef<FormRef, FormProps<any>>(({ children, form, scrollRef }, ref) => {
// 使用 Array 来代替 Map
const validatorsRef = useRef<Array<{ name: string, validator: () => boolean }>>([]) // 持有验证器顺序
const fieldPositions = useRef<Map<string, number>>(new Map()) // 用来存储每个字段的 Y 坐标
const Form = forwardRef<FormRef, FormProps>(({ children, form, scrollRef }, ref) => {
const validatorsRef = useRef<Array<{ name: string, validator: () => boolean }>>([])
const fieldPositions = useRef<Map<string, number>>(new Map())
const registerValidator = useCallback((name: string, validator: () => boolean) => {
console.log(`注册：${name}`)
validatorsRef.current.push({ name, validator })
}, [])
const unregisterValidator = useCallback((name: string) => {
console.log(`移除：${name}`)
validatorsRef.current = validatorsRef.current.filter(validator => validator.name !== name)
validatorsRef.current = validatorsRef.current.filter(v => v.name !== name)
}, [])
const registerFieldPosition = useCallback((name: string, y: number) => {
@@ -44,34 +41,24 @@ const Form = forwardRef<FormRef, FormProps<any>>(({ children, form, scrollRef },
let firstErrorField: string | null = null
let isValid = true
// 按顺序遍历所有的验证器
for (const { name, validator } of validatorsRef.current) {
const ok = validator()
if (!ok && !firstErrorField) {
// 如果遇到第一个验证失败的字段，记录下来
if (!validator() && !firstErrorField) {
firstErrorField = name
isValid = false
}
}
if (isValid)
return true
// 滚动到第一个错误字段
if (firstErrorField) {
if (!isValid && firstErrorField) {
scrollToField(firstErrorField)
}
return false
return isValid
}
const scrollToField = (name: string) => {
if (scrollRef.current) {
const y = fieldPositions.current.get(name)
if (y !== undefined && scrollRef.current) {
scrollRef.current.scrollTo({ y, animated: true })
}
const y = fieldPositions.current.get(name)
if (y !== undefined && scrollRef.current) {
scrollRef.current.scrollTo({ y, animated: true })
}
}
code/base-project/base-app/src/components/common/ao/FormItem.tsx
+96 -17
View File
@@ -1,5 +1,4 @@
import React, { useContext, useEffect, useState } from 'react'
import { View } from 'react-native'
import {
FormControl,
FormControlError,
@@ -11,10 +10,21 @@ import {
import { AlertCircleIcon } from '@/components/ui/icon'
import { FormContext } from './Form'
interface RuleType {
validator?: (val: any) => boolean
pattern?: RegExp
message?: string
len?: number
min?: number
max?: number
required?: boolean
whitespace?: boolean
}
interface FormItemProps<T> {
name: keyof T
label?: string
rules?: ((val: any) => string | null)[]
rules?: RuleType[]
children: React.ReactNode
isRequired?: boolean
}
@@ -33,21 +43,87 @@ function FormItem<T extends Record<string, any>>({
if (!context)
return
const { registerValidator, unregisterValidator } = context
const currentName = String(name)
const validator = () => {
const value = context.form[name]
// 如果 isRequired 为 true，且 rules 中没有 required: true，则自动加
const hasRequiredInRules = rules.some(rule => rule.required)
const allRules = [...rules]
if (isRequired && !hasRequiredInRules) {
allRules.unshift({
required: true,
message: label ? `${label} 是必填项` : `${currentName} 是必填项`,
})
}
if (isRequired && (value === undefined || value === null || value === '' || value.length === 0)) {
setError(`${String(label || name)} 是必填项`)
return false
}
const validateFn = () => {
const value = context.form[currentName]
for (const rule of rules) {
const msg = rule(value)
if (msg) {
setError(msg)
return false
for (const rule of allRules) {
// 1. required 校验
if (rule.required) {
const empty
= value === undefined
|| value === null
|| value === ''
|| (Array.isArray(value) && value.length === 0)
|| (rule.whitespace && typeof value === 'string' && value.trim() === '')
if (empty) {
setError(rule.message || `${label || currentName} 校验不通过`)
return false
}
}
// 2. 自定义 validator 返回 true/false
if (rule.validator !== undefined) {
const ok = rule.validator(value)
if (!ok) {
setError(rule.message || `${label || currentName} 校验不通过`)
return false
}
}
// 3. pattern 正则
if (rule.pattern && typeof value === 'string') {
if (!rule.pattern.test(value)) {
setError(rule.message || `${label || currentName} 格式不正确`)
return false
}
}
// 4. len
if (rule.len !== undefined) {
if (
(typeof value === 'string' && value.length !== rule.len)
|| (typeof value === 'number' && value !== rule.len)
|| (Array.isArray(value) && value.length !== rule.len)
) {
setError(rule.message || `${label || currentName} 长度/值必须为 ${rule.len}`)
return false
}
}
// 5. min
if (rule.min !== undefined) {
if (
(typeof value === 'string' && value.length < rule.min)
|| (typeof value === 'number' && value < rule.min)
|| (Array.isArray(value) && value.length < rule.min)
) {
setError(rule.message || `${label || currentName} 最小值/长度为 ${rule.min}`)
return false
}
}
// 6. max
if (rule.max !== undefined) {
if (
(typeof value === 'string' && value.length > rule.max)
|| (typeof value === 'number' && value > rule.max)
|| (Array.isArray(value) && value.length > rule.max)
) {
setError(rule.message || `${label || currentName} 最大值/长度为 ${rule.max}`)
return false
}
}
}
@@ -55,9 +131,12 @@ function FormItem<T extends Record<string, any>>({
return true
}
registerValidator(String(name), validator)
return () => unregisterValidator(String(name))
}, [name])
context.registerValidator(currentName, validateFn)
return () => {
context.unregisterValidator(currentName)
}
}, [context, name, label, rules, isRequired])
const handleLayout = (event: any) => {
const { y } = event.nativeEvent.layout
code/base-project/base-app/src/request/index.ts
+21
View File
@@ -0,0 +1,21 @@
import { createAlova } from 'alova'
import { createServerTokenAuthentication } from 'alova/client'
import adapterFetch from 'alova/fetch'
const { onAuthRequired, onResponseRefreshToken } = createServerTokenAuthentication({
// ...
})
const alovaInstance = createAlova({
baseURL: 'http://192.168.1.136:8085/app',
requestAdapter: adapterFetch(),
// ...
beforeRequest: onAuthRequired((method) => {
// ...原请求前拦截器
}),
responded: onResponseRefreshToken((response, method) => {
// ...原响应成功拦截器
return response.json()
}),
})
export default alovaInstance