|
|
@@ -1,229 +1,168 @@
|
|
|
-<template>
|
|
|
- <view class="container">
|
|
|
- <image class="headImg" mode="aspectFill" :src="'https://file.rongcyl.cn/festatic/bkm/imgv2/homeHead.jpeg'" />
|
|
|
- <view class="headBarrage">
|
|
|
- <view class="barrage-container">
|
|
|
- <view v-for="(item, index) in barrageData" :key="index" class="barrage-item" :style="item.style">
|
|
|
- {{ item.text }}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="tabs">
|
|
|
- <!-- <view class="tab">
|
|
|
- <image :src="'https://file.rongcyl.cn/festatic/bkm/imgv2/Frame3.png'" alt="" />
|
|
|
- <span>全部</span>
|
|
|
- </view> -->
|
|
|
- <view class="tab" @click="$navigateTo('/pages/excellentValue/excellentValue')">
|
|
|
- <image :src="'https://file.rongcyl.cn/festatic/bkm/imgv2/Frame4.png'" alt="" />
|
|
|
- <span>超值挑战</span>
|
|
|
- </view>
|
|
|
- <view class="tab" @click="$navigateTo('/pages/task/index')">
|
|
|
- <image :src="'https://file.rongcyl.cn/festatic/bkm/imgv2/Frame2.png'" alt="" />
|
|
|
- <span>任务大厅</span>
|
|
|
- </view>
|
|
|
- <view class="tab" @click="$navigateTo('/pages/index2/index')">
|
|
|
- <image :src="'https://file.rongcyl.cn/festatic/bkm/imgv2/Frame1.png'" alt="" />
|
|
|
- <span>VIP福利</span>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="buttons">
|
|
|
- <view class="left">
|
|
|
- <image :src="'https://file.rongcyl.cn/festatic/bkm/imgv2/button3.png'" @click="toInvite" />
|
|
|
- </view>
|
|
|
- <view class="right">
|
|
|
- <image :src="'https://file.rongcyl.cn/festatic/bkm/imgv2/button1.png'" @click="showQRcode" />
|
|
|
- <image
|
|
|
- :src="'https://file.rongcyl.cn/festatic/bkm/imgv2/button2.png'"
|
|
|
- @click="$navigateTo('/pages/raffle/raffle')"
|
|
|
+<template style="background-color: red">
|
|
|
+ <div
|
|
|
+ style="
|
|
|
+ background-image: url(https://file.rongcyl.cn/festatic/bkm/bg_i.png);
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-position: center center;
|
|
|
+ background-size: contain;
|
|
|
+ background-color: #000;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <img src="https://file.rongcyl.cn/festatic/bkm/banner.png" class="w-full" style="height: 400rpx" />
|
|
|
+ <div
|
|
|
+ style="
|
|
|
+ background: rgba(0, 0, 0, 0.85);
|
|
|
+ background-image: url(https://file.rongcyl.cn/festatic/bkm/box.png);
|
|
|
+ background-size: cover;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <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/task.png"
|
|
|
+ class="area"
|
|
|
+ @click="$navigateTo('/pages/task/index')"
|
|
|
/>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="list-title">- 热门推荐 -</view>
|
|
|
- <view class="list">
|
|
|
- <view class="ka" v-for="(item, index) in kaList" @click="drawCard(item)">
|
|
|
- <view class="top">
|
|
|
- <image mode="aspectFit" :src="item.icon" />
|
|
|
- </view>
|
|
|
- <view class="ka-info">
|
|
|
- <view class="ka-name">{{ item.name }}</view>
|
|
|
- <view class="row">
|
|
|
- <uni-tag :text="item.tags" inverted type="default"></uni-tag>
|
|
|
- <view class="money">¥{{ item.price }}</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <uni-popup class="popup" ref="popup" type="center">
|
|
|
- <image
|
|
|
- class="qrcodeImg"
|
|
|
- :show-menu-by-longpress="true"
|
|
|
- :src="'https://file.rongcyl.cn/festatic/bkm/imgv2/QRcode.png'"
|
|
|
- mode="widthFix"
|
|
|
- />
|
|
|
- </uni-popup>
|
|
|
- </view>
|
|
|
+ <img
|
|
|
+ src="https://file.rongcyl.cn/festatic/bkm/invite.png"
|
|
|
+ class="area"
|
|
|
+ @click="$navigateTo('/pages/invite/invite')"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="flex justify-between m-2 co">
|
|
|
+ <img src="https://file.rongcyl.cn/festatic/bkm/center.png" class="center" />
|
|
|
+ <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>
|
|
|
+ <img src="https://file.rongcyl.cn/festatic/bkm/more.png" class="more" />
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="flex justify-between m-2">
|
|
|
+ <img src="https://file.rongcyl.cn/festatic/bkm/c1.png" class="c" />
|
|
|
+ <img src="https://file.rongcyl.cn/festatic/bkm/c2.png" class="c" />
|
|
|
+ <img src="https://file.rongcyl.cn/festatic/bkm/c3.png" class="c" />
|
|
|
+ <img src="https://file.rongcyl.cn/festatic/bkm/c4.png" class="c" />
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="tabs">
|
|
|
+ <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 class="cards">
|
|
|
+ <div class="card relative" v-for="(item, i) in list" @click="$navigateTo('/pages/first2/index')" :key="i">
|
|
|
+ <img
|
|
|
+ :src="`https://file.rongcyl.cn/festatic/bkm/tags/${item.type}.png`"
|
|
|
+ class="absolute top-0 left-0"
|
|
|
+ style="width: 62px; height: 24px"
|
|
|
+ />
|
|
|
+ <img :src="item.icon" />
|
|
|
+ <div class="mt-1">{{ item.name }}</div>
|
|
|
+ <div class="flex justify-between" style="font-size: 13px; margin-top: 12rpx">
|
|
|
+ <div
|
|
|
+ style="
|
|
|
+ border-radius: 3px;
|
|
|
+ height: 20px;
|
|
|
+ line-height: 20px;
|
|
|
+ text-align: center;
|
|
|
+ background: #fc5b20;
|
|
|
+ color: #fff;
|
|
|
+ padding: 0 8rpx;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ 创意热销
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span style="font-size: 14px; margin-right: 4px; color: #fc5b20" class="bold">{{ item.totalNum }}</span>
|
|
|
+ <span style="color: #666666">销量</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div style="color: #fc5b20; margin-top: 12rpx">
|
|
|
+ <span class="fs14">￥</span>
|
|
|
+ <span class="bold fs16">{{ item.price }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="p">
|
|
|
+ <img src="https://file.rongcyl.cn/festatic/bkm/p.png" />
|
|
|
+ <div class="absolute text-white bottom-2 fs11 text-center left-0 right-0">3333</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- <div
|
|
|
+ class="fixed left-0 right-0 bottom-0 pb-1 bg-black flex justify-around items-center fs13"
|
|
|
+ style="color: #b4c9da; height: 80px"
|
|
|
+ >
|
|
|
+ <div class="text-center">
|
|
|
+ <img src="https://file.rongcyl.cn/festatic/bkm/index2tabs/home_a.png" class="w-7 h-7" />
|
|
|
+ <div style="color: #fc5b20">首页</div>
|
|
|
+ </div>
|
|
|
+ <div class="text-center">
|
|
|
+ <img src="https://file.rongcyl.cn/festatic/bkm/index2tabs/shop.png" class="w-7 h-7" />
|
|
|
+ <div>商城</div>
|
|
|
+ </div>
|
|
|
+ <div class="text-center">
|
|
|
+ <img src="https://file.rongcyl.cn/festatic/bkm/index2tabs/cc.png" class="w-8 h-8" />
|
|
|
+ <div>抽卡机</div>
|
|
|
+ </div>
|
|
|
+ <div class="text-center">
|
|
|
+ <img src="https://file.rongcyl.cn/festatic/bkm/index2tabs/bag.png" class="w-7 h-7" />
|
|
|
+ <div>背包</div>
|
|
|
+ </div>
|
|
|
+ <div class="text-center">
|
|
|
+ <img src="https://file.rongcyl.cn/festatic/bkm/index2tabs/mine.png" class="w-7 h-7" />
|
|
|
+ <div>我的</div>
|
|
|
+ </div>
|
|
|
+ </div> -->
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { messageListApi } from '@/api/common.js'
|
|
|
-import { raffleListApi } from '@/api/drawCard.js'
|
|
|
+import { raffleListApi } from '@/api/drawCard'
|
|
|
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
- timer: null,
|
|
|
- kaList: [],
|
|
|
- messageList: [],
|
|
|
- barrageData: [],
|
|
|
- barrageIndex: 0,
|
|
|
- timeOut: null,
|
|
|
- interval: null,
|
|
|
- params: {
|
|
|
- limit: 20,
|
|
|
- page: 1,
|
|
|
- },
|
|
|
- total: null,
|
|
|
- containerWidth: 0,
|
|
|
- usedTops: [],
|
|
|
+ click: 6,
|
|
|
+ list: [],
|
|
|
+ type: 0,
|
|
|
}
|
|
|
},
|
|
|
- onLoad(query) {
|
|
|
- if (query.inviteId) {
|
|
|
- getApp().globalData.inviteId = query.inviteId
|
|
|
- } else {
|
|
|
- const scene = decodeURIComponent(query.scene)
|
|
|
- let inviteId = scene.split('=')[1]
|
|
|
- console.log(inviteId, 'inviteId')
|
|
|
- getApp().globalData.inviteId = inviteId
|
|
|
- }
|
|
|
- console.log(this.$refs)
|
|
|
- },
|
|
|
- onShow() {
|
|
|
- this.getMessage()
|
|
|
- this.getHot()
|
|
|
- this.interval = setInterval(() => {
|
|
|
- console.log('重复获取消息')
|
|
|
- this.barrageIndex = 0
|
|
|
- this.getMessage()
|
|
|
- // let num = this.params.page * this.params.limit
|
|
|
- // if (this.total == null || this.total > num) {
|
|
|
- // console.log('获取消息接口')
|
|
|
- // // this.params.page += 1
|
|
|
- // this.barrageIndex = 0
|
|
|
- // this.getMessage()
|
|
|
- // }
|
|
|
- }, 60000)
|
|
|
- setTimeout(() => {
|
|
|
- this.launchBarrage()
|
|
|
- }, 2000)
|
|
|
+ created() {
|
|
|
+ this.getList()
|
|
|
},
|
|
|
- onHide() {
|
|
|
- clearInterval(this.interval)
|
|
|
- clearInterval(this.timer)
|
|
|
+ watch: {
|
|
|
+ type() {
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
},
|
|
|
+
|
|
|
methods: {
|
|
|
- showQRcode() {
|
|
|
- this.$refs.popup.open()
|
|
|
- },
|
|
|
- drawCard(value) {
|
|
|
- let url = ''
|
|
|
- if (value.type == 1) {
|
|
|
- url = '/pages/drawCard_infinite/drawCard_infinite'
|
|
|
- } else if (value.type == 2) {
|
|
|
- url = '/pages/drawCard_last/drawCard_last'
|
|
|
- } else if (value.type == 3) {
|
|
|
- url = '/pages/drawCard_fullSet/drawCard_fullSet'
|
|
|
- } else if (value.type == 4) {
|
|
|
- url = '/pages/drawCard_box/drawCard_box'
|
|
|
- } else if (value.type == 5) {
|
|
|
- url = '/pages/drawCard_first/drawCard_first'
|
|
|
- }
|
|
|
- this.$navigateTo(url, {
|
|
|
- id: value.id,
|
|
|
- })
|
|
|
- },
|
|
|
- getHot() {
|
|
|
+ getList() {
|
|
|
let params = {
|
|
|
limit: 999,
|
|
|
page: 1,
|
|
|
- isHot: true,
|
|
|
+ type: this.type || '',
|
|
|
}
|
|
|
raffleListApi(params).then(res => {
|
|
|
- this.kaList = res.data.list
|
|
|
- })
|
|
|
- },
|
|
|
- getMessage() {
|
|
|
- messageListApi(this.params).then(res => {
|
|
|
- this.messageList = res.data.list
|
|
|
- this.total = res.data.total
|
|
|
- this.initBarrage()
|
|
|
- })
|
|
|
- },
|
|
|
- launchBarrage() {
|
|
|
- if (this.timer) {
|
|
|
- clearInterval(this.timer)
|
|
|
- }
|
|
|
- this.timer = setInterval(() => {
|
|
|
- this.barrageData.forEach((barrage, index) => {
|
|
|
- if (!barrage.tag) {
|
|
|
- barrage.tag = true
|
|
|
- barrage.right = -400
|
|
|
- barrage.top = this.randomTop()
|
|
|
- barrage.style = `display: block; top: ${barrage.top}px; right: ${barrage.right}px;`
|
|
|
- } else {
|
|
|
- barrage.right = parseInt(barrage.right) + 2
|
|
|
- barrage.style = `display: block; top: ${barrage.top}px; right: ${barrage.right}px;`
|
|
|
- }
|
|
|
- })
|
|
|
- }, 20)
|
|
|
- },
|
|
|
- // 初始化弹幕
|
|
|
- initBarrage() {
|
|
|
- // console.log(this.barrageIndex, 'this.barrageIndex')
|
|
|
- if (this.messageList.length > 0) {
|
|
|
- this.timeOut = setTimeout(() => {
|
|
|
- let barrage = {
|
|
|
- text: this.messageList[this.barrageIndex].content,
|
|
|
- }
|
|
|
- this.$set(barrage, 'right', -400)
|
|
|
- this.$set(barrage, 'top', this.randomTop())
|
|
|
- this.$set(barrage, 'tag', false)
|
|
|
- this.barrageData.push(barrage)
|
|
|
-
|
|
|
- this.barrageIndex += 1
|
|
|
- clearTimeout(this.timeOut)
|
|
|
- if (this.barrageIndex > this.messageList.length - 1) {
|
|
|
- this.barrageIndex = 0
|
|
|
- } else {
|
|
|
- this.initBarrage()
|
|
|
+ let list = res.data.list
|
|
|
+ for (var i = 0; i < list.length; i++) {
|
|
|
+ if (list[i].subType) {
|
|
|
+ list[i].subType = list[i].subType.split(',')
|
|
|
}
|
|
|
- }, 1000)
|
|
|
- }
|
|
|
- },
|
|
|
- // 发送弹幕
|
|
|
- sendingBarrage() {
|
|
|
- let messageList = this.messageList
|
|
|
- },
|
|
|
- randomTop() {
|
|
|
- // return Math.floor(Math.random() * 150)
|
|
|
-
|
|
|
- // 往前5个不重复top值
|
|
|
- let top = 0
|
|
|
- this.usedTops.push(top)
|
|
|
- do {
|
|
|
- top = Math.floor(Math.random() * 6) * 30 // 生成0, 30, 60, 90, 120的随机值
|
|
|
- } while (this.usedTops.slice(-4).includes(top))
|
|
|
-
|
|
|
- this.usedTops.push(top)
|
|
|
-
|
|
|
- return top
|
|
|
- },
|
|
|
-
|
|
|
- toInvite() {
|
|
|
- wx.navigateTo({
|
|
|
- url: '/pages/invite/invite',
|
|
|
+ }
|
|
|
+ this.list = list
|
|
|
})
|
|
|
},
|
|
|
},
|
|
|
@@ -231,160 +170,87 @@ export default {
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
-.barrage-container {
|
|
|
- width: 100%;
|
|
|
- height: 180px;
|
|
|
- position: relative;
|
|
|
- overflow: hidden;
|
|
|
- background-color: rgba(0, 0, 0, 0.2);
|
|
|
- /* 背景色，可根据需要调整 */
|
|
|
+.area {
|
|
|
+ width: 168px;
|
|
|
+ height: 88px;
|
|
|
}
|
|
|
|
|
|
-.barrage-item {
|
|
|
- color: #fff;
|
|
|
- padding: 5px 10px;
|
|
|
- font-size: 14px;
|
|
|
- line-height: 30px;
|
|
|
- position: absolute;
|
|
|
- white-space: nowrap;
|
|
|
- display: none;
|
|
|
- border-radius: 15px;
|
|
|
- background-color: rgba(0, 0, 0, 0.3);
|
|
|
+.c {
|
|
|
+ width: 82px;
|
|
|
+ height: 47px;
|
|
|
}
|
|
|
|
|
|
-.container {
|
|
|
- /* padding: 20px; */
|
|
|
- font-size: 14px;
|
|
|
- line-height: 24px;
|
|
|
+.center {
|
|
|
+ width: 38px;
|
|
|
+ height: 98px;
|
|
|
}
|
|
|
|
|
|
-.headImg {
|
|
|
- height: 180px;
|
|
|
- width: 100%;
|
|
|
-}
|
|
|
+.clicks {
|
|
|
+ height: 98px;
|
|
|
+ background-image: linear-gradient(to bottom, #ffaea6, #ff654c);
|
|
|
|
|
|
-.headBarrage {
|
|
|
- height: 180px;
|
|
|
- width: 100%;
|
|
|
- position: absolute;
|
|
|
- top: 0;
|
|
|
+ img {
|
|
|
+ height: 82px;
|
|
|
+ width: 82px;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
-.tabs {
|
|
|
- display: flex;
|
|
|
- justify-content: space-around;
|
|
|
- margin-top: 10px;
|
|
|
+.more {
|
|
|
+ width: 28px;
|
|
|
+ height: 98px;
|
|
|
+}
|
|
|
|
|
|
- > .tab {
|
|
|
- width: 20%;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
+.p {
|
|
|
+ position: fixed;
|
|
|
+ bottom: 120px;
|
|
|
+ right: 20px;
|
|
|
|
|
|
- > image {
|
|
|
- width: 40px;
|
|
|
- height: 40px;
|
|
|
- }
|
|
|
+ img {
|
|
|
+ width: 50px;
|
|
|
+ height: 50px;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-.buttons {
|
|
|
- margin-top: 5px;
|
|
|
- padding: 10px;
|
|
|
+.tabs {
|
|
|
display: flex;
|
|
|
- justify-content: space-between;
|
|
|
-
|
|
|
- > .left {
|
|
|
- width: calc(50vw - 15px);
|
|
|
- height: 40vw;
|
|
|
-
|
|
|
- image {
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- }
|
|
|
- }
|
|
|
+ justify-content: space-around;
|
|
|
|
|
|
- > .right {
|
|
|
- width: calc(50vw - 15px);
|
|
|
- height: 40vw;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
+ .tab {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #fff;
|
|
|
+ padding: 10px 0;
|
|
|
|
|
|
- image {
|
|
|
- width: 100%;
|
|
|
- height: calc(50% - 5px);
|
|
|
+ &.active {
|
|
|
+ font-weight: 600;
|
|
|
+ border-bottom: 2px solid #fc5b20;
|
|
|
+ color: #fc5b20;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-.list-title {
|
|
|
- font-size: 16px;
|
|
|
- font-weight: 600;
|
|
|
- text-align: center;
|
|
|
- padding: 10px;
|
|
|
-}
|
|
|
-
|
|
|
-.list {
|
|
|
- display: grid;
|
|
|
- grid-template-columns: 1fr 1fr;
|
|
|
- grid-gap: 10px;
|
|
|
- padding: 10px;
|
|
|
-
|
|
|
- .ka {
|
|
|
- width: calc(50vw - 15px);
|
|
|
- box-shadow: 0px 2px 8px 2px rgba(0, 0, 0, 0.1);
|
|
|
+.cards {
|
|
|
+ margin-top: 20px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding: 0 20rpx;
|
|
|
+ flex-wrap: wrap;
|
|
|
+
|
|
|
+ .card {
|
|
|
+ box-sizing: border-box;
|
|
|
+ width: 344rpx;
|
|
|
+ // height: 500rpx;
|
|
|
+ background: #fff;
|
|
|
border-radius: 10px;
|
|
|
- // height: 60vw;
|
|
|
-
|
|
|
- .top {
|
|
|
- // height: 60vw;
|
|
|
- background: linear-gradient(180deg, #faf1a7 0%, #ffe456 100%);
|
|
|
- text-align: center;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
-
|
|
|
- image {
|
|
|
- width: 35vw;
|
|
|
- height: 50vw;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .ka-info {
|
|
|
- padding: 10px;
|
|
|
-
|
|
|
- .ka-name {
|
|
|
- font-size: 15px;
|
|
|
- font-weight: 600;
|
|
|
- }
|
|
|
-
|
|
|
- .row {
|
|
|
- margin-top: 5px;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
-
|
|
|
- .money {
|
|
|
- font-size: 16px;
|
|
|
- font-weight: 600;
|
|
|
- color: #ff2c43;
|
|
|
- }
|
|
|
- }
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ padding: 20rpx;
|
|
|
+ padding-bottom: 12rpx;
|
|
|
+
|
|
|
+ img {
|
|
|
+ width: 308rpx;
|
|
|
+ height: 308rpx;
|
|
|
+ border-radius: 8px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
-.bullet {
|
|
|
- height: 30px;
|
|
|
- line-height: 30px;
|
|
|
- padding: 0 10px;
|
|
|
- border-radius: 15px;
|
|
|
- background-color: rgba(0, 0, 0, 0.3);
|
|
|
- color: #fff;
|
|
|
-}
|
|
|
-.qrcodeImg {
|
|
|
- width: 70vw;
|
|
|
- border-radius: 5px;
|
|
|
-}
|
|
|
</style>
|
andy
