<template>
  <div class="page_FProcessManagement">
    <ul class="_nav clearfix">
        <!-- <li style="color: red;">{{$t('objFill.v101.FinancialModule.zhumpbjrrtjl')}}</li> -->
        <!-- <input type="button" class="hollowFixedBtn" :value="$t('pub.addBtn')" @click="AddMsg"/> -->
        <input type="button" class="normalBtn" style="position: absolute; right: 90px;top: 9px;" :value="$t('pub.searchBtn')" @click="getList"/>
    </ul>
      <div
        class="cm_content"
        style="width: 100%;margin-bottom: 35px;margin-top: 90px;"
      >
        <div style="width:100%;overflow-x: auto;" v-for="(item,index ) in dataList " :key="index">
          <table
            class="po_content singeRowTable"
            style="border:1px solid #E6E6E6;"
            cellspacing="0"
            cellpadding="0"
          >

            <tr>
              <td rowspan="2" width="150" style="min-width: 150px;">{{item.BranchName}}</td>
              <td rowspan="2" width="150" style="min-width: 150px;">{{item.LineNameStr}}</td>

              <th style="min-width: 220px;" v-for="( son , sIndex ) in item.RuleList" :key="sIndex">
                <span v-if="item.Type==1">{{ son.StartValue }}{{son.EndValue&&son.EndValue!=-1?' ~ '+son.EndValue+'  '+$t('hotel.hotel_people'):' '+$t('objFill.v101.FinancialModule.renyishang')}}</span>
                <span v-else>{{ son.StartValue }}{{son.EndValue&&son.EndValue!=-1?' ~ '+son.EndValue+'  '+$t('hotel.hotel_yuan'):' '+$t('objFill.v101.FinancialModule.renyishang')}}</span>
              </th>
            </tr>
            <tr>
              <td style="min-width: 220px;" v-for="( son , sIndex ) in item.RuleList" :key="sIndex">{{ son.Rate }} {{$t('hotel.hotel_yuan')}}</td>
            </tr>
          </table>
        </div>

      </div>
      <div v-if="dataList.length==0"
        style="width: 100%;border:1px solid #E6E6E6;display: flex;align-items: center;justify-content: center;height: 60px;margin-top: 30px;"
      >{{$t('system.content_noData')}}</div>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        loading: false,
        dataList:[],
      }
    },
    created() {},
    mounted() {
      this.getList()
    },
    methods: {
      // 获取列表数据
      getList() {
        this.loading = true;
        this.apipost("sellorder_post_GetTravelLessPriceRuleList", {}, res => {
          this.loading = false;
          if (res.data.resultCode == 1) {
            this.dataList = res.data.data;

          }else{
            this.Error(res.data.message)
          }
        });
      },
    }
  }

</script>
<style scoped>
  .hollowFixedBtn{
    position: absolute;
    top: 9px;
    right: 20px;
  }
  ._nav li{float: left;font-size: 14px;color: #666666;padding: 15px 10px;background-color: #F1F1F1;cursor: pointer;position: relative;}
  ._nav li._active{background-color:#FFFFFF;color: #333333 }
  ._nav li._active::after{content: "";width: 20px;height: 3px;background-color: #E95252;display: inline-block;position: absolute;bottom: 0;left: 38%;}
  .ImpressionTicketing-OuterFrame{
    padding: 10px 20px 20px 20px;
    box-shadow: 0 1px 8px rgb(0 0 0 / 20%), 0 3px 4px rgb(0 0 0 / 14%), 0 3px 3px -2px rgb(0 0 0 / 12%);
  }
  .ImpressionTicketing-msgbox{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-bottom: 20px;
  }
  .ImpressionTicketing-msgbox.bottom0{
    margin-bottom: 0;
  }
  .ImpressionTicketing-msgbox div{
    flex: 1;
  }
  .ImpressionTicketing-msgbox div.ImpressionTicketing-msg-but{
    flex: 0 0 36px !important;
  }
  .itc-delete{
    color: #E95252;
    font-size: 16px;
    cursor: pointer;
    display: inline-block;
    padding: 10px;
  }
  .itc-outline{
    color: #409EFF;
    font-size: 16px;
    cursor: pointer;
    display: inline-block;
    padding: 10px;
  }
  .ImpressionTicketing-title{
    padding: 0;
  }
  .left-text-indent{
    text-align: left;
    text-indent: 20px
  }
  /deep/.el-input-number{
    width: inherit;
  }
  /deep/.el-input-number .el-input__inner{
    text-align: left;
    height: 34px;
  }
  .Impression-ratio-box{
    display: flex;
    justify-content: space-between;
  }
  .Impression-ratio-right{
    font-size: 13px;
    margin-left: 5px;
  }
  /deep/.line-heigh .el-input-number{
    line-height: 32px;
  }
  .ImpressionTicketing-msgbox.ImpressionTicketing-msgboxBC{
    flex-wrap: wrap;
  }
  .ImpressionTicketing-msgbox.ImpressionTicketing-msgboxBC div{
   flex: 0 0 220px;
  }
  .ImpressionTicketing-msgbox.ImpressionTicketing-msgboxBC div:last-child{
    flex: 0 0 auto;
  }
  .EmpGroupListBox{
    display: flex;flex-direction: row; flex-wrap: nowrap;
    justify-content: space-between;
    /* box-shadow: 0 1px 2px rgb(0 0 0 / 20%), 0 1px 4px rgb(0 0 0 / 14%), 0 1px 1px -1px rgb(0 0 0 / 12%); */
    margin-bottom: 5px;

  }
  .EmpGroupListBox:last-child{
    /* margin-bottom: 0; */
  }
  .EmpGroupListBox>div{
    flex: 0 0 220px;
  }
  .EmpGroupListBox>div:nth-child(2){
    /* margin-left: 50px; */
  }
  /deep/.EmpGroupListBox .el-form-item__content{
    /* width: 100%; */
  }
</style>