Skip to content

M
mr-julyedu
Commit 4cb9573e by baiguangyao
Options

.

parent f2af1ac9
Showing with 213 additions and 9 deletions
.history/src/components/shopCard/index_20190429150220.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '111',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '112',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
changeStock() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
i++;
cartNmu += 1;
checkedNum = i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
src/components/detail/index.js
import React, {Component} from 'react';
import {Tabs, WhiteSpace, Badge} from 'antd-mobile';
import {Tabs, WhiteSpace} from 'antd-mobile';
import './index.scss';
import Bargain from './bargain'
......
src/components/preferential/index.js
......@@ -320,12 +320,12 @@ class Preferential extends Component {
{title: '砍价专区'},
{title: '一键拼团'}
];
const bottom = (
<i className={'iconfont iconiconfront-69 pull-down'}></i>
)
const top = (
<i className={'iconfont iconiconfront-71 pull-down'}></i>
)
// const bottom = (
// <i className={'iconfont iconiconfront-69 pull-down'}></i>
// )
// const top = (
// <i className={'iconfont iconiconfront-71 pull-down'}></i>
// )
return (
<div className='preferential'>
......
src/components/shopCard/index.js
......@@ -80,8 +80,6 @@ class Cart extends Component {
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
console.log(item);
console.log(id);
if (item.id === id) {
return {
...item,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment