<style>
  .RegistrationStatistic .Rs_LtName{
    text-align:left;
    padding-left:20px;
  } 
  .RegistrationStatistic .RS_Nameover{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    /*! autoprefixer: off */
    -webkit-box-orient: vertical;
    /* text-decoration: underline; */
    cursor: pointer;
    /* autoprefixer: on */
    text-align: left;
  }
  .RegistrationStatistic .singeRowTable{
    border-collapse:collapse;
  }
  .RegistrationStatistic .singeRowTable tr td{
    border:1px solid #E5E5E5;
  }
  .RegistrationStatistic .Rs_Start1{background-color: #FF6670;color:#fff;}
  .RegistrationStatistic .Rs_Start2{background-color: #16E09D;color:#fff;}
  .RegistrationStatistic .Rs_Start3{background-color: #FF8547;color:#fff;}
  .RegistrationStatistic .Rs_Start4{background-color: #FF528B;color:#fff;}
  .RegistrationStatistic .Rs_Start5{background-color: #FFAB1E;color:#fff;}
  .RegistrationStatistic .Rs_Start6{background-color: #7CCC4E;color:#fff;}
  .RegistrationStatistic .Rs_Start7{background-color: #B47DF0;color:#fff;}
  .RegistrationStatistic .Rs_Start8{background-color: #00C8F5;color:#fff;}
  .RegistrationStatistic .Rs_Start9{background-color: #7598FF;color:#fff;}
  .RegistrationStatistic .Rs_Start10{background-color: #DBC500;color:#fff;}
  .RegistrationStatistic .Rs_Start11{background-color: #7598FF;color:#fff;}
  .RegistrationStatistic .Rs_Start12{background-color: #00D9C3;color:#fff;}
  .RegistrationStatistic .Rs_Start13{background-color: #40AFFF;color:#fff;}
  .RegistrationStatistic .RS_RedType{color:#FF0000;}
  .RegistrationStatistic .Order_RS{text-decoration: underline;cursor: pointer; }
</style>
<template>
  <div class="flexOne RegistrationStatistic">
    <div class="query-box">
      <ul>
        <li>
          <span>
            <em>公司</em>
            <el-select class="w150" filterable placeholder="公司" v-model="queryMsg.OutBranchId">
              <el-option :label="$t('pub.unlimitedSel')" :value='queryCommonData.SelectDefaultValue2'></el-option>
              <el-option v-for='item in queryCommonData.BranchList' :key="item.Id" :label="item.BName" :value="item.Id">
              </el-option>
            </el-select>
          </span>
        </li>
        <li>
          <span>
            <em>线路</em>
            <el-select class='w150' v-model="queryMsg.LineID" filterable :placeholder="$t('pub.pleaseSel')" @change="getLineTeamList()">
              <el-option :label="$t('pub.unlimitedSel')" :value='queryCommonData.SelectDefaultValue'></el-option>
              <el-option v-for="item in queryCommonData.LineList" :label='item.LineName' :value='item.LineID' :key='item.LineID'>
              </el-option>
            </el-select>
          </span>
        </li>
        <li>
          <span>
            <em>系列</em>
            <el-select class='w150' v-model="queryMsg.ltID" filterable :placeholder="$t('pub.pleaseSel')">
              <el-option :label="$t('pub.unlimitedSel')" :value='queryCommonData.SelectDefaultValue'></el-option>
              <el-option v-for="item in queryCommonData.LineTeamList" :label='item.LtName' :value='item.LtID' :key='item.LtID'>
              </el-option>
            </el-select>
          </span>
        </li>
        <li>
          <span>
            <em>团期</em>
            <el-date-picker class="w150" type="date" value-format="yyyy-MM-dd" placeholder="" v-model="queryMsg.QStartDate">
            </el-date-picker>
            <el-date-picker class="w150" type="date" value-format="yyyy-MM-dd" placeholder="" v-model="queryMsg.QEndDate">
            </el-date-picker>
          </span>
        </li>
        <li>
          <input type="button" class="hollowFixedBtn" value="查询" @click="getList()" /> &nbsp;
          <button class="hollowFixedBtn"  @click="DownLoadFile()">下载</button>
        </li>
      </ul>
    </div>
    <table class="singeRowTable" border="0" cellspacing="0" cellpadding="0" v-loading='queryCommonData.loading'>
      <tr>
        <th width="50">序</th>
        <th width="80">出团</th>
        <th width="80">团期</th>
        <th width="80">进出点</th>
        <th width="100">抵离时间</th>
        <th width="50">价格</th>
        <th width="100">机位</th>
        <th width="80">报名</th>
        <th width="80">收订人数</th>
        <th width="100">领队</th>
        <th width="100">导游</th>
        <th>备注</th>
      </tr>
      <tbody v-for="item in DataList">
       <tr>
          <td rowspan="2">{{item.Num}}</td>
          <td :class="{'Rs_Start1':item.StartCityNum==1,'Rs_Start2':item.StartCityNum==2,'Rs_Start3':item.StartCityNum==3,
          'Rs_Start4':item.StartCityNum==4,'Rs_Start5':item.StartCityNum==5,'Rs_Start6':item.StartCityNum==6,
          'Rs_Start7':item.StartCityNum==7,'Rs_Start8':item.StartCityNum==8,'Rs_Start9':item.StartCityNum==9,
          'Rs_Start10':item.StartCityNum==10,'Rs_Start11':item.StartCityNum==11,'Rs_Start12':item.StartCityNum==12,'Rs_Start13':item.StartCityNum==13}">{{item.StartCityName}}</td>
          <td>{{item.StartDateStr}}</td>
          <td>{{item.InOut}}</td>
          <td>{{item.InOutTime}}</td>
          <td>{{item.B2CMemberPrice}}</td>
          <td>{{item.TotalSeat}}</td>
          <td>
              <span class="Order_RS" :class="{'RS_RedType':item.OrderTotalNum>0}"  @click="goUrl('团报名清单','groupTourOrderByTuan',item.TCID,item.TCNUM)">{{item.OrderTotalNum-item.OrderLeaderGuestNum}}<span v-if="item.OrderLeaderGuestNum>0">+{{item.OrderLeaderGuestNum}}</span></span>
          </td>
          <td><span class="Order_RS"  @click="goUrl('团报名清单','groupTourOrderByTuan',item.TCID,item.TCNUM)">{{item.OrderPaymentNum}}</span></td>
          <td><span class="PingFangSC">{{item.LeaderName}}</span></td>
          <td><span class="RS_RedType PingFangSC">{{item.GuideName}}</span></td>
          <td><span class="RS_Nameover">{{item.OPRemark}}</span></td>
      </tr>
      <tr>
        <td colspan="12">
           <span class="RS_Nameover" @click="goUrlTM('productQuery',item.TCNUM)">团名: {{item.Title}}</span>
        </td>
      </tr>
      </tbody>
    </table>
  </div>
</template>
<script>
export default {
  data() {
    return {
      queryCommonData: {
        //线路列表
        LineList: [],
        //系列列表
        LineTeamList: [],
        //公司数据
        BranchList: [],
        //公用下拉默认
        SelectDefaultValue: 0,
        //公用下拉默认
        SelectDefaultValue2: -1,
        //loading
        loading: false
      },
      queryMsg: {
        pageIndex: 1,
        pageSize: 15,
        LineID: 0,
        ltID: 0,
        OutBranchId: -1,
        QStartDate: "",
        QEndDate: ""
      },
      //数据列表
      DataList: []
    };
  },
  methods: {
    //初始化公司
    getCompanyList() {
      let userInfo = this.getLocalStorage();
      var RB_Group_id = userInfo.RB_Group_id;
      let msg = {
        Status: 0,
        is_show: 0,
        RB_Group_Id: RB_Group_id
      };
      this.apipost(
        "admin_get_BranchGetList",
        msg,
        res => {
          if (res.data.resultCode == 1) {
            this.queryCommonData.BranchList = res.data.data;
          }
        },
        err => {}
      );
    },
    //获取线路列表
    getLineList() {
      this.apipost("line_post_GetAllList", {}, res => {
        if (res.data.resultCode == 1) {
          this.queryCommonData.LineList = res.data.data;
        }
      });
    },
    //获取系列列表
    getLineTeamList() {
      this.queryMsg.LineteamId = 0;
      let msg = {
        lineID: this.queryMsg.LineId,
        isTOOP: 1
      };
      this.apipost("team_post_GetList", msg, res => {
        if (res.data.resultCode == 1) {
          this.queryCommonData.LineTeamList = res.data.data;
        }
      });
    },
    getList() {
      this.queryCommonData.loading = true;
      this.apipost(
        "travel_get_TravelPriceOrderStatistics",
        this.queryMsg,
        res => {
          this.queryCommonData.loading = false;
          if (res.data.resultCode == 1) {
            this.DataList = res.data.data;
            
            this.DataList.forEach(item=>{
              switch(item.StartCityName){
                 case '成都':
                    item.StartCityNum = 1
                    break ;
                 case '昆明':
                    item.StartCityNum = 2
                    break ;
                 case '重庆':
                    item.StartCityNum = 3
                    break ;
                 case '西安':
                    item.StartCityNum = 4
                    break ;
                 case '武汉':
                    item.StartCityNum = 5
                    break ;
                 case '贵阳':
                    item.StartCityNum = 6
                    break ;
                 case '南昌':
                    item.StartCityNum = 7
                    break ;
                 case '兰州':
                    item.StartCityNum = 8
                    break ;
                 case '票务':
                    item.StartCityNum = 9
                    break ;
                 case '长沙':
                    item.StartCityNum = 10
                    break ;
                 case '微途':
                    item.StartCityNum = 11
                    break ;
                 case '厦门':
                    item.StartCityNum = 12
                    break ;
                 case '南京':
                    item.StartCityNum = 13
                    break ;
              }
            })
          }
        }
      );
    },
    DownLoadFile() {
      this.Info("正在下载文件...")
      this.GetLocalFile(
        "travel_get_DownTravelPriceOrderStatistics",
        this.queryMsg,
        "报名统计.xls"
      );
    },
    goUrl(name, path, id, tcmun) {
      this.$router.push({name: path, query: {id: id, tcmun: tcmun, blank: 'y', tab: name}});
    },
    goUrlTM(path, TCNUM) {
        this.$router.push({name: path, query: {id: TCNUM, blank: 'y', tab: '产品查询'}});
    },
  },
  mounted() {
    let nowDate = new Date().Format('yyyy-MM-dd')
    this.queryMsg.QStartDate = nowDate
    this.queryMsg.QEndDate = nowDate
    this.getCompanyList();
    this.getLineList();
    this.getList();
  }
};
</script>