Commit 9abdc179f1b337231138e7b3f0fd3ad18e8eedc5
1 parent
969da16d
购买券
Showing
2 changed files
with
66 additions
and
98 deletions
pages/businessCard/buyCard.vue
1 | 1 | <template> |
2 | 2 | <view> |
3 | 3 | |
4 | - | |
5 | 4 | <uni-section title="2小时(时长券)" type="line" > |
6 | 5 | <uni-card padding="0" spacing="0"> |
7 | 6 | <!--<template v-slot:cover>--> |
... | ... | @@ -55,45 +54,67 @@ |
55 | 54 | @close="dialogClose"></uni-popup-dialog> |
56 | 55 | </uni-popup> |
57 | 56 | </view> |
58 | - <view class="example"> | |
57 | + <view class="formWrap"> | |
59 | 58 | <uni-forms ref="baseForm" :modelValue="baseFormData" > |
60 | 59 | <uni-forms-item label="车牌号码" required> |
61 | 60 | <uni-easyinput v-model="baseFormData.name" placeholder="请输入车牌号码" /> |
62 | 61 | </uni-forms-item> |
63 | - <uni-section :title="'日期时间用法:' + datetimesingle" type="line"></uni-section> | |
64 | - <view class="example-body"> | |
65 | - <uni-datetime-picker type="datetime" v-model="datetimesingle" @change="changeLog" /> | |
66 | - </view> | |
62 | + | |
63 | + <uni-forms-item label="生效时间"> | |
64 | + <uni-datetime-picker :clear-icon="false" type="datetime" return-type="timestamp" v-model="baseFormData.datetimesingle"/> | |
65 | + </uni-forms-item> | |
66 | + <uni-forms-item label="失效时间"> | |
67 | + <uni-datetime-picker :clear-icon="false" type="datetime" return-type="timestamp" v-model="baseFormData.datetimesingle"/> | |
68 | + </uni-forms-item> | |
67 | 69 | </uni-forms> |
68 | 70 | </view> |
71 | + <uni-section title="24小时(包天券)" type="line" > | |
72 | + <uni-card padding="0" spacing="0"> | |
73 | + <!--<template v-slot:cover>--> | |
74 | + <!--<view class="custom-cover">--> | |
75 | + <!--<image class="cover-image" mode="aspectFill" :src="cover">--> | |
76 | + <!--</image>--> | |
77 | + <!--<view class="cover-content">--> | |
78 | + <!--<text class="uni-subtitle uni-white">今日新闻热点</text>--> | |
79 | + <!--</view>--> | |
80 | + <!--</view>--> | |
81 | + <!--</template>--> | |
82 | + <uni-list> | |
83 | + <uni-list-item title="适应车场" rightText="万达商业广场" > | |
84 | + <text></text> | |
85 | + </uni-list-item> | |
86 | + <uni-list-item title="价格:¥5/张" rightText="商户库存:0张"></uni-list-item> | |
87 | + </uni-list> | |
69 | 88 | |
89 | + </uni-card> | |
90 | + </uni-section> | |
70 | 91 | |
71 | 92 | |
72 | - <!--<view class="uni-list">--> | |
73 | - <!--<view class="uni-list-cell">--> | |
74 | - <!--<view class="uni-list-cell-left">--> | |
75 | - <!--生效时间--> | |
76 | - <!--</view>--> | |
77 | - <!--<view class="uni-list-cell-db">--> | |
78 | - <!--<picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindStartDateChange">--> | |
79 | - <!--<view class="uni-input">{{benginDate}}</view>--> | |
80 | - <!--</picker>--> | |
81 | - <!--</view>--> | |
82 | - <!--</view>--> | |
83 | - <!--</view>--> | |
84 | 93 | |
85 | - <!--<view class="uni-list">--> | |
86 | - <!--<view class="uni-list-cell">--> | |
87 | - <!--<view class="uni-list-cell-left">--> | |
88 | - <!--失效时间--> | |
89 | - <!--</view>--> | |
90 | - <!--<view class="uni-list-cell-db">--> | |
91 | - <!--<picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindEndDateChange">--> | |
92 | - <!--<view class="uni-input">{{overDate}}</view>--> | |
93 | - <!--</picker>--> | |
94 | - <!--</view>--> | |
95 | - <!--</view>--> | |
96 | - <!--</view>--> | |
94 | + <uni-list > | |
95 | + <uni-list-item title="购买数量" > | |
96 | + <template v-slot:footer> | |
97 | + <uni-number-box v-model="vModelValue" @blur="blur" @focus="focus" @change="changeValue" /> | |
98 | + </template> | |
99 | + </uni-list-item> | |
100 | + <uni-list-item title="应付金额" > | |
101 | + <template v-slot:footer> | |
102 | + <text style="color: red">¥25.00元</text> | |
103 | + </template> | |
104 | + </uni-list-item> | |
105 | + <uni-list-item title="支付方式" rightText="商户余额" /> | |
106 | + <uni-list-item note="请认真核对购买信息,卡券一经购买概不支持退款" > | |
107 | + <template v-slot:header> | |
108 | + <text style="color: red">温馨提示</text> | |
109 | + </template> | |
110 | + </uni-list-item> | |
111 | + </uni-list> | |
112 | + | |
113 | + <view class="uni-padding-wrap uni-common-mt"> | |
114 | + <button type="primary" @click="dialogToggle('warn')">立即购买</button> | |
115 | + </view> | |
116 | + | |
117 | + | |
97 | 118 | |
98 | 119 | </view> |
99 | 120 | </template> |
... | ... | @@ -154,6 +175,12 @@ export default { |
154 | 175 | // .discValue); |
155 | 176 | // GetbillQueryInfo(carnum, orderId, parkCode, cardNo, couponType, disValue) { |
156 | 177 | }, |
178 | + mounted() { | |
179 | + setTimeout(() => { | |
180 | + this.baseFormData.datetimesingle = Date.now() - 2*24*3600*1000 | |
181 | + this.datetimesingle = Date.now() - 2*24*3600*1000 | |
182 | + },500) | |
183 | + }, | |
157 | 184 | computed: { |
158 | 185 | startDate() { |
159 | 186 | return this.getDate('start'); |
... | ... | @@ -226,7 +253,7 @@ export default { |
226 | 253 | </script> |
227 | 254 | |
228 | 255 | <style lang="scss" scoped> |
229 | - .example { | |
256 | + .formWrap { | |
230 | 257 | padding: 15px; |
231 | 258 | background-color: #fff; |
232 | 259 | } |
... | ... | @@ -234,71 +261,8 @@ export default { |
234 | 261 | /deep/ .uni-section{ |
235 | 262 | padding-bottom: 10px; |
236 | 263 | } |
237 | - .rechargeWrap{ | |
238 | - position: relative; | |
239 | - .rechargeArrow{ | |
240 | - position: absolute; | |
241 | - right: 10px; | |
242 | - top: 30px; | |
243 | - font-size: 20px; | |
244 | - color: #999; | |
245 | - } | |
246 | - } | |
247 | - .recordCon { | |
248 | - padding-right: 35px; | |
249 | - color: #999; | |
250 | - display: flex; | |
251 | - justify-content: space-between; | |
252 | - } | |
253 | - | |
254 | - .container { | |
255 | - overflow: hidden; | |
256 | - } | |
257 | - | |
258 | - .custom-cover { | |
259 | - flex: 1; | |
260 | - flex-direction: row; | |
261 | - position: relative; | |
262 | - } | |
263 | - | |
264 | - .cover-content { | |
265 | - position: absolute; | |
266 | - bottom: 0; | |
267 | - left: 0; | |
268 | - right: 0; | |
269 | - height: 40px; | |
270 | - background-color: rgba($color: #000000, $alpha: 0.4); | |
271 | - display: flex; | |
272 | - flex-direction: row; | |
273 | - align-items: center; | |
274 | - padding-left: 15px; | |
275 | - font-size: 14px; | |
276 | - color: #fff; | |
277 | - } | |
264 | + /*/deep/ .uni-datetime-picker-btn-text{*/ | |
265 | + /*display: none;*/ | |
266 | + /*}*/ | |
278 | 267 | |
279 | - .card-actions { | |
280 | - display: flex; | |
281 | - flex-direction: row; | |
282 | - justify-content: space-around; | |
283 | - align-items: center; | |
284 | - height: 45px; | |
285 | - border-top: 1px #eee solid; | |
286 | - } | |
287 | - .card-actions-item { | |
288 | - display: flex; | |
289 | - flex-direction: row; | |
290 | - align-items: center; | |
291 | - } | |
292 | - .card-actions-item-text { | |
293 | - font-size: 12px; | |
294 | - color: #666; | |
295 | - margin-left: 5px; | |
296 | - } | |
297 | - .cover-image { | |
298 | - flex: 1; | |
299 | - height: 150px; | |
300 | - } | |
301 | - .no-border { | |
302 | - border-width: 0; | |
303 | - } | |
304 | 268 | </style> | ... | ... |
uni_modules/uni-datetime-picker/components/uni-datetime-picker/time-picker.vue
... | ... | @@ -64,8 +64,12 @@ |
64 | 64 | <text v-if="!hideSecond" class="uni-datetime-picker-sign sign-right">:</text> |
65 | 65 | </view> |
66 | 66 | <view class="uni-datetime-picker-btn"> |
67 | + <!--<view @click="clearTime">--> | |
68 | + <!--<text class="uni-datetime-picker-btn-text">{{clearText}}</text>--> | |
69 | + <!--</view>--> | |
70 | + | |
67 | 71 | <view @click="clearTime"> |
68 | - <text class="uni-datetime-picker-btn-text">{{clearText}}</text> | |
72 | + <text class="uni-datetime-picker-btn-text"></text> | |
69 | 73 | </view> |
70 | 74 | <view class="uni-datetime-picker-btn-group"> |
71 | 75 | <view class="uni-datetime-picker-cancel" @click="tiggerTimePicker"> | ... | ... |