<style>
  .SupplierTable td {
    padding: 0 5px;
    text-align: center !important;
  }

  .SupplierTable .linkStr {
    color: blue;
    text-decoration: underline;
    cursor: pointer;
  }

</style>
<template>
  <div class="flexOne SupplierHandeFee">
    <div class="query-box">
      <ul class="user_time_picker">
        <li>
          <span>
            <em>{{$t('ground.yuefen')}}</em>
            <el-date-picker v-model="msg.QMonthStr" type="month" value-format="yyyy-MM"
              :placeholder="$t('ground.xuanzenian')">
            </el-date-picker>
          </span>
        </li>
        <li>
          <span>
            <em>{{$t('hotel.hotel_Supplier')}}</em>
            <el-select filterable v-model="msg.Supplier">
              <el-option :label="$t('system.ph_buxian')" :value="0"></el-option>
              <el-option v-for="(item,index) in SupplierList" :key="index" :label="item.Name" :value="item.ID">
              </el-option>
            </el-select>
          </span>
        </li>
        <li>
          <span>
            <em>{{$t('objFill.v101.hote.tuanzhuant')}}</em>
            <el-select v-model="msg.IsSetOut">
              <el-option :label="$t('objFill.zhengchangft')" :value="0"></el-option>
              <el-option :label="$t('objFill.quxiaofatuan')" :value="1"></el-option>
            </el-select>
          </span>
        </li>
        <li>
          <input type="button" class="hollowFixedBtn" :value="$t('pub.searchBtn')" @click="getSearch()"> &nbsp;
          <input type="button" class="normalBtn" :value="$t('objFill.xz')" @click="DownLoadFile()">
        </li>
      </ul>
    </div>
    <div class="clearfix"></div>
    <table class="singeRowTable SupplierTable" border="0" cellspacing="0" cellpadding="0" v-loading="loading">
      <tr>
        <th width="130">{{$t('objFill.v101.hote.zuozhangzt')}}</th>
        <th width="180">{{$t('visa.v_tuanhao')}}</th>
        <th width="150">{{$t('objFill.v101.hote.shoupeidth')}}</th>
        <th width="80">{{$t('objFill.v101.traveltrip.dindanrs')}}</th>
        <th width="100">{{$t('objFill.v101.hote.danjiary')}}</th>
        <th width="300">{{$t('objFill.v101.hote.boshurq')}}</th>
        <th width="120">{{$t('objFill.v101.hote.xiaojiry')}}</th>
        <th width="100">{{$t('hotel.hotel_CurrentRate')}}</th>
        <th width="100">{{$t('objFill.v101.hote.xiaojirmb')}}</th>
        <th width="150">{{$t('fnc.danhao')}}</th>
        <th width="80">{{$t('ground.scdanju')}}</th>
      </tr>
      <tbody v-for="(item,index) in dataList" :key="index">
        <template v-for="(subItem,subIndex) in item.SubList">
          <tr :key="subIndex">
            <td>{{subItem.OutBranchName}}</td>
            <td><span class="linkStr" @click="gotoDmcTable(subItem)"> {{subItem.TCNUM}}({{subItem.TCID}})
              </span>
            </td>
            <td v-if="subIndex==0" :rowspan="item.SubList.length">
              <span class="linkStr" @click="gotoDmcTable(subItem)"> {{item.DMCNum}} </span>
            </td>
            <td>
              <span class="linkStr" @click="goUrlT(subItem)"> {{subItem.GuestNum}} </span>
            </td>
            <td>{{subItem.UnitPrice}}</td>
            <td style="text-align:left!important;">
              <span style="color:red;">{{subItem.DayCount}}{{$t('objFill.v101.hote.bo')}}</span>
              <br />
              {{subItem.UseTime}}
            </td>
            <td>{{subItem.SubtotalMoney}}</td>
            <td>
              <template v-if="subItem.Frids!=''">{{subItem.Rate}}</template>
            </td>
            <td>
              <template v-if="subItem.Frids!=''"> {{subItem.RMBMoney}}</template>
            </td>
            <td>
              <a v-if="subItem.Frids!=''" class="linkStr" @click="goFncUrl(subItem.Frids)">{{subItem.Frids}}</a>
            </td>
            <td v-if="subIndex==0" :rowspan="item.SubList.length">
              <el-tooltip class="item" effect="dark" :content="$t('ground.scdanju')" placement="top-start">
                <el-button type="success" icon="el-icon-check" circle @click="CreateSupplierBill(item)">
                </el-button>
              </el-tooltip>
            </td>
          </tr>
        </template>
      </tbody>
      <tfoot v-if="dataList.length>0">
        <tr>
          <td></td>
          <td></td>
          <td></td>
          <td></td>
          <td></td>
          <td></td>
          <td>
            <template v-if="totalJap>0">
              {{$t('fnc.a_heji')}}:{{totalJap}}
            </template>
          </td>
          <td></td>
          <td>
            <template v-if="rmbTotal>0">
              {{$t('fnc.a_heji')}}:{{rmbTotal}}
            </template>
          </td>
          <td></td>
          <td></td>
        </tr>
      </tfoot>
    </table>
    <div class="noDataNotice" v-if="dataList.length<1">
      <i class="iconfont icon-kong"></i>
      <p>{{$t("active.ld_noData")}}</p>
    </div>
    <el-pagination background @current-change="handleCurrentChange" v-if="dataList.length>0"
      :current-page.sync="currentPage" layout="total,prev, pager, next, jumper" :page-size="msg.PageSize"
      :total="total"></el-pagination>
  </div>
</template>
<script>
  export default {
    data() {
      return {
        userInfo: {}, //用户信息
        //请求
        msg: {
          QMonthStr: "",
          Supplier: 0,
          PageIndex: 1,
          PageSize: 15,
          IsSetOut: 0, //0-正常发团，1-取消发团
        },
        loading: false,
        currentPage: 1,
        total: 0,
        dataList: [],
        //供应商
        SupplierList: [],
        totalJap: 0,
        rmbTotal: 0
      }
    },
    mounted() {
      this.userInfo = this.getLocalStorage();
      this.initSupplier();
    },
    filters: {},
    methods: {
      goUrlT(item) {
        this.$router.push({
          name: "RegistrationList",
          query: {
            "id": item.TCID,
            blank: 'y',
            tab: "报名清单"
          }
        })
      },
      goFncUrl(frid) {
        this.$router.push({
          name: "FinancialDocumentsDetail",
          query: {
            id: frid,
            blank: "y",
            tab: '单据详情'
          }
        });
      },
      gotoDmcTable(item) {
        this.$router.push({
          name: "dmcTotalTable",
          query: {
            TCNUM: item.TCNUM,
            blank: "y",
            tab: "详情"
          }
        });
      },
      //生成手配费单据
      CreateSupplierBill(item) {
        var that = this;
        this.Confirm(that.$t('objFill.v101.hote.shifysccwdj'), function () {
          that.loading = true;
          that.apipost("dmcstatistics_get_CreateDmcSupplierHotelBillService", {
              TCID: item.TCIDS,
              Supplier: that.msg.Supplier,
              QMonthStr: that.msg.QMonthStr,
              IsSetOut: that.msg.IsSetOut,
            },
            res => {
              that.loading = false;
              if (res.data.resultCode == 1) {
                that.Success(this.$t('objFill.v101.hote.shenchengdjcg'));
                that.getList();
              } else {
                that.Error(res.data.data);
              }
            }, null);
        });
      },
      //报价单下载
      DownLoadFile() {
        if (this.msg.QMonthStr == '' || this.msg.QMonthStr == null) {
          this.Error(this.$t('objFill.v101.hote.qingxuanzyf'));
          return;
        }
        if (this.msg.Supplier == 0) {
          this.Error(this.$t('objFill.qingxuanzhegys'));
          return;
        }
        var SupplierName = ''
        this.SupplierList.forEach(x => {
          if (this.msg.Supplier == x.ID) {
            SupplierName = x.Name
          }
        })
        var fileName = SupplierName + this.msg.QMonthStr + ".xls";
        this.loading = true;
        this.GetLocalFile("dmc_get_DowmLoadDmcSupplierHote", this.msg, fileName, res => {
          this.loading = false;
        });
      },
      //点击查询
      getSearch() {
        if (this.msg.QMonthStr == '' || this.msg.QMonthStr == null) {
          this.Error(this.$t('objFill.v101.hote.qingxuanzyf'));
          return;
        }
        if (this.msg.Supplier == 0) {
          this.Error(this.$t('objFill.qingxuanzhegys'));
          return;
        }
        this.msg.PageIndex = 1;
        this.getList();
      },
      //获取数据
      getList() {
        this.loading = true;
        this.apipost(
          'dmcstatistics_get_GetDmcSupplierHotelPageListService', this.msg,
          res => {
            this.loading = false;
            if (res.data.resultCode == 1) {
              this.dataList = res.data.data.pageData;
              this.total = res.data.data.count;
              this.totalJap = 0;
              this.rmbTotal = 0;
              this.dataList.forEach(x => {
                x.SubList.forEach(y => {
                  this.totalJap += y.SubtotalMoney;
                  this.rmbTotal += y.RMBMoney;
                })
              })
            } else {
              this.Error(res.data.message);
            }
          },
          err => {}
        )
      },
      handleCurrentChange(val) {
        this.msg.PageIndex = val;
        this.getList();
      },
      // 获取供应商
      initSupplier() {
        var qCountry = 0;
        if (this.userInfo.RB_Group_id == 2) {
          qCountry = 651;
        }
        if (this.userInfo.RB_Group_id == 91) {
          qCountry = 1252;
        }
        this.apipost("supplier_post_GetAllList", {
          Type: 1,
          Country: qCountry, //日本供应商
        }, res => {
          if (res.data.resultCode === 1) {
            this.SupplierList = res.data.data;
          }
        }, err => {});
      },
    }
  };

</script>