<style>
  @import "../../assets/css/newTravelManager.css";

  .DT_rightList {
    float: left;
    font-size: 12px;
    width: 100%;
    margin-top: 10px;
  }

  .DT_rightList ._Checked {
    padding: 5px 10px;
    border-radius: 3px;
    margin-left: 10px;
  }

  /*未选中的状态*/
  .DT_rightList .NoChecked {
    cursor: pointer;
    background-color: #c0ebd1;
  }

  /*选中的状态*/
  .DT_rightList .YesChecked {
    cursor: pointer;
    background-color: #E95252;
    color: #fff;
  }

  .DT_rightList .DT_Table {
    width: 1700px;
    border-collapse: collapse;
  }

  .DT_rightList .DT_Table tr td {
    border: 1px solid #e5e5e5;
  }

  .DT_rightList .TMTitle {
    margin-bottom: 20px;
  }

  .DT_rightList .singeRowTable tr:hover {
    background-color: #fff !important;
  }

  .DT_rightList .singeRowTable tr:nth-child(2n + 1) {
    background-color: #fff !important;
  }

  .DT_rightList .el-button.is-circle {
    padding: 3px;
  }

  .DT_ConbinBtn {
    margin: 10px 0 0 0;
    padding: 0 10px;
    height: 25px;
  }

  .DT_saveBtn {
    margin: 10px 0 0 165px;
  }

  .Distri_TeamDayList {
    display: inline-block;
  }

</style>
<template>
  <div class="clearfix">
    <div class="DT_rightList">
      <div class="TMTitle"><i></i>{{$t('objFill.v101.piaowlyunpz')}}</div>
      <!--保存-->
      <el-button type="primary" @click.native="SaveUnion()" :loading="saveLoading" >{{$t('pub.saveBtn')}}</el-button>

      <table class="singeRowTable DT_Table" border="0" cellspacing="0" cellpadding="0" v-loading="loading">
        <thead>
          <tr>
            <th width="140">
              {{$t('sm.company')}}
            </th>

            <th width="150">
              {{$t('sm.dingdanxinxi')}}
            </th>
            <th width="150">
              {{$t('objFill.v101.xiaosoureny')}}
            </th>
            <th width="150">
              {{$t('salesModule.LKMD')}}
            </th>
            <th width="100">
              {{$t('Airticket.Air_segment')}}
            </th>
            <th width="120">
              {{$t('hotel.hotel_StarDate')}}
            </th>
            <th width="200">
              {{$t('system.query_airCompanyName')}}
            </th>
            <th>
              {{$t('system.table_city')}}
            </th>
            <th width="200">
              {{$t('visa.v_hangban')}}
            </th>
            <th width="120">
              {{$t('salesModule.IsZS')}}
            </th>
            <th width="110">
              {{$t('objFill.v101.piaowugujia')}}
            </th>
            <th width="110">
              {{$t('objFill.v101.peizhishul')}}
            </th>
            <th width="500">
              {{$t('objFill.v101.piaowubz')}}
            </th>
            <th width="120">
              {{$t('objFill.v101.busManagement.querenzt')}}
            </th>
            <th width="120">
              {{$t('objFill.shiyonglvke')}}
            </th>
          </tr>
        </thead>
        <template v-if="UnionList&&UnionList.length>0">
          <tbody v-for="(item,index) in UnionList" :key="index" style="padding-top:10px;">
            <tr>
              <td rowspan="2">
                <el-select class="w120" filterable v-model="item.UnionBranchId" :disabled="true">
                  <el-option :label="$t('objFill.qingxuanzhe')" :value="defaultBranchId"></el-option>
                  <el-option v-for="subItem in CompanyList" :label='subItem.BName' :value='subItem.Id'
                    :key="subItem.Id">
                  </el-option>
                </el-select>
              </td>

              <td rowspan="2">
                {{item.OrderId}}
              </td>
              <td rowspan="2">
                {{item.OrderCreateByName}}
              </td>
              <td rowspan="2">
                {{item.GuestNames}}
              </td>
              <td>
                {{$t('Airticket.Air_go')}}
              </td>
              <td>
                <el-select class="w95" filterable v-model="item.DayNum">
                  <el-option v-for="subItem in DayList" :label='subItem.Name' :value='subItem.ID'
                    :key="subItem.subCode">
                  </el-option>
                </el-select>
              </td>
              <td>
                <el-select class="w180" filterable v-model="item.AirLineId"
                  @change="airLineSelectChange(item,item.AirLineId,1)">
                  <el-option :label="$t('objFill.qingxuanzhe')" :value="selectDefauleValue"></el-option>
                  <el-option v-for="subItem in AirlineList" :label='subItem.AlName' :value='subItem.AirLineId'
                    :key="subItem.subCode">
                  </el-option>
                </el-select>
              </td>
              <td>
                <el-select class="w80" filterable v-model="item.UnionCityId"
                  @change="airLineSelectChange(item,item.AirLineId,1)">
                  <el-option :label="$t('objFill.qingxuanzhe')" :value="selectDefauleValue"></el-option>
                  <el-option v-for="subItem in cityList" :label='subItem.Name' :value='subItem.ID'
                    :key="subItem.subCode">
                  </el-option>
                </el-select>
              </td>
              <td>
                <el-select class="w200" filterable v-model="item.FlightId">
                  <el-option :label="$t('objFill.qingxuanzhe')" :value="selectDefauleValue"></el-option>
                  <el-option v-for="subItem in item.FlightList" :label='subItem.Flight_number' :value='subItem.ID'
                    :key="subItem.subCode">
                  </el-option>
                </el-select>
              </td>
              <td rowspan="2">
                <el-checkbox v-model="item.IsStay" :checked="item.IsStay===CheckedVaule" :true-label="CheckedVaule"
                  :false-label="UnCheckedVaule"></el-checkbox>
              </td>
              <td>
                <el-input class="w95" v-model="item.AddGoCostPrice"
                  @keyup.native="checkPrice(item,'AddGoCostPrice',true)"></el-input>
              </td>
              <td rowspan="2">
                <el-input class="w95" v-model="item.ConfigNum" @keyup.native="checkInteger(item,'ConfigNum',true)">
                </el-input>
              </td>
              <td rowspan="2">
                <el-input type="textarea" v-model="item.Notes" :placeholder="$t('objFill.v101.qingtxpwbzhu')">
                </el-input>
              </td>
              <td rowspan="2">
                <el-select :placeholder="$t('pub.pleaseSel')" v-model="item.IsSure">
                  <el-option :key="0" :value="0" :label="$t('objFill.v101.daidin')"></el-option>
                  <el-option :key="1" :value="1" :label="$t('restaurant.res_confirm')"></el-option>
                </el-select>
              </td>
              <td rowspan="2">
                {{item.GuestNameInfo}}
              </td>
            </tr>
            <tr>
              <td>{{$t('objFill.v101.fancheng')}}</td>
              <td>
                <el-select class="w95" filterable v-model="item.BackDayNum">
                  <el-option v-for="subItem in DayList" :label='subItem.Name' :value='subItem.ID'
                    :key="subItem.subCode">
                  </el-option>
                </el-select>
              </td>
              <td>
                <el-select class="w180" filterable v-model="item.BackAirlineId"
                  @change="airLineSelectChange(item,item.BackAirlineId,2)">
                  <el-option :label="$t('objFill.qingxuanzhe')" :value="selectDefauleValue"></el-option>
                  <el-option v-for="subItem in AirlineList" :label='subItem.AlName' :value='subItem.AirLineId'
                    :key="subItem.subCode">
                  </el-option>
                </el-select>
              </td>
              <td>
                <el-select class="w80" filterable v-model="item.UnionBackCityId"
                  @change="airLineSelectChange(item,item.BackAirlineId,2)">
                  <el-option :label="$t('objFill.qingxuanzhe')" :value="selectDefauleValue"></el-option>
                  <el-option v-for="subItem in cityList" :label='subItem.Name' :value='subItem.ID'
                    :key="subItem.subCode">
                  </el-option>
                </el-select>
              </td>
              <td>
                <el-select class="w200" filterable v-model="item.BackFlightId">
                  <el-option :label="$t('objFill.qingxuanzhe')" :value="selectDefauleValue"></el-option>
                  <el-option v-for="subItem in item.BackFlightList" :label='subItem.Flight_number' :value='subItem.ID'
                    :key="subItem.subCode">
                  </el-option>
                </el-select>
              </td>
              <td>
                <el-input class="w95" v-model="item.AddBackCostPrice"
                  @keyup.native="checkPrice(item,'AddBackCostPrice',true)"></el-input>
              </td>
            </tr>
            <tr>
              <td colspan="15" style="text-align:left;font-weight:bold;color:red;">
                &nbsp;{{$t('visaT.Orderremark')}}:{{item.Remarks}} <br />
                &nbsp;{{$t('objFill.liangyunbeizhu')}}:{{item.UnionRemark}}
              </td>
            </tr>
          </tbody>
        </template>
        <tbody v-else>
          <tr>
            <td colspan="15">
              {{$t('objFill.v101.Rest.zhanwpzlyxxin')}}
            </td>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</template>
<script>
  export default {
    data() {
      return {
        ArrList: [],
        cityList: [],
        CompanyList: [],
        TCID: 0,
        defaultBranchId: -1,
        //下拉框默认值
        selectDefauleValue: 0,
        CheckedVaule: 1,
        UnCheckedVaule: 0,
        //加载数据层
        loading: false,
        //联运信息
        UnionList: [],
        //航空公司列表
        AirlineList: [],
        //天数
        DayList: [{
            ID: -1,
            Name: this.$t('objFill.v101.qianyitian')
          },
          {
            ID: -2,
            Name: this.$t('objFill.v101.qianliantian')
          },
          {
            ID: 0,
            Name: this.$t('objFill.v101.dangtian')
          },
          {
            ID: 1,
            Name: this.$t('objFill.v101.houyitian')
          },
          {
            ID: 2,
            Name: this.$t('objFill.v101.houliangtian')
          }
        ],
        saveLoading: false, //保存按钮
      };
    },
    methods: {
      getCityList() {
        this.apipost(
          "Destination_get_GetCityListByCountryId", {
            Id: 2
          },
          res => {
            this.cityList = res.data.data;
          },
        );
      },
      getCompanyList() { //获取公司列表
        this.apipost('admin_get_BranchGetList', this.getCompanyMsg, res => {
          if (res.data.resultCode == 1) {
            this.CompanyList = res.data.data;
          }
        }, err => {})
      },
      //获取联运数据
      getList() {
        this.UnionList = [];
        this.loading = true;
        this.apipost(
          "AirTicket_get_GetUnionTicketListByTCIDNew", {
            TCID: this.TCID
          },
          res => {
            this.loading = false;
            if (res.data.resultCode == 1) {
              var array = res.data.data;
              if (array != null && array.length > 0) {
                array.forEach(item => {
                  if (item.AirLineId && item.FlightId && item.AirLineId > 0 && item.FlightId > 0) {
                    this.airLineSelectChange(item, item.AirLineId, 1);
                  }
                  if (item.BackAirlineId && item.BackFlightId && item.BackAirlineId > 0 && item.BackFlightId >
                    0) {
                    this.airLineSelectChange(item, item.BackAirlineId, 2);
                  }
                });
              }
              this.UnionList = array;
            }
          }
        );
      },
      //初始化航空公司下拉
      initAirlines() {
        this.apipost(
          "airline_post_GetList", {},
          res => {
            if (res.data.resultCode == 1) {
              this.AirlineList = res.data.data;
            } else {
              this.Warning(res.data.message);
            }
          },
        );
      },
      //航空公司切换
      airLineSelectChange(item, AirLineId, type) {
        let qMsg = {
          airlineID: AirLineId,
          Arrival_city: 0,
          Departure_city: 0
        };
        if (type == 1) {
          item.FlightList = [];
          qMsg.Departure_city = item.UnionCityId;
        } else if (type == 2) {
          item.BackFlightList = [];
          qMsg.Arrival_city = item.UnionBackCityId;
        }
        this.apipost(
          "flight_post_GetAirportNameList",
          qMsg,
          res => {
            if (res.data.resultCode == 1) {
              var tempArray = [];
              res.data.data.forEach(item => {
                var str =
                  item.Flight_number +
                  "【" +
                  item.dName +
                  "-" +
                  item.aName +
                  "】";
                tempArray.push({
                  ID: item.ID,
                  Flight_number: str
                });
              });
              if (type == 1) {
                item.FlightList = tempArray;
              } else {
                item.BackFlightList = tempArray;
              }
            } else {
              this.Warning(res.data.message);
            }
          },
        );
      },
      //保存联运信息数据
      SaveUnion() {
        this.saveLoading = true;
        this.UnionList.forEach(item => {
          item.FlightList = [];
          item.BackFlightList = [];
        });
        if (this.UnionList && this.UnionList.length > 0) {
          this.UnionList.forEach(item => {
            item.GuestIds = "";
          });
        }
        let msg = {
          SaveData: this.UnionList,
          TCID: this.TCID
        };
        this.apipost("AirTicket_get_SetUnionTicketV3", msg, res => {
          this.saveLoading = false;
          if (res.data.resultCode == 1) {
            this.Success(this.$t('objFill.v101.shezhilycgo'));
            this.ArrList = [];
            this.getList();
          } else {
            this.Error(res.data.message);
          }
        });
      },
    },
    created() {
      this.getCompanyList();
      this.getCityList()
      this.initAirlines();
      this.TCID = this.$route.query.tcid;
    },
    mounted() {
      this.getList();
    }
  };

</script>
