<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: 100%;
  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>联运设置</div>
      <!--保存-->
      <input type='button' class="normalBtn" @click="SaveUnion()" value="保存"></input>
      <table class="singeRowTable DT_Table" border="0" cellspacing="0" cellpadding="0">
        <tbody>
          <tr>
            <td width="120">选择团期</td>
            <td align="left">
              <ul>
                <li v-for="item in PriceDataList" class="Distri_TeamDayList"><span @click="clickedDay(item)" class="_Checked"
                    :class="{NoChecked:item.checkState===ShowStatusList.NoChecked,YesChecked:item.checkState===ShowStatusList.Checked}">{{item.StartDate}}</span></li>
              </ul>
            </td>
          </tr>
        </tbody>
      </table>
      <table class="singeRowTable DT_Table" border="0" cellspacing="0" cellpadding="0" v-loading="loading">
        <thead>
          <tr>
            <th width="120">
              公司
            </th>
            <th width="120">
              城市
            </th>
            <th width="80">
              航段
            </th>
            <th width="110">
              出发日期
            </th>
            <th width="200">
              航空公司
            </th>
            <th width="200">
              航班
            </th>
            <th width="70">
              是否住宿
            </th>
            <th width="110">
              票务估价
            </th>
            <th width="110">
              OP加价
            </th>
            <th width="160">
              集合地点
            </th>
            <th width="150">
              操作
            </th>
          </tr>
        </thead>
        <tbody v-for="(item,index) in UnionList" :key="item.subCode">
          <tr>
            <td rowspan="2">
              <el-select class="w95" filterable v-model="item.UnionBranchId">
                <el-option label='请选择' :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">
              <el-select class="w95" filterable v-model="item.UnionCityId">
                <el-option label='请选择' :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>
              去程
            </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='请选择' :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="w200" filterable v-model="item.FlightId">
                <el-option label='请选择' :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>
              <span v-if="item.GoEvaluatePrice<=0">未配置</span>
              <span v-else>{{item.GoEvaluatePrice}}</span>
            </td>
            <td>
              <el-input class="w95" v-model="item.GoAddPrice" @keyup.native="checkPrice(item,'GoAddPrice',true)"></el-input>
            </td>
            <td rowspan="2">
              <el-input class="w150" v-model="item.GatherAddress"></el-input>
            </td>
            <td rowspan="2">
              <!-- <el-button type="primary" icon="iconfont icon-Edit" circle @click="AddItem(item,index)"></el-button> -->
              <el-button type="danger" icon="iconfont icon-guanbi" circle @click="DeleteUnion(item,index)"></el-button>
              <el-popover width="400" trigger="click">
                <div>
                  <table class="singeRowTable" border="0" cellspacing="0" cellpadding="0" style="width：100%">
                    <tr>
                      <th>选择</th>
                      <th>类型</th>
                      <th>订单号</th>
                      <th>销售</th>
                    </tr>
                    <tbody v-for="item in  OrderDataList.OtherOrderList">
                      <tr v-for="subItem in item.List">
                        <td>
                          <label>
                            <input :value="subItem.OrderId" style="vertical-align: middle;" v-model="ArrList" type="checkbox" />
                          </label>
                        </td>
                        <td>{{item.GroupTypeName}}</td>
                        <td>{{subItem.OrderId}}</td>
                        <td>{{subItem.CreateBy}}</td>
                      </tr>
                    </tbody>
                  </table>
                  <input type="button" class="normalBtn DT_saveBtn" value="保存" @click="SavePriceUnionOrder(item)" />
                </div>
                <el-button title="关联订单" v-if="item.ID>0" slot="reference" type="primary" style="margin-left:10px;" icon="iconfont icon-guanlian"
                  circle @click="ArrList=item.ArrList,getOrderList()"></el-button>
              </el-popover>
            </td>
          </tr>
          <tr>
            <td>返程</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='请选择' :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="w200" filterable v-model="item.BackFlightId">
                <el-option label='请选择' :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>
              <span v-if="item.BackEvaluatePrice<=0">未配置</span>
              <span v-else>{{item.BackEvaluatePrice}}</span>
            </td>
            <td>
              <el-input class="w95" v-model="item.BackAddPrice" @keyup.native="checkPrice(item,'BackAddPrice',true)"></el-input>
            </td>
          </tr>
        </tbody>
        <tfoot>
          <tr>
            <td colspan="11">
              <input v-if="ChoosrPriceArray!=null && ChoosrPriceArray.length>0" type='button' class="normalBtn" @click="AddItem()" value="新增"></input>
            </td>
          </tr>
        </tfoot>
      </table>
    </div>
  </div>
</template>
<script>
  export default {
    data() {
      return {
        ArrList: [],
        cityList: [],
        CompanyList: [],
        ConfigId: 0,
        defaultBranchId:-1,
        //下拉框默认值
        selectDefauleValue: 0,
        CheckedVaule: 1,
        UnCheckedVaule: 0,
        //团期数组
        PriceDataList: [],
        //状态值
        ShowStatus: 1,
        //状态值列表
        ShowStatusList: {
          NoChecked: 1, //未选中
          Checked: 2 //选中
        },
        //点击选择的项
        ClickItem: {},
        //加载数据层
        loading: false,
        //选中的团期数组
        ChoosrPriceArray: [],
        //联运信息
        UnionList: [],
        //航空公司列表
        AirlineList: [],
        //订单详细列表
        OrderDataList: [],
        //天数
        DayList: [{
            ID: -1,
            Name: "前一天"
          },
          {
            ID: -2,
            Name: "前两天"
          },
          {
            ID: 0,
            Name: "当天"
          },
          {
            ID: 1,
            Name: "后一天"
          },
          {
            ID: 2,
            Name: "后两天"
          }
        ]
      };
    },
    methods: {
      getCityList() {
        this.apipost(
          "Destination_get_GetCityListByCountryId", {
            Id: 2
          },
          res => {
            this.cityList = res.data.data;
          },
          err => {}
        );
      },
      getCompanyList() { //获取公司列表
        this.apipost('admin_get_BranchGetList', this.getCompanyMsg, res => {
          if (res.data.resultCode == 1) {
            this.CompanyList = res.data.data;
          } else {}
        }, err => {})
      },
      //点击选中日历日期获取联运数据
      clickedDay(item) {
        var obj = {
          AirTicketId: item.AirTicketId,
          TCID: item.TCID,
          //出团公司
          OutBranchId: item.OutBranchId
        };
        switch (item.checkState) {
          //未选中====>选中
          case this.ShowStatusList.NoChecked:
            if (this.getCheckedCount() > 0 && item.IsUnion) {
              this.Info("该团期设置已设置联运，不能与其他团期批量设置");
            } else {
              if (this.getCheckedAndHaveUnionCount() > 0) {
                this.Info("已设置联运的团期不能批量设置");
              } else {
                item.checkState = this.ShowStatusList.Checked;
                if (!this.IsInArray(obj.TCID)) {
                  this.ChoosrPriceArray.push(obj);
                }
              }
            }
            break;
            //选中===>未选中
          case this.ShowStatusList.Checked:
            item.checkState = this.ShowStatusList.NoChecked;
            this.RemoveChooseArray(obj);
            break;
        }
        this.ClickItem = item;
        this.GetUnionData();
      },
      //获取联运数据
      GetUnionData() {
        this.UnionList = [];
        if (this.ChoosrPriceArray != null && this.ChoosrPriceArray.length > 0) {
          this.loading = true;
          this.apipost(
            "AirTicket_Get_GetAirticketUnionListByAirticketId", {
              qMag: JSON.stringify(this.ChoosrPriceArray)
            },
            res => {
              if (res.data.resultCode == 1) {
                var array = res.data.data;
                if (array != null && array.length > 0) {
                  array.forEach(item => {
                      this.airLineSelectChange(item, item.AirLineId, 1);
                      this.airLineSelectChange(item, item.BackAirlineId, 2);
                      this.DayList.forEach(subItem => {
                        if (subItem.ID == item.DayNum) {
                          item.DayStr = subItem.Name;
                        }
                        if (subItem.ID == item.BackDayNum) {
                          item.BackDayStr = subItem.Name;
                        }
                      });
                  });
                }
                this.UnionList = array;
              }
              this.loading = false;
            }
          );
        }
      },
      //根据TCID删除联运
      RemoveChooseArray(objItem) {
        var array = [];
        if (this.ChoosrPriceArray != null && this.ChoosrPriceArray.length > 0) {
          this.ChoosrPriceArray.forEach(priceItem => {
            if (priceItem.TCID != objItem.TCID) {
              array.push(priceItem);
            }
          });
        }
        this.ChoosrPriceArray = array;
      },
      //判断数组是否存在
      IsInArray(TCID) {
        this.$tripUtils.isInObjArr(this.ChoosrPriceArray, "TCID", TCID);
      },
      //获取团期数据
      getList() {
        this.apipost(
          "travel_get_GetTravelPriceListByConfigId", {
            ConfigId: this.ConfigId
          },
          res => {
            if (res.data.resultCode == 1) {
              var array = res.data.data;
              if (array != null && array.length > 0) {
                array.forEach(aitem => {
                  aitem.checkState = this.ShowStatusList.NoChecked;
                });
              }
              this.PriceDataList = array;
            }
          }
        );
      },
      //初始化航空公司下拉
      initAirlines() {
        this.apipost(
          "airline_post_GetList", {},
          res => {
            if (res.data.resultCode == 1) {
              this.AirlineList = res.data.data;
            } else {
              this.Warning(res.data.message);
            }
          },
          err => {}
        );
      },
      //航空公司切换
      airLineSelectChange(item, AirLineId, type) {
        let qMsg = {
          AirlineID: AirLineId,
          Arrival_city: 0,
          Departure_city: 0
        };
        if (type == 1) {
          qMsg.Departure_city = item.UnionCityId;
        } else if (type == 2) {
          qMsg.Arrival_city = item.UnionCityId;
        }

        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);
            }
          },
          err => {}
        );
      },
      //添加新增联运
      AddItem(item, index) {
        this.UnionList.push({
          ID: 0,
          UnionCityId: 0,
          UnionBranchId: -1,
          DayNum: 0,
          AirLineId: 0,
          BackAirlineId: 0,
          FlightId: 0,
          FlightList: [], //航班列表(前台使用)
          BackFlightList: [], //回程航班列表
          IsStay: 0,
          GoEvaluatePrice: 0,
          BackEvaluatePrice: 0,
          GoAddPrice: 0,
          BackAddPrice: 0,
          BackFlightId: 0,
          BackDayNum: 0,
          UnionTicketPriceList: [],
          GatherAddress: "",
          //选中的订单数组
          ArrList: []
        });
      },
      //保存联运信息数据
      SaveUnion() {
        let msg = {
          SaveData: this.UnionList,
          qMsg: JSON.stringify(this.ChoosrPriceArray)
        };
        this.apipost("travel_post_SetUnion", msg, res => {
          if (res.data.resultCode == 1) {
            this.Success("设置联运成功!");
            this.ArrList = [];
            this.GetUnionData();
          } else {
            this.Error(res.data.message);
          }
        });
      },
      //保存联运订单
      SavePriceUnionOrder(item) {
        var msg = {
          ID: item.ID,
          qMsg: this.ArrList
        };
        this.apipost("travel_post_SetPriceUnionOrder", msg, res => {
          if (res.data.resultCode == 1) {
            this.Success("设置联运订单成功!");
            this.ArrList = [];
            this.GetUnionData();
          } else {
            this.Error(res.data.message);
          }
        });
      },
      //删除联运
      DeleteUnion(item, index) {
        var that = this;
        if (item.ID > 0) {
          that.Confirm("是否删除此联运信息?", function () {
            let msg = {
              SaveData: item,
              qMag: JSON.stringify(that.ChoosrPriceArray)
            };
            that.apipost("travel_post_RemoveUnion", msg, res => {
              if (res.data.resultCode == 1) {
                that.GetUnionData();
                that.ArrList = [];
              } else {
                that.Error(res.data.message);
              }
            });
          });
        } else {
          that.UnionList.splice(index, 1);
          item.DayNum = 0;
          item.BackDayNum = 0;
          item.AirLineId = 0;
          item.BackAirlineId = 0;
          item.FlightId = 0;
          item.BackFlightId = 0;
          item.GoAddPrice = 0;
          item.BackAddPrice = 0;
        }
      },
      //获取选中并且已参加过的联运数量
      getCheckedAndHaveUnionCount() {
        let count = 0;
        this.PriceDataList.forEach(x => {
          if (x.IsUnion > 0 && x.checkState == this.ShowStatusList.Checked) {
            count++;
          }
        });
        return count;
      },
      //获取选中的团期数量
      getCheckedCount() {
        let count = 0;
        this.PriceDataList.forEach(x => {
          if (x.checkState == this.ShowStatusList.Checked) {
            count++;
          }
        });
        return count;
      },
      getOrderList() {
        let msg = {
          TCID: this.ChoosrPriceArray[0].TCID,
          OrderId: 0
        }
        this.apipost(
          "sellorder_get_GetOrderListByTCID",
          msg,
          res => {
            this.loading = false;
            if (res.data.resultCode == 1) {
              this.OrderDataList = res.data.data;
            }
          },
          err => {}
        );

      }
    },
    mounted() {
      this.initAirlines();
      this.ConfigId = this.$route.query.id;
      this.getList();
      this.getCompanyList();
      this.getCityList()
    }
  };

</script>
