import React from 'react';
import { SafeAreaView, Text, Image, Alert, Linking, View } from 'react-native';
import { inject, observer } from "mobx-react"
import { observable, makeObservable } from 'mobx'
import { images } from '../../assets/images/imageIndex';
import AsyncStorage from '@react-native-community/async-storage';
import { getStatusBarHeight } from 'react-native-status-bar-height';
import CustomLoginButton from '../../components/customLoginButton'
import Setting from '../../components/setting'
const Main = inject("appStore")(observer(class Main extends React.Component {

    settingViewAble = false

    lang = this.props.appStore.lanuageSelection
    constructor(props) {
        super(props);
        this.store = props.appStore;
        makeObservable(this, {
            settingViewAble: observable,

            lang: observable,

        })
    }
    async componentDidMount() {

    }

    render() {
        return (
            <SafeAreaView
                style={{
                    flex: 1,
                    backgroundColor: 'white',
                }}>
                <View style={{ marginTop: Platform.OS === 'ios' ? 40 : getStatusBarHeight() }}>
                    <Image style={{ marginLeft: 40, }} source={images.title.logo} />
                </View>
                <View style={{ flex: 1 }}>
                    <View style={{ flex: 0.9, justifyContent: 'center', alignItems: 'center' }}>
                        <Image source={images.main.mans} />
                        <View style={{ marginTop: 20, flexDirection: 'row', alignItems: 'center', justifyContent: 'center', }}>
                            <CustomLoginButton title={this.store.text.order} width={6} onPress={() => { this.props.navigation.navigate('InputClientData') }} />
                            <View style={{ marginLeft: 120 }} />
                            <CustomLoginButton title={this.store.text.record} width={6} onPress={() => { this.props.navigation.navigate('OrderRecord') }} />
                        </View>
                    </View>

                    <View style={{ flex: 0.1, justifyContent: 'center', alignItems: 'center', }}>


                        <Setting self={this} settingViewAble={this.settingViewAble} onPress={() => { this.settingViewAble = !this.settingViewAble }} />

                    </View>

                </View>
            </SafeAreaView>
        );
    }
}))

export default Main
