Commit 6087fee2 by baiguangyao

订单详情页面

parent ed4caa55
import React, { Component } from 'react';
import { connect } from 'react-redux'
import { LocaleProvider } from 'antd-mobile'
import Menu from './menu';
import { HashRouter } from 'react-router-dom'
import Routes from './router'
// import '@/common/styles/common.scss'
class App extends Component {
render() {
return (
<LocaleProvider>
<HashRouter>
<Routes></Routes>
<Menu />
</HashRouter>
</LocaleProvider>
);
}
}
export default connect()(App);
import React, { Component } from 'react';
import { connect } from 'react-redux'
import { LocaleProvider } from 'antd-mobile'
import { HashRouter } from 'react-router-dom'
import Routes from './router'
// import '@/common/styles/common.scss'
class App extends Component {
render() {
return (
<LocaleProvider>
<HashRouter>
<Routes></Routes>
</HashRouter>
</LocaleProvider>
);
}
}
export default connect()(App);
import React, { Component } from 'react';
import { Flex, NavBar, List } from 'antd-mobile';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
}
}
handleClick = () => {
console.log(1);
}
render() {
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List } from 'antd-mobile';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
}
}
handleClick = () => {
console.log(1);
}
render() {
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
}
}
handleClick = () => {
console.log(1);
}
render() {
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
}
}
handleClick = () => {
console.log(1);
}
render() {
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
const { getFieldProps } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
const { getFieldProps } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export createForm()(Order);
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends React.Component {
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
const { getFieldProps } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export createForm()(Order);
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends React.Component {
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
const { getFieldProps } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export createForm()(Order);
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends React.Component {
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
const { getFieldError } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export createForm()(Order);
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends React.Component {
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
const { getFieldProps } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export createForm()(Order);
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends React.Component {
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
const { getFieldProps } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
export createForm()(Order);
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends React.Component {
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
const { getFieldProps } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export createForm()(Order);
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends React.Component {
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
const { getFieldProps } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
};
export createForm()(Order);
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends React.Component {
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
const { getFieldProps } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export createForm()(Order);
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends React.Component {
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
const { getFieldProps } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export createForm()(Order);
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends React.Component {
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
const { getFieldProps } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export createForm()(Order);
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends React.Component {
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
const { getFieldProps } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export createForm()(Order);
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends React.Component {
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
const { getFieldProps } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export createForm()(Order);
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends React.Component {
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
const { getFieldProps } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export createForm()(Order);
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm, formShape } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends React.Component {
static propTypes = {
form: formShape,
};
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
const { getFieldProps } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export createForm()(Order);
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm, formShape } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends React.Component {
static propTypes = {
form: formShape,
};
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
const { getFieldProps } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export createForm()(Order);
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm, formShape } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends React.Component {
static propTypes = {
form: formShape,
};
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
const { getFieldProps } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export createForm()(Order);
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm, formShape } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends React.Component {
static propTypes = {
form: formShape,
};
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
const { getFieldProps } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export createForm()(Order);
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
const { getFieldProps } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
checked: false,
checked1: true
}
}
handleClick = () => {
console.log(1);
}
render() {
// const { getFieldProps } = this.props.form;
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form'
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
}
}
handleClick = () => {
console.log(1);
}
render() {
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch {...getFieldProps('1', { initialValue: true, valuePropName: 'checked' })} />}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form'
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
}
}
handleClick = () => {
console.log(1);
}
render() {
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { createForm } from 'rc-form'
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
}
}
handleClick = () => {
console.log(1);
}
render() {
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch
checked={this.state.checked}
onChange={() => {
this.setState({
checked: !this.state.checked,
});
}}
/>}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
}
}
handleClick = () => {
console.log(1);
}
render() {
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch
checked={this.state.checked}
onChange={() => {
this.setState({
checked: !this.state.checked,
});
}}
/>}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List, Switch } from 'antd-mobile';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
}
}
handleClick = () => {
console.log(1);
}
render() {
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List } from 'antd-mobile';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
}
}
handleClick = () => {
console.log(1);
}
render() {
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List } from 'antd-mobile';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
}
}
handleClick = () => {
console.log(1);
}
render() {
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className=""></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List } from 'antd-mobile';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
}
}
handleClick = () => {
console.log(1);
}
render() {
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className="iconfont iconiconfront-22"></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List } from 'antd-mobile';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
}
}
handleClick = () => {
console.log(1);
}
render() {
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className="iconfont iconiconfront-22"></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List } from 'antd-mobile';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
}
}
handleClick = () => {
console.log(1);
}
render() {
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<Switch
checked={this.state.checked}}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className="iconfont iconiconfront-22"></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List } from 'antd-mobile';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
}
}
handleClick = () => {
console.log(1);
}
render() {
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
arrow="horizontal"
onClick={() => { }}
className="order-prefer-text"
extra={<i className="iconfont icondanseshixintubiao-5"></i>}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className="iconfont iconiconfront-22"></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List } from 'antd-mobile';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
}
}
handleClick = () => {
console.log(1);
}
render() {
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
onClick={() => { }}
className="order-prefer-text"
extra={<i className="iconfont icondanseshixintubiao-5"></i>}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className="iconfont iconiconfront-22"></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List } from 'antd-mobile';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
}
}
handleClick = () => {
console.log(1);
}
render() {
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
onClick={() => { }}
className="order-prefer-text"
extra={<i className="iconfont icondanseshixintubiao-5"></i>}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className="iconfont iconiconfront-22"></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List } from 'antd-mobile';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
}
}
handleClick = () => {
console.log(1);
}
render() {
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-information">
<i className="iconfont iconiconfront-20"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
onClick={() => { }}
className="order-prefer-text"
extra={<i className="iconfont icondanseshixintubiao-5"></i>}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className="iconfont iconiconfront-22"></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
import React, { Component } from 'react';
import { Flex, NavBar, List } from 'antd-mobile';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
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'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
}
}
handleClick = () => {
console.log(1);
}
render() {
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-information">
<i className="iconfont iconiconfront-20"></i>
<div className="order-cell">
<div>姓名: 张三</div>
<div>QQ: 1084251364</div>
<div>电话: 13266532323</div>
</div>
</div>
<div className="order-list">
<OrderList list={mockData}/>
<div className="order-balance">
<List>
<Item
onClick={() => { }}
className="order-prefer-text"
extra={<i className="iconfont icondanseshixintubiao-5"></i>}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1</i>)</span>
<i className="iconfont iconiconfront-22"></i>
</Item>
</List>
</div>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
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