sports_wap/.svn/pristine/bd/bd35f68f746e699dba772e151f1e579623256bcb.svn-base

<template lang="">
	<div class = "head">
		<div class = "row item-center" @click="isreturn()">
			<div class = "row item-center"><img class="img" src="../assets/st-imges/returnbox.png" /></div>
			<div class = "ball tit">{{name}}</div>
		</div>
		<div class = "size" v-if = "rShow">
			<div :class = "status.sts ? 'stus':''" @click = "toggle()">让球&大小</div>
			<div v-if = '!ishow' :class = "status.ride?'stus':''" @click = "tog()">1x2</div>
			<div v-else :class = "status.ride?'stus':''" @click = "tog()">独赢盘</div>
		</div>
	</div>
</template>
<script>
import Bus from "../assets/bus.js";
import "../css/index.css";
export default {
  props: ["name", "ishow", "gameCode"],
  data() {
    return {
      isShow: "",
      status: {
        sts: true,
        ride: false
      },
      rShow: true //是否为棒球与网球，是则不显示
      // ishow:true
    };
  },
  methods: {
    toggle() {
      this.status.sts = true;
      this.status.ride = false;
      this.$emit("toggleStatus", this.status);
      this.isShow = true;
      Bus.$emit("show", this.isShow);
    },
    tog() {
      this.status.ride = true;
      this.status.sts = false;
      this.$emit("toggleRide", this.status);
      this.isShow = false;
      Bus.$emit("show", this.isShow);
    },
    isreturn() {
      history.go(-1);
    }
  },
  mounted() {
    Bus.$on("val", data => {
      this.title = data;
    });
    // console.log("gameCode", this.gameCode);
  },
  /**
   * 计算属性
   */
  computed: {
    getCode: function() {
      if ( this.$store.getters.getBallId == "wq") {
        this.rShow = false;
      } else {
        this.rShow = true;
			}
			// console.log('show', this.rshow)
      return this.$store.getters.getBallId;
    }
  },
  watch: {
    getCode(val) {
      // console.log("aaa", val);
    }
  }
};
</script>
<style scoped>
.head {
  display: flex;
  padding: 0.1rem 0.32rem;
  justify-content: space-between;
  align-items: center;
  background: #797777;
  font-size: 0.28rem;
  height: 0.8rem;
}
.head .tit {
  color: #f76649 !important;
  font-size: 0.3rem;
}
.tit img {
  width: 0.37rem;
  height: 0.3rem;
  margin-right: 0.18rem;
}
.head .ball {
  color: #ffffff;
}
.head .size {
  display: flex;
  align-items: center;
  justify-content: center;
}
.head .size div {
  margin-right: 0.1rem;
  font-size: 0.2rem;
  color: #e1e1df;
}
.head .size div:nth-child(2) {
  padding: 0 0.2rem;
  font-size: 0.2rem;
}
.head .size div {
  color: rgba(255, 255, 255, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  height: 0.6rem;
  line-height: 0.6rem;
  background: #363636;
  padding: 0 0.1rem;
  border-radius: 0.08rem;
}
.head .size .stus {
  background: #adadad;
  color: rgba(255, 255, 255);
}
.img {
  width: 0.37rem;
  height: 0.3rem;
  margin-right: 0.18rem;
}
</style>