Merge Request #4
← To merge requests
From
adam:master
into
jp:master
Commits (2)
Showing
5 changed files
Show diff stats
src/components/uni-drawer/uni-drawer.vue
... | ... | @@ -16,7 +16,7 @@ |
16 | 16 | * @property {Boolean} maskClick = [true | false] 点击遮罩是否关闭 |
17 | 17 | * @property {Boolean} mode = [left | right] Drawer 滑出位置 |
18 | 18 | * @value left 从左侧滑出 |
19 | - * @value right 从右侧侧滑出 | |
19 | + * @value right 从右侧侧滑出 | |
20 | 20 | * @property {Number} width 抽屉的宽度 ,仅 vue 页面生效 |
21 | 21 | * @event {Function} close 组件关闭时触发事件 |
22 | 22 | */ |
... | ... | @@ -36,13 +36,13 @@ |
36 | 36 | mask: { |
37 | 37 | type: Boolean, |
38 | 38 | default: true |
39 | - }, | |
40 | - /** | |
41 | - * 遮罩是否可点击关闭 | |
42 | - */ | |
43 | - maskClick:{ | |
44 | - type: Boolean, | |
45 | - default: true | |
39 | + }, | |
40 | + /** | |
41 | + * 遮罩是否可点击关闭 | |
42 | + */ | |
43 | + maskClick:{ | |
44 | + type: Boolean, | |
45 | + default: true | |
46 | 46 | }, |
47 | 47 | /** |
48 | 48 | * 抽屉宽度 |
... | ... | @@ -62,20 +62,20 @@ |
62 | 62 | } |
63 | 63 | }, |
64 | 64 | created() { |
65 | - // #ifndef APP-NVUE | |
65 | + // #ifndef APP-NVUE | |
66 | 66 | this.drawerWidth = this.width |
67 | 67 | // #endif |
68 | 68 | this.rightMode = this.mode === 'right' |
69 | 69 | }, |
70 | - methods: { | |
70 | + methods: { | |
71 | 71 | clear(){}, |
72 | - close(type) { | |
73 | - // fixed by mehaotian 抽屉尚未完全关闭或遮罩禁止点击时不触发以下逻辑 | |
72 | + close(type) { | |
73 | + // fixed by mehaotian 抽屉尚未完全关闭或遮罩禁止点击时不触发以下逻辑 | |
74 | 74 | if((type === 'mask' && !this.maskClick) || !this.visibleSync) return |
75 | 75 | this._change('showDrawer', 'visibleSync', false) |
76 | 76 | }, |
77 | - open() { | |
78 | - // fixed by mehaotian 处理重复点击打开的事件 | |
77 | + open() { | |
78 | + // fixed by mehaotian 处理重复点击打开的事件 | |
79 | 79 | if(this.visibleSync) return |
80 | 80 | this._change('visibleSync', 'showDrawer', true) |
81 | 81 | }, |
... | ... | @@ -167,4 +167,4 @@ |
167 | 167 | /* #endif */ |
168 | 168 | opacity: 1; |
169 | 169 | } |
170 | -</style> | |
170 | +</style> | ... | ... |
src/pages/Predelivery/Predelivery.vue
... | ... | @@ -0,0 +1,151 @@ |
1 | +<template> | |
2 | + <view class="container"> | |
3 | + <view v-for="(items) in form" :key="items.key" class="order"> | |
4 | + <view class="order_number">订单号:{{items.orderNum}}<span>待发货</span></view> | |
5 | + <view class="order_detail"> | |
6 | + <view class="detail_img"><image v-bind:src="items.img"></image></view> | |
7 | + <view class="detail_zi"> | |
8 | + <view class="zi_name">{{items.name}}</view> | |
9 | + <view class="zi_standard">规格:{{items.standard}}</view> | |
10 | + <view class="zi_preprice">¥{{items.preprice}}<span>X{{items.number}}</span></view> | |
11 | + </view> | |
12 | + </view> | |
13 | + <view class="now_price">实付:<span>¥{{items.nowprice}}</span></view> | |
14 | + <view class="clear"></view> | |
15 | + <view class="button"> | |
16 | + <view class="button1">申请退款</view> | |
17 | + <view class="button2">提醒发货</view> | |
18 | + </view> | |
19 | + </view> | |
20 | + </view> | |
21 | +</template> | |
22 | + | |
23 | +<script> | |
24 | +export default { | |
25 | + data(){ | |
26 | + return{ | |
27 | + form:[ | |
28 | + { | |
29 | + key: 0, | |
30 | + name:'商品名称', | |
31 | + standard:'玫瑰金/钛合金/防日光防紫外线/超薄超轻', | |
32 | + img: '/static/img/detail/delivery.png', | |
33 | + preprice: 180, | |
34 | + number:1, | |
35 | + orderNum: 2034867958596334, | |
36 | + nowprice: 110, | |
37 | + } | |
38 | + ] | |
39 | + | |
40 | + } | |
41 | + } | |
42 | +} | |
43 | +</script> | |
44 | + | |
45 | +<style lang="scss"> | |
46 | +.container{ | |
47 | + width: 100%; | |
48 | + height: 100%; | |
49 | + background: #F2F2F2; | |
50 | + height: 700px; | |
51 | + //要获取屏幕大小 | |
52 | +} | |
53 | +.order{ | |
54 | + background: #FFFFFF; | |
55 | + width: 90%; | |
56 | + height: 450rpx; | |
57 | + margin: 0 auto; | |
58 | + padding: 40rpx; | |
59 | + box-sizing: border-box; | |
60 | + border-radius: 5px; | |
61 | +} | |
62 | +.order_number{ | |
63 | + color: #999999; | |
64 | + font-size: 12px; | |
65 | + font-family: "PingFangSC-Regular"; | |
66 | + span{ | |
67 | + font-family: PingFangSC-Regular; | |
68 | + font-size: 14px; | |
69 | + color: #FF6B4A; | |
70 | + letter-spacing: -0.26px; | |
71 | + line-height: 18px; | |
72 | + float: right; | |
73 | + } | |
74 | +} | |
75 | +.order_detail{ | |
76 | + display: flex; | |
77 | + justify-content: space-around; | |
78 | + margin-top: 12px; | |
79 | +} | |
80 | +.detail_img image{ | |
81 | + width: 188rpx; | |
82 | + height: 188rpx; | |
83 | +} | |
84 | +.detail_zi{ | |
85 | + font-family: PingFangSC-Regular; | |
86 | + width: 55%; | |
87 | + height: 100%; | |
88 | + view{ | |
89 | + margin-bottom: 20rpx; | |
90 | + } | |
91 | + .zi_name{ | |
92 | + font-size: 14px; | |
93 | + color: #333333; | |
94 | + letter-spacing: -0.26px; | |
95 | + line-height: 18px; | |
96 | + } | |
97 | + .zi_standard{ | |
98 | + font-size: 12px; | |
99 | + color: #999999 ; | |
100 | + } | |
101 | + .zi_preprice{ | |
102 | + font-size: 14px; | |
103 | + color: #FF6B4A; | |
104 | + span{ | |
105 | + float: right; | |
106 | + font-size: 12px; | |
107 | + color: #999999; | |
108 | + } | |
109 | + } | |
110 | +} | |
111 | +.now_price{ | |
112 | + font-size: 14px; | |
113 | + color: #333333; | |
114 | + float: right; | |
115 | + span{ | |
116 | + font-size: 14px; | |
117 | + color: #FF6B4A ; | |
118 | + } | |
119 | +} | |
120 | +.clear{ | |
121 | + clear: both; | |
122 | +} | |
123 | +.button{ | |
124 | + display: flex; | |
125 | + justify-content: flex-end; | |
126 | + margin-top: 14px; | |
127 | + view{ | |
128 | + width: 156rpx; | |
129 | + height: 48rpx; | |
130 | + border-radius: 12px; | |
131 | + font-size: 12px; | |
132 | + text-align: center; | |
133 | + line-height: 20px; | |
134 | + } | |
135 | + .button1{ | |
136 | + border: 1px solid #FF6B4A; | |
137 | + font-family: PingFangSC-Regular; | |
138 | + color: #FF6B4A; | |
139 | + letter-spacing: -0.23px; | |
140 | + margin-right: 30rpx; | |
141 | + } | |
142 | + .button2{ | |
143 | + border: 1px solid #FF6B4A; | |
144 | + background: #FF6B4A; | |
145 | + font-family: PingFangSC-Regular; | |
146 | + color: #FFFFFF; | |
147 | + letter-spacing: -0.23px; | |
148 | + | |
149 | + } | |
150 | +} | |
151 | +</style> | |
0 | 152 | \ No newline at end of file | ... | ... |
src/pages/myOrder/myOrder.vue
1 | -<template> | |
1 | +<template> | |
2 | 2 | <view class="content"> |
3 | 3 | <view class="header"> |
4 | 4 | <!-- 搜索--> |
... | ... | @@ -13,17 +13,17 @@ |
13 | 13 | </view> |
14 | 14 | </view> |
15 | 15 | <OrderCard></OrderCard> |
16 | - | |
17 | - </view> | |
18 | -</template> | |
19 | - | |
16 | + | |
17 | + </view> | |
18 | +</template> | |
19 | + | |
20 | 20 | <script> |
21 | - import OrderCard from './OrderCard.vue' | |
21 | + import OrderCard from './OrderCard.vue' | |
22 | 22 | export default { |
23 | 23 | components:{ |
24 | 24 | 'OrderCard':OrderCard |
25 | - }, | |
26 | - data() { | |
25 | + }, | |
26 | + data() { | |
27 | 27 | return { |
28 | 28 | screenItems: [ |
29 | 29 | {current:0,text:'全部'}, |
... | ... | @@ -32,9 +32,9 @@ |
32 | 32 | {current:3,text:'待收货'}, |
33 | 33 | {current:4,text:'退款售后'}, |
34 | 34 | ], |
35 | - current: 0, | |
36 | - | |
37 | - }; | |
35 | + current: 0, | |
36 | + | |
37 | + }; | |
38 | 38 | }, |
39 | 39 | methods:{ |
40 | 40 | onClickItem(e) { |
... | ... | @@ -42,10 +42,10 @@ |
42 | 42 | this.current = e; |
43 | 43 | } |
44 | 44 | } |
45 | - } | |
46 | - } | |
47 | -</script> | |
48 | - | |
45 | + } | |
46 | + } | |
47 | +</script> | |
48 | + | |
49 | 49 | <style lang="scss"> |
50 | 50 | .content { |
51 | 51 | display: flex; |
... | ... | @@ -102,5 +102,5 @@ |
102 | 102 | font-size: 28rpx; |
103 | 103 | box-sizing: border-box; |
104 | 104 | } |
105 | - } | |
106 | -</style> | |
105 | + } | |
106 | +</style> | ... | ... |
src/pages/myOrder/orderCard.vue
... | ... | @@ -15,13 +15,13 @@ |
15 | 15 | </script> |
16 | 16 | |
17 | 17 | <style lang="scss"> |
18 | - .card{ | |
19 | - width: 670rpx; | |
20 | - height: 478rpx; | |
21 | - background: #FFFFFF; | |
22 | - box-shadow: 0 0 10px 0 rgba(177,128,128,0.06); | |
23 | - border-radius: 8px; | |
24 | - border-radius: 8px; | |
25 | - margin-top: 20rpx; | |
18 | + .card{ | |
19 | + width: 670rpx; | |
20 | + height: 478rpx; | |
21 | + background: #FFFFFF; | |
22 | + box-shadow: 0 0 10px 0 rgba(177,128,128,0.06); | |
23 | + border-radius: 8px; | |
24 | + border-radius: 8px; | |
25 | + margin-top: 20rpx; | |
26 | 26 | } |
27 | 27 | </style> | ... | ... |
src/static/img/detail/delivery.png
55.5 KB