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

  .rq_importNote {
    color: red;
  }

  .rq_disImNote {
    color: #ea6d6d;
  }
  .hc_Table td{
      padding:5px;
      height:40px;
  }
</style>

<template>
  <div>
    <div style="width: 100%;  overflow-x: auto;padding-bottom: 10px; "
      class="ownScrollbarStyle" ref="ownScrollbarStyle">
      <table border="0" cellspacing="1" cellpadding="0" class="roomReservationsDetailsTalbe hc_Table" style="width:100%" v-loading="loading">
        <tr>
          <th width="15%">{{$t('hotel.table_CheckInDate')}}</th>
          <th>{{$t('hotel.hotel_name')}}</th>
          <th>{{$t('ground.xiugaijiudiangys')}}</th>
          <th width="15%">手配书</th>
        </tr>
        <template v-for="(item,index) in list">
            <tr v-for="(subItem,subIndex) in item.HotelOrderList">
              <td  >
                {{item.UseTimeStr}}
              </td>
              <!-- 酒店名称 -->
              <td>
                    <p class="link" style="word-break: normal;"
                    :class="{'Hotel_red':subItem.HotelChangeState==3}"
                    @click="goUrlR('HotelManagement',subItem.HotelId,'酒店管理')">{{subItem.HotelName}}</p>
              </td>
              <td>
                <div><span style="color:green">{{subItem.NewHotelName}}</span></div>
              </td>
              <td>
                <template v-if="subItem.ContractUrl!=''">
                    <span  style="color:green">已上传手配书</span>
                    &nbsp;&nbsp;<a v-if="subItem.ContractUrl" target="_blank" style="color:blue" :href="subItem.ContractUrl">查看</a>
                </template>
                <template v-else>
                    <span style="color:red">未上传</span>
                </template>
              </td>
            </tr>
        </template>
      </table>
      <div class="noDataNotice" v-if="list.length<1">
        <i class="iconfont icon-kong"></i>
        <p>{{$t('active.ld_noData')}}</p>
      </div>
    </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: '',
        hotelList: [],
        //创建人头像
        CreateByPhoto: '',
        //创建人联系电话
        CreateByAccount: '',
        //创建人姓名
        CreateByName: '',
        //点击项
        ClickItem: {},
        parentEle: '',
        loading: false,
        //合团的团期编号
        NewTCIDs: "",
        //供应商列表
        SupplierList: [],
        ckedHotelId: 0,
        ckedHotelName: '',
        showHotelList: false,
        findex: 0,
        childIndex: 0,
        //修改酒店价格,付款方式权限[0-不能修改,1-有权限修改]
        IsEditHotel: 1,
        //0-可以操作,1-已制单,不能操作
        IsOperation: 1,
        LeaderName: "", //领队名称
        GuideName: "", //导游名称
        IsEditHotelPeople: 1, //是否有修改人数权限[0-不能修改,1-可以修改]
        IsCombine: false, //是否是合团,true-是合团,false-不是合团
        allCurrencyList: [], //币种列表
        checkedIndex: '',
        checkedsubIndex: '',
      }
    },
    components: {
      comCheckHotel,
      commonHotelLog,
      commonPHInfo: commonPHlInfo
    },
    methods: {
      //付款方式切换
      PayChange(subItem) {
        if (subItem.PayStyle > 0) {
          subItem.DMCPayType = subItem.PayStyle;
        }
      },
      //调用子组件方法
      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 + this.$t('hotel.hotel_room');
                });
                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;
              //判断供应商编号是否大于0
              if (ckedObj.Supplier > 0) {
                this.list[this.findex].HotelOrderList[this.childIndex].SupplierId = ckedObj.Supplier;
              }
               this.list[this.findex].HotelOrderList[this.childIndex].OrderDetailsList.forEach((subItem,
                subIndex) => {
                //判断是否有库存价格
                if (subIndex == 1 && ckedObj.CostPrice > 0) {
                  subItem.IsHaveStockPrice = 1;
                } else {
                  subItem.IsHaveStockPrice = 0;
                }
                subItem.UnitPrice = ckedObj.CostPrice;
                subItem.RebateRatio = ckedObj.RebateRatio;
              });

              this.calculationPrice(this.list[this.findex].HotelOrderList[this.childIndex]);
            }
          } else {
            this.Error(this.$t('ground.qingqiucanscw'));
          }
        }, err => {})
      },
      getChildHotel(index, subIndex) {
        this.findex = index;
        this.childIndex = subIndex;
        let str = `comCheckHotel${index}${subIndex}`
        this.$refs[str][0].getCheckHotel();
      },
      //输入返佣自动前面4个房型赋值
      SetRebateRatio(subItem, newValue) {
        subItem.OrderDetailsList.forEach((sItem, sIndex) => {
          if (sIndex < 4) {
            sItem.RebateRatio = newValue;
          }
        });
      },
      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;
      },
      //添加酒店
      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(this.$t('sm.sfdeletenothf'), 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);
          }
        });
      },
      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 => {
          var fileUrl=this.domainManager()
            .ViittoFileUrl + x.data.FilePath;
          this.list[this.checkedIndex].HotelOrderList[this.checkedsubIndex].ContractUrl =  fileUrl;
          this.$forceUpdate()
        })
      },
      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,
          IsCombine: this.IsCombine,
          NewTCIDs: this.NewTCIDs
        }, res => {
          if (res.data.resultCode == 1) {
            this.IsOperation = res.data.data.IsOperation;
            this.IsEditHotel = res.data.data.IsEditHotel;
            this.IsEditHotelPeople = res.data.data.IsEditHotelPeople;
 
            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, sIndex) => {
                item.HotelOrderList.forEach(subItem => {
                  subItem.hotelList.push({
                    Name: subItem.NewHotelName,
                    ID: subItem.NewHotelId
                  });
                  //默认成日元
                  if (subItem.CurrencyId == 0) {
                    subItem.CurrencyId = 3;
                  }
                  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.SupplierList.forEach(x => {
                    if (x.ID == subItem.SupplierId) {
                      subItem.IsHaveShouPeiFee = x.IsHaveShouPeiFee;
                      subItem.ShouPeiMoney = x.ShouPeiMoney;
                    }
                  })
                })
              });
              this.list = list;
              this.$forceUpdate();
            }
          } else {
            this.Error(res.data.message);
          }
          this.loading = false
        }, err => {})
      },
      calculationPrice(obj) {
        let totalPrice = 0;
        //获取当前选中的对象
        let currentObj = {};
        if (obj.CurrencyId != 0) {
          currentObj = this.allCurrencyList.find(item => {
            return item.ID === obj.CurrencyId; //筛选出匹配数据
          });
        }

        //日元
        let jpaObj = this.allCurrencyList.find(item => {
          return item.ID === 3; //筛选出匹配数据
        });
        obj.OrderDetailsList.forEach((item, index) => {
          var tempPrice = 0;
          var coefficient = 1;
          //税别
          if (obj.TaxType == 2) {
            coefficient = 1 + 0.08;
          }
          if (index == 4 && obj.DMCPayType == 9) {
            tempPrice = 0;
          } else {
            tempPrice = item.UnitPrice * (item.BookNum - item.HotelDiscount) * (coefficient - item.RebateRatio /
              100);
          }
          totalPrice += tempPrice;
        })
        totalPrice += obj.ParkFee + obj.CityTax + obj.InTangTax;
        obj.TotalPrice = totalPrice.toFixed(2);
        if (currentObj && currentObj.ID > 0) {
          //人民币
          if (currentObj.ID == 1) {
            obj.NewTotalPrice = currentObj.Name + ":" + (totalPrice * jpaObj.PayRate).toFixed(2);
          }
          //日元
          else if (currentObj.ID == 3) {
            obj.NewTotalPrice = "";
          } else {
            if (currentObj.CurrentRate > 1) {
              obj.NewTotalPrice = currentObj.Name + ":" + ((totalPrice * jpaObj.PayRate) / currentObj.CurrentRate)
                .toFixed(2);
            } else {
              obj.NewTotalPrice = currentObj.Name + ":" + ((totalPrice * jpaObj.PayRate) * currentObj.CurrentRate)
                .toFixed(2);
            }
          }
        } else {
          obj.NewTotalPrice = "";
        }
        this.$forceUpdate();
      },
      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;
            });
          })
        }
        var flag=true;
        var isUpload=true;
        var str="";
        this.list.forEach(item => {
          item.HotelOrderList.forEach(subItem => {
            if(isUpload&&subItem.PayStyle==1&&subItem.ContractUrl==''){
               str+=`请上传${item.UseTimeStr}的手配书`
               isUpload=false;
            }
            subItem.OrderDetailsList.forEach((y, sIndex) => {
              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 (!this.$commonUtils.isNumber(y.RebateRatio)) {
                y.RebateRatio = 0;
              }
            })
            if (!this.$commonUtils.isNumber(subItem.TotalPrice)) {
              subItem.TotalPrice = 0;
            }
          });
        })
        if(!isUpload){
          this.Error(str);
          return;
        }
        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;
        var flag=true;
        var isUpload=true;
        var str="";
        this.list.forEach(item => {
          item.HotelOrderList.forEach(subItem => {
            if(isUpload&&subItem.PayStyle==1&&subItem.ContractUrl==''){
               str+=`请上传${item.UseTimeStr}的手配书`
               isUpload=false;
            }
            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 (!this.$commonUtils.isNumber(y.RebateRatio)) {
                y.RebateRatio = 0;
              }
            })
            if (!this.$commonUtils.isNumber(subItem.TotalPrice)) {
              subItem.TotalPrice = 0;
            }
          });
        })
        if(!isUpload){
          this.Error(str);
          return;
        }
        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 => {})
      },

      // 获取供应商
      initSupplier() {
        this.apipost("supplier_post_GetAllList", {
          Type: 1,
          Country: 651
        }, res => {
          if (res.data.resultCode === 1) {
            this.SupplierList = res.data.data;
          }
        }, err => {});
      },
      //改变id获取手配价格
      getSupplierShoupei(SubItem) {
        this.SupplierList.forEach(x => {
          if (x.ID == SubItem.SupplierId) {
            SubItem.IsHaveShouPeiFee = x.IsHaveShouPeiFee;
            SubItem.ShouPeiMoney = x.ShouPeiMoney;
          }
        })
      },
      //获取所有币种
      getAllCurrency() {
        this.apipost("financeinfo_post_GetList", {}, res => {
          if (res.data.resultCode === 1) {
            this.allCurrencyList = res.data.data;
          }
        }, err => {});
      }
    },
    mounted() {
      this.getAllCurrency();
 
      this.TCNUM = this.$route.query.TCNUM;
      this.NewTCIDs = this.$route.query.NewTCIDs;
      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>