Commit b67c269c860f0ca43ce9cd5fa8015a49e88fd83a
1 parent
e2fc6c62
入场码
Showing
9 changed files
with
154 additions
and
8 deletions
index.html
| @@ -4,7 +4,7 @@ | @@ -4,7 +4,7 @@ | ||
| 4 | <meta charset="utf-8"> | 4 | <meta charset="utf-8"> |
| 5 | <meta name="google" content="notranslate"> | 5 | <meta name="google" content="notranslate"> |
| 6 | <meta name="viewport" content="width=device-width,initial-scale=1.0"> | 6 | <meta name="viewport" content="width=device-width,initial-scale=1.0"> |
| 7 | - <title>小票码扫码支付</title> | 7 | + <title>扫码支付</title> |
| 8 | </head> | 8 | </head> |
| 9 | <body> | 9 | <body> |
| 10 | <div id="app"></div> | 10 | <div id="app"></div> |
src/api/parkEnter/parkEnter.js
0 → 100644
src/components/dynCodePay.vue
src/components/parkEnter.vue
0 → 100644
| 1 | +<template> | ||
| 2 | + <div> | ||
| 3 | + <p class="enter-title">请输入手机号码</p> | ||
| 4 | + <mt-field style="width: 60%;margin: 10px auto;border: 1px solid #c1bfc5;font-size: 16px;border-radius: 2px;" label="" placeholder="请输入手机号" type="tel" v-model="phone" :attr="{ maxlength: 11 }"></mt-field> | ||
| 5 | + <p style="color:#3385ff;text-align: center;">手机号码是出场凭证,请您牢记!</p> | ||
| 6 | + <div class="okBtn" @click="onHandle">确定入场</div> | ||
| 7 | + </div> | ||
| 8 | +</template> | ||
| 9 | + | ||
| 10 | +<script> | ||
| 11 | + | ||
| 12 | +import { noCarQRcodeInOutPark } from '@/api/parkEnter/parkEnter' | ||
| 13 | + | ||
| 14 | +export default { | ||
| 15 | + name: 'parkEnter', | ||
| 16 | + data() { | ||
| 17 | + return { | ||
| 18 | + query: {}, | ||
| 19 | + phone: '' | ||
| 20 | + } | ||
| 21 | + }, | ||
| 22 | + created() { | ||
| 23 | + this.query = this.$utils.getQueryString(window.location) | ||
| 24 | + console.log(this.query) | ||
| 25 | + }, | ||
| 26 | + methods: { | ||
| 27 | + onHandle: function () { | ||
| 28 | + // noCarQRcodeInOutPark | ||
| 29 | + if (!/^1[34578]\d{9}$/.test(this.phone)) { | ||
| 30 | + this.$msgbox('提示', '请输入正确手机号') | ||
| 31 | + return | ||
| 32 | + } | ||
| 33 | + if (this.query == null) { | ||
| 34 | + this.$msgbox('提示', '没有接收到请求参数') | ||
| 35 | + return | ||
| 36 | + } | ||
| 37 | + | ||
| 38 | + this.query.app_id = 1 | ||
| 39 | + this.query.salt = 2 | ||
| 40 | + this.query.deviceInfo = 3 | ||
| 41 | + this.query.sign_type = 'md5' | ||
| 42 | + this.query.sign = 4 | ||
| 43 | + this.query.token = '666' | ||
| 44 | + | ||
| 45 | + this.query.carNumber = this.phone+'111' | ||
| 46 | + this.query.terminalSource = "7";//增加字段:1:任你听 3:微信公共号 4:云平台 7:H5 | ||
| 47 | + noCarQRcodeInOutPark(this.query).then(res => { | ||
| 48 | + if (res.code == 0) { | ||
| 49 | + this.$msgbox('提示', '进场信息已录入,请您进场!') | ||
| 50 | + } else { | ||
| 51 | + this.$msgbox('提示', res.message) | ||
| 52 | + } | ||
| 53 | + }) | ||
| 54 | + | ||
| 55 | + } | ||
| 56 | + } | ||
| 57 | +} | ||
| 58 | +</script> | ||
| 59 | + | ||
| 60 | +<style scoped lang="scss"> | ||
| 61 | + .enter-title { | ||
| 62 | + margin-top: 45px; | ||
| 63 | + text-align: center; | ||
| 64 | + font-size: 18px; | ||
| 65 | + color: #000; | ||
| 66 | + } | ||
| 67 | + .okBtn{ | ||
| 68 | + background: linear-gradient(180deg, #3885D9 0%, #4194EF 100%); | ||
| 69 | + width: 60%; | ||
| 70 | + margin: 50px auto 0; | ||
| 71 | + height: 48px; | ||
| 72 | + line-height: 48px; | ||
| 73 | + text-align: center; | ||
| 74 | + border-radius: 5px; | ||
| 75 | + color: #ffffff; | ||
| 76 | + font-size: 18px; | ||
| 77 | + cursor: pointer; | ||
| 78 | + } | ||
| 79 | +</style> |
src/components/pay.vue
src/components/plateNumber.vue
| @@ -85,7 +85,7 @@ | @@ -85,7 +85,7 @@ | ||
| 85 | <div class="first-word" | 85 | <div class="first-word" |
| 86 | @click="selectFirstWord($event)"> | 86 | @click="selectFirstWord($event)"> |
| 87 | <div class="word"> | 87 | <div class="word"> |
| 88 | - <span>京</span> | 88 | + <span>蒙</span> |
| 89 | </div> | 89 | </div> |
| 90 | <div class="word"> | 90 | <div class="word"> |
| 91 | <span>湘</span> | 91 | <span>湘</span> |
| @@ -166,7 +166,7 @@ | @@ -166,7 +166,7 @@ | ||
| 166 | <div class="first-word" | 166 | <div class="first-word" |
| 167 | @click="selectFirstWord($event)"> | 167 | @click="selectFirstWord($event)"> |
| 168 | <div class="word"> | 168 | <div class="word"> |
| 169 | - <span>蒙</span> | 169 | + <span>京</span> |
| 170 | </div> | 170 | </div> |
| 171 | <div class="word"> | 171 | <div class="word"> |
| 172 | <span>赣</span> | 172 | <span>赣</span> |
| @@ -480,6 +480,7 @@ export default { | @@ -480,6 +480,7 @@ export default { | ||
| 480 | 480 | ||
| 481 | return | 481 | return |
| 482 | } | 482 | } |
| 483 | + this.carNum = plateLicense | ||
| 483 | } | 484 | } |
| 484 | if (this.formData.commonCard === '2') { | 485 | if (this.formData.commonCard === '2') { |
| 485 | plateLicense = this.plate_license_2 | 486 | plateLicense = this.plate_license_2 |
| @@ -489,6 +490,7 @@ export default { | @@ -489,6 +490,7 @@ export default { | ||
| 489 | 490 | ||
| 490 | return | 491 | return |
| 491 | } | 492 | } |
| 493 | + this.carNum = plateLicense | ||
| 492 | } | 494 | } |
| 493 | console.log(plateLicense) | 495 | console.log(plateLicense) |
| 494 | if (this.formData.commonCard === '3') { | 496 | if (this.formData.commonCard === '3') { |
| @@ -499,11 +501,12 @@ export default { | @@ -499,11 +501,12 @@ export default { | ||
| 499 | 501 | ||
| 500 | return | 502 | return |
| 501 | } | 503 | } |
| 504 | + this.carNum = this.carNum+'111' | ||
| 502 | } | 505 | } |
| 503 | // | 506 | // |
| 504 | // this.$emit('getPlateLicense', plateLicense) | 507 | // this.$emit('getPlateLicense', plateLicense) |
| 505 | console.log(plateLicense); | 508 | console.log(plateLicense); |
| 506 | - this.carNum = plateLicense | 509 | + |
| 507 | // this.$router.push({ | 510 | // this.$router.push({ |
| 508 | // path: 'pay', | 511 | // path: 'pay', |
| 509 | // query: { | 512 | // query: { |
src/main.js
| @@ -16,6 +16,8 @@ import 'mint-ui/lib/style.css' | @@ -16,6 +16,8 @@ import 'mint-ui/lib/style.css' | ||
| 16 | 16 | ||
| 17 | import { MessageBox } from 'mint-ui' | 17 | import { MessageBox } from 'mint-ui' |
| 18 | import { Toast } from 'mint-ui'; | 18 | import { Toast } from 'mint-ui'; |
| 19 | +import { Field } from 'mint-ui'; | ||
| 20 | +Vue.component(Field.name, Field); | ||
| 19 | 21 | ||
| 20 | Vue.prototype.$msgbox = MessageBox | 22 | Vue.prototype.$msgbox = MessageBox |
| 21 | Vue.prototype.$toast = Toast | 23 | Vue.prototype.$toast = Toast |
| @@ -29,6 +31,9 @@ for (let key in vueFilter){ | @@ -29,6 +31,9 @@ for (let key in vueFilter){ | ||
| 29 | Vue.filter(key,vueFilter[key]) | 31 | Vue.filter(key,vueFilter[key]) |
| 30 | } | 32 | } |
| 31 | 33 | ||
| 34 | + | ||
| 35 | + | ||
| 36 | + | ||
| 32 | Vue.config.productionTip = false | 37 | Vue.config.productionTip = false |
| 33 | 38 | ||
| 34 | /* eslint-disable no-new */ | 39 | /* eslint-disable no-new */ |
src/router/index.js
| @@ -3,15 +3,16 @@ import Router from 'vue-router' | @@ -3,15 +3,16 @@ import Router from 'vue-router' | ||
| 3 | import plateNumber from '@/components/plateNumber' | 3 | import plateNumber from '@/components/plateNumber' |
| 4 | // import parkRecord from '@/components/parkRecord' | 4 | // import parkRecord from '@/components/parkRecord' |
| 5 | import dynCodePay from '@/components/dynCodePay' | 5 | import dynCodePay from '@/components/dynCodePay' |
| 6 | +import parkEnter from '@/components/parkEnter' | ||
| 6 | 7 | ||
| 7 | Vue.use(Router) | 8 | Vue.use(Router) |
| 8 | 9 | ||
| 9 | -export default new Router({ | 10 | +const router = new Router({ |
| 10 | routes: [ | 11 | routes: [ |
| 11 | { | 12 | { |
| 12 | path: '/', | 13 | path: '/', |
| 13 | redirect: { | 14 | redirect: { |
| 14 | - name: 'plateNumber' | 15 | + name: 'parkEnter' |
| 15 | } | 16 | } |
| 16 | }, | 17 | }, |
| 17 | // { | 18 | // { |
| @@ -20,9 +21,20 @@ export default new Router({ | @@ -20,9 +21,20 @@ export default new Router({ | ||
| 20 | // component: navigation | 21 | // component: navigation |
| 21 | // }, | 22 | // }, |
| 22 | { | 23 | { |
| 24 | + path: '/parkEnter', | ||
| 25 | + name: 'parkEnter', | ||
| 26 | + component: parkEnter, | ||
| 27 | + meta: { | ||
| 28 | + title: '入场码' | ||
| 29 | + } | ||
| 30 | + }, | ||
| 31 | + { | ||
| 23 | path: '/plateNumber', | 32 | path: '/plateNumber', |
| 24 | name: 'plateNumber', | 33 | name: 'plateNumber', |
| 25 | - component: plateNumber | 34 | + component: plateNumber, |
| 35 | + meta: { | ||
| 36 | + title: '静态码' | ||
| 37 | + } | ||
| 26 | }, | 38 | }, |
| 27 | // { | 39 | // { |
| 28 | // path: '/parkRecord', | 40 | // path: '/parkRecord', |
| @@ -45,7 +57,10 @@ export default new Router({ | @@ -45,7 +57,10 @@ export default new Router({ | ||
| 45 | { | 57 | { |
| 46 | path: '/dynCodePay', | 58 | path: '/dynCodePay', |
| 47 | name: 'dynCodePay', | 59 | name: 'dynCodePay', |
| 48 | - component: () => import("@/components/dynCodePay.vue") | 60 | + component: () => import("@/components/dynCodePay.vue"), |
| 61 | + meta: { | ||
| 62 | + title: '动态码' | ||
| 63 | + } | ||
| 49 | }, | 64 | }, |
| 50 | 65 | ||
| 51 | { | 66 | { |
| @@ -63,3 +78,15 @@ export default new Router({ | @@ -63,3 +78,15 @@ export default new Router({ | ||
| 63 | 78 | ||
| 64 | ] | 79 | ] |
| 65 | }) | 80 | }) |
| 81 | + | ||
| 82 | +router.beforeEach((to, from, next) => { | ||
| 83 | + /* 路由发生变化修改页面title */ | ||
| 84 | + if (to.meta.title) { | ||
| 85 | + document.title = to.meta.title | ||
| 86 | + } | ||
| 87 | + next() | ||
| 88 | +}) | ||
| 89 | + | ||
| 90 | +export default router | ||
| 91 | + | ||
| 92 | + |
src/utils/utils.js
| @@ -11,6 +11,22 @@ export default { | @@ -11,6 +11,22 @@ export default { | ||
| 11 | console.log(pwd); | 11 | console.log(pwd); |
| 12 | return pwd; | 12 | return pwd; |
| 13 | }, | 13 | }, |
| 14 | + getQueryString: function(location) { | ||
| 15 | + //var url = location.search; //获取url中"?"符后的字串 | ||
| 16 | + console.log(location) | ||
| 17 | + var url = location.href.split("?")[1]; | ||
| 18 | + var theRequest = new Object(); | ||
| 19 | + if (url) { | ||
| 20 | + // var str = url.substr(1); | ||
| 21 | + var strs = url.split("&"); | ||
| 22 | + for (var i = 0; i < strs.length; i++) { | ||
| 23 | + theRequest[strs[i].split("=")[0]] = decodeURIComponent(strs[i].split("=")[1]); | ||
| 24 | + } | ||
| 25 | + } else { | ||
| 26 | + theRequest = null; | ||
| 27 | + } | ||
| 28 | + return theRequest; | ||
| 29 | + }, | ||
| 14 | 30 | ||
| 15 | parseParams: function (data) { | 31 | parseParams: function (data) { |
| 16 | try { | 32 | try { |