<style>
@import "../../assets/css/newTravelManager.css";
.RL_topList {
  width: 100%;
  font-size: 14px;
  margin: 20px 0 10px 0;
}
.RL_rightBtn {
  float: right;
  text-align: right;
  margin-top: 10px;
}
.RL_Tbheader {
  display: inline-block;
  width: 30px;
  height: 30px;
  border-radius: 50%;
}
.RL_Tbheader img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.RL_TbPeopleName {
  position: relative;
  top: -10px;
}
.RL_teamMoney {
  color: #000000;
  font-weight: bold;
  cursor: pointer;
  text-decoration: underline;
}
.RL_COMSpan {
  display: inline-block;
  width: 25px;
  height: 25px;
  text-align: center;
  line-height: 25px;
  color: #fff;
  margin-right: 10px;
  border-radius: 50%;
  cursor: pointer;
}
.RL_Update {
  background-color: #409eff;
}
.RL_Cancel {
  background-color: #f56c6c;
}
.RL_Nuo {
  background-color: #47bf8c;
}
.RL_RI {
  background-color: #9cf;
}
.RegisPop table th {
  background-color: #ededed;
  padding: 9px 15px;
}
.RegisPop table td {
  padding: 9px 15px;
}
.RegisPop ._color_666 {
  color: #666666;
}
.RL_orderNum {
  color: #333333;
  text-decoration: underline;
  cursor: pointer;
  font-weight: bold;
}
.RL_canClick {
  text-decoration: underline;
  cursor: pointer;
  color: #000000;
}
.RL_PriceDetail {
  text-decoration: underline;
  cursor: pointer;
  color: #e95252;
}
.RL_ticheng {
  color: #e95252;
}
.RL_teamMoney {
  font-size: 14px;
}
.RL_leftTitle {
  float: left;
  min-width: 334px;
  height: 34px;
  background-color: #d4d4d4;
  border-radius: 4px;
  padding: 8px;
}
.RL_Title {
  display: inline-block;
  font-size: 14px;
  color: #333333;
}
.RL_CompanyName {
  display: inline-block;
  padding: 3px 8px;
  background-color: #297bef;
  border-radius: 4px;
  color: #fff;
  float: right;
  margin: -3px 10px 0 10px;
}
.RL_LeaderContent {
  float: left;
  margin: -10px 0 0 25px;
}
.RL_LeaderList {
  float: left;
  width: 110px;
  height: 56px;
  background-color: #fff;
  border: 4px solid #eeeeee;
  border-radius: 4px;
  margin-right: 20px;
}
.RL_leftImg {
  float: left;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  margin: 6px 10px;
}
.RL_leftImg img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.RL_rightName {
  float: left;
  font-size: 12px;
  color: #333333;
}
.RL_rightName div:first-child {
  margin: 5px 0;
}
.RL_rightName div:last-child {
  font-weight: bold;
}
.RL_zanwu {
  text-align: center;
  color: #666666;
  font-size: 12px;
}
.departListDiv {
  font-size: 12px;
}
.RL_zanwu div:first-child {
  margin: 5px 0;
}
.RegisPop table {
  border: 1px solid #d1d1d1;
  border-collapse: collapse;
}
.RegisPop td {
  border: 1px solid #d1d1d1;
}
.RL_PeopleList {
  width: 100%;
}
.RL_PeopleList span {
  display: inline-block;
  margin: 10px 20px 10px 15px;
}
.departListDiv .el-popover {
  padding: 0;
}

.productQuerybottomLayer {
  overflow: auto;
  position: absolute;
  /* max-height: 300px; */
  z-index: 50;
  bottom: 0;
  left: 0;
  border-top: 1px solid #d1d1d1;
  background-color: #ffffff;
  padding: 20px 20px 0;
  width: 100%;
}
.productQuerybottomLayer .el-form-item__label {
  font-size: 12px !important;
}
.productQuerybottomLayer > p {
  border-left: 3px solid #e95252;
  text-indent: 15px;
  height: 14px;
  font-size: 14px;
  margin-bottom: 20px;
  line-height: 14px;
  color: #000;
}
.productQuerybottomLayer .el-input-number {
  width: auto !important;
}
.CO_pop table{font-size:12px; border-collapse:collapse;  border: 1px solid #d2d2d2;}
.CO_pop table th{background-color: #ededed;padding:9px 15px;}
.CO_pop table td{background-color: #ffffff;padding: 9px 15px;color: #333333;border: 1px solid #d2d2d2;}
.CO_guidInfo{text-decoration: underline;cursor: pointer;font-weight: bold;}
</style>
<template>
  <div>
    <!-- <div class="RL_topList clearfix">
      <div class="RL_leftTitle">
        <span class="RL_Title">{{ConfigData.Config.LtName}} {{ConfigData.Config.TCNUM}}</span>
        <span class="RL_CompanyName" v-if="ConfigData.Config.OutBranchName">{{ConfigData.Config.OutBranchName}}</span>
      </div>
      <div class="RL_LeaderContent clearfix">
        <div class="RL_LeaderList clearfix" v-if="ConfigData.Leader!=null">
          <div class="RL_leftImg">
            <img src="../../assets/img/bg_c3@3x.png">
          </div>
          <div class="RL_rightName">
            <div>
              <span v-if="ConfigData.Leader.LeaderName!=''">
                {{ConfigData.Leader.LeaderName}}
              </span>
              <span v-else>
                {{ConfigData.Leader.GuideName}}
              </span>
            </div>
            <div>{{ConfigData.Leader.LeaderTypeStr}}</div>
          </div>
        </div>
        <div v-else class="RL_LeaderList RL_zanwu">
          <div>暂未安排</div>
          <div>领队导游</div>
        </div>
      </div>
      <div class="RL_rightBtn">
        <input type="button" class="normalBtn" @click="goUrl('passengerList',queryData.TCID)" value="旅客名单" />
      </div>
    </div> -->
    <div>
      <table class="singeRowTable" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <th>订单编号</th>
          <th>旅客数</th>
          <th>业务员</th>
          <th>联系电话</th>
          <th>旅客信息</th>
          <th>是否收订</th>
          <th>去程城市名称</th>
          <th>回程城市名称</th>
        </tr>
        <tr v-for="item in dataList" :key="item.subCode">
            <td>{{item.OrderId}}</td>
            <td>{{item.GuestNum}}</td>
            <td>{{item.CreateBy}}</td>
            <td>{{item.Phone}}</td>
            <td>
                <el-popover
                      popper-class="CO_pop"
                      width="700"
                      trigger="click">
                      <div class="priceContentDiv">
                          <table width="100%" border="0" cellspacing="0" cellpadding="0">
                              <tr>
                                <th>姓名</th>
                                <th>英文姓</th>
                                <th>英文名</th>
                                <th>性别</th>
                                <th>生日</th>
                                <th>护照</th>
                                <th>有效期</th>
                                <th>手机号码</th>
                              </tr>
                              <tr v-for="subItem in item.GuestList">
                                <td>{{subItem.Name}}</td>
                                <td>{{subItem.ESurName}}</td>
                                <td>{{subItem.EName}}</td>
                                <td>{{subItem.Sex}}</td>
                                <td>{{subItem.Birthday}}</td>
                                <td>{{subItem.PassportNo}}</td>
                                <td>{{subItem.PassportExpiry}}</td>
                                <td>{{subItem.MobilePhone}}</td>
                              </tr>
                          </table>
                      </div>
                      <span class="CO_guidInfo" slot="reference">旅客信息</span>
                </el-popover> 
            </td>
            <td>{{item.IsIncome==1?'是':'否'}}</td>
            <td>{{item.DepartureCityName}}</td>
            <td>{{item.ReturnArriveCityName}}</td>
        </tr>
      </table>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      dataList: "",
      loading: true,
      TickedId: "",
      tcidList: []
    };
  },
  methods: {
    //初始化列表
    getList() {
      let msg = {
        ticds: this.TickedId,
        city: 0
      };
      this.apipost("sellorder_post_GetCityByTICDAndCity", msg, res => {
        if (res.data.resultCode == 1) {
          this.dataList = res.data.data;
        }
      });
    }
  },
  mounted() {
    this.TickedId = this.$route.query.id;
    this.getList();
  }
};
</script>