BJ_web_developers / jy_parkingOS

Commit c0558ebaea4b385716d52333efe4fc4a3c2336a4

Authored by 刘淇
1 parent 3d60bab7

下拉框箭头

Inline Side-by-side
Showing 2 changed files with 414 additions and 416 deletions
pages/inputCarNumber/inputCarNumber.vue
  View file @c0558eb
1 1 <template>
2 2  
3   - <view class="so-mask">
  3 + <view class="so-mask">
4 4  
5   - <view class="bg-icon" :class="set">
6   - <image :src="carBg" mode="" class="bac" />
7   - <view class="bg-text">
8   - <view class="bg-text-top">输 入 车 牌 号</view>
9   - <view class="bg-text-bottom">输入完整车牌号，查询停车信息</view>
10   - </view>
11   - </view>
  5 + <view class="bg-icon" :class="set">
  6 + <image :src="carBg" mode="" class="bac"/>
  7 + <view class="bg-text">
  8 + <view class="bg-text-top">输 入 车 牌 号</view>
  9 + <view class="bg-text-bottom">输入完整车牌号，查询停车信息</view>
  10 + </view>
  11 + </view>
12 12  
13   - <view class="so-plate animation-scale-up">
14   - <view class="so-plate-head">
15   - <view class="so-plate-type">
16   - <radio-group @change="typeChange">
17   - <label>
18   - <radio value="1" :checked="type===1" />
19   - 普通车牌
20   - </label>
21   - <label>
22   - <radio value="2" :checked="type===2" />
23   - 新能源车牌
24   - </label>
25   - </radio-group>
26   - </view>
27   - </view>
28   - <view class="so-plate-body" @click="plateShowOrHide = true">
29   - <view class="so-plate-word" :class="{ active: currentInputIndex == 0 }" @tap="inputSwitch"
30   - data-index="0">
31   - <text>{{ currentInputValue[0] }}</text>
32   - </view>
33   - <view class="so-plate-word" :class="{ active: currentInputIndex == 1 }" @tap="inputSwitch"
34   - data-index="1">
35   - <text>{{ currentInputValue[1] }}</text>
36   - </view>
37   - <view class="so-plate-dot"></view>
38   - <view class="so-plate-word" :class="{ active: currentInputIndex == 2 }" @tap="inputSwitch"
39   - data-index="2">
40   - <text>{{ currentInputValue[2] }}</text>
41   - </view>
42   - <view class="so-plate-word" :class="{ active: currentInputIndex == 3 }" @tap="inputSwitch"
43   - data-index="3">
44   - <text>{{ currentInputValue[3] }}</text>
45   - </view>
46   - <view class="so-plate-word" :class="{ active: currentInputIndex == 4 }" @tap="inputSwitch"
47   - data-index="4">
48   - <text>{{ currentInputValue[4] }}</text>
49   - </view>
50   - <view class="so-plate-word" :class="{ active: currentInputIndex == 5 }" @tap="inputSwitch"
51   - data-index="5">
52   - <text>{{ currentInputValue[5] }}</text>
53   - </view>
54   - <view class="so-plate-word" :class="{ active: currentInputIndex == 6 }" @tap="inputSwitch"
55   - data-index="6">
56   - <text>{{ currentInputValue[6] }}</text>
57   - </view>
58   - <view class="so-plate-word" :class="{ active: currentInputIndex == 7 }" @tap="inputSwitch"
59   - v-if="type == 2" data-index="7">
60   - <text>{{ currentInputValue[7] }}</text>
61   - </view>
62   - </view>
  13 + <view class="so-plate animation-scale-up">
  14 + <view class="so-plate-head">
  15 + <view class="so-plate-type">
  16 + <radio-group @change="typeChange">
  17 + <label>
  18 + <radio value="1" :checked="type===1"/>
  19 + 普通车牌
  20 + </label>
  21 + <label>
  22 + <radio value="2" :checked="type===2"/>
  23 + 新能源车牌
  24 + </label>
  25 + </radio-group>
  26 + </view>
  27 + </view>
  28 + <view class="so-plate-body" @click="plateShowOrHide = true">
  29 + <view class="so-plate-word" :class="{ active: currentInputIndex == 0 }" @tap="inputSwitch"
  30 + data-index="0">
  31 + <text>{{ currentInputValue[0] }}</text>
  32 + </view>
  33 + <view class="so-plate-word" :class="{ active: currentInputIndex == 1 }" @tap="inputSwitch"
  34 + data-index="1">
  35 + <text>{{ currentInputValue[1] }}</text>
  36 + </view>
  37 + <view class="so-plate-dot"></view>
  38 + <view class="so-plate-word" :class="{ active: currentInputIndex == 2 }" @tap="inputSwitch"
  39 + data-index="2">
  40 + <text>{{ currentInputValue[2] }}</text>
  41 + </view>
  42 + <view class="so-plate-word" :class="{ active: currentInputIndex == 3 }" @tap="inputSwitch"
  43 + data-index="3">
  44 + <text>{{ currentInputValue[3] }}</text>
  45 + </view>
  46 + <view class="so-plate-word" :class="{ active: currentInputIndex == 4 }" @tap="inputSwitch"
  47 + data-index="4">
  48 + <text>{{ currentInputValue[4] }}</text>
  49 + </view>
  50 + <view class="so-plate-word" :class="{ active: currentInputIndex == 5 }" @tap="inputSwitch"
  51 + data-index="5">
  52 + <text>{{ currentInputValue[5] }}</text>
  53 + </view>
  54 + <view class="so-plate-word" :class="{ active: currentInputIndex == 6 }" @tap="inputSwitch"
  55 + data-index="6">
  56 + <text>{{ currentInputValue[6] }}</text>
  57 + </view>
  58 + <view class="so-plate-word" :class="{ active: currentInputIndex == 7 }" @tap="inputSwitch"
  59 + v-if="type == 2" data-index="7">
  60 + <text>{{ currentInputValue[7] }}</text>
  61 + </view>
  62 + </view>
63 63  
64 64  
65   - </view>
  65 + </view>
66 66  
67   - <view style="padding: 0 10px;position: fixed;bottom: 0;left:0">
68   - <view class="so-plate-foot" v-show="plateShowOrHide">
69   - <view class="so-plate-keyboard" :style="{height:keyboardHeight}">
70   - <view id="keyboard">
71   - <block v-if="inputType == 1">
72   - <view hover-class="hover" class="so-plate-key" v-for="el of provinceText" :key="el"
73   - :data-value="el" @tap="chooseKey">{{ el }}</view>
74   - </block>
75   - <block v-if="inputType == 1">
76   - <text class="so-plate-key fill-block"></text>
77   - <text class="so-plate-key fill-block"></text>
78   - </block>
79   - <block v-if="inputType >= 3">
80   - <view hover-class="hover" class="so-plate-key" v-for="el of numberText" :key="el"
81   - :data-value="el" @tap="chooseKey">{{ el }}</view>
82   - </block>
83   - <block v-if="inputType >= 2">
84   - <view hover-class="hover" class="so-plate-key" v-for="el of wordText" :key="el"
85   - :data-value="el" @tap="chooseKey">{{ el }}</view>
86   - </block>
87   - <block v-if="inputType == 3">
88   - <text v-for="el of fillBlock" :key="el.num" class="so-plate-key fill-block"></text>
89   - </block>
90   - <block v-if="inputType == 4">
91   - <view hover-class="hover" class="so-plate-key" v-for="el of lastWordText" :key="el"
92   - :data-value="el" @tap="chooseKey">{{ el }}</view>
93   - </block>
94   - <text v-if="inputType == 4" class="so-plate-key fill-block"></text>
95   - </view>
96   - </view>
97   - <view class="so-plate-btn-group">
98   - <view>
99   - <button class="so-plate-btn so-plate-btn--cancel" @tap="plateShowOrHide = false">取消</button>
100   - </view>
101   - <view>
102   - <button class="so-plate-btn so-plate-btn--delete" @tap="deleteKey">删除</button>
103   - <button class="so-plate-btn so-plate-btn--submit" @tap="exportPlate">完成</button>
  67 + <view style="padding: 0 10px;position: fixed;bottom: 0;left:0">
  68 + <view class="so-plate-foot" v-show="plateShowOrHide">
  69 + <view class="so-plate-keyboard" :style="{height:keyboardHeight}">
  70 + <view id="keyboard">
  71 + <block v-if="inputType == 1">
  72 + <view hover-class="hover" class="so-plate-key" v-for="el of provinceText" :key="el"
  73 + :data-value="el" @tap="chooseKey">{{ el }}
  74 + </view>
  75 + </block>
  76 + <block v-if="inputType == 1">
  77 + <text class="so-plate-key fill-block"></text>
  78 + <text class="so-plate-key fill-block"></text>
  79 + </block>
  80 + <block v-if="inputType >= 3">
  81 + <view hover-class="hover" class="so-plate-key" v-for="el of numberText" :key="el"
  82 + :data-value="el" @tap="chooseKey">{{ el }}
  83 + </view>
  84 + </block>
  85 + <block v-if="inputType >= 2">
  86 + <view hover-class="hover" class="so-plate-key" v-for="el of wordText" :key="el"
  87 + :data-value="el" @tap="chooseKey">{{ el }}
  88 + </view>
  89 + </block>
  90 + <block v-if="inputType == 3">
  91 + <text v-for="el of fillBlock" :key="el.num" class="so-plate-key fill-block"></text>
  92 + </block>
  93 + <block v-if="inputType == 4">
  94 + <view hover-class="hover" class="so-plate-key" v-for="el of lastWordText" :key="el"
  95 + :data-value="el" @tap="chooseKey">{{ el }}
  96 + </view>
  97 + </block>
  98 + <text v-if="inputType == 4" class="so-plate-key fill-block"></text>
  99 + </view>
  100 + </view>
  101 + <view class="so-plate-btn-group">
  102 + <view>
  103 + <button class="so-plate-btn so-plate-btn--cancel" @tap="plateShowOrHide = false">取消</button>
  104 + </view>
  105 + <view>
  106 + <button class="so-plate-btn so-plate-btn--delete" @tap="deleteKey">删除</button>
  107 + <button class="so-plate-btn so-plate-btn--submit" @tap="exportPlate">完成</button>
104 108  
105   - </view>
  109 + </view>
106 110  
107   - </view>
108   - </view>
109   - </view>
110   - </view>
  111 + </view>
  112 + </view>
  113 + </view>
  114 + </view>
111 115 </template>
112 116 <script>
113   - import carBg from 'static/inputCarNumber_pic/carBg.png'
  117 +import carBg from 'static/inputCarNumber_pic/carBg.png'
  118 +export default {
  119 + name: 'uni-plate-input',
  120 + data() {
  121 + return {
  122 + plateShowOrHide: false,
  123 + type: 1, //车牌类型
  124 + currentInputIndex: 2, //当前编辑的输入框
  125 + currentInputValue: ['苏', 'B', '', '', '', '', ''],
  126 + fillBlock: [{
  127 + num: 11
  128 + }, {
  129 + num: 12
  130 + }, {
  131 + num: 13
  132 + }, {
  133 + num: 14
  134 + }, {
  135 + num: 15
  136 + }, {
  137 + num: 16
  138 + }], //避免:key报错
  139 + keyboardHeightInit: false,
  140 + keyboardHeight: 'auto',
  141 + carBg: '',
  142 + provinceText: [
  143 + '粤',
  144 + '京',
  145 + '冀',
  146 + '沪',
  147 + '津',
  148 + '晋',
  149 + '蒙',
  150 + '辽',
  151 + '吉',
  152 + '黑',
  153 + '苏',
  154 + '浙',
  155 + '皖',
  156 + '闽',
  157 + '赣',
  158 + '鲁',
  159 + '豫',
  160 + '鄂',
  161 + '湘',
  162 + '桂',
  163 + '琼',
  164 + '渝',
  165 + '川',
  166 + '贵',
  167 + '云',
  168 + '藏',
  169 + '陕',
  170 + '甘',
  171 + '青',
  172 + '宁',
  173 + '新'
  174 + ],
  175 + numberText: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '0'],
  176 + wordText: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P', 'Q', 'R', 'S', 'T', 'U',
  177 + 'V', 'W', 'X', 'Y', 'Z'
  178 + ],
  179 + lastWordText: ['港', '澳', '学', '领', '警'],
  180 + businessId: ''
  181 + };
  182 + },
  183 + props: {
  184 + // plate: {
  185 + // type: String
  186 + // }
  187 + },
  188 + onLoad() {
  189 + this.type = 1;
  190 + this.currentInputValue = ['苏', 'B', '', '', '', '', ''];
  191 + this.currentInputIndex = 2;
  192 + let indexInfo = uni.getStorageSync("indexInfo");
  193 + this.businessId = indexInfo.businessId;
  194 + },
  195 + onShow() {
  196 + this.carBg = carBg
  197 + },
  198 + computed: {
  199 + //输入框类型
  200 + inputType() {
  201 + switch (this.currentInputIndex) {
  202 + case 0:
  203 + return 1;
  204 + break;
  205 + case 1:
  206 + return 2;
  207 + break;
  208 + case 2:
  209 + return 3;
  210 + break;
  211 + case 3:
  212 + return 3;
  213 + break;
  214 + case 4:
  215 + return 3;
  216 + break;
  217 + case 5:
  218 + return 3;
  219 + break;
  220 + case 6:
  221 + return this.type == 2 ? 3 : 4;
  222 + break;
  223 + case 7:
  224 + return 4;
  225 + break;
  226 + default:
  227 + return 1;
  228 + break;
  229 + }
  230 + }
  231 + },
  232 + watch: {
  233 + // currentInputIndex:function(n,o){
  234 + // if(!this.keyboardHeightInit) return
  235 + // this.$nextTick(()=>{
  236 + // this.changeKeyboardHeight()
  237 + // })
  238 + // }
  239 + },
  240 + methods: {
  241 + //车牌类型切换
  242 + typeChange(e) {
  243 + const {
  244 + value
  245 + } = e.detail;
  246 + this.type = parseInt(value)
  247 + this.currentInputIndex = 0
  248 + if (value == 1) {
  249 + this.currentInputValue = ['苏', 'B', '', '', '', '', '']
  250 + } else {
  251 + this.currentInputValue = ['苏', 'B', '', '', '', '', '', '']
  252 + }
  253 + },
  254 + inputSwitch(e) {
  255 + const {
  256 + index
  257 + } = e.currentTarget.dataset;
  258 + this.currentInputIndex = parseInt(index);
  259 + },
  260 + chooseKey(e) {
  261 + const {
  262 + value
  263 + } = e.currentTarget.dataset;
  264 + this.$set(this.currentInputValue, this.currentInputIndex, value);
  265 + if (this.type == 1 && this.currentInputIndex < 6) {
  266 + this.currentInputIndex++
  267 + }
  268 + if (this.type == 2 && this.currentInputIndex < 7) {
  269 + this.currentInputIndex++
  270 + }
  271 + },
  272 + deleteKey() {
  273 + this.$set(this.currentInputValue, this.currentInputIndex, '')
  274 + if (this.currentInputIndex != 0) this.currentInputIndex--
  275 + },
  276 + exportPlate() {
  277 + const plate = this.currentInputValue.join('')
  278 + let err = false
  279 + if (this.type === 1 && plate.length != 7) {
  280 + err = true
  281 + } else if (this.type === 2 && plate.length != 8) {
  282 + err = true
  283 + }
  284 + if (err) return uni.showToast({
  285 + title: '请输入完整的车牌号码',
  286 + icon: 'error'
  287 + })
  288 + console.log(plate)
  289 + this.getbBillQueryInfo(plate);
  290 + },
  291 + getbBillQueryInfo(plate) {
  292 + let that = this
  293 + let paramsData = {
  294 + carNumber: plate,
  295 + pageNum: '1',
  296 + pageSize: '10',
  297 + businessId: that.businessId,
  298 + parkState: '10',
  299 + }
  300 + // 获取 接口
  301 + that.$myRequest({
  302 + url: that.$common.queryParkingRecordByCarNumbers,
  303 + method: 'POST',
  304 + data: that.$common.requestSign(paramsData)
  305 + }).then(res => {
  306 + console.log(res)
  307 + console.log(res.data.dataList[0])
  308 + if(res.code == '0'){
  309 + let data = res.data.dataList[0]
  310 + // that.parkName = data.parkName;
  311 + // that.parkInTime = data.parkInTime;
  312 + // that.staytime = data.parkDuration;
  313 + // that.due = data.totalFee;
  314 + // that.orderFee = data.unPayFee;
  315 + // that.orderId = data.orderId;
  316 + uni.navigateTo({
  317 + url: '../parkPay/parkPay?optionData=' + JSON.stringify(data)
  318 + })
  319 + }
114 320  
115   - export default {
116   - name: 'uni-plate-input',
117   - data() {
118   - return {
119   - plateShowOrHide: false,
120   - type: 1, //车牌类型
121   - currentInputIndex: 2, //当前编辑的输入框
122   - currentInputValue: ['苏', 'B', '', '', '', '', ''],
123   - fillBlock: [{
124   - num: 11
125   - }, {
126   - num: 12
127   - }, {
128   - num: 13
129   - }, {
130   - num: 14
131   - }, {
132   - num: 15
133   - }, {
134   - num: 16
135   - }], //避免:key报错
136   - keyboardHeightInit: false,
137   - keyboardHeight: 'auto',
138   - carBg: '',
139   - provinceText: [
140   - '粤',
141   - '京',
142   - '冀',
143   - '沪',
144   - '津',
145   - '晋',
146   - '蒙',
147   - '辽',
148   - '吉',
149   - '黑',
150   - '苏',
151   - '浙',
152   - '皖',
153   - '闽',
154   - '赣',
155   - '鲁',
156   - '豫',
157   - '鄂',
158   - '湘',
159   - '桂',
160   - '琼',
161   - '渝',
162   - '川',
163   - '贵',
164   - '云',
165   - '藏',
166   - '陕',
167   - '甘',
168   - '青',
169   - '宁',
170   - '新'
171   - ],
172   - numberText: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '0'],
173   - wordText: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P', 'Q', 'R', 'S', 'T', 'U',
174   - 'V', 'W', 'X', 'Y', 'Z'
175   - ],
176   - lastWordText: ['港', '澳', '学', '领', '警']
177   - };
178   - },
179   - props: {
180   - // plate: {
181   - // type: String
182   - // }
183   - },
184   - onLoad() {
185   - this.type = 1;
186   - this.currentInputValue = ['苏', 'B', '', '', '', '', ''];
187   - this.currentInputIndex = 2;
188   - },
189   - onShow() {
190   - this.carBg = carBg
191   - },
192   - computed: {
193   - //输入框类型
194   - inputType() {
195   - switch (this.currentInputIndex) {
196   - case 0:
197   - return 1;
198   - break;
199   - case 1:
200   - return 2;
201   - break;
202   - case 2:
203   - return 3;
204   - break;
205   - case 3:
206   - return 3;
207   - break;
208   - case 4:
209   - return 3;
210   - break;
211   - case 5:
212   - return 3;
213   - break;
214   - case 6:
215   - return this.type == 2 ? 3 : 4;
216   - break;
217   - case 7:
218   - return 4;
219   - break;
220   - default:
221   - return 1;
222   - break;
223   - }
224   - }
225   - },
226   - watch: {
227   - // currentInputIndex:function(n,o){
228   - // if(!this.keyboardHeightInit) return
229   - // this.$nextTick(()=>{
230   - // this.changeKeyboardHeight()
231   - // })
232   - // }
233   - },
234   - methods: {
235   - //车牌类型切换
236   - typeChange(e) {
237   - const {
238   - value
239   - } = e.detail;
240   - this.type = parseInt(value)
241   - this.currentInputIndex = 0
242   - if (value == 1) {
243   - this.currentInputValue = ['苏', 'B', '', '', '', '', '']
244   - } else {
245   - this.currentInputValue = ['苏', 'B','', '', '', '', '', '']
246   - }
247   - },
248   - inputSwitch(e) {
249   - const {
250   - index
251   - } = e.currentTarget.dataset;
252   - this.currentInputIndex = parseInt(index);
253   - },
254   - chooseKey(e) {
255   - const {
256   - value
257   - } = e.currentTarget.dataset;
258   - this.$set(this.currentInputValue, this.currentInputIndex, value);
259   - if (this.type == 1 && this.currentInputIndex < 6) {
260   - this.currentInputIndex++
261   - }
262   - if (this.type == 2 && this.currentInputIndex < 7) {
263   - this.currentInputIndex++
264   - }
265   - },
266   - deleteKey() {
267   - this.$set(this.currentInputValue, this.currentInputIndex, '')
268   - if (this.currentInputIndex != 0) this.currentInputIndex--
269   - },
270   - exportPlate() {
271   - const plate = this.currentInputValue.join('')
272   - let err = false
273   - if (this.type === 1 && plate.length != 7) {
274   - err = true
275   - } else if (this.type === 2 && plate.length != 8) {
276   - err = true
277   - }
278   - if (err) return uni.showToast({
279   - title: '请输入完整的车牌号码',
280   - icon: 'error'
281   - })
282   -
283   - console.log(plate)
284   -
285   - uni.navigateTo({
286   - url: '../parkPay/parkPay?carNumber=' + plate
287   - })
288   - },
289   - changeKeyboardHeight() {
290   - const that = this
291   - const query = uni.createSelectorQuery().in(this);
292   - query.select('#keyboard').boundingClientRect();
293   - query.exec(function(res) {
294   - if (res && res[0]) {
295   - that.keyboardHeight = res[0].height + uni.upx2px(30) + 'px'
296   - that.keyboardHeightInit = true
297   - }
298   - });
299   - }
300   - },
301   - mounted() {
302   - console.log(this.plate);
303   - const plateKey = this.plate.split('')
304   - if (plateKey.length === 7) {
305   - this.type = 1
306   - } else if (plateKey.length === 8) {
307   - this.type = 2
308   - }
309   - if (plateKey.length === 7 || plateKey.length === 8) {
310   - this.currentInputValue = plateKey
311   - this.currentInputIndex = plateKey.length - 1
312   - }
313   -
314   - setTimeout(() => { //在动画结束之后才开始获取
315   - this.$nextTick(() => {
316   - this.changeKeyboardHeight()
317   - })
318   - }, 500);
319   - }
320   - };
  321 + })
  322 + },
  323 + changeKeyboardHeight() {
  324 + const that = this
  325 + const query = uni.createSelectorQuery().in(this);
  326 + query.select('#keyboard').boundingClientRect();
  327 + query.exec(function (res) {
  328 + if (res && res[0]) {
  329 + that.keyboardHeight = res[0].height + uni.upx2px(30) + 'px'
  330 + that.keyboardHeightInit = true
  331 + }
  332 + });
  333 + }
  334 + },
  335 + mounted() {
  336 + console.log(this.plate);
  337 + const plateKey = this.plate.split('')
  338 + if (plateKey.length === 7) {
  339 + this.type = 1
  340 + } else if (plateKey.length === 8) {
  341 + this.type = 2
  342 + }
  343 + if (plateKey.length === 7 || plateKey.length === 8) {
  344 + this.currentInputValue = plateKey
  345 + this.currentInputIndex = plateKey.length - 1
  346 + }
  347 + setTimeout(() => { //在动画结束之后才开始获取
  348 + this.$nextTick(() => {
  349 + this.changeKeyboardHeight()
  350 + })
  351 + }, 500);
  352 + }
  353 +};
321 354 </script>
322 355 <style scoped lang="less">
323   - @import 'uni-plate-input';
  356 + @import 'uni-plate-input';
324 357  
325   - .bg-icon {
326   - /*padding: 10px 0;*/
327   - height: 60px;
328   - /*background: url("../../static/inputCarNumber_pic/carBg.png") no-repeat;*/
329   - /*background-size: 100% 100%;*/
330   - color: #FFF;
331   - }
  358 + .bg-icon {
  359 + /*padding: 10px 0;*/
  360 + height: 60px;
  361 + /*background: url("../../static/inputCarNumber_pic/carBg.png") no-repeat;*/
  362 + /*background-size: 100% 100%;*/
  363 + color: #FFF;
  364 + }
332 365  
333   - .bac {
334   - position: absolute;
335   - width: 100%;
336   - height: 60px;
337   - }
  366 + .bac {
  367 + position: absolute;
  368 + width: 100%;
  369 + height: 60px;
  370 + }
338 371  
339   - .bg-text {
340   - width: 100%;
341   - position: absolute;
342   - top: 10px;
343   - text-align: center;
  372 + .bg-text {
  373 + width: 100%;
  374 + position: absolute;
  375 + top: 10px;
  376 + text-align: center;
344 377  
345   - }
  378 + }
346 379 </style>
... ...
pages/parkPay/parkPay.vue
  View file @c0558eb
1 1 <template>
2 2 <view>
3   - <view v-show="showFlag" style="padding: 20px; text-align: center">
4   - 该车没有停放在该车场
5   - </view>
6   - <view v-else>
7   - <!-- <view class="order-time">
  3 +
  4 + <!-- <view class="order-time">
8 5 剩余支付时间: {{appOrderTimeout}}
9 6 </view> -->
10 7  
11   - <view class="order-title">
12   - 订单详情
13   - </view>
14   - <view class="order-info">
15   - 车牌号：{{mycarNumber | tranNull}}
16   - </view>
17   - <view class="order-line"></view>
18   - <view class="order-info">
19   - 停车场：{{parkName | tranNull}}
20   - </view>
21   - <view class="order-line"></view>
22   - <view class="order-info">
23   - 进场时间：{{parkInTime | tranNull}}
24   - </view>
25   - <view class="order-line"></view>
26   - <view class="order-info">
27   - 停车时间：{{staytime | timeFormatter}}
28   - </view>
29   - <view class="order-line"></view>
  8 + <view class="order-title">
  9 + 订单详情
  10 + </view>
  11 + <view class="order-info">
  12 + 车牌号：{{mycarNumber | tranNull}}
  13 + </view>
  14 + <view class="order-line"></view>
  15 + <view class="order-info">
  16 + 停车场：{{parkName | tranNull}}
  17 + </view>
  18 + <view class="order-line"></view>
  19 + <view class="order-info">
  20 + 进场时间：{{parkInTime | tranNull}}
  21 + </view>
  22 + <view class="order-line"></view>
  23 + <view class="order-info">
  24 + 停车时间：{{staytime | timeFormatter}}
  25 + </view>
  26 + <view class="order-line"></view>
  27 + <view class="order-info">
  28 + 总计费用：{{due |toFixed2}}元
  29 + </view>
  30 + <view class="order-line"></view>
  31 +
  32 + <view class="flex-row-justify-between">
30 33 <view class="order-info">
31   - 总计费用：{{due |toFixed2}}元
  34 + 支付金额
32 35 </view>
33   - <view class="order-line"></view>
34   -
35   - <view class="flex-row-justify-between">
36   - <view class="order-info">
37   - 支付金额
  36 + <view class="flex-row-justify-end">
  37 + <view class="order-info" style="font-weight:bold;font-size:17px ;">
  38 + {{orderFee | toFixed2}}
38 39 </view>
39   - <view class="flex-row-justify-end">
40   - <view class="order-info" style="font-weight:bold;font-size:17px ;">
41   - {{orderFee | toFixed2}}
42   - </view>
43   - <view class="order-info" style="margin-right: 50upx;margin-left: 0px;">
44   - 元
45   - </view>
  40 + <view class="order-info" style="margin-right: 50upx;margin-left: 0px;">
  41 + 元
46 42 </view>
47 43 </view>
  44 + </view>
48 45  
49   - <view class="order-line-bold"></view>
  46 + <view class="order-line-bold"></view>
50 47  
51   - <view class="order-title">
52   - 支付方法
53   - </view>
54   - <view class="order-line"></view>
55   -
56   - <view class="orderwaysview">
57   - <!--<image src="../../static/orderInfo/orderinfo-wechat.png" class="orderways"></image>-->
58   - <view class="order-info" style="margin-left: 15px;">
59   - 商户余额
60   - </view>
61   - <image src="../../static/orderInfo/orderinfo-sel.png" class="orderwaysSel"></image>
  48 + <view class="order-title">
  49 + 支付方法
  50 + </view>
  51 + <view class="order-line"></view>
62 52  
  53 + <view class="orderwaysview">
  54 + <!--<image src="../../static/orderInfo/orderinfo-wechat.png" class="orderways"></image>-->
  55 + <view class="order-info" style="margin-left: 15px;">
  56 + 商户余额
63 57 </view>
  58 + <image src="../../static/orderInfo/orderinfo-sel.png" class="orderwaysSel"></image>
64 59  
65   - <view class="order-line"></view>
66   - <button @click="payClick" class="button-sp-area" type="primary" plain="true">确认支付</button>
67 60 </view>
68 61  
69   -
  62 + <view class="order-line"></view>
  63 + <button @click="payClick" class="button-sp-area" type="primary" plain="true">确认支付</button>
70 64  
71 65 </view>
72 66 </template>
... ... @@ -85,21 +79,22 @@ export default {
85 79 orderFee: '',
86 80 // appOrderTimeout:'0',
87 81 totalFee: '', //应收
88   - showFlag: false,
89 82 }
90 83 },
91 84 onLoad(params) {
92 85 wx.showShareMenu({
93 86 withShareTicket: true
94 87 })
95   - this.mycarNumber = params.carNumber;
96   - let indexInfo = uni.getStorageSync("indexInfo");
97   - this.businessId = indexInfo.businessId;
98   - console.log(this.mycarNumber, this.businessId)
99   - this.getbBillQueryInfo();
  88 + let data = JSON.parse(params.optionData)
  89 + this.mycarNumber = data.carNumber
  90 + this.parkName = data.parkName;
  91 + this.parkInTime = data.parkInTime;
  92 + this.staytime = data.parkDuration;
  93 + this.due = data.totalFee;
  94 + this.orderFee = data.unPayFee;
  95 + this.orderId = data.orderId;
100 96 },
101 97 onShow() {
102   -
103 98 },
104 99 methods: {
105 100 payClick() {
... ... @@ -133,36 +128,6 @@ export default {
133 128 }, 2000);
134 129 })
135 130 },
136   - getbBillQueryInfo() {
137   - let that = this
138   - let paramsData = {
139   - carNumber: that.mycarNumber,
140   - pageNum: '1',
141   - pageSize: '10',
142   - businessId: that.businessId,
143   - parkState: '10',
144   - }
145   - // 获取 接口
146   - that.$myRequest({
147   - url: that.$common.queryParkingRecordByCarNumbers,
148   - method: 'POST',
149   - data: that.$common.requestSign(paramsData)
150   - }).then(res => {
151   - console.log(res.data.dataList[0])
152   - if (res.data.dataList.length > 0) {
153   - let data = res.data.dataList[0]
154   - that.parkName = data.parkName;
155   - that.parkInTime = data.parkInTime;
156   - that.staytime = data.parkDuration;
157   - that.due = data.totalFee;
158   - that.orderFee = data.unPayFee;
159   - that.orderId = data.orderId;
160   - that.showFlag = false
161   - } else {
162   - that.showFlag = true
163   - }
164   - })
165   - },
166 131 }
167 132 }
168 133 </script>
... ...