<style>
.hot{
  position: relative;
  height: 466px;
  background: #ffffff url(../../../assets/img/groupTour/hot_bg.png) no-repeat 0 100%/100% auto;
}
.hot .box{
  position: relative;
  width: 1180px;
  margin: 50px auto 0 auto;
  height: 360px;
}
.hot .box img{
  width: 595px;
  height: 351px;
  padding-left: 35px;
  position: relative;
  z-index: 2;
}
.hot .box>div{
  width: 464px;
  padding: 51px 69px 68px 84px;
  background-color: #FFFFFF;
  position: absolute;
  right: 0;
  bottom: 0;
}
.hot .box div .tit{
  color: #444444;
  font-size: 20px;
}
.hot .box div .s_tit{
  color: #999999;
  font-size: 12px;
}
.hot .box div .info{
  margin-top: 24px;
  color: #999999;
  font-size: 14px;
}
.hot .box div .see_detai span{
  display: inline-block;
  width:163px;
  height:41px;
  border:1px solid rgba(153,153,153,1);
  margin-top: 32px;
  color: #999999;
  text-align: center;
  line-height: 41px;
}
</style>
<template>
  <el-row class="hot" v-if="data[0]">
    <div class="box">
      <img src="../../../assets/img/groupTour/hot_img.png" alt="">
      <div>
        <p class="tit" :title="data[0].title">{{data[0].lineName}}-{{data[0].ltName}}</p>
        <p class="s_tit">{{'Japan Tour'.toUpperCase()}}</p>
        <p class="info">
          {{data[0].title}}
        </p>
        <div class="see_detai">
          <span class="__cp" @click="goUrl(data[0].id, data[0])">查看详情</span>
        </div>
      </div>
    </div>
  </el-row>
</template>

<script>
export default {
  props: ['data'],
  data () {
    return {

    }
  },
  methods: {
    goUrl(id, obj){
      let path = 'detailTwo'
      path=`${path}/${encodeURIComponent(id)}/${obj.tcid}`;
      this.$router.push({ path })
    },
  },
  mounted () {

  }
}
</script>