Commit 61f2a772 authored by April's avatar April

Merge branch 'master' of http://120.77.240.215:9701/limeimei/sim

parents 2141460f dd1a3714
......@@ -13,6 +13,8 @@ import hotelInfo from "../views/hotels/info/register.vue";
import hotelInfoPay from "../views/hotels/info/pay.vue";
import hotelInfoGrant from "../views/hotels/info/roomcard.vue";
import hotelInfoSuccess from "../views/hotels/info/success.vue";
import Disreserve from "../views/visitor/disreserve.vue";
import Authentify from "../views/visitor/authentify.vue";
Vue.use(VueRouter);
......@@ -128,6 +130,23 @@ const routes = [
},
],
},
{
path: "/disreserve",
name: "disreserve",
component: Disreserve,
meta: {
title: "未预约",
},
},
{
path: "/authentify",
name: "authentify",
component: Authentify,
meta: {
title: "实名认证",
},
},
];
const router = new VueRouter({
......
......@@ -22,10 +22,17 @@
return {
title: ""
}
}, watch: {
$route: {
// $route可以用引号,也可以不用引号 监听的对象
handler(to) {
this.title = to.params.title
},
},
},
created() {
//获得路由传递过来的值
this.title = this.$route.params.title;
},
methods: {
......@@ -36,7 +43,8 @@
<style scoped>
.wrapper {
background: #F0F2F8;
height: 100%;
/* height: 1018px; */
box-sizing: border-box;
}
......
<template>
<div class="reserved">
<div class="content">
<div class="auth_top">
<div><el-button @click="toBack">返回上一步</el-button>
</div>
<div>您可通过刷身份证、粤居码任意一种进行实名认证</div>
<div class="content_time">118s</div>
</div>
<!-- <el-button type="primary" @click="toNext">下一步</el-button> -->
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
type: 1,
phone: '',
vform: {},
options: [{
value: '选项1',
label: '黄金糕'
}, {
value: '选项2',
label: '双皮奶'
}, {
value: '选项3',
label: '蚵仔煎'
}, {
value: '选项4',
label: '龙须面'
}, {
value: '选项5',
label: '北京烤鸭'
}],
}
},
created() {
this.type = this.$route.params.type;
},
methods: {
toBack() {
this.$router.go(-1);
},
toNext() {
this.$router.push({ name: "authentify", params: { title: '实名认证', } });
},
}
}
</script>
<style scoped>
.reserved {
width: 100%;
padding: 36px;
height: calc(100vh - 70px);
box-sizing: border-box;
}
.content {
width: 100%;
background: #FFFFFF;
border-radius: 14px;
height: 100%;
padding: 30px;
box-sizing: border-box;
}
.auth_top {
width: 100%;
display: flex;
height: 50px;
align-items: center;
justify-content: space-between;
}
.card_left_c {
width: 193px;
height: 193px;
background: #F4F4F4;
border-radius: 10px 10px 10px 10px;
opacity: 1;
margin: 14px 0 54px 156px;
text-align: center;
}
.card_item {
display: flex;
height: 46px;
margin-bottom: 30px;
margin-left: 20px;
}
.card_item_span {
line-height: 46px;
width: 120px;
color: #333333;
font-size: 20px;
}
.content_time {
width: 50px;
height: 50px;
background: #FFFFFF;
opacity: 1;
border: 3px solid #5A8FF6;
margin: 24px 0 26px auto;
border-radius: 50%;
text-align: center;
line-height: 50px;
}
::v-deep .el-input__inner {
width: 360px;
height: 46px;
border: 1px solid #707070;
color: #333333;
}
::v-deep .el-input {
width: 360px;
height: 78px;
}
::v-deep .el-input__icon {
height: 46px;
}
.card_center {
width: 1px;
height: 548px;
background: #E0E0E0;
margin: 50px 43px 50px 85px;
}
.card_right {
width: 100%;
}
::v-deep .card_right .el-button {
margin: auto 0 50px 0;
}
</style>
\ No newline at end of file
<template>
<div class="reserved">
<div class="content">
<div class="card_left">
<div style="margin-top: 30px;height: 34px;"><el-button v-show="this.type==0"
@click="toBack">返回上一步</el-button></div>
<div class="card_left_c"><img src="@/assets/visitor/camera.png" alt=""
style="width: 58.15px;height: 45.4px;margin:35%;">
</div>
<div class="card_item"><span class="card_item_span">姓名:</span>
<el-input v-model="vform.name"></el-input>
</div>
<div class="card_item"><span class="card_item_span">手机号:</span>
<el-input v-model="vform.name" placeholder="必填"></el-input>
</div>
<div class="card_item"><span class="card_item_span">身份证号:</span>
<el-input v-model="vform.name"></el-input>
</div>
<div class="card_item"><span class="card_item_span">来访事由:</span>
<el-select v-model="vform.name" width="360px">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</div>
</div>
<div class="card_center"></div>
<div class="card_right">
<div class="content_time">118s</div>
<div class="card_item"><span class="card_item_span">公司名称:</span>
<el-input v-model="vform.name" placeholder="必填"></el-input>
</div>
<div class="card_item"><span class="card_item_span">到访人数:</span>
<el-input v-model="vform.name" placeholder="必填"></el-input>
</div>
<el-button type="primary" @click="toNext">下一步</el-button>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
type: 1,
phone: '',
vform: {},
options: [{
value: '选项1',
label: '黄金糕'
}, {
value: '选项2',
label: '双皮奶'
}, {
value: '选项3',
label: '蚵仔煎'
}, {
value: '选项4',
label: '龙须面'
}, {
value: '选项5',
label: '北京烤鸭'
}],
}
},
created() {
this.type = this.$route.params.type;
},
methods: {
toBack() {
this.$router.go(-1);
},
toNext() {
this.$router.push({ name: "authentify", params: { title: '实名认证', } });
},
}
}
</script>
<style scoped>
.reserved {
width: 100%;
padding: 36px;
box-sizing: border-box;
}
.content {
width: 100%;
background: #FFFFFF;
border-radius: 14px;
height: 880px;
padding: 0 30px;
box-sizing: border-box;
display: flex;
}
.card_left_c {
width: 193px;
height: 193px;
background: #F4F4F4;
border-radius: 10px 10px 10px 10px;
opacity: 1;
margin: 14px 0 54px 156px;
text-align: center;
}
.card_item {
display: flex;
height: 46px;
margin-bottom: 30px;
margin-left: 20px;
}
.card_item_span {
line-height: 46px;
width: 120px;
color: #333333;
font-size: 20px;
}
.content_time {
width: 50px;
height: 50px;
background: #FFFFFF;
opacity: 1;
border: 3px solid #5A8FF6;
margin: 24px 0 26px auto;
border-radius: 50%;
text-align: center;
line-height: 50px;
}
::v-deep .el-input__inner {
width: 360px;
height: 46px;
border: 1px solid #707070;
color: #333333;
}
::v-deep .el-input {
width: 360px;
height: 78px;
}
::v-deep .el-input__icon {
height: 46px;
}
.card_center {
width: 1px;
height: 548px;
background: #E0E0E0;
margin: 50px 43px 50px 85px;
}
.card_right {
width: 100%;
}
::v-deep .card_right .el-button {
margin: auto 0 50px 0;
}
</style>
\ No newline at end of file
......@@ -7,19 +7,20 @@
<div class="card_tip">请输入预约手机号验证</div>
<el-input value="phone"><template slot="prepend">
<el-input :value="phone" disabled><template slot="prepend">
<div style="display: flex;align-items: center;">
<span class="card_pre">+86</span>
<div class="card_center"></div>
</div>
</template></el-input>
<div>
<el-button @click="Reserved">已预约</el-button>
<el-button @click="">未预约</el-button>
<div class="card_btn">
<el-button @click="clickBtn(11)" type="info">重置</el-button>
<el-button @click="comfirm" type="primary">确认</el-button>
</div>
</div>
<div class="card_right">
<el-button v-for="item in numList" :key="item.value">{{item.label}}</el-button>
<el-button v-for="item in numList" :key="item.value"
@click="clickBtn(item.value)">{{item.label}}</el-button>
</div>
</div>
......@@ -33,6 +34,7 @@
export default {
data() {
return {
phone: '',
numList: [{ label: '1', value: 1 }, { label: '2', value: 2 }, { label: '3', value: 3 }, { label: '4', value: 4 },
{ label: '5', value: 5 }, { label: '6', value: 6 }, { label: '7', value: 7 },
{ label: '8', value: 8 }, { label: '9', value: 9 }, { label: '退格', value: 10 },
......@@ -41,10 +43,19 @@
}
},
methods: {
Reserved() {
this.$router.replace({
path: "/reserved",
});
clickBtn(val) {
val == 11 ? this.phone = '' : ''
if (this.phone.length > 10) return
val <= 9 ?
this.phone = this.phone + val.toString() : '';
val == 10 && this.phone.length >= 1 ? this.phone = this.phone.substring(0, this.phone.length - 1) : '';
},
comfirm() {
this.$router.push({ name: "disreserve", params: { title: '访客信息', type: 0 } });
}
}
}
......@@ -55,7 +66,7 @@
width: 100%;
padding: 36px;
min-height: calc(100% - 70px);
height: 950px;
box-sizing: border-box;
......@@ -64,9 +75,10 @@
.content {
background: #FFFFFF;
border-radius: 14px;
height: 100%;
height: 880px;
padding-top: 24px;
box-sizing: border-box;
}
.content_time {
......@@ -76,6 +88,10 @@
opacity: 1;
border: 3px solid #5A8FF6;
margin: 0 30px 0 auto;
border-radius: 50%;
text-align: center;
line-height: 50px;
}
.content_card {
......@@ -109,9 +125,18 @@
}
::v-deep .content_card .el-input-group__prepend {
background-color: none;
/* height: 78px; */
background-color: white;
border: 0;
line-height: 70px;
border-radius: 50%;
}
::v-deep .content_card .el-input.is-disabled .el-input__inner {
border-color: white;
background-color: white;
border-radius: 10%;
cursor: default;
color: #000000;
}
.card_pre {
......@@ -127,6 +152,22 @@
margin-left: 30px;
}
::v-deep .card_btn .el-button {
width: 208px;
height: 70px;
border-radius: 4px 4px 4px 4px;
margin-right: 40px;
font-size: 24px;
}
::v-deep .card_btn .el-button--info {
color: #717171;
background: #DCDCDC;
border: 0;
}
.card_right {
width: 449px;
height: 391px;
......@@ -146,5 +187,8 @@
opacity: 1;
border: 1px solid #CBC7C7;
margin: 0 25px 25px 0;
font-weight: bold;
color: #000000;
font-size: 36px;
}
</style>
\ No newline at end of file
......@@ -16,8 +16,8 @@ font-size: 44px;">欢迎使用</div>
<div style="color: #416CCC;
font-size: 50px;">访客自助登记系统</div>
<div>
<el-button @click="Reserved">已预约</el-button>
<el-button @click="">未预约</el-button>
<el-button @click="Reserved('reserved',0)">已预约</el-button>
<el-button @click="Reserved('disreserve',1)">未预约</el-button>
</div>
</div>
</div>
......@@ -39,8 +39,8 @@ font-size: 50px;">访客自助登记系统</div>
this.getTime()
},
methods: {
Reserved() {
this.$router.push({ name: 'reserved', params: { title: '预约验证' } });
Reserved(name, type) {
this.$router.push({ name: name, params: { title: '访客信息', type: type } });
},
getTime() {
let nowDate = new Date();
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment