Commit 7a7d2218 authored by 华国豪's avatar 华国豪 🙄
parents a5468fc4 527f87d5
...@@ -101,7 +101,7 @@ export default { ...@@ -101,7 +101,7 @@ export default {
<style> <style>
@import './assets/global/font.css'; @import './assets/global/font.css';
@import '//at.alicdn.com/t/font_863923_vy92y4agl2.css'; @import '//at.alicdn.com/t/font_863923_gfxa4q9jlne.css';
@import './assets/global/global.css'; @import './assets/global/global.css';
@import './assets/css/common.css'; @import './assets/css/common.css';
body,html{ body,html{
......
<template> <template>
<div class="commonF FreeDetail" v-if="loading"> <div v-loading="detailLoading" class="commonF FreeDetail" v-if="loading">
<div class="w1200"> <div class="w1200">
<div class="bannerImg" :style="{background:'url(' + ActiveSrc + ') no-repeat bottom left/100% auto'}"> <div @click="BigImgShow" class="bannerImg" :style="{background:'url(' + ActiveSrc + ') no-repeat center left/100% auto'}">
<!-- <img style="width:100%;" :src="ActiveSrc" :onerror="defaultImg" alt=""> --> <!-- <img style="width:100%;" :src="ActiveSrc" :onerror="defaultImg" alt=""> -->
<ul class="banImgList basefix"> <ul v-if="dataDetail.img_list" class="banImgList basefix">
<li @mouseover="LiHover(item,index)" :class="LiactiveIndex==index?'Liactive':''" v-if="index<6" v-for="(item,index) in dataDetail.img_list" :key="index"> <li @mouseover="LiHover(item,index)" :class="LiactiveIndex==index?'Liactive':''" v-if="index<6" v-for="(item,index) in dataDetail.img_list" :key="index">
<img :src="item.img_url" alt=""> <img :src="item.img_url" alt="">
</li> </li>
</ul> </ul>
</div> </div>
<div class="Content basefix" style="margin-top:20px;margin-bottom:50px"> <div class="Content basefix" style="margin-top:20px;margin-bottom:50px">
<div class="left" style="width:795px;margin-right:47px"> <div class="left" style="width:795px;margin-right:47px">
<p class="pfR">{{rePlace(dataDetail.prod_name)}}</p> <p v-if="dataDetail.prod_name" class="pfR">{{rePlace(dataDetail.prod_name)}}</p>
<p class="f14 c99" style="margin:15px 0">{{dataDetail.introduction}}</p> <p v-if="dataDetail.introduction" class="f14 c99" style="margin:15px 0">{{rePlace(dataDetail.introduction)}}</p>
<el-row class="titleEl f14"> <el-row class="titleEl f14">
<el-col :span="6"> <el-col :span="6">
...@@ -21,7 +21,8 @@ ...@@ -21,7 +21,8 @@
</el-col> </el-col>
<el-col :span="6"> <el-col :span="6">
<img src="../../assets/img/free/yy.png" alt=""> <img src="../../assets/img/free/yy.png" alt="">
<span v-for="(item, index) in dataDetail.guide_lang_list">{{item.lang_name}} <span v-if="index != dataDetail.guide_lang_list.length -1 ">/</span> </span> <span v-for="(item, index) in dataDetail.guide_lang_list">{{item.lang_name}}
<span v-if="index != dataDetail.guide_lang_list.length -1 ">/</span> </span>
</el-col> </el-col>
<el-col :span="6"> <el-col :span="6">
<img src="../../assets/img/free/yxq.png" alt=""> <img src="../../assets/img/free/yxq.png" alt="">
...@@ -42,7 +43,7 @@ ...@@ -42,7 +43,7 @@
<span class="f18 pfR">方案选择</span> <span class="f18 pfR">方案选择</span>
</div> </div>
<div style="padding-left:20px"> <div style="padding-left:20px">
<p class="f12" style="margin-top:20px">请选择预计前往{{dataDetail.prod_name}}日期</p> <p v-if="dataDetail.prod_name" class="f12" style="margin-top:20px">请选择预计前往{{rePlace(dataDetail.prod_name)}}日期</p>
<!-- --> <!-- -->
<el-popover popper-class="calendarPopover" v-model="visible" <el-popover popper-class="calendarPopover" v-model="visible"
placement="bottom-start" placement="bottom-start"
...@@ -71,11 +72,14 @@ ...@@ -71,11 +72,14 @@
</span> </span>
</div> </div>
</el-popover> </el-popover>
<p v-show="mealType.pkgs.length>0" class="f14 pfR">套餐列表</p> <div v-if="mealType.pkgs">
<div style="margin-top:16px" class="typeList"> <p v-show="mealType.pkgs.length>0" class="f14 pfR">套餐列表</p>
<span :class="mealTypeindex==index?'mealactive':''" @click="getmealTypeItem(item,index)" v-for="(item,index) in mealType.pkgs" :key="index+100">{{item.pkg_name}}</span> <div style="margin-top:16px" class="typeList">
<span :class="mealTypeindex==index?'mealactive':''" @click="getmealTypeItem(item,index)" v-for="(item,index) in mealType.pkgs" :key="index+100">{{item.pkg_name}}</span>
</div>
</div> </div>
<div v-show="mealTypeindex!=-1"> <div v-show="mealTypeindex!=-1">
<p style="margin:15px 0" class="f14 pfR">年龄范围</p> <p style="margin:15px 0" class="f14 pfR">年龄范围</p>
<el-row style="margin-bottom:10px"> <el-row style="margin-bottom:10px">
...@@ -117,25 +121,30 @@ ...@@ -117,25 +121,30 @@
<div style="margin-bottom:20px;line-height:2"> <div style="margin-bottom:20px;line-height:2">
{{dataDetail.prod_desc}} {{dataDetail.prod_desc}}
</div> </div>
<p class="f14 pfR" style="color:#000000;margin-bottom:15px" v-if="dataDetail.tour_list.length>0">行程列表</p> <div v-if="dataDetail.tour_list&&dataDetail.tour_list.length>0">
<div v-for="(item,index) in dataDetail.tour_list" :key="index+100"> <p class="f14 pfR" style="color:#000000;margin-bottom:15px">行程列表</p>
<p>{{item.tour_day}}</p> <div v-for="(item,index) in dataDetail.tour_list" :key="index+100">
<p style="padding:8px 0">说明{{item.tour_desc}}</p> <p>{{item.tour_day}}</p>
<div> <p v-if="item.tour_desc" style="padding:8px 0">说明{{rePlace(item.tour_desc)}}</p>
<img v-if="item.photo_url&&item.photo_url!=''" style="width:100%;height: auto;display:block" :src="ConcatImg(item.photo_url)" alt=""> <div>
<img v-if="item.photo_url&&item.photo_url!=''" style="width:100%;height: auto;display:block" :src="ConcatImg(item.photo_url)" alt="">
</div>
</div> </div>
</div> </div>
<p class="f14 pfR" style="color:#000000;margin-bottom:15px" v-if="dataDetail.meal_list.length>0">餐食列表</p> <div v-if="dataDetail.meal_list&&dataDetail.meal_list.length>0">
<div v-for="(item,index) in dataDetail.meal_list" :key="index+100"> <p class="f14 pfR" style="color:#000000;margin-bottom:15px" >餐食列表</p>
<p>行程第{{item.tour_day}}天提供餐食</p> <div v-for="(item,index) in dataDetail.meal_list" :key="index+100">
<p style="padding:8px 0"> <p>行程第{{item.tour_day}}天提供餐食</p>
<span>早餐:{{item.is_breakfast}}</span> <p style="padding:8px 0">
<span>午餐:{{item.is_lunch}}</span> <span>早餐:{{item.is_breakfast}}</span>
<span>晚餐:{{item.is_dinner}}</span> <span>午餐:{{item.is_lunch}}</span>
</p> <span>晚餐:{{item.is_dinner}}</span>
</p>
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -163,7 +172,7 @@ ...@@ -163,7 +172,7 @@
</ul> </ul>
</div> </div>
<div class="commomStyle"> <div v-if="dataDetail.remind_list&&dataDetail.remind_list.length>0" class="commomStyle">
<div class="titleDiv"> <div class="titleDiv">
<span class="redSpan"></span> <span class="redSpan"></span>
<span class="f18 pfR">注意事项</span> <span class="f18 pfR">注意事项</span>
...@@ -180,11 +189,11 @@ ...@@ -180,11 +189,11 @@
<span class="cee f26 pfR">¥ {{msgObj.MySelfTotalPrice}}</span> <span class="cee f26 pfR">¥ {{msgObj.MySelfTotalPrice}}</span>
<!-- <span class="c66 f12">/起</span> --> <!-- <span class="c66 f12">/起</span> -->
</div> </div>
<p style="padding-left:20px;margin-top:20px"> <p v-if="dataDetail.prod_comment_info" style="padding-left:20px;margin-top:20px">
<img style="width:12px;height:14px" src="../../assets/img/free/huo.png" alt=""> <img style="width:12px;height:14px" src="../../assets/img/free/huo.png" alt="">
<span class="f14 pfR" style="color:#111111;margin-left:8px">{{dataDetail.prod_comment_info.sales_qty}}+已订购</span> <span class="f14 pfR" style="color:#111111;margin-left:8px">{{dataDetail.prod_comment_info.sales_qty}}+已订购</span>
</p> </p>
<el-row style="margin:20px"> <el-row v-if="dataDetail.prod_comment_info" style="margin:20px">
<el-col :span="3">{{dataDetail.prod_comment_info.avg_scores}}</el-col> <el-col :span="3">{{dataDetail.prod_comment_info.avg_scores}}</el-col>
<el-col :span="11"><el-rate <el-col :span="11"><el-rate
v-model="dataDetail.prod_comment_info.avg_scores" v-model="dataDetail.prod_comment_info.avg_scores"
...@@ -200,6 +209,20 @@ ...@@ -200,6 +209,20 @@
</div> </div>
</div> </div>
</div> </div>
<!-- 放大 -->
<div @click="BigShow=false" class="BigImg" v-show="BigShow">
<div @click="BigShow=false" v-if="dataDetail.img_list" style="width:950px;position:relative">
<span class="iconfont icon-close_icon" style="position:absolute;right:-50px;top:-50px;font-size:50px;color:#fff;z-index:20000"></span>
<!-- <img @click.stop.prevent="CloseImg(1)" src="../../assets/img/free/cha.png" alt=""> -->
<el-carousel height="600px">
<el-carousel-item v-for="(item,index) in dataDetail.img_list" :key="index">
<div style="width:100%;height:100%" :style="{background:'url(' + item.img_url + ') no-repeat center left/100% auto'}"></div>
<!-- <img :src="item.img_url" alt=""> -->
</el-carousel-item>
</el-carousel>
</div>
</div>
</div> </div>
</template> </template>
<script> <script>
...@@ -211,6 +234,8 @@ export default { ...@@ -211,6 +234,8 @@ export default {
}, },
data () { data () {
return { return {
BigShow:false,
detailLoading:true,
rightNav:false, rightNav:false,
eventTypeindex:-1, eventTypeindex:-1,
mealTypeindex:-1, mealTypeindex:-1,
...@@ -221,7 +246,7 @@ export default { ...@@ -221,7 +246,7 @@ export default {
classArray: [], classArray: [],
num:1, num:1,
dataDetail: {}, dataDetail: {},
loading: false, loading: true,
DomainUrl:"", DomainUrl:"",
ActiveSrc:'', ActiveSrc:'',
defaultImg: 'this.src="' + require('assets/img/juan/error.png') + '"', defaultImg: 'this.src="' + require('assets/img/juan/error.png') + '"',
...@@ -268,6 +293,10 @@ export default { ...@@ -268,6 +293,10 @@ export default {
}, },
methods: { methods: {
BigImgShow(){
this.BigShow=true;
},
handleScroll(){ handleScroll(){
// console.log("this.scrollobj",this.scrollobj.scrollTop) // console.log("this.scrollobj",this.scrollobj.scrollTop)
this.scrollTop=this.scrollobj.scrollTop; this.scrollTop=this.scrollobj.scrollTop;
...@@ -280,7 +309,11 @@ export default { ...@@ -280,7 +309,11 @@ export default {
}, },
rePlace(str){ rePlace(str){
return str.replace('KKday', '印象之旅'); if(str.indexOf('KKday')!=-1){
return str.replace('KKday', '印象之旅');
}else{
return str;
}
}, },
PriceChange(){ PriceChange(){
let that=this; let that=this;
...@@ -441,6 +474,7 @@ export default { ...@@ -441,6 +474,7 @@ export default {
this.creatCalendar(list) this.creatCalendar(list)
}, },
getDetails(id){ getDetails(id){
this.detailLoading=true;
// http://efficient.oytour.com/api/kkday/QueryProduct // http://efficient.oytour.com/api/kkday/QueryProduct
this.apiJavaPost( this.apiJavaPost(
"/api/kkday/QueryProduct", "/api/kkday/QueryProduct",
...@@ -449,19 +483,22 @@ export default { ...@@ -449,19 +483,22 @@ export default {
"locale":"zh-cn" "locale":"zh-cn"
}, },
res => { res => {
this.detailLoading=false;
if (res.data.data.result === "00") { if (res.data.data.result === "00") {
this.loading=true;
this.DomainUrl=res.data.data.KkdayDomain; this.DomainUrl=res.data.data.KkdayDomain;
let data = res.data.data.prod let data = res.data.data.prod
this.loading = true
this.dataDetail = data; this.dataDetail = data;
if(this.dataDetail.prod_comment_info.avg_scores){ if(this.dataDetail.prod_comment_info.avg_scores){
this.dataDetail.prod_comment_info.avg_scores=Number(this.dataDetail.prod_comment_info.avg_scores); this.dataDetail.prod_comment_info.avg_scores=Number(this.dataDetail.prod_comment_info.avg_scores);
} }
if(this.dataDetail.img_list.length>0){ if(this.dataDetail.img_list.length>0){
this.ActiveSrc=this.DomainUrl+this.dataDetail.img_list[0].img_url; this.ActiveSrc=this.dataDetail.img_list[0].img_url;
} }
} else { } else {
this.loading=false;
this.Error(res.data.data.result_msg) this.Error(res.data.data.result_msg)
} }
}, },
...@@ -549,6 +586,17 @@ export default { ...@@ -549,6 +586,17 @@ export default {
<style> <style>
@import '../../assets/css/common.css'; @import '../../assets/css/common.css';
.FreeDetail .BigImg{
position: fixed;
z-index: 1000;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.5);
top: 0;
display: flex;
align-items: center;
justify-content: center;
}
.FreeDetail .rightFixed{ .FreeDetail .rightFixed{
position: fixed; position: fixed;
top: 0; top: 0;
......
<template> <template>
<div class="OrderCon commonF"> <div class="OrderCon commonF" style="padding-bottom:20px">
<div class="w1200"> <div class="w1200">
<div class="Content basefix" style="margin-top:20px"> <div class="Content basefix" style="margin-top:20px">
...@@ -157,10 +157,10 @@ ...@@ -157,10 +157,10 @@
</div> </div>
</div> </div>
</el-form> </el-form>
<el-button :loading="BtnLoading" @click="PayBtn" class="OrderConBtn"> <!-- <el-button :loading="BtnLoading" @click="PayBtn" class="OrderConBtn">
下一步,支付 下一步,支付
</el-button> </el-button> -->
</div> </div>
</div> </div>
<div class="right" style="width:388px;box-sizing:border-box"> <div class="right" style="width:388px;box-sizing:border-box">
...@@ -170,7 +170,7 @@ ...@@ -170,7 +170,7 @@
</div> </div>
<div style="padding:15px"> <div style="padding:15px">
<el-row class="cee f22"> <el-row class="cee f22">
<el-col :span="10">{{rePlace(freeMsg.prod_name)}}</el-col> <el-col :span="10"><span v-if="freeMsg.prod_name">{{rePlace(freeMsg.prod_name)}}</span></el-col>
<el-col :span="14" style="text-align:right"> <el-col :span="14" style="text-align:right">
<p class="cee f22 pfR" v-if="dataDetail.prod"> <p class="cee f22 pfR" v-if="dataDetail.prod">
<span v-if="dataDetail.prod.policy_no=='1'">不扣手续费,退全额</span> <span v-if="dataDetail.prod.policy_no=='1'">不扣手续费,退全额</span>
...@@ -299,7 +299,11 @@ export default { ...@@ -299,7 +299,11 @@ export default {
}, },
methods: { methods: {
rePlace(str){ rePlace(str){
return str.replace('KKday', '印象之旅'); if(str.indexOf('KKday')!=-1){
return str.replace('KKday', '印象之旅');
}else{
return str;
}
}, },
GenderSelect(){ GenderSelect(){
this.$forceUpdate() this.$forceUpdate()
......
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