import React, { Component } from 'react'
import {
  StyleSheet,
  ScrollView,
  View,
  Image,
  ImageBackground,
  Text,
  Dimensions,
  StatusBar,
  TouchableOpacity,
} from 'react-native'
import { connect } from 'react-redux'

import { Button } from '../../components'
import Icon from '../../components/Iconfont/Iconfont'
import { NavigationActions, createAction } from '../../utils'
import {
  CarouselHorizontal,
  CarouselVertical,
} from '../../components/carousel/index'
import Input from '../../components/input/index'
import Bubble from '../../components/Bubble'
// import png from "../../static/images/banner.png";
import Grid from '../../components/Grid'

const { width, height } = Dimensions.get('window')

@connect(({ theme, home }) => ({ ...theme, ...home }))
class RecentView extends Component {
  constructor(props) {
    super(props)
    this.state = {
      headercol: 'transparent',
      inputtx: '#CCC',
      inputbacg: '#FFF',
      messcol: '#FFF',
      barStyle: props.appTheme.barStyle,
    }
    // console.disableYellowBox = true;
  }
  static navigationOptions = {
    title: '最近浏览',
  }

  render() {
    const { appTheme, recentDatas } = this.props
    return (
      <View
        style={[
          styles.container,
          { backgroundColor: appTheme.backgroundColor },
        ]}
      >
        <Grid
          titleName="最近浏览"
          data={recentDatas}
          nameKey="name"
          pictureKey="pictureUrl"
          priceKey="salePrice"
          keyext="code"
          titleBool={false}
        />
      </View>
    )
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },

  pngstyle: {
    width: width,
  },
  buttonStyle: {
    backgroundColor: 'transparent',
    flexDirection: 'column',
    alignItems: 'center',
  },
  buttonText: {
    marginTop: 9,
    fontSize: 14,
    color: '#FFF',
  },
})

export default RecentView