Skip to content

M
mr-julyedu
Commit 77713388 by wangshuo
Options

转奖学金页面以及接口

parent c4ebb26d
Showing with 326 additions and 4 deletions
.gitignore
......@@ -18,6 +18,7 @@
.env.development.local
.env.test.local
.env.production.local
.vscode/
npm-debug.log*
yarn-debug.log*
......
src/assets/css/index.scss
......@@ -483,4 +483,17 @@ input[type="radio"]:checked:before {
background: #1abc9c;
border-radius: 50%;
border: none;
}
.directions-p {
font-size: 14px;
line-height: 21px;
color: #555555;
font-weight: 300;
}
.directions-div {
font-size: 13px;
line-height: 24px;
color: #333333;
font-weight: 600;
}
\ No newline at end of file
src/assets/font/iconfont.css
......@@ -499,3 +499,7 @@
content: "\e67d";
}
.iconaccounttip:before {
content: "\e61b";
}
src/components/Index/index.js
......@@ -35,7 +35,7 @@ class Index extends Component {
{
'src': require('./image/zjxj_icon.png'),
'name': '赚奖学金',
'href':''
'href':'/scholarship'
},
{
'src': require('./image/mryt_icon.png'),
......
src/components/my/index.js
......@@ -9,8 +9,8 @@ const Item = List.Item;
const Brief = Item.Brief;
class My extends Component {
render() {
let { history } = this.props;
return (
<div className="flex-container">
<Flex>
......@@ -82,7 +82,7 @@ class My extends Component {
<List renderHeader={() => ''} >
<Item
arrow="horizontal"
onClick={() => { }}
onClick={() => { history.push('/scholarship') }}
>
<i className="iconfont iconiconfront-51"></i>
赚奖学金
......
src/components/scholarship/CategoryItem/CategoryItem.js 0 → 100644
import React, { Component } from 'react';
import {Flex, WingBlank} from 'antd-mobile';
import './CategoryItem.scss';
export default class CategoryItem extends Component {
constructor(props) {
super(props);
}
render() {
const {category_name, price1, price0, first_level_tip, image_name, upgrade, upgradeImg} = this.props;
return (
<WingBlank>
<div className={'category'}>
<div className={'imageContainer'}>
<img className={'image'} src={image_name}></img>
{
upgrade ? (
<img src={upgradeImg}></img>
) : (null)
}
</div>
<div className={'content'}>
<Flex direction='column' justify='around' align='start' style={{height: '90px'}}>
<p className={'text-overflow-one'}>{category_name}</p>
<p><span className={'priceNow'}>{`￥${price1}`}</span><span className={'pricePrimary'}>{`￥${price0}`}</span></p>
<div className={'shareMoney'} >{`分享赚${first_level_tip}元`}</div>
</Flex>
</div>
</div>
</WingBlank>
)
}
}
src/components/scholarship/CategoryItem/CategoryItem.scss 0 → 100644
.category {
display: flex;
align-items: flex-start;
height: 90px;
background-color: #fff;
margin-top: 15px;
.imageContainer {
flex: 0 0 auto;
width: 125px;
height: 90px;
border-radius: 3px;
margin-right: 15px;
.image {
width: 125px;
height: 90px;
border-radius: 3px;
}
}
.content {
flex: 1 1 auto;
.priceNow {
color: #ff3131;
font-size: 15px;
margin-right: 15px;
}
.pricePrimary {
color: #999999;
font-size: 12px;
text-decoration: line-through;
}
.shareMoney {
height: 28px;
line-height: 28px;
text-align: center;
width: 90px;
color: #fff;
font-size: 12px;
background-color: #ff4000;
border-radius: 3px;
}
}
}
src/components/scholarship/DrawDocument/DrawDocument.js 0 → 100644
import React, { Component } from 'react';
import { Flex, WhiteSpace, WingBlank } from 'antd-mobile';
import './DrawDocument.scss'
export default class DrawDocument extends Component {
constructor(props) {
super(props);
}
render() {
return (
<div className={'drawDocument'}>
<div>
<WingBlank className={'navbar'}>
<i className={'iconfont iconiconfront-68 back'} onClick={this.props.history.goBack}></i>
<div className={"common-ft-15"}>规则说明</div>
</WingBlank>
</div>
<div className={'content'}>
<WingBlank>
<div className={'directions-div'}>分销规则</div>
<WhiteSpace size='md'></WhiteSpace>
<p className={'directions-p'}>点击『分享赚钱』生成您的专属海报，把专属海报分享到微信、微博、QQ、知乎、贴吧等，他人通过您的海报购买后您可获得相应的佣金奖励。</p>
<WhiteSpace size='lg'></WhiteSpace>
<WhiteSpace size='lg'></WhiteSpace>
<div className={'directions-div'}>提现规则</div>
<WhiteSpace size='md'></WhiteSpace>
<p className={'directions-p'}>1. 已开始的直播课程，用户购买后佣金会实时转入您的账号余额；</p>
<p className={'directions-p'}>2. 尚未开课的直播课程，用户购买后归属您的佣金户暂时存放在『待确认金额』中，直到该课程正式开课。如果用户没有退款，对应的订单金额会自动转入您的账号余额，否则该佣金会自动收回；</p>
<p className={'directions-p'}>3. 余额中的金额可随时提现。</p>
</WingBlank>
</div>
</div>
)
}
}
src/components/scholarship/DrawDocument/DrawDocument.scss 0 → 100644
.drawDocument {
background-color: #F7F9FC;
.navbar {
font-size: 16px;
color: #333333;
height: 44px;
position: relative;
i {
font-size: 22px;
position: absolute;
top: 50%;
transform: translateY(-50%);
}
div {
margin: 0 auto;
height: 44px;
line-height: 44px;
text-align: center;
}
}
.content {
background-color: #FFF;
padding-top: 20px;
}
}
\ No newline at end of file
src/components/scholarship/SortItem/SortItem.js 0 → 100644
import React, { Component } from 'react';
import { Flex } from 'antd-mobile';
import './SortItem.scss';
// const Item = FLex.Item;
const FIRST = 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/order/PC/jin1_icon.png';
const SECOND = 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/order/PC/yin2_icon.png';
const THIRD = 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/order/PC/tong_icon.png';
export default class SortItem extends Component {
constructor(props) {
super(props);
}
render() {
const { sortNum, avatar, shareName, money } = this.props;
let sortImgSrc = '';
if(sortNum === '1') {
sortImgSrc = FIRST;
}
if(sortNum === '2') {
sortImgSrc = SECOND;
}
if(sortNum === '3') {
sortImgSrc = THIRD;
}
return (
<div>
<Flex align='center' className={'sortItem'} style={{backgroundColor: '#FFF'}}>
<div className={'num'}>
<Flex justify='center'>
{
Number(sortNum) > 3 ? (sortNum) : (<img src={sortImgSrc} style={{width: '18px', height: '22px'}}></img>)
}
</Flex>
</div>
<div className={'avatar'}>
<Flex justify='start'>
<img src={avatar} className={'avatarImg'}></img>
<span className={'text-overflow-one'} style={{color: '#333333'}}>{shareName}</span>
</Flex>
</div>
<div className={'money'}>
<Flex justify='center'>{`${money}元`}</Flex>
</div>
</Flex>
</div>
)
}
}
src/components/scholarship/SortItem/SortItem.scss 0 → 100644
.sortItem {
height: 44px;
border-bottom: 1px solid #E7EAF1;
color: #333333;
font-size: 12px;
.num {
width: 25%;
font-size: 15px;
}
.avatar {
width: 40%;
.avatarImg {
width: 22px;
height:22px;
border-radius:50%;
margin-right:10px;
}
}
.money {
width: 35%;
font-size: 13px;
color: #FF2121
}
}
\ No newline at end of file
src/components/scholarship/scholarship.scss 0 → 100644
.scholarship {
background-color: #f5f5f5;
font-size: 15px;
.common-ft-14 {
font-size: 14px;
}
.common-ft-15 {
font-size: 15px;
}
.common-ft-25 {
font-size: 25px;
}
.account-container {
background-color: #18b4ed;
width: 100%;
height: 158px;
color: #fff;
.back,
.tip-info {
font-size: 22px;
}
.draw-cash {
width: 80px;
height: 30px;
border: 1px solid rgba(255, 255, 255, 1);
border-radius: 15px;
color: #fff;
font-size: 16px;
text-align: center;
list-style: 30px;
}
.login-check {
width: 90px;
height: 30px;
border: 1px solid rgba(255, 255, 255, 1);
border-radius: 14px;
color: #FFF;
line-height: 30px;
text-align: center;
}
}
.runtimeList {
height: 30px;
background-color: #FFF4CE;
color: #333333;
font-size: 12px;
text-align: center;
line-height: 30px;
}
.money {
font-size: 13px;
color: $bg_ff3131;
}
}
src/router/router-config.js
......@@ -12,7 +12,9 @@ import ExchangeCoupons from '@/components/coupons/exchange-coupons'
import UseCoupon from '@/components/coupons/use-coupons'
import ShopCard from '@/components/shopCard/index';
import BargainMiddlePage from '@/components/bargainMiddlePage';
import Passport from '@/components/passport'
import Passport from '@/components/passport';
import {Scholarship} from '@/components/scholarship/index';
import DrawDocument from '@/components/scholarship/DrawDocument/DrawDocument'
export default [
......@@ -77,4 +79,12 @@ export default [
path: '/passport',
component: Passport
},
{
path: '/scholarship',
component: Scholarship
},
{
path: '/document',
component: DrawDocument
},
]
\ No newline at end of file
src/utils/index.js
......@@ -57,4 +57,14 @@ export const getParam = (key, str) => {
const re = new RegExp(`(?:\\?|#|&)(${key})=([^=&#\\?]+)`, 'ig');
let found;
return (found = re.exec(_s)) ? found[2] : null;
}
// 判断是否是微信环境 是返回true；否则返回false
export const isWechat = () => {
var ua = navigator.userAgent.toLowerCase();
if(ua.match(/MicroMessenger/i)=="micromessenger") {
return true;
} else {
return false;
}
}
\ 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