Skip to content

A
Athena
Commit d20dd21a authored by huangyuanyuan's avatar huangyuanyuan
Browse files
Options

update

parent fbda2dbb
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 742 additions and 0 deletions
src/components/DependentTravel/CustomizedTourism.vue 0 → 100644
View file @ d20dd21a
<template>
<div class="CustomizedTourism">
<div class="w1200" v-loading="loading">
<div class="step_head">
<p class="step_head_title">{{dataInfo.departureName}}-{{dataInfo.destinationNames}}/{{dataInfo.playDays}}天*定制游</p>
<p style="padding:20px 0;color:#333333;font-size:12px">需求编号：{{customId}}</p>
<el-steps :active="actice_step">
<el-step title="提交需求" icon="iconfont icon-yuandian"></el-step>
<el-step title="设计方案" icon="iconfont icon-yuandian"></el-step>
<el-step title="签订合同" icon="iconfont icon-yuandian"></el-step>
<el-step title="恭喜成团" icon="iconfont icon-yuandian"></el-step>
<el-step title="成团结束" icon="iconfont icon-yuandian"></el-step>
</el-steps>
</div>
<div>
<!-- 第一步 -->
<div v-if="actice_step==1" class="commonStyle Submitdemand">
<p class="title">需求单信息</p>
<ul class="dz_info_list">
<li><em>出游性质</em><p id="travelNature">个人定制</p></li>
<li><em>出发地</em><p id="departure">{{dataInfo.departureName}}</p></li>
<li><em>目的地</em><p id="destination">{{dataInfo.destinationNames}}</p></li>
<li><em>往返时间</em><p id="startDate">出发日期{{dataInfo.startDate | YMD}} ; 返回日期{{dataInfo.backDate | YMD}}</p></li>
<li><em>游玩天数</em><p id="journeyDay">{{dataInfo.playDays}}天</p></li>
<li><em>出行人数</em><p id="personNum"><span v-if="dataInfo.audltNumber>0">成人{{dataInfo.audltNumber}} </span>
<span v-if="dataInfo.childrenNumber>0"> 儿童{{dataInfo.childrenNumber}}</span></p></li>
<li><em>人均预算</em><p id="budget">{{dataInfo.budget}}</p></li>
</ul>
<p class="title" style="border-top:1px solid #DCDCDC">我的联系信息</p>
<ul class="dz_info_list">
<li><em>姓名</em><p id="travelNature">{{dataInfo.contact}}</p></li>
<li><em>手机号码</em><p id="departure">{{dataInfo.phoneNumber}}</p></li>
<li><em>电子邮箱</em><p id="destination">{{dataInfo.email}}</p></li>
<li><em>微信</em><p id="startDate">{{dataInfo.weChat}}</p></li>
</ul>
</div>
<!-- 第二步 -->
<div v-show="actice_step==2">
<DesignScheme :customId="customId" :tcid="tcid"></DesignScheme>
</div>
<div class="commonStyle Signcontract" v-if="actice_step==3 || actice_step==4 || actice_step==5">
<p class="title">订单信息</p>
<ul class="orderinfo">
<li>
<img style="width:200px;height:132px;" src="../../assets/img/visa/activy.jpg" alt="">
</li>
<li style="margin-left:25px;">
<p class="pfR" style="font-size:16px;">{{dataInfo.departureName}}-{{dataInfo.destinationNames}}/{{dataInfo.playDays}}天*定制游</p>
<p> 价格：<span class="pfR" style="color:#FB8F0F;font-size:22px">{{dataInfo.budget}}</span>人/起</p>
<p>
<span><em>行程描述</em>：{{dataInfo.travelSummary}}</span>
<span><em>参团人数</em>：{{dataInfo.childrenNumber+dataInfo.audltNumber}}人（{{dataInfo.audltNumber}}大{{dataInfo.childrenNumber}}小）</span>
</p>
<p>
<span><em>需求包含</em>：{{dataInfo.provideItem}}</span>
<span><em>游玩天数</em>：{{dataInfo.playDays}}天</span>
</p>
<p><em>放完日期</em>：出发日期（{{dataInfo.startDate | YMD}}）</p>
</li>
<li style="text-align:right;float:right">
<img style="width:50px;height:50px;border-radius:50%" :src="dataInfo.salesPhoto" alt="">
<p style="text-align:center">{{dataInfo.salesName}}</p>
</li>
</ul>
<p class="title">合同签订</p>
<div class="htqd">
<div v-for="(item,index) in dataInfo.contractFile" :key="index+200">
<p><a href="#">xxxxxxxxxxxx合同</a></p>
<p style="margin-top: 17px"><span class="downorder">
<span style="background:#B4B4B4;padding: 0px 3px;"><i class="iconfont icon-xiazai"></i></span>
下载合同</span></p>
</div>
</div>
<span class="yct" v-if="dataInfo.orderStatus==5">
<img src="../../assets/img/travel/yct.png" alt="">
</span>
<span class="yct" v-if="dataInfo.orderStatus==6">
<img src="../../assets/img/travel/yjs.png" alt="">
</span>
</div>
</div>
</div>
</div>
</template>
<script>
import DesignScheme from '@/components/DependentTravel/DesignScheme'
export default {
data () {
return {
actice_step:0,
customId:14,
loading:false,
dataInfo:{},
tcid:0,
}
},
components:{
DesignScheme
},
mounted() {
this.GetStatus();
},
methods: {
GetStatus(){
this.loading=true;
this.apiJavaPost('/api/b2b/free/getTravelCustomOrderInfo',{customId: this.customId},res=>{
this.loading=false;
console.log(res);
if(res.data.resultCode==1){
this.dataInfo=res.data.data;
this.tcid=this.dataInfo.tcid;
this.actice_step=this.dataInfo.orderStatus;
}else{
this.Error(res.data.message);
}
},null)
},
}
}
</script>
<style>
.CustomizedTourism .Signcontract .yct{
position: absolute;
top: 82px;
right: 199px;
display: inline-block;
width: 147px;
height: 79px;
border: 1px dashed #cccccc;
}
.CustomizedTourism .Signcontract .yct img{
width: 100%;
height: 100%;
}
.CustomizedTourism .Signcontract .htqd .icon-xiazai{
font-size: 12PX;
color: #fff;
}
.CustomizedTourism .Signcontract .htqd {
padding: 54px;
box-sizing: border-box;
}
.CustomizedTourism .Signcontract .htqd .downorder{
display: block;
font-size:14px;
color:#333333;
width:103px;
height:26px;
line-height: 26px;
text-align: center;
background:rgba(255,255,255,1);
border:1px solid rgba(210,210,210,1);
}
.CustomizedTourism .Signcontract .orderinfo li p{
position: relative;
margin-bottom: 16px;
}
.CustomizedTourism .Signcontract .orderinfo li p span:nth-child(2){
position: absolute;
left: 300px;
display: inline-block;
width: 300px;
}
.CustomizedTourism .pfR{
font-family: "PingFangR";
}
.CustomizedTourism .Signcontract .orderinfo li{
color:#000000;
font-size: 12px;
}
.CustomizedTourism .Signcontract .orderinfo li em{
font-style: normal;
color:#808080;
}
.CustomizedTourism .Signcontract .orderinfo{
overflow: auto;
padding: 30px 60px;
box-sizing: border-box;
}
.CustomizedTourism .Signcontract .orderinfo li{
float: left;
}
.CustomizedTourism .Submitdemand .dz_info_list li p{
color:#000000;
}
.CustomizedTourism .Submitdemand .dz_info_list li em {
width: 122px;
float: left;
margin-left: -146px;
text-align: right;
color: #666666;
display: inline;
font-style: normal;
}
.CustomizedTourism .Submitdemand .dz_info_list li {
padding: 6px 0;
}
.CustomizedTourism .Submitdemand .dz_info_list {
font-size: 12px;
padding: 20px 280px 20px 146px;
border-top: 1px solid #ddd;
margin-top: -1px;
position: relative;
}
.CustomizedTourism .title{
height:40px;
background:rgba(237,244,255,1);
line-height: 40px;
font-size: 14px;
font-family: "PingFangR";
padding-left: 15px;
}
.CustomizedTourism .commonStyle{
position: relative;
margin-top: 20px;
border:1px solid rgba(220,220,220,1);
}
.CustomizedTourism .el-step__line-inner{
border-width: 2px!important;
}
.CustomizedTourism .el-step__description.is-process,.el-step__description.is-wait{
color: #999999;
}
.CustomizedTourism .el-step__description.is-finish{
color: #666666;
}
.CustomizedTourism .el-step.is-horizontal .el-step__line{
height: 5px;
}
.CustomizedTourism .step_head .step_head_title{
font-size:16px;
font-family:"PingFangR";
color:rgba(51,51,51,1);
}
.CustomizedTourism .step_head{
padding: 30px 60px;
box-sizing: border-box;
background:rgba(255,255,255,1);
border:1px solid rgba(220,220,220,1);
}
.CustomizedTourism{
font-family:"PingFang";
}
.CustomizedTourism .w1200{
width: 1200px;
margin: 20px auto;
}
.CustomizedTourism .el-step__title{
font-size: 12px;
}
.CustomizedTourism .el-step__head.is-process{
color:#dcdcdc;
border-color: #dcdcdc;
}
.CustomizedTourism .el-step__title.is-process{
color:#dcdcdc;
}
.CustomizedTourism .el-step__line{
background-color: #e1e1e1;
}
.CustomizedTourism .el-step__head.is-wait {
color: #dcdcdc;
border-color: #dcdcdc;
}
.CustomizedTourism .icon-yuandian{
font-size: 19px;
}
</style>
src/components/DependentTravel/DesignScheme.vue 0 → 100644
View file @ d20dd21a
This diff is collapsed.
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