Ahmad.zuhdi.y/bukopin-redemption-client-react
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

cart belum selesai keburu pindah ke yang lain

Browse Source
This commit is contained in:
enggar_ganteng
2019-01-03 15:29:25 +07:00
parent 10ac2f5f7b
commit 7d83742788
3 changed files with 252 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/common/pages/App/routes.js
View File

@@ -29,7 +29,8 @@ import Tasks from './../Tasks/index';
import HotelComponent from '../Hotel';
import HotelSearch from './../Hotel/HotelSearch';
import CarComponent from '../Car';
import CarSearch from './../Car/CarSearch'
import CarSearch from './../Car/CarSearch';
import CartDetail from '../CartDetail/index';
import CustomerComponent from "../Customers/index";
import CustomerDetail from "../CustomerDetail/index";
import WalletCostumer from '../CustomerDetail/Wallet/index';
@@ -78,6 +79,7 @@ export default class ComponentName extends React.Component {
<Route exact component={HotelComponent} path={LINKS.HOTEL}/>
<Route exact component={HotelSearch} path={LINKS.HOTEL_SEARCH}/>
<Route exact component={CarComponent} path={LINKS.CAR}/>
<Route exact component={CartDetail} path={LINKS.CART_DETAIL}/>
<Route exact component={CarSearch} path={LINKS.CAR_SEARCH}/>
<Route exact component={ItemsComponent} path={LINKS.ITEMS}/>
<Route exact component={VouchersComponent} path={LINKS.VOUCHERS}/>

248
src/common/pages/CartDetail/index.js Normal file
View File

@@ -0,0 +1,248 @@
import React from 'react';
import {inject, observer} from 'mobx-react';
import {
FlatButton
} from 'material-ui';
import { Affix, Card, Slider, Select, Row, Col, Icon, Tag,Rate, Button, Checkbox ,Divider, DatePicker, TimePicker, List } from 'antd';
import {startCase} from 'lodash';
import LoadingDialog from "../LoadingDialog";
import Loader from 'react-loader-advanced';
// import './style.scss';
import {DIALOG} from "../../stores/global_ui";
import EmptyComponent from '../EmptyComponent';
import DeleteIcon from 'material-ui/svg-icons/action/delete';
import Search from 'material-ui/svg-icons/action/search';
const format = 'HH:mm';
@inject('appstate')
@observer
export default class CartDetail extends React.Component {
constructor(props) {
super(props);
this.props = props;
this.state = {
value: 1,
valueMinimal: 0,
valueMaximal: 0,
changeSearch:false,
};
this.defaultState = Object.assign({}, this.state);
this.http = props.appstate.http;
this.authStore = props.appstate.auth;
this.globalUI = props.appstate.globalUI;
}
componentDidMount() {
}
handleChangeMinimal = (valueMinimal) => {
this.setState({ valueMinimal });
};
handleChangeMaximal = (valueMaximal) => {
this.setState({ valueMaximal });
};
handleBlur = () => {
console.log('blur');
}
handleFocus = () => {
console.log('focus');
}
handleChangeSearch = () => {
this.setState({
changeSearch : true
})
}
handleChangeSearchFalse = () => {
this.setState({
changeSearch : false
})
}
render() {
const { valueMinimal, valueMaximal } = this.state;
const dataAgya = [
'Full to full gasoline',
'4 people',
'4 door',
];
const dataAvanza = [
'Full to full gasoline',
'4 people',
'5 door',
];
const dataInova = [
'Full to full gasoline',
'6 people',
'4 door',
];
return (
<div className="wallet containerMiddle">
<div className="row">
<div className="col s9 m9 l9">
<Row>
<Card style={{marginRight:20,marginBottom:20}}>
<Row>
<div style={{display: 'flex',justifyContent:'space-between'}}>
<Checkbox style={{}} value="">Pilih Semua Product</Checkbox>
<Button shape="circle" icon="delete" />
</div>
</Row>
</Card>
</Row>
<Row>
<Card
title={<span><Checkbox style={{}} value="">Penjual : Xiomi shop</Checkbox></span>}
style={{marginRight:20,marginBottom:20}}
>
<Row>
<Col span={8}>
<img alt="example" src="https://ecs7.tokopedia.net/img/cache/700/product-1/2019/1/2/21148822/21148822_2d655fa2-894d-46cf-a63f-19a0fec0da6e_1080_1080.jpg" style={{width:'100%', height:190}} />
</Col>
<Col span={1} />
<Col span={15}>
<Row>
<h2>Toyota Agya</h2>
</Row>
<Row style={{marginBottom:10}}>
<Col span={12}>
<h4 style={{color:'grey'}}><Icon type="environment" />At Airport</h4>
<div style={{marginBottom:10}}>
<Tag color="#f50">Air Conditional</Tag>
<Tag color="#7E57C2">Mini</Tag>
<Tag color="#87d068">Automatic</Tag>
</div>
<h2 style={{color:'#2962FF'}}>99,643 Poin</h2>
</Col>
<Col span={12}>
<List
size="small"
dataSource={dataAgya}
renderItem={item => (<List.Item>{item}</List.Item>)}
/>
</Col>
</Row>
<Row>
<Col span={24}>
<Button type="primary" block style={{}}>Pesan</Button>
</Col>
</Row>
</Col>
</Row>
</Card>
</Row>
<Row>
<Card
style={{marginRight:20,marginBottom:20}}
>
<Row>
<Col span={8}>
<img alt="example" src="https://cdn.rcstatic.com/images/car_images/new_images/toyota/avanza_lrg.jpg" style={{width:'100%', height:190}} />
</Col>
<Col span={1} />
<Col span={15}>
<Row>
<h2>Toyota Avanza</h2>
</Row>
<Row style={{marginBottom:10}}>
<Col span={12}>
<h4 style={{color:'grey'}}><Icon type="environment" />At Airport</h4>
<div style={{marginBottom:10}}>
<Tag color="#f50">Air Conditional</Tag>
<Tag color="#2db7f5">Special</Tag>
<Tag color="#87d068">Automatic</Tag>
</div>
<h2 style={{color:'#2962FF'}}>109,132 Poin</h2>
</Col>
<Col span={12}>
<List
size="small"
dataSource={dataAvanza}
renderItem={item => (<List.Item>{item}</List.Item>)}
/>
</Col>
</Row>
<Row>
<Col span={24}>
<Button type="primary" block style={{}}>Pesan</Button>
</Col>
</Row>
</Col>
</Row>
</Card>
</Row>
<Row>
<Card
style={{marginRight:20,marginBottom:20}}
>
<Row>
<Col span={8}>
<img alt="example" src="https://cdn.rcstatic.com/images/car_images/new_images/toyota/innova_lrg.jpg" style={{width:'100%', height:190}} />
</Col>
<Col span={1} />
<Col span={15}>
<Row>
<h2>Toyota Inova</h2>
</Row>
<Row style={{marginBottom:10}}>
<Col span={12}>
<h4 style={{color:'grey'}}><Icon type="environment" />At Airport</h4>
<div style={{marginBottom:10}}>
<Tag color="#f50">Air Conditional</Tag>
<Tag color="#2db7f5">Special</Tag>
<Tag color="#87d068">Automatic</Tag>
</div>
<h2 style={{color:'#2962FF'}}>147,091 Poin</h2>
</Col>
<Col span={12}>
<List
size="small"
dataSource={dataInova}
renderItem={item => (<List.Item>{item}</List.Item>)}
/>
</Col>
</Row>
<Row>
<Col span={24}>
<Button type="primary" block style={{}}>Pesan</Button>
</Col>
</Row>
</Col>
</Row>
</Card>
</Row>
</div>
<div className="col l3 m3 s3 no-padding">
<Affix offsetTop={90}>
<Card title="Ringkasan Belanja" bordered={true} style={{ width: '100%' }}>
<div style={{display: 'flex',justifyContent:'space-between'}}>
<p>Total Poin</p>
<p>150,100 Poin</p>
</div>
<Divider />
<Button type="primary" block style={{}}>Check out (3)</Button>
</Card>
</Affix>
</div>
</div>
</div>
)
}
}