Commit 85182109 authored by huangyuanyuan's avatar huangyuanyuan

1

parent 607a0613
<template>
<div class="visaList">
<div class="visaList IndependentList">
<!-- <div style="padding:10px 0">
<el-row :gutter="24" style="box-shadow:0px 4px 8px 0px rgba(107,107,107,0.18);">
<div class="common_width">
......@@ -131,7 +131,9 @@
{{item.lineName}}+{{item.ltName}}+{{item.productRecommend}}
</p>
<p v-if="item.priceTags"><span v-for="(tag,index) in item.priceTags" :key="index+100" class=tag>{{tag}}</span></p>
<p>{{item.startCityName}}出发</p>
<p>
<i class="iconfont icon-bb-chufadi"></i>
{{item.startCityName}}出发</p>
<p>出发日期:最早{{item.startDate}}出发</p>
</el-col>
<el-col :span="4" style="color:#FF680B;font-size:16px;">
......@@ -226,10 +228,6 @@ export default {
},
created(){
if(this.$route.query.id){
this.listmsg.visaCountryId=Number(this.$route.query.id);
}
},
mounted() {
// this.GetVisaCountry();
......@@ -456,6 +454,10 @@ export default {
<style>
@import "../../assets/css/reset.css";
.IndependentList .icon-bb-chufadi{
font-size: 12px;
color: #666;
}
.visaList .orderbyitem .orderby-group{
float: left;
}
......@@ -485,7 +487,7 @@ export default {
border-radius: 0;
}
.visaList .select_ul_height{
height: 22px;
height: 21px;
}
.visaList .el-pagination .btn-next,.visaList .el-pagination .btn-prev{
width: 28px!important;
......@@ -616,6 +618,7 @@ export default {
box-sizing: border-box;
width: 100%;
overflow: hidden;
min-height: 21px;
}
.Selectconditions .select_title{
position: absolute;
......
......@@ -155,12 +155,36 @@
.info_right .info_details p span.d{
color: white;
}
.PersonalTailor .citycompent {
position: absolute;
top: 36px;
}
.PersonalTailor .ChooseCity {
position: relative;
}
.ordershow{
background: #fff;
padding:50px 0;
}
.PersonalTailor .content{
width: 1000px;
margin:50px auto 20px auto;
padding-bottom:50px;
overflow: auto;
}
.PersonalTailor .content>div{
float: left;
}
.PersonalTailor .content>div p{
margin:16px 0;
font-size: 18px;
}
</style>
<template>
<div class="PersonalTailor">
<el-row class="max-w1500">
<el-col class="header"></el-col>
<el-col :span="18" :offset="3" class="main">
<el-col v-loading="loading" :span="18" :offset="3" class="main" v-show="!orderShow">
<el-row class="info">
<el-col :span="14" class="info_ info_left">
<p class="info_left_tit">填写需求,快速定制行程</p>
......@@ -179,47 +203,70 @@
</div>
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="150px" class="demo-ruleForm">
<div v-if="showType === 1">
<el-form-item label="出发地:" prop="region">
<el-select v-model="ruleForm.region" placeholder="请选择活动区域" size="small" class="w220">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
<el-form-item label="出发地:">
<el-popover v-model="startcity"
placement="bottom"
trigger="click">
<div v-show="startcity" class="citycompent">
<v-city @CityInfo="CityInfo" @CityCompClose="CityCompClose"></v-city>
</div>
<span slot="reference">
<el-input size="small" :disabled="true" clearable @focus="CityCompStatus('start')" class="ChooseCity w220" v-model="ruleForm.departureName" placeholder="城市">
</el-input>
</span>
</el-popover>
</el-form-item>
<el-form-item label="目的地:" prop="regions">
<el-select v-model="ruleForm.regions" placeholder="请选择活动区域" size="small" class="w220">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
<el-form-item label="目的地:">
<el-popover v-model="endcity"
placement="bottom"
trigger="click">
<div class="citycompent">
<v-city1 @CityInfo1="CityInfo1" @CityCompClose1="CityCompClose1"></v-city1>
</div>
<span slot="reference">
<el-input size="mini" :disabled="true" clearable @focus="!endcity" class="ChooseCity w220" v-model="ruleForm.destinationNames" placeholder="城市">
</el-input>
</span>
</el-popover>
<span class="_for_tips">最多选择3个目的地</span>
<br>
<div>
<el-tag style="margin-right:5px"
v-for="tag in destinationarr"
:key="tag.ID" @close="handleClose(tag)"
closable>
{{tag.Name}}
</el-tag>
</div>
</el-form-item>
<el-form-item label="预估出行日期:" required>
<el-form-item prop="date1">
<el-date-picker type="date" placeholder="选择日期" v-model="ruleForm.date1" size="small" class="w220"></el-date-picker>
<el-form-item prop="startDate">
<el-date-picker type="date" :picker-options="pickerOptions0" value-format="yyyy-MM-dd" placeholder="选择日期" v-model="ruleForm.startDate" size="small" class="w220"></el-date-picker>
</el-form-item>
</el-form-item>
<el-form-item label="预估出行人数:" required>
<el-form-item>
<el-col :span="11">
<el-form-item prop="num1">
成人 <el-input-number v-model="ruleForm.num1" :min="1" :max="10" label="描述文字" size="small"></el-input-number>
<el-form-item prop="audltNumber">
成人 <el-input-number v-model="ruleForm.audltNumber" :min="0" :max="10" label="描述文字" size="small"></el-input-number>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item prop="num2">
儿童 <el-input-number v-model="ruleForm.num2" :min="0" :max="10" label="描述文字" size="small"></el-input-number>
<el-form-item prop="childrenNumber">
儿童 <el-input-number v-model="ruleForm.childrenNumber" :min="0" :max="10" label="描述文字" size="small"></el-input-number>
</el-form-item>
</el-col>
</el-form-item>
</el-form-item>
<el-form-item label="预估人均预算:">
<el-form-item>
<el-input v-model="ruleForm.name" size="small" class="w220"></el-input>
<el-input v-model="ruleForm.budget" size="small" class="w220"></el-input>
<span class="_for_tips">请输入0-99999之间的数字</span>
</el-form-item>
</el-form-item>
<el-form-item label="需要提供什么:">
<el-row class="_checkd">
<el-col :span="4" v-for="(item, index) in active" :key="index" :class="{'_active': item.click}" ><div @click="item.id!==1 ? clickActive(index) : ''">{{item.lable}}</div></el-col>
<el-col :span="4" v-for="(item, index) in active" :key="index" :class="{'_active': item.click}" ><div @click="item.id!==1 ? clickActive(item,index) : ''">{{item.lable}}</div></el-col>
</el-row>
</el-form-item>
<el-form-item>
......@@ -227,24 +274,24 @@
</el-form-item>
</div>
<div v-else>
<el-form-item prop="lianxiren" label="联系人:">
<el-input v-model="ruleForm.lianxiren" size="small" class="w220" placeholder="必填,定制师对您的称呼"></el-input>
<el-form-item prop="contact" label="联系人:">
<el-input v-model="ruleForm.contact" size="small" class="w220" placeholder="必填,定制师对您的称呼"></el-input>
</el-form-item>
<el-form-item prop="phone" label="手机号码:">
<el-input v-model="ruleForm.phone" size="small" class="w220" placeholder=""></el-input>
<el-form-item prop="phoneNumber" label="手机号码:">
<el-input v-model="ruleForm.phoneNumber" size="small" class="w220" placeholder=""></el-input>
</el-form-item>
<el-form-item label="电子邮箱:">
<el-form-item prop="email" label="电子邮箱:">
<el-input v-model="ruleForm.email" size="small" class="w220" placeholder=""></el-input>
</el-form-item>
<el-form-item label="微信号:">
<el-input v-model="ruleForm.wechat" size="small" class="w220" placeholder=""></el-input>
<el-input v-model="ruleForm.weChat" size="small" class="w220" placeholder=""></el-input>
</el-form-item>
<el-form-item label="其他需求:">
<el-input type="textarea" class="max-h90" rows="4" v-model="ruleForm.desc" placeholder="选填,您可以在此输入个性化需求,如:同行人中是否含婴儿、老人,希望定制师何时联系您,对酒店、景点、出行方式的具体要求等"></el-input>
<el-input type="textarea" class="max-h90" rows="4" v-model="ruleForm.otherDemand" placeholder="选填,您可以在此输入个性化需求,如:同行人中是否含婴儿、老人,希望定制师何时联系您,对酒店、景点、出行方式的具体要求等"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" class="_previous w100" @click="showType = 1" size="small">上一步</el-button>
<el-button type="primary" class="_next w100" @click="onSubmit" size="small">提交需求</el-button>
<el-button type="primary" class="_next w100" @click="SubmitOK" size="small">提交需求</el-button>
</el-form-item>
</div>
</el-form>
......@@ -257,87 +304,259 @@
<p class="info_right_tit">填写需求,快速定制行程</p>
<div class="info_details">
<p><label>出游性质:</label> <span class="d">个人定制</span></p>
<p><label>出发地:</label> <span class="d">个人定制</span></p>
<p><label>目的地:</label><span class="d">个人定制</span></p>
<p><label>预估出行日期:</label><span class="d">个人定制</span></p>
<p><label>预估出行人数:</label><span class="d">个人定制</span></p>
<p><label>预估人均预算:</label> <span class="d">个人定制</span></p>
<p><label>需要提供什么:</label><span class="d">个人定制</span></p>
<p><label>其他需求:</label><span class="d">个人定制</span></p>
<p><label>姓名:</label><span class="d">个人定制</span></p>
<p><label>手机:</label><span class="d">个人定制</span></p>
<p><label>邮箱:</label><span class="d">个人定制</span></p>
<p><label>微信:</label><span class="d">个人定制</span></p>
<p><label>出发地:</label> <span class="d">{{ruleForm.departureName}}</span></p>
<p><label>目的地:</label><span class="d">{{ruleForm.destinationNames}}</span></p>
<p><label>预估出行日期:</label><span class="d">{{ruleForm.startDate}}</span></p>
<p><label>预估出行人数:</label><span class="d">{{ruleForm.audltNumber+ruleForm.childrenNumber}}</span></p>
<p><label>预估人均预算:</label> <span class="d">{{ruleForm.budget}}</span></p>
<p><label>需要提供什么:</label><span class="d">{{ruleForm.provideItem}}</span></p>
<p><label>其他需求:</label><span class="d">{{ruleForm.otherDemand}}</span></p>
<p><label>姓名:</label><span class="d">{{ruleForm.contact}}</span></p>
<p><label>手机:</label><span class="d">{{ruleForm.phoneNumber}}</span></p>
<p><label>邮箱:</label><span class="d">{{ruleForm.email}}</span></p>
<p><label>微信:</label><span class="d">{{ruleForm.weChat}}</span></p>
</div>
</div>
</el-col>
</el-row>
</el-col>
<el-col class="ordershow" el-col :span="18" :offset="3" v-show="orderShow">
<div class="content">
<div style="padding-top:50px;padding-left:100px;">
<div style="position:relative">
<img src="../../assets/img/ticket/gou.png" alt="" style="height:54px;width:54px;position:absolute">
<div style="padding-left:70px">
<span style="font-weight:700;font-size:24px">您的订单已经成功提交!</span><br>
<span style="font-size:14px;color:#a8a8a8">需求单号:{{OrderId}}</span>
</div>
</div>
<p>
我们正在为您分配定制师
</p>
<p>
定制师接单后将在<span style="color:#FB8F0F;font-weight:700">明天({{tomorrow}}</span>联系您,请注意接听哦
</p>
<p><el-button size="mini" type="danger">查看订单</el-button></p>
</div>
<div style="width:384px;height:289px;float:right">
<img style="width:100%;height:100%" src="../../assets/img/ticket/back.png" alt="">
</div>
</div>
</el-col>
</el-row>
</div>
</template>
<script>
import moment from "moment"
import ChooseCity from "@/components/Ticket/ChooseCity.vue";
import ChooseCity1 from "@/components/Ticket/ChooseCity1.vue";
export default {
components: {
"v-city": ChooseCity,
"v-city1": ChooseCity1
},
data(){
return {
loading:false,
tomorrow:moment().add(1,'days').format("YYYY-MM-DD"),
ruleForm: {
region: '',
regions: '',
date1: '',
num1: '',
num2: '',
name: '',
lianxiren: '',
phone: '',
customId:0,
startDate:"",
budget:"",
audltNumber: 0,
childrenNumber:0,
contact: '',
phoneNumber: '',
email: '',
wechat: '',
weChat: '',
desc: '',
departureName:"",
destinationIds:"",
destinationNames:'',
provideItem:'线路设计',
otherDemand:"",
},
showType: 1,
active: [
],
active: [],
pickerOptions0: {
disabledDate(time) {
return time.getTime() < Date.now() - 8.64e7;
}
},
rules: {
region: [
email: [
{ type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change'] }
],
departureId: [
{ required: true, message: '请输入活动名称', trigger: 'change' }
],
regions: [
{ required: true, message: '请选择活动区域', trigger: 'change' }
],
date1: [
{ type: 'date', required: true, message: '请选择日期', trigger: 'change' }
startDate: [
{ type: 'string', required: true, message: '请选择日期', trigger: 'change' }
],
num1: [
{ required: true, message: '请选择成人人数', trigger: 'change' }
phoneNumber: [
{ required: true, message: '请输入电话', trigger: 'blur' },
{ required: true, trigger: 'blur', pattern: /^1[3|4|5|7|8][0-9]\d{8}$/ ,message: '请填写正确的手机号'}
],
num1: [
{ required: true, message: '请选择儿童人数', trigger: 'change' }
],
phone: [
{ required: true, message: '请输入电话', trigger: 'blur' }
],
lianxiren: [
contact: [
{ required: true, message: '请输入姓名', trigger: 'blur' }
]
],
},
startcity:false,
endcity:false,
destinationarr:[],
OrderId:0,
orderShow:false,
}
},
methods: {
SubmitOK(){
let that=this;
this.$refs['ruleForm'].validate((valid) => {
if (valid) {
if(that.ruleForm.departureName==""){
this.Error("请选择出发地!")
return;
}
if(that.destinationarr.length==0){
this.Error("请选择目的地!")
return;
}
this.loading=true;
this.apiJavaPost(
"/api/b2b/free/setTravelCusotom",
that.ruleForm,
res => {
this.loading=true;
if(res.data.resultCode==1){
this.orderShow=false;
this.OrderId=res.data.data;
this.Success(res.data.message)
}else{
this.Error(res.data.message)
}
},
null
);
} else {
return false;
}
}, methods: {
clickActive: function(index) {
this.active[index].click = !this.active[index].click
});
},
onSubmit: function() {
let that=this;
this.$refs['ruleForm'].validate((valid) => {
if (valid) {
this.showType = 2
if(that.ruleForm.departureName==""){
this.Error("请选择出发地!")
return;
}
if(that.destinationarr.length==0){
this.Error("请选择目的地!")
return;
}
if(that.ruleForm.audltNumber+that.ruleForm.childrenNumber<1){
this.Error("出行人数至少一人!")
return;
}
this.showType = 2;
} else {
console.log('error submit!!');
return false;
}
});
},
handleClose(tag){
let that=this;
this.destinationarr.splice(this.destinationarr.indexOf(tag), 1);
let IDarr=[];
let Namearr=[];
this.destinationarr.forEach(item=>{
IDarr.push(item.ID)
Namearr.push(item.Name)
})
that.ruleForm.destinationIds=IDarr.join(',');
that.ruleForm.destinationNames=Namearr.join(',');
},
// 目的地城市信息
CityInfo1(val) {
let that=this;
let obj={};
obj.Name=val.Name;
obj.ID=val.ID;
if(this.destinationarr.length>2){
this.Error("最多选择3个目的地!");
return;
}
if(this.destinationarr.length>0){
this.destinationarr.forEach(item=>{
if(val.ID==item.ID){
this.destinationarr.splice(this.destinationarr.indexOf(item), 1);
}
})
this.destinationarr.push(obj);
}else{
this.destinationarr.push(obj);
}
let IDarr=[];
let Namearr=[];
that.ruleForm.destinationIds="",
this.destinationarr.forEach(item=>{
IDarr.push(item.ID)
Namearr.push(item.Name)
})
that.ruleForm.destinationIds=IDarr.join(',');
that.ruleForm.destinationNames=Namearr.join(',');
},
// 目的地关闭子组件
CityCompClose1(val) {
this.endcity = false;
},
// 城市组件状态
CityCompStatus(str) {
if (str == "start") {
this.startcity = true;
} else {
this.endcity = true;
}
},
// 出发地关闭子组件
CityCompClose(val) {
this.startcity = false;
},
// 出发地城市信息
CityInfo(val) {
this.ruleForm.departureName=val.Name;
this.ruleForm.departureId=val.ID;
},
clickActive: function(item,index) {
this.active[index].click = !this.active[index].click;
let arr=[];
this.active.forEach(item=>{
if(item.click){
arr.push(item.lable)
}
})
this.ruleForm.provideItem=arr.join(',');
},
}, mounted() {
},created(){
this.active = [
{
lable: '线路设计',
......
<style>
@import url('../../assets/mall/detail.css');
._labelClass{
width:120px;
background-color: white;
text-align: center;
}
._travelLngLatInfo_box{
background-color: #f3f3f3;
padding: 20px;
margin-top: 15px;
}
._travelLngLatInfo_label{
display: inline-block;
width: 20px;
height: 20px;
border-radius: 50%;
background-color: #ea4335;
color: white;
text-align: center;
line-height: 20px;
}
.zanding_flight{
position: relative;
}
.zanding_flight span{
position: absolute;
right: -36px;
top: 10px;
width: 15px;
height: 15px;
background-color: #ef4455;
color: white;
cursor: pointer;
border-radius: 50%;
}
.template_box_two>div>div{
zoom:0.89;
}
.TripDownLoadCommon{ height:350px; text-align: center}
.TripDownLoadCommon> label{cursor: pointer;vertical-align: middle;}
.TripDownLoadCommon> label input{vertical-align: middle;}
.TripDownLoadCommon .TripBtn{ color: #fff; width: 90px; height:30px; background:#E95252; border: 1px solid #E95252; cursor: pointer; border-radius: 15px;}
.TripDownLoadCommon input[type="checkbox"] + label::before {
content: "\A0";
display: inline-block;
width: 15px;
height: 15px;
margin-right: 5px;
border-radius: 4px;
background-color: white;
text-indent: .15em;
line-height: 15px;
color: white;
border: 1px solid #e95252;
}
.TripDownLoadCommon input[type="checkbox"]:checked + label::before {
content: "\2713";
background-color: #e95252;
}
.TripDownLoadCommon input[type="checkbox"]{
position: absolute;
clip: rect(0, 0, 0, 0);
}
.TripDownLoadCommon input[type="checkbox"]:focus + label::before {
box-shadow: none;
}
.TripDownLoadCommon input[type="checkbox"]:disabled + label::before {
background-color: gray;
box-shadow: none;
color: #555;
}
.w450{width: 450px;}
</style>
<template>
<div class="detail-box" v-loading='loadingDataList' id="pdfDom">
<el-row v-if="loadNone==false">
<el-col :span="20" :offset="2" class="topic">
<el-col :span='12'>
<el-breadcrumb separator-class="el-icon-arrow-right">
<el-breadcrumb-item :to="{ path: '/heel',query:{} }">自由行</el-breadcrumb-item>
<el-breadcrumb-item :to="{ path: '/search',query:{'keywords':'','lineId':dataList.lineName} }">{{dataList.lineName}}</el-breadcrumb-item>
<el-breadcrumb-item :to="{ path: '/search',query:{'keywords':'','lineId':dataList.lineName,'lineteamId':dataList.ltName} }">{{dataList.ltName}}</el-breadcrumb-item>
<el-breadcrumb-item>{{dataList.title}}</el-breadcrumb-item>
</el-breadcrumb>
</el-col>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="20" :offset="2">
<el-col :span='14' class="left-team-box" :gutter="35">
<div class="team-top-info">
<span class="xilie">{{dataList.ltName}}</span>
<span class="code">团队编号:{{dataList.id}}</span>
</div>
<div class="team-title">
{{dataList.title}}
</div>
<div class="price-box">
<div class="huodong" v-if="toDayObj && toDayObj.discountPrice>0">
<span>早鸟优惠</span>
<span>立减{{toDayObj.discountPrice}}</span>
</div>
<div>
<span class="red"></span>
<span class="red big">{{toDayObj?(isLogin!==1?toDayObj.b2CPrice:toDayObj.b2BPrice):0}}</span>
<span>/人起</span>
<span class="tips pointer">
起价说明
</span>
<!-- <span class="blue split medium pointer">4.9</span>
<span class="blue pointer">0条点评</span> -->
<span style='margin-left:5px'>{{dataList.offerNumber+99}}人出游</span>
</div>
<div class="activy" v-if="maxdiscountAmount>0">
<span>优惠活动</span>
<span class="split tag">可享</span>
<span class="split">【同行返佣】最高可返{{maxdiscountAmount}},赶快报名吧</span>
</div>
</div>
<div class="img-box" v-if="dataList">
<el-row :gutter="7">
<template v-if="VideoStr">
<el-col :span='12'>
<video :src="VideoStr" width="100%" height="259" class="avatar" controls="controls">您的浏览器不支持视频播放</video>
</el-col>
<el-col :span='12'>
<el-col :span='12'>
<img @click="showImg(imgCover),initialIndex =1" v-if="imgCover&&imgCover[0]" :src="editSrc(imgCover[0].Url)" style="height: 126px;width:100%" />
<img @click="showImg(imgCover)" v-else src="../../assets/img/bg_c2@3x.png" style="height: 126px;width:100%" />
<img @click="showImg(imgCover),initialIndex = 2" v-if="imgCover&&imgCover[1]" :src="editSrc(imgCover[1].Url)" style="height: 126px;width:100%" />
<img @click="showImg(imgCover)" v-else src="../../assets/img/bg_c2@3x.png" style="height: 126px;width:100%;margin-top:3px;" />
</el-col>
<el-col :span='12'>
<img @click="showImg(imgCover),initialIndex = 3" v-if="imgCover&&imgCover[2]" :src="imgCover[2].Url==''?'../../assets/img/bg_c2@3x.png':editSrc(imgCover[2].Url)" style="height: 126px;width:100%" />
<img @click="showImg(imgCover)" v-else src="../../assets/img/bg_c2@3x.png" style="height: 126px;width:100%" />
<div class="last">
<img v-if="imgCover&&imgCover[3]" :src="imgCover[3].Url==''?'../../assets/img/bg_c2@3x.png':editSrc(imgCover[3].Url)" style="height: 126px;width:100%" />
<img v-else src="../../assets/img/bg_c2@3x.png" style="height: 126px;width:100%;margin-top:3px;" />
<div class="tip" @click="showImg(imgCover)">
查看全部图片
</div>
</div>
</el-col>
</el-col>
</template>
<template v-else>
<el-col :span='12'>
<img @click="showImg(imgCover),initialIndex = 0" v-if="imgCover&&imgCover[0]" :src="editSrc(imgCover[0].Url)" style="height: 259px;width:100%" />
<img @click="showImg(imgCover)" v-else src="../../assets/img/bg_c2@3x.png" style="height: 259px;width:100%" />
</el-col>
<el-col :span='12'>
<el-col :span='12'>
<img @click="showImg(imgCover),initialIndex =1" v-if="imgCover&&imgCover[1]" :src="editSrc(imgCover[1].Url)" style="height: 126px;width:100%" />
<img @click="showImg(imgCover)" v-else src="../../assets/img/bg_c2@3x.png" style="height: 126px;width:100%" />
<img @click="showImg(imgCover),initialIndex = 2" v-if="imgCover&&imgCover[2]" :src="editSrc(imgCover[2].Url)" style="height: 126px;width:100%" />
<img @click="showImg(imgCover)" v-else src="../../assets/img/bg_c2@3x.png" style="height: 126px;width:100%;margin-top:3px;" />
</el-col>
<el-col :span='12'>
<img @click="showImg(imgCover),initialIndex = 3" v-if="imgCover&&imgCover[3]" :src="imgCover[3].Url==''?'../../assets/img/bg_c2@3x.png':editSrc(imgCover[3].Url)" style="height: 126px;width:100%" />
<img @click="showImg(imgCover)" v-else src="../../assets/img/bg_c2@3x.png" style="height: 126px;width:100%" />
<div class="last">
<img v-if="imgCover&&imgCover[4]" :src="imgCover[4].Url==''?'../../assets/img/bg_c2@3x.png':editSrc(imgCover[4].Url)" style="height: 126px;width:100%" />
<img v-else src="../../assets/img/bg_c2@3x.png" style="height: 126px;width:100%;margin-top:3px;" />
<div class="tip" @click="showImg(imgCover)">
查看全部图片
</div>
</div>
</el-col>
</el-col>
</template>
</el-row>
</div>
<div class="recome">
<p>
<span class="big left">
<i class='el-icon-star-on'></i>产品推荐
</span>
<span class="big right">
{{dataList.productRecommend}}
</span>
</p>
<p v-if="priceTags.length>0" style="font-size:14px;padding:4px 0">
<span>标签:</span>
<span style="color: gray;" v-for="item in priceTags" :key="item.content">{{item.content}} &nbsp;</span>
</p>
</div>
</el-col>
<el-col :span='10' class="right-team-box-col">
<div class="right-team-box">
<div class="title">
<span class="item" :key="index" v-for="(i,index) in calendarTit" @click="selectMounth(index)" :class="index===indexActive?'avtice':''">
<span>{{i.dateStrS}}</span><br/>
<span class="price">¥{{isLogin!==1?i.price:i.b2BPrice}}起</span>
</span>
</div>
<calendar v-for="(item,index) in classArray" :key="index" :dateData= "item" :day = "item[0].dateStr" @ChildrenSelect="ListenChildren" v-if="index == selectMonth"/>
</div>
</el-col>
</el-col>
</el-row>
<trade :priceList='dataList.priceList' :trip='dataList' :numPeople="null" v-if="dataList.priceList && dataList.priceList.length>0"></trade>
<div ref="nav">
<el-row>
<el-col :span="20" :offset="2">
<el-col :span="18">
<ul class="top-nav" >
<li :class="crtnav=='flight'?'active':''" @click="goScroll('flight')">
<i class="iconfont icon-Pointer"></i>
<span>航班信息</span>
</li>
<li :class="crtnav=='tese'?'active':''" @click="goScroll('tese')">
<i class="iconfont icon-Pointer"></i>
<span>行程特色</span>
</li>
<li :class="crtnav=='teamacitvy'?'active':''" @click="goScroll('teamacitvy')">
<i class="iconfont icon-List"></i>
{{dayTrip}}日行程
</li>
<li :class="crtnav=='feiyong'?'active':''" @click="goScroll('feiyong')">
<i class="iconfont icon-zifeishuoming"></i>
费用
</li>
<li :class="crtnav=='gouwu'?'active':''" @click="goScroll('gouwu')">
<i class="iconfont icon-jindiananpai"></i>
购物说明
</li>
<li :class="crtnav=='yuding'?'active':''" @click="goScroll('yuding')">
<i class="iconfont icon-zhongyaotishi"></i>
预订须知
</li>
<li :class="crtnav=='qianz'?'active':''" @click="goScroll('qianz')">
<i class="iconfont icon-qianzhengshuoming"></i>
签证
</li>
<li :class="crtnav=='tonghang'?'active':''" @click="goScroll('tonghang')">
<i class="iconfont icon-hangchenganpai"></i>
同行备注
</li>
<li :class="crtnav=='PDFDownL'?'active':''" @click="crtnav=='PDFDownL',PDFDownLoad('tonghang')">
<i class="iconfont icon-hangchenganpai"></i>
PDF下载
</li>
</ul>
</el-col>
<el-col :span="6">
<div class="customer">
<div class="phone">
<i class="iconfont icon-kefuicon"></i>
028-61993600
</div>
<div class="tip">
行程有疑问?懒得填信息?专业客服为您提供咨询服务
</div>
</div>
</el-col>
</el-col>
</el-row>
</div>
<el-row>
<el-col :span="20" :offset="2">
<div class="item-title" id='flight'>
<span class="t">航班信息</span>
<span>
<small class="s"></small>
</span>
<span>Reference flight</span>
</div>
<div class="hangban-info">
<table border="0" align="center" cellpadding="0" cellspacing="0" class="flight_th">
<tbody>
<tr>
<td width="170">出发时间<span>(当地)</span></td>
<td width="170">抵达时间<span>(当地)</span></td>
<td width="216">起飞机场</td>
<td width="18" class="gap">&nbsp;</td>
<td>抵达机场</td>
<td width="18" class="gap">&nbsp;</td>
<td width="80">航空公司</td>
<td width="90">航班编号</td>
</tr>
</tbody>
</table>
<div class="_hangban_line"></div>
<table border="0" align="center" cellspacing="0" cellpadding="0" class="flight_list">
<tbody v-if="showFlight && FlightList.length>0">
<tr v-for="(flight,ftIndex) in sonData.currentPriceInfo.priceFlight" :key="ftIndex">
<td width="170"><span class="nth-day">{{flight.startDate.substring(5)}}</span>&nbsp;<span class="num">{{flight.departureTime}}</span></td>
<td width="170"><span class="nth-day">{{flight.arriveDate.substring(5)}}</span>&nbsp;<span class="num">{{flight.arrivalTime}}</span></td>
<td width="216">{{flight.departureAirPortName}}<span class="citycode"></span></td>
<td width="18" class="gap">&nbsp;</td>
<td>{{flight.arrivalAirPortName}}<span class="citycode"></span></td>
<td width="18" class="gap">&nbsp;</td>
<td width="80" >{{flight.alName}}</td>
<td width="90" class="zanding_flight">{{flight.flightNumber}} <span v-if="flight.flightState===2" title="暂定"></span></td>
</tr>
</tbody>
<tbody v-else>
<tr>
<td>航班信息未确认</td>
</tr>
</tbody>
</table>
</div>
<div class="item-title" id='tese'>
<span class="t">行程特色</span>
<span>
<small class="s"></small>
</span>
<span>Trip characteristics</span>
</div>
<div class="nin-box" v-if="showType==2">
<table>
<tbody>
<tr>
<td @click="showImg(feature.featureImgList),initialIndex=index" v-for="(i,index) in feature.featureImgList" :key="index" v-if="index<3" :style="{background:'url(' + i.url + ') no-repeat bottom left/100% auto'}">
&nbsp;
</td>
</tr>
<tr>
<td @click="showImg(feature.featureImgList),initialIndex=index" v-for="(i,index) in feature.featureImgList" :key="index" v-if="index>2&&index<6" :style="{background:'url(' + i.url + ') no-repeat bottom left/100% auto'}">
&nbsp;
</td>
</tr>
<tr>
<td @click="showImg(feature.featureImgList),initialIndex=index" v-for="(i,index) in feature.featureImgList" :key="index" v-if="index>5&&index<=8" :style="{background:'url(' + i.url + ') no-repeat bottom left/100% auto'}">
&nbsp;
</td>
</tr>
</tbody>
</table>
</div>
<div class="slider" v-if="showType==1&&loadNone==false">
<!-- <el-carousel :interval="2000" height='400px' trigger="click" :style="{'background':'#ddd'}">
<el-carousel-item v-for="(i,index) in feature.featureImgList" :key="index">
<img :src="i.url" />
</el-carousel-item>
</el-carousel> -->
<swiper :imgs='feature.featureImgList'></swiper>
</div>
<div class="zidingyi" v-if="(showType==3 || showType<4)&&loadNone==false">
<center v-html="feature.featureContent"></center>
</div>
<div class="template-box" v-if="showType==4&&loadNone==false">
<div v-html="feature.featureHtml" style="width:1000px;margin:0 auto;"></div>
</div>
<div class="template-box template_box_two" v-if="showType>4&&loadNone==false">
<div v-html="feature.featureHtml" style="width:1000px;margin:0 auto;"></div>
</div>
<div id="teamacitvy"> </div>
<div class="item-title" v-if="dataList.isDirect&&travelLngLat.length>1">
<span class="t">行程地图</span>
<span>
<small class="s"></small>
</span>
<span>Trip Maps</span>
</div>
<!-- -->
<div class="map-box" v-if="dataList.isDirect&&travelLngLat.length>1">
<!-- <bmap :data="travelLngLat"/> -->
<GGMap :dataList="travelLngLat"></GGMap>
<div class="_travelLngLatInfo_box">
<p v-for="item in travelLngLatInfo"><span class="_travelLngLatInfo_label">{{item.lable}}</span>: {{item.text}}</p>
</div>
</div>
<!-- <div id="map_canvas" style="width:1000px; height:600px;"></div> -->
<div class="item-title">
<span class="t">{{dayTrip}}日行程</span>
<span>
<small class="s"></small>
</span>
<span>Scheduling</span>
</div>
<div v-if='dayList&&dayList.length>0'>
<!-- <trip :tripList="dayList"></trip> -->
<block :tripList="dayList" :isDirect="isDirect" :clickDate="clickDate"></block>
</div>
<div class="item-title" id='feiyong'>
<span class="t">费用</span>
<span>
<small class="s"></small>
</span>
<span>Expense</span>
</div>
<div class="expense">
<div class="left">费用包含</div>
<div class="right">
<div v-html="feature.feeInclude"></div>
</div>
</div>
<div class="expense">
<div class="left">自理费用</div>
<div class="right">
<div v-html="feature.feeNonInclude"></div>
<table class="expense-table" cellspacing=0 cellpadding=0 v-if='dataList.selfpayingList && dataList.selfpayingList.length>0'>
<thead>
<th>城市</th>
<th>活动</th>
<th>参考价格</th>
<th>说明</th>
</thead>
<tbody>
<tr v-for="(item,i) in dataList.selfpayingList" :key="i">
<td>{{item.cityName}}</td>
<td>{{item.itemName}}</td>
<td>约{{item.estimatedCost}}</td>
<td>{{item.explain}}</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="item-title" id='gouwu'>
<span class="t">购物说明</span>
<span>
<small class="s"></small>
</span>
<span>Expense</span>
</div>
<div class="expense">
<div class="left">
<!-- 购物协议 -->
</div>
<div class="right">
<div v-html="feature.shopRemark"></div>
</div>
</div>
<div class="expense" v-if="dataList.shopList && dataList.shopList.length>0">
<div class="left">购物安排</div>
<div class="right">
<table class="expense-table autowidth" cellspacing=0 cellpadding=0>
<thead>
<th>城市</th>
<th>购物店名称</th>
<th>预计停留时间</th>
</thead>
<tbody>
<tr v-for="(item,i) in dataList.shopList" :key="i">
<td>{{item.cityName}}</td>
<td>{{item.shopName}}</td>
<td>{{item.visitTime}}</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="item-title" id='yuding'>
<span class="t">预订须知</span>
<span>
<small class="s"></small>
</span>
<span>Tips</span>
</div>
<div class="expense" v-if="feature.importantTip!=''">
<div class="left">重要提示</div>
<div class="right">
<div v-html="feature.importantTip"></div>
</div>
</div>
<div class="expense">
<div class="left">温馨提示</div>
<div class="right">
<div v-html="feature.warmTip"></div>
</div>
</div>
<div class="item-title" id='qianz'>
<span class="t">签证</span>
<span>
<small class="s"></small>
</span>
<span>Visa</span>
</div>
<div class="expense">
<div class="left">签证须知</div>
<div class="right">
<div v-html="feature.visaRemark"></div>
</div>
</div>
<div class="item-title" id='tonghang'>
<span class="t">同行备注</span>
<span>
<small class="s"></small>
</span>
<span>Remark</span>
</div>
<div class="expense">
<div class="left"></div>
<div class="right">
<div v-html="feature.b2BRemark"></div>
</div>
</div>
</el-col>
</el-row>
<el-row class="fuben-nav" v-if="changeNav&&loadNone==false" >
<el-col :span="20" :offset="2">
<el-col :span="18">
<ul class="top-nav" >
<li :class="crtnav=='flight'?'active':''" @click="goScroll('flight')">
<i class="iconfont icon-Pointer"></i>
<span>航班信息</span>
</li>
<li :class="crtnav=='tese'?'active':''" @click="goScroll('tese')">
<i class="iconfont icon-Pointer"></i>
<span>行程特色</span>
</li>
<li :class="crtnav=='teamacitvy'?'active':''" @click="goScroll('teamacitvy')">
<i class="iconfont icon-List"></i>
{{dayTrip}}日行程
</li>
<li :class="crtnav=='feiyong'?'active':''" @click="goScroll('feiyong')">
<i class="iconfont icon-zifeishuoming"></i>
费用
</li>
<li :class="crtnav=='gouwu'?'active':''" @click="goScroll('gouwu')">
<i class="iconfont icon-jindiananpai"></i>
购物说明
</li>
<li :class="crtnav=='yuding'?'active':''" @click="goScroll('yuding')">
<i class="iconfont icon-zhongyaotishi"></i>
预订须知
</li>
<li :class="crtnav=='qianz'?'active':''" @click="goScroll('qianz')">
<i class="iconfont icon-qianzhengshuoming"></i>
签证
</li>
<li :class="crtnav=='tonghang'?'active':''" @click="goScroll('tonghang')">
<i class="iconfont icon-hangchenganpai"></i>
同行备注
</li>
<li :class="crtnav=='PDFDownL'?'active':''" @click="crtnav=='PDFDownL',PDFDownLoad('tonghang')">
<i class="iconfont icon-hangchenganpai"></i>
PDF下载
</li>
<!-- <li :class="crtnav==7?'active':''">
<i class="iconfont icon-feiyongshuoming"></i>
点评(99+)
</li> -->
</ul>
</el-col>
<el-col :span="6">
<div class="customer">
<div class="phone">
<i class="iconfont icon-kefuicon"></i>
028-61993600
</div>
<div class="tip">
行程有疑问?懒得填信息?专业客服为您提供咨询服务
</div>
</div>
</el-col>
</el-col>
</el-row>
<div v-if='picIsShow' class="_show_img_box" @click="picIsShow=false,picObj=[]">
<div style="position: absolute; width: 800px; height: 600px; left: 50%; top: 50%; margin-left: -400px; margin-top: -300px;">
<el-carousel :initial-index=initialIndex height="600px" :interval="5000" trigger="click">
<el-carousel-item v-for="(item,index) in picObj" :key="index">
<img :src="item.Url?item.Url:item.url" style="width: 100%; height: 100%;"/>
</el-carousel-item>
</el-carousel>
</div>
</div>
<div style="height:100px;"></div>
<!-- <el-button class="pdfDom_btn" type="primary" size="small" @click="donwLoad()" v-if="loadNone==false">点击下载</el-button> -->
<template v-if="sonData">
<confirmationOrderDownLoad ref="confirmationOrderDownLoad" :sonData="sonData" :TripLayer="TripLayer"/>
</template>
<el-dialog custom-class='w450' title="行程下载" :visible.sync="travelControlTripLayerShow" center>
<div class="TripDownLoadCommon" >
<table style="width:380px" border="0" cellspacing="0" cellpadding="0">
<tr>
<th colspan="2">
请选择需要的类容
</th>
</tr>
<tbody>
<tr height="36">
<td width="50%"><input id="vshowA" v-model="TripLayer.vshowA" type="checkbox" /><label for="vshowA">基础信息</label></td>
<td width="50%"><input id="vshowB" v-model="TripLayer.vshowB" type="checkbox" /><label for="vshowB">航班信息</label></td>
</tr>
<tr height="36">
<td><input id="vshowC" v-model="TripLayer.vshowC" type="checkbox" /><label for="vshowC">行程特色</label></td>
<td><input id="vshowD" v-model="TripLayer.vshowD" type="checkbox" /><label for="vshowD">行程安排</label></td>
</tr>
<tr height="36">
<td><input id="vshowE" v-model="TripLayer.vshowE" type="checkbox" /><label for="vshowE">费用说明</label></td>
<td><input id="vshowF" v-model="TripLayer.vshowF" type="checkbox" /><label for="vshowF">购物说明</label></td>
</tr>
<tr height="36">
<td><input id="vshowG" v-model="TripLayer.vshowG" type="checkbox" /><label for="vshowG">订单须知</label></td>
<td><input id="vshowH" v-model="TripLayer.vshowH" type="checkbox" /><label for="vshowH">签证信息</label></td>
</tr>
<tr height="36">
<td><input id="vshowI" v-model="TripLayer.vshowI" type="checkbox" /><label for="vshowI">同行备注</label></td>
<td><input id="vshowJ" v-model="TripLayer.vshowJ" type="checkbox" /><label for="vshowJ">印象标识</label></td>
</tr>
<tr height="36">
<td><input id="vshowK" v-model="TripLayer.vshowK" type="checkbox" /><label for="vshowK">景点图片</label></td>
</tr>
</tbody>
<!-- <tbody>
<tr height="36">
<td width="50%"><input id="vshowA" v-model="TripLayer.vshowA" type="checkbox" /><label for="vshowA">基础信息</label></td>
<td width="50%"><input id="vshowL" v-model="TripLayer.vshowL" type="checkbox" /><label for="vshowL">集合地点</label></td>
</tr>
<tr height="36">
<td><input id="vshowK" v-model="TripLayer.vshowK" type="checkbox" /><label for="vshowK">景点图片</label></td>
<td><input id="vshowB" v-model="TripLayer.vshowB" type="checkbox" /><label for="vshowB">航班信息</label></td>
</tr>
<tr height="36">
<td><input id="vshowC" v-model="TripLayer.vshowC" type="checkbox" /><label for="vshowC">行程特色</label></td>
<td><input id="vshowD" v-model="TripLayer.vshowD" type="checkbox" /><label for="vshowD">行程安排</label></td>
</tr>
<tr height="36">
<td><input id="vshowE" v-model="TripLayer.vshowE" type="checkbox" /><label for="vshowE">费用说明</label></td>
<td><input id="vshowF" v-model="TripLayer.vshowF" type="checkbox" /><label for="vshowF">购物说明</label></td>
</tr>
<tr height="36">
<td><input id="vshowG" v-model="TripLayer.vshowG" type="checkbox" /><label for="vshowG">订单须知</label></td>
<td><input id="vshowH" v-model="TripLayer.vshowH" type="checkbox" /><label for="vshowH">签证信息</label></td>
</tr>
<tr height="36">
<td><input id="vshowI" v-model="TripLayer.vshowI" type="checkbox" /><label for="vshowI">同行备注</label></td>
<td><input id="vshowJ" v-model="TripLayer.vshowJ" type="checkbox" /><label for="vshowJ">印象标识</label></td>
</tr>
<tr height="36">
<td><input id="vshowLLR" v-model="TripLayer.vshowLLR" type="checkbox" /><label for="vshowLLR">紧急联络人</label></td>
</tr>
</tbody> -->
<tr height="66">
<td colspan="2" align="center">
<input type="button" class="TripBtn" @click="PDFDownLoad();" value="确定" />
</td>
</tr>
</table>
</div>
</el-dialog>
</div>
</template>
<script>
import moment from 'moment'
// import bmap from './map.vue'
import calendar from './calendar.vue'
import trip from '../trip/waterfall/index'
import block from '../trip/block/index'
import trade from '../trade/order/index'
import swiper from '../trip/swiper/index'
import GGMap from '../global/GGMap'
import confirmationOrderDownLoad from '../global/confirmationOrderDownLoad'
import bus from '../../plugins/event-bus'
export default {
components: {
// bmap,
GGMap,
calendar,
trip,
block,
trade,
swiper,
confirmationOrderDownLoad
},
props:['changeCity'],
data () {
return {
ID:'',
tcid: '',
pre:0,
chosenTime:'',
crn:2,
etn:0,
changeNav:false,
scrollobj:null,
picIsShow:false,
initialIndex:0,
showType:-1,
crtnav:'tese',
dayList:[],
feature:{},
priceList:[],
dataList:{},
toDayObj:{},
calendarTit:[],
classArray:[],
imgCover:[],
picObj:[],
travelLngLat:[],
selectMonth:0,
value:'1',
dayTrip:'',
input10:'',
isLogin:1,
oderInfoShow:false,
indexActive:0,
clickDate:'',
travelControlTripLayerShow: false,
TripLayer: {
vshowA :true,
vshowB :true,
vshowC :true,
vshowD :true,
vshowE :true,
vshowF :true,
vshowG :true,
vshowH :true,
vshowI :true,
vshowJ :true,
vshowK :true,
vshowL :true,
vshowM :true,
vshowLLR :true,
},
navs:[
'flight',
'tese',
'teamacitvy',
'feiyong',
'gouwu',
'yuding',
'qianz',
'tonghang'
],
pickerOptions:{
disabledDate(time) {
// return moment(time).format('YYYY-MM-DD')!='2018-10-18' && moment(time).format('YYYY-MM-DD')!='2018-10-28'
}
},
maxdiscountAmount:0,
loadingDataList:false,
htmlTitle: '印象之旅',
loadNone:false,
site:localStorage.site,
priceListIndex:0,
isDirect:1,//是否是直采 0:否,1:是
abcList: ['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z','AA','AB','AC','AD','AE','AF','AG'],
travelLngLatInfo:[],
VideoStr:'',
sonData: null,
showFlight: false,
FlightList: [],
city: -1,
priceTags:[],
}
},watch: { // 监听参数变化
changeCity: {
handler: function(val, oldVal) {
// console.log(val)
if(val){
this.getList()
}
},
deep: true
},
},created(){
this.ID = decodeURIComponent(this.$route.params.id)
this.tcid = decodeURIComponent(this.$route.params.tcid)
this.getList()
this.isLogin=this.$store.state.isLogin;
bus.$on('order-chosen', this.orderChosen)
},
mounted () {
this.scrollobj=document.getElementsByClassName('el-scrollbar__wrap')[0];
this.scrollobj.addEventListener('scroll', this.handleScroll);
// this.initMap();
},
methods: {
orderChosen: function (date) {
let day = date.split('-')[0] + '-' + date.split('-')[1]
this.calendarTit.forEach((x, index)=>{
if (x.dateStrS === day) {
this.selectMonth = index;
this.indexActive = index;
setTimeout(function(){
bus.$emit('order-chosen_calendar', date)
},500)
}
})
},
editSrc: function (src) {
return src.split('?')[0]
},
PDFDownLoad: function (type) {
if (type) {
this.travelControlTripLayerShow = true
} else {
// let orderMsg = this.sonData;
let orderMsg = this.sonData.orderMsg;
this.travelControlTripLayerShow = false
this.$refs.confirmationOrderDownLoad.toPDF(orderMsg.startDate + orderMsg.lineteamName+orderMsg.dayNum+'日游');
}
},
ToWord: function () {
this.loadingDataList = true
let title = this.dataList.currentPriceInfo.startDate + this.dataList.ltName + this.dataList.dayNum + '日游'
let msg = {
configId: this.dayList.id,
cityId: this.city,
tcid: this.tcid,
orderId: 0,
FileName: title,
//是否显示基础信息
isShowBase: 1 ,
//是否显示航班
isShowFlight: 1,
//是否显示行程特色
isShowFeature: 1,
//自费、费用包含、费用不含
isShowFee: 1,
//购物说明,购物安排
isShowShop: 1,
//重要提示、温馨提示 [订单须知]
isShowTip: 1,
//是否显示同行备注
isShowB2B: 1,
//是否显示行程
isShowTrip: 1,
//是否显示标题
isShowTitle: 1,
//是否显示旅客名单
isShowGuest: 0,
//是否显示紧急联系人
isShowMan: 0,
//是否显示团号
isShowTCNUM: 0,
//是否显示行程图片
isShowTripImage: 1,
//是否显示签证信息
isShowVisa: 1,
//isPc是否PC下载
isPc: 1,
//模板参数
templateId: this.showType,
};
this.GetLocalFile("DownLoadTripWord", msg, title + ".doc", res => {
this.loadingDataList = false
});
},
donwLoad(){
this.loadNone = true;
this.loadingDataList = true;
let imgs=document.getElementsByTagName('img');
for(let i=0;i<imgs.length;i++){
document.getElementsByTagName('img')[i].setAttribute('crossOrigin','Anonymous')
}
window.setTimeout(this.getPdf('#pdfDom'),3000);
},
DateDiff(sDate1, sDate2){ //sDate1和sDate2是2002-12-18格式
var aDate, oDate1, oDate2, iDays
aDate = sDate1.split("-")
oDate1 = new Date(aDate[1] + '-' + aDate[2] + '-' + aDate[0]) //转换为12-18-2002格式
aDate = sDate2.split("-")
oDate2 = new Date(aDate[1] + '-' + aDate[2] + '-' + aDate[0])
iDays = parseInt(Math.abs(oDate1 - oDate2) / 1000 / 60 / 60 /24) //把相差的毫秒数转换为天数
return iDays
},
ListenChildren(word){
this.clickDate = word
let data = this.dataList.priceList;
for ( let i = 0; i < data.length; i++) {
if (word===data[i].startDate){
this.priceListIndex = i;
let msg = {configId:data[i].configIDDes, cityId:this.city, preview:this.pre, tcid:data[i].tcid}
bus.$emit('chosen-tripdate', word)
this.getData(msg)
}
}
},
oderInfoShowF(){
this.oderInfoShow = !this.oderInfoShow
},
showImg(obj){
obj.forEach(x=>{
x.Url = x.Url.split('?')[0]
})
this.picObj= obj
this.picIsShow= true;
},
getList(){
this.apipost('b2b_get_site',{},res=> {
let data = res.data.data
let city = 0
for(let i = 0 ; i < data.length; i++ ) {
if(data[i].companyId == localStorage.site) {
city = data[i].cityId
this.city = city
break
}
}
let msg = {configId:this.ID,cityId:city,tcid:this.tcid}
this.getData(msg)
})
},
getData: function (msg) {
this.loadingDataList=true
this.apipost('b2b_get_GetB2BFreeInfo',msg,r=>{
if(r.data.resultCode==1){
let data = (r.data.data);
this.sonData = data;
this.dayList = data.dayList;
this.feature = data.feature;
this.isDirect = data.isDirect;
this.priceTags=data.currentPriceInfo.priceTags;
if (data.videoStr) {
let path = data.videoStr.indexOf('http') > -1 ? data.videoStr : domainManager().ViittoFileUrl + data.videoStr;
this.VideoStr = path;
}
// console.log(data.priceList[0].priceFlight)
// if(data.priceList && data.priceList.length>0){
// data.priceList[0].priceFlight.forEach((x,i)=>{
// if(i==0){
// x.dayNum = 1;
// if(x.departureTime<x.arrivalTime){
// x.daodaDay = 1;
// }else{
// x.daodaDay = 2;
// }
// } else {
// console.log(this.DateDiff(data.priceList[0].priceFlight[0].startDate,x.startDate))
// x.dayNum = this.DateDiff(data.priceList[0].priceFlight[0].startDate,x.startDate);
// x.dayNum +=1
// if(x.departureTime<x.arrivalTime){
// x.daodaDay = x.dayNum;
// }else{
// x.daodaDay = x.dayNum+1;
// }
// }
// })
// }
this.priceList = data.priceList;
this.clickDate = data.currentPriceInfo && data.currentPriceInfo.startDate ? data.currentPriceInfo.startDate : '';
this.FlightList = data.currentPriceInfo && data.currentPriceInfo.priceFlight ? data.currentPriceInfo.priceFlight : '';
this.dataList = data;
this.toDayObj = this.priceList && this.priceList.length>0?this.priceList[0]:null;
this.imgCover = JSON.parse(this.dataList.imgCover);
this.showType = this.feature.featureType;
this.dayTrip = this.dataList.dayNum;
if(this.dataList.isDirect==1&&this.dataList.travelLngLat.length){
this.travelLngLat = [];//this.dataList.travelLngLat;
this.dataList.travelLngLat.forEach(x=>{
if(x.type!=2){
this.travelLngLat.push(x)
}
})
let travelLngLatInfo = [];
this.travelLngLat.forEach((x,index)=>{
travelLngLatInfo.push(
{
lable: this.abcList[index],
text: x.name
}
)
})
this.travelLngLatInfo = travelLngLatInfo;
}
this.creatCalendar(this.priceList);
if(data.lineTeamDiscountList && data.lineTeamDiscountList.length>0){
data.lineTeamDiscountList.forEach(x=>{
this.maxdiscountAmount=x.discountAmount>this.maxdiscountAmount?x.discountAmount:this.maxdiscountAmount
})
}
this.htmlTitle = this.dataList.ltName;
this.showFlight = true
this.$forceUpdate()
}else{
this.$message.error(r.data.message)
}
this.loadingDataList=false
},null)
},
creatCalendar(list){ // 创建日历
let dateList = [];
if(list && list.length>0){
list.forEach((x,index)=>{
if(x.tcState==3){
let msg = {
dateStr:x.startDate,
cDate:x.startDate.replace('-','年').replace('-','月'),
price:x.b2CPrice,
b2BMemberPrice:x.b2BMemberPrice,
b2BPrice:x.b2BPrice,
b2CMemberPrice:x.b2CMemberPrice,
id:index,
dateStrS:x.startDate.substring(0,x.startDate.length-3),
tcid: x.tcid,
configIDDes: x.configIDDes
}
dateList.push(msg);
}
});
}
let monthArray = [];
for (var i in dateList) {
var data = dateList[i];
var dateDict = {'mounth':data.dateStr.substring(0,data.dateStr.length-3)};
monthArray.push(dateDict);
}
//数组去重,获取有几个月
var hash={};
monthArray = monthArray.reduce(
function (item,next) {
hash[next.mounth]?'' :hash[next.mounth] = true && item.push(next);
return item;
},[]
)
//数据分组
let classArray = [];
for (var j in monthArray) {
var newArray = new Array();
for (var i in dateList) {
var data = dateList[i];
if (data.dateStr.substring(0,data.dateStr.length-3) == monthArray[j].mounth) {
newArray.push(data)
}
}
classArray.push(newArray);
}
this.classArray = classArray;
var hash={};
dateList = dateList.reduce(
function (item,next) {
hash[next.dateStrS]?'' :hash[next.dateStrS] = true && item.push(next);
return item;
},[]
)
this.calendarTit = dateList;
},
goScroll(id){
this.scrollobj.scrollTop=document.getElementById(id).offsetTop+screen.availHeight-350;
},
handleScroll(){
try {
if(this.scrollobj.scrollTop>this.$refs.nav.offsetTop){
this.changeNav=true
}else{
this.changeNav=false
}
let current=''
this.navs.forEach(x=>{
let t=document.getElementById(x).offsetTop
if(t<=this.scrollobj.scrollTop-200){
current=x
}
})
this.crtnav=current
} catch (error) {
}
},
selectMounth(index){
this.selectMonth = index;
this.indexActive = index;
},
initMap: function () {
//所有坐标
var locations = new Array(
"31.953313,121.841581","31.15347,121.291706",
"31.207516,121.412556","31.122909,121.458561",
"31.118207,121.38715","31.041168,121.426289",
"30.985262,121.301319","31.057934,121.305834");
//地图
var map;
var marker;
var poly;
/* 加载地图 */
var latlng = new google.maps.LatLng(31.253313, 121.241581);
var myOptions = {
zoom: 10, //缩放级别
center: latlng, //坐标
mapTypeId: google.maps.MapTypeId.ROADMAP //类型:默认的普通二维图块
};
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
// console.log(google)
// 线条设置
// var polyOptions = {
// strokeColor: '#4a90e2', // 颜色
// strokeOpacity: 1.0, // 透明度
// strokeWeight: 2 // 宽度
// }
// poly = new google.maps.Polyline(polyOptions);
// poly.setMap(map); // 装载
/* 循环标出所有坐标 */
// for(var i=0; i<locations.length; i++){
// var loc = locations[i].split(',');
// var path = poly.getPath(); //获取线条的坐标
// path.push(new google.maps.LatLng(loc[0], loc[1])); //为线条添加标记坐标
// //生成标记图标
// marker = new google.maps.MarkerWithLabel({
// position: new google.maps.LatLng(loc[0], loc[1]),
// labelContent: `<div>
// <img src="http://image-demo.oss-cn-hangzhou.aliyuncs.com/example.jpg?x-oss-process=image/resize,m_fixed,h_50,w_50"></img>
// <p>新疆-北京</p>
// </div>`, //需要显示的标题的内容
// labelAnchor: 0, //当前标题基于marker左上角的偏移
// labelStyle:{ //标题的style样式
// color: "red",
// fontSize: "12px"
// },
// map: map,
// labelClass:"_labelClass", //支持直接绑定class名,将样式写在css里面
// // icon: "http://image-demo.oss-cn-hangzhou.aliyuncs.com/example.jpg?x-oss-process=image/resize,m_fixed,h_50,w_50"
// })
// }
}
}
}
</script>
......@@ -273,8 +273,11 @@ export default {
this.hotcountry=res.data.data.pageData;
this.pageCount=res.data.data.pageCount;
if(this.listmsg.visaCountryId==0){
if(this.hotcountry.length>0){
this.listmsg.visaCountryId=this.hotcountry[0].id;
}
}
this.GetVisaProListChoose();
this.GetList();
} else {
......@@ -343,7 +346,7 @@ export default {
border-radius: 0;
}
.visaList .select_ul_height{
height: 22px;
height: 21px;
}
.visaList .el-pagination .btn-next,.visaList .el-pagination .btn-prev{
width: 28px!important;
......@@ -473,6 +476,7 @@ export default {
box-sizing: border-box;
width: 100%;
overflow: hidden;
min-height: 21px;
}
.Selectconditions .select_title{
position: absolute;
......
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