Skip to content

A
Athena
Commit 4bcea807 authored by 华国豪's avatar 华国豪 🙄
Browse files
Options

Merge branch 'master' of http://gitlab.oytour.com/huaguohao/athena

parents 0c20c8e6 0a57a597
Show whitespace changes
Inline Side-by-side
Showing with 894 additions and 180 deletions
src/components/Ticket/Choose.vue
View file @ 4bcea807
...@@ -8,19 +8,27 @@ ...@@ -8,19 +8,27 @@
<el-col :span="5"> <el-col :span="5">
<div class="city" style="margin-bottom:15px"> <div class="city" style="margin-bottom:15px">
<span>出发地 | </span> <span>出发地 | </span>
<el-input <el-select style="width:80%" v-model="choose_info.departure_city" filterable placeholder="请选择">
placeholder="请输入内容" <el-option :value=0 label="不限"></el-option>
v-model="input10" <el-option
clearable> v-for="item in cawei"
</el-input> :key="item.id"
:label="item.title"
:value="item.id">
</el-option>
</el-select>
</div> </div>
<div class="city"> <div class="city">
<span>目的地 | </span> <span>目的地 | </span>
<el-input <el-select style="width:80%" v-model="choose_info.arrival_city" filterable placeholder="请选择">
placeholder="请输入内容" <el-option :value=0 label="不限"></el-option>
v-model="input10" <el-option
clearable> v-for="item in cawei"
</el-input> :key="item.id"
:label="item.title"
:value="item.id">
</el-option>
</el-select>
</div> </div>
</el-col> </el-col>
<el-col :span="6"> <el-col :span="6">
...@@ -47,22 +55,22 @@ ...@@ -47,22 +55,22 @@
<div style="margin-bottom:15px"> <div style="margin-bottom:15px">
<div class="number"> <div class="number">
<span>成人 | </span> <span>成人 | </span>
<el-input-number size="mini" v-model="num1" @change="handleChange" :min="0" :max="10" label="描述文字"></el-input-number> <el-input-number size="mini" v-model="choose_info.cr" @change="handleChange" :min="0" :max="10" label="描述文字"></el-input-number>
</div> </div>
<div class="number"> <div class="number">
<span>儿童 | </span> <span>儿童 | </span>
<el-input-number size="mini" v-model="num1" @change="handleChange" :min="0" :max="10" label="描述文字"></el-input-number> <el-input-number size="mini" v-model="choose_info.child" @change="handleChange" :min="0" :max="10" label="描述文字"></el-input-number>
</div> </div>
<div class="number"> <div class="number">
<span>婴儿 | </span> <span>婴儿 | </span>
<el-input-number size="mini" v-model="num1" @change="handleChange" :min="0" :max="10" label="描述文字"></el-input-number> <el-input-number size="mini" v-model="choose_info.ye" @change="handleChange" :min="0" :max="10" label="描述文字"></el-input-number>
</div> </div>
<el-button @click="Search" size="small">搜索</el-button> <el-button @click="Search" size="small">搜索</el-button>
</div> </div>
<div> <div>
<div class="city" style="width:200px;display:inline-block;margin-right:10px"> <div class="city" style="width:200px;display:inline-block;margin-right:10px">
<span>舱位选择 | </span> <span>舱位选择 | </span>
<el-select v-model="value" placeholder="请选择"> <el-select v-model="choose_info.freightSpace" placeholder="请选择">
<el-option <el-option
v-for="item in cawei" v-for="item in cawei"
:key="item.id" :key="item.id"
...@@ -73,7 +81,8 @@ ...@@ -73,7 +81,8 @@
</div> </div>
<div class="city" style="width:250px;display:inline-block"> <div class="city" style="width:250px;display:inline-block">
<span>航空公司 | </span> <span>航空公司 | </span>
<el-select style="width:180px" filterable v-model="value" placeholder="请选择"> <el-select style="width:180px" filterable v-model="choose_info.airLineID" placeholder="请选择">
<el-option :value=0 label="不限"></el-option>
<el-option v-for="item in airlineList" :label="item.AlName" :value="item.AirLineId" <el-option v-for="item in airlineList" :label="item.AlName" :value="item.AirLineId"
:key="item.AirLineId"></el-option> :key="item.AirLineId"></el-option>
</el-select> </el-select>
...@@ -99,12 +108,16 @@ export default { ...@@ -99,12 +108,16 @@ export default {
qFlightDateEnd:"", qFlightDateEnd:"",
flight_number:"", flight_number:"",
airLineID:0, airLineID:0,
ticketType:1, ticketType:0,
lineId:0, lineId:0,
isPayOrder:0, isPayOrder:0,
departure_city:0, departure_city:0,
arrival_city:0, arrival_city:0,
freightSpace:1 freightSpace:0,
airTicketScatterNum:0,
cr:0,
child:0,
ye:0,
}, },
startweek:"", startweek:"",
...@@ -174,16 +187,24 @@ export default { ...@@ -174,16 +187,24 @@ export default {
changeStart(val){ changeStart(val){
let num=moment(val,'YYYY-MM-DD').format('E'); let num=moment(val,'YYYY-MM-DD').format('E');
this.startweek=this.Weekday(num); this.startweek=this.Weekday(num);
this.choose_info.qFlightDateStart=moment(val).format('YYYY-MM-DD');
}, },
changeEnd(val){ changeEnd(val){
let num=moment(val,'YYYY-MM-DD').format('E'); let num=moment(val,'YYYY-MM-DD').format('E');
this.endweek=this.Weekday(num); this.endweek=this.Weekday(num);
this.choose_info.qFlightDateEnd=moment(val).format('YYYY-MM-DD');
}, },
// moment("2018-10-29",'YYYY-MM-DD').format('E') // moment("2018-10-29",'YYYY-MM-DD').format('E')
handleChange(){}, handleChange(){},
Search(){ Search(){
this.choose_info.airTicketScatterNum=this.choose_info.cr+this.choose_info.child+this.choose_info.ye;
console.log(this.choose_info,'choose_info');
this.$emit("ChooseInfo",this.choose_info) this.$emit("ChooseInfo",this.choose_info)
this.$router.push({
path: 'TicketList',
query:this.choose_info
})
} }
} }
......
src/components/Ticket/TicketHome.vue
View file @ 4bcea807
...@@ -4,78 +4,7 @@ ...@@ -4,78 +4,7 @@
<img src="../../assets/img/ticket/banner.png" alt=""> <img src="../../assets/img/ticket/banner.png" alt="">
<div class="choose"> <div class="choose">
<div class="choose_1"> <div class="choose_1">
<div> <v-choose @ChooseInfo="ChooseInfo"></v-choose>
<el-radio v-model="radio" label="1">单程</el-radio>
<el-radio v-model="radio" label="2">往返</el-radio>
</div>
<el-row class="msg">
<el-col :span="5">
<div class="city" style="margin-bottom:15px">
<span>出发地 | </span>
<el-input
placeholder="请输入内容"
v-model="input10"
clearable>
</el-input>
</div>
<div class="city">
<span>目的地 | </span>
<el-input
placeholder="请输入内容"
v-model="input10"
clearable>
</el-input>
</div>
</el-col>
<el-col :span="6">
<div class="city" style="margin-bottom:15px">
<span>出发 | </span>
<el-date-picker
v-model="value1"
type="date"
placeholder="选择日期">
</el-date-picker>
</div>
<div class="city">
<span>归期 | </span>
<el-date-picker
v-model="value1"
type="date"
placeholder="选择日期">
</el-date-picker>
</div>
</el-col>
<el-col :span="13">
<div style="margin-bottom:15px">
<div class="number">
<span>成人 | </span>
<el-input-number size="mini" v-model="num1" @change="handleChange" :min="0" :max="10" label="描述文字"></el-input-number>
</div>
<div class="number">
<span>儿童 | </span>
<el-input-number size="mini" v-model="num1" @change="handleChange" :min="0" :max="10" label="描述文字"></el-input-number>
</div>
<div class="number">
<span>婴儿 | </span>
<el-input-number size="mini" v-model="num1" @change="handleChange" :min="0" :max="10" label="描述文字"></el-input-number>
</div>
<el-button size="small">搜索</el-button>
</div>
<div>
<div class="city">
<span>舱位选择 | </span>
<el-select v-model="value" placeholder="请选择">
<el-option
v-for="item in options5"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
</div>
</el-col>
</el-row>
</div> </div>
</div> </div>
</div> </div>
...@@ -88,7 +17,7 @@ ...@@ -88,7 +17,7 @@
</div> </div>
</div> </div>
<div class="banner_img" style="margin:0 auto;margin-top:20px;"> <div class="banner_img" style="margin:0 auto;margin-top:20px;">
<el-carousel trigger="click" height="274px"> <el-carousel ref="carousel" trigger="click" :height="carousel_height">
<el-carousel-item> <el-carousel-item>
<el-row :gutter="18" style="height:100%"> <el-row :gutter="18" style="height:100%">
<el-col :span="18" :offset="3" style="height:100%"> <el-col :span="18" :offset="3" style="height:100%">
...@@ -107,27 +36,69 @@ ...@@ -107,27 +36,69 @@
</div> </div>
<div class="carousel_small"> <div class="carousel_small">
<img style="width:100%" src="../../assets/img/ticket/md.png" alt=""> <img style="width:100%" src="../../assets/img/ticket/md.png" alt="">
<div class="info">
<div class="table_cell">
<p class="ch">缅甸</p>
<p class="en">MYANMAR</p>
</div>
</div>
</div> </div>
</el-col> </el-col>
<el-col :span="9" style="height:100%"> <el-col :span="9" style="height:100%">
<div class="carousel_large"> <div class="carousel_large">
<img style="width:100%;height: 100%;" src="../../assets/img/ticket/rb.png" alt=""> <img style="width:100%;height: 100%;" src="../../assets/img/ticket/rb.png" alt="">
<div class="info">
<div class="table_cell">
<p class="ch">日本</p>
<p class="en">JANAN</p>
</div>
</div>
</div> </div>
</el-col> </el-col>
<el-col :span="5"> <el-col :span="5">
<div class="carousel_small"> <div class="carousel_small">
<img style="width:100%" src="../../assets/img/ticket/bld.png" alt=""> <img style="width:100%" src="../../assets/img/ticket/bld.png" alt="">
<div class="info">
<div class="table_cell">
<p class="ch">巴厘岛</p>
<p class="en">BALI</p>
</div>
</div>
</div> </div>
<div class="carousel_small"> <div class="carousel_small">
<img style="width:100%" src="../../assets/img/ticket/xg.png" alt=""> <img style="width:100%" src="../../assets/img/ticket/xg.png" alt="">
<div class="info">
<div class="table_cell">
<p class="ch">香港</p>
<p class="en">HONGKONG</p>
</div>
</div>
</div> </div>
</el-col> </el-col>
<el-col :span="5"> <el-col :span="5">
<div class="carousel_small"> <div class="carousel_small">
<img style="width:100%" src="../../assets/img/ticket/teq.png" alt=""> <img style="width:100%" src="../../assets/img/ticket/teq.png" alt="">
<div class="info">
<div class="table_cell">
<p class="ch">土耳其</p>
<p class="en">TuRKEY</p>
</div>
</div>
</div> </div>
<div class="carousel_small"> <div class="carousel_small">
<img style="width:100%" src="../../assets/img/ticket/yd.png" alt=""> <img style="width:100%" src="../../assets/img/ticket/yd.png" alt="">
<div class="info">
<div class="table_cell">
<p class="ch">雅典</p>
<p class="en">ATHENS</p>
</div>
</div>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
...@@ -140,48 +111,89 @@ ...@@ -140,48 +111,89 @@
</div> </div>
<div style="background:#f5f5f5">
<el-row :gutter="18">
<el-col :span="18" :offset="3" >
<div >
<p class="jxyh">精选特惠</p>
<!-- <img src="../../assets/img/ticket/banner.png" alt=""> -->
</div>
<div class="yh" style="background:#fff">
<div v-for="(item,key) in yhList" :key="key">
<img :src="item.airlineUrl" alt="">
<div class="list_content">
<p class="des">
<!-- -->
<span>{{item.flightList[0].departureName}} - {{item.flightList[item.flightList.length-1].arrivalCityName}} </span>
<span class="money">￥{{item.scatterB2BPrice}}</span>
</p>
<p>
<img style="width:20px;height:20px" :src="item.airlineUrl" alt="">
<span style="margin-left:10px">{{item.airlineName}} </span>
</p>
<p class="time">出发时间：02-15 15:20</p>
</div>
</div>
</div>
<div style="text-align:center">
<span class="allyh">
<img style="width:10px;height:13px" src="../../assets/img/ticket/qbyh.png" alt="">
全部优惠</span>
</div>
</el-col >
</el-row>
</div>
</div> </div>
</template> </template>
<script> <script>
import Choose from '@/components/Ticket/Choose.vue'
export default { export default {
components: {
"v-choose":Choose
},
data () { data () {
return { return {
carousel_height:"0px",
bannerHeight:"282px", bannerHeight:"282px",
radio:"", Choose_Info:{},
value10:"", Youhui:{
options5:[], isDiscounts:1,
value1:"", },
num1:"", yhList:[],
} }
}, },
mounted() { mounted() {
// this.apiJavaPost('/api/dmc/airticket/getB2BAirticketForMonthMinPrice',{"id":0,"flithtMonthDate":"2019-02","flight_number":"","airLineID":0,"ticketType":0,"lineId":0,"isPayOrder":0,"departure_city":0,"arrival_city":0,"freightSpace":0},res=>{ this.loadSize()
// console.log(res)
// },null)
}, },
created(){ created(){
// this.loadSize(); // this.MDD();
this.JXYH();
}, },
methods: { methods: {
JXYH(){
this.apiJavaPost('/api/dmc/airticket/getB2BAirticketList',this.Youhui,res=>{
console.log("Youhui",res)
this.yhList=res.data.data.pageData;
},null)
},
MDD() {
this.apiJavaPost('/api/dmc/airticket/getB2BAirticketList',this.Choose_Info,res=>{
// console.log("mudidi",res)
},null)
},
ChooseInfo(val){
console.log("ChooseInfo",val)
if(val){
this.Choose_Info=val;
}
},
loadSize(){ loadSize(){
let w=screen.availWidth let w=document.body.clientWidth * 0.75;
w=w/24*20 this.carousel_height=w*0.269+"px";
w=w-(17*5)
w=w/6
this.itemHeight=w/1.5+'px'
this.w=Math.floor(w)
this.h=Math.floor((w/1.5))
// console.log(this.$refs.groupHeightId)
this.groupHeight=Math.floor(screen.availWidth*0.8333*0.1666/0.63)-6
w=screen.availWidth
w=w/24*20
w=w-(10*3)
w=w/4
this.groupItemHeight=w/1.8+'px'
} }
} }
} }
...@@ -192,7 +204,79 @@ export default { ...@@ -192,7 +204,79 @@ export default {
@import '//at.alicdn.com/t/font_863923_3d1f1rd9oj6.css'; @import '//at.alicdn.com/t/font_863923_3d1f1rd9oj6.css';
@import '../../assets/global/global.css'; @import '../../assets/global/global.css';
@import '../../assets/css/reset.css'; @import '../../assets/css/reset.css';
.allyh{
display: inline-block;
width:128px;
height:34px;
line-height: 34px;
background:rgba(255,255,255,1);
border:1px solid rgba(51,51,51,1);
margin:15px 0;
font-size: 14px;
cursor: pointer;
}
.list_content p{
padding:4px 0;
}
p{
margin:0;
}
.list_content .time{
font-size:14px;
font-family:MicrosoftYaHei;
font-weight:400;
color:#333;
}
.list_content .money{
float: right;
font-size:24px;
font-family:MicrosoftYaHei-Bold;
font-weight:bold;
color:rgba(255,102,51,1);
}
.list_content .des{
font-size:20px;
font-family:MicrosoftYaHei-Bold;
font-weight:bold;
color:rgba(51,51,51,1);
}
.jxyh{
height:89px;
background:rgba(237,247,248,1);
font-weight:400;
color:rgba(6,6,6,1);
font-size:24px;line-height:89px;
text-align:center;
}
.list_content{
width:100%;
padding-left: 120px;
box-sizing: border-box;
}
.yh{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
overflow: auto;
padding:10px;
box-sizing: border-box;
}
.yh>div{
margin:6px 0;
width:45%;
padding:10px;
box-sizing: border-box;
position: relative;
}
.yh>div:hover{
box-shadow:0px 4px 8px 0px rgba(107,107,107,0.27);
}
.yh>div>img{
position: absolute;
width:100px;
height: 100px;
}
.banner_img .info{ .banner_img .info{
position: absolute; position: absolute;
top: 0; top: 0;
...@@ -207,7 +291,7 @@ export default { ...@@ -207,7 +291,7 @@ export default {
color: #ffffff; color: #ffffff;
} }
.carousel_large,.carousel_small{ .carousel_large,.carousel_small{
padding:6px; padding:0 6px;
box-sizing: border-box; box-sizing: border-box;
position: relative; position: relative;
...@@ -216,7 +300,7 @@ export default { ...@@ -216,7 +300,7 @@ export default {
height: 50%; height: 50%;
} }
.carousel_large{ .carousel_large{
height:100%;
} }
.el-col-5 { .el-col-5 {
height: 100%; height: 100%;
...@@ -238,7 +322,8 @@ export default { ...@@ -238,7 +322,8 @@ export default {
} }
.banner_two{ .banner_two{
width: 100%; width: 100%;
height: 491px; margin-bottom:15px;
/* height: 461px; */
} }
...@@ -281,7 +366,7 @@ export default { ...@@ -281,7 +366,7 @@ export default {
margin-top: 15px; margin-top: 15px;
} }
.msg .city{ .msg .city{
width:200px; width:95%;
height:34px; height:34px;
background:rgba(255,255,255,1); background:rgba(255,255,255,1);
border:1px solid rgba(216,218,220,1); border:1px solid rgba(216,218,220,1);
...@@ -317,12 +402,12 @@ export default { ...@@ -317,12 +402,12 @@ export default {
} }
.choose{ .choose{
position: absolute; position: absolute;
min-width: 1120px; min-width: 1300px;
background: rgba(255, 255, 255, 0.24); background: rgba(255, 255, 255, 0.24);
height:175px; height:175px;
padding:10px; padding:10px;
bottom: -10px; bottom: -10px;
left: 20%; left: 16%;
border-radius: 4px; border-radius: 4px;
box-sizing: border-box; box-sizing: border-box;
} }
......
src/components/Ticket/TicketList.vue
View file @ 4bcea807
...@@ -5,43 +5,137 @@ ...@@ -5,43 +5,137 @@
<div style="background:rgba(255,255,255,1);box-shadow:0px 4px 8px 0px rgba(107,107,107,0.18);"> <div style="background:rgba(255,255,255,1);box-shadow:0px 4px 8px 0px rgba(107,107,107,0.18);">
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="20" :offset="2"> <el-col :span="20" :offset="2">
<v-choose @ChooseInfo="ChooseInfo"></v-choose> <el-row class="msg">
<div style="margin-bottom:10px">
<el-radio v-model="choose_info.ticketType" :label=1>单程</el-radio>
<el-radio v-model="choose_info.ticketType" :label=2>往返</el-radio>
</div>
<el-col :span="5">
<div class="city" style="margin-bottom:15px">
<span>出发地 | </span>
<el-select style="width:80%" v-model="choose_info.departure_city" filterable placeholder="请选择">
<el-option :value="zero" label="不限"></el-option>
<el-option
v-for="item in cawei"
:key="item.id"
:label="item.title"
:value="item.id">
</el-option>
</el-select>
</div>
<div class="city">
<span>目的地 | </span>
<el-select style="width:80%" v-model="choose_info.arrival_city" filterable placeholder="请选择">
<el-option :value="zero" label="不限"></el-option>
<el-option
v-for="item in cawei"
:key="item.id"
:label="item.title"
:value="item.id">
</el-option>
</el-select>
</div>
</el-col>
<el-col :span="6">
<div class="city" style="margin-bottom:15px">
<span>出发 | </span>
<el-date-picker @change="changeStart"
v-model="choose_info.qFlightDateStart"
type="date"
placeholder="选择日期">
</el-date-picker>
<span>{{startweek}}</span>
</div>
<div class="city">
<span>归期 | </span>
<el-date-picker @change="changeEnd"
v-model="choose_info.qFlightDateEnd"
type="date"
placeholder="选择日期">
</el-date-picker>
<span>{{endweek}}</span>
</div>
</el-col>
<el-col :span="13">
<div style="margin-bottom:15px">
<div class="number">
<span>成人 | </span>
<el-input-number size="mini" v-model="choose_info.cr" @change="handleChange" :min="0" :max="10" label="描述文字"></el-input-number>
</div>
<div class="number">
<span>儿童 | </span>
<el-input-number size="mini" v-model="choose_info.child" @change="handleChange" :min="0" :max="10" label="描述文字"></el-input-number>
</div>
<div class="number">
<span>婴儿 | </span>
<el-input-number size="mini" v-model="choose_info.ye" @change="handleChange" :min="0" :max="10" label="描述文字"></el-input-number>
</div>
<el-button @click="Search" size="small">搜索</el-button>
</div>
<div>
<div class="city" style="width:200px;display:inline-block;margin-right:10px">
<span>舱位选择 | </span>
<el-select v-model="choose_info.freightSpace" placeholder="请选择">
<el-option :value="zero" label="不限"></el-option>
<el-option
v-for="item in cawei"
:key="item.id"
:label="item.title"
:value="item.id">
</el-option>
</el-select>
</div>
<div class="city" style="width:250px;display:inline-block">
<span>航空公司 | </span>
<el-select style="width:180px" filterable v-model="choose_info.airLineID" placeholder="请选择">
<el-option :value="zero" label="不限"></el-option>
<el-option v-for="item in airlineList" :label="item.AlName" :value="item.AirLineId"
:key="item.AirLineId"></el-option>
</el-select>
</div>
</div>
</el-col>
</el-row>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
<div class="ticketlist_content"> <div class="ticketlist_content">
<!-- <calendar v-for="(item,index) in classArray" :key="index" :dateData= "item" :day = "item[0].dateStr" @ChildrenSelect="ListenChildren" v-if="index == selectMonth"/> -->
<!-- 查询机票列表 --> <!-- 查询机票列表 -->
<div> <div>
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="20" :offset="2"> <el-col :span="20" :offset="2">
<div class="date_list"> <div class="date_list">
<div style="color:#dddddd;font-size:20px" class="margin common">&lt;</div> <div @click="BeforeDate" style="color:#dddddd;font-size:20px" class="margin common">&lt;</div>
<div class="li"> <div class="li" :class="{'active_data':index==4}" v-for="(item,index) in dateList" :key="index">
<div> <div>
<p class="font_12" style="color:#FF680B">￥358</p> <p class="font_12" style="color:#FF680B">￥{{item.price}}</p>
<p class="font_12">02-15 周五</p> <p class="font_12">{{item.monthTime}} {{item.week}}</p>
</div> </div>
</div> </div>
<div class="li">
<div> <div @click="AfterDate" style="color:#dddddd;font-size:20px" class="margin common">&gt;</div>
<p class="font_12" style="color:#FF680B">￥358</p> <div class="font_12" style="margin-top:30px;color:#FF680B;width:6%;position:relative">
<p class="font_12">02-15 周五</p> <span @click="OtherToggle">其他日期</span>
<div class="otherdate" v-show="other">
<div style="font-size:16px;padding:10px">
<el-col :span="8"><span @click="ChangeMonth(1)" class="month_circle">&lt;</span> </el-col>
<el-col :span="8">{{tomonth}}</el-col>
<el-col :span="8"><span @click="ChangeMonth(2)" class="month_circle">&gt;</span></el-col>
</div> </div>
<div style="margin-top:22px">
<v-calendar ref="children" v-for="(item,index) in classArray" :key="index" :dateData= "item" :month="tomonth" :day = "item[0].dateStr" @ChildrenSelect="ListenChildren">
</v-calendar>
</div> </div>
<div class="li active_data">
<div>
<p class="font_12" style="color:#FF680B">￥358</p>
<p class="font_12">02-15 周五</p>
</div> </div>
</div> </div>
<div style="color:#dddddd;font-size:20px" class="margin common">&gt;</div>
<div class="font_12" style="margin-top:30px;color:#FF680B;width:6%">其他日期</div>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
<div v-if="datalist.length>0">
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="20" :offset="2"> <el-col :span="20" :offset="2">
<el-row class="px" style="margin-bottom:10px"> <el-row class="px" style="margin-bottom:10px">
...@@ -54,41 +148,113 @@ ...@@ -54,41 +148,113 @@
</el-col> </el-col>
</el-row> </el-row>
<el-row class="list"> <el-row class="list" v-for="(item,index) in datalist" :key="index">
<el-col :span="4" class="first"> <el-col :span="4" class="first">
<el-row> <el-row>
<el-col :span="10"> <el-col :span="10">
<img src="" alt=""> <img :src="item.airlineUrl" alt="">
</el-col> </el-col>
<el-col :span="14"> <el-col :span="14">
<p style="font-size:14px;color:rgba(0,0,0,1);">四川航空</p> <p style="font-size:14px;color:rgba(0,0,0,1);">{{item.airlineName}}</p>
<p style="font-size:12px;color:rgba(0,0,0,1);">3U609 空客330（大）</p> <p style="font-size:12px;color:rgba(0,0,0,1);">{{item.alCode}}</p>
</el-col> </el-col>
</el-row> </el-row>
</el-col> </el-col>
<el-col class="second" :span="10"> <el-col class="second" :span="10">
<el-col :span="8" style="text-align:right"> <div style="width:100%;overflow:auto;margin-bottom:10px">
<p class="time">14:20</p> <el-col v-if="item.ticketType==2" :span="2" style="text-align:right">
<p class="adress">双流国际机场T1</p> <span class="cilcle">往</span>
</el-col>
<el-col :span="7" style="text-align:right">
<p class="time">{{item.goStartHouseTime}}</p>
<p class="adress">{{item.goStartAirPlace}}</p>
</el-col>
<el-col :span="6" style="text-align:center">
<p style="font-size:12px;color:rgba(102,102,102,1);">{{item.goTotalTime}}</p>
<p class="fg"></p>
<p class="adress" v-if="item.goTransfer"><span class="green">{{item.goTransfer}}</span>转机</p>
</el-col>
<el-col :span="8" style="text-align:left">
<p class="time">{{item.goEndHouseTime}}</p>
<p class="adress">{{item.goEndAirPlace}}</p>
<span class="green num" v-if="item.goIsNextDay==1">+{{item.goIsNextDay}}</span>
</el-col>
</div>
<div v-if="item.ticketType==2">
<el-col :span="2" style="text-align:right">
<span class="cilcle">返</span>
</el-col>
<el-col :span="7" style="text-align:right">
<p class="time">{{item.backStartHouseTime}}</p>
<p class="adress">{{item.backStartAirPlace}}</p>
</el-col> </el-col>
<el-col :span="8" style="text-align:center"> <el-col :span="6" style="text-align:center">
<p style="font-size:12px;color:rgba(102,102,102,1);">12小时34分</p> <p style="font-size:12px;color:rgba(102,102,102,1);">{{item.backTotalTime}}</p>
<p class="fg"></p> <p class="fg"></p>
<p class="adress"><span class="green">香港</span>转机</p> <p class="adress" v-if="item.backTransfer"><span class="green">{{item.backTransfer}}</span>转机</p>
</el-col> </el-col>
<el-col :span="8" style="text-align:left"> <el-col :span="8" style="text-align:left">
<p class="time">14:20</p> <p class="time">{{item.backEndHouseTime}}</p>
<p class="adress">双流国际机场T1</p> <p class="adress">{{item.backEndAirPlace}}</p>
<span class="green num">+1</span> <span class="green num" v-if="item.backIsNextDay==1">+{{item.backIsNextDay}}</span>
</el-col> </el-col>
</div>
</el-col> </el-col>
<el-col class="third" :span="10" style="text-align:center"> <el-col class="third" :span="10" style="text-align:center">
<el-col :span="8"> <el-col :span="8">
<p class="orange font_12" style="margin-top:15px;">航班详情</p> <p class="orange font_12" style="margin-top:15px;position:relative">
<el-popover visible-arrow="false"
placement="bottom"
trigger="click">
<div class="describe">
<p class="info">航班信息</p>
<div class="content" v-for="(flight,i) in item.flightList" :key="i">
<p v-if="i>0" style="text-align:center">中转</p>
<div>
<!-- <img class="imgsrc" src="" alt=""> -->
<span>{{flight.alName}}</span>
</div>
<ul class="list_cn">
<li>
{{flight.ticketDepartureTime}} <span class="list_circle"></span> {{flight.sName}}
</li>
<li>
{{flight.ticketArrivalTime}} <span class="list_circle"></span> {{flight.dName}}
</li>
</ul>
</div>
<div class="content" v-for="(back,k) in item.backFlightList" :key="k.id">
<p v-if="k>0" style="text-align:center">中转</p>
<div>
<!-- <img class="imgsrc" src="" alt=""> -->
<span>{{back.alName}}</span>
</div>
<ul class="list_cn">
<li>
{{back.ticketDepartureTime}} <span class="list_circle"></span> {{back.sName}}
</li>
<li>
{{back.ticketArrivalTime}} <span class="list_circle"></span> {{back.dName}}
</li>
</ul>
</div>
</div>
<span slot="reference" style="cursor: pointer;">航班详情</span>
</el-popover>
</p>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<p class="orange">￥489</p> <p class="orange">￥{{item.scatterB2BPrice}}</p>
<p class="font_12" style="margin-top:10px;">经济舱</p> <p class="font_12" style="margin-top:10px;">
<span v-if="item.freightSpace==1">头等舱</span>
<span v-if="item.freightSpace==2">商务舱</span>
<span v-if="item.freightSpace==3">经济舱</span>
</p>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-button style="color:#FF6633;border:1px solid #FF6633;margin-top:10px" size="small">购买</el-button> <el-button style="color:#FF6633;border:1px solid #FF6633;margin-top:10px" size="small">购买</el-button>
...@@ -97,6 +263,11 @@ ...@@ -97,6 +263,11 @@
</el-row> </el-row>
</el-col> </el-col>
</el-row> </el-row>
</div>
<div v-if="datalist.length==0" style="padding:15px 0;text-align:center">
暂无数据.....
</div>
</div> </div>
</div> </div>
...@@ -105,7 +276,7 @@ ...@@ -105,7 +276,7 @@
<script> <script>
import moment from 'moment' import moment from 'moment'
import Choose from '@/components/Ticket/Choose.vue' import Choose from '@/components/Ticket/Choose.vue'
import calendar from '@/components/mall/calendar.vue' import calendar from '@/components/mall/newcalendar.vue'
export default { export default {
components: { components: {
"v-choose":Choose, "v-choose":Choose,
...@@ -113,9 +284,58 @@ export default { ...@@ -113,9 +284,58 @@ export default {
}, },
data () { data () {
return { return {
zero:0 || "0",
classArray:[], classArray:[],
Choose_Info:{}, Choose_Info:{},
today:moment().format("YYYY-MM-DD"), today:moment().format("YYYY-MM-DD HH:mm:ss"),
datalist:[],
datainfo:{},
dateList:[],
changeday:moment().format("YYYY-MM-DD HH:mm:ss"),
other:false,
other_date:{
flithtMonthDate:moment().format("YYYY-MM")
},
tomonth:moment().format("YYYY-MM"),
change_month:moment().format("YYYY-MM"),
params_str:this.$route.query,
cr:0,
child:0,
ye:0,
choose_info:{
pageIndex:1,
pageSize:10,
id:0,
qFlightDateStart:"",
qFlightDateEnd:"",
flight_number:"",
airLineID:0,
ticketType:0,
lineId:0,
isPayOrder:0,
departure_city:0,
arrival_city:0,
freightSpace:1,
airTicketScatterNum:0,
},
startweek:"",
endweek:"",
bannerHeight:"282px",
radio:"",
value10:"",
cawei:[
{title:"头等舱",id:1},
{title:"商务舱",id:2},
{title:"经济舱",id:3}
],
value1:"",
num1:"",
input10:"",
value:"",
airlineList:[],
} }
}, },
...@@ -124,39 +344,168 @@ export default { ...@@ -124,39 +344,168 @@ export default {
}, },
created(){ created(){
// this.getList() // this.getList()
console.log(this.today) // this.Datelist();
console.log("this.params_str",this.params_str)
if(this.params_str){
this.choose_info=this.params_str;
}
if(this.params_str.qFlightDateStart){
this.datainfo.qFlightDateStart=this.params_str.qFlightDateStart+" 00:00:00"
}else{
this.datainfo.qFlightDateStart=moment().format('YYYY-MM-DD HH:mm:ss');
}
this.getList();
this.Datelist();
this.OtherDate();
this.initAirlines();
this.CFD();
}, },
methods: { methods: {
// 出发地
CFD(){
this.apipost(
"dict_post_Destination_GetCityList", {},
res => {
console.log(res)
if (res.data.resultCode == 1) {
}
},
err => {
}
);
},
// 航空公司下拉框
initAirlines() {
this.apipost(
"airline_post_GetList", {},
res => {
// console.log(res)
if (res.data.resultCode == 1) {
this.airlineList = res.data.data;
}
},
err => {
}
);
},
Weekday(num){
if(num==1){
return "周一"
}
if(num==2){
return "周二"
}
if(num==3){
return "周三"
}
if(num==4){
return "周四"
}
if(num==5){
return "周五"
}
if(num==6){
return "周六"
}
if(num==7){
return "周日"
}
},
changeStart(val){
let num=moment(val,'YYYY-MM-DD').format('E');
this.startweek=this.Weekday(num);
this.choose_info.qFlightDateStart=moment(val).format('YYYY-MM-DD');
},
changeEnd(val){
let num=moment(val,'YYYY-MM-DD').format('E');
this.endweek=this.Weekday(num);
this.choose_info.qFlightDateEnd=moment(val).format('YYYY-MM-DD');
},
// moment("2018-10-29",'YYYY-MM-DD').format('E')
handleChange(){},
Search(){
this.getList();
this.Datelist();
ChooseInfo(val){
console.log("ChooseInfo",val)
if(val){ },
this.Choose_Info=val;
this.getList()
ListenChildren(word){
let data = this.dataList.priceList;
for ( let i = 0; i < data.length; i++) {
if (word===data[i].startDate.slice(data[i].startDate.length-2,data[i].startDate.length)){
this.priceListIndex = i;
}
} }
}, },
OtherToggle(){
this.other=!this.other;
},
ChangeMonth(num){
if(num==1){
this.tomonth=moment(this.tomonth).subtract(1, 'month').format('YYYY-MM');
this.other_date.flithtMonthDate=this.tomonth;
}else{
this.tomonth=moment(this.tomonth).add(1, 'month').format('YYYY-MM');
this.other_date.flithtMonthDate=this.tomonth;
}
this.OtherDate();
// this.$refs.children.getYearMonthDay();
},
// 其他日期
OtherDate(){
this.apiJavaPost('/api/dmc/airticket/getB2BAirticketForMonthMinPrice',this.other_date,res=>{
let list=res.data.data;
this.creatCalendar(list)
},null)
},
AfterDate(){
this.changeday=moment(this.changeday).add(1, 'days').format('YYYY-MM-DD HH:mm:ss');
this.datainfo.qFlightDateStart=this.changeday;
this.Datelist();
},
// 获取当前日期的前一天
BeforeDate(){
this.changeday=moment(this.changeday).subtract(1, 'days').format('YYYY-MM-DD HH:mm:ss');
this.datainfo.qFlightDateStart=this.changeday;
this.Datelist();
},
Datelist(){
this.apiJavaPost('/api/dmc/airticket/getB2BAirticketForMinPrice',this.datainfo,res=>{
// console.log(res);
this.dateList=res.data.data;
},null)
},
getList(){ getList(){
this.apiJavaPost('/api/dmc/airticket/getB2BAirticketList',this.Choose_Info,res=>{ this.apiJavaPost('/api/dmc/airticket/getB2BAirticketList',this.choose_info,res=>{
console.log("机票",res) // console.log("机票列表",res)
this.datalist=res.data.data.pageData;
},null) },null)
}, },
creatCalendar(list){ // 创建日历 creatCalendar(list){ // 创建日历
let dateList = []; let dateList = [];
if(list && list.length>0){ if(list && list.length>0){
list.forEach((x,index)=>{ list.forEach((x,index)=>{
if(x.tcState==3){ // if(parseFloat(999) > 0){
let msg = { let msg = {
dateStr:x.startDate, dateStr:x.timeStr,
cDate:x.startDate.replace('-','年').replace('-','月'), cDate:x.timeStr.replace('-','年').replace('-','月'),
price:x.b2CPrice, price:x.price,
b2BMemberPrice:x.b2BMemberPrice, b2BMemberPrice:x.price,
b2BPrice:x.b2BPrice, b2BPrice:x.price,
b2CMemberPrice:x.b2CMemberPrice, b2CMemberPrice:x.price,
id:index, id:index,
dateStrS:x.startDate.substring(0,x.startDate.length-3) dateStrS:x.timeStr.substring(0,x.timeStr.length-3)
} }
dateList.push(msg); dateList.push(msg);
} // }
}); });
} }
...@@ -195,6 +544,7 @@ export default { ...@@ -195,6 +544,7 @@ export default {
},[] },[]
) )
this.calendarTit = dateList; this.calendarTit = dateList;
}, },
} }
...@@ -203,6 +553,92 @@ export default { ...@@ -203,6 +553,92 @@ export default {
<style> <style>
@import '../../assets/global/font.css'; @import '../../assets/global/font.css';
@import '../../assets/css/reset.css'; @import '../../assets/css/reset.css';
.el-popover{
padding:0;
}
.describe .content .list_cn .list_circle{
display: inline-block;
width:5px;
height:5px;
background:rgba(51,51,51,1);
border:2px solid rgba(255, 255, 255, 1);
border-radius:50%;
margin:0 15px;
}
li{
list-style: none;
}
.describe .content .list_cn{
background:rgba(245,245,245,1);
padding:12px;
box-sizing: border-box;
}
.describe .content{
padding: 2px 20px;
box-sizing: border-box;
}
.describe .imgsrc{
width:22px;
height:20px;
border-radius:50%;
}
.describe .info{
height:35px;
background:rgba(238,68,84,1);
line-height:35px;
color: #fff;
font-size: 14px;
text-align:center;
}
::-webkit-scrollbar {
display: none;
}
.describe{
width: 350px;
text-align: left;
max-height: 350px;
font-size: 12px;
overflow-y: scroll;
}
.month_circle:hover{
background:rgba(238,68,84,1);
}
.month_circle{
width:22px;
height:22px;
display: inline-block;
line-height: 22px;
color: #ffffff;
font-weight: 700;
text-align: center;
background:rgba(210,210,210,1);
border-radius:50%;
cursor: pointer;
}
.cilcle{
width: 30px;
height: 30px;
line-height: 30px;
text-align: center;
display: inline-block;
border-radius: 50%;
background: #FF6633;
color: #ffffff;
}
.otherdate{
width: 500px;
height: 417px;
position: absolute;
right: 0;
z-index: 5;
top:50px;
background: #ffffff;
box-shadow:0px 4px 8px 0px rgba(107,107,107,0.4);
box-sizing: border-box;
color: #333;
}
.active_data{ .active_data{
margin:0; margin:0;
border-top:6px solid #EE4454; border-top:6px solid #EE4454;
...@@ -217,10 +653,11 @@ export default { ...@@ -217,10 +653,11 @@ export default {
} }
.margin{ .margin{
margin-top:25px; margin-top:25px;
cursor: pointer;
} }
/* .date_list div:nth-last-child(3){ .date_list div:nth-last-child(3) div{
border: none; border: none;
} */ }
.li{ .li{
box-sizing: border-box; box-sizing: border-box;
...@@ -271,7 +708,7 @@ export default { ...@@ -271,7 +708,7 @@ export default {
color:rgba(102,102,102,1); color:rgba(102,102,102,1);
} }
.second .time{ .second .time{
font-size:24px; font-size:16px;
font-weight:400; font-weight:400;
color:rgba(51,51,51,1); color:rgba(51,51,51,1);
} }
......
src/components/global/head.vue
View file @ 4bcea807
...@@ -48,6 +48,7 @@ ...@@ -48,6 +48,7 @@
<!-- <el-menu-item index="2-3">单团</el-menu-item> <!-- <el-menu-item index="2-3">单团</el-menu-item>
<el-menu-item index="2-4">私人订制</el-menu-item> --> <el-menu-item index="2-4">私人订制</el-menu-item> -->
</el-submenu> </el-submenu>
<el-menu-item index="3"><a href="javascript:void(0);">机票</a></el-menu-item>
<!-- <el-menu-item index="5"><a href="javascript:void(0);">机票</a></el-menu-item> <!-- <el-menu-item index="5"><a href="javascript:void(0);">机票</a></el-menu-item>
<el-menu-item index="2"><a href="javascript:void(0);">酒店</a></el-menu-item> <el-menu-item index="2"><a href="javascript:void(0);">酒店</a></el-menu-item>
<el-menu-item index="4"><a href="javascript:void(0);">餐厅</a></el-menu-item> <el-menu-item index="4"><a href="javascript:void(0);">餐厅</a></el-menu-item>
......
src/components/mall/calendar.vue
View file @ 4bcea807
...@@ -147,6 +147,7 @@ export default { ...@@ -147,6 +147,7 @@ export default {
for (var i in this.priceData) { for (var i in this.priceData) {
var price = this.priceData[i]; var price = this.priceData[i];
var dayIndex = price.dateStr.substring(price.dateStr.length-2,price.dateStr.length); var dayIndex = price.dateStr.substring(price.dateStr.length-2,price.dateStr.length);
console.log(dayIndex)
var dayDict = daysData[Number(dayIndex)-1]; var dayDict = daysData[Number(dayIndex)-1];
dayDict.price = price.price; dayDict.price = price.price;
if(dayIndex<strDate&&strMonth==currentMonth){ if(dayIndex<strDate&&strMonth==currentMonth){
......
src/components/mall/detailTwo.vue
View file @ 4bcea807
...@@ -922,6 +922,7 @@ export default { ...@@ -922,6 +922,7 @@ export default {
let dateList = []; let dateList = [];
if(list && list.length>0){ if(list && list.length>0){
list.forEach((x,index)=>{ list.forEach((x,index)=>{
console.log(list)
if(x.tcState==3){ if(x.tcState==3){
let msg = { let msg = {
dateStr:x.startDate, dateStr:x.startDate,
......
src/components/mall/newcalendar.vue 0 → 100644
View file @ 4bcea807
<style>
.calendar-box .calendar{
width: 100%;
overflow: hidden;
table-layout: fixed;
}
.calendar-box .calendar th{
height: 20px;
padding: 10px 0;
line-height: 20px;
background: #eee;
color: #333;
text-align: center;
font-size: 14px;
font-family: 'PingFangR';
}
.dayList{
position: relative;
float: left;
width: 13.88%;
height: 65px;
cursor: pointer;
border: 1px solid transparent;
background-color: #F5F5F5;
font-size: 12px;
}
.dayList.noPrice{
cursor: default;
color: #ccc;
background-color: #FFFFFF;
}
.dayList.selectDay{
border: 1px solid #ff4646;
background-color: #f9f7f6;
}
.dayList.yesPrice{
font-weight: bold;
font-family: 'PingFangR'
}
.dayList p{
float: initial;
width: 100%;
text-align: center;
padding:0;
margin: 10px 0;
}
.dayList p.price{
float: initial;
width: 100%;
text-align: center;
padding:0;
margin: 10px 0;
color: #ff4646;
}
</style>
<template>
<div class="calendar-box" id='calendar'>
<table class="calendar" cellspacing=0 cellpadding=0>
<thead>
<th v-for="(i,index) in week" :key="index">{{i}}</th>
</thead>
</table>
<div class="monthDayList">
<div v-for="(item,index) in daysData" class="dayList" :key="index" @click="item.price?selectDate(index):''" :class="{selectDay:isSelect == index,noPrice:!item.price,yesPrice:item.price}">
<p>{{item.day}}</p>
<p v-if="item.price!='0.00' && item.price" class="price">￥{{item.price}}起</p>
</div>
</div>
</div>
</template>
<script>
import bus from '../../plugins/event-bus'
export default {
props:{
dateData: Array,
day:String,
},
data(){
return{
week:['日','一','二','三','四','五','六'],
priceData:this.dateData,
currentDay: this.day,
DaysInMonth:[],
daysData:[],
isSelect:-1,
mydate:-1,
}
},mounted(){
},created(){
this.getYearMonthDay();
},methods:{
selectDate(index){
if(this.$data.daysData[index].day == 0) {
bus.$emit('chosen-tripdate', null)
return;
}
if(this.isSelect == index){
this.isSelect = -1;
bus.$emit('chosen-tripdate', null)
return;
}
this.isSelect = index;
let currentDay = this.currentDay.split('-')
let clickDay = parseInt(this.$data.daysData[index].day)
clickDay = clickDay < 10 ? ('0' + clickDay) : clickDay
let clickDate = currentDay[0] + '-' + currentDay[1] + '-' + clickDay
this.$emit('ChildrenSelect', clickDate)
bus.$emit('chosen-tripdate', this.currentDay.substring(0,7) + '-' + clickDay)
},
getYearMonthDay(){
// console.log("day",this.day);
let currentYear = this.currentDay.substring(0,4); //当前年份
let currentMonth = this.currentDay.substring(5,7); //当前月份
// console.log("currentMonth",currentMonth)
let date = new Date();
let strDate = date.getDate();
let strMonth = (date.getMonth()+1).toString();
// alert(typeof strMonth)
//判断是否是闰年
if (this.isleapYears(currentYear)) {
this.$data.DaysInMonth = [31, 29, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
}else{
this.$data.DaysInMonth = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
}
let monthDay = this.$data.DaysInMonth[Number(currentMonth)-1];//当前月的天数
let daysData = [];
//给数据源赋值
for (var i = 0 ;i < Number(monthDay) ;i++) {
var priceDict = {'day':String(i+1),'price':0,'dis':false};
daysData.push(priceDict);
}
this.daysData = daysData;
var currentDay = `${currentYear}-${currentMonth}-01`;
var dateObject = new Date(currentDay);
var firstDay = dateObject.getDay();//得到每个月1号是周几
for (var i in this.priceData) {
var price = this.priceData[i];
var dayIndex = price.dateStr.substring(price.dateStr.length-2,price.dateStr.length);
// console.log(dayIndex)
var dayDict = daysData[Number(dayIndex)-1];
dayDict.price = price.price;
if(dayIndex<strDate&&strMonth==currentMonth){
dayDict.price='';
}
}
if (firstDay > 0) {
var firstDayData = [];
for (var i=0; i< firstDay;i++) {
var dict = {'day':' ',price:'','dis':true};
firstDayData.push(dict);
}
this.daysData = firstDayData.concat(daysData);
}else{
this.daysData = daysData;
}
},
isleapYears(year){
if (((year % 4)==0) && ((year % 100)!=0) || ((year % 400)==0)) {
return true;
} else{
return false;
}
},
}
}
</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