import React Component from reactimport indexscssimport Swiper from antd-mobileimport connect from react-redux;import addCartAction from storeactionscart;import axios from axios;import phone1

import React, { Component } from 'react' import './index.scss' import { Swiper } from 'antd-mobile' import { connect } from 'react-redux'; import { addCartAction } from '../../store/actions/cart'; import axios from 'axios';

import phone1 from '../../img/phone2.png' import phone2 from '../../img/phone3.png' import phone3 from '../../img/phone4.png'

class CartContent extends Component { state = { img: [], itemObj: {}, } componentDidMount() { console.log(this.props); const { id } = this.props.match.params; axios.get(/queryPrdDisplayDetailInfo?portal=21&version=350&lang=zh-CN&country=CNQX&_areacode=CNQX&beCode=CNQX&item_id=${id}&sbomCode=8086110027003&productId=${id}).then(res => { console.log(res); this.setState({ itemObj: res.data, img: res.data.sbomList[0].groupPhotoList }) }) }

addCartFn = () => {
    const { token } = this.props;
    if (token !== '') {
        const { disPrdId, name } = this.state.itemObj;
        const { photoPath, photoName } = this.state.itemObj.sbomList[0]
        const data = {
            id: disPrdId,
            name: name,
            num: 1,
            price: this.state.itemObj.sbomList[0].price || 0,
            pic: `https://hshop.honorfile.com/pimages/cnqx/${photoPath}800_800_${photoName}`
        }
        this.props.addCartAction(data);
        Navigate('/Cart')
    } else {
        Navigate('/Login')
    }
}

render() {
    const { itemObj } = this.state;
    const { img } = this.state;
    const { token } = this.props;

    return (
        <div className='cart_content'>
            <Swiper loop>
                {img.map((item, index) => <Swiper.Item key={index}>
                    <img src={'https://hshop.honorfile.com/pimages/cnqx/' + item.photoPath + '800_800_' + item.photoName} alt="" />
                </Swiper.Item>)}
            </Swiper>
            <div className="titl">
                {
                    itemObj.sbomList != undefined ? <div className='pric'>￥{itemObj.sbomList[0].price}</div> : ""
                }
                {
                    itemObj.sbomList != undefined ? <div className='tit'>{itemObj.sbomList[0].name}</div> : ""
                }

                <div className='tit2'>{itemObj.briefName}</div>
                {
                    itemObj.sbomList != undefined ? <div className='titl3'>{itemObj.sbomList[0].sbomPromWord}</div> : ""
                }
                {/* <div className='titl3'>①荣耀Magic Vs部分版本可享积分20倍膨胀最高抵现100元</div>
                <div className='titl3'>②购机再返5倍积分</div> */}
            </div>
            <div className='type5'>
                <div className="item">
                    {/* <div>
                        <i className='iconfont icon-guige'></i>
                        <span>规格</span>
                    </div>
                    <div>
                        已选：幻夜黑 5G全网通 8GB+256GB
                    </div> */}
                </div>
            </div>
            <div className="foote flex1">
                <div>
                    <i className='iconfont icon-kefu'></i>
                    <div>客服</div>
                </div>
                <div>
                    <i className='iconfont icon-shoucang'></i>
                    <div>收藏</div>
                </div>
                <div>
                    {/* <i className='iconfont icon-gouwuche'></i> */}
                    <div>购物车</div>
                </div>
                <button className='gocart' onClick={this.addCartFn}>加入购物车</button>
                <button className='buy1'>立即购买</button>
            </div>
        </div>
    )
}

} export default connect(state => ({ cart: state.cart, token: state.user.token }), { addCartAction } )(CartContent