<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>

