<style>
  .roomReservationsDetailsTalbe .el-button {
    padding: 5px;
    display: block;
    margin: 5px auto;
    font-size: 12px;
  }

  .rq_importNote {
    color: red;
  }

  .rq_disImNote {
    color: #ea6d6d;
  }

</style>

<template>
  <div>
    <div class="query-box" style="border-bottom: none;">
      <ul>
        <li>
          <input v-if="IsOperation!=1" type="button" class="fr normalBtn mb30" value="保存" @click="saveList(1)" />
          <span v-else style="color:red;font-size:14px;">已制单，不能在修改!</span>
        </li>
      </ul>
    </div>
    <div style="width: 100%;  overflow-x: auto;padding-bottom: 10px; " :style="{height: boxHeight + 'px'}"
      class="ownScrollbarStyle" ref="ownScrollbarStyle">
      <table border="0" cellspacing="1" cellpadding="0" class="roomReservationsDetailsTalbe" v-loading="loading">
        <tr>
          <th class="fz14" colspan="8">团队信息</th>
          <th class="fz14" colspan="13">地接操作信息</th>
        </tr>
        <tr>
          <th width="120">入住时间</th>
          <th width="180">酒店名称</th>
          <th width="120">机位总数<br />(Y/E/F)</th>
          <th width="80">占床/<br />不占床</th>
          <th width="80">实际<br />用房数</th>
          <th width="100">房间类型</th>
          <th width="70">房间数</th>
          <th width="70">房间<br />人数</th>
          <th width="170">修改酒店/供应商</th>
          <th width="80">房间<br />预定数</th>
          <th width="80">预定人数</th>
          <th width="80">尚差<br />房间数</th>
          <th width="80">单价/每人</th>
          <th width="80">免减人数</th>
          <th width="80">金额小计</th>
          <th width="80">返佣</th>
          <th width="100">金额总计</th>
          <th width="250">付款方式&订团号&备注</th>
          <th width="80">操作</th>
        </tr>
        <template v-for="(item,index) in list">
          <template v-for="(subItem,subIndex) in item.HotelOrderList">
            <tr v-for="(childItem,childIndex) in subItem.OrderDetailsList">
              <td v-if="childIndex==0&&subIndex==0" :rowspan="5*item.HotelOrderList.length">
                {{item.UseTimeStr}}
              </td>
              <!-- 酒店名称 -->
              <td v-if="childIndex==0" :rowspan="5">
                <table class="hotelTable">
                  <tr>
                    <td colspan="2">
                      <p class="link" style="word-break: normal;text-align:left;"
                        :class="{'Hotel_red':subItem.HotelChangeState==3}"
                        @click="goUrlR('HotelManagement',subItem.HotelId,'酒店管理')">{{subItem.HotelName}}</p>
                    </td>
                  </tr>
                  <tr>
                    <td colspan="2" style="height:5px;"></td>
                  </tr>
                  <tr>
                    <td width="40">
                      电话：
                    </td>
                    <td style="text-align:left">
                      {{subItem.Tel}}
                    </td>
                  </tr>
                  <tr>
                    <td colspan="2" style="height:5px;"></td>
                  </tr>
                  <tr>
                    <td width="40">
                      地址：
                    </td>
                    <td style="text-align:left">
                      {{subItem.Address}}
                    </td>
                  </tr>
                </table>

              </td>
              <!-- 机位总数/(Y/E/F) -->
              <td v-if="childIndex==0" :rowspan="5">
                <p class="link" @click="goUrlT('RegistrationList',item.TCID,'报名清单')">
                  {{flightTotal}}/{{subItem.HouseStatistics.RealityYSeatNum}}/{{subItem.HouseStatistics.RealityESeatNum}}/{{subItem.HouseStatistics.RealityFSeatNum}}
                </p>
              </td>
              <!-- 占床/不占床 -->
              <td v-if="childIndex==0" :rowspan="5">
                <p class="link" @click="goUrlT('passengerHouse',item.TCID,'房间分配')">
                  {{subItem.HouseStatistics.NeedBed}}/{{subItem.HouseStatistics.NoNeedBed}}</p>
              </td>
              <!-- 实际用房数 -->
              <td v-if="childIndex==0" :rowspan="5">
                {{subItem.HouseStatistics.RealityRoomNum}}
              </td>
              <!-- 房间类型 -->
              <td>
                {{subItem.HouseStatistics.HouseTypeList[childIndex].HouseTypeName}}
              </td>
              <!-- 房间数 -->
              <td>
                {{subItem.HouseStatistics.HouseTypeList[childIndex].HouseTypeCount}}
              </td>
              <!-- 房间人数 -->
              <td>
                {{subItem.HouseStatistics.HouseTypeList[childIndex].HouseGuestNum}}
              </td>
              <td v-if="childIndex==0" :rowspan="5">
                <table class="hotelTable">
                  <tr>
                    <td width="70" style="text-align:center;" colspan="2">
                      <span style="color:green">{{subItem.NewHotelName}}</span>
                      <el-popover placement="right" width="540" trigger="click" v-model="subItem.isShowPop">
                        <comCheckHotel :ref="'comCheckHotel'+index+subIndex+''" v-on:childHotel="childHotelList"
                          :UseDate="item.UseTimeStr" :Country="651">
                        </comCheckHotel>
                        <el-button size="small" type="danger" :data-index="'comCheckHotel'+index+subIndex+''"
                          slot="reference" style="cursor:pointer;"
                          @click="getChildHotel(index,subIndex),subItem.isShowPop=true">
                          酒店选择
                        </el-button>
                      </el-popover>
                    </td>
                  </tr>
                  <tr>
                    <td colspan="2" style="height:5px;"></td>
                  </tr>
                  <tr>
                    <td width="70" style="text-align:right;">
                      供应商
                    </td>
                    <td>
                      <el-select class='w120 sel' v-model='subItem.SupplierId' filterable placeholder="请选择供应商">
                        <el-option :label="$t('pub.unlimitedSel')" :value='0'></el-option>
                        <el-option v-for="(SupplierItem,Supplierindex) in SupplierList" :key="Supplierindex"
                          :label="SupplierItem.Name" :value="SupplierItem.ID">
                        </el-option>
                      </el-select>
                    </td>
                  </tr>
                  <tr>
                    <td colspan="2" style="height:5px;"></td>
                  </tr>
                  <tr>
                    <td colspan="2">
                      <p style="padding-top: 5px;">
                        <a v-if="subItem.ContractUrl" target="_blank" :href="subItem.ContractUrl">手配书</a>
                      </p>
                      <el-upload :http-request="uploadFileBtnS" :multiple="false" :show-file-list="false" action=''>
                        <el-button size="small" type="danger" @click='getItem(index, subIndex)'>
                          {{!subItem.ContractUrl ? '上传手配书' : '重新上传手配书'}}</el-button>
                      </el-upload>
                    </td>
                  </tr>
                </table>
              </td>
              <!-- 房间数 -->
              <td>
                <el-input class='w40 tcenter' maxlength="2" @keyup.native="checkPrice(childItem,'HouseTypeCount')"
                  v-model='childItem.HouseTypeCount' :disabled="childIndex<4?true:false"></el-input>
              </td>

              <td>
                <el-input class='w40 tcenter' maxlength="2" @keyup.native="checkInteger(childItem,'BookNum')"
                  @input="calculationPrice(subItem)" v-model='childItem.BookNum' :disabled="childIndex<4?true:false">
                </el-input>

              </td>
              <!-- 尚差房间数 -->
              <td>
                <p class="pHouseStyle"
                  :class="{colorRed:childItem.HouseTypeCount-subItem.HouseStatistics.HouseTypeList[childIndex].HouseTypeCount<0}">
                  {{childItem.HouseTypeCount-subItem.HouseStatistics.HouseTypeList[childIndex].HouseTypeCount}}
                </p>
              </td>
              <!-- 单价/每人 -->
              <td>
                <el-input @keyup.native="checkInteger(childItem,'UnitPrice')" class='w60 tcenter'
                  @input="calculationPrice(subItem)" v-model='childItem.UnitPrice'
                  :disabled="IsEditHotel==0?true:false">
                </el-input>
              </td>
              <!-- 免减人数 -->
              <td>
                <el-input class='w40' maxlength="2" @keyup.native="checkInteger(childItem,'HotelDiscount')"
                  v-model='childItem.HotelDiscount' @input="calculationPrice(subItem)">
                </el-input>
              </td>
              <!-- 金额小计 -->
              <td style="white-space:nowrap;">
                {{childItem.UnitPrice*(childItem.BookNum-childItem.HotelDiscount)}}
              </td>
              <!--返佣-->
              <td>
                <p class="pHouseStyle link">
                  <el-input class='w40' maxlength="2" @keyup.native="checkInteger(childItem,'RebateRatio')"
                    v-model='childItem.RebateRatio' @input="calculationPrice(subItem)"
                    :disabled="IsEditHotel==0?true:false"></el-input> %
                  <span style="display:none;" class="spanlink" @click="goUrl('HotelInfo',childItem,'酒店管理')">设置</span>
                </p>
              </td>
              <!-- 金额总计 -->
              <td v-if="childIndex==0" :rowspan="5" style="white-space:nowrap;">
                {{subItem.TotalPrice}}
              </td>
              <!-- 付款方式 -->
              <td v-if="childIndex==0" :rowspan="5">
                <table class="hotelTable">
                  <tr>
                    <td width="70" style="text-align:right;">订房状态：</td>
                    <td>
                      <el-select class='w135 sel' v-model='subItem.DMCState' :placeholder="$t('pub.pleaseSel')"
                        :disabled="IsEditHotel==0?true:false">
                        <el-option label='请选择' :value='0'></el-option>
                        <el-option label='确定' :value='1'></el-option>
                        <el-option label='暂定' :value='2'></el-option>
                      </el-select>
                    </td>
                  </tr>
                  <tr>
                    <td colspan="2" style="height:5px;"></td>
                  </tr>
                  <tr>
                    <td width="70" style="text-align:right;">确认时间：</td>
                    <td>
                      <el-date-picker v-model='subItem.SureTime' class='w135' value-format="yyyy-MM-dd" type="date"
                        :disabled="IsEditHotel==0?true:false"></el-date-picker>
                    </td>
                  </tr>
                  <tr>
                    <td colspan="2" style="height:5px;"></td>
                  </tr>
                  <tr>
                    <td width="70" style="text-align:right;">税入/税别：</td>
                    <td>
                      <el-select class='w135 sel' v-model='subItem.TaxType' :placeholder="$t('pub.pleaseSel')"
                        @change="calculationPrice(subItem)" :disabled="IsEditHotel==0?true:false">
                        <el-option label='请选择' :value='0'></el-option>
                        <el-option label='税入' :value='1'></el-option>
                        <el-option label='税别' :value='2'></el-option>
                      </el-select>
                    </td>
                  </tr>
                  <tr>
                    <td colspan="2" style="height:5px;"></td>
                  </tr>
                  <tr>
                    <td width="70" style="text-align:right;color:red">付款方式：</td>
                    <td>
                      <el-select class='w135 sel' v-model='subItem.DMCPayType' :placeholder="$t('pub.pleaseSel')"
                        :disabled="IsEditHotel==0?true:false">
                        <el-option label='请选择' :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-select>
                    </td>
                  </tr>
                  <tr style="display:none;">
                    <td colspan="2" style="height:5px;"></td>
                  </tr>
                  <tr style="display:none;">
                    <td width="70" style="text-align:right;">报账付款方式：</td>
                    <td>
                      <el-select class='w135 sel' v-model='subItem.PayStyle' :placeholder="$t('pub.pleaseSel')"
                        :disabled="IsEditHotel==0?true:false">
                        <el-option label='请选择' :value='0'></el-option>
                        <el-option label='现付' :value='1' v-if="subItem.PayStyleExt==1"></el-option>
                        <el-option label='签单' :value='2' v-if="subItem.PayStyleExt==2"></el-option>
                        <el-option label='实物抵扣' :value='3' v-if="subItem.PayStyleExt==3"></el-option>
                        <el-option label='预付' :value='4' v-if="subItem.PayStyleExt==4"></el-option>
                        <el-option label='预付款抵扣' :value='5' v-if="subItem.PayStyleExt==5"></el-option>
                        <el-option label='公司合团支付' :value='6'></el-option>
                      </el-select>
                    </td>
                  </tr>
                  <tr v-show="subItem.PayStyle==6">
                    <td colspan="2" style="height:5px;"></td>
                  </tr>
                  <tr v-show="subItem.PayStyle==6">
                    <td width="70" style="text-align:right;">付款团号：</td>
                    <td>
                      <el-input class='w135' v-model='subItem.PayTypeTCNUM' :disabled="IsEditHotel==0?true:false">
                      </el-input>
                    </td>
                  </tr>
                  <tr>
                    <td colspan="2" style="height:5px;"></td>
                  </tr>
                  <tr>
                    <td width="70" style="text-align:right;">订团号：</td>
                    <td>
                      <el-input class='w135' v-model='subItem.ReserveNo'></el-input>
                    </td>
                  </tr>
                  <tr>
                    <td colspan="2" style="height:5px;"></td>
                  </tr>
                  <tr>
                    <td width="70" style="text-align:right;">提醒供应商:</td>
                    <td>
                      <el-select class='w135 sel' v-model='subItem.SupplierHotelStatus'
                        :placeholder="$t('pub.pleaseSel')">
                        <el-option label='请选择' :value='0'></el-option>
                        <el-option label='一般提醒' :value='1'></el-option>
                        <el-option label='重要提醒' :value='2'></el-option>
                      </el-select>
                    </td>
                  </tr>
                  <tr>
                    <td colspan="2" style="height:5px;"></td>
                  </tr>
                  <tr>
                    <td width="70" style="text-align:right;">对供应商备注：</td>
                    <td>
                      <el-input type='textarea' class='w135' v-model='subItem.Remarks'></el-input>
                    </td>
                  </tr>
                  <tr v-if="subItem.SupplierToDmcRemarks">
                    <td width="70" style="text-align:right;">供应商对地接备注：</td>
                    <td>
                      <span
                        :class="{'rq_disImNote':subItem.SupplierToDmcHotelStatus==1&&DateMinus(subItem.SupplierToDmcHotelStatusTime)<=5,'rq_importNote':subItem.SupplierToDmcHotelStatus==2&&DateMinus(subItem.SupplierToDmcHotelStatusTime)<=5}">
                        {{subItem.SupplierToDmcRemarks}}
                      </span>
                    </td>
                  </tr>
                </table>
              </td>
              <!-- 操作 -->
              <td v-if="childIndex==0" :rowspan="5">
                <template v-if="subItem.OPState==1">
                  <span class="Hotel_red">OP-指定</span>
                </template>
                <template v-if="IsOperation!=1">
                  <el-tooltip class="item" effect="dark" content="保存" placement="top-start">
                    <el-button icon="iconfont icon-baocun1" @click="SaveSingle(subItem)" type="primary"></el-button>
                  </el-tooltip>
                  <el-tooltip class="item" effect="dark" content="新增" v-if="subItem.OPState!=1" placement="top-start">
                    <el-button @click='AddHotel(item,subIndex)' icon="iconfont icon-tianjia" type="primary"></el-button>
                  </el-tooltip>
                  <el-tooltip v-if="item.HotelOrderList.length>1 && subItem.OPState!=1" class="item" effect="dark"
                    content="删除" placement="top-start">
                    <el-button type="primary" icon="iconfont icon-shanchu" @click='DeleteHotel(item,subIndex)'>
                    </el-button>
                  </el-tooltip>
                </template>
                <el-popover width="200" trigger="click" popper-class="Bus_HotelPop">
                  <commonHotelLog :ref="'comHotelLog'+index+subIndex+''"> </commonHotelLog>
                  <div slot="reference" class="w80" style="cursor:pointer;text-decoration:underline;"
                    @click="GetHotelLog(subItem,index,subIndex)">日志</div>
                </el-popover>
              </td>
            </tr>
          </template>
        </template>
      </table>
    </div>
  </div>
</template>
<script>
  import moment from 'moment'
  import comCheckHotel from "../commonPage/comCheckHotel.vue";
  import commonHotelLog from "../commonPage/commonHotelLog.vue";
  import commonPHlInfo from "../commonPage/commonPriceHotelInfo.vue";
  export default {
    data() {
      return {
        defaultSelectValue: 0,
        list: [],
        roomList: [],
        TCNUM: '',
        flightTotal: 0,
        GuestNum: 0,
        hotelList: [],
        //创建人头像
        CreateByPhoto: '',
        //创建人联系电话
        CreateByAccount: '',
        //创建人姓名
        CreateByName: '',
        //点击项
        ClickItem: {},
        offsetwidth: 0,
        parentEle: '',
        checkedIndex: '',
        checkedsubIndex: '',
        loading: false,
        boxHeight: 0,

        //供应商列表
        SupplierList: [],
        ckedHotelId: 0,
        ckedHotelName: '',
        showHotelList: false,
        findex: 0,
        childIndex: 0,
        //修改酒店价格，付款方式权限[0-不能修改，1-有权限修改]
        IsEditHotel: 0,
        //0-可以操作，1-已制单，不能操作
        IsOperation: 1,
      }
    },
    components: {
      comCheckHotel,
      commonHotelLog,
      commonPHInfo: commonPHlInfo
    },
    methods: {
      //调用子组件方法
      GetHotelUsePriceList(HotelId, UseDay, index, hotelSubIndex) {
        let str = `dmccomPriceHotelInfo${index}${hotelSubIndex}`;
        this.$refs[str][0].getHotelPriceList(HotelId, UseDay);
      },
      //调用子组件获取日志方法
      GetHotelLog(subItem, index, hotelSubIndex) {
        let str = `comHotelLog${index}${hotelSubIndex}`
        this.$refs[str][0].getHotelLogsList(subItem.TCID, subItem.HotelId, subItem.CheckInDateStr);
      },
      //获取子组件返回的数据
      childHotelList(ckedObj) {
        //使用时间
        var oldData = JSON.parse(JSON.stringify(this.list[this.findex].HotelOrderList[this.childIndex]));
        this.list.forEach(x => {
          x.HotelOrderList.forEach(y => {
            y.isShowPop = false;
          })
        });
        var useTime = oldData.CheckInDateStr;
        var hotelId = ckedObj.ID;
        var TCID = oldData.TCID;
        this.apipost('travel_get_GetHotelUsePriceListService_V2', {
          HotelId: hotelId,
          UseTime: useTime,
          TCID: TCID
        }, res => {
          if (res.data.resultCode == 1) {
            var objData = res.data.data;
            //库存不够
            if (objData.isOverStock == 0) {
              if (objData.list && objData.list.length > 0) {
                var str = "";
                objData.list.forEach((cItem, cIndex) => {
                  str += (cIndex == 0 ? "" : ",") + cItem.TCNUM + "使用了" + cItem.LastUseNum + "间";
                });
                if (str != "") {
                  this.Info(str);
                }
              }
            }
            //库存充足或没有酒店库存的情况
            else if (objData.isOverStock == 1 || objData.isOverStock == -1) {
              this.list[this.findex].HotelOrderList[this.childIndex].Address = ckedObj.Address;
              this.list[this.findex].HotelOrderList[this.childIndex].NewHotelName = ckedObj.Name;
              this.list[this.findex].HotelOrderList[this.childIndex].Tel = ckedObj.Tel;
              this.list[this.findex].HotelOrderList[this.childIndex].NewHotelId = ckedObj.ID;
              this.list[this.findex].HotelOrderList[this.childIndex].PayStyle = ckedObj.PayStyle;
              this.list[this.findex].HotelOrderList[this.childIndex].PayStyleExt = ckedObj.PayStyle;
              this.list[this.findex].HotelOrderList[this.childIndex].OrderDetailsList.forEach(subItem => {
                subItem.UnitPrice = ckedObj.CostPrice;
                subItem.RebateRatio = ckedObj.RebateRatio;
              });
              this.calculationPrice(this.list[this.findex].HotelOrderList[this.childIndex]);
            }
          } else {
            this.Error("请求参数错误!");
          }
        }, err => {})
      },
      getChildHotel(index, subIndex) {
        this.findex = index;
        this.childIndex = subIndex;
        let str = `comCheckHotel${index}${subIndex}`
        this.$refs[str][0].getCheckHotel();
      },
      DateMinus(sDate) {
        var newDate = moment(sDate).format("YYYY-MM-DD");
        var sdate = new Date(newDate.replace(/-/g, "/"));
        var now = new Date();
        var days = now.getTime() - sdate.getTime();
        var day = Math.abs(parseInt(days / (1000 * 60 * 60 * 24)));
        return day;
      },
      getItem(index, subIndex) {
        this.checkedIndex = index
        this.checkedsubIndex = subIndex
      },
      uploadFileBtnS(file) { //手配书上传
        let that = this
        let newArr = []
        newArr.push(file.file)
        let path = '/Upload/DMC/Hotel'
        this.$message.info('上传中...')
        this.UploadSelfFileT(path, newArr, x => {
          this.list[this.checkedIndex].HotelOrderList[this.checkedsubIndex].ContractUrl = this.domainManager()
            .ViittoFileUrl + x.data.FilePath
          this.$message.success(x.data.Message)
          let newlist = JSON.parse(JSON.stringify(this.list))
          this.list = newlist
          this.$forceUpdate()
        })
      },
      //添加酒店
      AddHotel(item, subIndex) {
        var subItem = JSON.parse(JSON.stringify(item.HotelOrderList[subIndex]));
        subItem.HotelId = 0;
        subItem.HotelName = "";
        subItem.OrderID = 0;
        subItem.OrderDetailsList.forEach(childItem => {
          childItem.OrderDetailsId = 0;
        });
        item.HotelOrderList.push(subItem);
      },
      //删除酒店
      DeleteHotel(item, subIndex) {
        var that = this;
        this.Confirm("是否删除?删除后将不能恢复", function () {
          var subItem = item.HotelOrderList[subIndex];
          if (subItem.OrderID > 0) {
            that.apipost('dmcstatistics_post_DeleteHotelOrder', {
              ID: subItem.OrderID,
              TCID: subItem.TCID
            }, res => {
              if (res.data.resultCode == 1) {
                that.Success(res.data.message);
                that.getList();
                item.HotelOrderList.splice(subIndex, 1);
              } else {
                that.Error(res.data.message);
              }
            }, err => {})
          } else {
            item.HotelOrderList.splice(subIndex, 1);
            that.saveList(0);
          }
        });
      },

      //联系op
      downLoadPZ: function (src) {
        let dom = document.querySelector("#blankLink")
        dom.href = src
        dom.click()
      },
      //删除
      deleteFile(item, index) {
        item.ContractUrlArray.splice(index, 1);
        var str = "";
        item.ContractUrlArray.forEach(subItem => {
          str += subItem + ",";
        })
        item.ContractUrl = str != "" ? str.substring(0, str.length - 1) : str;
      },
      openChart() {
        this.MsgBus.$emit('openChat', {
          account: this.CreateByAccount,
          alias: this.CreateByName,
          avatar: this.CreateByPhoto
        })
      },
      goUrl(path, obj, name) {
        this.$router.push({
          path: path,
          query: {
            id: obj.HotelId,
            blank: "y",
            tab: name
          }
        });
      },
      goUrlR(path, obj, title) {
        this.$router.push({
          name: path,
          query: {
            "ID": obj,
            blank: 'y',
            tab: title
          }
        })
      },
      goUrlT(path, obj, title) {
        this.$router.push({
          name: path,
          query: {
            "id": obj,
            blank: 'y',
            tab: title
          }
        })
      },
      getList() {
        this.loading = true;
        this.apipost('dmcstatistics_get_GetHotelStaticsDetail_V2', {
          TCIDs: this.$route.query.id,
          NewCombinationNum: this.$route.query.NewCombinationNum
        }, res => {
          if (res.data.resultCode == 1) {
            this.IsOperation = res.data.data.IsOperation;
            this.IsEditHotel = res.data.data.IsEditHotel;
            let list = res.data.data.HotelOrderListReport;
            this.CreateBy = res.data.data.CreateBy;
            this.CreateByPhoto = res.data.data.CreateByPhoto;
            this.CreateByAccount = res.data.data.CreateByAccount;
            if (list != null && list.length > 0) {
              list.forEach(item => {
                item.HotelOrderList.forEach(subItem => {
                  subItem.hotelList.push({
                    Name: subItem.NewHotelName,
                    ID: subItem.NewHotelId
                  });
                  this.calculationPrice(subItem);
                  subItem.OrderDetailsList.forEach((x, index1) => {
                    x.HouseTypeCount = x.HouseTypeCount.toString();
                    x.UnitPrice = x.UnitPrice.toString();
                    x.HotelDiscount = x.HotelDiscount.toString();
                  })
                  if (subItem.ReserveNo == '' || subItem.ReserveNo == null) {
                    subItem.ReserveNo = this.$route.query.NewCombinationNum;
                  }
                  subItem.isShowPop = false;
                  subItem.ckedHotelName = "";
                })
              });
              this.list = list;
              this.$forceUpdate();
            }
          } else {
            this.$message.error(res.data.message);
          }
          this.loading = false
        }, err => {})
      },
      calculationPrice(obj) {
        let totalPrice = 0;
        obj.OrderDetailsList.forEach(item => {
          //税别
          if (obj.TaxType == 2) {
            totalPrice += item.UnitPrice * (item.BookNum - item.HotelDiscount) * (1 + 0.08 - item.RebateRatio /
              100);
          } else {
            totalPrice += item.UnitPrice * (item.BookNum - item.HotelDiscount) * (1 - item.RebateRatio / 100);
          }
        })
        obj.TotalPrice = totalPrice.toFixed(2);
        this.$forceUpdate();
      },
      getHotelList(obj) {
        this.apipost('hotel_post_GetHasStockHotelList', {
          //1-只查询有库存的酒店
          IsMoreThanZero: 0,
          Country: "651",
          IsAllHotel: 1,
          sDate: obj.CheckInDateStr
        }, res => {
          if (res.data.resultCode == 1) {
            obj.hotelList = res.data.data;
          } else {
            this.$message.error(res.data.message);
          }
        }, err => {})
      },
      sendValue(obj) {
        if (obj.hotelList.length > 0) {
          let ckedObj = obj.hotelList.find(item => item.ID == obj.NewHotelId);
          obj.Address = ckedObj.Address;
          obj.Tel = ckedObj.Tel;
          obj.NewHotelName = ckedObj.Name;
          obj.PayStyle = ckedObj.PayStyle;
          obj.PayStyleExt = ckedObj.PayStyle;
        } else {
          obj.Address = '';
          obj.Tel = '';
        }
      },
      saveList(type) {
        if (type == 0) {
          this.list.forEach(item => {
            item.HotelOrderList.forEach(subItem => {
              subItem.HotelOrderState = 0;
            });
          })
        }
        if (type == 1) {
          this.list.forEach(item => {
            item.HotelOrderList.forEach(subItem => {
              subItem.HotelOrderState = 1;
            });
          })
        }
        this.list.forEach(item => {
          item.HotelOrderList.forEach(subItem => {
            subItem.OrderDetailsList.forEach(y => {
              if (y.HouseTypeCount) {
                y.HouseTypeCount = parseFloat(y.HouseTypeCount);
              } else {
                y.HouseTypeCount = 0;
              }
              if (y.UnitPrice) {
                y.UnitPrice = parseInt(y.UnitPrice);
              } else {
                y.UnitPrice = 0;
              }
              if (y.HotelDiscount) {
                y.HotelDiscount = parseInt(y.HotelDiscount);
              } else {
                y.HotelDiscount = 0;
              }
              if (y.BookNum == "") {
                y.BookNum = 0;
              }
              if (y.RebateRatio == "") {
                y.RebateRatio = 0;
              }
            })
          });
        })
        this.loading = true;
        this.apipost('dmcstatistics_get_SetHotelOrder', this.list, res => {
          this.loading = false;
          if (res.data.resultCode == 1) {
            this.getList();
            this.Success(res.data.message);
          } else {
            this.Error(res.data.message);
          }
        }, err => {})
      },
      //单条保存
      SaveSingle(item) {
        item.HotelOrderState = 1;
        this.list.forEach(item => {
          item.HotelOrderList.forEach(subItem => {
            subItem.OrderDetailsList.forEach(y => {
              if (y.HouseTypeCount) {
                y.HouseTypeCount = parseFloat(y.HouseTypeCount);
              } else {
                y.HouseTypeCount = 0;
              }

              if (y.UnitPrice) {
                y.UnitPrice = parseInt(y.UnitPrice);
              } else {
                y.UnitPrice = 0;
              }
              if (y.HotelDiscount) {
                y.HotelDiscount = parseInt(y.HotelDiscount);
              } else {
                y.HotelDiscount = 0;
              }
              if (y.BookNum == "") {
                y.BookNum = 0;
              }
              if (y.RebateRatio == "") {
                y.RebateRatio = 0;
              }
            })
          });
        })
        let mag = {
          TotalList: this.list,
          SingleItem: item
        };
        this.apipost('dmcstatistics_get_SetHotelOrder', this.list, res => {
          if (res.data.resultCode == 1) {
            this.Success(res.data.message);
            this.getList();
          } else {
            this.Error(res.data.message);
          }
        }, err => {})
      },
      //合同上传
      uploadFileBtn(file) {
        if (file.file.size > 1024 * 1024 * 100) {
          this.$message.warning("文件大小不能超过100M！");
          return;
        }
        let newArr = [];
        newArr.push(file.file);
        let path = "/Upload/DMC/";
        this.$message.info("上传中...");
        this.UploadSelfFileT(path, newArr, x => {
          var fileUrl = this.domainManager().ViittoFileUrl + x.data.FilePath;
          this.ClickItem.ContractUrlArray.push(fileUrl);
          var str = "";
          this.ClickItem.ContractUrlArray.forEach(subItem => {
            str += subItem + ",";
          })
          this.ClickItem.ContractUrl = str != "" ? str.substring(0, str.length - 1) : str;
        });
      },
      // 获取供应商
      initSupplier() {
        this.apipost("supplier_post_GetAllList", {
          Type: 1,
          Country: 651
        }, res => {
          if (res.data.resultCode === 1) {
            this.SupplierList = res.data.data;
          }
        }, err => {});
      },
    },
    mounted() {
      this.TCNUM = this.$route.query.TCNUM;
      this.flightTotal = this.$route.query.flightTotal;
      this.GuestNum = this.$route.query.GuestNum;
      let width = window.innerWidth - 50;
      let height = window.innerHeight - 65 - 55;
      this.boxHeight = height;
      this.offsetwidth = width;
      this.initSupplier();
      this.getList();
    }
  }

</script>
<style>
  .roomReservationsDetailsTalbe {
    border-collapse: collapse;
    background: #fff;
    text-align: center;
  }

  .roomReservationsDetailsTalbe .el-button+.el-button {
    margin: 5px auto !important;
  }

  .roomReservationsDetailsTalbe tr th {
    background: #eee;
    height: 40px;
    font-size: 12px;
    color: #333;
    border: 1px solid #d1d1d1;
  }

  .roomReservationsDetailsTalbe tr td {
    font-size: 12px;
    border: 1px solid #d1d1d1;
  }

  .roomReservationsDetailsTalbe .pHouseStyle {
    border-bottom: 1px solid #ccc;
    height: 28px;
    line-height: 28px;
  }

  .roomReservationsDetailsTalbe tr td .colorRed {
    color: #E95252;
  }

  .roomReservationsDetailsTalbe tr td .pHouseStyle:last-child {
    border-bottom: none;
  }

  .roomReservationsDetailsTalbe tr td input {
    height: 20px !important;
    padding: 0 !important;
    text-align: center;
  }

  .roomReservationsDetailsTalbe tr td .sel input {
    height: 34px !important;
    padding-right: 20px !important;
    padding-left: 5px !important;
    font-size: 12px !important;
  }

  .roomReservationsDetailsTalbe tr td .link:hover {
    text-decoration: underline;
    cursor: pointer;
  }

  .roomReservationsDetailsTalbe .Hotel_red {
    color: red;
  }




  .roomReservationsDetailsTalbe .hotelTable {
    border: none;
  }

  .roomReservationsDetailsTalbe .hotelTable tr td {
    border: none;
  }

</style>