<template>
|
<div class="order-container">
|
<div class="OrderCancellation">
|
<div class="header"></div>
|
<div class="whiteBg">
|
<div class="input">
|
<input placeholder="请输入排队号码" v-model="verify_code" />
|
</div>
|
<div class="bnt" @click="storeCancellation">查询</div>
|
</div>
|
<div class="scan" @click="openQRCode">
|
<img src="../../../assets/imgs/scanCode.png" @click="openQRCode" />
|
</div>
|
</div>
|
</div>
|
</template>
|
<script>
|
import { getVeghicleByNumApi } from "@/api/vehicle";
|
|
export default {
|
name: "OrderCancellation",
|
components: {},
|
props: {},
|
data: function () {
|
return {
|
iShidden: true,
|
orderInfo: null,
|
verify_code: "",
|
};
|
},
|
created() {
|
import("@/assets/js/media_750");
|
},
|
methods: {
|
storeCancellation: function () {
|
if (!this.verify_code) return this.$dialog.error("请输入排队号码");
|
|
getVeghicleByNumApi(this.verify_code)
|
.then((res) => {
|
this.$router.push({
|
path: "hexiaoInfo",
|
query: {
|
code: this.verify_code,
|
},
|
});
|
})
|
.catch(() => {
|
this.$dialog.error("未查到车辆信息");
|
});
|
},
|
openQRCode: function () {
|
this.$router.push({
|
path: "hexiao",
|
});
|
},
|
},
|
};
|
</script>
|
<style lang="scss">
|
.order-container {
|
height: 100%;
|
}
|
.OrderCancellation {
|
background: linear-gradient(151deg, #e0e7ff 0%, #ffffff 100%);
|
height: 100%;
|
}
|
|
.OrderCancellation .header {
|
background: url("../../../assets/imgs/mobileHeadbj.png") no-repeat;
|
width: 100%;
|
height: 47vw;
|
background-size: 100% 100%;
|
}
|
|
.OrderCancellation .whiteBg {
|
width: 7.07rem;
|
background-color: #fff;
|
margin: -2.13rem auto 0 auto;
|
padding-top: 1.3rem;
|
padding-bottom: 0.3536rem;
|
border-radius: 0.2rem 0.2rem 0 0;
|
}
|
|
.OrderCancellation .whiteBg .input {
|
width: 6rem;
|
margin: 0 auto;
|
border-bottom: 0.02rem solid #999;
|
}
|
|
.OrderCancellation .whiteBg .input input {
|
padding: 0.25rem;
|
font-size: 0.5rem;
|
color: #282828;
|
width: 100%;
|
text-align: center;
|
border: none;
|
}
|
|
.OrderCancellation .whiteBg .bnt {
|
font-size: 0.3rem;
|
color: #fff;
|
width: 6.24rem;
|
height: 1rem;
|
border-radius: 0.12rem;
|
background: #3873f3;
|
margin: 0.7rem auto 0 auto;
|
text-align: center;
|
line-height: 1rem;
|
}
|
|
.OrderCancellation .scan {
|
width: 2.49rem;
|
height: 2.49rem;
|
margin: 2.75rem auto 0 auto;
|
}
|
|
.OrderCancellation .scan img {
|
width: 100%;
|
height: 100%;
|
display: block;
|
}
|
|
@media screen and (max-width: 1023px) {
|
.main-container {
|
background-color: #fff !important;
|
|
.app-main {
|
height: 100vh !important;
|
background-color: #fff !important;
|
}
|
}
|
}
|
</style>
|
