<style>

    .ContractMain{
        width:1200px;
        margin:auto;
        padding:20px;
        background-color: #fff;
    }
    .CM_left{
        float:left;
        width: 150px;
        height: 100%;
        position: fixed;
        margin-top:100px;
    }
    .CM_left ul li{
        display: block;
        width: 100%;
        text-align: center;
        height: 40px;
        line-height: 40px;
        padding: 0;
        margin-top: 5px;
        border-radius: 5px;
        font-size: 13px;
        cursor: pointer;
    }
    .CM_left ul li:hover {background-color:#ed4040;color:#fff;}
    .CMcked{
        background-color: #ed4040;
        color:#fff;
    }
    .CM_right{
        width:950px;
        height:auto;
        float:right;
        text-align: center;
        margin-left:10px;
    }
    .CM_rightHeader{
        width:100%;
        height:100%;
        font-weight: bold;
        margin-bottom:10px;
    }
    .contractName {
        font-size:20px;
        margin-bottom:5px;
    }
    .CM_ComTitle{
        width:100%;
        height:45px;
        background-color: #F2F2F2;
        font-weight: bold;
        font-size:16px;
        text-indent: 10px;
        text-align:left;
        display: flex;
        align-items: center;
    }
    .CM_comTable{
        width:100%;
    }
    .ContractMain .littleTitle{
        margin:40px 0 20px 10px;
        font-weight: bold;
        text-align: left;
        font-size:14px;
    }
    .CM_align{
        text-align: right;
    }
    .CM_comTable td{
        padding-left:80px;
        text-align: left;
    }
    .w640{
        width:640px!important;
    }
    .TC_tittle{
        padding-left:0!important;
    }
    .CM_ComLast{
        vertical-align:top;
        text-align:right;
        padding-right:20px;
    }
    .CM_comDiv{
        margin-bottom:30px;
    }
    .TC_div{
        display:none;
    }
    .checkedNav{
        display: block;
    }
</style>

<template>
    <div class="ContractMain clearfix">
        <div class="CM_left">
            <ul>
                <li :class="{'CMcked':cked==1}" @click="cked=1">基本信息</li>
                <li :class="{'CMcked':cked==2}" @click="cked=2">合同条款</li>
                <li :class="{'CMcked':cked==3}" @click="cked=3">投诉信息</li>
                <li :class="{'CMcked':cked==4}" @click="cked=4">行程信息</li>
                <li :class="{'CMcked':cked==5}" @click="cked=5">旅客信息</li>
            </ul>
        </div>
        <div class="CM_right">
            <div class="CM_rightHeader">
                <div class="contractName">四川和平国际旅行社有限公司</div>
                <div class="contractName">团队出境旅游合同</div>
                <div>合同编号：<span style="color:blue;font-size:14px;">{{CtObj.contractNum}}</span></div>
            </div>
            <el-form label-width="180px" :model="CtObj" :rules="rules" ref="CtObj">
                <div class="TC_div" :class="{'checkedNav':cked==1}">
                    <div class="CM_ComTitle">基本信息</div>  
                    <div class="littleTitle">客户信息</div> 
                    <table class="CM_comTable" cellspacing="0" cellpadding="0">
                        <tbody>
                            <tr>
                                <td>
                                    <el-form-item label="客户名称" prop="clientName">
                                        <el-input type="text" v-model="CtObj.clientName" maxlength="100" class="w210"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="身份证号">
                                        <el-input type="text" v-model="CtObj.clientIdcardnum" maxlength="100" class="w210"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="联系电话" prop="clientCall">
                                        <el-input type="text" v-model="CtObj.clientCall" maxlength="100" class="w210"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="传真">
                                        <el-input type="text" v-model="CtObj.clientFax" maxlength="100" class="w210"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="电子邮箱">
                                        <el-input type="text" v-model="CtObj.clientEmail" maxlength="100" class="w210"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="邮编">
                                        <el-input type="text" v-model="CtObj.clientPostCode" maxlength="100" class="w210"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="所在地区">
                                        <el-select placeholder="请选择国家" filterable class='multiple_input w210' v-model="CtObj.clientCountryid" @change="GetSubAreaList(CtObj.clientCountryid,1),CtObj.clientProvinceid=0,CtObj.clientCityid=0">
                                            <el-option :label="$t('pub.unlimitedSel')" :value='0'></el-option>
                                            <el-option v-for="childItem in CountryList" :key="childItem.ID" :label="childItem.Name"
                                            :value="childItem.ID">
                                            </el-option>
                                        </el-select>
                                        <el-select placeholder="请选择省" filterable class='multiple_input w210' v-model="CtObj.clientProvinceid"
                                            @change="GetSubAreaList(CtObj.clientProvinceid,2),CtObj.clientCityid=0">
                                            <el-option :label="$t('pub.unlimitedSel')" :value='0'></el-option>
                                            <el-option v-for="childItem in ClientProvinceList" :key="childItem.ID" :label="childItem.Name"
                                            :value="childItem.ID">
                                            </el-option>
                                        </el-select>
                                        <el-select placeholder="请选择市" filterable class='multiple_input w210' v-model="CtObj.clientCityid">
                                            <el-option :label="$t('pub.unlimitedSel')" :value='0'></el-option>
                                            <el-option v-for="childItem in ClientCityList" :key="childItem.ID" :label="childItem.Name"
                                            :value="childItem.ID">
                                            </el-option>
                                        </el-select>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="详细地址">
                                        <el-input type="text" v-model="CtObj.clientAddress" class="w640"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td class="TC_tittle">
                                    <div class="littleTitle">公司信息</div>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="公司名称">
                                        <el-input type="text" v-model="CtObj.company" :disabled="true" class="w210"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="经营许可证号">
                                        <el-input type="text" class="w210" :disabled="true" v-model="CtObj.businessCertificate"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="联系电话">
                                        <el-input type="text" class="w210" v-model="CtObj.companyCall"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="传真">
                                        <el-input type="text" class="w210" v-model="CtObj.companyFax"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="电子邮箱">
                                        <el-input type="text" class="w210" v-model="CtObj.companyEmail"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="邮编">
                                        <el-input type="text" class="w210" v-model="CtObj.companyPostCode"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="所在地区">
                                        <el-select placeholder="请选择国家" filterable class='multiple_input w210' v-model="CtObj.companyCountryid" @change="GetComAreaList(CtObj.companyCountryid,1),CtObj.companyProvinceid=0,CtObj.companyCityid=0">
                                            <el-option :label="$t('pub.unlimitedSel')" :value='0'></el-option>
                                            <el-option v-for="childItem in CountryList" :key="childItem.ID" :label="childItem.Name"
                                            :value="childItem.ID">
                                            </el-option>
                                        </el-select>
                                        <el-select placeholder="请选择省" filterable class='multiple_input w210' v-model="CtObj.companyProvinceid"
                                            @change="GetComAreaList(CtObj.companyProvinceid,2),CtObj.companyCityid=0">
                                            <el-option :label="$t('pub.unlimitedSel')" :value='0'></el-option>
                                            <el-option v-for="childItem in companyProvinceList" :key="childItem.ID" :label="childItem.Name"
                                            :value="childItem.ID">
                                            </el-option>
                                        </el-select>
                                        <el-select placeholder="请选择市" filterable class='multiple_input w210' v-model="CtObj.companyCityid">
                                            <el-option :label="$t('pub.unlimitedSel')" :value='0'></el-option>
                                            <el-option v-for="childItem in companyCityList" :key="childItem.ID" :label="childItem.Name"
                                            :value="childItem.ID">
                                            </el-option>
                                        </el-select>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="详细地址">
                                        <el-input type="text" class="w640" v-model="CtObj.companyAddress"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td class="TC_tittle">
                                    <div class="littleTitle">经办人信息</div>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="经办人" prop="agentName">
                                        <el-input type="text" class="w210" v-model="CtObj.agentName"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="联系电话" prop="agentCall">
                                        <el-input type="text" class="w210" v-model="CtObj.agentCall"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="签约地点/网点名称" prop="contractPlace">
                                        <el-input type="text" class="w640" v-model="CtObj.contractPlace"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <div class="TC_div" :class="{'checkedNav':cked==2}">
                    <div class="CM_ComTitle">合同条款</div>  
                    <div class="littleTitle">合同效力</div> 
                    <table class="CM_comTable" cellspacing="0" cellpadding="0">
                        <tbody>
                            <tr>
                                <td>
                                    <el-form-item label="本合同一式" prop="totalNumber">
                                        <el-select placeholder="请选择" filterable v-model="CtObj.totalNumber" class='w210'>
                                            <el-option :label="$t('pub.unlimitedSel')" :value="0"></el-option>
                                            <el-option label="壹" :value='1'></el-option>
                                            <el-option label="贰" :value='2'></el-option>
                                            <el-option label="叁" :value='3'></el-option>
                                            <el-option label="肆" :value='4'></el-option>
                                            <el-option label="伍" :value='5'></el-option>
                                            <el-option label="陆" :value='6'></el-option>
                                            <el-option label="柒" :value='7'></el-option>
                                            <el-option label="捌" :value='8'></el-option>
                                            <el-option label="玖" :value='9'></el-option>
                                            <el-option label="拾" :value='10'></el-option>
                                        </el-select>
                                        份
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="双方各持" prop="eachNumber">
                                        <el-select placeholder="请选择" filterable v-model="CtObj.eachNumber" class='w210'>
                                            <el-option :label="$t('pub.unlimitedSel')" :value="0"></el-option>
                                            <el-option label="壹" :value='1'></el-option>
                                            <el-option label="贰" :value='2'></el-option>
                                            <el-option label="叁" :value='3'></el-option>
                                            <el-option label="肆" :value='4'></el-option>
                                            <el-option label="伍" :value='5'></el-option>
                                            <el-option label="陆" :value='6'></el-option>
                                            <el-option label="柒" :value='7'></el-option>
                                            <el-option label="捌" :value='8'></el-option>
                                            <el-option label="玖" :value='9'></el-option>
                                            <el-option label="拾" :value='10'></el-option>
                                        </el-select>
                                        份
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td class="TC_tittle">
                                    <div class="littleTitle">线路行程时间</div>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="产品名称" prop="productName">
                                        <el-input type="text" class="w210" v-model="CtObj.productName"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="出发日期" prop="startDate">
                                        <el-date-picker class="w210" v-model="CtObj.startDate" type="date" value-format="yyyy-MM-dd" placeholder></el-date-picker>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="返回日期" prop="returnDate">
                                        <el-date-picker class="w210" v-model="CtObj.returnDate" type="date" value-format="yyyy-MM-dd" placeholder></el-date-picker>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="共" prop="dayNum">
                                        <el-select placeholder="请选择" filterable class='w210' v-model="CtObj.dayNum">
                                            <el-option :label="$t('pub.unlimitedSel')" value=""></el-option>
                                            <el-option label="1" :value='1'></el-option>
                                            <el-option label="2" :value='2'></el-option>
                                            <el-option label="3" :value='3'></el-option>
                                            <el-option label="4" :value='4'></el-option>
                                            <el-option label="5" :value='5'></el-option>
                                            <el-option label="6" :value='6'></el-option>
                                            <el-option label="7" :value='7'></el-option>
                                            <el-option label="8" :value='8'></el-option>
                                            <el-option label="9" :value='9'></el-option>
                                            <el-option label="10" :value='10'></el-option>
                                            <el-option label="11" :value='11'></el-option>
                                            <el-option label="12" :value='12'></el-option>
                                            <el-option label="13" :value='13'></el-option>
                                            <el-option label="14" :value='14'></el-option>
                                            <el-option label="15" :value='15'></el-option>
                                            <el-option label="16" :value='16'></el-option>
                                            <el-option label="17" :value='17'></el-option>
                                            <el-option label="18" :value='18'></el-option>
                                            <el-option label="19" :value='19'></el-option>
                                            <el-option label="20" :value='20'></el-option>
                                        </el-select>
                                        天
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="酒店住宿" prop="nightNum">
                                        <el-select placeholder="请选择" filterable class='w210' v-model="CtObj.nightNum">
                                            <el-option :label="$t('pub.unlimitedSel')" value=""></el-option>
                                            <el-option label="1" :value='1'></el-option>
                                            <el-option label="2" :value='2'></el-option>
                                            <el-option label="3" :value='3'></el-option>
                                            <el-option label="4" :value='4'></el-option>
                                            <el-option label="5" :value='5'></el-option>
                                            <el-option label="6" :value='6'></el-option>
                                            <el-option label="7" :value='7'></el-option>
                                            <el-option label="8" :value='8'></el-option>
                                            <el-option label="9" :value='9'></el-option>
                                            <el-option label="10" :value='10'></el-option>
                                            <el-option label="11" :value='11'></el-option>
                                            <el-option label="12" :value='12'></el-option>
                                            <el-option label="13" :value='13'></el-option>
                                            <el-option label="14" :value='14'></el-option>
                                            <el-option label="15" :value='15'></el-option>
                                            <el-option label="16" :value='16'></el-option>
                                            <el-option label="17" :value='17'></el-option>
                                            <el-option label="18" :value='18'></el-option>
                                            <el-option label="19" :value='19'></el-option>
                                            <el-option label="20" :value='20'></el-option>
                                        </el-select>
                                        晚
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td class="TC_tittle">
                                    <div class="littleTitle">旅游费用及支付</div>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="成人价" prop="adultPrice">
                                        <el-input type="text" class="w210" v-model="CtObj.adultPrice"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="小孩价" prop="childPrice">
                                        <el-input type="text" class="w210" v-model="CtObj.childPrice"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="导游服务费	">
                                        <el-input type="text" class="w210" v-model="CtObj.servicePrice"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="费用合计" prop="orderPrice">
                                        <el-input type="text" class="w210" v-model="CtObj.orderPrice"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="支付日期" prop="payDate">
                                        <el-date-picker class="w210" v-model="CtObj.payDate" type="date" value-format="yyyy-MM-dd" placeholder></el-date-picker>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="支付方式" prop="payType">
                                        <el-select placeholder="请选择" filterable class='w210' v-model="CtObj.payType">
                                            <el-option :label="$t('pub.unlimitedSel')" :value="0"></el-option>
                                            <el-option label="现金" :value='1'></el-option>
                                            <el-option label="转账" :value='2'></el-option>
                                        </el-select>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td class="TC_tittle">
                                    <div class="littleTitle">人身意外伤害保险</div>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="客户" prop="insuranceOpinion">
                                        <el-select placeholder="请选择" filterable class='w210' v-model="CtObj.insuranceOpinion">
                                            <el-option :label="$t('pub.unlimitedSel')" :value="0"></el-option>
                                            <el-option label="同意" :value='1'></el-option>
                                            <el-option label="不同意" :value='2'></el-option>
                                        </el-select>
                                        委托出境社办理人身意外伤害保险
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="保险公司">
                                        <el-input type="text" class="w210" v-model="CtObj.insuranceCompany"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="保险产品">
                                        <el-input type="text" class="w210" v-model="CtObj.insuranceProduct"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="保额">
                                        <el-input type="text" class="w210" v-model="CtObj.insuranceAmount"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td class="TC_tittle">
                                    <div class="littleTitle">成团人数与不成团的约定</div>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="最低成团人数" prop="minNumber">
                                        <el-input type="text" class="w210" v-model="CtObj.minNumber"></el-input> 人
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="如果不能成团，客户" prop="insteadOpinion">
                                        <el-select placeholder="请选择" filterable class='w210' v-model="CtObj.insteadOpinion">
                                            <el-option :label="$t('pub.unlimitedSel')" :value="0"></el-option>
                                            <el-option label="同意" :value='1'></el-option>
                                            <el-option label="不同意" :value='2'></el-option>
                                        </el-select>
                                        旅行社委托其他旅行社履行合同
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="被委托旅行社名称">
                                        <el-input type="text" class="w210" v-model="CtObj.insteadCompany"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="如果不能成团，客户" prop="delayOpinion">
                                        <el-select placeholder="请选择" filterable class='w210' v-model="CtObj.delayOpinion">
                                            <el-option :label="$t('pub.unlimitedSel')" :value="0"></el-option>
                                            <el-option label="同意" :value='1'></el-option>
                                            <el-option label="不同意" :value='2'></el-option>
                                        </el-select>
                                        延期出团
                                    </el-form-item>
                                    
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="如果不能成团，客户" prop="changeOpinion">
                                        <el-select placeholder="请选择" filterable class='w210' v-model="CtObj.changeOpinion">
                                            <el-option :label="$t('pub.unlimitedSel')" :value="0"></el-option>
                                            <el-option label="同意" :value='1'></el-option>
                                            <el-option label="不同意" :value='2'></el-option>
                                        </el-select>
                                        改签其他线路或产品出团
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="如果不能成团，客户" prop="terminateOpinion">
                                        <el-select placeholder="请选择" filterable class='w210' v-model="CtObj.terminateOpinion">
                                            <el-option :label="$t('pub.unlimitedSel')" :value="0"></el-option>
                                            <el-option label="同意" :value='1'></el-option>
                                            <el-option label="不同意" :value='2'></el-option>
                                        </el-select>
                                        解除合同
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td class="TC_tittle">
                                    <div class="littleTitle">拼团约定</div>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="客户" prop="carpoolOpinion">
                                        <el-select placeholder="请选择" filterable class='w210' v-model="CtObj.carpoolOpinion">
                                            <el-option :label="$t('pub.unlimitedSel')" :value="0"></el-option>
                                            <el-option label="同意" :value='1'></el-option>
                                            <el-option label="不同意" :value='2'></el-option>
                                        </el-select>
                                        采用拼团方式成团
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="参与拼团旅行社">
                                        <el-input type="text" class="w210" v-model="CtObj.carpoolCompany"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td class="TC_tittle">
                                    <div class="littleTitle">争议的解决方式</div>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="协商或调解不成，按照第" prop="settleDisputeMode">
                                        <el-select placeholder="请选择" filterable class='w210' v-model="CtObj.settleDisputeMode">
                                            <el-option :label="$t('pub.unlimitedSel')" :value="0"></el-option>
                                            <el-option label="1" :value='1'></el-option>
                                            <el-option label="2" :value='2'></el-option>
                                        </el-select>
                                        种方式解决
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="（1）提交">
                                        <el-input type="text" class="w210" v-model="CtObj.arbitrationCommission"></el-input> 仲裁委员会仲裁
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="（2）依法向">
                                        <el-input type="text" class="w210" v-model="CtObj.court"></el-input> 人民法院起诉
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td class="TC_tittle">
                                    <div class="littleTitle">其他约定事项</div>
                                </td>
                            </tr>
                            <tr>
                                <td class="TC_tittle">
                                    <el-input type="textarea" resize="none" v-model="CtObj.otherMatter" rows="6"></el-input>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <div class="TC_div" :class="{'checkedNav':cked==3}">
                    <div class="CM_ComTitle">投诉信息</div>  
                    <table class="CM_comTable" cellspacing="0" cellpadding="0" style="margin-top:40px;">
                        <tbody>
                            <tr>
                                <td>
                                    <el-form-item label="公司投诉电话">
                                        <el-input type="text" class="w210" v-model="CtObj.companyComplainCall"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="监管机构名称">
                                        <el-input type="text" class="w210" v-model="CtObj.regulatorName"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="监管机构投诉电话">
                                        <el-input type="text" class="w210" v-model="CtObj.regulatorComplainCall"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="监管机构网址">
                                        <el-input type="text" class="w210" v-model="CtObj.regulatorWebsite"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="监管机构邮编">
                                        <el-input type="text" class="w210" v-model="CtObj.regulatorPostCode"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="监管机构所属地区">
                                        <el-select placeholder="请选择国家" filterable class='multiple_input w210' v-model="CtObj.regulatorCountryid" @change="GetJianAreaList(CtObj.regulatorCountryid,1),CtObj.regulatorProvinceid=0,CtObj.regulatorCityid=0">
                                            <el-option :label="$t('pub.unlimitedSel')" :value='0'></el-option>
                                            <el-option v-for="childItem in CountryList" :key="childItem.ID" :label="childItem.Name"
                                            :value="childItem.ID">
                                            </el-option>
                                        </el-select>
                                        <el-select placeholder="请选择省" filterable class='multiple_input w210' v-model="CtObj.regulatorProvinceid"
                                            @change="GetJianAreaList(CtObj.regulatorProvinceid,2),CtObj.regulatorCityid=0">
                                            <el-option :label="$t('pub.unlimitedSel')" :value='0'></el-option>
                                            <el-option v-for="childItem in JianProvinceList" :key="childItem.ID" :label="childItem.Name"
                                            :value="childItem.ID">
                                            </el-option>
                                        </el-select>
                                        <el-select placeholder="请选择市" filterable class='multiple_input w210' v-model="CtObj.regulatorCityid">
                                            <el-option :label="$t('pub.unlimitedSel')" :value='0'></el-option>
                                            <el-option v-for="childItem in JianCityList" :key="childItem.ID" :label="childItem.Name"
                                            :value="childItem.ID">
                                            </el-option>
                                        </el-select>
                                    </el-form-item>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <el-form-item label="监管机构详细地址">
                                        <el-input type="text" class="w640" v-model="CtObj.regulatorAddress"></el-input>
                                    </el-form-item>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <div class="TC_div" :class="{'checkedNav':cked==4}">
                    <div class="CM_ComTitle" style="margin-bottom:40px;">行程信息</div>  
                    <el-input type="textarea" rows="16" resize="none" v-model="CtObj.travelContent"></el-input>   
                </div>
                <div class="TC_div" :class="{'checkedNav':cked==5}">
                    <div class="CM_ComTitle">旅客信息</div>  
                    <div class="littleTitle" style="margin:40px 0 30px 0;">旅客名单（{{guestList.length}}人）</div>
                    <table class="singeRowTable" border="0" cellspacing="0" cellpadding="0">
                        <tr>
                            <th>姓名</th>
                            <th>国籍</th>
                            <th>民族</th>
                            <th>性别</th>
                            <th>出生日期</th>
                            <th>身份证号</th>
                            <th>护照号</th>
                            <th>手机号</th>
                        </tr>
                        <tr v-for="item in guestList">
                            <td>{{item.surName+''+item.name}}</td>  
                            <td>{{item.nationalityName}}</td>  
                            <td></td>  
                            <td>{{item.sex==1?'男':'女'}}</td>  
                            <td>{{getDate(item.birthday)}}</td>  
                            <td>{{item.idCard}}</td>  
                            <td>{{item.passportNo}}</td>  
                            <td>{{item.mobilePhone}}</td>  
                        </tr>
                    </table>
                    <table cellspacing="0" cellpadding="0" style="font-size:12px;width:100%;">
                        <tbody>
                            <tr>
                                <td class="TC_tittle" colspan="2">
                                    <div class="littleTitle" style="margin-bottom:40px;">住宿情况</div>
                                </td>
                            </tr>
                            <tr>
                                <div class="CM_comDiv">
                                    <td width="150" class="CM_ComLast">
                                        同住人
                                    </td>
                                    <td style="text-align:left;">
                                        <el-input type="textarea" rows="7" resize="none" class="w700" v-model="CtObj.togetherRemark"></el-input>
                                    </td>
                                </div>
                                <div class="CM_comDiv">
                                    <td width="150" class="CM_ComLast">
                                        单男/单女
                                    </td>
                                    <td style="text-align:left;">
                                        <el-input type="textarea" rows="7" resize="none" class="w700" v-model="CtObj.singleRemark"></el-input>
                                    </td>
                                </div>
                                <div class="CM_comDiv">
                                    <td width="150" class="CM_ComLast">
                                        不占床人员	
                                    </td>
                                    <td style="text-align:left;">
                                        <el-input type="textarea" rows="7" resize="none" class="w700" v-model="CtObj.nobedRemark"></el-input>
                                    </td>
                                </div>
                                <div>
                                    <td width="150" class="CM_ComLast">
                                        单独住人员	
                                    </td>
                                    <td style="text-align:left;">
                                        <el-input type="textarea" rows="7" resize="none" class="w700" v-model="CtObj.aloneRemark"></el-input>
                                    </td>
                                </div>
                            </tr>
                            <tr>
                                <td class="TC_tittle">
                                    <div class="littleTitle" style="margin-bottom:40px;">健康情况</div>
                                </td>
                            </tr>
                            <tr>
                                <div style="margin-left:-30px;">
                                    <td style="text-align:left;" colspan="2">
                                        <el-form-item label="参团旅客健康情况说明"  prop="healthRemark">
                                            <el-input type="textarea" rows="7" resize="none" class="w700" v-model="CtObj.healthRemark"></el-input>
                                        </el-form-item>
                                    </td>
                                </div>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </el-form>
            <div style="margin-top:20px;">
                <input type="button" v-if="CtObj.status==1&&CtObj.auditContract==0" class="normalBtn" style="margin:0 0 30px 60px;" @click="sendAudit()" value="提交审核"/>
                <input type="button" v-if="CtObj.status==1&&CtObj.auditContract==3" class="normalBtn" style="margin:0 0 30px 60px;" @click="sendAudit()" value="审核已被驳回,重新提交"/>
                <input type="button" v-if="CtObj.auditContract==0||CtObj.auditContract==3" class="normalBtn" @click="submitForm('CtObj')" value="保存"/>
                <input type="button" class="normalBtn" v-if="CtObj.status==1" @click="goUrl()"  value="预览">
                <input type="button" class="normalBtn" v-if="CtObj.status==1" @click="getinvalid()" value="作废">
            </div> 
        </div>
    </div>
</template>
<script>
  import moment from 'moment'
  export default {
    data() {
      let valiTotalNumber = (rule, value, callback) => {
        if (this.CtObj.totalNumber == 0||this.CtObj.totalNumber =='') {
          return callback(new Error('请选择'));
        } else {
          callback();
        }
      }
      let validateEach = (rule, value, callback) => {
        if (this.CtObj.eachNumber == 0||this.CtObj.eachNumber =='') {
          return callback(new Error('请选择'));
        } else {
          callback();
        }
      }
      let validatepayType = (rule, value, callback) => {
        if (this.CtObj.payType == 0||this.CtObj.payType =='') {
          return callback(new Error('请选择'));
        } else {
          callback();
        }
      }
      let validateOption = (rule, value, callback) => {
        if (this.CtObj.insuranceOpinion == 0||this.CtObj.insuranceOpinion =='') {
          return callback(new Error('请选择'));
        } else {
          callback();
        }
      }
      let validateinsteadO = (rule, value, callback) => {
        if (this.CtObj.insteadOpinion == 0||this.CtObj.insteadOpinion =='') {
          return callback(new Error('请选择'));
        } else {
          callback();
        }
      }
      let validatedelayOpinion = (rule, value, callback) => {
        if (this.CtObj.delayOpinion == 0||this.CtObj.delayOpinion =='') {
          return callback(new Error('请选择'));
        } else {
          callback();
        }
      }
      let validatechangeOpinion = (rule, value, callback) => {
        if (this.CtObj.changeOpinion == 0 ||this.CtObj.changeOpinion=='') {
          return callback(new Error('请选择'));
        } else {
          callback();
        }
      }
      let validateterminateOpinion = (rule, value, callback) => {
        if (this.CtObj.terminateOpinion == 0 ||this.CtObj.terminateOpinion=='') {
          return callback(new Error('请选择'));
        } else {
          callback();
        }
      }
      let validatecarpoolOpinion = (rule, value, callback) => {
        if (this.CtObj.carpoolOpinion == 0 ||this.CtObj.carpoolOpinion=='') {
          return callback(new Error('请选择'));
        } else {
          callback();
        }
      }
      let validatesettleDisputeMode = (rule, value, callback) => {
        if (this.CtObj.settleDisputeMode == 0 ||this.CtObj.settleDisputeMode=='') {
          return callback(new Error('请选择'));
        } else {
          callback();
        }
      }
      return {
        //国家列表
        CountryList: [],
        //客户省份列表
        ClientProvinceList: [],
        //客户城市列表
        ClientCityList: [],
        //公司省份列表
        companyProvinceList:[],
        //公司城市列表
        companyCityList:[],
        //监管机构省
        JianProvinceList:[],
        //监管机构市
        JianCityList:[],
        //选中切换
        cked:1,
        //查询参数
        msg:{
          TCID:0,
          orderID:0
        },
        addMsg: {
          Country: 0,
          Province: 0,
          City: 0
        },
        //参数
        CtObj:{
            //基本信息
            clientName:'',
            clientIdcardnum:'',
            clientCall:'',
            clientFax:'',
            clientEmail:'',
            clientPostCode:'',
            clientCountryid:0,
            clientProvinceid:0,
            clientCityid:0,
            clientAddress:'',
            company:'四川和平国际旅行社有限公司',
            businessCertificate:'0000000',
            companyCall:'',
            companyFax:'',
            companyEmail:'',
            companyPostCode:'',
            companyCountryid:0,
            companyProvinceid:0,
            companyCityid:0,
            companyAddress:'',
            agentName:'',
            agentCall:'',
            contractPlace:'',
            //合同条款
            totalNumber:2,
            eachNumber:1, 
            productName:'',
            startDate:'',
            returnDate:'',
            dayNum:'',
            nightNum:'',
            adultPrice:'',
            childPrice:'',
            servicePrice:'',
            orderPrice:'',
            payDate:'',
            payType:'',
            //客户同意
            insuranceOpinion:'',
            insuranceCompany:'',
            insuranceProduct:'',
            insuranceAmount:'',
            minNumber:0,
            insteadOpinion:'',
            insteadCompany:'',
            delayOpinion:'',
            changeOpinion:'',
            terminateOpinion:'',
            carpoolOpinion:'',
            carpoolCompany:'',
            settleDisputeMode:'',
            arbitrationCommission:'',
            court:'',
            otherMatter:'',
            //投诉信息
            companyComplainCall:'',
            regulatorName:'',
            regulatorComplainCall:'',
            regulatorWebsite:'',
            regulatorPostCode:'',
            regulatorCountryid:0,
            regulatorProvinceid:0,
            regulatorCityid:0,
            regulatorAddress:'',
            //行程信息
            travelContent:'',
            //旅客信息
            togetherRemark:'',
            singleRemark:'',
            nobedRemark:'',
            aloneRemark:'',
            healthRemark:'',
            tcid:0,
            orderId:0,
        },
        //旅客名单
        guestList:[],
        tripList: [],
        rules: {
            clientName: [{ required: true, message: "请输入客户名称", trigger: "blur" }],
            clientCall: [{ required: true, message: "请输入联系电话", trigger: "blur" }],
            agentName: [{ required: true, message: "请输入经办人", trigger: "blur" }],
            agentCall: [{ required: true, message: "请输入联系电话", trigger: "blur" }],
            contractPlace: [{ required: true, message: "请输入签约地点/网点名称", trigger: "blur" }],
            
            totalNumber: [{ validator: valiTotalNumber,trigger: 'change',required: true,}],
            eachNumber:[{ validator: validateEach, trigger: "change",required: true, }],

            productName:[{ required: true, message: "请填写产品名称", trigger: "blur" }],
            startDate:[{ required: true, message: "请选择出发日期", trigger: "change" }],
            returnDate:[{ required: true, message: "请选择返回日期", trigger: "blur" }],
            dayNum:[{ required: true, message: "请选择天数", trigger: "change" }],
            nightNum:[{ required: true, message: "请选择晚数", trigger: "change" }],
            adultPrice:[{ required: true, message: "请填写成人价", trigger: "blur" }],
            childPrice:[{ required: true, message: "请填写小孩价", trigger: "blur" }],
            orderPrice:[{ required: true, message: "请填写费用合计", trigger: "blur" }],
            payDate:[{ required: true, message: "请选择支付日期", trigger: "change" }],
            payType:[{ validator: validatepayType , trigger: "change",required: true, }],
            insuranceOpinion:[{ validator: validateOption , trigger: "change" ,required: true,}],

            minNumber:[{ required: true, message: "请填写最低成团人数", trigger: "change" }],
            insteadOpinion:[{ required: true, validator: validateinsteadO , trigger: "change" }],
            delayOpinion:[{ required: true, validator: validatedelayOpinion , trigger: "change" }],
            changeOpinion:[{ required: true, validator: validatechangeOpinion, trigger: "change" }],
            terminateOpinion:[{ required: true, validator: validateterminateOpinion, trigger: "change" }],
            carpoolOpinion:[{ required: true, validator: validatecarpoolOpinion, trigger: "change" }],
            settleDisputeMode:[{ required: true, validator: validatesettleDisputeMode, trigger: "change" }],
            healthRemark:[{ required: true, message: "请填写参团旅客健康情况说明", trigger: "blur" }]
        }
      };
    },
    methods: {
      //获取数据
      getList(){
        this.apiJavaPost("/api/contract/getContractInfo",this.msg,res => {
            if (res.data.resultCode === 1) {
                  this.CtObj = res.data.data;
                  this.guestList = res.data.data.guestList;
                  this.CtObj.company = '四川和平国际旅行社有限公司';
                  this.CtObj.businessCertificate = '0000000';
                  this.CtObj.tcid = this.$route.query.TCID;
                  this.CtObj.orderId = this.$route.query.orderID;
                  this.CtObj.totalNumber=2;
                  this.CtObj.eachNumber=1;

                  if(this.CtObj.clientCountryid>0){
                      this.GetSubAreaList(this.CtObj.clientCountryid,1,1);
                  }
                  if(this.CtObj.clientProvinceid>0){
                      this.GetSubAreaList(this.CtObj.clientProvinceid,2,1);
                  }
                 if(this.CtObj.companyCountryid>0){
                      this.GetComAreaList(this.CtObj.companyCountryid,1,1);
                  }
                  if(this.CtObj.companyProvinceid>0){
                      this.GetComAreaList(this.CtObj.companyProvinceid,2,1);
                  }
                 if(this.CtObj.regulatorCountryid>0){
                      this.GetJianAreaList(this.CtObj.regulatorCountryid,1,1);
                  }
                  if(this.CtObj.regulatorProvinceid>0){
                      this.GetJianAreaList(this.CtObj.regulatorProvinceid,2,1);
                  }
            } else {
                this.Error(res.data.message);
            }
        },null);
      },
      //获取国家
      GetCounrty() {
        this.apipost(
          "dict_post_Destination_GetCountry", {},
          res => {
            this.CountryList = res.data.data;
          },
          err => {}
        );
      },
      //获取客户省份和城市
      GetSubAreaList(ID, type, isClear) {
        let msg = {
          Id: ID
        };
        if (type == 1) {
          if (isClear != 1) {
            this.CtObj.clientProvinceid = 0;
            this.CtObj.clientCityid = 0;
          }
        } else if (type == 2) {
          if (isClear != 1) {
            this.CtObj.clientCityid = 0;
          }
        }
        if (this.CtObj.clientCountryid != 0) {
          this.apipost(
            "dict_post_Destination_GetChildList",
            msg,
            res => {
              if (type == 1) {
                this.ClientProvinceList = res.data.data;
              } else if (type == 2) {
                this.ClientCityList = res.data.data;
              }
            },
            err => {}
          );
        }
      },
      //获取公司身份城市
      GetComAreaList(ID, type,isClear) {
        let msg = {
          Id: ID
        };
        if (type == 1) {
            if (isClear != 1) {
                this.CtObj.companyProvinceId = 0;
                this.CtObj.companyCityId = 0;
            }
        } else if (type == 2) {
            if (isClear != 1) {
                this.CtObj.companyCityId = 0;
            }
        }
        if (this.CtObj.companyCountryId != 0) {
          this.apipost(
            "dict_post_Destination_GetChildList",
            msg,
            res => {
              if (type == 1) {
                this.companyProvinceList = res.data.data;
              } else if (type == 2) {
                this.companyCityList = res.data.data;
              }
            },
            err => {}
          );
        }
      },
      //获取监管机构省市
      GetJianAreaList(ID, type, isClear){
        let msg = {
          Id: ID
        };
        if (type == 1) {
          if (isClear != 1) {
            this.CtObj.regulatorProvinceid = 0;
            this.CtObj.regulatorCityid = 0;
          }
        } else if (type == 2) {
          if (isClear != 1) {
            this.CtObj.regulatorCityid = 0;
          }
        }
        if (this.CtObj.regulatorCountryid != 0) {
          this.apipost(
            "dict_post_Destination_GetChildList",
            msg,
            res => {
              if (type == 1) {
                this.JianProvinceList = res.data.data;
              } else if (type == 2) {
                this.JianCityList = res.data.data;
              }
            },
            err => {}
          );
        }
      },
      getDate(date){
        return moment(date).format("YYYY-MM-DD");
      },
        //提交数据
      SaveMsg(){
        this.CtObj.status = 1;
        this.CtObj.contractStatus=2;
        this.apiJavaPost("/api/contract/dosaveOrUpdate",this.CtObj,res => {
                if (res.data.resultCode === 1) {
                    this.Success(res.data.message);
                    this.getList();
                } else {
                    this.Error(res.data.message);
                }
            },null);
      },
      //跳转至预览
      goUrl(){
        this.$router.push({
          name: 'ElectronicContract',
          query: {
            TCID: this.$route.query.TCID,
            orderID: this.$route.query.orderID,
            blank: "y",
          }
        });
      },
      //作废
      getinvalid(){
          this.$confirm('是否作废?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                this.CtObj.status=0;
                this.apiJavaPost("/api/contract/dosaveOrUpdate",this.CtObj,res => {
                    if (res.data.resultCode === 1) {
                        this.Success(res.data.message);
                        this.getList();
                    } else {
                        this.Error(res.data.message);
                    }
                },null);
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消删除'
                });
            });
      },
     //提交
     submitForm(addMsg) {
        //提交创建、修改表单
        this.$refs[addMsg].validate(valid => {
                if (valid) {
                    this.SaveMsg();
                } else {
                    this.Error('请完成必填项');
                    return false;
                }
            });
     },
     sendAudit(){
        this.CtObj.auditContract=1;
        this.apiJavaPost("/api/contract/dosaveOrUpdate",this.CtObj,res => {
            if (res.data.resultCode === 1) {
                this.Success(res.data.message);
            } else {
                this.Error(res.data.message);
            }
        },null);
     },



     GetTrip(id, TCID) {
        this.tripList = [];
        this.startDate = '';
        var nTCID = 0;
        if (TCID) {
          nTCID = TCID;
        }
        var msg = {
          configId: 0,
          tcid: nTCID,
          isClick:1//不算统计
        };
        if (id !== undefined) {
          //根据ID 获取行程内容
          this.apipost(
            "b2b_get_GetB2BTravelInfoNoDes", msg,
            res => {
              if (res.data.resultCode == 1) {
                if (res.data.data.priceList && res.data.data.priceList.length > 0) {
                  this.startDate = res.data.data.priceList[0].startDate;
                }
                this.tripList = res.data.data.dayList;
                this.init();
              }
            },
            err => {}
          );
        } else {
          var dayList = [];
          this.subConfig.DayList.forEach((objItem, objIndex) => {
            var dayItem = this.$tripUtils.daysArrayObj();
            dayItem.dayNum = objItem.dayNum;
            //每一天的数组
            var dayArray = [];
            //子项遍历
            objItem.dayArray.forEach(subItem => {
              switch (subItem.Type) {
                //交通
                case "1":
                  var subTraffiArray = [];
                  subItem.childItem.SubTraffic.forEach(subTrafficItem => {
                    subTraffiArray.push({
                      startCityName: subTrafficItem.StartCityName,
                      arrivalType: subTrafficItem.ArrivalType,
                      arrivalCityName: subTrafficItem.ArrivalCityName
                    });
                  });
                  var trafficObj = {
                    type: subItem.Type,
                    childItem: {
                      description: subItem.childItem.Description,
                      subTraffic: subTraffiArray
                    }
                  };
                  dayArray.push(trafficObj);
                  break;
                  //景点
                case "2":
                  var imgArray = [];
                  subItem.childItem.ImaArray.forEach(imgItem => {
                    imgArray.push({
                      url: imgItem.Url,
                      name: imgItem.Name
                    });
                  });
                  var scenicObj = {
                    type: subItem.Type,
                    childItem: {
                      couponsName: subItem.childItem.CouponsName,
                      couponsTicketName: subItem.childItem.CouponsTicketName,
                      playTimeHour: subItem.childItem.PlayTimeHour,
                      playTimeMinutes: subItem.childItem.PlayTimeMinutes,
                      description: subItem.childItem.Description,
                      imaArray: imgArray
                    }
                  };
                  dayArray.push(scenicObj);
                  break;
                  //酒店
                case "3":
                  var imgArray = [];
                  subItem.childItem.ImaArray.forEach(imgItem => {
                    imgArray.push({
                      url: imgItem.Url,
                      name: imgItem.Name
                    });
                  });
                  var hotelObj = {
                    type: subItem.Type,
                    childItem: {
                      hotelName: subItem.childItem.HotelName,
                      hotelProductName: subItem.childItem.HotelProductName,
                      useDinnerType: subItem.childItem.UseDinnerType,
                      description: subItem.childItem.Description,
                      imaArray: imgArray
                    }
                  };
                  dayArray.push(hotelObj);
                  break;
                  //餐厅
                case "4":
                  var imgArray = [];
                  subItem.childItem.ImaArray.forEach(imgItem => {
                    imgArray.push({
                      url: imgItem.Url,
                      name: imgItem.Name
                    });
                  });
                  var dinnerObj = {
                    type: subItem.Type,
                    childItem: {
                      dinnerName: subItem.childItem.DinnerName,
                      mealName: subItem.childItem.MinnerName,
                      useDinnerType: subItem.childItem.UseDinnerType,
                      useTimeHour: subItem.childItem.UseTimeHour,
                      useTimeMinutes: subItem.childItem.UseTimeMinutes,
                      description: subItem.childItem.Description,
                      descriptionText: subItem.childItem.Description,
                      imaArray: imgArray
                    }
                  };
                  dayArray.push(dinnerObj);
                  break;
                  //自由活动
                case "5":
                  var freedomObj = {
                    type: subItem.Type,
                    childItem: {
                      description: subItem.Description,
                      descriptionText: subItem.Description
                    }
                  };
                  dayArray.push(freedomObj);
                  break;
                  //温馨提示
                case "6":
                  var warmObj = {
                    type: subItem.Type,
                    childItem: {
                      description: subItem.Description,
                      descriptionText: subItem.Description
                    }
                  };
                  dayArray.push(warmObj);
                  break;
                  //行程大点
                case "7":
                  var titleObj = {
                    type: subItem.Type,
                    childItem: {
                      title: subItem.childItem.Title,
                      description: subItem.childItem.Description
                    }
                  };
                  dayArray.push(titleObj);
                  break;
              }
            });
            dayItem.dayArray = dayArray;
            dayList.push(dayItem);
          });
          this.tripList = dayList;
          this.init();
        }
      },
      init() {
        this.tripList.forEach((x, j) => {
          let useDinnerTypeBy = "";
          let jin = [],
            jiu = [],
            jiu2 = [],
            jiao = [],
            dadian = [],
            tips = [],
            activy = [],
            can = {
              breakfirst: "敬请自理",
              lanuch: "敬请自理",
              dinner: "敬请自理"
            };
          x.dayArray.forEach((y, index) => {
            if (y.type == 7 && y.childItem.title != "") {
              let obj = {
                title: y.childItem.title,
                content: y.childItem.description,
                img: y.childItem.imaArray && y.childItem.imaArray.length > 0 ?
                  y.childItem.imaArray[0].url : "",
                ticketName: "",
                playTimeHour: null,
                playTimeMinutes: null
              };
              dadian.push(obj);
            } else if (y.type == 1 && y.childItem.subTraffic.length > 0) {
              let title = "";
              y.childItem.subTraffic.forEach((z, i) => {
                title += z.startCityName;
                if (z.arrivalType == 1) {
                  title += '-';
                } else if (z.arrivalType == 2) {
                  title += '-';
                } else if (z.arrivalType == 3) {
                  title += '-';
                } else {
                  title += '-';
                }
                if (i + 1 == y.childItem.subTraffic.length) {
                  title += z.arrivalCityName;
                }
              });
              let obj = {
                title: title,
                content: y.childItem.description,
                img: "",
                ticketName: "",
                playTimeHour: null,
                playTimeMinutes: null
              };
              jiao.push(obj);
            } else if (
              y.type == 2 &&
              y.childItem.couponsName != "" &&
              y.childItem.imaArray.length > 0
            ) {
              let obj = {
                title: y.childItem.couponsName,
                content: y.childItem.description,
                img: y.childItem.imaArray[0].url,
                ticketName: y.childItem.couponsTicketName,
                playTimeHour: y.childItem.playTimeHour,
                playTimeMinutes: y.childItem.playTimeHour
              };
              jin.push(obj);
            } else if (
              y.type == 3 &&
              y.childItem.hotelName != "" &&
              y.childItem.imaArray.length > 0
            ) {
              let obj = {
                title: y.childItem.hotelName,
                content: y.childItem.description,
                img: y.childItem.imaArray[0].url,
                ticketName: "",
                playTimeHour: null,
                playTimeMinutes: null
              };
              jiu.push(obj);
            } else if (y.type == 4) {
              if (y.childItem.useDinnerType == "1") {
                can.breakfirst = y.childItem.dinnerName;
              } else if (y.childItem.useDinnerType == "2") {
                can.lanuch = y.childItem.dinnerName;
              } else if (y.childItem.useDinnerType == "3") {
                can.dinner = y.childItem.dinnerName;
              }
            } else if (y.type == 5) {
              let obj = {
                title: "自由活动",
                content: y.childItem.description,
                img: "",
                ticketName: "",
                playTimeHour: null,
                playTimeMinutes: null
              };
              activy.push(obj);
            } else if (y.type == 6) {
              let obj = {
                title: y.childItem.title,
                content: y.childItem.description,
                img: "",
                ticketName: "",
                playTimeHour: null,
                playTimeMinutes: null
              };
              tips.push(obj);
            }
            if (y.type == 3) {
              jiu2.push(y.childItem.hotelName);
              useDinnerTypeBy = y.childItem.useDinnerType;
            }
          });
          if (
            can.breakfirst == "敬请自理" &&
            useDinnerTypeBy.indexOf("1") != -1
          ) {
            can.breakfirst = "酒店内享用早餐";
          }
          if (can.lanuch == "敬请自理" && useDinnerTypeBy.indexOf("2") != -1) {
            can.lanuch = "酒店自助";
          }
          if (can.dinner == "敬请自理" && useDinnerTypeBy.indexOf("3") != -1) {
            can.dinner = "酒店自助";
          }
          x.can = can;
          let details = [];
          x.tips = tips;
          x.jiu2 = jiu2;
          if (jin.length > 0) {
            details = jin;
          } else if (jiu.length > 0) {
            details = jiu;
          } else if (dadian.length > 0) {
            details = dadian;
          } else if (jiao.length > 0) {
            if (j == this.tripList.length - 1) {
              let obj = {
                title: "温暖的家",
                content: "感谢您参加本次行程，期待下次与您相遇",
                img: ""
              };
              details.push(obj);
            } else {
              details = jiao;
            }
          } else if (activy.length > 0) {
            details = activy;
          }
          x.title =
            dadian.length > 0 ?
            dadian[0].title :
            jiao.length > 0 ?
            jiao[0].title :
            "集合出发";
          x.details = details;

          if (x.details.length == 0) {
            if (j == 0) {
              let obj = {
                title: "集合出发",
                content: "向着远方的目标出发起飞",
                img: "",
                ticketName: "",
                playTimeHour: null,
                playTimeMinutes: null
              };
              details.push(obj);
            } else if (j == this.tripList.length - 1) {
              let obj = {
                title: "温暖的家",
                content: "感谢您参加本次行程，期待下次与您相遇",
                img: "",
                ticketName: "",
                playTimeHour: null,
                playTimeMinutes: null
              };
              details.push(obj);
            }
          } else {
            if (x.title == "集合出发") {
              x.details.forEach(xc => {
                if (xc.title !== undefined) x.title = xc.title + "~";
              });
              if (x.title == "集合出发") {
                if (j > 0 && j < tripList.length - 1) x.title = "自由活动";
              } else {
                x.title = x.title.substring(0, x.title.length - 1);
              }
            }
          }
          x.islast = j + 1 == this.tripList.length;
          this.$set(this.tripList, j, x);
        });
        for (let i = this.tripList.length - 1; i >= 0; i--) {
          if (i == 0) this.tripList[i].can.breakfirst = "敬请自理";
          else {
            this.tripList[i].can.breakfirst = this.tripList[i - 1].can.breakfirst;
            if (
              this.tripList[i].lineId != 5 &&
              this.tripList[i].can.breakfirst == "敬请自理"
            )
              this.tripList[i].can.breakfirst = "酒店内享用早餐";
          }
        }
        let str = '';
        this.tripList.forEach((x,index)=>{
            str +=`第${x.dayNum}天  ${x.title}\n`
            x.details.forEach(y=>{
                if(index==this.tripList.length-1){
                    str+=`温暖的家\n`
                }else{
                    str +=`${y.title}\n`
                }
            })
            str +=`早餐：${x.can.breakfirst}\n午餐：${x.can.lanuch}\n晚餐：${x.can.dinner}\n \r`
        })
        this.CtObj.travelContent = str;
      }
    },
    mounted() {
        this.GetCounrty();
        this.msg.TCID = this.$route.query.TCID;
        this.msg.orderID = this.$route.query.orderID;
        this.getList();
        this.GetTrip(0,this.msg.TCID);
    }
  };
</script>
