Skip to content

A
Athena
Commit 02988c48 authored by zhengke's avatar zhengke
Browse files
Options

酒店

parent 3fa97c9f
Show whitespace changes
Inline Side-by-side
Showing with 634 additions and 371 deletions
src/components/Hotel/HotelDetail.vue
View file @ 02988c48
......@@ -107,9 +107,6 @@
color:#666666;
position: relative;
}
.HD_checkTime span{
margin-right:10px;
}
.HD_warn{
color:#EE4454;
font-size:14px;
......@@ -119,16 +116,14 @@
.HD_warn i{
color:#FFA835;
}
.HD_PeoPleNum .el-input-number{
.HD_checkTime .el-input-number{
width:145px;
line-height: 26px;
margin-right:20px;
}
.HD_PeoPleNum .el-input__inner{
.HD_checkTime .el-input__inner{
height:28px;
}
.HD_PSpan{
margin-right:10px;
border-radius:0;
}
.HD_PsureBtn{
position: absolute;
......@@ -225,11 +220,11 @@
top:0;
left:0;
width:66px;
height:24px;
height:20px;
color:#fff;
font-size:12px;
text-align: center;
line-height: 24px;
line-height: 20px;
border-bottom-right-radius: 12px;
}
.HD_Black{
......@@ -355,8 +350,6 @@
height:35px;
}
.HotelDetail .Ht_ul{
height:46px;
line-height: 46px;
width:400px;
display: inline-block;
}
......@@ -382,7 +375,7 @@
width:262px;
height:140px;
padding:0 20px;
background-color: #F5F5F5;
/* background-color: #F5F5F5; */
border:1px solid #DDDDDD;
}
.HD_TOP_Map{
......@@ -434,6 +427,12 @@
.HD_date_input .el-input__inner{
border-radius: 0;
}
.HD_fangxing_List:last-child{
border-bottom:0;
}
.Ht_ulName .el-input__icon{
line-height: 0;
}
</style>
<template>
......@@ -494,15 +493,16 @@
</div>
</div>
<div class="HD_btnContent">
<div class="HD_checkTime">
<span>入住</span>
<div class="HD_checkTime clearfix">
<div style="float:left">
<span style="margin-right:10px;">入住</span>
<el-date-picker class="HD_date_input" v-model="SimilarMsg.arrivalDate" style="width:190px;" clear-icon=""
size="small"
value-format="yyyy-MM-dd"
type="date"
placeholder="">
</el-date-picker>
<span style="margin-left:20px;">退房</span>
<span style="margin:0 10px 0 20px;">退房</span>
<el-date-picker class="HD_date_input" v-model="SimilarMsg.departureDate" style="width:190px;" clear-icon=""
size="small"
value-format="yyyy-MM-dd"
......@@ -514,7 +514,7 @@
超过13岁视为成人处理
</span>
</div>
<div class="HD_PeoPleNum">
<div style="float:left;margin-left:60px;">
<el-popover :visible-arrow="false"
v-model="isShowPop"
placement="bottom"
......@@ -579,7 +579,8 @@
<li class="Ht_ulName">{{childNum}}儿童</li>
</ul>
</el-popover>
<input type="button" class="HD_PsureBtn" value="确定"/>
</div>
<input type="button" style="top:-3px;" @click="getSimilar" class="HD_PsureBtn" value="确定"/>
</div>
<div class="HD_fuhe">
<img src="../../assets/img/hotel/fuhe.png" alt="">
......@@ -629,18 +630,23 @@
<div><i>¥</i><span>{{subItem.chargeableRateInfoPerPersonForANightBySetCurrency}}</span></div>
</li>
<li>
<input type="button" style="right:20px;" @click="bookHotel(item.roomOptionCd)" class="HD_PsureBtn" value="预订" />
<input type="button" style="right:20px;" @click="bookHotel(subItem.roomOptionCd)" class="HD_PsureBtn" value="预订" />
</li>
</ul>
<span class="HD_ComDiJia" :class="getMealType(subItem.meals)=='无餐'?'HD_Black':'HD_Green'">{{getMealType(subItem.meals)}}</span>
<span class="HD_minNight">{{subItem.minNights}}</span>
</div>
<div class="HD_LastShowMore">
<!-- <div class="HD_LastShowMore">
<span>展开剩余122个报价<i class="iconfont icon-xiajiantou"></i></span>
</div>
</div> -->
</td>
</tr>
</table>
<div v-if="SimilarList.length==0" style="padding:15px 0;text-align:center">
<div class="empty-data"><i class="iconfont icon-kong"></i>
很抱歉，你想要的信息我们真的找不到了
</div>
</div>
<div class="HD_fuhe">
<img src="../../assets/img/hotel/hotel.png" alt="">
酒店信息
......@@ -648,11 +654,11 @@
<div class="HD_hotelComIntroduce">
<div class="HD_inTitle">酒店详情指南</div>
<div>
<span class="HD_ComLeftTitle">停车场</span>
<span>有（免费）</span>
<!-- <span class="HD_ComLeftTitle">停车场</span> -->
<span>{{hotelDetails.hotelDescription}}</span>
</div>
</div>
<div class="HD_hotelComIntroduce">
<!-- <div class="HD_hotelComIntroduce">
<div>
<span class="HD_ComLeftTitle">接送服务</span>
<span>无</span>
......@@ -670,7 +676,7 @@
UC·DC·NICOS·UFJ 依据信用卡<br/>种类的不同，部分信用卡可进行网上支付。
</span>
</div>
</div>
</div> -->
<div class="HD_hotelComIntroduce">
<div class="HD_inTitle">房间类型和数量</div>
<div>
......@@ -775,6 +781,8 @@ export default {
Services:[],
//客房有网络连接
InterArr:[],
//温泉
HotSpring:[],
};
},
mounted() {
......@@ -801,8 +809,8 @@ export default {
this.hotelSummary = res.data.data.hotelSummary;
this.hotelDetails.roomReviewRating = parseFloat(this.hotelDetails.roomReviewRating);
//拆分酒店服务与设施
if(this.hotelDetails.roomEquipments!=""){
let ServeArr = this.hotelDetails.roomEquipments.split(",");
this.Services=[];
if(ServeArr[0]==1){
this.Services.push('浴室和厕所');
......@@ -907,7 +915,9 @@ export default {
this.Services.push('祖邦煎锅（收费）');
}
}
//拆分网络连接
if(this.hotelDetails.internetAccessibilityOfTheRoom!=""){
this.InterArr=[];
let InternetArr = this.hotelDetails.internetAccessibilityOfTheRoom.split(",");
if(InternetArr[0]==1){
......@@ -928,7 +938,14 @@ export default {
if(InternetArr[5]==1){
this.InterArr.push('免费接入网络');
}
console.log(ServeArr,'serarr');
}
//拆分温泉
if(this.hotelDetails.bathAndBathAmenities!=""){
this.HotSpring=[];
let HotSpring = this.hotelDetails.bathAndBathAmenities.split(",");
console.log(HotSpring,'HotSpring');
}
} else {
this.Error(res.data.message);
}
......@@ -941,7 +958,18 @@ export default {
this.apipost("dmc_post_Get_GetJAPAN_RoomsList",this.SimilarMsg,res => {
console.log(res,'similarrrr');
if (res.data.resultCode == 1) {
if(Object.prototype.toString.call(res.data.data.roomRateDetails) == '[object Object]'){
this.SimilarList.push(res.data.data.roomRateDetails);
}else{
this.SimilarList = res.data.data.roomRateDetails;
}
this.SimilarList.forEach(x=>{
if(Object.prototype.toString.call(x.roomOptions) == '[object Object]'){
let arr=[];
arr.push(x.roomOptions);
x.roomOptions = arr;
}
})
} else {
this.Error(res.data.message);
}
......@@ -979,6 +1007,7 @@ export default {
},
//获取餐
getMealType(meals){
if(meals!=''){
let mealType = meals.split(',');
if(mealType[0]==0&&mealType[2]==0){
return '无餐'
......@@ -992,6 +1021,7 @@ export default {
if(mealType[0]==0&&mealType[2]==1){
return '含晚餐'
}
}
},
//点击预订传递参数
bookHotel(roomOptionCd){
......
src/components/Hotel/HotelHome.vue
View file @ 02988c48
......@@ -4,7 +4,7 @@
<div class="choose">
<div style="background:#ffffff;display: flex;align-items: center;position:relative">
<img class="Ht_bed" src="../../assets/img/hotel/hotelBed.png" alt=""/>
<el-select style="width:350px" clearable v-model="msg.place" placeholder="请选择">
<el-select style="width:350px" clearable filterable v-model="msg.place" placeholder="请选择">
<el-option value="东京都" label="东京都"></el-option>
<el-option value="大阪府" label="大阪府"></el-option>
<el-option value="京都府" label="京都府"></el-option>
......
src/components/Hotel/HotelList.vue
View file @ 02988c48
......@@ -74,7 +74,7 @@
top:1px;
}
.HL_Screen{
width:1158px;
width:1198px;
height:auto;
margin:auto;
border:1px solid #DCDCDC;
......@@ -112,9 +112,6 @@
padding:4px 8px;
}
.MoreList span{
margin-top:10px;
}
.HL_Stitle{
display: inline-block;
width:50px;
......@@ -312,14 +309,16 @@
width:85%;
overflow: hidden;
height: 100%;
}
.HL_Concept span{
margin:5px 0;
}
.HL_minHeight{
height:43px;
height:45px;
line-height: 27px;
}
.HL_AutoHeight{
height:auto;
padding:10px 0;
}
.HL_ConZhankai{
......@@ -355,6 +354,9 @@
.HotelList .HT_otherStar i{
color:rgb(239, 242, 247);
}
.HL_Maxheight{
height:150px!important;
}
</style>
<template>
......@@ -363,7 +365,10 @@
<div class="HL_SearchInfo">
<div class="HL_ComSearch HL_one">
<img class="HL_bed" src="../../assets/img/hotel/hotelBed.png" alt=""/>
<el-select style="width:350px;" v-model="placeKeyWords" clearable placeholder="请选择">
<el-select style="width:350px;" v-model="placeKeyWords" filterable clearable placeholder="请选择">
<el-option value="东京都" label="东京都"></el-option>
<el-option value="大阪府" label="大阪府"></el-option>
<el-option value="京都府" label="京都府"></el-option>
<el-option value="爱知县" label="爱知县"></el-option>
<el-option value="秋田县" label="秋田县"></el-option>
<el-option value="青森县" label="青森县"></el-option>
......@@ -385,7 +390,6 @@
<el-option value="神奈川县" label="神奈川县"></el-option>
<el-option value="高知县" label="高知县"></el-option>
<el-option value="熊本县" label="熊本县"></el-option>
<el-option value="京都府" label="京都府"></el-option>
<el-option value="三重县" label="三重县"></el-option>
<el-option value="宫城县" label="宫城县"></el-option>
<el-option value="宫崎县" label="宫崎县"></el-option>
......@@ -396,7 +400,6 @@
<el-option value="大分县" label="大分县"></el-option>
<el-option value="冈山县" label="冈山县"></el-option>
<el-option value="冲绳县" label="冲绳县"></el-option>
<el-option value="大阪府" label="大阪府"></el-option>
<el-option value="佐贺县" label="佐贺县"></el-option>
<el-option value="崎玉县" label="崎玉县"></el-option>
<el-option value="滋贺县" label="滋贺县"></el-option>
......@@ -404,7 +407,6 @@
<el-option value="静冈县" label="静冈县"></el-option>
<el-option value="枥木县" label="枥木县"></el-option>
<el-option value="德岛县" label="德岛县"></el-option>
<el-option value="东京都" label="东京都"></el-option>
<el-option value="鸟取县" label="鸟取县"></el-option>
<el-option value="富山县" label="富山县"></el-option>
<el-option value="和歌山县" label="和歌山县"></el-option>
......@@ -512,9 +514,9 @@
{{item.name}}
</span> -->
<!-- <span style="margin-right:10px;">自定义价格：</span> -->
<el-input type="text" style="width:100px;" v-model="searchMinRate" />
<el-input type="text" style="width:100px;" @keyup.native="checkPrice(monyMsg,'searchMinRate')" v-model="monyMsg.searchMinRate" />
<i class="HL_gang"></i>
<el-input type="text" style="width:100px;" v-model="searchMaxRate" />
<el-input type="text" style="width:100px;" @keyup.native="checkPrice(monyMsg,'searchMaxRate')" v-model="monyMsg.searchMaxRate" />
</div>
<div class="HL_ScList">
<span class="HL_Stitle">房型</span>
......@@ -551,9 +553,9 @@
<span>越早预订越便宜</span>
<span>限定期限</span>
</div> -->
<div class="HL_ScList MoreList" :class="isOpen==1?'HL_minHeight':'HL_AutoHeight'">
<div class="HL_Stitle">理念</div>
<div class="HL_Concept" >
<div class="HL_ScList MoreList" style="height:auto;">
<div class="HL_Stitle" style="height:45px;" :class="isOpen==2?'HL_Maxheight':''">理念</div>
<div class="HL_Concept" :class="isOpen==1?'HL_minHeight':'HL_AutoHeight'">
<span v-for="item in ConceptObj" :class="item.isCked?'HL_checked':''" @click="item.isCked=!item.isCked">
{{item.name}}
</span>
......@@ -568,9 +570,9 @@
<div class="HL_ScList">
<span class="HL_Stitle">评分</span>
<span style="margin-right:10px;">输入评分范围：</span>
<el-input type="text" style="width:100px;" v-model="reviewRatingLowerLimits" />
<el-input type="text" style="width:100px;" @keyup.native="checkInteger(starMsg,'reviewRatingLowerLimits')" v-model="starMsg.reviewRatingLowerLimits" />
<i class="HL_gang"></i>
<el-input type="text" style="width:100px;" v-model="reviewRatingUpperLimits" />
<el-input type="text" style="width:100px;" @keyup.native="checkInteger(starMsg,'reviewRatingUpperLimits')" v-model="starMsg.reviewRatingUpperLimits" />
</div>
<div class="HL_ScList">
<span class="HL_Stitle">酒店名称</span>
......@@ -679,14 +681,18 @@ export default {
},
//总页数
TotalPage:0,
monyMsg:{
//最小金额
searchMinRate:'',
//最大金额
searchMaxRate:'',
},
starMsg:{
//最小星星
reviewRatingLowerLimits:'',
//最大星星
reviewRatingUpperLimits:'',
},
isShowPop:false,
roomList:[],
room:1,
......@@ -955,26 +961,26 @@ export default {
this.msg.freewordType=2;
this.msg.freeword=this.keyWords;
}
if(this.searchMinRate==""){
if(this.monyMsg.searchMinRate==""){
this.msg.searchMinRate=0;
}else{
this.msg.searchMinRate = this.searchMinRate;
this.msg.searchMinRate = this.monyMsg.searchMinRate;
}
if(this.searchMaxRate==""){
if(this.monyMsg.searchMaxRate==""){
this.msg.searchMaxRate=0;
}else{
this.msg.searchMaxRate = this.searchMaxRate;
this.msg.searchMaxRate = this.monyMsg.searchMaxRate;
}
if(this.reviewRatingLowerLimits==""){
if(this.starMsg.reviewRatingLowerLimits==""){
this.msg.reviewRatingLowerLimits=0;
}else{
this.msg.reviewRatingLowerLimits = this.reviewRatingLowerLimits;
this.msg.reviewRatingLowerLimits = this.starMsg.reviewRatingLowerLimits;
}
if(this.reviewRatingUpperLimits==""){
if(this.starMsg.reviewRatingUpperLimits==""){
this.msg.reviewRatingUpperLimits = 0;
}else{
this.msg.reviewRatingUpperLimits = this.reviewRatingUpperLimits;
this.msg.reviewRatingUpperLimits = this.starMsg.reviewRatingUpperLimits;
}
this.msg.searchHotelCategory=[];
......
src/components/Hotel/HotelSure.vue
View file @ 02988c48
......@@ -46,10 +46,11 @@
}
.HS_div2{
width:100%;
height:350px;
min-height:350px;
border:1px solid #E0E0E0;
margin:20px 0;
overflow: hidden;
padding-bottom:20px;
}
.HS_bookTitle{
padding-left:20px;
......@@ -106,7 +107,7 @@
}
.HS_fangfei{
display: inline-block;
width:74px;
width:90px;
height:86px;
border:1px solid #BBC9DA;
background-color: #fff;
......@@ -164,9 +165,6 @@
.HS_AreaSelect .el-input__icon,.HS_roomNum .el-input__icon{
line-height: 0;
}
.HS_detailAddress{
margin:15px 0 0 141px;
}
.HS_detailAddress .el-input__inner,.HS_Email .el-input__inner{
height:40px;
border:0;
......@@ -183,7 +181,7 @@
}
.HS_HotelRight{
width:346px;
height:354px;
height:298px;
padding:17px 20px 20px 20px;
border:1px solid #E0E0E0;
border-top:0;
......@@ -200,7 +198,7 @@
}
.HS_HAddress{
font-size:12px;
margin-bottom:20px;
margin:20px 0;
}
.HS_HAddress img{
width:10px;
......@@ -229,7 +227,7 @@
}
.HS_RightBtm{
width:100%;
height:160px;
/* height:160px; */
margin-top:20px;
overflow: hidden;
border:1px solid #E0E0E0;
......@@ -289,6 +287,27 @@
.HS_RitBottom>div{
margin-bottom:15px;
}
.HD_payBtn{
width:100%;
height:66px;
background-color: #EE4454;
color:#fff;
outline: none;
border:none;
cursor: pointer;
margin-top:30px;
font-size:18px;
border-radius: 4px;
}
.HD_payBtn:hover{
opacity: 0.8;
}
.HS_BookMan .el-input__icon{
line-height: 0;
}
.HS_FFEI:last-child{
visibility: hidden;
}
</style>
......@@ -314,57 +333,68 @@
<div class="HS_div2One">
<ul>
<li class="HS2_title">房型信息</li>
<li>豪华客房(豪华大床)每日标准房价</li>
<li class="HS2_title">Deluxe Room - King</li>
</ul>
<li>
<div v-if="dataList.roomRateDetails">
<template v-if="dataList.roomRateDetails.roomType==1">单人床</template>
<template v-if="dataList.roomRateDetails.roomType==2">双床</template>
<template v-if="dataList.roomRateDetails.roomType==3">大床房</template>
<template v-if="dataList.roomRateDetails.roomType==4">三人间</template>
<template v-if="dataList.roomRateDetails.roomType==5">四床房</template>
<template v-if="dataList.roomRateDetails.roomType==6">日式房</template>
<template v-if="dataList.roomRateDetails.roomType==7">日式&西式混合房间</template>
</div>
<div class="HS_div3One">
<ul>
<li class="HS2_title">入住人数</li>
<li>成人 2人</li>
<li>儿童 1人</li>
</li>
</ul>
</div>
<div class="HS_div2One">
<div class="HS_div3One">
<ul>
<li class="HS2_title">入住人数</li>
<li>成人 2人</li>
<li>儿童 1人</li>
<li>成人 {{auditNum}}人</li>
<li>儿童 {{childNum}}人</li>
</ul>
</div>
<div class="HS_div2One">
<ul>
<li class="HS2_title">入住日期</li>
<li>
<el-date-picker class="date_input" style="width:130px;" prefix-icon="none" clear-icon=""
<el-date-picker class="date_input" v-model="msg.arrivalDate" @change="getDateInfo()" style="width:130px;" prefix-icon="none" clear-icon=""
size="small"
value-format="yyyy-MM-dd"
type="date"
placeholder="">
</el-date-picker>
周二<span class="HS2_title" style="margin:0 10px;">15:00 之后</span>
<template v-if="dataList.roomRateDetails">
{{'周'+checkInWeek}}<span class="HS2_title" style="margin:0 10px;">
{{dataList.roomRateDetails.roomOptions['finalCheck-inTime']}} 之后</span>
</template>
<div class="HS_Line"></div>
<el-date-picker class="date_input" style="width:130px;" prefix-icon="none" clear-icon=""
<el-date-picker class="date_input" v-model="msg.departureDate" @change="getDateInfo()" style="width:130px;" prefix-icon="none" clear-icon=""
size="small"
value-format="yyyy-MM-dd"
type="date"
placeholder="">
</el-date-picker>
周三<span class="HS2_title" style="margin:0 10px;">12:00 之前</span>
<template v-if="dataList.roomRateDetails">
{{'周'+checkOutWeek}}<span class="HS2_title" style="margin:0 10px;">
{{dataList.roomRateDetails.roomOptions['finalCheck-outTime']}} 之前</span>
</template>
</li>
<li>
<!-- <li>
1晚
</li>
<li>
</li> -->
<!-- <li>
<input type="button" class="HS_UpdateDate" value="修改日期"/>
</li>
</li> -->
</ul>
</div>
<div class="HS_div2One HS_roomNum">
<ul>
<li class="HS2_title">房间数量</li>
<li>
<el-select style="width:80px" clearable placeholder="">
<template v-if="dataList.roomGroup">
{{dataList.roomGroup.roomCount}}
</template>
<!-- <el-select style="width:80px" clearable placeholder="">
<el-option :value="1" label="1"></el-option>
<el-option :value="2" label="2"></el-option>
<el-option :value="3" label="3"></el-option>
......@@ -374,25 +404,28 @@
<el-option :value="7" label="7"></el-option>
<el-option :value="8" label="8"></el-option>
<el-option :value="9" label="9"></el-option>
</el-select>
</el-select> -->
</li>
<li>
<i class="iconfont icon-jinggao1" style="color:#FFA835"></i>
仅剩一间
仅剩{{dataList.currentAllotment}}间
</li>
<li>
每间最多入住2人
<template v-if="dataList.roomGroup">
每间最多入住成人：{{dataList.roomGroup.roomAdultCount}}，儿童：{{dataList.roomGroup.roomChildCount}}
</template>
</li>
</ul>
</div>
<div class="HS_div2One">
<div class="HS_div2One" v-for="(item,index) in dataList.roomGroup">
<ul>
<li class="HS2_title" style="vertical-align:top;">房费情况</li>
<li>
<div class="HS_fangfei">
<div class="HS_fangfei_Top">07-09</div>
<div>¥<span>7906</span></div>
<div>无餐食</div>
<li class="HS2_title" style="vertical-align:top;width:48px;">
<template v-if="index==0">房费情况</template>
</li>
<li style="width:680px;">
<div class="HS_fangfei" v-for="subItem in item.rateGroup">
<div class="HS_fangfei_Top">{{subItem.stayDate}}</div>
<div v-if="subItem.perAdultRateBySetCurrency">¥<span>{{subItem.perAdultRateBySetCurrency}}</span></div>
</div>
</li>
</ul>
......@@ -403,121 +436,149 @@
<div class="HS_bookTitle">
入住信息<span><i class="iconfont icon-jinggao1"></i>所填姓名需和入住时所持证件一致</span>
</div>
<div class="HS_div2One HS_BookMan">
<ul>
<li style="margin-left:56px;">入住时间</li>
<el-time-select
v-model="sureMsg.checkInTime"
:picker-options="{
start: '15:00',
step: '01:00',
end: '27:00'
}"
value-format="HH:MM"
placeholder="选择时间">
</el-time-select>
</ul>
</div>
<div class="HS_div2One HS_BookMan">
<ul>
<li class="HS2_title">预订人</li>
<li>住客<img class="HS_wenhao" src="../../assets/img/hotel/wenhao.png"/></li>
<el-input tyle="text" style="width:120px;margin-right:20px;" placeholder="姓 Last Name"></el-input>
<el-input tyle="text" style="width:120px;" placeholder="名 First Name"></el-input>
<el-input tyle="text" v-model="sureMsg.guestLastName" style="width:120px;margin-right:20px;" placeholder="姓 Last Name"></el-input>
<el-input tyle="text" v-model="sureMsg.guestFirstName" style="width:120px;" placeholder="名 First Name"></el-input>
</ul>
</div>
<div class="HS_div2One HS_AreaSelect">
<ul>
<li style="margin-left:53px;">当前地址</li>
<li>
<el-select style="width:80px" clearable placeholder="国">
<!-- <el-option :value="1" label="1"></el-option> -->
</el-select>
<el-input type="text" v-model="sureMsg.guestAddress" style="width:400px;" placeholder="详细地址"></el-input>
</li>
</ul>
</div>
<div class="HS_div2One HS_Email">
<ul>
<li style="margin-left:67px;">Email</li>
<li>
<el-select style="width:80px" clearable placeholder="省">
<!-- <el-option :value="1" label="1"></el-option> -->
</el-select>
<el-input type="text" v-model="sureMsg.guestEmail" style="width:400px;" placeholder="接收确认邮件，获得出行资格"></el-input>
</li>
</ul>
</div>
<div class="HS_div2One HS_Email">
<ul>
<li style="margin-left:67px;">电话</li>
<li>
<el-select style="width:80px" clearable placeholder="市">
<!-- <el-option :value="1" label="1"></el-option> -->
</el-select>
<el-input type="text" @keyup.native="checkInteger(sureMsg,'guestPhoneNumber')" v-model="sureMsg.guestPhoneNumber" style="width:400px;" placeholder="电话"></el-input>
</li>
</ul>
</div>
<div class="HS_div2One HS_Email" style="margin-top:30px;">
<ul>
<li style="margin-left:45px;vertical-align:top;">客户需求</li>
<li>
<el-select style="width:80px" clearable placeholder="区">
<!-- <el-option :value="1" label="1"></el-option> -->
</el-select>
<el-input type="textarea" :rows="3" maxlength="400" v-model="sureMsg.guestRequest" style="width:400px;" placeholder="住宿需求"></el-input>
</li>
</ul>
</div>
<div class="HS_detailAddress">
<el-input type="text" style="width:400px;" placeholder="详细地址"></el-input>
</div>
<div class="HS_div2One HS_Email">
<div class="HS_div2One HS_Email" style="margin-top:30px;">
<ul>
<li style="margin-left:67px;">Email</li>
<li style="margin-left:20px;vertical-align:top;">客户需求补充</li>
<li>
<el-input type="text" style="width:400px;" placeholder="接收确认邮件，获得出行资格"></el-input>
<el-input type="textarea" :rows="3" maxlength="400" v-model="sureMsg.guestRequestAppendix" style="width:400px;" placeholder="住宿需求"></el-input>
</li>
</ul>
</div>
<div class="HS_div2One" style="margin-top:30px;">
<div class="HS_div2One HS_Email" style="margin-top:30px;">
<ul>
<li style="margin:0 10px 0 40px;">
<div>入住和离店</div>
<div>（当地时间）</div>
</li>
<li style="vertical-align:top">
入住时间 15:00以后
</li>
<li style="vertical-align:top">
离店时间 12:00以前
<li style="margin-left:68px;vertical-align:top;">评语</li>
<li>
<el-input type="textarea" :rows="3" maxlength="400" v-model="sureMsg.comment" style="width:400px;" placeholder="住宿需求"></el-input>
</li>
</ul>
</div>
<div class="HS_div2One HS_AreaSelect">
<ul>
<li class="HS2_title">房间1</li>
<ul v-for="item in sureMsg.roomGroup">
<li class="HS2_title">房间{{item.roomCount}}</li>
<li style="margin-left:20px;">人数</li>
<li>
<el-select style="width:90px" clearable placeholder="成人男">
<!-- <el-option :value="1" label="1"></el-option> -->
<el-select style="width:90px" v-model="item.roomMaleCount" :disabled="item.isShowMale" clearable placeholder="成人男">
<el-option v-for="item in Pnumber" :value="item.num" :label="item.num"></el-option>
</el-select>
</li>
<li>
<el-select style="width:90px" clearable placeholder="成人女">
<!-- <el-option :value="1" label="1"></el-option> -->
<el-select style="width:90px" v-model="item.roomFemaleCount" :disabled="item.isShowFemale" clearable placeholder="成人女">
<el-option v-for="item in Pnumber" :value="item.num" :label="item.num"></el-option>
</el-select>
</li>
<li>
<el-select style="width:90px" clearable placeholder="儿童">
<!-- <el-option :value="1" label="1"></el-option> -->
<el-select style="width:90px" v-model="item.roomChildCount" :disabled="item.isShowChild" clearable placeholder="儿童">
<el-option v-for="item in Pnumber" :value="item.num" :label="item.num"></el-option>
</el-select>
</li>
</ul>
</div>
</div>
<input type="button" class="HD_payBtn" @click="BuyHoTel()" value="下单" />
</div>
<div class="HS_RightList">
<div class="HS_RightTopImg">
<img src="../../assets/img/hotel/biefu.png" alt=""/>
<template v-if="dataList.roomRateDetails">
<img :src="dataList.roomRateDetails.roomImageURL" alt=""/>
</template>
</div>
<div class="HS_HotelRight">
<div class="HS_HtName">{{dataList.hotelName}}</div>
<div class="HS_EnName">Aman Tokyo</div>
<div class="HS_HAddress">
<img src="../../assets/img/hotel/redAddress.png" alt=""/>
THE OTEMACHI TOWER 1-5-6 OTEMACHI CHIYODA-KU,东京站/日本桥/秋叶原/锦糸町,东京,东京都,100-0004,日本
{{dataList.address}}
</div>
<div class="HS_Haohua">豪华客房(豪华大床)每日标准放假</div>
<div class="f12 C9">Deluxe Room - King</div>
<ul class="HS_RoomInfo">
<li>
<span class="C9">床型</span>
<span>1张特大床</span>
<span class="C9">房型</span>
<div v-if="dataList.roomRateDetails">
<template v-if="dataList.roomRateDetails.roomType==1">单人床</template>
<template v-if="dataList.roomRateDetails.roomType==2">双床</template>
<template v-if="dataList.roomRateDetails.roomType==3">大床房</template>
<template v-if="dataList.roomRateDetails.roomType==4">三人间</template>
<template v-if="dataList.roomRateDetails.roomType==5">四床房</template>
<template v-if="dataList.roomRateDetails.roomType==6">日式房</template>
<template v-if="dataList.roomRateDetails.roomType==7">日式&西式混合房间</template>
</div>
</li>
<li>
<span class="C9">人数</span>
<span>每间房最多入住1人</span>
<span v-if="dataList.roomGroup">
每间最多入住成人：{{dataList.roomGroup.roomAdultCount}}，儿童：{{dataList.roomGroup.roomChildCount}}
</span>
</li>
<li>
<!-- <li>
<span class="C9">加床</span>
<span>JPY 20216.00/床/间夜</span>
</li>
</li> -->
<li>
<span class="C9">面积</span>
<span>71㎡</span>
<span class="C9">吸烟</span>
<span v-if="dataList.roomRateDetails">
<template v-if="dataList.roomRateDetails.smoking==0">禁吸</template>
<template v-if="dataList.roomRateDetails.smoking==1">可吸烟</template>
</span>
</li>
<li>
<span class="C9">网络</span>
<span>全部房间支持免费无线宽带上网</span>
<span class="C9">厕所</span>
<span v-if="dataList.roomRateDetails">
<template v-if="dataList.roomRateDetails.withBath==0">无</template>
<template v-if="dataList.roomRateDetails.withBath==1">有</template>
</span>
</li>
</ul>
</div>
......@@ -525,10 +586,10 @@
<div class="HS_RitTop">
<span class="HS_RitTop_Left">订单总额</span>
<span class="HS_RitPrice">
<i>¥</i>7904
<i>¥</i>{{totalPrice}}
</span>
</div>
<div class="HS_RitBottom">
<!-- <div class="HS_RitBottom">
<div>
<span>房费</span>
<span class="HS_btLine"></span>
......@@ -539,7 +600,7 @@
<span class="HS_btLineTwo"></span>
<span>¥1550</span>
</div>
</div>
</div> -->
</div>
</div>
</div>
......@@ -558,13 +619,110 @@ export default {
roomOptionCd:'',
searchroomGroup:[]
},
auditNum:0,
childNum:0,
//入住 周几
checkInWeek:'',
checkOutWeek:'',
//确认MSG参数
sureMsg:{
dataId:'',
hotelId:'',
totalRoomCount:'',
arrivalDate:'',
checkInTime:'',
departureDate:'',
roomOptionCd:'',
totalChargeableRateInfo:'',
roomGroup:[],
guestLastName:'',
guestFirstName:'',
guestAddress:'',
guestPhoneNumber:'',
guestEmail:'',
guestRequest:'',
guestRequestAppendix:'',
comment:'',
CustomerId:0,
CreateBy:0
},
//人数下拉
Pnumber:[{
num:0
},{
num:1
},{
num:2
},{
num:3
},{
num:4
},{
num:5
},{
num:6
},{
num:7
},{
num:8
},{
num:9
},{
num:10
},{
num:11
},{
num:12
},{
num:13
},{
num:14
},{
num:15
},{
num:16
},{
num:17
},{
num:18
},{
num:19
},{
num:20
},],
dataList:[],
//总价
totalPrice:0,
};
},
mounted() {
let msgList = JSON.parse(this.$route.query.msg);
this.msg = msgList;
console.log(msgList,'msglist');
this.auditNum=0;
this.childNum=0;
this.msg.searchroomGroup.forEach(x=>{
this.auditNum+=x.numberOfAdults;
this.childNum+=x.numberOfChildren;
})
let roomGroupLen = this.msg.searchroomGroup.length;
let userInfo = this.getLocalStorage();
this.sureMsg.CustomerId = userInfo.customerId;
this.sureMsg.CreateBy = userInfo.createBy;
this.sureMsg.roomGroup=[];
for(var i=0;i<roomGroupLen;i++){
var obj = {
roomCount:i+1,
roomMaleCount:0,
roomFemaleCount:0,
roomChildCount:0,
roomInfantCount:0,
rateGroup:[]
}
this.sureMsg.roomGroup.push(obj);
}
console.log(this.sureMsg,'sureMsgsureMsgsureMsg');
this.getWeek();
this.getBookInfo();
},
created() {
......@@ -577,6 +735,19 @@ export default {
console.log(res,'bookMsg');
if (res.data.resultCode == 1) {
this.dataList = res.data.data;
if(Object.prototype.toString.call(this.dataList.roomGroup) == '[object Object]'){
let arr = [];
arr.push(this.dataList.roomGroup);
this.dataList.roomGroup=arr;
}
this.dataList.roomGroup.forEach(x=>{
let tt = 0;
x.rateGroup.forEach(z=>{
tt+=parseFloat(z.perAdultRate);
})
this.totalPrice+=tt*x.roomAdultCount;
})
} else {
this.Error(res.data.message);
}
......@@ -584,6 +755,53 @@ export default {
err => {}
);
},
//通过日期得到周几
getWeek(){
this.checkInWeek = new Date(this.msg.arrivalDate).getDay();
this.checkOutWeek = new Date(this.msg.departureDate).getDay();
},
//改变日期
getDateInfo(){
this.getWeek();
this.getBookInfo();
},
//点击支付
BuyHoTel(){
this.sureMsg.hotelId = this.msg.hotelId;
this.sureMsg.arrivalDate = this.msg.arrivalDate;
this.sureMsg.totalRoomCount = this.msg.searchroomGroup.length;
this.sureMsg.departureDate = this.msg.departureDate;
this.sureMsg.roomOptionCd = this.msg.roomOptionCd;
this.dataList.roomGroup.forEach(x=>{
this.sureMsg.roomGroup.forEach(j=>{
if(Object.prototype.toString.call(x.rateGroup) == '[object Object]'){
j.rateGroup.push(x.rateGroup);
}else{
j.rateGroup=x.rateGroup
}
})
})
if(this.sureMsg.CustomerId==null||this.sureMsg.CustomerId==""){
this.sureMsg.CustomerId=0
}
if(this.sureMsg.CreateBy==null||this.sureMsg.CreateBy==""){
this.sureMsg.CreateBy=0
}
console.log(this.sureMsg,'确定');
this.sureMsg.totalChargeableRateInfo = this.totalPrice;
this.apipost("dmc_post_Get_GetJAPAN_HotelBooking",this.sureMsg,res => {
console.log(res,'保存完毕');
if (res.data.resultCode == 1) {
this.Succrss(res.data.message);
} else {
this.Error(res.data.message);
}
},
err => {}
);
}
}
};
</script>
src/components/global/newHead.vue
View file @ 02988c48
......@@ -321,6 +321,13 @@
<span class="__splice">|</span>
</div>
</li>
<!-- 酒店 -->
<li :class="{_active: navActive === 10}">
<div @click="handleSelect('/HotelHome', 10), navActive = 10">
<span>酒店</span>
<span class="__splice">|</span>
</div>
</li>
<!-- 景点门票 -->
<!-- <li :class="{_active: navActive === 7}">
<div @click="handleSelect('/', 7), navActive = 7">
......@@ -498,7 +505,9 @@ export default {
created() {
let that = this;
require(["http://pv.sohu.com/cityjson?ie=utf-8"], () => {
setTimeout(() => {
console.log("returnCitySN",returnCitySN)
if (returnCitySN) {
that.loadSites();
that.cityText = returnCitySN.cname;
......
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