Reza_ashrafi
3 years ago
parent
2318ade15d
commit
0c0bd6e35f
3 changed files with 216 additions and 5 deletions
@ -0,0 +1,206 @@ |
||||
import { |
||||
View, |
||||
Text, |
||||
ScrollView, |
||||
Platform, |
||||
StyleSheet, |
||||
SafeAreaView, |
||||
StatusBar, |
||||
Dimensions, |
||||
Pressable, |
||||
} from "react-native"; |
||||
import { connect } from "react-redux"; |
||||
import React from "react"; |
||||
|
||||
//components
|
||||
import Navbar from "../../components/Navbar"; |
||||
|
||||
//style
|
||||
import fontSize from "../../constants/fontSize"; |
||||
import tw from "tailwind-rn"; |
||||
import Colors from "../../constants/Colors"; |
||||
|
||||
//variables
|
||||
const ios = Platform.OS === "ios"; |
||||
const { width } = Dimensions.get("window"); |
||||
|
||||
const Rules = ({ route, mobile, theme }) => { |
||||
const [active, setActive] = React.useState(0); |
||||
const styles = React.useMemo(() => { |
||||
return StyleSheet.create({ |
||||
contentContainerStyle: { |
||||
paddingBottom: 100, |
||||
}, |
||||
container: { |
||||
backgroundColor: "white", |
||||
flexDirection: "column", |
||||
paddingVertical: 5, |
||||
paddingHorizontal: 16, |
||||
}, |
||||
}); |
||||
}, [route]); |
||||
|
||||
const items = React.useMemo(() => { |
||||
return [ |
||||
{ |
||||
title: "آیا استفاده از سامانه دانوین هزینه دارد؟", |
||||
description: |
||||
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد ", |
||||
}, |
||||
{ |
||||
title: "چگونه می توان در سامانه عضو شد؟", |
||||
description: |
||||
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد ", |
||||
}, |
||||
{ |
||||
title: "چگونه می توان در سامانه عضو شد؟", |
||||
description: |
||||
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد ", |
||||
}, |
||||
{ |
||||
title: "چگونه می توان در سامانه عضو شد؟", |
||||
description: |
||||
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد ", |
||||
}, |
||||
]; |
||||
}, [route]); |
||||
|
||||
return ( |
||||
<SafeAreaView |
||||
style={{ |
||||
paddingTop: Platform.OS === "android" ? StatusBar.currentHeight : 0, |
||||
position: "relative", |
||||
}} |
||||
> |
||||
<Navbar |
||||
headerOptions={{ |
||||
logo: false, |
||||
menu: false, |
||||
hamburgerMenu: false, |
||||
title: "شرایط، قوانین استفاده و راهنما", |
||||
bookmark: false, |
||||
qr: false, |
||||
back: true, |
||||
}} |
||||
/> |
||||
<ScrollView |
||||
contentContainerStyle={styles.contentContainerStyle} |
||||
style={styles.container} |
||||
> |
||||
<Switch theme={theme} active={active} setActive={setActive} /> |
||||
<Text |
||||
numberOfLines={1} |
||||
adjustsFontSizeToFit |
||||
style={[ |
||||
tw("text-center my-3 p-2 rounded-sm"), |
||||
{ |
||||
fontFamily: "bold", |
||||
fontSize: fontSize.sm, |
||||
color: Colors.theme1[theme].redC0, |
||||
backgroundColor: Colors.theme1[theme].redFF, |
||||
}, |
||||
]} |
||||
> |
||||
شما در حال مشاهده شرایط و قوانین استفاده از سامانه هستید |
||||
</Text> |
||||
{items.map((rule, index) => ( |
||||
<Rule rule={rule} key={index} theme={theme} /> |
||||
))} |
||||
</ScrollView> |
||||
</SafeAreaView> |
||||
); |
||||
}; |
||||
|
||||
const Switch = ({ theme, active, setActive }) => { |
||||
return ( |
||||
<View |
||||
style={[ |
||||
tw("w-full flex flex-row"), |
||||
{ borderWidth: 1, borderColor: Colors.theme1[theme].green79 }, |
||||
]} |
||||
> |
||||
<Pressable |
||||
style={[ |
||||
tw("flex-1 py-3 flex flex-row justify-center"), |
||||
{ |
||||
backgroundColor: active |
||||
? Colors.theme1[theme].blueFF1 |
||||
: "transparent", |
||||
}, |
||||
]} |
||||
onPress={() => setActive(1)} |
||||
> |
||||
<Text |
||||
style={{ |
||||
fontFamily: "regular", |
||||
fontSize: fontSize.tiny, |
||||
color: Colors.theme1[theme].green79, |
||||
}} |
||||
> |
||||
راهنمای استفاده |
||||
</Text> |
||||
</Pressable> |
||||
<View style={[tw("w-px h-full")]}></View> |
||||
<Pressable |
||||
style={[ |
||||
tw("flex-1 py-3 flex flex-row justify-center"), |
||||
{ |
||||
backgroundColor: !active |
||||
? Colors.theme1[theme].green79 + '11' |
||||
: "transparent", |
||||
}, |
||||
]} |
||||
onPress={() => setActive(0)} |
||||
> |
||||
<Text |
||||
style={{ |
||||
fontFamily: "regular", |
||||
fontSize: fontSize.tiny, |
||||
color: Colors.theme1[theme].green79, |
||||
}} |
||||
> |
||||
شرایط و قوانین |
||||
</Text> |
||||
</Pressable> |
||||
</View> |
||||
); |
||||
}; |
||||
|
||||
const Rule = ({ rule, theme }) => { |
||||
return ( |
||||
<View style={tw("flex mb-3")}> |
||||
<Text |
||||
style={[ |
||||
tw("mb-1 p-2 rounded-sm"), |
||||
{ |
||||
fontFamily: "bold", |
||||
fontSize: fontSize.sm, |
||||
color: Colors.theme1[theme].green79, |
||||
backgroundColor: Colors.theme1[theme].green79 + '11', |
||||
}, |
||||
]} |
||||
> |
||||
{rule.title} |
||||
</Text> |
||||
<Text |
||||
style={[ |
||||
tw("p-2 rounded-sm leading-6"), |
||||
{ |
||||
fontFamily: "regular", |
||||
fontSize: fontSize.sm, |
||||
color: Colors.theme1[theme].gray20, |
||||
}, |
||||
]} |
||||
> |
||||
{rule.description} |
||||
</Text> |
||||
</View> |
||||
); |
||||
}; |
||||
|
||||
const mapStateToProps = (state) => ({ |
||||
mobile: state.publicApi.mobile, |
||||
theme: state.publicApi.theme, |
||||
}); |
||||
|
||||
export default connect(mapStateToProps)(Rules); |
||||
Loading…
Reference in new issue