<style>
@import url('../../../assets/css/dmc/manager/tripsManager.css');
</style>
<template>
<div class="trips-box" ref='box'>
<div class="query-box Plan_Query">
<ul>
<li>
<span>
<em>系列</em>
<el-select v-model="searchMsg.LineteamId" placeholder="请选择系列" class="w120">
<el-option label="全部" value='0'></el-option>
<!-- <el-option v-for='item in LineList' :key="item.LineID" :label="item.LineName" :value="item.LineID">
</el-option> -->
</el-select>
</span>
</li>
<li>
<span>
<em>地接团号状态</em>
<el-select v-model="searchMsg.IsConfig" :placeholder="$t('system.ph_in')" class="w120">
<el-option label="全部" value='0'></el-option>
<el-option label="未配置" value='1'></el-option>
<el-option label="已配置" value='2'></el-option>
</el-select>
</span>
</li>
<li>
<span class="hotel_name">
<em>地接团号</em>
<el-input v-model="searchMsg.CombinationNum" class="w120"></el-input>
</span>
</li>
<li>
<span class="hotel_name">
<em>操作团号</em>
<el-input v-model="searchMsg.TCNUM" class="w120"></el-input>
</span>
</li>
<li>
<span>
<em>出团日期</em>
<el-date-picker clearable class="w135" v-model="searchMsg.StartGroupDate" type="date"
value-format="yyyy-MM-dd" :placeholder="$t('admin.admin_choDate')">
</el-date-picker><span class="_ln"> -</span>
<el-date-picker clearable class="w135" v-model="searchMsg.EndGroupDate" type="date"
value-format="yyyy-MM-dd" :placeholder="$t('admin.admin_choDate')">
</el-date-picker>
</span>
</li>
<li>
<button class="normalBtn" type="button" @click="handleCurrentChange(1)">{{$t('pub.searchBtn')}}</button>
</li>
</ul>
</div>
<table border="0" cellspacing="0" cellpadding="0" class="singeRowTable" v-loading='loading'>
<tr>
<th rowspan="2">地接团号</th>
<th rowspan="2">出团公司</th>
<th rowspan="2" width='260'>团队信息</th>
<th rowspan="2">航班信息</th>
<th colspan="2">出团信息</th>
<th colspan="4">定价信息</th>
<th colspan="3">机位信息</th>
<th rowspan="2" width='60'>操作</th>
</tr>
<tr>
<th>出发城市</th>
<th>返回城市</th>
<th>会员同行</th>
<th>普通同行</th>
<th>会员直客</th>
<th>普通直客</th>
<th>座位</th>
<th>余位</th>
<th>定金</th>
</tr>
<template v-for="(item,i) in tripData">
<tr :key="item.TCID">
<td width='100' rowspan="2" :class="{'Rs_Start20':item.CombinationNum==''}">{{item.CombinationNum==''?'未配置':item.CombinationNum}}</td>
<td :class="item.class">{{item.OutBranchName}}</td>
<td @click="loadTripDeatils(item.TCID,item.Title)">
<el-tooltip :content="item.Title" placement="top">
<div class="team-box">
<span class="xilie">{{item.LineName}}</span>
<span class="teamName">{{item.Title}}</span>
</div>
</el-tooltip>
</td>
<td class="airFligt">
<el-popover v-if='item.flightList && item.flightList.length>0' popper-class="_tripDetails" width="900" trigger="click">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr class="_color_666">
<th width="60">{{$t('Airticket.Air_segment')}}</th>
<th width="250">{{$t('Airticket.Air_Trip')}}</th>
<th width="80">{{$t('system.query_flightNum')}}</th>
<th width="150">起飞时间</th>
<th width="100">经停城市</th>
<th width="150">经停时间</th>
<th width="80">到达时间</th>
</tr>
<tr v-for="(ds,din) in item.flightList" :key="din">
<td class="_d_name _color_666">
<span v-if="din==0">
{{$t('Airticket.Air_go')}}
</span>
<span v-else-if="din==item.flightList.length-1">
{{$t('Airticket.Air_returnTrip')}}
</span>
<span v-else-if="din>0 && din!=item.flightList.length-1">
{{$t('Airticket.Air_transit')}}
</span>
</td>
<td>
<div>{{ds.DepartureName}}-{{ds.ArrivalCityName}}</div>
<div style="margin-top:5px;">{{ds.dName}}-{{ds.aName}}</div>
</td>
<td>{{ds.Flight_number}}</td>
<td>{{ds.FlightDate}} {{ds.Departure_time}}</td>
<td>{{ds.StopoverName}}</td>
<td>{{ds.Stopover_time!=' - '?ds.Stopover_time:''}}</td>
<td>{{ds.Arrival_time}}</td>
</tr>
</table>
<span v-for="(flight,findex) in item.flightList" :key="findex" slot="reference">
{{(findex!=0?'/':'')+flight.Flight_number}}
</span>
</el-popover>
<span style="color:gray;font-weight:300;" v-else>暂无航班信息</span>
</td>
<td>
{{item.StartCityName}}
</td>
<td>
{{item.ReturnArriveCityName}}
</td>
<td>
{{item.B2BMemberPrice}}
</td>
<td>
{{item.B2BPrice}}
</td>
<td>
{{item.B2CMemberPrice}}
</td>
<td>
{{item.B2CPrice}}
</td>
<td>
{{item.YSeat}}(Y) {{item.CSeat}}(C) {{item.FSeat}}(F)
</td>
<td :class="{'danger':(item.TotalSeat/2)<item.RemainNum,'info':(item.TotalSeat/2)>=item.RemainNum&& item.RemainNum>5,'safe':item.RemainNum<=5}">
{{item.RemainNum}}
</td>
<td class="ding">{{item.FinishedNumber}}</td>
<td>
<el-button size="mini" type="primary" icon="el-icon-edit" @click="goEditor(item.TCID,item.CombinationNum,item.TCNUM)"></el-button>
</td>
</tr>
<tr :key="i">
<td colspan="13" align='left' class="other-info">
<span class="item">
<i class="iconfont icon-lingduidongtai"></i>团号：
<span class="val">{{item.TCNUM}}</span>
</span>
<span class="item">
<i class="iconfont icon-renyuanguanli"></i>责任OP：
<span class="val">{{item.OPName}}</span>
</span>
<span class="item">
<i class="iconfont icon-qingjia"></i>发团日期：
<span class="val">{{item.StartDate}}</span>
</span>
<span class="item">
<i class="iconfont icon-img_kqyyjl"></i>OP备注：
<span class="val remark">{{item.OpRemark}}</span>
</span>
</td>
</tr>
</template>
<tr v-if="!tripData||tripData.length==0">
<td colspan="14">
<div class="noDataNotice">
<i class="iconfont icon-kong"></i>
<p>没有找到你需要的数据</p>
</div>
</td>
</tr>
</table>
<el-dialog custom-class='ComTeamPlan_info_box' :title="tripTitle" :visible.sync="outerVisible" center >
<team ref='tripBox'></team>
</el-dialog>
<el-pagination v-if='total>pageSize' background @current-change="handleCurrentChange" :current-page.sync="pageIndex" layout="total,prev, pager, next, jumper" :page-size='pageSize' :total='total'></el-pagination>
<div class="bottom-box" v-if='obj.Ids.length>0'>
<el-row>
<el-col :span="20">
<p class="_tit">地接团号设置</p>
</el-col>
<el-col :span="4" class="_add_saveBtn">
<button class="normalBtn" @click="save">保存</button>
<button class="cancelBtn" @click="goEditor('','','')">取消</button>
</el-col>
<el-form ref="form" :model="obj" label-width="100px">
<el-col :span="4" style="margin:20px 0;">
<div style="line-height:34px">团队编号：{{obj.num}}</div>
</el-col>
<el-col :span="4" style="margin:20px 0;">
<el-form-item label="地接团名：">
<el-input v-model="obj.CombinationNum"></el-input>
</el-form-item>
</el-col>
</el-form>
</el-row>
</div>
</div>
</template>
<script>
import team from '../../commonPage/commonTeamInfo'
export default {
components: {
team
},
data () {
return {
myLine:[],
tripData:[],
pageIndex:1,
pageSize:20,
loading:false,
tripTitle:'',
outerVisible:false,
total:0,
obj:{
Ids:[],
CombinationNum:'',
num:''
},
searchMsg:{
LineId:0,
LineteamId:'0',
CombinationNum:'',
IsConfig:'0',
TCNUM:'',
StartGroupDate:'2018-11-22',
EndGroupDate:''
}
}
},
mounted() {
this.init()
},
methods: {
init(){
this.calcPageSize()
this.loading=true
this.pageIndex=1
this.getMyLine()
},
calcPageSize(){
let height=this.$refs.box.offsetHeight-215;
this.pageSize=Math.floor(height/80)
},
getMyLine(){
this.apipost('line_post_GetList',{},r=>{
this.myLine=r.data.data
if(this.myLine.length==0){
this.loading=false
this.Error('抱歉，你的部门没有任何线路的地接操作权限')
} else
this.getTripData()
})
},
getTripData(){
this.loading=true
let msg={
pageIndex:this.pageIndex,
pageSize:this.pageSize,
LineId:0,
LineteamId:this.searchMsg.LineteamId,
CombinationNum:this.searchMsg.CombinationNum,
IsConfig:this.searchMsg.IsConfig,
TCNUM:this.searchMsg.TCNUM,
StartGroupDate:this.searchMsg.StartGroupDate,
EndGroupDate:this.searchMsg.EndGroupDate
}
this.apipost('travel_get_GetDmcPageList',msg,r=>{
this.loading=false
r.data.data.pageData.forEach(x=>{
x.class='Rs_Start'+(x.OutBranchId%12)
})
this.tripData=r.data.data.pageData
this.total=r.data.data.count
})
},
loadTripDeatils(id,title){
var that = this;
this.tripTitle = title;
this.$nextTick(() => {
that.$refs.tripBox.GetTrip(id)
});
that.outerVisible = true;
},
handleCurrentChange(val) {
this.pageIndex = val
this.getTripData()
},
goEditor(id,content,num){
if(id==''){
this.obj.Ids=[]
} else {
this.obj.Ids.push(id)
}
this.obj.CombinationNum=content
this.obj.num=num
},
save(){
if(this.obj.CombinationNum=='') {
this.Error('请输入团号')
}else{
this.apipost('travel_post_SetCombination',{msg:this.obj},r=>{
if(r.data.resultCode==1){
this.obj={
Ids:[],
CombinationNum:'',
num:''
}
this.getTripData()
}else{
this.Error(r.data.message)
}
})
}
}
}
}
</script>