Initial commit
This commit is contained in:
87
views/Guide/index.jsx
Normal file
87
views/Guide/index.jsx
Normal file
@@ -0,0 +1,87 @@
|
||||
import { useState, useEffect } from 'react';
|
||||
import {
|
||||
View,
|
||||
Text,
|
||||
TextInput,
|
||||
TouchableOpacity,
|
||||
Image,
|
||||
StyleSheet,
|
||||
Alert,
|
||||
StatusBar
|
||||
} from 'react-native';
|
||||
|
||||
import { Toast, Button } from '@ant-design/react-native';
|
||||
import { useContextHook } from '@/components/AuthContext/index';
|
||||
|
||||
import AsyncStorage from '@/storage/index';
|
||||
import { useRouter } from '@/hooks/useRouter';
|
||||
|
||||
import {
|
||||
statusBarHeight,
|
||||
paddingTopStatusBarHeight,
|
||||
flexRow,
|
||||
flexColumn,
|
||||
flexSub,
|
||||
flexShrink,
|
||||
flexWrap,
|
||||
flexnoWrap,
|
||||
justifyStart,
|
||||
justifyEnd,
|
||||
justifyCenter,
|
||||
justifyBetween,
|
||||
justifyAround,
|
||||
justifyEvenly,
|
||||
alignItemsStart,
|
||||
alignItemsEnd,
|
||||
alignItemsCenter,
|
||||
alignItemsStretch,
|
||||
positionRelative,
|
||||
positionAbsolute,
|
||||
useStyles,
|
||||
} from '@/assets/styles/css';
|
||||
|
||||
const Index = () => {
|
||||
const { themeColor } = useContextHook();
|
||||
const { linkTo, resetAllRoutes, isFocused } = useRouter();
|
||||
useEffect(() => {
|
||||
const user = AsyncStorage.getItemAsync('user');
|
||||
// 这里请求配置后,再跳转
|
||||
setTimeout(() => {
|
||||
console.log('user', user);
|
||||
if (user && user.token) {
|
||||
resetAllRoutes('Home');
|
||||
} else {
|
||||
resetAllRoutes('Login');
|
||||
}
|
||||
}, 1000);
|
||||
}, [isFocused]);
|
||||
|
||||
return (
|
||||
<View style={[flexSub, {}]}>
|
||||
<View
|
||||
style={[
|
||||
flexSub,
|
||||
justifyCenter,
|
||||
alignItemsCenter,
|
||||
flexRow
|
||||
]}>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 24,
|
||||
fontWeight: 'bold',
|
||||
backgroundColor: 'red',
|
||||
}}>
|
||||
login111
|
||||
</Text>
|
||||
<Button type="primary" onPress={() => {
|
||||
Toast.show({
|
||||
content: 'Please enter user name',
|
||||
position: 'center',
|
||||
mask: true,
|
||||
});
|
||||
}}>Click me</Button>
|
||||
</View>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
export default Index;
|
||||
64
views/Home/Index/index.jsx
Normal file
64
views/Home/Index/index.jsx
Normal file
@@ -0,0 +1,64 @@
|
||||
import { useState, useEffect } from 'react';
|
||||
import {
|
||||
View,
|
||||
Text,
|
||||
TextInput,
|
||||
TouchableOpacity,
|
||||
Image,
|
||||
StyleSheet,
|
||||
Alert,
|
||||
} from 'react-native';
|
||||
|
||||
import { Provider, Toast } from '@ant-design/react-native';
|
||||
|
||||
import {
|
||||
statusBarHeight,
|
||||
paddingTopStatusBarHeight,
|
||||
flexRow,
|
||||
flexColumn,
|
||||
flexSub,
|
||||
flexShrink,
|
||||
flexWrap,
|
||||
flexnoWrap,
|
||||
justifyStart,
|
||||
justifyEnd,
|
||||
justifyCenter,
|
||||
justifyBetween,
|
||||
justifyAround,
|
||||
justifyEvenly,
|
||||
alignItemsStart,
|
||||
alignItemsEnd,
|
||||
alignItemsCenter,
|
||||
alignItemsStretch,
|
||||
positionRelative,
|
||||
positionAbsolute,
|
||||
useStyles,
|
||||
} from '@/assets/styles/css';
|
||||
|
||||
const Index = () => {
|
||||
useEffect(() => {
|
||||
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<View
|
||||
style={[
|
||||
flexSub,
|
||||
justifyCenter,
|
||||
alignItemsCenter,
|
||||
{
|
||||
backgroundColor: '#000',
|
||||
},
|
||||
]}>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 24,
|
||||
fontWeight: 'bold',
|
||||
marginBottom: 20,
|
||||
}}>
|
||||
index
|
||||
</Text>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
export default Index;
|
||||
64
views/Home/Inventory/index.jsx
Normal file
64
views/Home/Inventory/index.jsx
Normal file
@@ -0,0 +1,64 @@
|
||||
import { useState, useEffect } from 'react';
|
||||
import {
|
||||
View,
|
||||
Text,
|
||||
TextInput,
|
||||
TouchableOpacity,
|
||||
Image,
|
||||
StyleSheet,
|
||||
Alert,
|
||||
} from 'react-native';
|
||||
|
||||
import { Provider, Toast } from '@ant-design/react-native';
|
||||
|
||||
import {
|
||||
statusBarHeight,
|
||||
paddingTopStatusBarHeight,
|
||||
flexRow,
|
||||
flexColumn,
|
||||
flexSub,
|
||||
flexShrink,
|
||||
flexWrap,
|
||||
flexnoWrap,
|
||||
justifyStart,
|
||||
justifyEnd,
|
||||
justifyCenter,
|
||||
justifyBetween,
|
||||
justifyAround,
|
||||
justifyEvenly,
|
||||
alignItemsStart,
|
||||
alignItemsEnd,
|
||||
alignItemsCenter,
|
||||
alignItemsStretch,
|
||||
positionRelative,
|
||||
positionAbsolute,
|
||||
useStyles,
|
||||
} from '@/assets/styles/css';
|
||||
|
||||
const Index = () => {
|
||||
useEffect(() => {
|
||||
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<View
|
||||
style={[
|
||||
flexSub,
|
||||
justifyCenter,
|
||||
alignItemsCenter,
|
||||
{
|
||||
backgroundColor: '#fff',
|
||||
},
|
||||
]}>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 24,
|
||||
fontWeight: 'bold',
|
||||
marginBottom: 20,
|
||||
}}>
|
||||
Inventory
|
||||
</Text>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
export default Index;
|
||||
64
views/Home/Profile/index.jsx
Normal file
64
views/Home/Profile/index.jsx
Normal file
@@ -0,0 +1,64 @@
|
||||
import { useState, useEffect } from 'react';
|
||||
import {
|
||||
View,
|
||||
Text,
|
||||
TextInput,
|
||||
TouchableOpacity,
|
||||
Image,
|
||||
StyleSheet,
|
||||
Alert,
|
||||
} from 'react-native';
|
||||
|
||||
import { Provider, Toast } from '@ant-design/react-native';
|
||||
|
||||
import {
|
||||
statusBarHeight,
|
||||
paddingTopStatusBarHeight,
|
||||
flexRow,
|
||||
flexColumn,
|
||||
flexSub,
|
||||
flexShrink,
|
||||
flexWrap,
|
||||
flexnoWrap,
|
||||
justifyStart,
|
||||
justifyEnd,
|
||||
justifyCenter,
|
||||
justifyBetween,
|
||||
justifyAround,
|
||||
justifyEvenly,
|
||||
alignItemsStart,
|
||||
alignItemsEnd,
|
||||
alignItemsCenter,
|
||||
alignItemsStretch,
|
||||
positionRelative,
|
||||
positionAbsolute,
|
||||
useStyles,
|
||||
} from '@/assets/styles/css';
|
||||
|
||||
const Index = () => {
|
||||
useEffect(() => {
|
||||
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<View
|
||||
style={[
|
||||
flexSub,
|
||||
justifyCenter,
|
||||
alignItemsCenter,
|
||||
{
|
||||
backgroundColor: '#fff',
|
||||
},
|
||||
]}>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 24,
|
||||
fontWeight: 'bold',
|
||||
marginBottom: 20,
|
||||
}}>
|
||||
Profile
|
||||
</Text>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
export default Index;
|
||||
195
views/Login/index.jsx
Normal file
195
views/Login/index.jsx
Normal file
@@ -0,0 +1,195 @@
|
||||
import { useState, useEffect } from 'react';
|
||||
import {
|
||||
View,
|
||||
Text,
|
||||
TextInput,
|
||||
TouchableOpacity,
|
||||
Image,
|
||||
StyleSheet,
|
||||
Alert,
|
||||
} from 'react-native';
|
||||
import { Provider, Toast } from '@ant-design/react-native';
|
||||
|
||||
|
||||
import AsyncStorage from '@/storage/index';
|
||||
import { useNavigation, useIsFocused } from '@react-navigation/native';
|
||||
import { useContextHook } from '@/components/AuthContext';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
import {
|
||||
statusBarHeight,
|
||||
paddingTopStatusBarHeight,
|
||||
flexRow,
|
||||
flexColumn,
|
||||
flexSub,
|
||||
flexShrink,
|
||||
flexWrap,
|
||||
flexnoWrap,
|
||||
justifyStart,
|
||||
justifyEnd,
|
||||
justifyCenter,
|
||||
justifyBetween,
|
||||
justifyAround,
|
||||
justifyEvenly,
|
||||
alignItemsStart,
|
||||
alignItemsEnd,
|
||||
alignItemsCenter,
|
||||
alignItemsStretch,
|
||||
positionRelative,
|
||||
positionAbsolute,
|
||||
useStyles,
|
||||
} from '@/assets/styles/css';
|
||||
|
||||
|
||||
const inputItem = useStyles({
|
||||
width: '80%',
|
||||
height: 40,
|
||||
borderColor: 'gray',
|
||||
borderWidth: 1,
|
||||
borderRadius: 5,
|
||||
paddingHorizontal: 10,
|
||||
marginBottom: 20,
|
||||
});
|
||||
|
||||
const LoginScreen = () => {
|
||||
const { themeColor } = useContextHook();
|
||||
const { t, i18n } = useTranslation();
|
||||
console.log('🚀 ~ LoginScreen ~ i18n:', i18n)
|
||||
|
||||
const router = useNavigation();
|
||||
const [language, setLanguage] = useState('en');
|
||||
|
||||
const isFocused = useIsFocused();
|
||||
|
||||
const [username, setUsername] = useState('');
|
||||
const [password, setPassword] = useState('');
|
||||
const [loading, setLoading] = useState(false);
|
||||
useEffect(() => {
|
||||
|
||||
}, [isFocused]);
|
||||
|
||||
const handleLogin = () => {
|
||||
if (!username) {
|
||||
Toast.show({
|
||||
content: t('Please enter user name'),
|
||||
position: 'center',
|
||||
mask: true,
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (!password) {
|
||||
Toast.show({
|
||||
content: t('Please enter password'),
|
||||
position: 'center',
|
||||
mask: true,
|
||||
});
|
||||
return;
|
||||
}
|
||||
const key = Toast.show({
|
||||
icon: 'loading',
|
||||
content: t('loading'),
|
||||
position: 'center',
|
||||
mask: true,
|
||||
duration: 0,
|
||||
});
|
||||
console.log(123,123);
|
||||
// login({ username, password })
|
||||
// .then(res => {
|
||||
// Toast.remove(key);
|
||||
// setTimeout(() => {
|
||||
// Toast.show({
|
||||
// content: t('login success'), //i18n.t('login_success'),
|
||||
// position: 'center',
|
||||
// mask: true,
|
||||
// onClose: () => {
|
||||
// // 设置全局的用户信息
|
||||
// setUser(res.user)
|
||||
// AsyncStorage.setItem('appToken', {
|
||||
// appToken: res.token,
|
||||
// user: res.user,
|
||||
// }).then(() => {
|
||||
// router.replace('Home');
|
||||
// });
|
||||
// },
|
||||
// });
|
||||
// }, 200);
|
||||
// })
|
||||
// .catch(err => {
|
||||
// Toast.remove(key);
|
||||
// setTimeout(() => {
|
||||
// Toast.show({
|
||||
// content: t('login_failed'), // i18n.t('login_failed'),
|
||||
// position: 'center',
|
||||
// mask: true,
|
||||
// });
|
||||
// }, 200);
|
||||
// // i18n.t('login_error_message')
|
||||
// });
|
||||
};
|
||||
|
||||
return (
|
||||
<View
|
||||
style={[
|
||||
flexSub,
|
||||
justifyCenter,
|
||||
alignItemsCenter,
|
||||
{
|
||||
backgroundColor: themeColor.colorBgBase,
|
||||
},
|
||||
]}>
|
||||
<View style={[{ padding: 20 }]}>
|
||||
<Image
|
||||
source={require('@/assets/images/logo.png')}
|
||||
style={[
|
||||
{
|
||||
width: 300,
|
||||
height: 150,
|
||||
resizeMode: 'contain',
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</View>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 24,
|
||||
fontWeight: 'bold',
|
||||
marginBottom: 20,
|
||||
}}>
|
||||
{t('login')}
|
||||
</Text>
|
||||
<TextInput
|
||||
style={[inputItem]}
|
||||
placeholder={t('username')}
|
||||
value={username}
|
||||
onChangeText={setUsername}
|
||||
autoCapitalize="none"
|
||||
keyboardType="default"
|
||||
/>
|
||||
<TextInput
|
||||
style={[inputItem]}
|
||||
placeholder={t('password')}
|
||||
value={password}
|
||||
onChangeText={setPassword}
|
||||
secureTextEntry
|
||||
/>
|
||||
<TouchableOpacity
|
||||
style={{
|
||||
width: '80%',
|
||||
backgroundColor: '#7ac0f6',
|
||||
borderRadius: 5,
|
||||
paddingVertical: 10,
|
||||
}}
|
||||
onPress={handleLogin}>
|
||||
<Text
|
||||
style={{
|
||||
color: '#fff',
|
||||
textAlign: 'center',
|
||||
fontSize: 18,
|
||||
}}>
|
||||
{t('login')}
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
export default LoginScreen;
|
||||
Reference in New Issue
Block a user