|
@@ -19,20 +19,26 @@
|
|
>
|
|
>
|
|
<div class="flex justify-between">
|
|
<div class="flex justify-between">
|
|
<img src="https://file.rongcyl.cn/festatic/bkm/activity.png" class="area" />
|
|
<img src="https://file.rongcyl.cn/festatic/bkm/activity.png" class="area" />
|
|
- <img src="https://file.rongcyl.cn/festatic/bkm/task.png" class="area" />
|
|
|
|
- <img src="https://file.rongcyl.cn/festatic/bkm/invite.png" class="area" />
|
|
|
|
|
|
+ <img
|
|
|
|
+ src="https://file.rongcyl.cn/festatic/bkm/task.png"
|
|
|
|
+ class="area"
|
|
|
|
+ @click="$navigateTo('/pages/task/index')"
|
|
|
|
+ />
|
|
|
|
+ <img
|
|
|
|
+ src="https://file.rongcyl.cn/festatic/bkm/invite.png"
|
|
|
|
+ class="area"
|
|
|
|
+ @click="$navigateTo('/pages/invite/invite')"
|
|
|
|
+ />
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="flex justify-between m-2 co">
|
|
<div class="flex justify-between m-2 co">
|
|
<img src="https://file.rongcyl.cn/festatic/bkm/center.png" class="center" />
|
|
<img src="https://file.rongcyl.cn/festatic/bkm/center.png" class="center" />
|
|
- <div class="clicks flex-1 overflow-hidden">
|
|
|
|
- <div>
|
|
|
|
- <div class="ml-2 mt-2 inline-block relative" v-for="c in click">
|
|
|
|
- <img src="https://file.rongcyl.cn/festatic/bkm/click.png" />
|
|
|
|
- <div class="absolute top-4 left-0 text-center right-0">
|
|
|
|
- <div class="bold fs12">闯关9-2</div>
|
|
|
|
- <div class="fs11 text-zinc-600">闯关9-2</div>
|
|
|
|
- </div>
|
|
|
|
|
|
+ <div class="clicks flex-1 overflow-scroll flex flex-nowrap">
|
|
|
|
+ <div class="ml-2 mt-2 inline-block relative" v-for="c in click" :key="c">
|
|
|
|
+ <img src="https://file.rongcyl.cn/festatic/bkm/click.png" />
|
|
|
|
+ <div class="absolute top-4 left-0 text-center right-0">
|
|
|
|
+ <div class="bold fs12">闯关9-2</div>
|
|
|
|
+ <div class="fs11 text-zinc-600">闯关9-2</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@@ -47,22 +53,24 @@
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="tabs">
|
|
<div class="tabs">
|
|
- <div class="tab active">全部</div>
|
|
|
|
- <div class="tab">FIRST赏</div>
|
|
|
|
- <div class="tab">LAST赏</div>
|
|
|
|
- <div class="tab">全套赏</div>
|
|
|
|
- <div class="tab">无限赏</div>
|
|
|
|
|
|
+ <div class="tab" :class="{ active: type == 0 }" @click="type = 0">全部</div>
|
|
|
|
+ <div class="tab" :class="{ active: type == 5 }" @click="type = 5">FIRST赏</div>
|
|
|
|
+ <div class="tab" :class="{ active: type == 2 }" @click="type = 2">LAST赏</div>
|
|
|
|
+
|
|
|
|
+ <div class="tab" :class="{ active: type == 3 }" @click="type = 3">全套赏</div>
|
|
|
|
+ <div class="tab" :class="{ active: type == 1 }" @click="type = 1">无限赏</div>
|
|
|
|
+ <!-- <div class="tab" :class="{ active: type == 4 }" @click="type = 4">抽盒机</div> -->
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="cards">
|
|
<div class="cards">
|
|
- <div class="card relative" v-for="i in arr" @click="$navigateTo('/pages/first2/index')">
|
|
|
|
|
|
+ <div class="card relative" v-for="(item, i) in list" @click="$navigateTo('/pages/first2/index')" :key="i">
|
|
<img
|
|
<img
|
|
- src="https://file.rongcyl.cn/festatic/bkm/tag.png"
|
|
|
|
|
|
+ :src="`https://file.rongcyl.cn/festatic/bkm/tags/${item.type}.png`"
|
|
class="absolute top-0 left-0"
|
|
class="absolute top-0 left-0"
|
|
style="width: 62px; height: 24px"
|
|
style="width: 62px; height: 24px"
|
|
/>
|
|
/>
|
|
- <img src="https://file.rongcyl.cn/festatic/bkm/card.png" />
|
|
|
|
- <div class="mt-1">冲四层闯关...</div>
|
|
|
|
|
|
+ <img :src="item.icon" />
|
|
|
|
+ <div class="mt-1">{{ item.name }}</div>
|
|
<div class="flex justify-between" style="font-size: 13px; margin-top: 12rpx">
|
|
<div class="flex justify-between" style="font-size: 13px; margin-top: 12rpx">
|
|
<div
|
|
<div
|
|
style="
|
|
style="
|
|
@@ -78,13 +86,13 @@
|
|
创意热销
|
|
创意热销
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div>
|
|
- <span style="font-size: 14px; margin-right: 4px; color: #fc5b20" class="bold">999</span>
|
|
|
|
|
|
+ <span style="font-size: 14px; margin-right: 4px; color: #fc5b20" class="bold">{{ item.totalNum }}</span>
|
|
<span style="color: #666666">销量</span>
|
|
<span style="color: #666666">销量</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div style="color: #fc5b20; margin-top: 12rpx">
|
|
<div style="color: #fc5b20; margin-top: 12rpx">
|
|
<span class="fs14">¥</span>
|
|
<span class="fs14">¥</span>
|
|
- <span class="bold fs16">990</span>
|
|
|
|
|
|
+ <span class="bold fs16">{{ item.price }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@@ -122,15 +130,43 @@
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
|
|
+import { raffleListApi } from '@/api/drawCard'
|
|
|
|
+
|
|
export default {
|
|
export default {
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
- arr: 4,
|
|
|
|
- click: 3,
|
|
|
|
|
|
+ click: 6,
|
|
|
|
+ list: [],
|
|
|
|
+ type: 0,
|
|
}
|
|
}
|
|
},
|
|
},
|
|
|
|
+ created() {
|
|
|
|
+ this.getList()
|
|
|
|
+ },
|
|
|
|
+ watch: {
|
|
|
|
+ type() {
|
|
|
|
+ this.getList()
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
|
|
- methods: {},
|
|
|
|
|
|
+ methods: {
|
|
|
|
+ getList() {
|
|
|
|
+ let params = {
|
|
|
|
+ limit: 999,
|
|
|
|
+ page: 1,
|
|
|
|
+ type: this.type || '',
|
|
|
|
+ }
|
|
|
|
+ raffleListApi(params).then(res => {
|
|
|
|
+ let list = res.data.list
|
|
|
|
+ for (var i = 0; i < list.length; i++) {
|
|
|
|
+ if (list[i].subType) {
|
|
|
|
+ list[i].subType = list[i].subType.split(',')
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ this.list = list
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ },
|
|
}
|
|
}
|
|
</script>
|
|
</script>
|
|
|
|
|