cart belum selesai keburu pindah ke yang lain
This commit is contained in:
parent
10ac2f5f7b
commit
7d83742788
|
|
@ -29,7 +29,8 @@ import Tasks from './../Tasks/index';
|
||||||
import HotelComponent from '../Hotel';
|
import HotelComponent from '../Hotel';
|
||||||
import HotelSearch from './../Hotel/HotelSearch';
|
import HotelSearch from './../Hotel/HotelSearch';
|
||||||
import CarComponent from '../Car';
|
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 CustomerComponent from "../Customers/index";
|
||||||
import CustomerDetail from "../CustomerDetail/index";
|
import CustomerDetail from "../CustomerDetail/index";
|
||||||
import WalletCostumer from '../CustomerDetail/Wallet/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={HotelComponent} path={LINKS.HOTEL}/>
|
||||||
<Route exact component={HotelSearch} path={LINKS.HOTEL_SEARCH}/>
|
<Route exact component={HotelSearch} path={LINKS.HOTEL_SEARCH}/>
|
||||||
<Route exact component={CarComponent} path={LINKS.CAR}/>
|
<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={CarSearch} path={LINKS.CAR_SEARCH}/>
|
||||||
<Route exact component={ItemsComponent} path={LINKS.ITEMS}/>
|
<Route exact component={ItemsComponent} path={LINKS.ITEMS}/>
|
||||||
<Route exact component={VouchersComponent} path={LINKS.VOUCHERS}/>
|
<Route exact component={VouchersComponent} path={LINKS.VOUCHERS}/>
|
||||||
|
|
|
||||||
248
src/common/pages/CartDetail/index.js
Normal file
248
src/common/pages/CartDetail/index.js
Normal 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>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -111,6 +111,7 @@ export const LINKS = {
|
||||||
CAR:'/app/car',
|
CAR:'/app/car',
|
||||||
CAR_SEARCH:'/app/car/search',
|
CAR_SEARCH:'/app/car/search',
|
||||||
VOUCHERS: '/app/vouchers',
|
VOUCHERS: '/app/vouchers',
|
||||||
|
CART_DETAIL: '/app/cart',
|
||||||
};
|
};
|
||||||
|
|
||||||
@inject('appstate')
|
@inject('appstate')
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user