<style>

  .comCheckDinner .comCheckDinner {
    width: 100%;
    height: 150px;
    overflow: auto
  }

  .comCheckDinner .comCk_list {
    padding: 0 20px;
    margin: 0 15px 5px 0;
  }

  .comCheckDinner .cm_Inventory {
    margin-left: 20px;
    color: red;
    display: inline-block;
  }

  .comCheckDinner .cm_hotelTitle {
    width: 100%;
    text-align: center;
    margin-bottom: 20px;
    border-bottom: 1px solid #d1d1d1;
    padding: 0 20px 10px 20px;
  }

  .comCheckDinner .com_SaveBtn {
    margin: 10px 20px 0 45%;
  }

  .comCheckDinner .ckedList {
    background-color: #E95252;
    color: #fff;
  }
  .comCheckDinner .Ck_hotelInfo{
    width:100%;
    height:40px;
    background-color: #F6F8FB;
    text-align: center;
    line-height: 40px;
    margin-bottom:10px;
  }
  .comCheckDinner .ck_goUrl{
      color:blue;
      cursor: pointer;
      margin-left:10px;
  }
</style>

<template>
  <div class="comCheckDinner">
    <div class="Ck_hotelInfo">
      <span style="color:red">{{UseDate}}</span> 餐厅信息
    </div>
    <div class="cm_hotelTitle clearfix">
      <div style="float:left;">
        地区:
        <el-select filterable v-model="qMsg.ProvinceId" class="w120" :placeholder="$t('pub.pleaseSel')">
          <el-option label="不限" :value='0'></el-option>
          <el-option v-for="item in ProvinceList" :label='item.Name' :value='item.ID' :key='item.ID'>
          </el-option>
        </el-select>
      </div>
      <div style="float:left;margin-left:10px;">
        餐厅名称/电话:
        <el-input type="text" v-model="qMsg.Name" class="w120" @keyup.native.enter="getCheckDinner()" placeholder="餐厅名称或电话"></el-input>
        <input type="button" class="normalBtn" value="查询" @click="getCheckDinner()" />
      </div>
    </div>
    <div>
      <el-tabs type="border-card" v-loading="loading" v-if="IsShow" >
        <el-tab-pane :label="item.ProvinceName" v-for="(item,index) in dataList" :key="item.subCode">
          <div class="clearfix comCheckDinner">
              <div class="comCk_list" v-for="(subItem,subIndex) in item.DinnerList">
                <input :id="'H'+index+'_'+subIndex" type="checkbox" v-model="subItem.isChecked" @click="getDinner(item.DinnerList,subIndex)"/>
                <label :for="'H'+index+'_'+subIndex" style="cursor: pointer">{{subItem.RealName}}</label>
              </div>
          </div>
        </el-tab-pane>
      </el-tabs>
    </div>
    <input type="button" class="normalBtn com_SaveBtn" @click="sendCkedHotel()" value="保存" />
  </div>
</template>
<script>
  export default {
    props: ["UseDate","Country"],
    data() {
      return {
        loading:false,
        dataList: [],
        ProvinceList: [],
        qMsg:{
           ProvinceId: 0, //选择个省份编号
           Name:"",//酒店名称
        },
        IsShow:false,
        ckedDinner:{}
      };
    },
    methods: {
      getCheckDinner() {
        this.loading=true;
        this.IsShow=false;
        this.dataList = [];
        this.apipost('dining_post_GetDinnerList_V2Service', {
          //1-只查询有库存的酒店
          Country: this.Country,
          Province: this.qMsg.ProvinceId,
          Name:this.qMsg.Name,
          sDate: this.UseDate
        }, res => {
          this.loading=false;
          this.IsShow=true;
          if (res.data.resultCode == 1) {
            this.dataList = res.data.data;
            this.dataList.forEach(x => {
              x.DinnerList.forEach(y => {
                y.isChecked = false;
              })
            })
          } else {
            this.Error(res.data.message)
          }
        }, err => {})
      },
      getDinner(DinnerList, index) {
        DinnerList.forEach((x, subIndex) => {
          if (index == subIndex) {
            x.isChecked = !x.isChecked;
            this.ckedDinner = x;
          } else {
            x.isChecked = false;
          }
        })
        this.$forceUpdate();
      },
      //向父组件传递选中酒店
      sendCkedHotel() {
        var ckDinnerObj = {};
        if(this.ckedDinner){
            ckDinnerObj.ID = this.ckedDinner.ID;
            ckDinnerObj.Address = this.ckedDinner.Address;
            ckDinnerObj.Name = this.ckedDinner.Name;
            ckDinnerObj.RealName=this.ckedDinner.RealName;
            ckDinnerObj.PayStyle = this.ckedDinner.PayStyle;
            ckDinnerObj.Tel = this.ckedDinner.Tel;
            ckDinnerObj.RebateRatio=this.ckedDinner.RebateRatio;
            ckDinnerObj.RebateCount=this.ckedDinner.RebateCount;
        }
        this.$emit("childDinner", ckDinnerObj);
      },
      //获取日本下面的市->下拉框用
      getProvinceList() {
        let msg = {
          Id: this.Country
        };
        this.apipost("dict_post_Destination_GetChildList", msg, res => {
            if (res.data.resultCode == 1) {
              this.ProvinceList = res.data.data;
            } else {
              this.Error(res.data.message);
            }
          },
          err => {}
        );
      },
    },
    mounted() {
      this.getProvinceList();
    }
  };

</script>
