Skip to content

S
SuperMan
Commit 0429b4e8 authored by 黄奎's avatar 黄奎
Browse files
Options

接口调整

parent a2de65ff
Hide whitespace changes
Inline Side-by-side
Showing with 1175 additions and 1004 deletions
src/components/Hotel/DiDa/HotelDetails.vue
View file @ 0429b4e8
<style scoped> <style scoped>
.hotelCard-img { .hotelCard-img {
width: 228px; width: 228px;
height: 162px; height: 162px;
overflow: hidden; overflow: hidden;
} }
.hotelCard-title {
width: 100%; .hotelCard-title {
overflow: hidden; width: 100%;
white-space: nowrap; overflow: hidden;
text-overflow: ellipsis; white-space: nowrap;
} text-overflow: ellipsis;
.hotel-info-item::before { }
display: inline;
content: "·"; .hotel-info-item::before {
font-weight: bolder; display: inline;
margin-right: 4px; content: "·";
} font-weight: bolder;
.height-320 { margin-right: 4px;
height: 250px; }
}
.hotel-details-table { .height-320 {
border: 1px solid #dcdcdc; height: 250px;
border-collapse: collapse; }
width: 680px;
} .hotel-details-table {
.hotel-details-table .td01 { border: 1px solid #dcdcdc;
padding: 3px 15px; border-collapse: collapse;
background: #f7f7f7; width: 680px;
width: 226px; }
height: 19px;
text-align: center; .hotel-details-table .td01 {
} padding: 3px 15px;
.hotel-details-table .td02 { background: #f7f7f7;
padding: 3px 15px; width: 226px;
background: #fafafa; height: 19px;
width: 69px; text-align: center;
height: 19px; }
text-align: center;
} .hotel-details-table .td02 {
.hotel-details-table td { padding: 3px 15px;
width: 439px; background: #fafafa;
padding: 10px 20px; width: 69px;
vertical-align: middle; height: 19px;
text-align: center; text-align: center;
border: 1px solid #dcdcdc; }
font-size: 14px;
box-sizing: border-box; .hotel-details-table td {
} width: 439px;
.hotel-details-tableMoblie { padding: 10px 20px;
border: 1px solid #dcdcdc; vertical-align: middle;
border-collapse: collapse; text-align: center;
width: 100%; border: 1px solid #dcdcdc;
margin-top: 5px; font-size: 14px;
} box-sizing: border-box;
.hotel-details-tableMoblie .td01 { }
padding: 3px 10px;
background: #f7f7f7; .hotel-details-tableMoblie {
width: 33.33%; border: 1px solid #dcdcdc;
height: 19px; border-collapse: collapse;
text-align: center; width: 100%;
} margin-top: 5px;
.hotel-details-tableMoblie .td02 { }
padding: 3px 5px;
background: #fafafa; .hotel-details-tableMoblie .td01 {
width: 33.33%; padding: 3px 10px;
height: 19px; background: #f7f7f7;
text-align: center; width: 33.33%;
} height: 19px;
.hotel-details-tableMoblie td { text-align: center;
width: 100%; }
padding: 10px 20px;
vertical-align: middle; .hotel-details-tableMoblie .td02 {
text-align: center; padding: 3px 5px;
border: 1px solid #dcdcdc; background: #fafafa;
font-size: 14px; width: 33.33%;
box-sizing: border-box; height: 19px;
} text-align: center;
.HD_hotelComIntroduce { }
margin: auto;
height: auto; .hotel-details-tableMoblie td {
border-bottom: 1px solid #dcdcdc; width: 100%;
color: #111111; padding: 10px 20px;
} vertical-align: middle;
.HD_hotelComIntroduce span { text-align: center;
display: inline-block; border: 1px solid #dcdcdc;
margin-bottom: 10px; font-size: 14px;
} box-sizing: border-box;
.HD_inTitle { }
font-size: 14px;
font-weight: bold; .HD_hotelComIntroduce {
color: #111111; margin: auto;
margin-bottom: 20px; height: auto;
} border-bottom: 1px solid #dcdcdc;
.HD_ServiceList span { color: #111111;
display: inline-block; }
margin: 0 30px 10px 0;
white-space: nowrap; .HD_hotelComIntroduce span {
} display: inline-block;
.bg-white{ margin-bottom: 10px;
background:#fff!important; }
}
.q-py-lg{ .HD_inTitle {
padding-top: 24px; font-size: 14px;
padding-bottom: 24px; font-weight: bold;
} color: #111111;
.column{ margin-bottom: 20px;
flex-direction: column; }
}
.row{ .HD_ServiceList span {
display: flex; display: inline-block;
margin: 0 30px 10px 0;
white-space: nowrap;
}
.bg-white {
background: #fff !important;
}
.q-py-lg {
padding-top: 24px;
padding-bottom: 24px;
}
.column {
flex-direction: column;
}
.row {
display: flex;
flex-wrap: wrap; flex-wrap: wrap;
} }
.q-mb-lg {margin-bottom: 24px;}
.justify-between{justify-content: space-between;}
.q-position-engine{ .q-mb-lg {
margin-top: var(--q-pe-top, 0) !important; margin-bottom: 24px;
}
.justify-between {
justify-content: space-between;
}
.q-position-engine {
margin-top: var(--q-pe-top, 0) !important;
margin-left: var(--q-pe-left, 0) !important; margin-left: var(--q-pe-left, 0) !important;
will-change: auto; will-change: auto;
} }
.scroll{
overflow: auto; .scroll {
} overflow: auto;
.q-menu { }
.q-menu {
position: fixed !important; position: fixed !important;
display: inline-block; display: inline-block;
max-width: 95vw; max-width: 95vw;
...@@ -134,135 +161,188 @@ ...@@ -134,135 +161,188 @@
outline: 0; outline: 0;
max-height: 65vh; max-height: 65vh;
z-index: 6000; z-index: 6000;
} }
.q-pa-md {
.q-pa-md {
padding: 16px; padding: 16px;
} }
.q-pa-mdlr {
padding:0px 16px; .q-pa-mdlr {
} padding: 0px 16px;
.rounded-borders { }
.rounded-borders {
border-radius: 4px; border-radius: 4px;
} }
.wrap {
.wrap {
flex-wrap: wrap; flex-wrap: wrap;
} }
.q-card {
.q-card {
box-shadow: 0 1px 5px #0003, 0 2px 2px #00000024, 0 3px 1px -2px #0000001f; box-shadow: 0 1px 5px #0003, 0 2px 2px #00000024, 0 3px 1px -2px #0000001f;
border-radius: 4px; border-radius: 4px;
vertical-align: top; vertical-align: top;
background: #fff; background: #fff;
position: relative; position: relative;
} }
.q-cardradius { .q-cardradius {
box-shadow: none; box-shadow: none;
border-radius: 0px !important; border-radius: 0px !important;
border:1px solid #dedede; border: 1px solid #dedede;
} }
.listBox .q-cardradius{
border-top:0
}
.q-card>div:not(:last-child), .q-card>img:not(:last-child) { .listBox .q-cardradius {
border-top: 0
}
.q-card>div:not(:last-child),
.q-card>img:not(:last-child) {
border-bottom-left-radius: 0; border-bottom-left-radius: 0;
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
} }
.q-card>div:first-child, .q-card>img:first-child {
.q-card>div:first-child,
.q-card>img:first-child {
border-top: 0; border-top: 0;
border-top-left-radius: inherit; border-top-left-radius: inherit;
border-top-right-radius: inherit; border-top-right-radius: inherit;
} }
.q-card>div {
.q-card>div {
border-left: 0; border-left: 0;
border-right: 0; border-right: 0;
box-shadow: none; box-shadow: none;
} }
.q-mr-md {
.q-mr-md {
margin-right: 16px; margin-right: 16px;
} }
.no-shadow{
display: flex; .no-shadow {
justify-content: flex-start; display: flex;
} justify-content: flex-start;
.el-card__body{ }
.el-card__body {
height: 285px; height: 285px;
/* display: flex; /* display: flex;
max-width: 1200px; max-width: 1200px;
*/ */
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
overflow: auto; overflow: auto;
} }
.el-date-editor .el-range-input{
width:80px; .el-date-editor .el-range-input {
} width: 80px;
.el-range-editor.el-input__inner{ }
padding:3px 0px !important;
} .el-range-editor.el-input__inner {
.el-range-editor--small .el-range-separator{margin-right:12px !important;} padding: 3px 0px !important;
.el-range-separator{width:20px !important;} }
.el-date-editor--daterange.el-input, .el-date-editor--daterange.el-input__inner, .el-date-editor--timerange.el-input, .el-date-editor--timerange.el-input__inner{
width:202px; .el-range-editor--small .el-range-separator {
} margin-right: 12px !important;
.el-input .el-input__inner, .el-select .el-input{ }
border-radius:4px;
height:32px; .el-range-separator {
} width: 20px !important;
.HD_Green { }
.el-date-editor--daterange.el-input,
.el-date-editor--daterange.el-input__inner,
.el-date-editor--timerange.el-input,
.el-date-editor--timerange.el-input__inner {
width: 202px;
}
.el-input .el-input__inner,
.el-select .el-input {
border-radius: 4px;
height: 32px;
}
.HD_Green {
background-color: green; background-color: green;
} }
.text-white {
.text-white {
color: #fff !important; color: #fff !important;
} }
.absolute, .absolute-full, .absolute-center, .absolute-bottom, .absolute-left, .absolute-right, .absolute-top, .absolute-top-left, .absolute-top-right, .absolute-bottom-left, .absolute-bottom-right {
.absolute,
.absolute-full,
.absolute-center,
.absolute-bottom,
.absolute-left,
.absolute-right,
.absolute-top,
.absolute-top-left,
.absolute-top-right,
.absolute-bottom-left,
.absolute-bottom-right {
position: absolute; position: absolute;
} }
.HD_Black {
.HD_Black {
background-color: #000; background-color: #000;
} }
.q-px-lg {
.q-px-lg {
padding-left: 24px; padding-left: 24px;
padding-right: 24px; padding-right: 24px;
} }
.q-px-lg12 { .q-px-lg12 {
padding-left: 12px; padding-left: 12px;
padding-right: 12px; padding-right: 12px;
} }
.q-pl-lg {
.q-pl-lg {
padding-left: 24px; padding-left: 24px;
} }
.q-pt-sm {
.q-pt-sm {
padding-top: 8px; padding-top: 8px;
} }
.q-px-sm {
.q-px-sm {
padding-left: 8px; padding-left: 8px;
padding-right: 8px; padding-right: 8px;
} }
.q-mb-md {
.q-mb-md {
margin-bottom: 16px; margin-bottom: 16px;
} }
.text-right {
.text-right {
text-align: right; text-align: right;
} }
.q-pt-md {
.q-pt-md {
padding-top: 16px; padding-top: 16px;
} }
.text-green {
.text-green {
color: #4caf50 !important; color: #4caf50 !important;
} }
.text-grey-6 {
.text-grey-6 {
color: #9e9e9e !important; color: #9e9e9e !important;
} }
.text-red {
.text-red {
color: #f44336 !important; color: #f44336 !important;
} }
.text-333{
color: #333 !important; .text-333 {
} color: #333 !important;
.q-focus-helper { }
.q-focus-helper {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
...@@ -271,39 +351,48 @@ ...@@ -271,39 +351,48 @@
pointer-events: none; pointer-events: none;
border-radius: inherit; border-radius: inherit;
opacity: 0; opacity: 0;
transition: background-color .3s cubic-bezier(.25,.8,.5,1), opacity .4s cubic-bezier(.25,.8,.5,1); transition: background-color .3s cubic-bezier(.25, .8, .5, 1), opacity .4s cubic-bezier(.25, .8, .5, 1);
} }
.q-btn--actionable {
.q-btn--actionable {
cursor: pointer; cursor: pointer;
} }
.bg-green-6 {
.bg-green-6 {
background: #4caf50 !important; background: #4caf50 !important;
} }
.q-separator--horizontal {
.q-separator--horizontal {
display: block; display: block;
height: 1px; height: 1px;
} }
.el-divider--horizontal{
margin:0px !important; .el-divider--horizontal {
} margin: 0px !important;
.order-show{ }
text-align: center;
.order-show {
text-align: center;
color: red; color: red;
cursor: pointer; cursor: pointer;
} }
.text-weight-bold {
.text-weight-bold {
font-weight: 700; font-weight: 700;
} }
.text-orange {
.text-orange {
color: #ff9800 !important; color: #ff9800 !important;
} }
.el-image {
.el-image {
position: relative; position: relative;
display: inline-block; display: inline-block;
overflow: hidden; overflow: hidden;
} }
.Img-absolute {
height:13%; .Img-absolute {
height: 13%;
position: absolute; position: absolute;
top: 87%; top: 87%;
left: 0; left: 0;
...@@ -315,692 +404,753 @@ ...@@ -315,692 +404,753 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
cursor: pointer; cursor: pointer;
} }
.nd-label_error {
.nd-label_error {
color: #bc1a1a; color: #bc1a1a;
cursor: pointer; cursor: pointer;
} }
.nd-label_success {
.nd-label_success {
color: #36b889; color: #36b889;
border-bottom: 1px dotted #36b889; border-bottom: 1px dotted #36b889;
cursor: pointer; cursor: pointer;
} }
.nd-confirmation{
.nd-confirmation {
color: #f90; color: #f90;
cursor: pointer; cursor: pointer;
} }
.hover-effect { .hover-effect {
transition: background-color 0.3s, opacity 0.3s; /* 平滑过渡效果 */ transition: background-color 0.3s, opacity 0.3s;
opacity: 1; /* 初始透明度 */ /* 平滑过渡效果 */
} opacity: 1;
/* 初始透明度 */
.hover-effect:hover { }
background-color:rgb(238,241,249); /* 悬停时背景变灰 */
opacity: 0.9; /* 悬停时半透明 */ .hover-effect:hover {
} background-color: rgb(238, 241, 249);
/* 悬停时背景变灰 */
opacity: 0.9;
.table-list tr, td { /* 悬停时半透明 */
border-bottom: 1px solid #ddd; }
border-right: 1px solid #ddd;
border-left: 1px solid #ddd;
padding:8px; .table-list tr,
border-collapse: collapse; /* 移除单元格之间的间隔 */ td {
} border-bottom: 1px solid #ddd;
.table-list tr:first-child td { border-right: 1px solid #ddd;
border-top: 1px solid #ddd; border-left: 1px solid #ddd;
border-right: 1px solid #ddd; padding: 8px;
border-left: 1px solid #ddd; border-collapse: collapse;
padding:8px; /* 移除单元格之间的间隔 */
border-collapse: collapse; /* 移除单元格之间的间隔 */ }
}
.divPrice ul:first-child li { .table-list tr:first-child td {
border-top:1px solid #ddd; border-top: 1px solid #ddd;
background-color: #f9f9f9; /* 设置背景色 */ border-right: 1px solid #ddd;
} border-left: 1px solid #ddd;
.divPrice .otherDiv{ padding: 8px;
text-align:left; border-collapse: collapse;
font-size:14px; /* 移除单元格之间的间隔 */
} }
.nd-label_warning {
.divPrice ul:first-child li {
border-top: 1px solid #ddd;
background-color: #f9f9f9;
/* 设置背景色 */
}
.divPrice .otherDiv {
text-align: left;
font-size: 14px;
}
.nd-label_warning {
color: #f90; color: #f90;
border-bottom: 1px dotted #f90; border-bottom: 1px dotted #f90;
cursor: pointer; cursor: pointer;
} }
.hotel-info-section__warning {
.hotel-info-section__warning {
font-size: 12px; font-size: 12px;
line-height: 20px; line-height: 20px;
font-weight: 400; font-weight: 400;
color: #f90; color: #f90;
margin-left:15px; margin-left: 15px;
} }
/deep/.el-timeline-item__wrapper{
top:-16px !important; /deep/.el-timeline-item__wrapper {
} top: -16px !important;
/deep/.el-timeline .el-timeline-item .el-timeline-item__tail{ }
margin-top:8px !important;
border-left:1px dashed #33B3FF; /deep/.el-timeline .el-timeline-item .el-timeline-item__tail {
} margin-top: 8px !important;
border-left: 1px dashed #33B3FF;
/deep/.el-timeline-item{ }
padding-bottom:0px !important;
} /deep/.el-timeline-item {
.PolicyDiv{ padding-bottom: 0px !important;
line-height:27px; }
}
/deep/.PolicyDiv p{ .PolicyDiv {
margin-top:15px !important; line-height: 27px;
} }
/deep/.DidaDescriptionDiv p:first-child{ /deep/.PolicyDiv p {
margin-top:0px !important; margin-top: 15px !important;
} }
.Facilities{ /deep/.DidaDescriptionDiv p:first-child {
white-space: nowrap; /* 不换行 */ margin-top: 0px !important;
overflow: hidden; white-space: nowrap; /* 隐藏 */ }
text-overflow: ellipsis; /* 显示为省略号 */
width:200px; .Facilities {
float:left; white-space: nowrap;
cursor: pointer; /* 不换行 */
} overflow: hidden;
white-space: nowrap;
/* 隐藏 */
text-overflow: ellipsis;
/* 显示为省略号 */
width: 200px;
float: left;
cursor: pointer;
}
</style> </style>
<template> <template>
<div class="q-py-lg"> <div class="q-py-lg">
<div class="bg-white q-py-lg column" style="max-width: 1366px; min-width: 375px; margin: auto;width:1300px" > <div class="bg-white q-py-lg column" style="max-width: 1366px; min-width: 375px; margin: auto;width:1300px">
<div class="row q-px-lg q-mb-lg row justify-between" > <div class="row q-px-lg q-mb-lg row justify-between">
<div class="row items-center"> <div class="row items-center">
<div class="mobile-only row items-center"> <div class="mobile-only row items-center">
<div class="text-weight-bold fz20 ellipsis text-333" style="width: 280px"> <div class="text-weight-bold fz20 ellipsis text-333" style="width: 280px">
{{ DidaHotelDetails.Name_CN }} {{ DidaHotelDetails.Name_CN }}
</div> </div>
</div> </div>
<div v-if="DidaHotelRoomDetails&&DidaHotelRoomDetails.HotelList&&DidaHotelRoomDetails.HotelList.length>0&&DidaHotelRoomDetails.HotelList[0].LowestPrice"> <div
<span v-if="DidaHotelRoomDetails&&DidaHotelRoomDetails.HotelList&&DidaHotelRoomDetails.HotelList.length>0&&DidaHotelRoomDetails.HotelList[0].LowestPrice">
class="text-orange text-weight-bold fz18 q-pl-lg " > <span class="text-orange text-weight-bold fz18 q-pl-lg ">
{{ DidaHotelRoomDetails.HotelList[0].LowestPrice.Currency }} {{ DidaHotelRoomDetails.HotelList[0].LowestPrice.Currency }}
{{ DidaHotelRoomDetails.HotelList[0].LowestPrice.Value }} {{ DidaHotelRoomDetails.HotelList[0].LowestPrice.Value }}
</span> </span>
<span class="text-grey-8 q-pl-xs">/起</span> <span class="text-grey-8 q-pl-xs">/起</span>
</div> </div>
<div class="q-ml-md" v-if="DidaHotelDetails.StarRating&&DidaHotelDetails.StarRating>0"> <div class="q-ml-md" v-if="DidaHotelDetails.StarRating&&DidaHotelDetails.StarRating>0">
<el-rate <el-rate v-model="DidaHotelDetails.StarRating" :max="getPrice(DidaHotelDetails.StarRating)" size="3em"
v-model="DidaHotelDetails.StarRating" disabled color="orange" readonly show-score />
:max="getPrice(DidaHotelDetails.StarRating)"
size="3em"
disabled
color="orange"
readonly
show-score
/>
</div> </div>
</div> </div>
</div> </div>
<div class="col q-px-lg q-mb-lg" > <div class="col q-px-lg q-mb-lg">
<div class="row nowrap"> <div class="row nowrap">
<i class="text-grey-13 q-mr-xs el-icon-location-outline" name="place" size="xs"></i> <i class="text-grey-13 q-mr-xs el-icon-location-outline" name="place" size="xs"></i>
<span class="col fz14 text-blick text-333">{{DidaHotelDetails.Address_CN }}</span> <span class="col fz14 text-blick text-333">{{DidaHotelDetails.Address_CN }}</span>
</div> </div>
</div> </div>
<div class="col q-px-lg" > <div class="col q-px-lg">
<div class="row nowrap"> <div class="row nowrap">
<i class="text-grey-13 q-mr-xs el-icon-phone" name="place" size="xs" style="color:#c0c4cc;"></i> <i class="text-grey-13 q-mr-xs el-icon-phone" name="place" size="xs" style="color:#c0c4cc;"></i>
<span class="col fz14 text-blick text-333">{{ DidaHotelDetails.Telephone }}</span> <span class="col fz14 text-blick text-333">{{ DidaHotelDetails.Telephone }}</span>
</div> </div>
</div> </div>
<div class="bg-white column" style="max-width: 1366px; min-width: 375px; overflow: hidden!important; margin: auto;width:1300px;padding-top:24px;" > <div class="bg-white column"
<div class="row q-px-lg q-mb-lg row justify-between" style="width:100%;"> style="max-width: 1366px; min-width: 375px; overflow: hidden!important; margin: auto;width:1300px;padding-top:24px;">
<div class="row q-px-lg q-mb-lg row justify-between" style="width:100%;">
<div style="width:60%;position: relative;" class="row"> <div style="width:60%;position: relative;" class="row">
<div style="position: relative;" class="row"> <div style="position: relative;" class="row">
<template v-if="DidaHotelImg&&DidaHotelImg.length==2"> <template v-if="DidaHotelImg&&DidaHotelImg.length==2">
<div style="width:50%;height:100%;" class="row" > <div style="width:50%;height:100%;" class="row">
<div class="row rounded-borders relative-position" style="margin-right: 0.5%; overflow: hidden;height:50%:"> <div class="row rounded-borders relative-position"
<el-image style="width: 100%; height: 100%;" :src="DidaHotelImg[0]" :preview-src-list="DidaHotelImg"> style="margin-right: 0.5%; overflow: hidden;height:50%:">
</el-image> <el-image style="width: 100%; height: 100%;" :src="DidaHotelImg[0]"
</div> :preview-src-list="DidaHotelImg">
</div> </el-image>
<div style="width:50%;height:100%;" class="row"> </div>
<div class="row rounded-borders relative-position" style="margin-right: 0.5%;height:50%: overflow: hidden;"> </div>
<el-image style="width: 100%; height: 100%;" :src="DidaHotelImg[1]" <div style="width:50%;height:100%;" class="row">
:preview-src-list="DidaHotelImg" fit="cover"> <div class="row rounded-borders relative-position"
</el-image> style="margin-right: 0.5%;height:50%: overflow: hidden;">
</div> <el-image style="width: 100%; height: 100%;" :src="DidaHotelImg[1]" :preview-src-list="DidaHotelImg"
</div> fit="cover">
</template> </el-image>
<template v-else> </div>
<div :style="DidaHotelImg.length==1?' width:100%;':' width:60%;'" class="row"> </div>
<div class="row rounded-borders relative-position" style="margin-right: 0.5%;position: relative; overflow: hidden;" v-if="DidaHotelImg&&DidaHotelImg.length>0" > </template>
<el-image style="width: 100%; height: 100%;" :src="DidaHotelImg[0]" :preview-src-list="DidaHotelImg"> <template v-else>
</el-image> <div :style="DidaHotelImg.length==1?' width:100%;':' width:60%;'" class="row">
</div> <div class="row rounded-borders relative-position"
</div> style="margin-right: 0.5%;position: relative; overflow: hidden;"
<div style="width:40%;" class="row" v-if="DidaHotelImg&&DidaHotelImg.length>2"> v-if="DidaHotelImg&&DidaHotelImg.length>0">
<div class="row rounded-borders relative-position" style="margin-right: 0.5%;margin-bottom:1%;position: relative; overflow: hidden;"> <el-image style="width: 100%; height: 100%;" :src="DidaHotelImg[0]"
:preview-src-list="DidaHotelImg">
<el-image style="width: 100%; height: 100%;" :src="DidaHotelImg[1]" :preview-src-list="DidaHotelImg"> </el-image>
</el-image> </div>
</div>
</div> <div style="width:40%;" class="row" v-if="DidaHotelImg&&DidaHotelImg.length>2">
<div class="row rounded-borders relative-position"
style="margin-right: 0.5%;margin-bottom:1%;position: relative; overflow: hidden;">
<el-image style="width: 100%; height: 100%;" :src="DidaHotelImg[1]"
:preview-src-list="DidaHotelImg">
</el-image>
<div class="row rounded-borders relative-position" style="margin-right: 0.5%; position: relative;overflow: hidden;"> </div>
<div class="Img-absolute"> <div class="row rounded-borders relative-position"
<div class="Img-absolute-box "> style="margin-right: 0.5%; position: relative;overflow: hidden;">
<div class="fz20 text-weight-bold" style="color:white;"><span style="margin-right:5px;">+</span><span>{{DidaHotelImg.length-3}}</span></div>
<div class="Img-absolute">
<div class="Img-absolute-box ">
<div class="fz20 text-weight-bold" style="color:white;"><span
style="margin-right:5px;">+</span><span>{{DidaHotelImg.length-3}}</span></div>
</div>
</div>
<el-image style="width: 100%; height: 100%;" :src="DidaHotelImg[2]"
:preview-src-list="DidaHotelImg">
</el-image>
</div>
</div> </div>
</div> </template>
<el-image style="width: 100%; height: 100%;" :src="DidaHotelImg[2]" :preview-src-list="DidaHotelImg">
</el-image>
</div>
</div>
</template>
</div>
</div>
<!-- 地图 -->
<div style="position: relative;min-height:240px;"
:style="{'width':DidaHotelImg&&DidaHotelImg.length>0?'40%':'100%'}">
<div style="height:100%;min-height:215px;width:100%" id="mapContainer" class="rounded-borders"></div>
</div>
<!-- 地图 -->
</div>
</div>
<div class="rounded-borders bg-white row items-center q-pb-md" style="margin-top:20px;width: 1300px;">
<el-form class="iis_info_box clearfix" label-width="60px" style="display: block;width: 100%;">
<el-row>
<el-col :span="5" :gutter="35">
<el-form-item :label="$t('pub.date')">
<el-date-picker
size="small"
v-model="dateList"
type="daterange"
value-format="yyyy-MM-dd"
:picker-options="beforeCheck"
range-separator="-"
start-placeholder="入住时间"
end-placeholder="退房时间">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="2" :gutter="35" >
<el-form-item label="客房数" >
<el-select size="small" v-model="room" placeholder="请选择客房数" @change="getRoomList" style="width:70px;bolder:1px solid #DCDFE6;border-radius:4px;">
<el-option
v-for="item in roomList"
:key="item.Id"
:label="item.Id"
:value="item.Id">
</el-option>
</el-select>
</el-form-item>
</el-form-item>
</el-col>
<el-col :span="3" :gutter="35" style="margin-left:3%;margin-top:4px;">
<el-popover
class=""
style="z-index: 0; box-shadow: 0 0 50px #ddd !important"
placement="right"
trigger="click">
<el-card class="" style="max-width: 1222px;display: flex;">
<div
class="q-mr-md"
v-for="(item, index) in msg.searchroomGroup"
:key="index"
style="min-width: 150px; display: inline-block;line-height:35px;"
:style="index>3?'margin-top:20px;':''"
>
<div class="">
客房{{ index + 1 }}
</div>
<div class="">
<div class="">
成人
</div>
<el-select v-model="item.numberOfAdults" placeholder="请选择成人数" @change="setPeopleNum()">
<el-option
v-for="item in adultList"
:key="item.Id"
:label="item.Id"
:value="item.Id">
</el-option>
</el-select>
</div>
<div class="">
<div class="">
儿童
</div>
<el-select v-model="item.numberOfChildren" placeholder="请选择儿童数" @change="setPeopleNum()">
<el-option
v-for="item in childrenList"
:key="item.Id"
:label="item.Id"
:value="item.Id">
</el-option>
</el-select>
</div>
<div class="">
<div class="">
儿童年龄
</div>
<el-select v-model="item.ChildAgeDetails" placeholder="请选择儿童年龄">
<el-option
v-for="item in childrenAgeList"
:key="item.Id"
:label="item.Id"
:value="item.Id">
</el-option>
</el-select>
</div>
</div> </div>
</el-card> </div>
<el-button size="small"
unelevated
class="bg-white hover q-px-xs q-py-sm q-ml-xs text-grey-6"
icon="person" <!-- 地图 -->
slot="reference" <div style="position: relative;min-height:240px;"
> :style="{'width':DidaHotelImg&&DidaHotelImg.length>0?'40%':'100%'}">
<div class="text-dark q-ml-xs"> <div style="height:100%;min-height:215px;width:100%" id="mapContainer" class="rounded-borders"></div>
{{ auditNum }}成人 </div>
<span class="q-px-sm">.</span> <!-- 地图 -->
<template v-if="childNum > 0">{{ childNum }}</template> </div>
儿童 </div>
</div>
</el-button> <div class="rounded-borders bg-white row items-center q-pb-md" style="margin-top:20px;width: 1300px;">
</el-popover>
</el-col> <el-form class="iis_info_box clearfix" label-width="60px" style="display: block;width: 100%;">
<el-col :span="4" :gutter="35" style="margin-top:7px;"> <el-row>
<div style="color:red;">超过13岁视为成人处理</div> <el-col :span="5" :gutter="35">
<el-form-item :label="$t('pub.date')">
<el-date-picker size="small" v-model="dateList" type="daterange" value-format="yyyy-MM-dd"
:picker-options="beforeCheck" range-separator="-" start-placeholder="入住时间" end-placeholder="退房时间">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="2" :gutter="35">
<el-form-item label="客房数">
<el-select size="small" v-model="room" placeholder="请选择客房数" @change="getRoomList"
style="width:70px;bolder:1px solid #DCDFE6;border-radius:4px;">
<el-option v-for="item in roomList" :key="item.Id" :label="item.Id" :value="item.Id">
</el-option>
</el-select>
</el-form-item>
</el-form-item>
</el-col>
<el-col :span="3" :gutter="35" style="margin-left:3%;margin-top:4px;">
<el-popover class="" style="z-index: 0; box-shadow: 0 0 50px #ddd !important" placement="right"
trigger="click">
<el-card class="" style="max-width: 1222px;display: flex;">
<div class="q-mr-md" v-for="(item, index) in msg.searchroomGroup" :key="index"
style="min-width: 150px; display: inline-block;line-height:35px;"
:style="index>3?'margin-top:20px;':''">
<div class="">
客房{{ index + 1 }}
</div>
<div class="">
<div class="">
成人
</div>
<el-select v-model="item.numberOfAdults" placeholder="请选择成人数" @change="setPeopleNum()">
<el-option v-for="item in adultList" :key="item.Id" :label="item.Id" :value="item.Id">
</el-option>
</el-select>
</div>
<div class="">
<div class="">
儿童
</div>
<el-select v-model="item.numberOfChildren" placeholder="请选择儿童数" @change="setPeopleNum()">
<el-option v-for="item in childrenList" :key="item.Id" :label="item.Id" :value="item.Id">
</el-option>
</el-select>
</div>
<div class="">
<div class="">
儿童年龄
</div>
<el-select v-model="item.ChildAgeDetails" placeholder="请选择儿童年龄">
<el-option v-for="item in childrenAgeList" :key="item.Id" :label="item.Id" :value="item.Id">
</el-option>
</el-select>
</div>
</div>
</el-card>
<el-button size="small" unelevated class="bg-white hover q-px-xs q-py-sm q-ml-xs text-grey-6"
icon="person" slot="reference">
<div class="text-dark q-ml-xs">
{{ auditNum }}成人
<span class="q-px-sm">.</span>
<template v-if="childNum > 0">{{ childNum }}</template>
儿童
</div>
</el-button>
</el-popover>
</el-col>
<el-col :span="4" :gutter="35" style="margin-top:7px;">
<div style="color:red;">超过13岁视为成人处理</div>
</el-col> </el-col>
<el-col :span="2" :gutter="35" style="margin-left:-4%;margin-top:7px;float:right;"> <el-col :span="2" :gutter="35" style="margin-left:-4%;margin-top:7px;float:right;">
<el-button type="primary" size="small" plain @click="getDiDaPriceSearchList()" :loading="loading">检索</el-button> <el-button type="primary" size="small" plain @click="getDiDaPriceSearchList()" :loading="loading">检索
</el-button>
</el-col> </el-col>
</el-row> </el-row>
</el-form> </el-form>
</div> </div>
<div class="row q-px-lg q-mb-lg row justify-between q-pa-mdlr text-333" style="width:100%;"> <div class="row q-px-lg q-mb-lg row justify-between q-pa-mdlr text-333" style="width:100%;">
<div style="width:100%;background:#e1f5fe!important;font-weight:700;border-radius:4px;height:53px;display:flex;padding-left:10px; align-items: center;">符合条件的房型</div> <div
</div> style="width:100%;background:#e1f5fe!important;font-weight:700;border-radius:4px;height:53px;display:flex;padding-left:10px; align-items: center;">
符合条件的房型</div>
</div>
<!-- 价格信息循环开始 --> <!-- 价格信息循环开始 -->
<!-- {{DidaHotelRoomDetails }} {{DidaHotelRoomDetails.HotelList}} {{DidaHotelRoomDetails.HotelList.length}} {{DidaHotelRoomDetails.HotelList[0].GroupRatePlanList}} {{DidaHotelRoomDetails.HotelList[0].GroupRatePlanList.length}} --> <!-- {{DidaHotelRoomDetails }} {{DidaHotelRoomDetails.HotelList}} {{DidaHotelRoomDetails.HotelList.length}} {{DidaHotelRoomDetails.HotelList[0].GroupRatePlanList}} {{DidaHotelRoomDetails.HotelList[0].GroupRatePlanList.length}} -->
<div class="q-my-md q-px-lg listBox" style="width:100%;" > <div class="q-my-md q-px-lg listBox" style="width:100%;">
<div class="q-card row " style="border:1px solid #dedede; box-shadow:none;border-radius:4px 4px 0px 0px; background-color: #f1f1f1;"> <div class="q-card row "
<div class="col q-pa-sm q-pr-lg col-3 row no-wrap justify-between" style="border-right: 1px solid rgb(238, 238, 238);width:15%;height:auto;"> style="border:1px solid #dedede; box-shadow:none;border-radius:4px 4px 0px 0px; background-color: #f1f1f1;">
<div class="col q-pa-sm q-pr-lg col-3 row no-wrap justify-between"
<span class="text-grey-6 q-px-sm" style="margin-top:4px;">全部房型</span> style="border-right: 1px solid rgb(238, 238, 238);width:15%;height:auto;">
</div>
<span class="text-grey-6 q-px-sm" style="margin-top:4px;">全部房型</span>
</div>
<div class="col" style="width:85%;" > <div class="col" style="width:85%;">
<div > <div>
<div class="relative-position" style="clear:both; position:relative;height:auto;"><!----> <div class="relative-position" style="clear:both; position:relative;height:auto;">
<!---->
<div class="col q-ml-lg q-pt-lg q-pb-md "> <div class="col q-ml-lg q-pt-lg q-pb-md ">
<div class="col row items-center no-wrap"> <div class="col row items-center no-wrap">
<div class="col-2 text-grey-6" style="line-height: 30px;height: 30px;height: auto; width:21%;" > <div class="col-2 text-grey-6" style="line-height: 30px;height: 30px;height: auto; width:21%;">
</div> </div>
<div class="col-2 text-grey-6" style="line-height: 30px;height: 30px;height: auto; width:21%;" > <div class="col-2 text-grey-6" style="line-height: 30px;height: 30px;height: auto; width:21%;">
<span class="text-grey-6 " style="margin-top:4px;">床型/餐型 <span class="text-grey-6 " style="margin-top:4px;">床型/餐型
<el-popover placement="top" trigger="hover" content="如遇房型名称、与床型、餐型信息不一致，请以此为准。"> <el-popover placement="top" trigger="hover" content="如遇房型名称、与床型、餐型信息不一致，请以此为准。">
<i class="el-icon-question" slot="reference"></i> <i class="el-icon-question" slot="reference"></i>
</el-popover> </el-popover>
</span> </span>
</div> </div>
<div class="col-2 text-grey-6" style="line-height: 30px;height: 30px;height: auto; width:26%;" > <div class="col-2 text-grey-6" style="line-height: 30px;height: 30px;height: auto; width:26%;">
<span class="text-grey-6 " style="margin-top:4px;">政策</span> <span class="text-grey-6 " style="margin-top:4px;">政策</span>
</div> </div>
<div class="col-2 text-grey-6" style="line-height: 30px;height: 30px;height: auto; width:22%;" > <div class="col-2 text-grey-6" style="line-height: 30px;height: 30px;height: auto; width:22%;">
<span class="text-grey-6 " style="margin-top:4px;">价格/间/夜</span> <span class="text-grey-6 " style="margin-top:4px;">价格/间/夜</span>
</div> </div>
<div class="row no-wrap justify-end items-center" style="line-height: 30px;height: 30px;height: auto;width:10%; " > <div class="row no-wrap justify-end items-center"
style="line-height: 30px;height: 30px;height: auto;width:10%; ">
<span class="text-grey-6 " style="margin-top:4px;">预订</span>
<span class="text-grey-6 " style="margin-top:4px;">预订</span>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div>
</div> </div>
</div> </div>
<template v-if="DidaHotelRoomDetails&&DidaHotelRoomDetails.HotelList&&DidaHotelRoomDetails.HotelList.length>0&&DidaHotelRoomDetails.HotelList[0].GroupRoomTypeList&&DidaHotelRoomDetails.HotelList[0].GroupRoomTypeList.length>0 " > <template
<div v-loading="loading"> v-if="DidaHotelRoomDetails&&DidaHotelRoomDetails.HotelList&&DidaHotelRoomDetails.HotelList.length>0&&DidaHotelRoomDetails.HotelList[0].GroupRoomTypeList&&DidaHotelRoomDetails.HotelList[0].GroupRoomTypeList.length>0 ">
<div v-loading="loading">
<div class="q-card row q-cardradius " v-for="(item, index) in DidaHotelRoomDetails.HotelList[0].GroupRoomTypeList">
<div class="col q-pa-sm q-pr-lg col-3 row no-wrap justify-between" style="border-right: 1px solid rgb(238, 238, 238);width:15%;height:auto;"> <div class="q-card row q-cardradius "
v-for="(item, index) in DidaHotelRoomDetails.HotelList[0].GroupRoomTypeList">
<div class="col column q-pl-xs"> <div class="col q-pa-sm q-pr-lg col-3 row no-wrap justify-between"
<div class=" q-pt-md q-px-sm text-333"> {{ item.RoomName_CN}}</div> style="border-right: 1px solid rgb(238, 238, 238);width:15%;height:auto;">
<div class=" q-pt-sm q-px-sm text-333"> {{ item.RoomName==item.RoomName_CN?"":item.RoomName}} </div>
<div class="col column q-pl-xs">
<div class=" q-pt-md q-px-sm text-333"> {{ item.RoomName_CN}}</div>
<div class=" q-pt-sm q-px-sm text-333"> {{ item.RoomName==item.RoomName_CN?"":item.RoomName}} </div>
</div>
</div> </div>
</div>
<div class="col " style="width:85%;" > <div class="col " style="width:85%;">
<div v-for="(subItem, subIndex) in item.RatePlanList" <div v-for="(subItem, subIndex) in item.RatePlanList" :key="subIndex"
:key="subIndex" v-show="subIndex < (isShow === index ? item.RatePlanList.length : 3)">
v-show="subIndex < (isShow === index ? item.RatePlanList.length : 3)"> <el-divider v-if="subIndex != 0"></el-divider>
<el-divider v-if="subIndex != 0" ></el-divider> <div class="relative-position hover-effect" style="clear:both; position:relative;height:auto;">
<div class="relative-position hover-effect" style="clear:both; position:relative;height:auto;"><!----> <!---->
<div class="col q-pt-sm row items-center no-wrap"> <div class="col q-pt-sm row items-center no-wrap">
<div class="col-3 q-pl-lg " style="line-height: 30px;height: 30px;padding-top: 30px; height: auto; width: 21%;"> <div class="col-3 q-pl-lg "
<template v-if="subItem.IsOnRequest"><el-popover style="line-height: 30px;height: 30px;padding-top: 30px; height: auto; width: 21%;">
placement="top" <template v-if="subItem.IsOnRequest">
title="" <el-popover placement="top" title="" trigger="hover" content="限时内未确认，系统将为您自动取消订单，并返还您的额度或现金">
trigger="hover" <span slot="reference" class="nd-confirmation">0.5小时内确认</span>
content="限时内未确认，系统将为您自动取消订单，并返还您的额度或现金"> </el-popover>
<span slot="reference" class="nd-confirmation">0.5小时内确认</span> </template>
</el-popover></template> <template v-else><span class="text-333">立即确认</span></template>
<template v-else><span class="text-333">立即确认</span></template>
</div> </div>
<div class="col-2 text-grey-6" style="line-height: 30px;height: 30px;padding-top: 30px;height: auto; width: 21%;" > <div class="col-2 text-grey-6"
<div class=" row q-mb-md" style="box-shadow: none" > style="line-height: 30px;height: 30px;padding-top: 30px;height: auto; width: 21%;">
<div class=" row q-mb-md" style="box-shadow: none">
<div class=" "> <div class=" ">
<span class="text-333"> {{getRoomType(subItem.BedType)}}</span> <span class="text-333"> {{getRoomType(subItem.BedType)}}</span>
<p> <p>
<template v-if="subItem.PriceList&&subItem.PriceList.length>0"> <template v-if="subItem.PriceList&&subItem.PriceList.length>0">
<span :class="subItem.PriceList[0].MealAmount>0?'text-green':'' " > <span :class="subItem.PriceList[0].MealAmount>0?'text-green':'' ">
{{getMealtype(subItem.PriceList[0].MealType)}} {{subItem.PriceList[0].MealAmount>0?('×'+subItem.PriceList[0].MealAmount+'份'):''}} {{getMealtype(subItem.PriceList[0].MealType)}}
</span> {{subItem.PriceList[0].MealAmount>0?('×'+subItem.PriceList[0].MealAmount+'份'):''}}
</template> </span>
</p> </template>
</div> </p>
</div>
</div> </div>
</div> </div>
<div class=" row q-mb-md" style="box-shadow: none;line-height: 30px;height: 30px;padding-top: 30px;width:26%;"> <div class=" row q-mb-md"
<template v-if="subItem.RatePlanCancellationPolicyList && subItem.RatePlanCancellationPolicyList != null"> style="box-shadow: none;line-height: 30px;height: 30px;padding-top: 30px;width:26%;">
<template
<div > v-if="subItem.RatePlanCancellationPolicyList && subItem.RatePlanCancellationPolicyList != null">
<div class="column q-pl-md q-pr-md">
<span class="q-pt-md " v-if="getIsCancella(subItem.RatePlanCancellationPolicyList,subItem.TotalPrice)>0"> <div>
<el-popover <div class="column q-pl-md q-pr-md">
class="CancellationPolicyList" <span class="q-pt-md "
width="400" v-if="getIsCancella(subItem.RatePlanCancellationPolicyList,subItem.TotalPrice)>0">
placement="top" <el-popover class="CancellationPolicyList" width="400" placement="top" trigger="click">
trigger="click"> <div style="display: block; line-height: 30px; height: auto;">
<div style="display: block; line-height: 30px; height: auto;"> <div v-for="( itemCancella, index1 ) in subItem.RatePlanCancellationPolicyList"
<div v-for="( itemCancella, index1 ) in subItem.RatePlanCancellationPolicyList" :key="index1"> :key="index1">
<p v-if="index1==0">{{ getformatDateStr(itemCancella.FromDate) }}之前免费取消;</p> <p v-if="index1==0">{{ getformatDateStr(itemCancella.FromDate) }}之前免费取消;</p>
<div v-if="itemCancella.Amount==subItem.TotalPrice"> <div v-if="itemCancella.Amount==subItem.TotalPrice">
<p>{{ getformatDateStr(itemCancella.FromDate) }}起不可取消，取消将收取订单全额费用;</p> <p>{{ getformatDateStr(itemCancella.FromDate) }}起不可取消，取消将收取订单全额费用;</p>
</div> </div>
<div v-else> <div v-else>
<p>{{ getformatDateStr(itemCancella.FromDate) }} <p>{{ getformatDateStr(itemCancella.FromDate) }}
<span v-if="index1!=(subItem.RatePlanCancellationPolicyList.length-1)">- {{ getformatDateStr(subItem.RatePlanCancellationPolicyList[index1+1].FromDate) }} 之间</span> <span v-if="index1!=(subItem.RatePlanCancellationPolicyList.length-1)">-
取消，收费 {{subItem.Currency}}{{getPrice(itemCancella.Amount)}};</p> {{ getformatDateStr(subItem.RatePlanCancellationPolicyList[index1+1].FromDate) }}
</div> 之间</span>
</div> 取消，收费 {{subItem.Currency}}{{getPrice(itemCancella.Amount)}};</p>
</div>
</div>
</div>
<span slot="reference">
<span class="nd-label_success"
v-if="getIsCancella(subItem.RatePlanCancellationPolicyList,subItem.TotalPrice)==1">限时取消</span>
<span v-else class="nd-label_warning">付费取消</span>
</span>
</el-popover>
<p v-if="getIsCancella(subItem.RatePlanCancellationPolicyList,subItem.TotalPrice)==1">
{{ getformatDateStr(subItem.RatePlanCancellationPolicyList[subItem.RatePlanCancellationPolicyList.length-1].FromDate) }}之前免费取消;
</p>
<p v-else>
{{ getformatDateStr(subItem.RatePlanCancellationPolicyList[subItem.RatePlanCancellationPolicyList.length-1].FromDate) }}前收费{{subItem.Currency}}{{getPrice(subItem.RatePlanCancellationPolicyList[subItem.RatePlanCancellationPolicyList.length>1? subItem.RatePlanCancellationPolicyList.length-2:subItem.RatePlanCancellationPolicyList.length-1].Amount)}};
</p>
</span>
<span v-else class="text-right q-pt-md nd-label_error">不可退改</span>
</div> </div>
<span slot="reference" >
<span class="nd-label_success" v-if="getIsCancella(subItem.RatePlanCancellationPolicyList,subItem.TotalPrice)==1">限时取消</span>
<span v-else class="nd-label_warning">付费取消</span>
</span>
</el-popover>
<p v-if="getIsCancella(subItem.RatePlanCancellationPolicyList,subItem.TotalPrice)==1">{{ getformatDateStr(subItem.RatePlanCancellationPolicyList[subItem.RatePlanCancellationPolicyList.length-1].FromDate) }}之前免费取消;</p>
<p v-else>{{ getformatDateStr(subItem.RatePlanCancellationPolicyList[subItem.RatePlanCancellationPolicyList.length-1].FromDate) }}前收费{{subItem.Currency}}{{getPrice(subItem.RatePlanCancellationPolicyList[subItem.RatePlanCancellationPolicyList.length>1? subItem.RatePlanCancellationPolicyList.length-2:subItem.RatePlanCancellationPolicyList.length-1].Amount)}}; </p>
</span>
<span v-else class="text-right q-pt-md nd-label_error">不可退改</span>
</div> </div>
</div>
</template>
</template> <template v-else>
<template v-else>
<div class="column q-pl-md q-pr-md"> <div class="column q-pl-md q-pr-md">
<span class="text-right q-pt-md nd-label_error">不可退改</span> <span class="text-right q-pt-md nd-label_error">不可退改</span>
</div> </div>
</template> </template>
</div> </div>
<div class="row no-wrap justify-end items-center " style="line-height: 30px;height: 30px;padding-top: 8px;width:22%;"> <div class="row no-wrap justify-end items-center "
style="line-height: 30px;height: 30px;padding-top: 8px;width:22%;">
<div class="row no-wrap items-center q-pr-lg"> <div class="row no-wrap items-center q-pr-lg">
<div style="cursor: pointer;width:100%;"> <div style="cursor: pointer;width:100%;">
<el-popover <el-popover placement="top" trigger="click">
placement="top" <div v-loading="confirmLoading"
trigger="click" > style="display: block; line-height: 15px;min-height: 150px; height: auto;font-size:12px;text-align:center;"
<div v-loading="confirmLoading" style="display: block; line-height: 15px;min-height: 150px; height: auto;font-size:12px;text-align:center;" class="divPrice" class="divPrice">
> <table class="table-list" cellspacing="0"
<table class="table-list" cellspacing="0" v-if="roomRateDetails&&roomRateDetails.RatePlanList&&roomRateDetails.RatePlanList.length>0"> v-if="roomRateDetails&&roomRateDetails.RatePlanList&&roomRateDetails.RatePlanList.length>0">
<tr style="background-color: #f1f1f1;"> <tr style="background-color: #f1f1f1;">
<td v-for="( itemp, indexp ) in roomRateDetails.RatePlanList[0].PriceList" :key="indexp"> <td v-for="( itemp, indexp ) in roomRateDetails.RatePlanList[0].PriceList"
{{getWeek(itemp.StayDate)}} :key="indexp">
</td> {{getWeek(itemp.StayDate)}}
</td>
</tr>
<tr> </tr>
<td v-for="( itemp, indexp ) in roomRateDetails.RatePlanList[0].PriceList" :key="indexp"><span class="text-red">{{subItem.Currency }} {{getPrice(itemp.Price) }}</span> <tr>
<p class="q-pt-sm"> <td v-for="( itemp, indexp ) in roomRateDetails.RatePlanList[0].PriceList"
<template > :key="indexp"><span class="text-red">{{subItem.Currency }}
<span :class="itemp.MealAmount>0?'text-green':'' " > {{getPrice(itemp.Price) }}</span>
{{getMealtype(itemp.MealType)}} {{itemp.MealAmount>0?('×'+itemp.MealAmount+'份'):''}} <p class="q-pt-sm">
</span> <template>
</template></p> <span :class="itemp.MealAmount>0?'text-green':'' ">
</td> {{getMealtype(itemp.MealType)}}
</tr> {{itemp.MealAmount>0?('×'+itemp.MealAmount+'份'):''}}
<tr style="border:none;"> </span>
<td style="border:none;font-size: 14px;text-align:left;" :colspan="roomRateDetails.RatePlanList[0].PriceList.length">房型: {{item.RoomName_CN.length==0?item.RoomName:item.RoomName_CN}}</td> </template></p>
</tr> </td>
<tr style="border:none;"> </tr>
<td style="border:none;font-size: 14px;text-align:left;" :colspan="roomRateDetails.RatePlanList[0].PriceList.length">床型: {{getRoomType(subItem.BedType)}}</td> <tr style="border:none;">
</tr> <td style="border:none;font-size: 14px;text-align:left;"
<tr style="border:none;"> :colspan="roomRateDetails.RatePlanList[0].PriceList.length">房型:
<td style="border:none;font-size: 14px;text-align:left;" :colspan="roomRateDetails.RatePlanList[0].PriceList.length">每间每晚均价: {{subItem.Currency }}{{getAveragePrice(roomRateDetails.RatePlanList[0].PriceList)}}</td> {{item.RoomName_CN.length==0?item.RoomName:item.RoomName_CN}}</td>
</tr> </tr>
<tr style="border:none;"> <tr style="border:none;">
<td style="border:none;font-size: 14px;text-align:left;" :colspan="roomRateDetails.RatePlanList[0].PriceList.length">总价: <span class="text-red">{{subItem.Currency }} {{getPrice(roomRateDetails.RatePlanList[0].TotalPrice)}}</span> 1间</td> <td style="border:none;font-size: 14px;text-align:left;"
</tr> :colspan="roomRateDetails.RatePlanList[0].PriceList.length">床型:
</table> {{getRoomType(subItem.BedType)}}</td>
</div> </tr>
<span slot="reference" style="border-bottom: 1px dotted #f44336;" @click="getDiDaPriceConfirm(index,subIndex,subItem)"> <tr style="border:none;">
<span class="text-grey-6 text-red" style="font-weight: bold;font-size: 16px;">{{ subItem.Currency }}</span> <td style="border:none;font-size: 14px;text-align:left;"
<span class="fz20 text-red m" style="font-weight: bold;font-size: 18px;"> {{ getPrice(subItem.TotalPrice) }}</span> :colspan="roomRateDetails.RatePlanList[0].PriceList.length">每间每晚均价:
</span> {{subItem.Currency }}{{getAveragePrice(roomRateDetails.RatePlanList[0].PriceList)}}
</el-popover> </td>
</div> </tr>
<div style="font-size:12px !important;"> <tr style="border:none;">
<span class="text-grey-6 " >总价 {{subItem.Currency }}{{getPrice(subItem.TotalPrice)}}</span> <td style="border:none;font-size: 14px;text-align:left;"
</div> :colspan="roomRateDetails.RatePlanList[0].PriceList.length">总价: <span
class="text-red">{{subItem.Currency }}
{{getPrice(roomRateDetails.RatePlanList[0].TotalPrice)}}</span> 1间</td>
</tr>
</table>
</div>
<span slot="reference" style="border-bottom: 1px dotted #f44336;"
@click="getDiDaPriceConfirm(index,subIndex,subItem)">
<span class="text-grey-6 text-red"
style="font-weight: bold;font-size: 16px;">{{ subItem.Currency }}</span>
<span class="fz20 text-red m" style="font-weight: bold;font-size: 18px;">
{{ getPrice(subItem.TotalPrice) }}</span>
</span>
</el-popover>
</div>
<div style="font-size:12px !important;">
<span class="text-grey-6 ">总价 {{subItem.Currency }}{{getPrice(subItem.TotalPrice)}}</span>
</div>
</div> </div>
</div> </div>
<div class="row no-wrap justify-end items-center " style="line-height: 30px;height: 30px;padding-top: 30px;width:10%;"> <div class="row no-wrap justify-end items-center "
<el-button :type="subItem.IsSellOut==0?'primary':'info'" :disabled="subItem.IsSellOut==1 " @click="goUrl('HotelSure',subItem)">立即预订</el-button> style="line-height: 30px;height: 30px;padding-top: 30px;width:10%;">
</div> <el-button :type="subItem.IsSellOut==0?'primary':'info'" :disabled="subItem.IsSellOut==1 "
@click="goUrl('HotelSure',subItem)">立即预订</el-button>
</div>
</div>
</div> </div>
</div>
</div>
<div </div>
class="order-show" style="border-top:1px solid rgb(238, 238, 238);"
@click="showMore(index)" <div class="order-show" style="border-top:1px solid rgb(238, 238, 238);" @click="showMore(index)"
v-if="item.RatePlanList.length > 3" v-if="item.RatePlanList.length > 3">
> <span class="oder-show-content " :class="isShow===index?'el-icon-caret-top':'el-icon-caret-bottom'">{{
<span class="oder-show-content " :class="isShow===index?'el-icon-caret-top':'el-icon-caret-bottom'">{{
isShow === index ? "收起" : ("更多"+(item.RatePlanList.length-3)+"种价格") isShow === index ? "收起" : ("更多"+(item.RatePlanList.length-3)+"种价格")
}}</span> }}</span>
</div> </div>
</div> </div>
</div>
</div> </div>
</template>
<template v-else>
<div class="q-my-md q-px-lg" style="text-align:center;margin-top:15px;">暂无数据</div>
</template>
</div> </div>
</template>
<template v-else>
<div class="q-my-md q-px-lg" style="text-align:center;margin-top:15px;">暂无数据</div>
</template>
</div>
<!-- 价格循环结束 --> <!-- 价格循环结束 -->
<div class="rounded-borders bg-white row items-center q-pb-md" style="margin-top:20px;width: 1300px;"> <div class="rounded-borders bg-white row items-center q-pb-md" style="margin-top:20px;width: 1300px;">
<div class="row q-px-lg q-mb-lg row justify-between " style="width:100%;"> <div class="row q-px-lg q-mb-lg row justify-between " style="width:100%;">
<el-card style="width:100%;"> <el-card style="width:100%;">
<div style=" border-bottom: 1px solid #ddd; width:100%;padding-bottom:8px;font-size:16px;" class="text-weight-bold"><b>酒店详情</b></div> <div style=" border-bottom: 1px solid #ddd; width:100%;padding-bottom:8px;font-size:16px;"
<template v-if="DidaDescription&&DidaDescription.length>0"> class="text-weight-bold"><b>酒店详情</b></div>
<div class="q-pt-sm q-px-lg12 PolicyDiv DidaDescriptionDiv" v-for="(itemDe, indexDe) in DidaDescription" style="line-height:27px;" v-html="itemDe.HotelDescription_CN"> <template v-if="DidaDescription&&DidaDescription.length>0">
</div> <div class="q-pt-sm q-px-lg12 PolicyDiv DidaDescriptionDiv" v-for="(itemDe, indexDe) in DidaDescription"
</template> style="line-height:27px;" v-html="itemDe.HotelDescription_CN">
<template v-else> </div>
<div class="q-my-md q-px-lg" style="text-align:center;margin-top:15px;">暂无数据</div> </template>
</template> <template v-else>
</el-card> <div class="q-my-md q-px-lg" style="text-align:center;margin-top:15px;">暂无数据</div>
</template>
</el-card>
</div> </div>
</div> </div>
<div class="rounded-borders bg-white row items-center q-pb-md" style="width: 1300px;"> <div class="rounded-borders bg-white row items-center q-pb-md" style="width: 1300px;">
<div class="row q-px-lg q-mb-lg row justify-between " style="width:100%;"> <div class="row q-px-lg q-mb-lg row justify-between " style="width:100%;">
<el-card style="width:100%;"> <el-card style="width:100%;">
<div style="border-bottom: 1px solid #ddd; width:100%;padding-bottom:8px;font-size:16px;" class="text-weight-bold"><b>酒店政策</b></div> <div style="border-bottom: 1px solid #ddd; width:100%;padding-bottom:8px;font-size:16px;"
<template v-if="Policy&&Policy.length>0"> class="text-weight-bold"><b>酒店政策</b></div>
<div v-for="(itemp, indexp) in Policy" style="width:100%;" class="q-px-lg12" > <template v-if="Policy&&Policy.length>0">
<div v-if="itemp.Type=='CheckInOut'" style="margin-top:15px;"> <div v-for="(itemp, indexp) in Policy" style="width:100%;" class="q-px-lg12">
<el-timeline> <div v-if="itemp.Type=='CheckInOut'" style="margin-top:15px;">
<el-timeline-item <el-timeline>
v-for="(itempo, indexpo) in itemp.List" <el-timeline-item v-for="(itempo, indexpo) in itemp.List" :key="indexpo" color="#33B3FF">
:key="indexpo" <div v-html="itempo.Description_CN" style="line-height:27px;"></div>
color="#33B3FF" </el-timeline-item>
> </el-timeline>
<div v-html="itempo.Description_CN" style="line-height:27px;"></div> </div>
</el-timeline-item> <template v-else>
</el-timeline> <div class="q-pt-sm PolicyDiv" :style="indexp==1?'':'margin-top:15px'"
</div> v-if="itempo.Description_CN&&itempo.Description_CN.length>0" v-for="(itempo, indexpo) in itemp.List"
v-html="itempo.Description_CN"> </div>
</template>
</div>
</template>
<template v-else> <template v-else>
<div class="q-pt-sm PolicyDiv" :style="indexp==1?'':'margin-top:15px'" v-if="itempo.Description_CN&&itempo.Description_CN.length>0" v-for="(itempo, indexpo) in itemp.List" v-html="itempo.Description_CN"> </div> <div class="q-my-md q-px-lg" style="text-align:center;margin-top:15px;">暂无数据</div>
</template> </template>
</div> </el-card>
</template>
<template v-else>
<div class="q-my-md q-px-lg" style="text-align:center;margin-top:15px;">暂无数据</div>
</template>
</el-card>
</div> </div>
</div> </div>
<div class="rounded-borders bg-white row items-center q-pb-md" style="width: 1300px;"> <div class="rounded-borders bg-white row items-center q-pb-md" style="width: 1300px;">
<div class="row q-px-lg q-mb-lg row justify-between " style="width:100%;"> <div class="row q-px-lg q-mb-lg row justify-between " style="width:100%;">
<el-card style="width:100%;padding-bottom:20px;"> <el-card style="width:100%;padding-bottom:20px;">
<div style=" border-bottom: 1px solid #ddd; width:100%;padding-bottom:8px;font-size:16px;" class="text-weight-bold"><b>酒店设施</b></div> <div style=" border-bottom: 1px solid #ddd; width:100%;padding-bottom:8px;font-size:16px;"
<template v-if="Facilities&&Facilities.length>0"> class="text-weight-bold"><b>酒店设施</b></div>
<div class="q-pt-sm q-px-lg12 Facilities" v-for="(itemf, indexf) in Facilities" v-if="itemf.Description_CN&&itemf.Description_CN.length>0" style="line-height:27px;" > <template v-if="Facilities&&Facilities.length>0">
<el-tooltip :content="itemf.Description_CN" placement="bottom" effect="light"> <div class="q-pt-sm q-px-lg12 Facilities" v-for="(itemf, indexf) in Facilities"
<span >{{itemf.Description_CN}}</span> v-if="itemf.Description_CN&&itemf.Description_CN.length>0" style="line-height:27px;">
</el-tooltip> <el-tooltip :content="itemf.Description_CN" placement="bottom" effect="light">
</div> <span>{{itemf.Description_CN}}</span>
</template> </el-tooltip>
<template v-else> </div>
<div class="q-my-md q-px-lg" style="text-align:center;margin-top:15px;">暂无数据</div> </template>
</template> <template v-else>
</el-card> <div class="q-my-md q-px-lg" style="text-align:center;margin-top:15px;">暂无数据</div>
</template>
</el-card>
</div> </div>
</div> </div>
<div class="rounded-borders bg-white row items-center q-pb-md" style="width: 1300px;"> <div class="rounded-borders bg-white row items-center q-pb-md" style="width: 1300px;">
<div class="row q-px-lg q-mb-lg row justify-between " style="width:100%;"> <div class="row q-px-lg q-mb-lg row justify-between " style="width:100%;">
<el-card style="width:100%;padding-bottom:20px;"> <el-card style="width:100%;padding-bottom:20px;">
<div style=" border-bottom: 1px solid #ddd; width:100%;padding-bottom:8px;font-size:16px;" class="text-weight-bold"><b>房间设施</b><span class="hotel-info-section__warning">酒店的全部客房设施信息仅供参考，可能与您入住的房型不同而略有差异，请知晓</span></div> <div style=" border-bottom: 1px solid #ddd; width:100%;padding-bottom:8px;font-size:16px;"
<template v-if="RoomFacilities&&RoomFacilities.length>0"> class="text-weight-bold"><b>房间设施</b><span
<div class="q-pt-sm q-px-lg12 Facilities" v-for="(itemf, indexf) in RoomFacilities" v-if="itemf.Description_CN&&itemf.Description_CN.length>0" style="line-height:27px;" > class="hotel-info-section__warning">酒店的全部客房设施信息仅供参考，可能与您入住的房型不同而略有差异，请知晓</span></div>
<el-tooltip :content="itemf.Description_CN" placement="bottom" effect="light"> <template v-if="RoomFacilities&&RoomFacilities.length>0">
<span >{{itemf.Description_CN}}</span> <div class="q-pt-sm q-px-lg12 Facilities" v-for="(itemf, indexf) in RoomFacilities"
</el-tooltip> v-if="itemf.Description_CN&&itemf.Description_CN.length>0" style="line-height:27px;">
</div> <el-tooltip :content="itemf.Description_CN" placement="bottom" effect="light">
</template> <span>{{itemf.Description_CN}}</span>
<template v-else> </el-tooltip>
<div class="q-my-md q-px-lg" style="text-align:center;margin-top:15px;">暂无数据</div> </div>
</template> </template>
</el-card> <template v-else>
<div class="q-my-md q-px-lg" style="text-align:center;margin-top:15px;">暂无数据</div>
</template>
</el-card>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
data() { data() {
return { return {
startNum:0, startNum: 0,
isShow: "", isShow: "",
EmployeeId: 0, EmployeeId: 0,
RB_Group_Id:'', RB_Group_Id: '',
companyList:[], companyList: [],
confirmPriceList:[], confirmPriceList: [],
roomRateDetails:[], roomRateDetails: [],
confirmLoading:false, confirmLoading: false,
dateList:[], dateList: [],
canHide: false, //更多筛选 canHide: false, //更多筛选
theRooms: [] , //客房下拉 theRooms: [], //客房下拉
room: 1, //客房数 room: 1, //客房数
auditNum: 2, auditNum: 2,
childNum: 0 , childNum: 0,
adultList: [] , //成人下拉 adultList: [], //成人下拉
childrenList: [] , //儿童下拉 childrenList: [], //儿童下拉
childrenAgeList: [] , //儿童年龄下拉 childrenAgeList: [], //儿童年龄下拉
isShowPop: false, //房间 isShowPop: false, //房间
SimilarList: [] , SimilarList: [],
RoomTypeList: [] , //房间等级 RoomTypeList: [], //房间等级
HotelRoomTypes: [] , //散客房间类型 HotelRoomTypes: [], //散客房间类型
ScatMeaList: [] , //散客房间餐型 ScatMeaList: [], //散客房间餐型
HotelMealTypes:[],//餐食类型 HotelMealTypes: [], //餐食类型
DidaHotelDetails:{}, DidaHotelDetails: {},
DidaDescription:[],//酒店简介 DidaDescription: [], //酒店简介
Facilities:[],//酒店设施 Facilities: [], //酒店设施
RoomFacilities:[],//房间设施 RoomFacilities: [], //房间设施
Policy:[],//酒店政策 Policy: [], //酒店政策
DidaHotelImg:[], DidaHotelImg: [],
WeekList: ["周日", "周一", "周二", "周三", "周四", "周五", "周六"], //周一至周日 WeekList: ["周日", "周一", "周二", "周三", "周四", "周五", "周六"], //周一至周日
checkInWeek: "", //周一至周日 checkInWeek: "", //周一至周日
DidaHotelRoomDetails:{}, DidaHotelRoomDetails: {},
msg: { msg: {
hotelId:0, hotelId: 0,
sort:0, sort: 0,
displayFrom:1, displayFrom: 1,
CheckOutDate:"", CheckOutDate: "",
roomOptionCd:"", roomOptionCd: "",
CheckInDate:"", CheckInDate: "",
searchroomGroup:[ searchroomGroup: [{
{roomNum:1,numberOfAdults:2,numberOfChildren:0, ChildAgeDetails:""} roomNum: 1,
], numberOfAdults: 2,
auditNum:2, numberOfChildren: 0,
childNum:0, ChildAgeDetails: ""
}, }],
hotelMsg:{ auditNum: 2,
hotelId:0, childNum: 0,
hotelImageSize:5, },
photoGalleryGetFlg:1, hotelMsg: {
groupBookingFlg:1, hotelId: 0,
}, hotelImageSize: 5,
dataList: [], photoGalleryGetFlg: 1,
roomList:[{Id:1},{Id:2},{Id:3},{Id:4},{Id:5},{Id:6},{Id:7},{Id:8},{Id:9},{Id:10}], groupBookingFlg: 1,
loading: false, },
beforeCheck: { dataList: [],
roomList: [{
Id: 1
}, {
Id: 2
}, {
Id: 3
}, {
Id: 4
}, {
Id: 5
}, {
Id: 6
}, {
Id: 7
}, {
Id: 8
}, {
Id: 9
}, {
Id: 10
}],
loading: false,
beforeCheck: {
disabledDate: time => { disabledDate: time => {
if (this.msg.CheckInDate) { if (this.msg.CheckInDate) {
let endTime = new Date(this.getBeforeDate(-7, new Date().Format("yyyy-MM-dd"))); let endTime = new Date(this.getBeforeDate(-7, new Date().Format("yyyy-MM-dd")));
...@@ -1021,22 +1171,38 @@ export default { ...@@ -1021,22 +1171,38 @@ export default {
} }
} }
} }
}; };
}, },
methods: { methods: {
goUrl(url,row) { goUrl(url, row) {
if(this.dateList&&this.dateList.length>0){ if (this.dateList && this.dateList.length > 0) {
this.msg.CheckInDate=this.dateList[0]; this.msg.CheckInDate = this.dateList[0];
this.msg.CheckOutDate=this.dateList[1]; this.msg.CheckOutDate = this.dateList[1];
} } else {
else{ this.msg.CheckInDate = '';
this.msg.CheckInDate=''; this.msg.CheckOutDate = '';
this.msg.CheckOutDate=''; }
} this.$router.push({
this.$router.push({ name:url,query:{"tel":this.DidaHotelDetails.Telephone,"HotelName":this.DidaHotelDetails.Name_CN,"Address":this.DidaHotelDetails.Address_CN ,"RatePlanID":row.RatePlanID,"hotelId":this.msg.hotelId,"room":this.room,"auditNum":this.auditNum,"searchroomGroup":encodeURIComponent(JSON.stringify(this.msg.searchroomGroup)),"StartDate": this.msg.CheckInDate,"EndDate":this.msg.CheckOutDate,"childNum":this.childNum,blank:'y',tab:'道旅酒店预定'}}) name: url,
query: {
"tel": this.DidaHotelDetails.Telephone,
"HotelName": this.DidaHotelDetails.Name_CN,
"Address": this.DidaHotelDetails.Address_CN,
"RatePlanID": row.RatePlanID,
"hotelId": this.msg.hotelId,
"room": this.room,
"auditNum": this.auditNum,
"searchroomGroup": encodeURIComponent(JSON.stringify(this.msg.searchroomGroup)),
"StartDate": this.msg.CheckInDate,
"EndDate": this.msg.CheckOutDate,
"childNum": this.childNum,
blank: 'y',
tab: '道旅酒店预定'
}
})
}, },
//设置房间里面成人数改变总成人数和儿童数 //设置房间里面成人数改变总成人数和儿童数
setPeopleNum() { setPeopleNum() {
this.auditNum = 0; this.auditNum = 0;
this.childNum = 0; this.childNum = 0;
this.msg.searchroomGroup.forEach((x) => { this.msg.searchroomGroup.forEach((x) => {
...@@ -1053,8 +1219,8 @@ export default { ...@@ -1053,8 +1219,8 @@ export default {
this.childNum = 1; this.childNum = 1;
} }
}, },
getRoomList() { getRoomList() {
let roomNum = this.room let roomNum = this.room
this.auditNum = 0; this.auditNum = 0;
this.childNum = 0; this.childNum = 0;
let length = this.msg.searchroomGroup.length; let length = this.msg.searchroomGroup.length;
...@@ -1083,59 +1249,59 @@ export default { ...@@ -1083,59 +1249,59 @@ export default {
this.msg.auditNum = this.auditNum; this.msg.auditNum = this.auditNum;
this.msg.childNum = this.childNum; this.msg.childNum = this.childNum;
}, },
getDidaHotelDetails: function () { getDidaHotelDetails: function () {
this.loading = true this.loading = true
this.apipost('dmc_post_GetDidaHotelDetails', this.hotelMsg, res=>{ this.apipost('dmc_post_GetDidaHotelDetails', this.hotelMsg, res => {
this.loading = false this.loading = false
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
this.DidaHotelDetails = res.data.data this.DidaHotelDetails = res.data.data
this.initMap(this.DidaHotelDetails.Longitude, this.DidaHotelDetails.Latitude, this.DidaHotelDetails.Name_CN) this.initMap(this.DidaHotelDetails.Longitude, this.DidaHotelDetails.Latitude, this.DidaHotelDetails
if(this.DidaHotelDetails.StarRating){ .Name_CN)
this.startNum= Math.ceil(this.DidaHotelDetails.StarRating); if (this.DidaHotelDetails.StarRating) {
this.startNum = Math.ceil(this.DidaHotelDetails.StarRating);
}
} }
}, null)
},
getDiDaPriceSearchList() {
this.loading = true
if (this.dateList && this.dateList.length > 0) {
this.msg.CheckInDate = this.dateList[0];
this.msg.CheckOutDate = this.dateList[1];
} else {
this.msg.CheckInDate = '';
this.msg.CheckOutDate = '';
} }
}, null) this.apipost('dmc_post_GetDiDaPriceSearchList', this.msg, res => {
}, this.loading = false
getDiDaPriceSearchList() { if (res.data.resultCode == 1) {
this.loading = true this.DidaHotelRoomDetails = res.data.data
if(this.dateList&&this.dateList.length>0){
this.msg.CheckInDate=this.dateList[0]; console.log(" this.msg", this.msg);
this.msg.CheckOutDate=this.dateList[1]; console.log("DidaHotelRoomDetails", res.data.data);
} }
else{ }, null)
this.msg.CheckInDate=''; },
this.msg.CheckOutDate=''; //获取道旅床类型列表
} getdidaBedType() {
this.apipost('dmc_post_GetDiDaPriceSearchList', this.msg, res=>{ this.apipost('dmc_post_GetDidaBedTypeBaseInfo', this.hotelMsg, res => {
this.loading = false this.loading = false
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
this.DidaHotelRoomDetails = res.data.data this.HotelRoomTypes = res.data.data;
}
console.log(" this.msg", this.msg); }, null)
console.log("DidaHotelRoomDetails", res.data.data );
}
}, null)
},
//获取道旅床类型列表
getdidaBedType() {
this.apipost('dmc_post_GetDidaBedTypeBaseInfo', this.hotelMsg, res=>{
this.loading = false
if (res.data.resultCode == 1) {
this.HotelRoomTypes = res.data.data;
}
}, null)
}, },
//获取道旅餐食类型 //获取道旅餐食类型
getdidaMealType() { getdidaMealType() {
this.apipost('dmc_post_GetDidaMealType', this.hotelMsg, res=>{ this.apipost('dmc_post_GetDidaMealType', this.hotelMsg, res => {
this.loading = false this.loading = false
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
this.HotelMealTypes = res.data.data; this.HotelMealTypes = res.data.data;
} }
}, null) }, null)
}, },
//获取房型 //获取房型
getRoomType(roomtypeId) { getRoomType(roomtypeId) {
let roomtypeName = ""; let roomtypeName = "";
if (roomtypeId > 0) { if (roomtypeId > 0) {
this.HotelRoomTypes.forEach((item) => { this.HotelRoomTypes.forEach((item) => {
...@@ -1147,8 +1313,8 @@ export default { ...@@ -1147,8 +1313,8 @@ export default {
return roomtypeName; return roomtypeName;
}, },
//获取餐型 //获取餐型
getMealtype(mealtypeId) { getMealtype(mealtypeId) {
let mealtypeName = ""; let mealtypeName = "";
if (mealtypeId > 0) { if (mealtypeId > 0) {
this.HotelMealTypes.forEach((item) => { this.HotelMealTypes.forEach((item) => {
...@@ -1159,108 +1325,107 @@ export default { ...@@ -1159,108 +1325,107 @@ export default {
} }
return mealtypeName; return mealtypeName;
}, },
//获取酒店图片信息 //获取酒店图片信息
getDiDaHotelImgList() { getDiDaHotelImgList() {
this.apipost('dmc_post_GetDiDaHotelImgList', this.hotelMsg, res=>{ this.apipost('dmc_post_GetDiDaHotelImgList', this.hotelMsg, res => {
this.loading = false this.loading = false
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
this.DidaHotelImg=[]; this.DidaHotelImg = [];
res.data.data.forEach((item,index) => { res.data.data.forEach((item, index) => {
this.DidaHotelImg.push(item.ImageUrl); this.DidaHotelImg.push(item.ImageUrl);
}); });
// this.DidaHotelImg = res.data.data; // this.DidaHotelImg = res.data.data;
} }
}, null) }, null)
}, },
//获取酒店详情信息 //获取酒店详情信息
getDidaDescriptionList() { getDidaDescriptionList() {
this.apipost('dmc_post_GetDidaDescriptionList', this.hotelMsg, res=>{ this.apipost('dmc_post_GetDidaDescriptionList', this.hotelMsg, res => {
this.loading = false this.loading = false
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
this.DidaDescription = res.data.data; this.DidaDescription = res.data.data;
} }
}, null) }, null)
}, },
//获取酒店设施信息 //获取酒店设施信息
getDidaFacilitiesList() { getDidaFacilitiesList() {
this.apipost('dmc_post_GetDiDaHotelFacilitiesList', this.hotelMsg, res=>{ this.apipost('dmc_post_GetDiDaHotelFacilitiesList', this.hotelMsg, res => {
this.loading = false this.loading = false
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
this.Facilities = res.data.data.HotelFacility; this.Facilities = res.data.data.HotelFacility;
this.RoomFacilities = res.data.data.RoomFacility; this.RoomFacilities = res.data.data.RoomFacility;
} }
}, null) }, null)
}, },
//获取酒店政策信息 //获取酒店政策信息
getDidaPolicyList() { getDidaPolicyList() {
this.apipost('dmc_post_GetDiDaHotelPolicyList', this.hotelMsg, res=>{ this.apipost('dmc_post_GetDiDaHotelPolicyList', this.hotelMsg, res => {
this.loading = false this.loading = false
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
this.Policy = res.data.data; this.Policy = res.data.data;
} }
}, null) }, null)
}, },
//日期格式化 //日期格式化
getformatDateStr(value) { getformatDateStr(value) {
var dt = new Date(value); var dt = new Date(value);
let year = dt.getFullYear(); let year = dt.getFullYear();
let month = (dt.getMonth() + 1).toString().padStart(2, "0"); let month = (dt.getMonth() + 1).toString().padStart(2, "0");
let date = (dt.getDate() ).toString().padStart(2, "0"); let date = (dt.getDate()).toString().padStart(2, "0");
let hours =(dt.getHours() ).toString().padStart(2, "0"); let hours = (dt.getHours()).toString().padStart(2, "0");
let minutes = (dt.getMinutes() ).toString().padStart(2, "0"); let minutes = (dt.getMinutes()).toString().padStart(2, "0");
let seconds = (dt.getSeconds() ).toString().padStart(2, "0"); let seconds = (dt.getSeconds()).toString().padStart(2, "0");
return year + "-" + month + "-" + date+" "+hours+":"+minutes+":"+seconds; return year + "-" + month + "-" + date + " " + hours + ":" + minutes + ":" + seconds;
}, },
//通过日期得到周几 //通过日期得到周几
getWeek(dateTime) { getWeek(dateTime) {
let dt = new Date(dateTime); let dt = new Date(dateTime);
let year = dt.getFullYear(); let year = dt.getFullYear();
let month = (dt.getMonth() + 1).toString().padStart(2, "0"); let month = (dt.getMonth() + 1).toString().padStart(2, "0");
let date = (dt.getDate() + 1).toString().padStart(2, "0"); let date = (dt.getDate() + 1).toString().padStart(2, "0");
return month + "-" + date +"("+this.WeekList[dt.getDay()]+")"; return month + "-" + date + "(" + this.WeekList[dt.getDay()] + ")";
}, },
//日期格式化 //日期格式化
getIsCancella1(value) { getIsCancella1(value) {
var dt = new Date(value);//取消时间 var dt = new Date(value); //取消时间
let date2 = new Date();//当前时间 let date2 = new Date(); //当前时间
let IsCancel=0;//不可取消 let IsCancel = 0; //不可取消
if (dt > date2) { if (dt > date2) {
IsCancel=1; IsCancel = 1;
} }
return IsCancel; return IsCancel;
}, },
//日期格式化 //日期格式化
getIsCancella(RatePlanCancellationPolicyList,TotalPrice) { getIsCancella(RatePlanCancellationPolicyList, TotalPrice) {
let IsCancel=0;//不可取消 let IsCancel = 0; //不可取消
let date2 = new Date();//当前时间 let date2 = new Date(); //当前时间
RatePlanCancellationPolicyList.forEach((item,index) => { RatePlanCancellationPolicyList.forEach((item, index) => {
var dt = new Date(item.FromDate);//取消时间 var dt = new Date(item.FromDate); //取消时间
if(IsCancel==0){ if (IsCancel == 0) {
if (dt > date2 ) { if (dt > date2) {
if(item.Amount==TotalPrice){ if (item.Amount == TotalPrice) {
IsCancel=1; IsCancel = 1;
}else{ } else {
IsCancel=2; IsCancel = 2;
} }
} } else {
else{ if (item.Amount != TotalPrice) {
if(item.Amount!=TotalPrice){ IsCancel = 2;
IsCancel=2;
} }
} }
} }
}); });
return IsCancel; return IsCancel;
}, },
...@@ -1308,88 +1473,94 @@ export default { ...@@ -1308,88 +1473,94 @@ export default {
this.map.addOverlay(marker); this.map.addOverlay(marker);
}, },
getAveragePrice(PriceList) { getAveragePrice(PriceList) {
let totelPrice=0 let totelPrice = 0
if(PriceList&&PriceList.length>0){ if (PriceList && PriceList.length > 0) {
PriceList.forEach((item,index) => { PriceList.forEach((item, index) => {
totelPrice+=Math.ceil(item.Price); totelPrice += Math.ceil(item.Price);
}); });
return Math.ceil(totelPrice/(PriceList.length)); return Math.ceil(totelPrice / (PriceList.length));
} }
return totelPrice; return totelPrice;
}, },
getDiDaPriceConfirm(index,subIndex,item) { getDiDaPriceConfirm(index, subIndex, item) {
this.confirmLoading = true; this.confirmLoading = true;
let params={ let params = {
sort: 1, sort: 1,
displayFrom: 1, displayFrom: 1,
CheckInDate: this.msg.CheckInDate, CheckInDate: this.msg.CheckInDate,
CheckOutDate: this.msg.CheckOutDate, CheckOutDate: this.msg.CheckOutDate,
searchroomGroup: this.msg.searchroomGroup, searchroomGroup: this.msg.searchroomGroup,
ratePlanID: item.RatePlanID, ratePlanID: item.RatePlanID,
imgUrl: "", imgUrl: "",
RoomCount: (this.msg.searchroomGroup&&this.msg.searchroomGroup.length>0)?this.msg.searchroomGroup.length:0, RoomCount: (this.msg.searchroomGroup && this.msg.searchroomGroup.length > 0) ? this.msg.searchroomGroup
ChildCount: this.msg.childNum, .length : 0,
AdultCount: this.msg.auditNum, ChildCount: this.msg.childNum,
OccupancyDetails: [], AdultCount: this.msg.auditNum,
hotelId: this.msg.hotelId OccupancyDetails: [],
} hotelId: this.msg.hotelId
this.apipost( }
"dmc_post_GetDiDaPriceConfirm", this.apipost(
params, "dmc_post_GetDiDaPriceConfirm",
res => { params,
console.log("dmc_post_GetDiDaPriceConfirm", res); res => {
this.confirmLoading = false; console.log("dmc_post_GetDiDaPriceConfirm", res);
if (res.data.resultCode == 1) { this.confirmLoading = false;
this.confirmPriceList = res.data.data.PriceDetails; if (res.data.resultCode == 1) {
this.roomRateDetails = res.data.data.PriceDetails.HotelList[0]; this.confirmPriceList = res.data.data.PriceDetails;
} this.roomRateDetails = res.data.data.PriceDetails.HotelList[0];
console.log("res.data.data",res.data.data);
if(this.roomRateDetails&&this.roomRateDetails.RatePlanList&&this.roomRateDetails.RatePlanList.length>0){
item.IsSellOut=0;
} }
else{ console.log("res.data.data", res.data.data);
item.IsSellOut=1; if (this.roomRateDetails && this.roomRateDetails.RatePlanList && this.roomRateDetails.RatePlanList
.length > 0) {
item.IsSellOut = 0;
} else {
item.IsSellOut = 1;
} }
}, },
null null
); );
},
}, },
}, created() {
created(){
let userInfo = this.getLocalStorage(); let userInfo = this.getLocalStorage();
this.EmployeeId = userInfo.EmployeeId; this.EmployeeId = userInfo.EmployeeId;
if(this.$route.query.id){ if (this.$route.query.id) {
this.msg.hotelId = this.$route.query.id; this.msg.hotelId = this.$route.query.id;
this.hotelMsg.hotelId= this.$route.query.id; this.hotelMsg.hotelId = this.$route.query.id;
} }
if(this.$route.query.StartDate){ if (this.$route.query.StartDate) {
this.dateList.push(this.$route.query.StartDate) this.dateList.push(this.$route.query.StartDate)
this.msg.CheckInDate = this.$route.query.StartDate this.msg.CheckInDate = this.$route.query.StartDate
} }
if(this.$route.query.EndDate){ if (this.$route.query.EndDate) {
this.dateList.push(this.$route.query.EndDate) this.dateList.push(this.$route.query.EndDate)
this.msg.CheckOutDate = this.$route.query.EndDate this.msg.CheckOutDate = this.$route.query.EndDate
} }
}, },
mounted() { mounted() {
for (let i = 1; i < 13; i++) { for (let i = 1; i < 13; i++) {
var obj={Id:i} var obj = {
this.childrenAgeList.push(obj); Id: i
if(i<10){ }
this.adultList.push(obj); this.childrenAgeList.push(obj);
} if (i < 10) {
if(i<7){ this.adultList.push(obj);
this.childrenList.push({Id:i-1}); }
if (i < 7) {
this.childrenList.push({
Id: i - 1
});
}
} }
this.getdidaMealType();
this.getdidaBedType();
this.getDiDaPriceSearchList();
this.getDiDaHotelImgList();
this.getDidaHotelDetails();
this.getDidaDescriptionList();
this.getDidaFacilitiesList();
this.getDidaPolicyList();
} }
this.getdidaMealType(); };
this.getdidaBedType();
this.getDiDaPriceSearchList(); </script>
this.getDiDaHotelImgList();
this.getDidaHotelDetails();
this.getDidaDescriptionList();
this.getDidaFacilitiesList();
this.getDidaPolicyList();
}
};
</script>
\ No newline at end of file
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