import React, { Component } from 'react';
import { View, StyleSheet, Text } from 'react-native';
import { connect } from 'react-redux';
import SplashScreen from 'react-native-splash-screen';
import { createAction } from '../utils/index';
import PercentageCircle from '../components/roundProgressBarComponent';

@connect(({ welcome }) => ({ welcome }))
class WelcomeScreen extends Component {
  componentDidMount() {
    const { dispatch } = this.props;
    dispatch(createAction('welcome/init')());

    SplashScreen.hide();// 隐藏启动平
  }
  IsUpdate = () => {
    if (this.props.welcome.promptText !== '') {
      return <PercentageCircle radius={60} percent={this.props.welcome.percent} color="#3498db" />;
    }
  };
  // 待改进，改成启动页，目前因为时间和技术的问题，搁置。wq write
  render() {
    return (
      <View style={styles.container}>
        <Text>{this.props.welcome.promptText === '' ? 'welcome' : this.props.welcome.promptText}</Text>
        <View>
          {
            this.IsUpdate()
          }
        </View>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#ffffff',
  },
  img: {
    flex: 1,
    width: 400,
    height: 200,
    resizeMode: 'contain',
  },
});


export default WelcomeScreen;
