sport_pc/.svn/pristine/65/6562ad49823e03dae2441b138928f82da53bd59c.svn-base

<template>
  <div class="BallDisc column">
    <div class="row allAlignment center box" style="background:#a0a0a0;" @click="jumpBallDisc">
      <span class="row center" style="font-size:.3rem;color:#fff; font-weight: bold;">{{titel}}</span>
      <div>
        <span class="mark row center">{{idx}}</span>
        <img src="../assets/st-imges/minRightArrow.png" alt>
      </div>
    </div>
    <div style=" padding: 0  0.3rem;">
      <!-- 足球 -->
    
        <BasketballBlock :type="st.type1"></BasketballBlock>
      
      <!-- 篮球 -->

        <BasketballBlock :type="st.type2"></BasketballBlock>
 
      <!-- 网球 -->

        <BasketballBlock :type="st.type3"></BasketballBlock>

      <!-- 棒球 -->
        <Tennis></Tennis>
    </div>
    <div v-if="noData">
      <NotOpend :title="this.info"/>
    </div>
    <!-- <Loading/> -->
  </div>
</template>
<script>
import "@/css/index.css";
import BasketballBlock from "@/components/StBasketballBlock";
import Loading from "@/components/StLoading";
import Tennis from "@/components/StTennis";
import NotOpend from "@/components/StNotOpend";
import Bus from "@/assets/bus.js";
export default {
  name: "BallDisc",
  data() {
    return {
      data: "",
      titel: "滚球盘",
      // index: 0,
      // 区分接口
      st: {
        type1: 1,//足球
        type2: 2,//篮球
        type3: 3,//棒球
      },
      noData: false,
      info: "暂无相关滚球赛事",
      zqCondition: false,
      bqCondition: false,
      wqCondition: false,
      lqCondition: false,
      idx: "",
      timers: true, // 定时器开关
      getIsShow:true,
    };
  },
  methods: {
    jumpBallDisc: function() {
      this.$store.dispatch("GETACTIVITY", "StRollBall");
      this.$router.push({
        path: "/StRollBallpage",
        query: { number: 0, home: true, hmsts: 1 }
      });
    },
    getNumber() {
      if (this.idx == 0) {
        this.noData = true;
      } else {
        this.noData = false;
      }
    },
    //获取首页滚球数据
    getAjax(){
      this.$http.get(this.$ports.home.getRollingBall).then(res => {
        if(res.data.status == '1'){
          //console.log(res.data.data);
          this.$store.dispatch("SET_HOMEROLLBALL",res.data.data);
        }
      })
    }
  },
  components: {
    BasketballBlock,
    Tennis,
    Loading,
    NotOpend
  },
  mounted() {
    if (this.getIsShow) {
      this.$store.dispatch("GETSHOW", true);
      this.getIsShow = false;
    }
    if (this.$store.getters.getHeadTitle) {
      let title = this.$store.getters.getHeadTitle;
      this.idx = title[0].matchNum;
    }

    //获取数据
    this.getAjax();

    //获取条数。。
    this.getNumber();
    let _this = this;
    this.$public.ajaxTimerFun(function(timing) {
      if (_this.timers) {
        _this.getNumber();
        _this.getAjax();
      } else {
        clearInterval(timing);
      }
    },(1000*10));
  },
  computed: {
    getHeadTit() {
      return this.$store.getters.getHeadTitle;
    }
  },
  watch: {
    getHeadTit(val) {
      this.idx = val[0].matchNum;
    }
  },
  beforeDestroy() {
    this.timers = false;
  }
};
</script>
<style  scoped>
.box {
  width: 100%;
  padding: 0.28rem 0;
  background: #f8f8f8;
  padding: 0 0.3rem;
  height: 0.88rem;
}
.BallDisc {
  font-size: 0.32rem;
  background: #f8f8f8;
  color: #000000;
  margin-bottom: 0.12rem;
}
div /deep/ .tennis .ballBtn {
  border-bottom: none;
}
.mark {
  position: absolute;
  right: 0.8rem;
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 50%;
  background: #f76649;
  color: floralwhite;
  font-size: 0.2rem;
}
</style>