index.js
2.71 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
import Taro, {Component} from '@tarojs/taro';
import {View, Text, Navigator, Image} from '@tarojs/components';
import './index.scss'
import down from '../../assets/images/down@2x.png';
import couponModel from '../../models/coupon';
import nullBg from '../../assets/images/null.png';
const model = new couponModel();
export default class MyCoupon extends Component {
constructor() {
super(...arguments);
this.state = {
couponList: [],
complete: false
};
}
config = {};
componentWillMount() {
this.getCouponList();
}
async getCouponList() {
let couponList = await model.myCouponList();
this.setState({couponList, complete: true});
};
showNote = (value) => {
let {couponList} = this.state;
couponList[value].showNotes = !couponList[value].showNotes;
this.setState({
couponList
});
this.forceUpdate();
};
render() {
let {couponList, complete} = this.state;
if (!complete) return;
return (
<View className={couponList && couponList.length ? 'page bg' : 'page'}>
<View className='title'>优惠券</View>
{couponList && couponList.length ?
<View className='content'>
{couponList.map((value, index) => {
return <View className='item'>
<View className='ticket'>
<View className='left'>
<View className={!value.use_rule ? 'price solo' : 'price'}>{value.coupon_value}</View>
{
value.use_rule ? <View className='use-rule'>{value.use_rule}</View> : ''
}
</View>
<View className='right'>
<View className='name'><Text className='prefix'>[UFO]</Text> {value.coupon_name}</View>
<View className='date'>{value.coupon_validity}</View>
<View className='desc' onClick={this.showNote.bind(this, index)}>使用说明
<Image mode='aspectFit' src={down} className={value.showNotes ? 'up' : 'down'}></Image>
</View>
</View>
</View>
<View className='desc-info' style={{display: value.showNotes ? 'block' : 'none'}}>
{value.notes.map((note) => {
return <View className='p'><View className='point'>·</View><View className='info'>{note}</View></View>
})}
</View>
</View>
})}
</View> :
<View>
<View className='null'><Image src={nullBg} className='nullBg' mode='aspectFit'></Image></View>
<View className='nullText'>暂时没有优惠券哦</View>
</View>
}
</View>
)
}
}