76 lines
1.5 KiB
Vue
76 lines
1.5 KiB
Vue
<template>
|
||
<div class="bobo-yq-view">
|
||
<div class="bobo-yq-view-text">
|
||
<label>次数：</label>
|
||
<span>{{ remainTicketNum }}</span>
|
||
</div>
|
||
<div class="bobo-yq-view-btn">
|
||
<button></button>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { mapGetters, mapActions } from "vuex";
|
||
export default {
|
||
name: "BoboYqView",
|
||
props: {
|
||
// actId: {
|
||
// type: [String, Number],
|
||
// default: ""
|
||
// }
|
||
},
|
||
computed: {
|
||
...mapGetters(["remainTicketNum"])
|
||
},
|
||
methods: {
|
||
...mapActions(["getQueryTicketNum"])
|
||
},
|
||
created() {
|
||
this.getQueryTicketNum();
|
||
}
|
||
};
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
.bobo-yq-view {
|
||
width: 346px;
|
||
height: 59px;
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
background-image: url(../../assets/images/bobo/gmcx_bg.png);
|
||
display: flex;
|
||
// align-items: center;
|
||
&-text {
|
||
flex: 1;
|
||
font-size: 22px;
|
||
line-height: 59px;
|
||
& > label {
|
||
color: #ffffff;
|
||
padding-left: 20px;
|
||
}
|
||
& > span {
|
||
color: #ffe26c;
|
||
}
|
||
}
|
||
&-btn {
|
||
width: 46px;
|
||
height: 46px;
|
||
padding-right: 10px;
|
||
padding-top: 6px;
|
||
& > button {
|
||
width: 46px;
|
||
height: 46px;
|
||
background-repeat: no-repeat;
|
||
background-size: cover;
|
||
border: none;
|
||
background-color: transparent;
|
||
background-image: url(../../assets/images/bobo/but_add.png);
|
||
&:active {
|
||
background-image: url(../../assets/images/bobo/but_add_press.png);
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style>
|