BJ_web_developers / wxgzh

Commit 2b4641ef0e1e67e4f10db2174b702db7aa8e85b5

Authored by 刘淇
1 parent 4a26ed6a

添加车牌颜色

Inline Side-by-side
Showing 1 changed file with 48 additions and 40 deletions
src/views/parkPay/plateNumber.vue
  View file @2b4641e
... ... @@ -18,20 +18,20 @@
18 18 <div class="wrap">
19 19 <!--<p style="margin-bottom: 18px;margin-top: 18px;">请选择车牌颜色</p>-->
20 20  
21   - <!--<ul class="color-choose">-->
22   - <!--<li v-for="(i,index) in colorList" :key="i.name" @click="chooseColor(index)"-->
23   - <!--:style="{color:currentColor==index?'#FFF':'',background: currentColor==index?activeBG:'' }"-->
24   - <!--&gt;-->
25   - <!--{{i.name}}-->
26   - <!--</li>-->
  21 + <ul class="color-choose">
  22 + <li v-for="(i,index) in colorList" :key="i.name" @click="chooseColor(index)"
  23 + :style="{color:currentColor==index?'#FFF':'',background: currentColor==index?activeBG:'' }"
  24 + >
  25 + {{i.name}}
  26 + </li>
27 27  
28   - <!--</ul>-->
  28 + </ul>
29 29  
30 30  
31 31  
32 32  
33   -
34   - <p style="margin-bottom: 18px;margin-top: 18px;">请输入车牌号码</p>
  33 + <p style="margin-bottom: 18px;margin-top: 18px;"></p>
  34 + <!--<p style="margin-bottom: 18px;margin-top: 18px;">请输入车牌号码</p>-->
35 35 <div class="num-box">
36 36 <div class="num0" @click="clickFirstWrap()">
37 37 <span>{{formData.num0}}</span>
... ... @@ -47,30 +47,30 @@
47 47 </div>
48 48  
49 49  
50   - <div class="radio-box">
51   - <label class="flex-items-center">
52   - <img v-if="formData.commonCard == 1"
53   - src="../../assets/images/parkPay/icon_chose_s@2x.png"
54   - alt="">
55   - <img v-else
56   - src="../../assets/images/parkPay/icon_chose_n@2x.png"
57   - alt="">
58   - <input type="radio"
59   - v-model="formData.commonCard"
60   - value="1" />普通车牌
61   - </label>
62   - <label class="flex-items-center">
63   - <img v-if="formData.commonCard == 2"
64   - src="../../assets/images/parkPay/icon_chose_s@2x.png"
65   - alt="">
66   - <img v-else
67   - src="../../assets/images/parkPay/icon_chose_n@2x.png"
68   - alt="">
69   - <input type="radio"
70   - v-model="formData.commonCard"
71   - value="2" />新能源车牌
72   - </label>
73   - </div>
  50 + <!--<div class="radio-box">-->
  51 + <!--<label class="flex-items-center">-->
  52 + <!--<img v-if="formData.commonCard == 1"-->
  53 + <!--src="../../assets/images/parkPay/icon_chose_s@2x.png"-->
  54 + <!--alt="">-->
  55 + <!--<img v-else-->
  56 + <!--src="../../assets/images/parkPay/icon_chose_n@2x.png"-->
  57 + <!--alt="">-->
  58 + <!--<input type="radio"-->
  59 + <!--v-model="formData.commonCard"-->
  60 + <!--value="1" />普通车牌-->
  61 + <!--</label>-->
  62 + <!--<label class="flex-items-center">-->
  63 + <!--<img v-if="formData.commonCard == 2"-->
  64 + <!--src="../../assets/images/parkPay/icon_chose_s@2x.png"-->
  65 + <!--alt="">-->
  66 + <!--<img v-else-->
  67 + <!--src="../../assets/images/parkPay/icon_chose_n@2x.png"-->
  68 + <!--alt="">-->
  69 + <!--<input type="radio"-->
  70 + <!--v-model="formData.commonCard"-->
  71 + <!--value="2" />新能源车牌-->
  72 + <!--</label>-->
  73 + <!--</div>-->
74 74  
75 75  
76 76 <div class="submit-box" @click="submitFn()">
... ... @@ -301,6 +301,8 @@ import {swiperQuery} from &#39;../../api/plateNumber/plateNumber&#39;
301 301 export default {
302 302 data () {
303 303 return {
  304 +
  305 + // 0:蓝牌;1:黄牌;2:白牌;3:黑牌;4:绿色
304 306 colorList:[
305 307 {
306 308 name:'蓝牌',
... ... @@ -310,16 +312,17 @@ export default {
310 312 name:'黄牌',
311 313 id:'2'
312 314 },
  315 +
313 316 {
314   - name:'绿牌',
  317 + name:'白牌',
315 318 id:'3'
316 319 },
317 320 {
318   - name:'白牌',
  321 + name:'黑牌',
319 322 id:'4'
320 323 },
321 324 {
322   - name:'黑牌',
  325 + name:'绿牌',
323 326 id:'5'
324 327 },
325 328 ],
... ... @@ -420,23 +423,28 @@ export default {
420 423 }
421 424 })
422 425 },
423   - chooseColor (index){ // 颜色选择
  426 + chooseColor (index){ // 颜色选择 0:蓝牌;1:黄牌;2:白牌;3:黑牌;4:绿色
424 427 this.currentColor = index
425 428 switch (this.currentColor) {
426 429 case 0 :
  430 + this.formData.commonCard = '1'
427 431 return this.activeBG = '#0054C0'
428 432 break;
429 433 case 1 :
  434 + this.formData.commonCard = '1'
430 435 return this.activeBG = '#FEBE00'
431 436 break;
432 437 case 2 :
433   - return this.activeBG = '#97DEA1'
  438 + this.formData.commonCard = '1'
  439 + return this.activeBG = '#E4E5E7'
434 440 break;
435 441 case 3 :
436   - return this.activeBG = '#E4E5E7'
  442 + this.formData.commonCard = '1'
  443 + return this.activeBG = '#333333'
437 444 break;
438 445 case 4 :
439   - return this.activeBG = '#333333'
  446 + this.formData.commonCard = '2'
  447 + return this.activeBG = '#97DEA1'
440 448 break;
441 449 }
442 450 },
... ...