Commit 9ed4df20 authored by 罗超's avatar 罗超

Merge branch 'master' of http://gitlab.oytour.com/zk123/jz_travel into master

parents c10f4a9c 721f7d5c
......@@ -382,6 +382,10 @@
"path":"components/guidecarDraw"
},{
"path":"guidercarCommentList"
},{
"path":"specialCarReserve"//专车预定
},{
"path":"map"
}]
},
{
......@@ -593,6 +597,10 @@
"path":"jz_Line" //九寨-线路
},{
"path":"jz_LineDetail" //九寨-线路详情
},{
"path":"jz_Reserve" //线路-预定
},{
"path":"allorderList"//统一订单
}]
},
//相亲分包
......@@ -726,6 +734,10 @@
"path": "components/time/index"
},{
"path": "picture"
},{
"path": "description"
},{
"path": "order"
},{
"path": "detail",
"enablePullDownRefresh": true,
......
......@@ -430,7 +430,7 @@
<view style='margin-left: 3px;width: calc(100vw - 60px - 80px);'>{{x.Description}}
</view>
</view>
<view class="s-b-box-r" v-if="x.ProductState==1">
<view class="s-b-box-r" v-if="x.ProductState==1" @click="yuding(x)">
预定
</view>
......@@ -545,10 +545,7 @@
topdateList: [],
DepartList: [], //出发点数组
ArriveList: [], //到达点数组
timeList: [], //时间数组
alltime: ['不限', '00:00-03:00', '03:00-06:00', '06:00-09:00', '09:00-12:00',
'12:00-15:00', '15:00-18:00', '18:00-21:00', '21:00-24:00'
],
alltime: [],//时间数组
popuplist: [{
name: '出发地点'
}, {
......@@ -568,7 +565,7 @@
},
onLoad(options) {
console.log(222)
if (options && options.carMsg) {
//对象解码
this.carMsg = JSON.parse(decodeURIComponent(options.carMsg))
......@@ -588,7 +585,12 @@
},
methods: {
yuding(x){
uni.navigateTo({
url: '/pages/guidecar/specialCarReserve?Id='+x.Id +'&Date='+this.msg.Q_Date
})
},
popupchange(e) { //tab事件
this.popupcurrent = e;
},
......@@ -762,6 +764,9 @@
this.ArriveList = res.data.ArriveList;
this.DepartList.unshift('不限')
this.ArriveList.unshift('不限')
this.alltime =['不限', '00:00-03:00', '03:00-06:00', '06:00-09:00', '09:00-12:00',
'12:00-15:00', '15:00-18:00', '18:00-21:00', '21:00-24:00'
]
},
err => {
uni.hideLoading()
......@@ -778,6 +783,10 @@
this.init();
this.screenshow = false;
this.$forceUpdate()
this.DepartList= [], //出发点数组
this.ArriveList= [], //到达点数组
this.alltime= [],//时间数组
this.getSelectCarSiteList()
},
queren(){
this.msg.StartCityName = this.SMsg.depart;
......
......@@ -281,10 +281,11 @@
}
let carDate = new Date();
let carMonth = (carDate.getMonth() + 1)<10?'0'+(carDate.getMonth() + 1):(carDate.getMonth() + 1);
this.carMsg.Q_Date = carDate.getFullYear() +'-'+carMonth+'-'+carDate.getDate();
let carDays = (carDate.getDate() )<10?'0'+(carDate.getDate() ):(carDate.getDate());
this.carMsg.Q_Date = carDate.getFullYear() +'-'+carMonth+'-'+carDays;
let carday = carDate.getDay();
this.startDate = carDate.getFullYear() +'-'+carMonth+'-'+carDate.getDate();//从啥时候开始
this.showcardate = carMonth+'-'+carDate.getDate();
this.startDate = carDate.getFullYear() +'-'+carMonth+'-'+carDays;//从啥时候开始
this.showcardate = carMonth+'-'+carDays;
this.showweek = this.getweek(carday) //得到定制专车的周几
},
......
<template>
<view class="map">
<map id="navmap" style="width: 100%;height: 600px;" :markers="markers" :latitude="src_latitude" :longitude="src_longitude"
:hidden="false">
</map>
<view class="liststyle" v-if="details.type==1">
<view v-for='(x,y) in upcar' :key='y' class="liststyle-item" @click="goback(x)">
<view class="list-item1" :style="{color:details.SelectID == x.Id?mainColor:'#1B1D1E','font-weight':details.SelectID == x.Id?'bold':'400'}">{{x.Name}}</view>
<view class="list-item-t" :style="{color:details.SelectID == x.Id?mainColor:'#1B1D1E'}">{{x.SubName}}</view>
</view>
</view>
<view class="liststyle" v-if="details.type==2">
<view v-for='(x,y) in downcar' :key='y' class="liststyle-item" @click="goback(x)">
<view class="list-item1" :style="{color:details.SelectID == x.Id?mainColor:'#1B1D1E','font-weight':details.SelectID == x.Id?'bold':'400'}">{{x.Name}}</view>
<view class="list-item-t" :style="{color:details.SelectID == x.Id?mainColor:'#1B1D1E'}">{{x.SubName}}</view>
</view>
</view>
</view>
</template>
<script>
export default{
data(){
return{
pageTitle: "选择地点",
src_latitude:'30.628043',
src_longitude:'104.137580',
markers: [],
details:{},
upcar:[],
downcar:[],
mainColor:'',
}
},
onReady(){
let MapContext = wx.createMapContext('navmap', this);
let that = this;
},
onLoad(options) {
this.mainColor = this.$uiConfig.mainColor;
if(options && options.obj){
this.details = JSON.parse(decodeURIComponent(options.obj))
this.getdizhiList()
if(this.details.type==1){
this.pageTitle='选择出发点'
}else{
this.pageTitle='选择到达点'
}
}
uni.setNavigationBarTitle({
title: this.pageTitle,
});
},
methods:{
getdizhiList(){
this.upcar = []
this.downcar = []
this.details.SiteList.forEach(x=>{
if(x.Type == 1){
this.upcar.push(x)
}else{
this.downcar.push(x)
}
})
this.markers = [];
if(this.details.type == 1){
this.src_latitude = this.upcar[0].Lonlat.split(',')[1];
this.src_longitude = this.upcar[0].Lonlat.split(',')[0];
this.upcar.map(x=>{
let obj = {
id: x.Id,
iconPath: 'https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/CustomizedCar/dcdtbiaoji.png',
width: 22,
height: 33,
latitude:x.Lonlat.split(',')[1],
longitude:x.Lonlat.split(',')[0],
title:x.Name
}
this.markers.push(obj)
})
}else{
this.src_latitude = this.downcar[0].Lonlat.split(',')[1];
this.src_longitude = this.downcar[0].Lonlat.split(',')[0];
this.downcar.map(x=>{
let obj = {
id: x.Id,
iconPath: 'https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/CustomizedCar/dcdtbiaoji.png',
width: 22,
height: 33,
latitude:x.Lonlat.split(',')[1],
longitude:x.Lonlat.split(',')[0],
title:x.Name
}
this.markers.push(obj)
})
}
},
goback(x){
let pages = getCurrentPages(); // 当前页面
let beforePage = pages[pages.length - 2]; // 前一个页面
let that = this
uni.navigateBack({
success: function() {
beforePage.$vm.getbackData(that.details.type,x.Id); // 执行前一个页面的方法
}
});
}
}
}
</script>
<style>
.map{
width: 100%;
height: 100vh;
position: relative;
}
.liststyle{
width: 100%;
max-height: 165px;
position: absolute;
left: 0;
bottom: 0;
background: #FFF;
border-radius: 10px 10px 0px 0px;
padding: 10px 15px;
}
.liststyle-item{
padding: 5px 0;
font-size: 14px;
color: #1B1D1E;
border-bottom: 1px solid #E2E2E2;
}
.list-item{
}
.list-item-t{
font-size: 11px;margin-top: 3px;color: #999999;
}
</style>
<style lang="scss" scoped>
.specialCarReserve{
width: 100%;
height: 100vh;
background: #FFF;
.box-top{
width: 100%;
height: 80px;
display: flex;
align-items: center;
padding: 0 15px;
justify-content: space-between;
font-size: 20px;
font-family: PingFang SC;
font-weight: 800;
color: #111111;
border-radius: 0px 0px 30px 30px;
box-shadow: 0px 1px 8px 0px rgba(76, 76, 76, 0.13);
.onetext{
overflow: hidden;white-space: nowrap;text-overflow: ellipsis;
width: calc((100vw - 30px - 115px)/2);
text-align: center;
}
.box-top-c{
width: 113px;
display: flex;
flex-direction: column;
align-items: center;
.box-top-ct{
width: 113px;
height: 21px;
border-radius: 2px;
background: rgba(223, 190, 110, 0.1);
font-size: 12px;
font-family: PingFang SC;
font-weight: 500;
color: #DFBE6E;
text-align: center;
line-height: 21px;
margin-bottom: 4px;
}
}
}
.addresStyle{
width: 100%;
height: 53px;
padding: 0 20px;
display: flex;
align-items: center;
}
.address-l-h{
width: 13px;
height: 13px;
background: #111111;
border: 3px solid #999999;
border-radius: 50%;
margin-right: 9px;
}
.address-l-h2{
width: 13px;
height: 13px;
background: #DFBE6E;
border: 3px solid #F2DBA3;
border-radius: 50%;
margin-right: 9px;
}
.addresStyle-text{
width: calc(100vw - 40px - 13px - 9px);
height: 100%;
font-size: 14px;
color: #999999;
font-weight: bold;
display: flex;
align-items: center;
border-bottom: 1px solid #E7E7E7;
overflow: hidden;white-space: nowrap;text-overflow: ellipsis;
}
.item-s{
width: 100%;
padding: 0 20px;
.item{
width: 100%;
height: 45px;
display: flex;
align-items: center;
justify-content: space-between;
font-size: 14px;
font-weight: 500;
color: #111111;
.item-row{
display: flex;
align-items: center;
.text-h{
font-size: 12px;
font-weight: 500;
color: #999999;
margin-left: 20px;
}
}
}
}
.posibtn{
width: calc(100vw - 40px);
height: 50px;
border-radius: 8px;
background: #FFFFFF;
box-shadow: 0px 5px 15px 0px rgba(36, 36, 36, 0.2);
display: flex;
align-items: center;
justify-content: space-between;
position: fixed;
left: 20px;
bottom: 30px;
z-index: 20;
.btn-l{
display: flex;
align-items: flex-end;
font-size: 12px;
color: #111111;
margin-left: 19px;
}
.btn-r{
width: 97px;
height: 40px;
background: #111111;
border-radius: 8px;
margin-right: 5px;
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
font-weight: bold;
color: #FFFFFF;
}
}
}
</style>
<template>
<view class="specialCarReserve">
<view class="box-top">
<div class='onetext'>
{{details.StartCityName}}
</div>
<view class="box-top-c">
<view class="box-top-ct">
{{showtime}}
</view>
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/sanjiao.png" mode="aspectFill" style="width: 55px;height: 4px;"></image>
</view>
<div class='onetext'>
{{details.ArriveCityName}}
</div>
</view>
<view class="addresStyle">
<view class="address-l-h"></view>
<view class="addresStyle-text" @click="shijiup(1)">
<span v-if="addMsg.DepartAddress==''">请选择实际上车点</span>
<span v-else style='color: #111;'>{{addMsg.DepartAddress}}</span>
</view>
</view>
<view class="addresStyle">
<view class="address-l-h2"></view>
<view class="addresStyle-text" @click="shijiup(2)">
<span v-if="addMsg.ArriveAddress==''">请选择实际下车点</span>
<span v-else style='color: #111;'>{{addMsg.ArriveAddress}}</span>
</view>
</view>
<view class="item-s">
<view class="item">
<view class="item-row">
<span>成人</span>
<span class='text-h'>12周岁以上</span>
</view>
<view>
<u-number-box v-model="addMsg.PeopleNumber" @change="valChange"></u-number-box>
</view>
</view>
<view class="item">
<view class="item-row">
<span>儿童</span>
<span class='text-h'>0-12周岁(不含)</span>
</view>
<view>
<u-number-box v-model="addMsg.ChildNumber" @change="valChange2"></u-number-box>
</view>
</view>
<view class="item">
<view class="item-row">
<span>联系人</span><span style='color: #D91818;'>*</span>
</view>
<view>
<input type="text" v-model="addMsg.Consignee" placeholder="请输入联系人" style="text-align: right;width: calc(100vw - 40px - 80px);">
</view>
</view>
<view class="item">
<view class="item-row">
<span>联系电话</span><span style='color: #D91818;'>*</span>
</view>
<view>
<input type="number" v-model="addMsg.ConsigneeMobile" placeholder="请输入联系电话" style="text-align: right;width: calc(100vw - 40px - 80px);">
</view>
</view>
<view class="item" style="border-bottom: 1px solid #E7E7E7;">
<view class="item-row">
<span>留言</span>
</view>
<view>
<input type="text" v-model="addMsg.BuyerMessage" placeholder="请输入留言" style="text-align: right;width: calc(100vw - 40px - 80px);">
</view>
</view>
<view style="line-height: 35px;text-align: right;">明细</view>
<view class="item">
<view class="item-row"></view>
<view class="item-row">
<span style='margin-right: 3px;'>成人</span>
<span v-if='addMsg.PeopleNumber>0'>{{addMsg.PeopleNumber}}*{{addMsg.Unit_Price}}</span>
<span v-else>0</span>
</view>
</view>
<view class="item">
<view class="item-row"></view>
<view class="item-row">
<span style='margin-right: 3px;'>儿童</span>
<span v-if='addMsg.ChildNumber>0'>{{addMsg.ChildNumber}}*{{addMsg.Unit_Price}}</span>
<span v-else>0</span>
</view>
</view>
<view style="width: 100%;height: 100px;"></view>
</view>
<view class="posibtn">
<view class="btn-l">
<span>总价</span>
<span style='margin-left: 5px;color: #D91818;'></span>
<span style='font-size: 20px;color: #D91818;line-height: 21px;'>{{addMsg.Final_Price.toFixed(2)}}</span>
</view>
<view class="btn-r" @click="gopay">去支付</view>
</view>
</view>
</template>
<script>
export default{
data(){
return{
pageTitle: "订单填写",
mainColor: '',
details:{},
showtime:'',
addMsg:{
PlanId:0,
Date:'',
DepartureTime:'',
DepartAddress:'',
ArriveAddress:'',
Unit_Price:0,
PeopleNumber:0,
ChildNumber:0,
Final_Price:0,
BuyerMessage:'',
Consignee:'',
ConsigneeMobile:'',
},
upcar:[],
downcar:[],
upid:0,
downid:0,
orderInfo:{},
showtime2:'',
}
},
onLoad(options) {
if(options && options.Id){
this.addMsg.PlanId = options.Id;
this.getCarPlanInfo()//获取定制包车结算页面
}
if(options && options.Date){
this.addMsg.Date = options.Date;
var time = new Date(options.Date);
let showweek = time.getDay()
let week = this.getweek(showweek)
this.showtime = options.Date.split('-')[1] + '月' + options.Date.split('-')[2] + '日'+' '+week;
this.showtime2 = options.Date.split('-')[1] + '月' + options.Date.split('-')[2] + '日'
}
uni.setNavigationBarTitle({
title: this.pageTitle,
});
this.mainColor = this.$uiConfig.mainColor;
},
methods:{
shijiup(type){
let SelectID = 0
if(type==1){
SelectID = this.upid;
}else{
SelectID = this.downid;
}
let obj = {
type:type,//上车点
SiteList:this.details.SiteList,
SelectID:SelectID
}
obj = encodeURIComponent(JSON.stringify(obj))
uni.navigateTo({
url: '/pages/guidecar/map?obj='+ obj
})
},
getbackData(type,ID){//地图选择返回参数
console.log(type,ID)
if(type==1){
this.upcar.map(x=>{
if(x.Id == ID){
this.addMsg.DepartAddress = x.Name;
this.upid = x.Id;
this.addMsg.DepartureTime = x.AboutTime;//出发时间的赋值
return
}
})
}else{
this.downcar.map(x=>{
if(x.Id == ID){
this.addMsg.ArriveAddress = x.Name;
this.downid = x.Id;
return
}
})
}
},
valChange(val){//数值改变更改总价
let value = val.value;
this.addMsg.PeopleNumber = value
this.addMsg.Final_Price = (this.addMsg.PeopleNumber +this.addMsg.ChildNumber)*this.addMsg.Unit_Price
},
valChange2(val){//数值改变更改总价
let value = val.value
this.addMsg.ChildNumber = value
this.addMsg.Final_Price = (this.addMsg.PeopleNumber+this.addMsg.ChildNumber)*this.addMsg.Unit_Price
},
gopay(){//支付
if(this.addMsg.DepartAddress==''){
uni.showToast({
title:'请选择出发地',
icon:'none'
})
return
}
if(this.addMsg.ArriveAddress==''){
uni.showToast({
title:'请选择到达地',
icon:'none'
})
return
}
if((this.addMsg.PeopleNumber+this.addMsg.ChildNumber)<1){
uni.showToast({
title:'请选择出发人数',
icon:'none'
})
return
}
if(this.addMsg.Consignee==''){
uni.showToast({
title:'请输入联系人',
icon:'none'
})
return
}
if(this.addMsg.ConsigneeMobile==''){
uni.showToast({
title:'请输入联系人电话',
icon:'none'
})
return
}
uni.showLoading({
title: '下单中...'
})
this.request2({
url: '/api/AppletCar/SetAppletCarOrderInfo',
data: this.addMsg
},
res => {
uni.hideLoading()
if (res.resultCode == 1) {
this.queren(res.data)
}
},
err => {
uni.hideLoading()
}
);
},
queren(OrderId){
let url='/api/WeChatPay/GetDmcPayInfo'
let GoodsName = this.showtime2+this.details.StartCityName+'-'+this.details.ArriveCityName
GoodsName = GoodsName.slice(0, 10)
this.request2({
url: url,
data: {
OrderId:OrderId,
GoodsName:GoodsName,
OrderPayType:1,
OpenId:uni.getStorageSync('mall_UserInfo').OpenId,
}
},
res => {
this.orderInfo = JSON.parse(res.data);
console.log(this.orderInfo)
this.Pay()
}
);
},
Pay(){
let that=this;
uni.requestPayment({
provider: 'wxpay',
timeStamp: this.orderInfo.timeStamp,
nonceStr: this.orderInfo.nonceStr,
package: this.orderInfo.package,
signType: this.orderInfo.signType,
paySign: this.orderInfo.sign,
success: function(res) {
console.log('success', res);
uni.showToast({
title: "支付成功"
})
},
fail: function(err) {
console.log('fail:', err);
uni.showToast({
title: "支付失败"
})
}
});
},
getCarPlanInfo(){
uni.showLoading({
title: '加载中...'
})
this.request2({
url: '/api/AppletCar/GetAppletCarPlanSettlementInfo',
data: {PlanId:this.addMsg.PlanId}
},
res => {
uni.hideLoading()
if (res.resultCode == 1) {
this.details = res.data
this.addMsg.DepartureTime = this.details.StartDate;
this.addMsg.Unit_Price = this.details.Price;
this.upcar = [];
this.downcar = []
this.details.SiteList.forEach(x=>{
if(x.Type == 1){
this.upcar.push(x)
}else{
this.downcar.push(x)
}
})
//出发点默认第一个
this.addMsg.DepartAddress = this.upcar[0].Name;
this.upid = this.upcar[0].Id;
}
},
err => {
uni.hideLoading()
}
);
},
getweek(day) { //根据值返回当前时间的星期几
if (day == 1) {
return '周一'
} else if (day == 2) {
return '周二'
} else if (day == 3) {
return '周三'
} else if (day == 4) {
return '周四'
} else if (day == 5) {
return '周五'
} else if (day == 6) {
return '周六'
} else if (day == 0) {
return '周日'
}
},
}
}
</script>
......@@ -23,7 +23,7 @@
<view class="rm-opera">
<!-- 如果库存少于5显示 -->
<view class="warm-count">剩2间</view>
<view class="buy">
<view class="buy" @click="previewOrder">
<view class="buy-content"></view>
<view class="buy-tips">在线订</view>
</view>
......@@ -32,6 +32,15 @@
</template>
<script>
export default {
methods: {
previewOrder(){
uni.navigateTo({
url:"/pages/hotel/order"
})
},
},
}
</script>
<style>
......
<template>
<view style="height: 100vh;">
<view style="padding:0 45rpx;">
<u-tabs :is-scroll="false" name="Name" :list="navs" active-color="#DFBE6E" :current="active" @change="changeHandler"
:show-bar="true" :activeFontSize="32" inactive-color="#111111" :bold="true" height="100" duration="0" font-size="28"></u-tabs>
</view>
<scroll-view scroll-y="true" class="hotel-descr" @scroll="scroll">
<view class="content">
<view class="flex">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1622085515000_731.png" mode="widthFix" style="width: 32rpx;"></image>
<view class="h-name">九寨沟星宇国际大酒店</view>
</view>
<view class="base-box flex flex-wrap">
<view class="item">
<view class="val">2014年</view>
<view class="label">开业时间</view>
</view>
<view class="item">
<view class="val">2017年</view>
<view class="label">装修时间</view>
</view>
<view class="item">
<view class="val">200间</view>
<view class="label">房间数量</view>
</view>
<view class="item">
<view class="val">028-86898868</view>
<view class="label">联系电话</view>
</view>
<view class="item" style="width:100%">
<view class="val">中国,四川,松潘,川主寺镇漳腊磨坎坡路90号</view>
<view class="label">酒店地址</view>
</view>
</view>
<view class="desc">
<view>九寨沟星宇国际大酒店位于九寨沟风景区沟口,距九寨沟风景区沟口约1.8公里,酒店提供送景区入口摆渡车服务。</view>
<view>酒店外观独具藏式宫廷建筑特色,内部设计融入浓郁的民族元素,为您呈现藏族歌舞艺术文化底蕴。客房设计主题鲜明又不失时尚舒适,洗浴用品均按高端品质配备,满足所有出行居停的需要。中西餐厅提供豪华自助餐和川、粤、藏等精美菜式,可容300人同时就餐。大型无柱多功能厅,满足您所有的需求:会议、团建、推介、答谢、宴请......</view>
<view>酒店拥有自己的大型剧院---星宇登嘎甘㑇大剧院,让您足不出户就能享受视听盛宴!酒店深耕主题文化特色与内涵,将抽象的当地民族文化更形象、生动的植入到对客服务和体验中。民族服饰的体验、锅庄舞蹈的互动活动以及登嘎甘㑇情景剧节目等都深得当下爱玩、爱拍、爱分享的游客们喜欢,让住客不再局限于食、宿这样单一化的体验。酒店还引进了超人气机器人店导员,主题文化介绍、带人送物对她而言都是驾轻就熟的工作!可爱、有趣的萌娃天地,让您协同孩子尽享欢乐的度假时光,还可提供婴儿床。</view>
</view>
<view class="empty-block"></view>
<view class="flex" style="margin-top: 50rpx;">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1622086795000_201.png" mode="widthFix" style="width: 32rpx;"></image>
<view class="h-name">店内设施</view>
</view>
<view class="sheshi">
<view class="she-title">公共服务设施</view>
<view class="she-content">
<text>有可无线上网的公共区域</text>
<text>公共音响系统</text>
<text>公共区域闭路电视监控系统</text>
<text>无烟楼层</text>
<text>电梯</text>
</view>
</view>
<view class="sheshi">
<view class="she-title">房间设施</view>
<view class="she-content">
<text>房间内高速上网</text>
<text>客房WIFI覆盖</text>
<text>遮光窗帘</text>
<text>手动窗帘</text>
<text>空调</text>
<text>沙发</text>
<text>书桌</text>
<text>床具:鸭绒被</text>
<text>床具:毯子或被子</text>
<text>多种规格电源插座</text>
<text>110V电压插座</text>
<text>独立淋浴间</text>
<text>液晶电视机</text>
<text>浴衣</text>
<text>吹风机</text>
<text>24小时热水</text>
<text>拖鞋</text>
<text>电热水壶</text>
</view>
</view>
<view class="sheshi" style="margin-bottom: 50rpx;">
<view class="she-title">酒店服务</view>
<view class="she-content">
<text>行李寄存</text>
<text>24小时前台服务</text>
<text>邮政服务</text>
<text>手动窗帘</text>
<text>叫醒服务</text>
<text>一次性账单结算服务</text>
</view>
</view>
<view class="empty-block"></view>
<view class="flex" style="margin-top: 50rpx;">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1622094594000_166.png" mode="widthFix" style="width: 32rpx;"></image>
<view class="h-name">订房须知</view>
</view>
<ul class="title-style-one">
<li>
<view class="item-title king regular">入住时间:14:00以后</view>
<view class="item-title king regular">退房时间:13:00以前</view>
</li>
<li>
<view class="item-title">宠物政策</view>
<view class="item-content">允许携带宠物,酒店可能收取额外费用</view>
</li>
<li>
<view class="item-title">酒店提示</view>
<view class="item-content">疫情期间,请佩戴好口罩。住宿提供方支持中国(含港澳台)及外国客人入住</view>
</li>
<li>
<view class="item-title">儿童政策</view>
<view class="item-content">不接受18岁以下客人单独入住。每房间可有1名儿童使用现有床铺。不可加床</view>
</li>
</ul>
<view class="empty-block"></view>
<view class="flex" style="margin-top: 50rpx;">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1622094594000_166.png" mode="widthFix" style="width: 32rpx;"></image>
<view class="h-name">周边交通</view>
</view>
<view class="sheshi">
<view class="she-title">牛王庙地铁站-D口</view>
<view class="she-content">
<text>九寨沟喜来登国际大酒店·中餐厅步行8分钟</text>
</view>
</view>
<view class="sheshi">
<view class="she-title">东大门地铁站-A口</view>
<view class="she-content">
<text>距离酒店80米,步行约12分钟</text>
</view>
</view>
</view>
</scroll-view>
</view>
</template>
<script>
export default {
data() {
return {
navs:[{
Id:0,
Name:"酒店信息",
position:0
},{
Id:1,
Name:"规则设施",
position:691
},{
Id:2,
Name:"周边交通",
position:1038
}],
active:0,
scrollTop:0,
oldScrollTop:0
}
},
created() {
uni.setNavigationBarTitle({
title: "酒店详细信息",
});
},
methods: {
scroll(e) {
this.oldScrollTop = e.detail.scrollTop;
console.log(this.oldScrollTop)
this.changeActive()
},
goToPosition(posi) {
this.scrollTop = posi;//this.oldScrollTop;
this.$nextTick(function() {
this.scrollTop = posi;
});
},
changeActive(){
let t=0
this.navs.forEach((x,i)=>{
if(x.position<=this.oldScrollTop){
t=i
}
})
this.active=t
},
changeHandler(i) {
this.active = i;
console.log(this.navs[i].position)
this.goToPosition(this.navs[i].position)
// this.clickItem={};
// this.$nextTick(function(){
// this.clickItem = this.navs.navs[i];
// })
},
},
}
</script>
<style>
.hotel-descr{
height: calc(100% - 50px);
width: 100vw;
color:#111;
}
.hotel-descr .king {
color: #DFBE6E !important;
}
.hotel-descr .regular {
font-weight: 500 !important;
}
.hotel-descr .flex{
display: flex;
align-items: center;
}
.hotel-descr .empty-block{
height: 20rpx;
background: #ECF1F4;
margin: 0 -45rpx;
}
.hotel-descr .flex-wrap{
flex-wrap: wrap;
}
.hotel-descr .content{
padding: 45rpx;
}
.hotel-descr .content .h-name{
font-size: 36rpx;
font-weight: 800;
margin-left: 13rpx;
}
.hotel-descr .content .base-box{
margin: 26rpx 0 56rpx 0;
}
.hotel-descr .content .base-box .item{
width: 50%;
margin-top: 30rpx;
flex-shrink: 0;
}
.hotel-descr .content .base-box .item .val{
font-size: 30rpx;
font-weight: bold;
margin-bottom: 10rpx;
}
.hotel-descr .content .base-box .item .label{
font-size: 20rpx;
color: #878787;
}
.hotel-descr .content .desc{
font-size: 24rpx;
font-weight: 500;
color: #4B4949;
line-height: 48rpx;
padding-bottom: 50rpx;
}
.hotel-descr .content .sheshi{
margin-top: 50rpx;
}
.hotel-descr .content .sheshi .she-title{
font-size: 28rpx;
font-weight: 800;
}
.hotel-descr .content .sheshi .she-content{
margin-top: 24rpx;
}
.hotel-descr .content .sheshi .she-content text{
font-size: 24rpx;
font-weight: 500;
color: #4A4A4A;
line-height: 40rpx;
margin-right: 24rpx;
}
.hotel-descr .content .title-style-one {
padding: 0;
margin: 50rpx 0;
display: block;
}
.hotel-descr .content .title-style-one li {
list-style: none;
margin-bottom: 40rpx;
padding-left: 33rpx;
position: relative;
}
.hotel-descr .content .title-style-one li::before {
content: ' ';
display: block;
width: 10rpx;
height: 10rpx;
background: #111111;
border-radius: 50%;
position: absolute;
left: 0;
top: 15rpx;
}
.hotel-descr .content .title-style-one li:last-child {
margin-bottom: 0px;
}
.hotel-descr .content .title-style-one li .item-title {
font-size: 28rpx;
font-weight: bold;
color: #1F1F1F;
margin-bottom: 20rpx;
}
.hotel-descr .content .title-style-one li .item-content {
font-size: 24rpx;
font-weight: 500;
color: #6E6E6E;
}
</style>
......@@ -173,7 +173,7 @@
<view class="item-title regular">健身房</view>
</li>
</ul>
<view class="hotel-more-info">酒店详情</view>
<view class="hotel-more-info" @click="openDescription">酒店详情</view>
</view>
<view class="empty-block"></view>
<view class="detail-box">
......@@ -334,6 +334,12 @@
url:"/pages/hotel/picture"
})
},
openDescription(){
uni.navigateTo({
url:"/pages/hotel/description"
})
},
chosenDateResult(obj) {
obj.startDay = this.formatMonthDay(obj.startDay)
obj.endDay = this.formatMonthDay(obj.endDay)
......
......@@ -242,7 +242,7 @@
},
created() {
uni.navigateTo({
url:"/pages/hotel/detail"
url:"/pages/hotel/order"
})
uni.setNavigationBarTitle({
title: "酒店",
......
<template>
<view>
<view class="hotel-order">
<view class="o-head">
<view class="o-timer flex">
<view class="time-item">5月20日 周六</view>
<view class="time-split">
<view>1晚</view>
<image style="width: 66rpx;" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1622098352000_930.png" mode="widthFix"></image>
</view>
<view class="time-item">5月23日 周日</view>
</view>
<view class="room-name">藏韵高级双床房</view>
<view class="room-remark">含早 | 1.5m大床 | 24㎡ | 有窗</view>
<view class="big-title">
<text class=" f12">订房必知</text>
</view>
<view class="rule">
<text class="king">此房间支持免费取消, </text>
<text>订单需要等待酒店或供应商确认后生效,订单确认结果我们将会通知推送到您的微信,请您在下单时同意结果订阅,以便您能正常收到消息。</text>
</view>
</view>
<view class="form">
<view class="form-items">
<view class="label">房间数量</view>
<view class="val">
<u-number-box size="28" :min="1" :max="100" v-model="order.roomCount"></u-number-box>
</view>
</view>
<view class="form-items">
<view class="label">住客姓名</view>
<view class="val">
<input type="text" v-model="order.userName" placeholder="若是多人,输入代表人员即可" />
</view>
</view>
<view class="form-items">
<view class="label">联系电话</view>
<view class="val">
<input type="text" v-model="order.userName" placeholder="输入电话号码" />
</view>
</view>
<view class="form-items">
<view class="label">预计到店</view>
<view class="val flex">
<view style="flex: 1;" class="f14">14:00</view>
<u-icon name="arrow" color="#D9D9D9" size="20" />
</view>
</view>
</view>
<view class="empty-block"></view>
<view style="padding:50rpx 40rpx">
<view class="big-title">
<text>费用明细</text>
</view>
<view class="form" style="margin:40rpx 0;padding: 0;">
<view class="form-items">
<view class="label">
在线支付
</view>
<view class="val f14 regular" style="text-align: right;">
<text style="margin-right: 30rpx;">2间房</text>
<text class="red">¥5666</text>
</view>
</view>
<view class="form-items" style="border-bottom: none;">
<view class="label">
房费明细
</view>
</view>
<view class="flex f12 grey">
<view style="flex:1">
<text style="margin-right: 30rpx;">2021-05-27</text>
<text>含早</text>
</view>
<view style="text-align: right;">2间 × ¥1416.5</view>
</view>
<view class="flex f12 grey" style="margin-top: 40rpx;">
<view style="flex:1">
<text style="margin-right: 30rpx;">2021-05-28</text>
<text class="red">不含早</text>
</view>
<view style="text-align: right;">2间 × ¥1416.5</view>
</view>
</view>
</view>
<view class="empty-block"></view>
<view style="padding:50rpx 40rpx">
<view class="big-title">
<text>重要提醒</text>
</view>
<view class="sheshi">
<view class="she-title">入离时间</view>
<view class="she-content">
<text>入住时间:14:00以后;离店时间:12:00以前</text>
</view>
</view>
<view class="sheshi">
<view class="she-title">宠物政策</view>
<view class="she-content">
<text>允许携带宠物,酒店可能收取额外费用</text>
</view>
</view>
<view class="sheshi">
<view class="she-title">酒店提示</view>
<view class="she-content">
<text>疫情期间,请佩戴好口罩。住宿提供方支持中国(含港澳台)及外国客人入住</text>
</view>
</view>
<view class="sheshi">
<view class="she-title">儿童政策</view>
<view class="she-content">
<text>不接受18岁以下客人单独入住。每房间可有1名儿童使用现有床铺。不可加床</text>
</view>
</view>
</view>
</view>
<view class="opera-box">
<view class="box flex">
<view class="price">
<text class="f11"></text>
<text>5666</text>
</view>
<view class="sum-detail">共计 2万·2间房</view>
<u-button :ripple="true" :hair-line="false" :custom-style="btnStyle">立即购买</u-button>
</view>
</view>
</view>
</template>
<script>
export default{
data() {
return {
order: {
roomCount:1,
userName:''
},
btnStyle:{
height:"80rpx",
lineHeight:"80rpx",
borderRadius:"16rpx",
background:"#111",
color:"#FFF",
fontSize:"28rpx",
fontWeight:"600",
width:'193rpx',
}
}
},
created() {
uni.setNavigationBarTitle({
title: "九寨沟星宇国际大酒店",
});
},
}
</script>
<style>
.hotel-order{
color: #111111;
margin-bottom: 160rpx;
}
.opera-box{
background-color: #FFF;
padding: 20rpx 45rpx 40rpx 45rpx;
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: 5;
}
.opera-box .box{
height: 100rpx;
background: #FFFFFF;
box-shadow: 0px 10rpx 30rpx 0px rgba(36, 36, 36, 0.2);
border-radius: 16rpx;
display: flex;
align-items: center;
padding: 0 10rpx 0 36rpx;
}
.opera-box .box .price{
font-size: 40rpx;
font-weight: 500;
color: #D91818;
margin-right: 20rpx;
}
.opera-box .box .sum-detail{
font-size: 24rpx;
flex: 1;
font-weight: 500;
color: #6E6E6E;
}
.hotel-order .red{
color:#D91818 !important
}
.hotel-order .grey{
color:#6E6E6E !important
}
.hotel-order .form{
margin-top: 60rpx;
padding:0 45rpx;
}
.hotel-order .form .form-items{
margin-bottom: 40rpx;
display: flex;
align-items: center;
padding-bottom: 36rpx;
border-bottom:1px solid #f5f5f5;
font-size: 28px;
font-weight: 500;
}
.hotel-order .form .form-items:last-child{
border-bottom: none;
}
.hotel-order .form .form-items .label{
font-size: 28rpx;
font-weight: 600;
margin-right: 60rpx;
flex-shrink: 0;
}
.hotel-order .form .form-items .val{
flex:1;
}
.hotel-order .sheshi{
margin-top: 50rpx;
}
.hotel-order .sheshi .she-title{
font-size: 28rpx;
font-weight: 800;
}
.hotel-order .sheshi .she-content{
margin-top: 24rpx;
}
.hotel-order .sheshi .she-content text{
font-size: 24rpx;
font-weight: 500;
color: #4A4A4A;
line-height: 40rpx;
margin-right: 24rpx;
}
.hotel-order .form .form-items .val input{
border:none;
padding: 0;
margin: 0;
outline: none;
height: 38rpx;
line-height: 38rpx;
font-size: 28rpx;
font-weight: 500;
width: 100%;
}
.hotel-order .king {
color: #DFBE6E !important;
}
.hotel-order .f12 {
font-size:24rpx !important;
}
.f11 {
font-size:22rpx !important;
}
.hotel-order .f14 {
font-size:28rpx !important;
}
.hotel-order .regular {
font-weight: 500 !important;
}
.hotel-order .flex{
display: flex;
align-items: center;
}
.hotel-order .empty-block{
height: 20rpx;
background: #ECF1F4;
}
.hotel-order .flex-wrap{
flex-wrap: wrap;
}
.hotel-order .o-head{
padding: 45rpx;
background: #FFFFFF;
box-shadow: 0px 2rpx 15rpx 0px rgba(76, 76, 76, 0.13);
border-radius: 0px 0px 60rpx 60rpx;
}
.hotel-order .o-head .o-timer{
height: 100rpx;
background: #ECF1F4;
border-radius: 20rpx;
padding: 0 40rpx;
}
.hotel-order .o-head .o-timer .time-item{
font-size: 32rpx;
font-weight: 800;
flex:1;
}
.hotel-order .o-head .o-timer .time-item:last-child{
text-align: right;
}
.hotel-order .o-head .o-timer .time-split{
font-size: 24rpx;
font-weight: 400;
text-align: center;
}
.hotel-order .o-head .room-name{
font-size: 32rpx;
font-weight: bold;
margin-top: 40rpx;
margin-bottom: 10rpx;
}
.hotel-order .o-head .room-remark{
font-size: 28rpx;
font-weight: 500;
padding-bottom:30rpx;
margin-bottom: 30rpx;
border-bottom: 1px solid #E7E7E7;
}
.hotel-order .o-head .rule{
font-size: 22rpx;
font-weight: 500;
color: #6E6E6E;
margin-top: 18rpx;
}
.hotel-order .big-title {
position: relative;
}
.hotel-order .big-title::before {
display: block;
width: 71rpx;
height: 12rpx;
background: #DFBE6E;
border-radius: 4rpx;
content: ' ';
position: absolute;
left: 0;
bottom: 6rpx;
z-index: 1;
}
.hotel-order .big-title text {
font-size: 34rpx;
font-weight: bold;
color: #1F1F1F;
position: relative;
z-index: 2;
}
</style>
......@@ -3,12 +3,12 @@
<scroll-view scroll-y="true" class="hotel-pic">
<view class="content">
<view class="left">
<view v-for="(x,i) in jiList" :key="i" class="image-box">
<view v-for="(x,i) in jiList" :key="i" class="image-box" @click="previewImage(x.picUrl)">
<image :src="x.picUrl" mode="widthFix"></image>
</view>
</view>
<view class="right">
<view v-for="(x,i) in ouList" :key="i" class="image-box">
<view v-for="(x,i) in ouList" :key="i" class="image-box" @click="previewImage(x.picUrl)">
<image :src="x.picUrl" mode="widthFix"></image>
</view>
</view>
......@@ -42,13 +42,85 @@
picUrl:"http://imgfile.oytour.com/Upload/DMC/202105251114114560000000058.png",
type:"酒店"
},
{
picUrl:"https://dimg07.c-ctrip.com/images/01066120008jk5bcc94AC_C_1600_1200.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/200j13000000v60wjE77D_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/t1/hotel/533000/532930/3fcc6398b3c44c08bb1b57aef579793e_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/20010r000000hmqk32EF2_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/200v0f0000007d6wgBCD6_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"http://imgfile.oytour.com/Upload/DMC/202105251114114560000000058.png",
type:"酒店"
},
{
picUrl:"https://dimg07.c-ctrip.com/images/01066120008jk5bcc94AC_C_1600_1200.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/200j13000000v60wjE77D_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/t1/hotel/533000/532930/3fcc6398b3c44c08bb1b57aef579793e_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/20010r000000hmqk32EF2_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/200v0f0000007d6wgBCD6_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"http://imgfile.oytour.com/Upload/DMC/202105251114114560000000058.png",
type:"酒店"
},
{
picUrl:"https://dimg07.c-ctrip.com/images/01066120008jk5bcc94AC_C_1600_1200.jpg",
type:"酒店"
},{
picUrl:"https://ak-d.tripcdn.com/images/200j13000000v60wjE77D_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/t1/hotel/533000/532930/3fcc6398b3c44c08bb1b57aef579793e_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/20010r000000hmqk32EF2_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"https://ak-d.tripcdn.com/images/200v0f0000007d6wgBCD6_R_1080_808_R5_D.jpg",
type:"酒店"
},
{
picUrl:"http://imgfile.oytour.com/Upload/DMC/202105251114114560000000058.png",
type:"酒店"
},
{
picUrl:"https://dimg07.c-ctrip.com/images/01066120008jk5bcc94AC_C_1600_1200.jpg",
type:"酒店"
}
],
jiList:[],
ouList:[]
ouList:[],
allImageSrc:[]
}
},
created() {
......@@ -56,6 +128,7 @@
title: "酒店图片",
});
this.imageList.forEach((x,i)=>{
this.allImageSrc.push(x.picUrl)
if(i%2==0){
this.jiList.push(x)
}else{
......@@ -66,7 +139,22 @@
},
mounted () {
},
methods: {
previewImage(src) {
uni.previewImage({
urls: this.allImageSrc,
current: src,
longPressActions: {
itemList: ["发送给朋友", "保存图片", "收藏"],
success: function(data) {},
fail: function(err) {
console.log(err.errMsg);
},
},
});
}
},
}
</script>
......
<style lang="scss" scoped>
.allorderList{
width: 100%;
height: 100vh;
background: #ECF1F4;
.orderList{
width: 100%;
border-radius: 10px;
background: #FFF;
padding: 20px;
margin-top: 10px;
}
.orderList-top{
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
color: #111111;
}
.order_xu{
width: 100%;
height: 14px;
border-bottom: 1px dashed #E6E6E6;
}
.order_center{
width: 100%;
margin-top: 15px;
.car-o{
width: calc(100vw - 40px);
font-size: 14px;
color: #111111;
font-weight: bold;
display: flex;
align-items: center;
overflow: hidden;white-space: nowrap;text-overflow: ellipsis;
}
.car-w{
width: 100%;
font-size: 12px;
color: #333333;
font-size: 500;
margin-top: 5px;
}
.hotelbox{
display: flex;
.hotelbox-r{
width: calc(100vw - 40px - 60px);
font-size: 12px;
.text-t{
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
}
}
}
.zailaiyidan{
width: 75px;
height: 30px;
background: #111111;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
font-size: 12px;
color: #FFF;
}
}
</style>
<template>
<view class="allorderList">
<u-tabs :list="statusList" :current="current" name="Name" @change="change" :active-color="mainColor" bg-color="#FFF" bar-height='4'
height="100"></u-tabs>
<view style="height: calc(100vh - 50px); background: #fff;" v-if="g.length == 0">
<u-empty text="暂无相关订单" mode="order"></u-empty>
</view>
<view v-if="g.length > 0" style="height: calc(100vh - 50px);width: calc(100vw);overflow: hidden;padding-bottom: 20px;">
<scroll-view :scroll-y="true" :enable-back-to-top="true" :enable-flex="true" @scrolltolower="lower" :style="{ height: '100%' }">
<view class="orderList" v-for="(item, index) in g" :key="index">
<view class="orderList-top">
<span style='font-size: 16px;font-weight: 800;'>{{item.OrderTypeName}} <span style='font-size: 12px;font-weight: normal;'>({{item.OrderNo}})</span></span>
<span style='font-size: 12px;'>{{item.OrderStatusName}}</span>
</view>
<view class="order_xu"></view>
<view class="order_center" v-if="item.OrderType == 1">
<view v-for="(x,y) in item.HotelList" :key='y' >
<view class="hotelbox">
<image :src="x.HotelImage" style="width: 50px;height: 50px;border-radius: 8px;margin-right: 10px;"></image>
<view class="hotelbox-r">
<view class="text-t">{{x.HotelName}}</view>
<view>数量:{{x.RoomNumber}}</view>
<view>单价:¥{{x.Unit_Price}}</view>
</view>
</view>
<view class="order_xu"></view>
</view>
</view>
<view class="order_center" v-if="item.OrderType == 4">
<view v-for="(x,y) in item.CarList" :key='y' >
<view class="car-o" >
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/CustomizedCar/zhuanghuan.png" mode="aspectFill" style="width: 18px;height: 18px;"></image>
<span style='margin-left: 10px;'>{{x.StartCityName}}</span>
<span style='margin: 0 3px;'>-</span>
<span>{{x.ArriveCityName}}</span>
</view>
<view class="car-w">
上车地点:{{x.DepartAddress}}
</view>
<view class="car-w">
下车地点:{{x.ArriveAddress}}
</view>
<view class="car-w">
出发时间:{{x.Date}} {{x.DepartureTime}}
</view>
<view class="car-w">
总张数:{{x.PeopleNumber+x.ChildNumber}}人 单价:¥{{x.Unit_Price.toFixed(2)}}
</view>
<view class="order_xu"></view>
</view>
</view>
<view style="font-size: 14px;color: #111111;margin-top: 10px;text-align: right;">
应付:¥{{item.PreferPrice}}
</view>
<view style="display: flex;justify-content: flex-end;margin-top: 5px;">
<view class="zailaiyidan">
再来一单
</view>
</view>
</view>
<u-loadmore :status="status" :load-text="loadText" :font-size="24" :margin-top="20" :margin-bottom="20" bg-color="#ECF1F4" />
</scroll-view>
</view>
</view>
</template>
<script>
export default{
data(){
return{
pageTitle: "我的订单",
mainColor: '',
statusList:[],
current:0,
msg:{
pageIndex:1,
pageSize:20,
StartTime:'',
EndTime:'',
OrderId:0,
OrderNo:'',
OrderType:0,
OrderStatus:0,
},
loadText: {
loadmore: "轻轻上拉,加载更多",
loading: "努力加载中",
nomore: "没有更多了",
},
page_count: 1,
status: "loadmore",
g: [],
}
},
onLoad(options){
let currentPages = getCurrentPages();
let u = "/" + currentPages[currentPages.length - 1].route;
let pages = wx.getStorageSync("basedata") ?
wx.getStorageSync("basedata").bar_title : [];
pages.forEach((x) => {
if (x.value == u) {
this.pageTitle = x.new_name ? x.new_name : x.name;
}
});
uni.setNavigationBarTitle({
title: this.pageTitle,
});
this.mainColor = this.$uiConfig.mainColor;
},
created() {
this.getOrderStatusList()
},
methods:{
getOrderStatusList(){//获取订单状态枚举列表
this.request2({
url: '/api/AppletOrder/GetOrderStatusEnumList',
data: {}
},
res => {
if (res.resultCode == 1) {
this.statusList = res.data
this.statusList.unshift({Name:'全部',Id:0})
}
this.init();
},
err => {
}
);
},
change(e){//tab切换等数据
this.current = e;
this.msg.OrderStatus = this.statusList[e].Id;
this.msg.pageIndex = 1;
this.g = [];
this.init();
},
init(){
uni.showLoading({
title: '加载中...'
})
this.request2({
url: '/api/AppletOrder/GetMyDmcOrderCommonPageList',
data: this.msg
},
res => {
uni.hideLoading()
if (res.resultCode == 1) {
this.g = this.g.concat(res.data.pageData);
this.page_count = res.data.pageCount;
if (this.page_count == 1) {
this.status = "nomore";
}
}
},
err => {
uni.hideLoading()
}
);
},
lower(e) {
if (this.msg.pageIndex < this.page_count) {
this.msg.pageIndex++;
this.status = "loading";
this.init();
} else {
this.status = "nomore";
}
},
}
}
</script>
......@@ -173,8 +173,7 @@
<view class="jz_ListMain" v-for="(item,index) in dataList" :key="index" @click="goJzDetail(item.tcid,item.configId)">
<view class="jz_List">
<view class="jz_TuDiv">
<img class="jz_TuBigImg" aspectFill src="http://imgfile.oytour.com/Upload/DMC/20200603030333648.jpg"
alt="" />
<img class="jz_TuBigImg" mode="aspectFill" :src="getImgs(item.imgCover)" alt="" />
<view class="jz_TuDivBotm">
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/CustomizedCar/address.png" />成都出发
{{item.dayNum}}
......@@ -186,13 +185,15 @@
{{item.productRecommend}}
</view>
<view style="margin:10px 0">
<img class="jz_calederImg" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/CustomizedCar/canlder.png" />{{item.startDate}}<text
class="jz_Canhoubu">不可候补</text>
<img class="jz_calederImg" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/CustomizedCar/canlder.png" />{{item.startDate}}
<text class="jz_Canhoubu">
{{item.isSubstitution==0?'不可候补':'可以候补'}}
</text>
</view>
<view style="margin-bottom:10px">航班:<text></text>(余位:10)</view>
<view style="margin-bottom:10px">余位:{{item.surplus}}</view>
<view style="color:#FF3166;position: absolute;right:0;bottom:0">
<text style="font-size:20rpx;">¥</text>
<text style="font-size:36rpx;">{{item.b2BPrice}}</text>
<text style="font-size:40rpx;">{{item.b2BPrice}}</text>
<text style="font-size:20rpx;"></text>
</view>
</view>
......@@ -256,13 +257,12 @@
//获取数据
getList() {
this.apipost(
"b2b_get_GetB2BHomeLineTravelPageList",
"b2b_get_GetB2BTravelPageList",
this.msg,
res => {
if (res.resultCode == 1) {
this.dataList = this.dataList.concat(res.data.pageData);
this.page_count = res.data.pageCount;
console.log(this.dataList, 'dataList');
} else {
}
......@@ -288,6 +288,13 @@
uni.navigateTo({
url: "/pages/jiuzhai/jz_LineDetail?tcid=" + tcid +'&configId='+configId
});
},
//获取第一张图
getImgs(imgObj){
let imgArr = JSON.parse(imgObj);
if(imgArr&&imgArr.length>0){
return imgArr[0].Url
}
}
},
};
......
<style>
.jz_LineDetail {
background-color: #ECF1F4;
margin-bottom:70px;
}
.jz_TopImg {
width: 100%;
height: 500rpx;
}
.jz_TopPrice{
width:100%;
height:auto;
.jz_TopPrice {
width: 100%;
height: auto;
background-color: #fff;
position: relative;
top:-20px;
top: -20px;
border-top-left-radius: 45rpx;
border-top-right-radius: 45rpx;
padding:45rpx;
padding: 45rpx;
}
.jz_LineTitle{
font-size:25rpx;
color:#FF3166;
margin-bottom:10px;
.jz_LineTitle {
font-size: 25rpx;
color: #FF3166;
margin-bottom: 10px;
}
.jz_MainTitle{
color:#111111;
font-size:36rpx;
.jz_MainTitle {
color: #111111;
font-size: 36rpx;
font-weight: 800;
line-height: 28px;
}
.jz_Maidian{
color:#999999;
font-size:24rpx;
margin-top:15px;
.jz_Maidian {
color: #999999;
font-size: 24rpx;
margin-top: 15px;
line-height: 23px;
}
.jz_Price{
font-size:30rpx;
color:#FF3166;
.jz_Price {
font-size: 30rpx;
color: #FF3166;
}
.jz_Price_Title{
color:#000000;
margin:10px 0;
.jz_Price_Title {
color: #000000;
margin: 10px 0;
font-weight: bold;
}
.jz_Price_Hui{
color:#9cf;
margin-left:8px;
.jz_Price_Hui {
color: #9cf;
margin-left: 8px;
}
.jz_flex{
display:flex;
.jz_flex {
display: flex;
justify-content: space-between;
}
.jz_TripDays{
width:100%;
height:auto;
padding:45rpx;
margin-top:15px;
.jz_TripDays {
width: 100%;
height: auto;
padding: 45rpx;
margin-top: 15px;
background-color: #fff;
}
.trip_JZtype{
.trip_JZtype {
display: inline-block;
padding:3px 5px;
border:1px solid #257BF1;
margin-right:10px;
color:#257BF1;
font-size:13px;
padding: 3px 5px;
border: 1px solid #257BF1;
margin-right: 10px;
color: #257BF1;
font-size: 13px;
border-radius: 3px;
}
.jz_StartList{
width:22%;
height:150rpx;
.jz_StartList {
height: 150rpx;
border-radius: 20rpx;
border:1px solid #E2E2E2;
border: 1px solid #E2E2E2;
text-align: center;
display: block;
width: 70px;
margin-right: 14px;
flex-shrink: 0;
white-space: nowrap;
}
.jz_renmin{
font-size:12px;
.jz_renmin {
font-size: 12px;
font-weight: bold;
}
.jz_B2bPrice{
font-size:23px;
.jz_B2bPrice {
font-size: 23px;
font-weight: bold;
}
.jz_Service{
width:100%;
.jz_Service {
width: 100%;
background-color: #fff;
padding:30px;
font-size:24rpx;
margin-top:-5px;
padding: 30px;
font-size: 24rpx;
margin-top: -5px;
}
.jz_Serflex{
.jz_Serflex {
display: flex;
}
.jz_Stitle{
color:#999999;
margin-right:41rpx;
.jz_Stitle {
color: #999999;
margin-right: 41rpx;
}
.jz_StartTop{
width:100%;
height:40rpx;
.jz_StartTop {
width: 100%;
height: 40rpx;
background-color: #ECF1F4;
color:#999999;
color: #999999;
text-align: center;
line-height: 40rpx;
font-size: 22rpx;
}
.jz_Dian{
.jz_Dian {
display: inline-block;
width:12rpx;
height:12rpx;
width: 12rpx;
height: 12rpx;
border-radius: 50%;
background-color: #111111;
margin-right:23rpx;
margin-right: 23rpx;
position: relative;
top:-2px;
top: -2px;
}
.jz_ZhaiTitle{
color:#1F1F1F;
font-size:28rpx;
.jz_ZhaiTitle {
color: #1F1F1F;
font-size: 28rpx;
font-weight: bold;
margin-top:40rpx;
margin-top: 40rpx;
}
.jz_ZhaiInner{
color:#6E6E6E;
.jz_ZhaiInner {
color: #6E6E6E;
font-size: 24rpx;
margin:22rpx 0 0 30rpx;
margin: 22rpx 0 0 30rpx;
}
.jz_Zhankai{
width:220rpx;
height:60rpx;
.jz_Zhankai {
width: 220rpx;
height: 60rpx;
text-align: center;
line-height: 60rpx;
color:#1F1F1F;
font-size:24rpx;
color: #1F1F1F;
font-size: 24rpx;
border-radius: 8rpx;
border:1px solid #111111;
margin:40rpx auto;
border: 1px solid #111111;
margin: 40rpx auto;
}
.jz_TripMain{
.jz_TripMain {
position: relative;
overflow: hidden;
}
.jz_TripTitle{
width:100%;
height:90rpx;
.jz_TripTitle {
width: 100%;
height: 90rpx;
border-radius: 20rpx;
background:linear-gradient(90deg, #000000, rgba(255, 255, 255, 0.05));
color:#fff;
background: linear-gradient(90deg, #000000, rgba(255, 255, 255, 0.05));
color: #fff;
display: flex;
justify-content: space-between;
align-items: center;
padding:28rpx;
padding: 28rpx;
}
.jz_TripLeft{
font-size:32rpx;
.jz_TripLeft {
font-size: 32rpx;
}
.jz_TripRight{
color:#111111;
font-size:22rpx;
.jz_TripRight {
color: #111111;
font-size: 22rpx;
}
.jz_TripLine{
.jz_TripLine {
position: absolute;
width:4rpx;
height:100%;
width: 4rpx;
height: 100%;
background-color: #111111;
left:24rpx;
top:90rpx;
left: 24rpx;
top: 90rpx;
}
.jz_RightInner{
margin-left:50rpx;
.jz_RightInner {
margin-left: 50rpx;
}
.jz_Place{
position:relative;
color:#111111;
font-size:24rpx;
margin:30rpx 0;
.jz_Place {
position: relative;
color: #111111;
font-size: 24rpx;
margin: 30rpx 0;
font-weight: bold;
display: flex;
}
.jz_ComDian{
width:18rpx;
height:18rpx;
.jz_ComDian {
width: 18rpx;
height: 18rpx;
background-color: #DFBE6E;
border-radius: 50%;
position: absolute;
left:-17.6px;
top:4px;
left: -17.6px;
top: 4px;
}
.jz_ImgDiv{
width:612rpx;
height:376rpx;
.jz_ImgDiv {
width: 612rpx;
height: 376rpx;
border-radius: 20rpx;
overflow: hidden;
}
.jz_ImgDiv img{
width:100%;
height:100%;
.jz_ImgDiv img {
width: 100%;
height: 100%;
}
.jz_Rermark{
color:#999999;
font-size:23rpx;
.jz_Rermark {
color: #999999;
font-size: 23rpx;
line-height: 20px;
}
.jz_Canyin{
color:#999999;
.jz_Canyin {
color: #999999;
font-size: 23rpx;
margin-right:44rpx;
margin-right: 44rpx;
flex-shrink: 0;
}
.jz_CanInner{
color:#111111;
font-size:26rpx;
.jz_CanInner {
color: #111111;
font-size: 26rpx;
}
.jz_ArrowImg{
.jz_ArrowImg {
width: 25rpx;
height: 5rpx;
margin: 0 5px;
position: relative;
top: -3px;
}
.jz_Fenzhong{
color:#999999;
font-size:22rpx;
margin-left:10rpx;
.jz_Fenzhong {
color: #999999;
font-size: 22rpx;
margin-left: 20rpx;
}
.jz_Jinddian {
margin: 23rpx 0 31rpx 0;
color: #999999;
font-size: 23rpx;
line-height: 20px;
}
.jz_StartHoubu {
color: #E73828;
font-size: 20rpx;
margin: 10px 0;
}
.jz_OrderDiv{
position: fixed;
width:90%;
height:100rpx;
background-color: #fff;
margin:auto;
bottom:20px;
padding:20rpx;
left:40rpx;
display: flex;
justify-content: space-between;
align-items: center;
box-shadow: 0px 10px 30px 0px rgba(36, 36, 36, 0.2);
border-radius: 16px;
z-index:999;
}
.jz_OrderNow{
width:190rpx;
height:80rpx;
background-color: #111111;
text-align: center;
line-height: 80rpx;
color:#fff;
font-weight: bold;
font-size:28rpx;
border-radius: 16rpx;
}
.jz_ConButton{
background-color: #fff;
height:40px;
line-height: 18px;
margin-top:3px;
}
.jz_Jinddian{
margin-top:23rpx;
color:#999999;
font-size:23rpx;
.jz_ConButton::after{
border: none!important;
height:auto!important;
}
</style>
<template>
<div class="jz_LineDetail">
<view class="jz_TopImg">
<swiper indicator-dots :autoplay="false" :interval="1000" style="height:100%;">
<block v-for="(item, index) in getCoverImg(dataList.imgCover)" :key="index">
<block v-for="(item,cindex) in getCoverImg(dataList.imgCover)" wx:key="cindex">
<swiper-item>
<!--<video @click="startPlay(item)" style="width:100%;height:100%" id="myVideo" v-if="item.type==1" :src="item.pic_url"
:autoplay="false" loop muted show-play-btn :enable-progress-gesture="true"
......@@ -241,7 +332,7 @@
</view>
<view class="jz_TopPrice">
<view class="jz_LineTitle">
<text class="jz_renmin">¥</text><text class="jz_B2bPrice">{{dataList.priceList[0].b2BPrice}}</text>
<text class="jz_renmin">¥</text><text class="jz_B2bPrice">{{dataList.currentPriceInfo.b2BPrice}}</text>
<text style="color:#999999;font-size:14px;">/人起</text>
</view>
<view class="jz_MainTitle">
......@@ -255,14 +346,16 @@
<view class="jz_Serflex">
<view class="jz_Stitle">保障</view>
<view style="color:#111111;display:flex;align-items:center">
<img style="width:16px;height:14px;" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/CustomizedCar/zuanshi.png" alt="" />
<img style="width:16px;height:14px;" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/CustomizedCar/zuanshi.png"
alt="" />
<view style="margin-left:5px;">更改则赔付·承诺不加价·取消则赔付</view>
</view>
</view>
<view class="jz_Serflex" style="margin-top:40rpx;">
<view class="jz_Stitle">服务</view>
<view style="color:#111111;display:flex;align-items:center">
<img style="width:15px;height:15px;" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/CustomizedCar/dagou.png" alt="" />
<img style="width:15px;height:15px;" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/CustomizedCar/dagou.png"
alt="" />
<view style="margin-left:5px;">成团保障</view>
</view>
</view>
......@@ -276,18 +369,13 @@
<span style="width:40px;background-color: #DFBE6E;height: 6px;bottom: 2px;left: 0;right: 0;position: absolute;z-index: 1;"></span>
</span>
</view>
<view style="display:flex;justify-content: space-between;">
<view class="jz_StartList">
<view class="jz_StartTop"></view>
<view style="display:flex;overflow-x: auto;">
<view class="jz_StartList" v-for="item in dataList.priceList" @click="getDayInfo(item)">
<view class="jz_StartTop">{{getMonth(item.startDate)}}{{item.remainNum}}</view>
<view class="jz_StartHoubu">
{{item.isSubstitution==1?'可候补':'不可候补'}}
</view>
<view class="jz_StartList">
</view>
<view class="jz_StartList">
</view>
<view class="jz_StartList">
<view style="color:#FF3166;font-size:26rpx;">{{item.b2BPrice}}</view>
</view>
</view>
</view>
......@@ -300,27 +388,29 @@
<text class="jz_Dian"></text>住宿
</view>
<view class="jz_ZhaiInner">
2晚4钻酒店
{{dataList.nightNum}}酒店
</view>
<template v-if="dataList.feature&&dataList.feature.shopRemarkText!=null&&dataList.feature.shopRemarkText!=''">
<view class="jz_ZhaiTitle">
<text class="jz_Dian"></text>购物
</view>
<view class="jz_ZhaiInner">
无购物
{{dataList.feature.shopRemarkText}}
</view>
</template>
<view class="jz_ZhaiTitle">
<text class="jz_Dian"></text>景点
</view>
<view class="jz_ZhaiInner">
51个景点,含23个人气景点
{{scenicNum}}个人气景点
</view>
<view class="jz_ZhaiTitle">
<text class="jz_Dian"></text>餐食
</view>
<view class="jz_ZhaiInner">
成人含2早餐2午餐2晚餐 儿童含2早餐2午餐2晚餐
含{{breakfastNum}}早餐 <text style="margin:0 20px;">{{lunchNum}}午餐</text> {{dinnerNum}}晚餐
</view>
<view class="jz_Zhankai">展开全部</view>
<view class="jz_Zhankai" style="display:none;">展开全部</view>
</view>
<view class="jz_TripDays">
<span style="display: inline-block;position: relative;margin-bottom:40rpx;">
......@@ -329,110 +419,83 @@
</span>
<view class="jz_TripMain">
<view class="jz_TripLine"></view>
<view v-for="(item,index) in dataList.dayList" wx:key="index">
<view class="jz_TripTitle">
<view class="jz_TripLeft">第01天</view>
<view class="jz_TripRight">2020-03-11</view>
</view>
<view class="jz_RightInner">
<view class="jz_Place">
<view class="jz_ComDian"></view>成都双流国际机场集合
</view>
<view class="jz_ImgDiv">
<img src="http://imgfile.oytour.com/Upload/DMC/20200603030333648.jpg" alt="">
</view>
<view class="jz_Place">温馨提示</view>
<view class="jz_Rermark">
1、行程中,若遇天气或航空公司、国外路程塞车之不可抗拒之 因素时,请贵宾们稍加耐心等候。如塞车情形严重,而会影响到 行程或餐食的安排时,为维护旅游品质及贵宾们的权益,我们将 为您斟酌调整并妥善安排旅游行程,敬请贵宾们谅解。 2、本行程设定为团体旅游行程,故为顾及旅客于出游期间之人 身安全及相关问题,于旅游行程期间,恕无法接受脱队之要求; 若因此而无法满足您的旅游需求,建议您另行选购团体自由行或 航空公司套装自由行,不便之处,尚祈谅解。 3、我们为维护旅游品质及贵宾们的权益,在不变更行程内容之 前提下,将依饭店具体确认回复的结果,再综合当地实际交通等 情况,为贵宾们斟酌调整并妥善安排旅游行程、饭店入住之先后 顺序或旅游路线,请以说明会或最后确认的行程说明资料为准。 4、素食:因各地风俗民情不同,国外的素食习惯大多是可以食 用葱、姜、蒜、蛋、奶等,除华侨开设的中华料理餐厅外,多数 仅能以蔬菜、豆腐等食材料理为主;若为饭店内用餐或一般餐厅 使用自助餐,亦多数以蔬菜、渍物、水果等佐以白饭或面食类。
</view>
<view class="jz_Place">
<view class="jz_ComDian"></view>
<text class="jz_Canyin">餐饮</text>
<text class="jz_CanInner">
早餐自理 午餐自理 晚餐自理
</text>
</view>
<view class="jz_Place">
<view class="jz_ComDian"></view>
<text class="jz_Canyin">酒店</text>
<text class="jz_CanInner">
本日无酒店安排
</text>
</view>
</view>
<view class="jz_TripTitle">
<view class="jz_TripLeft">第02天</view>
<view class="jz_TripRight">2020-03-12</view>
<view class="jz_TripLeft">第{{getDays(index+1)}}天</view>
<view class="jz_TripRight"></view>
</view>
<view class="jz_RightInner">
<view v-for="(subItem,SubIndex) in item.dayArray" v-if="subItem.type==7" wx:key="SubIndex">
<view class="jz_Place">
<view class="jz_ComDian"></view>
温泉酒店<img class="jz_ArrowImg" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/CustomizedCar/arrow_right.png" />地狱谷(红叶名所*)
<text>{{subItem.childItem.title}}</text>
</view>
<view class="jz_Place">
<view class="jz_ComDian"></view>
<text class="jz_Canyin">景点</text>
<text class="jz_CanInner">
登别地狱谷(火山口遗迹) <text class="jz_Fenzhong">约40分钟</text>
</text>
</view>
<template v-for="(subItem,index2) in item.dayArray" v-if="subItem.type==2" wx:key="index2">
<view class="jz_ImgDiv">
<img src="http://imgfile.oytour.com/Upload/DMC/20200603030333648.jpg" alt="">
</view>
<view class="jz_Jinddian">
登别的名字来自于古老的阿依努语"ヌプルペッ",意思是白色浑
浊的河流;地狱谷是登别温泉的泉源,也是登别温泉最著名的景
点,火山地貌景色极为壮观。地狱谷是一个火山喷发的遗址,在
这里,火山气体从灰黄色的岩石表面向外喷出,周围空气中充满
了浓烈的硫磺异味,而且这里寸草不生,故名地狱谷。群山环抱
,烟雾缭绕,再配上当地特产的手持狼牙棒的妖魔鬼怪们,置身
其中,仿佛进入了耳鼻地狱。地狱谷的尽头有一口“间歇泉"每隔
一段时间,泉水就会喷发,这里的泉水温度可有80度。如您能早
起、每天凌晨6点左右,还可以看到初升阳光下的"生紫烟"效果
呢。
<img mode="aspectFill" :src="subItem.childItem.imaArray[0].url" alt="">
</view>
<view class="jz_Place">
<view class="jz_Place" style="align-items: center;">
<view class="jz_ComDian"></view>
<text class="jz_Canyin">景点</text>
<text class="jz_CanInner">
登别地狱谷(火山口遗迹) <text class="jz_Fenzhong">约40分钟</text>
{{subItem.childItem.couponsName}}
<text class="jz_Fenzhong">
<template v-if="subItem.childItem.playTimeHour||subItem.childItem.playTimeMinutes"></template>
<template v-if="subItem.childItem.playTimeHour">{{subItem.childItem.playTimeHour}}小时</template>
<template v-if="subItem.childItem.playTimeMinutes">{{subItem.childItem.playTimeMinutes}}分钟</template>
</text>
</text>
</view>
<view class="jz_ImgDiv">
<img src="http://imgfile.oytour.com/Upload/DMC/20200603030333648.jpg" alt="">
</view>
<view class="jz_Jinddian">
登别的名字来自于古老的阿依努语"ヌプルペッ",意思是白色浑
浊的河流;地狱谷是登别温泉的泉源,也是登别温泉最著名的景
点,火山地貌景色极为壮观。地狱谷是一个火山喷发的遗址,在
这里,火山气体从灰黄色的岩石表面向外喷出,周围空气中充满
了浓烈的硫磺异味,而且这里寸草不生,故名地狱谷。群山环抱
,烟雾缭绕,再配上当地特产的手持狼牙棒的妖魔鬼怪们,置身
其中,仿佛进入了耳鼻地狱。地狱谷的尽头有一口“间歇泉"每隔
一段时间,泉水就会喷发,这里的泉水温度可有80度。如您能早
起、每天凌晨6点左右,还可以看到初升阳光下的"生紫烟"效果
呢。
{{subItem.childItem.descriptionText}}
</view>
</template>
<view class="jz_Place">温馨提示</view>
<view class="jz_Rermark">
1、行程中,若遇天气或航空公司、国外路程塞车之不可抗拒之 因素时,请贵宾们稍加耐心等候。如塞车情形严重,而会影响到 行程或餐食的安排时,为维护旅游品质及贵宾们的权益,我们将 为您斟酌调整并妥善安排旅游行程,敬请贵宾们谅解。 2、本行程设定为团体旅游行程,故为顾及旅客于出游期间之人 身安全及相关问题,于旅游行程期间,恕无法接受脱队之要求; 若因此而无法满足您的旅游需求,建议您另行选购团体自由行或 航空公司套装自由行,不便之处,尚祈谅解。 3、我们为维护旅游品质及贵宾们的权益,在不变更行程内容之 前提下,将依饭店具体确认回复的结果,再综合当地实际交通等 情况,为贵宾们斟酌调整并妥善安排旅游行程、饭店入住之先后 顺序或旅游路线,请以说明会或最后确认的行程说明资料为准。 4、素食:因各地风俗民情不同,国外的素食习惯大多是可以食 用葱、姜、蒜、蛋、奶等,除华侨开设的中华料理餐厅外,多数 仅能以蔬菜、豆腐等食材料理为主;若为饭店内用餐或一般餐厅 使用自助餐,亦多数以蔬菜、渍物、水果等佐以白饭或面食类。
<template v-for="(subItem,sIndex) in item.dayArray" v-if="subItem.type==6" wx:key="sIndex">
{{subItem.childItem.descriptionText}}
</template>
</view>
<view class="jz_Place">
<view class="jz_ComDian"></view>
<text class="jz_Canyin">餐饮</text>
<text class="jz_CanInner">
早餐自理 午餐自理 晚餐自理
<template v-for="(subItem,sIndex2) in item.dayArray" v-if="subItem.type==4" wx:key="sIndex2">
<text style="margin-right:20px;" v-if="subItem.childItem.useDinnerType=='1'">{{subItem.childItem.dinnerName}}</text>
<text style="margin-right:20px;" v-if="subItem.childItem.useDinnerType=='2'">{{subItem.childItem.dinnerName}}</text>
<text v-if="subItem.childItem.useDinnerType=='3'">{{subItem.childItem.dinnerName}}</text>
</template>
</text>
</view>
<view class="jz_Place">
<view class="jz_ComDian"></view>
<text class="jz_Canyin">酒店</text>
<text class="jz_CanInner">
本日无酒店安排
<template v-for="(subItem,sIndex3) in item.dayArray" v-if="subItem.type==3" wx:key="sIndex3">
<text>{{subItem.childItem.hotelName}}<text v-if="index!=dataList.dayList.length-1" style="margin:0 5px;">/</text></text>
</template>
<text v-if="index!=dataList.dayList.length-1">或同级</text>
</text>
</view>
</view>
</view>
</view>
</view>
<view class="jz_OrderDiv">
<view style="color:#FF3166;font-weight:bold;">
<text style="font-size:22rpx;">¥</text>
<text style="font-size:40rpx;">{{dataList.currentPriceInfo.b2BPrice}}</text>
<text style="font-size:22rpx;">/起</text>
</view>
<view style="display:flex;">
<button open-type="contact" class="jz_ConButton">
<img style="width:36rpx;height:38rpx;" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/CustomizedCar/kefu.png" alt="" />
<view style="color:#111111;font-size: 22rpx;">客服</view>
</button>
<view class="jz_OrderNow" @click="goReserce()">立即预定</view>
</view>
</view>
</div>
</template>
<script>
......@@ -449,29 +512,53 @@
},
dataList: {}, //数据
delMsg: {
tcid: 0
tcid: 0,
configId: 0
},
scenicNum: 0, // 景点数量
breakfastNum: 0, //早餐数
lunchNum: 0, //午餐数
dinnerNum: 0 //晚餐数
};
},
created() {
},
onLoad(option) {
if (option.tcid) {
if (option.tcid && option.configId) {
this.delMsg.tcid = option.tcid;
this.delMsg.configId = option.configId;
this.getDetails();
}
},
methods: {
//获取详情
getDetails() {
this.apipost(
"b2b_get_GetB2BTravelInfoNoDes",
"b2b_get_GetB2BTravelInfoNoDesV1",
this.delMsg,
res => {
console.log(res, '详情');
if (res.resultCode == 1) {
this.dataList = res.data;
this.scenicNum = 0;
this.dataList.dayList.forEach(x => {
x.dayArray.forEach(y => {
if (y.type == 2) {
this.scenicNum++;
}
if (y.type == 4 && y.childItem.useDinnerType == 1) {
this.breakfastNum++;
}
if (y.type == 4 && y.childItem.useDinnerType == 2) {
this.lunchNum++;
}
if (y.type == 4 && y.childItem.useDinnerType == 3) {
this.dinnerNum++;
}
})
})
} else {
}
......@@ -484,6 +571,35 @@
if (imgCover) {
return JSON.parse(imgCover)
}
},
//返回天数
getDays(day) {
if (day < 10) {
return '0' + day
} else {
return day
}
},
//返回月 日
getMonth(day) {
if (day) {
let Myday = day.split('-');
return Myday[1] + '-' + Myday[2]
}
},
//点击切换
getDayInfo(item){
this.delMsg.tcid = item.tcid;
this.delMsg.configId = item.configID;
this.getDetails();
},
//立即预定
goReserce(){
let myCurrentInfo = this.dataList.currentPriceInfo;
myCurrentInfo.startCityName = this.dataList.startCityName;
uni.navigateTo({
url: "/pages/jiuzhai/jz_Reserve?currentPriceInfo="+JSON.stringify(myCurrentInfo)
});
}
},
};
......
<style>
.jz_ReserTop {
width: 100%;
min-height: 300rpx;
box-shadow: 0px 2px 15px 0px rgba(76, 76, 76, 0.13);
background-color: #fff;
border-bottom-left-radius: 60rpx;
border-bottom-right-radius: 60rpx;
padding: 40rpx;
}
.jz_ReserTitle {
color: #111111;
font-weight: bold;
font-size: 36rpx;
}
.jz_ReserIn {
color: #999999;
font-size: 24rpx;
}
.jz_ReseQue {
color: #DFBE6E;
font-size: 24rpx;
padding-top: 30rpx;
border-top: 1px solid #E7E7E7;
margin-top: 20px;
}
.jz_ReseQue img {
width: 16px;
height: 14px;
position: relative;
top: 2px;
margin-right: 5px;
}
.jz_ReseOrder {
padding: 40rpx;
}
.jz_ReDix {
display: flex;
align-items: center;
margin-bottom: 10px;
}
.jz_RedixTitle {
width: 90px;
flex-shrink: 0;
}
.jz_OrderDiv {
position: fixed;
width: 90%;
height: 100rpx;
background-color: #fff;
margin: auto;
bottom: 20px;
padding: 20rpx;
left: 40rpx;
display: flex;
justify-content: space-between;
align-items: center;
box-shadow: 0px 10px 30px 0px rgba(36, 36, 36, 0.2);
border-radius: 16px;
z-index: 999;
}
.jz_OrderNow {
width: 190rpx;
height: 80rpx;
background-color: #111111;
text-align: center;
line-height: 80rpx;
color: #fff;
font-weight: bold;
font-size: 28rpx;
border-radius: 16rpx;
}
</style>
<template>
<view class="jz_Reserve">
<view class="jz_ReserTop">
<view class="jz_ReserTitle">
{{currentPriceInfo.title}}
</view>
<view class="jz_ReserIn" style="margin:33rpx 0 18rpx 0">
{{currentPriceInfo.startCityName}}出发 {{currentPriceInfo.startDate}}
</view>
<view class="jz_ReseQue">
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/CustomizedCar/zuanshi.png" />即时确认:本产品付款后可快速确认,放心期待您的旅行
</view>
</view>
<view class="jz_ReseOrder">
<view class="jz_ReDix">
<view class="jz_RedixTitle">成人:</view>
<u-number-box v-model="orderMsg.crCount" :input-width="300" :input-height="60"></u-number-box>
</view>
<view class="jz_ReDix">
<view class="jz_RedixTitle">儿童不占床:</view>
<u-number-box v-model="orderMsg.etbzcCount" :input-width="300" :input-height="60"></u-number-box>
</view>
<view class="jz_ReDix">
<view class="jz_RedixTitle">儿童占床:</view>
<u-number-box v-model="orderMsg.etzc" :input-width="300" :input-height="60"></u-number-box>
</view>
<view class="jz_ReDix">
<view class="jz_RedixTitle">婴儿:</view>
<u-number-box v-model="orderMsg.yeCount" :input-width="300" :input-height="60"></u-number-box>
</view>
</view>
<view class="jz_OrderDiv">
<view style="color:#FF3166;font-weight:bold;">
<text style="font-size:22rpx;">¥</text>
<text style="font-size:40rpx;margin:0 20rpx 0 5rpx;">{{price}}</text>
<text style="color:#6E6E6E;font-size:24rpx;">共计2人</text>
</view>
<view style="display:flex;margin-top:-2px;">
<view class="jz_OrderNow" @click="goPay()">去支付</view>
</view>
</view>
</view>
</template>
<script>
export default {
components: {
},
data() {
return {
pageTitle: '订单填写',
orderMsg: {
crCount: 0, //成人
etbzcCount: 0, //儿童不占床
etzc: 0, //儿童占床
yeCount: 0, //婴儿
etCount:0
},
currentPriceInfo: {}
};
},
created() {
},
onLoad(option) {
if (option.currentPriceInfo) {
this.currentPriceInfo = JSON.parse(option.currentPriceInfo)
}
},
watch: {
orderMsg: {
handler(n, o) {
this.calcMoney()
},
deep: true,
price:0
},
},
methods: {
changeChenRen() {
},
//计算价格
calcMoney() {
console.log('进入');
this.orderMsg.etCount = this.orderMsg.etbzcCount + this.orderMsg.etzc;
let money = this.currentPriceInfo.b2BMemberPrice * this.orderMsg.crCount
money += this.currentPriceInfo.b2BMemberPrice * this.orderMsg.etCount
money += this.currentPriceInfo.babyChargePrice * this.orderMsg.etCount
money += this.currentPriceInfo.childNeedPrice * this.chosenObj.etzc
if (this.chosenObj.etbzcCount > 0)
money -= this.currentPriceInfo.childNoNeedPrice * this.chosenObj.etbzcCount
money += this.currentPriceInfo.babyPrice * this.chosenObj.yeCount
let sumCount = this.chosenObj.crCount + this.chosenObj.etCount
money += this.currentPriceInfo.visaPrice * sumCount
money += this.currentPriceInfo.otherPrice * sumCount
if (this.currentPriceInfo.discountPric && this.currentPriceInfo.discountPric > 0) {
this.zaoniao = this.currentPriceInfo.discountPrice * sumCount
}
money -= this.zaoniao
this.price = money
},
//去支付
goPay() {
}
}
};
</script>
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