import React, {PureComponent} from 'react' import {Flex, WhiteSpace, List} from 'antd-mobile' import './index.scss' import Avatar from './image/avatar.png' import Vip from './image/vip.png' import {WithTab} from '@/HOCs' import {Link} from "react-router-dom" import {connect} from "react-redux" import {HeaderBar} from "@/common" import {getCourses} from './../detail/actions'; const Item = List.Item; const Brief = Item.Brief; @connect(state => ({ user: state.user })) class My extends PureComponent { constructor(props) { super(props) this.state = { data: [] } } // 去登录 toLogin = () => { this.props.history.push('/passport') } toCourseDetail = (id) => { const { dispatch, history } = this.props; // dispatch(getCourses(id, () => { history.push(`/detail?id=${id}`); return false; // })); } render() { const {user} = this.props const uid = user && user.data && user.data.uid const username = user && user.data && user.data.username const avatar = user && user.data && user.data.avatar const isVIP = user && user.data && user.data.isVIP let list if (!uid) { list = <List className="my-list"> <Item className="avatar-wrap" arrow="horizontal" multipleLine thumb={Avatar} onClick={this.toLogin}> <Brief>点击登录</Brief> </Item> </List> } else { list = <List className="my-list"> <Link to='/myedit'> <Item className="avatar-wrap" arrow="horizontal" multipleLine thumb={avatar} > <Brief> {username} { isVIP === 1 && <img src={Vip} className='vip' alt=""/> } </Brief> <Brief style={{fontSize: "12px"}}>学号: {uid}</Brief> </Item> </Link> { !isVIP && <a href="javascript:;" className="my-isvip" onClick={() => this.toCourseDetail(139)}></a> } </List> } return ( <div className="flex-container"> <Flex> <Flex.Item> <HeaderBar title='我的' arrow={false} cart={false}></HeaderBar> {list} { !uid && <div className="am-list-header"></div> } <List className="my-list-content"> <Link to='/purchased'> <Item arrow="horizontal"> <i className="iconfont iconiconfront-27"></i> 已购课程 </Item> </Link> <Link to='/shopcart'> <Item arrow="horizontal"> <i className="iconfont icongouwuche-xianxing"></i> 购物车 </Item> </Link> <Link to='/myorders'> <Item arrow="horizontal"> <i className="iconfont iconiconfront-24"></i> 课程订单 </Item> </Link> <Link to={{ pathname: '/coupons', state: { from: this.props.location.pathname } }}> <Item arrow="horizontal" className="no-border"> <i className="iconfont iconiconfront-52"></i> 优惠券 </Item> </Link> <div className="am-list-header"></div> <Link to='/scholarship'> <Item arrow="horizontal" className='btm-scholarship'> <i className="iconfont iconiconfront-51"></i> 赚奖学金 </Item> </Link> </List> </Flex.Item> </Flex> <WhiteSpace size="lg"/> </div> ) } } export default WithTab(My);