BJ_web_developers / codeScanning

Commit a17ce3dfc0078a5bb7249d47a5b2a6216cc20074

Authored by 刘淇
1 parent daddc283

宣化 小票码

Inline Side-by-side
Showing 6 changed files with 795 additions and 6 deletions
src/components/carPlateNum.vue 0 → 100644
  View file @a17ce3d
  1 +<template>
  2 + <div id="page">
  3 + <div class="wrap">
  4 + <p style="margin-bottom: 18px;margin-top: 18px;color: #4194EF;">请选择车牌颜色</p>
  5 +
  6 + <ul class="color-choose">
  7 + <li v-for="(i,index) in colorList" :key="i.name" @click="chooseColor(index)"
  8 + :style="{color:currentColor==index?'#FFF':'',background: currentColor==index?activeBG:'' }"
  9 + >
  10 + {{i.name}}
  11 + </li>
  12 +
  13 + </ul>
  14 +
  15 + <p style="margin-bottom: 18px;margin-top: 18px;color: #4194EF;">请输入车牌号码</p>
  16 + <div class="num-box">
  17 + <div class="num0" @click="clickFirstWrap()">
  18 + <span>{{formData.num0}}</span>
  19 + </div>
  20 + <div class="num1" @click="clickKeyWordWrap(1)"><span>{{formData.num1}}</span></div>
  21 + <em class="spot"></em>
  22 + <div class="num1" @click="clickKeyWordWrap(2)"><span>{{formData.num2}}</span></div>
  23 + <div class="num1" @click="clickKeyWordWrap(3)"><span>{{formData.num3}}</span></div>
  24 + <div class="num1" @click="clickKeyWordWrap(4)"><span>{{formData.num4}}</span></div>
  25 + <div class="num1" @click="clickKeyWordWrap(5)"><span>{{formData.num5}}</span></div>
  26 + <div class="num1" @click="clickKeyWordWrap(6)"><span>{{formData.num6}}</span></div>
  27 + <div v-if="formData.commonCard == '2'" class="num1" @click="clickKeyWordWrap(7)"><span>{{formData.num7}}</span></div>
  28 + </div>
  29 +
  30 +
  31 + <div class="radio-box">
  32 + <label class="flex-items-center">
  33 + <img v-if="formData.commonCard == 1"
  34 + src="../assets/images/icon_chose_s@2x.png"
  35 + alt="">
  36 + <img v-else
  37 + src="../assets/images/icon_chose_n@2x.png"
  38 + alt="">
  39 + <input type="radio"
  40 + v-model="formData.commonCard"
  41 + value="1" />普通车牌
  42 + </label>
  43 + <label class="flex-items-center">
  44 + <img v-if="formData.commonCard == 2"
  45 + src="../assets/images/icon_chose_s@2x.png"
  46 + alt="">
  47 + <img v-else
  48 + src="../assets/images/icon_chose_n@2x.png"
  49 + alt="">
  50 + <input type="radio"
  51 + v-model="formData.commonCard"
  52 + value="2" />新能源车牌
  53 + </label>
  54 + </div>
  55 +
  56 +
  57 + <div class="submit-box" @click="submitFn()">
  58 + 查询
  59 + </div>
  60 + </div>
  61 + <div class="first-word-wrap"
  62 + v-if="firstWrapStatus">
  63 + <div class="first-word"
  64 + @click="selectFirstWord($event)">
  65 + <div class="word">
  66 + <span>冀</span>
  67 + </div>
  68 + <div class="word">
  69 + <span>湘</span>
  70 + </div>
  71 + <div class="word">
  72 + <span>津</span>
  73 + </div>
  74 + <div class="word">
  75 + <span>鄂</span>
  76 + </div>
  77 + <div class="word">
  78 + <span>沪</span>
  79 + </div>
  80 + <div class="word">
  81 + <span>粤</span>
  82 + </div>
  83 + <div class="word">
  84 + <span>渝</span>
  85 + </div>
  86 + <div class="word">
  87 + <span>琼</span>
  88 + </div>
  89 + </div>
  90 + <div class="first-word"
  91 + @click="selectFirstWord($event)">
  92 + <div class="word">
  93 + <span>蒙</span>
  94 + </div>
  95 + <div class="word">
  96 + <span>川</span>
  97 + </div>
  98 + <div class="word">
  99 + <span>晋</span>
  100 + </div>
  101 + <div class="word">
  102 + <span>贵</span>
  103 + </div>
  104 + <div class="word">
  105 + <span>辽</span>
  106 + </div>
  107 + <div class="word">
  108 + <span>云</span>
  109 + </div>
  110 + <div class="word">
  111 + <span>吉</span>
  112 + </div>
  113 + <div class="word">
  114 + <span>陕</span>
  115 + </div>
  116 + </div>
  117 + <div class="first-word"
  118 + @click="selectFirstWord($event)">
  119 + <div class="word">
  120 + <span>黑</span>
  121 + </div>
  122 + <div class="word">
  123 + <span>甘</span>
  124 + </div>
  125 + <div class="word">
  126 + <span>苏</span>
  127 + </div>
  128 + <div class="word">
  129 + <span>青</span>
  130 + </div>
  131 + <div class="word">
  132 + <span>浙</span>
  133 + </div>
  134 + <div class="word">
  135 + <span>皖</span>
  136 + </div>
  137 + <div class="word">
  138 + <span>藏</span>
  139 + </div>
  140 + <div class="word">
  141 + <span>闽</span>
  142 + </div>
  143 + </div>
  144 + <div class="first-word"
  145 + @click="selectFirstWord($event)">
  146 + <div class="word">
  147 + <span>京</span>
  148 + </div>
  149 + <div class="word">
  150 + <span>赣</span>
  151 + </div>
  152 + <div class="word">
  153 + <span>桂</span>
  154 + </div>
  155 + <div class="word">
  156 + <span>鲁</span>
  157 + </div>
  158 + <div class="word">
  159 + <span>宁</span>
  160 + </div>
  161 + <div class="word">
  162 + <span>豫</span>
  163 + </div>
  164 + <div class="word">
  165 + <span>新</span>
  166 + </div>
  167 +
  168 + <!--<div class="word">-->
  169 + <!--<span>学</span>-->
  170 + <!--</div>-->
  171 + <div class="word bordernone">
  172 + <!-- <img src="../assets/images/icon-switch.png" alt=""> -->
  173 + </div>
  174 + </div>
  175 +
  176 +
  177 + <!--<div class="first-word"-->
  178 + <!--@click="selectFirstWord($event)">-->
  179 + <!--<div class="word">-->
  180 + <!--<span>港</span>-->
  181 + <!--</div>-->
  182 + <!--<div class="word">-->
  183 + <!--<span>澳</span>-->
  184 + <!--</div>-->
  185 + <!--<div class="word">-->
  186 + <!--<span>领</span>-->
  187 + <!--</div>-->
  188 +
  189 + <!--<div class="word">-->
  190 + <!--<span>警</span>-->
  191 + <!--</div>-->
  192 +
  193 +
  194 + <!--<div class="word bordernone">-->
  195 + <!--</div>-->
  196 + <!--<div class="word bordernone">-->
  197 + <!--</div>-->
  198 + <!--<div class="word bordernone">-->
  199 + <!--</div>-->
  200 + <!--<div class="word bordernone">-->
  201 + <!--</div>-->
  202 + <!--</div>-->
  203 +
  204 + </div>
  205 + <div class="keyboard-wrap" v-if="keyBoardStatus === true">
  206 + <!-- <div class="number-wrap"></div>
  207 + <div class="letter-wrap"></div>
  208 + <div class="cn-wrap"></div> -->
  209 + <div class="keyboard" v-if="activeKeyWordIndex !== 1">
  210 + <span v-for="(item,index) in allKeyWord._1"
  211 + :key="index"
  212 + @click="clickKeyBoard(item)">{{item}}</span>
  213 + </div>
  214 + <div class="keyboard" v-if="activeKeyWordIndex !== 1">
  215 + <span v-for="(item,index) in allKeyWord._2"
  216 + :key="index"
  217 + @click="clickKeyBoard(item)">{{item}}</span>
  218 + <span class="bordernone"></span>
  219 + <span class="bordernone"></span>
  220 + <span class="bordernone"></span>
  221 + <span class="bordernone"></span>
  222 + </div>
  223 + <div class="keyboard">
  224 + <span v-for="(item,index) in allKeyWord._3"
  225 + :key="index"
  226 + @click="clickKeyBoard(item)">{{item}}</span>
  227 + </div>
  228 + <div class="keyboard">
  229 + <span v-for="(item,index) in allKeyWord._4"
  230 + :key="index"
  231 + @click="clickKeyBoard(item)">{{item}}</span>
  232 + </div>
  233 + <div class="keyboard">
  234 + <span v-for="(item,index) in allKeyWord._5"
  235 + :key="index"
  236 + @click="clickKeyBoard(item)">{{item}}</span>
  237 + </div>
  238 + <div class="keyboard">
  239 + <span v-for="(item,index) in allKeyWord._6"
  240 + :key="index"
  241 + @click="clickKeyBoard(item)">{{item}}</span>
  242 + <span class="bordernone"></span>
  243 + <span class="bordernone"></span>
  244 + <span class="bordernone"></span>
  245 + <!-- <span class="bordernone" v-if="activeKeyWordIndex === 1"></span>
  246 + <span class="bordernone" v-if="activeKeyWordIndex === 1"></span> -->
  247 + <!-- <span @click="deleteWord" v-if="activeKeyWordIndex === 1">x</span> -->
  248 + </div>
  249 + <div class="keyboard" v-if="activeKeyWordIndex !== 1">
  250 + <span v-for="(item,index) in allKeyWord._7"
  251 + :key="index"
  252 + @click="clickKeyBoard(item)">{{item}}</span>
  253 + <span class="bordernone"></span>
  254 + <span class="delete" @click="deleteWord"><img src="../assets/images/icon-delete.png" alt=""></span>
  255 + </div>
  256 + <div class="cancel">
  257 + <span @click="keyBoardStatus = false">完成</span>
  258 + </div>
  259 + </div>
  260 +
  261 +
  262 + <modal-alert ref="alert">
  263 + <div class="trave-tip-content txt-l" slot="content">
  264 + <div class="confirm-text">
  265 + <p>请输入正确的车牌号</p>
  266 + </div>
  267 + </div>
  268 + <span slot="button">知道了</span>
  269 + </modal-alert>
  270 + </div>
  271 +</template>
  272 +<script>
  273 +export default {
  274 + data () {
  275 + return {
  276 + colorList:[
  277 + {
  278 + name:'蓝牌',
  279 + id:'1'
  280 + },
  281 + {
  282 + name:'黄牌',
  283 + id:'2'
  284 + },
  285 + {
  286 + name:'白牌',
  287 + id:'3'
  288 + },
  289 + {
  290 + name:'黑牌',
  291 + id:'4'
  292 + },
  293 + {
  294 + name:'绿牌',
  295 + id:'5'
  296 + },
  297 + ],
  298 + currentColor:0,
  299 + activeBG:'#0054C0',
  300 + formData: {
  301 + commonCard: '1',
  302 + num0: '',
  303 + num1: '',
  304 + num2: '',
  305 + num3: '',
  306 + num4: '',
  307 + num5: '',
  308 + num6: '',
  309 + num7: ''
  310 + },
  311 + allKeyWord: {
  312 + _1: [1, 2, 3, 4, 5, 6, 7],
  313 + _2: [8, 9, 0],
  314 + _3: ['A', 'B', 'C', 'D', 'E', 'F', 'G'],
  315 + _4: ['H', 'J', 'K', 'L', 'M', 'N', 'O'],
  316 + _5: ['P', 'Q', 'R', 'S', 'T', 'U', 'V'],
  317 + _6: ['W', 'X', 'Y', 'Z'],
  318 + _7: ['港', '澳', '学', '领', '警']
  319 + },
  320 + activeKeyWordIndex: 1, // 当前车牌号
  321 + keyBoardStatus: false,
  322 + firstWrapStatus: false, // 选择弹窗
  323 + confirmTitle: '',
  324 + submitConfirm: false,
  325 + submitConfirmFalse: false,
  326 + submitConfirmText: ''
  327 + }
  328 + },
  329 + mounted () {
  330 +
  331 + if (this.$utils.clientBrowser() == "微信") {
  332 + var appID = this.$utils.myVxAppId;
  333 + var code = this.getUrlParam('code');
  334 + var local = window.location.href;
  335 + if (code == null || code === '') {
  336 + window.location.href = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid='+appID+'&redirect_uri='+encodeURIComponent(local)+'&response_type=code&scope=snsapi_userinfo&state=1,0#wechat_redirect'
  337 + } else {
  338 + return code;
  339 + }
  340 + }
  341 +
  342 + },
  343 + methods: {
  344 + getUrlParam(name) {
  345 + var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)');
  346 + var r = window.location.search.substr(1).match(reg)
  347 + if (r != null) return unescape(r[2])
  348 + return null
  349 + },
  350 + chooseColor (index){ // 颜色选择
  351 + this.currentColor = index
  352 + switch (this.currentColor) {
  353 + case 0 :
  354 + return this.activeBG = '#0054C0'
  355 + break;
  356 + case 1 :
  357 + return this.activeBG = '#FEBE00'
  358 + break;
  359 + case 2 :
  360 + return this.activeBG = '#E4E5E7'
  361 + break;
  362 + case 3 :
  363 + return this.activeBG = '#333333'
  364 + break;
  365 + case 4 :
  366 + return this.activeBG = '#97DEA1'
  367 + break;
  368 + }
  369 + },
  370 + clickFirstWrap () {
  371 + // 点击第一个输入框
  372 + this.firstClickStatus = true
  373 + this.firstWrapStatus = true
  374 + this.keyBoardStatus = false
  375 + this.formData.num0 = ''
  376 + },
  377 + selectFirstWord (event) {
  378 + // 选择省份
  379 + if (event.target.localName !== 'span') {
  380 + return
  381 + }
  382 + this.formData.num0 = event.target.innerText
  383 + this.firstSelectStatus = true
  384 + this.firstWrapStatus = false
  385 + this.firstClickStatus = false
  386 + this.keyBoardStatus = true
  387 + this.activeKeyWordIndex = 1
  388 + // this.$refs.num1.focus()
  389 + // document.getElementById('num1').focus()
  390 + },
  391 + clickKeyBoard (item) { // 点击自定义键盘
  392 + console.log(item)
  393 + this.formData['num' + this.activeKeyWordIndex] = item
  394 +
  395 + if (this.formData.commonCard === '1') {
  396 + this.activeKeyWordIndex++
  397 + if (this.activeKeyWordIndex > 6) {
  398 + this.keyBoardStatus = false
  399 + }
  400 + } else {
  401 + this.activeKeyWordIndex++
  402 + if (this.activeKeyWordIndex > 7) {
  403 + this.keyBoardStatus = false
  404 + }
  405 + }
  406 + },
  407 + deleteWord () { // 退格
  408 + // console.log(this.activeKeyWordIndex)
  409 + // console.log(this.formData['num' + (this.activeKeyWordIndex - 1)])
  410 + if (this.activeKeyWordIndex > 1) {
  411 + this.formData['num' + (this.activeKeyWordIndex - 1)] = ''
  412 + this.activeKeyWordIndex--
  413 + }
  414 + },
  415 + clickKeyWordWrap (activeKeyWordIndex) {
  416 + this.keyBoardStatus = true
  417 + this.activeKeyWordIndex = activeKeyWordIndex
  418 + this.formData['num' + this.activeKeyWordIndex] = ''
  419 + },
  420 + submitFn () {
  421 + let plateLicense
  422 + if (this.formData.commonCard === '1') {
  423 + plateLicense = this.plate_license_1
  424 + plateLicense = this.palindrome(plateLicense)
  425 + if (plateLicense.length < 7) {
  426 + this.$refs.alert.open()
  427 + return
  428 + }
  429 + }
  430 + if (this.formData.commonCard === '2') {
  431 + plateLicense = this.plate_license_2
  432 + plateLicense = this.palindrome(plateLicense)
  433 + if (plateLicense.length < 8) {
  434 + this.$refs.alert.open()
  435 + return
  436 + }
  437 + }
  438 + this.$emit('getPlateLicense',plateLicense)
  439 + console.log(plateLicense);
  440 + this.$router.push({
  441 + path:'parkRecord',
  442 + query:{
  443 + carNumber:plateLicense,
  444 + carNumberColor: this.currentColor
  445 + }
  446 + })
  447 + },
  448 + palindrome (str) {
  449 + var arr = str.split('')
  450 + arr = arr.filter(function (val) {
  451 + return (
  452 + val !== ' ' &&
  453 + val !== ',' &&
  454 + val !== '.' &&
  455 + val !== '?' &&
  456 + val !== ':' &&
  457 + val !== ';' &&
  458 + val !== '`' &&
  459 + val !== "'" &&
  460 + val !== '_' &&
  461 + val !== '/' &&
  462 + val !== '-' &&
  463 + val !== '\\' &&
  464 + val !== '' &&
  465 + val !== '(' &&
  466 + val !== ')'
  467 + )
  468 + })
  469 + return arr.join('')
  470 + },
  471 + checkIsHasSpecialStr (str) {
  472 + var flag = false
  473 + var arr = str.split('')
  474 + arr.forEach(val => {
  475 + if (
  476 + val === '!' ||
  477 + val === '}' ||
  478 + val === '{' ||
  479 + val === ']' ||
  480 + val === '[' ||
  481 + val === '&' ||
  482 + val === '$' ||
  483 + val === '@' ||
  484 + val === ' ' ||
  485 + val === ',' ||
  486 + val === '.' ||
  487 + val === '?' ||
  488 + val === ':' ||
  489 + val === ';' ||
  490 + val === '`' ||
  491 + val === "'" ||
  492 + val === '_' ||
  493 + val === '/' ||
  494 + val === '-' ||
  495 + val === '\\' ||
  496 + val === '' ||
  497 + val === '(' ||
  498 + val === ')'
  499 + ) {
  500 + flag = true
  501 + }
  502 + })
  503 + return flag
  504 + },
  505 + checkIsHasChineseStr (str) {
  506 + var Reg = /.*[\u4e00-\u9fa5]+.*/
  507 + if (Reg.test(str)) {
  508 + return true
  509 + }
  510 + return false
  511 + }
  512 + },
  513 + computed: {
  514 + plate_license_1 () {
  515 + return (
  516 + this.formData.num0 +
  517 + this.formData.num1 +
  518 + this.formData.num2 +
  519 + this.formData.num3 +
  520 + this.formData.num4 +
  521 + this.formData.num5 +
  522 + this.formData.num6
  523 + )
  524 + },
  525 + plate_license_2 () {
  526 + return (
  527 + this.formData.num0 +
  528 + this.formData.num1 +
  529 + this.formData.num2 +
  530 + this.formData.num3 +
  531 + this.formData.num4 +
  532 + this.formData.num5 +
  533 + this.formData.num6 +
  534 + this.formData.num7
  535 + )
  536 + }
  537 + }
  538 +}
  539 +</script>
  540 +<style lang="scss" scoped>
  541 + .flex-items-center {
  542 + display: flex;
  543 + align-items: center;
  544 + }
  545 + .wrap {
  546 + padding:0 18px;
  547 + .radio-box {
  548 + display: flex;
  549 + align-items: center;
  550 + justify-content: flex-end;
  551 + margin-top: 18px;
  552 + text-align: right;
  553 + color: #4194EF;
  554 + input[type="radio"] {
  555 + display: none;
  556 + }
  557 + label {
  558 + padding-left: 0.6rem;
  559 + cursor: pointer;
  560 + img {
  561 + width: 0.8rem;
  562 + margin-right: 0.1rem;
  563 + }
  564 + }
  565 + }
  566 +
  567 + .color-choose{
  568 + width: 265px;
  569 + height: 34px;
  570 + margin: 0 auto;
  571 + background: #F3F3F3;
  572 + border-radius: 6px;
  573 + display: flex;
  574 + li{
  575 + flex: 1;
  576 + text-align: center;
  577 + line-height: 34px;
  578 + border-radius: 6px;
  579 + }
  580 + }
  581 + .card-header {
  582 + font-size: 0.75rem;
  583 + margin: 0.2rem 0 0.5rem;
  584 + color: #4a4a4a;
  585 + }
  586 + // input输入框
  587 + .num-box {
  588 + display: flex;
  589 + justify-content: space-between;
  590 + align-items: center;
  591 + .spot {
  592 + width: 0.4rem;
  593 + height: 0.4rem;
  594 + border-radius: 50%;
  595 + background-color: #999;
  596 + }
  597 + & > div {
  598 + width: 2.3rem;
  599 + height: 2.3rem;
  600 + border: 1px solid #4194EF;
  601 + &.first {
  602 + position: relative;
  603 + text-align: center;
  604 + line-height: 1.7rem;
  605 + font-weight: 200;
  606 + .input-wrap {
  607 + position: absolute;
  608 + top: 0;
  609 + left: 0;
  610 + right: 0;
  611 + bottom: 0;
  612 + &.active {
  613 + z-index: 100;
  614 + }
  615 + }
  616 + em {
  617 + color: #979797;
  618 + font-size: 1.6rem;
  619 + line-height: 1.7rem;
  620 + }
  621 + span {
  622 + display: inline-block;
  623 + width: 100%;
  624 + height: 100%;
  625 + // background-color: #9cbce2;
  626 + color: #828282;
  627 + line-height: 1.8rem;
  628 + }
  629 + }
  630 + &.active {
  631 + border: 1px solid #4a90e2;
  632 + &:after {
  633 + border-bottom: 0.5rem solid #4a90e2;
  634 + }
  635 + }
  636 + span {
  637 + display: flex;
  638 + align-items: center;
  639 + justify-content: center;
  640 + width: 100%;
  641 + height: 100%;
  642 + font-size: 1.2rem;
  643 + color: #828282;
  644 + &.first {
  645 + background-color: #9cbce2;
  646 + color: #fff;
  647 + text-indent: 0.4rem;
  648 + border-radius: 0;
  649 + }
  650 + }
  651 + }
  652 + }
  653 + .submit-box {
  654 + width: 100%;
  655 + height: 44px;
  656 + line-height: 44px;
  657 + border-radius: 4px;
  658 + font-size: 20px;
  659 + margin-top: 18px;
  660 + background: linear-gradient(180deg, #3885D9 0%, #4194EF 100%);
  661 + color: #fff;
  662 + text-align: center;
  663 + }
  664 + .info {
  665 + font-size: 0.5rem;
  666 + margin-top: 0.9rem;
  667 + color: #828282;
  668 + text-align: left;
  669 + img {
  670 + width: 0.6rem;
  671 + vertical-align: middle;
  672 + }
  673 + }
  674 + }
  675 + .first-word-wrap {
  676 + // height: 9.4rem;
  677 + background-color: #D2D5DB;
  678 + padding: 0.6rem 0.8rem 1.1rem;
  679 + position: fixed;
  680 + bottom: 0;
  681 + left: 0;
  682 + right: 0;
  683 + .first-word {
  684 + display: flex;
  685 + justify-content: space-between;
  686 + margin-bottom: 0.45rem;
  687 + .word {
  688 + box-sizing: border-box;
  689 + width: 2.2rem;
  690 + height: 2.2rem;
  691 + // border: 1px solid #9cbce2;
  692 + box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.35);
  693 + border-radius: 0.16rem;
  694 + text-align: center;
  695 + &.bordernone {
  696 + border: none;
  697 + box-shadow:none
  698 + }
  699 + span {
  700 + box-sizing: border-box;
  701 + display: flex;
  702 + align-items: center;
  703 + justify-content: center;
  704 + text-align: center;
  705 + width: 100%;
  706 + height: 100%;
  707 + background-color: #fff;
  708 + color: #000;
  709 + // border: 1px solid #fff;
  710 + border-radius: 0.125rem;
  711 + font-size: 1.2rem;
  712 + }
  713 + img {
  714 + width: 1.6rem;
  715 + }
  716 + }
  717 + &:nth-last-of-type(1){
  718 + margin-bottom: 0rem;
  719 + }
  720 + }
  721 + }
  722 + .keyboard-wrap {
  723 + background-color: #D2D5DB;
  724 + position: fixed;
  725 + bottom: 0;
  726 + left: 0;
  727 + right: 0;
  728 + padding: 0.6rem 0.6rem 0.4rem;
  729 + .keyboard {
  730 + display: flex;
  731 + justify-content: space-between;
  732 + align-items: center;
  733 + height: 2rem;
  734 + margin-bottom: 0.6rem;
  735 + span {
  736 + text-align: center;
  737 + display: flex;
  738 + width: 2.2rem;
  739 + align-items: center;
  740 + justify-content: center;
  741 + height: 2.2rem;
  742 + margin: 0 0.3rem;
  743 + box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.35);
  744 + background-color: #fff;
  745 + border-radius: 0.125rem;
  746 + font-size: 1.2rem;
  747 + &:active {
  748 + background-color: #e4e4e4;
  749 + }
  750 + &.bordernone{
  751 + border: none;
  752 + box-shadow: none;
  753 + background-color: #D2D5DB;
  754 + &:active{
  755 + background-color:#D2D5DB;
  756 + }
  757 + }
  758 + &.delete{
  759 + background-color: #465266;
  760 + img{
  761 + width: 1.15rem;
  762 + }
  763 + }
  764 + }
  765 + }
  766 + .cancel{
  767 + display: flex;
  768 + justify-content: flex-end;
  769 + align-items: center;
  770 + span{
  771 + display: flex;
  772 + align-items: center;
  773 + justify-content: center;
  774 + width: 3.6rem;
  775 + height: 1.8rem;
  776 + background-color: #465266;
  777 + color: #fff;
  778 + border-radius: 0.125rem;
  779 + }
  780 + }
  781 + }
  782 +</style>
... ...
src/components/navigation.vue
  View file @a17ce3d
... ... @@ -97,11 +97,11 @@ export default {
97 97 },
98 98 openImgUrl(i) { // 点击图片跳转
99 99 console.log(i.jumpUrl)
100   - window.open('https://www.baidu.com/')
  100 + window.open(i.jumpUrl)
101 101 },
102 102 toPlateNumber() { // 前往输入车牌页面
103 103 this.$router.push({
104   - path: 'plateNumber',
  104 + path: 'carPlateNum',
105 105  
106 106 }
107 107 )
... ...
src/components/parkRecord.vue
  View file @a17ce3d
... ... @@ -15,7 +15,7 @@
15 15 <div v-show="currentTabActive==0">
16 16  
17 17 <div v-if="parkingData.length>0">
18   - <p class="free-tip" v-if="parkingData[0].parkDuration<=900">停车15分钟内无需缴费，请申请离场。</p>
  18 + <p class="free-tip" v-if="parkingData[0].parkDuration<=1800">停车30分钟内无需缴费，请申请离场。</p>
19 19  
20 20 <div class="cost-main" v-for="i in parkingData">
21 21 <ul class="cost-header">
... ... @@ -34,7 +34,7 @@
34 34 <p>停车时长：{{ $utils.dateFormat(i.parkDuration)}}</p>
35 35 <div class="out-wrap">
36 36 <p class="mon-wrap">￥{{(i.unPayFee/100).toFixed(2)}}</p>
37   - <p class="out-btn" @click="toPayCurrent(i,parkingData[0].parkDuration)" v-if="parkingData[0].parkDuration<=900">申请离场</p>
  37 + <p class="out-btn" @click="toPayCurrent(i,parkingData[0].parkDuration)" v-if="parkingData[0].parkDuration<=1800">申请离场</p>
38 38 <p class="out-btn" @click="toPayCurrent(i,parkingData[0].parkDuration)" v-else>出场缴费</p>
39 39 </div>
40 40 </div>
... ... @@ -241,6 +241,7 @@ export default {
241 241 if(index==0){
242 242 this.parkRecordList(10)
243 243 }else{
  244 + this.allMoney = 0
244 245 this.parkRecordList(30)
245 246 }
246 247 },
... ...
src/router/index.js
  View file @a17ce3d
... ... @@ -15,6 +15,12 @@ export default new Router({
15 15 }
16 16 },
17 17 {
  18 + path: '/carPlateNum',
  19 + name: 'carPlateNum',
  20 + component: () => import("@/components/carPlateNum.vue")
  21 + },
  22 +
  23 + {
18 24 path: '/navigation',
19 25 name: 'navigation',
20 26 component: navigation
... ...
src/utils/request.js
  View file @a17ce3d
... ... @@ -13,7 +13,7 @@ const service = axios.create({
13 13  
14 14 // https://dev.renniting.cn/pay/ 赤峰农行测试环境
15 15  
16   - baseURL: 'https://pay.lcybc.com/', // url = base url + request url
  16 + baseURL: 'https://pay.ccccitd.cc', // url = base url + request url
17 17 // withCredentials: true, // send cookies when cross-domain requests
18 18 timeout: 10000 // request timeout
19 19 })
... ...
src/utils/utils.js
  View file @a17ce3d
... ... @@ -123,7 +123,7 @@ export default {
123 123  
124 124 myDeviceInfo: 'BC0703A4-AFB0-4B51-9089-9B7487C0CC6E', // 公共请求设备信息
125 125  
126   - myVxAppId: 'wx2fc33e1e61468928',
  126 + myVxAppId: 'wx1489e48e6a547023',
127 127 // 测试环境 微信赤峰 appid wxff4cebaedbf4f886
128 128 // 微信赤峰 appid wx2af2bab90d433c86
129 129 // 黄石 appid wxa1a66cc7d263afe6
... ...