798 lines
18 KiB
Vue
798 lines
18 KiB
Vue
<template>
|
||
<view class="card-page">
|
||
<HeaderCom></HeaderCom>
|
||
<view class="main" v-if="isFrist">
|
||
<image src="@/static/new/tip/title.png" mode="" class="title-icon"></image>
|
||
<view class="tip">商品提示语</view>
|
||
<view class="heng-icon"></view>
|
||
<view class="sub">*使用后可提前获得该盲盒的商品提示语</view>
|
||
</view>
|
||
<view class="immediate-view" v-if="isFrist">
|
||
<!-- <view class="immediate" :class="{activityClass:activity!=''}" @click="buyPrompt" style="background: #FFFFFF;border-radius: 16rpx;border: 2rpx solid #EBEBEB;color: #666666;">购买提示卡</view> -->
|
||
<view class="immediate" :class="{activityClass:activity}" @click="buyPrompt" style="background: #FFFFFF;border-radius: 16rpx;border: 2rpx solid #EBEBEB;color: #666666;">购买提示卡</view>
|
||
<view class="immediate" @click="useCk" v-if="!activity">使用提示卡</view>
|
||
<!-- <view class="immediate" v-if="promptTotal === 0" @click="buyPrompt">购买提示卡</view>
|
||
<view class="immediate" v-if="promptTotal > 0 && isFrist" @click="useCk">使用提示卡</view> -->
|
||
</view>
|
||
|
||
|
||
<view class="main-gun" v-if="!isFrist">
|
||
<image src="@/static/new/tip/title.png" mode="" class="title-icon"></image>
|
||
<view class="heng" :style="{'zIndex': isTxt ? 10 : 1}">{{isTxt ? prompt : ''}}</view>
|
||
<view style="z-index: 2;">
|
||
<swiper circular :autoplay="autoplay" :current="current" :interval="50" :duration="100" ref="swiper"
|
||
disable-touch vertical :display-multiple-items="7" class="swiper">
|
||
<swiper-item v-for="(item, index) in swiperList" :key="index" class="swiper-item"
|
||
:class="{'active-swiper-item':current === index}">
|
||
<view class="item">{{ item }}</view>
|
||
</swiper-item>
|
||
</swiper>
|
||
</view>
|
||
<view class="shix">离开页面后提示卡将失效哟~</view>
|
||
</view>
|
||
<view class="footer" v-if="!isFrist">
|
||
<view class="loading-view" v-if="autoplay"></view>
|
||
<button class="again" @click="again">再抽一次</button>
|
||
<view class="buy" @click="buy">立即购买</view>
|
||
</view>
|
||
<popup-view v-model="show" mode="bottom" border-radius="15" zIndex="1">
|
||
<view class="popup-main">
|
||
<view class="popup-header">
|
||
<image src="@/static/new/tip/big-card.png" mode="" class="popup-header-img"></image>
|
||
<view class="popup-info">
|
||
<view class="popup-info-name">提示卡</view>
|
||
<view>{{Number(promptDetail.amount)}} {{typeObj[promptDetail.method]}}</view>
|
||
</view>
|
||
</view>
|
||
<view class="popup-footer">
|
||
<view class="footer-num">
|
||
<view class="footer-info">
|
||
购买数量
|
||
</view>
|
||
<view class="item-step">
|
||
<image src="@/static/mine/sub.png" class="item-sub" mode="" @click="sub"></image>
|
||
<view class="item-num">{{quantity}}</view>
|
||
<image src="@/static/mine/add.png" class="item-add" mode="" @click="add"></image>
|
||
</view>
|
||
</view>
|
||
<view class="now-buy" @click="confirmPromptBuy">立即购买</view>
|
||
</view>
|
||
</view>
|
||
</popup-view>
|
||
|
||
<!-- 购买弹窗 -->
|
||
<popup-view v-model="buyShow" mode="bottom" border-radius="15" zIndex="1000">
|
||
<BuyBoxCom :detailData="detailData" @isOk="buySuccess" boxType="buy" :isCard="false" :promptId="promptId" @coinDeficit="coinDeficit"></BuyBoxCom>
|
||
</popup-view>
|
||
<!-- 去充值 -->
|
||
<popup-view v-model="isTopUp" mode="bottom" border-radius="15" zIndex="1000">
|
||
<coinDeficitCom @close="closeTop" @sucClose="sucClose"></coinDeficitCom>
|
||
</popup-view>
|
||
|
||
<view class="custom-toast" v-if="isTip">
|
||
<view class="toast-txt">支付成功</view>
|
||
</view>
|
||
<!-- 所有页面的弹框 -->
|
||
<page-popup page="/pages/index/card"></page-popup>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
myMixins
|
||
} from "@/mixins/mixins.js";
|
||
import HeaderCom from '@/pages/components/header.vue'
|
||
import BuyBoxCom from './components/buyBox.vue'
|
||
import coinDeficitCom from './components/coinDeficit.vue'
|
||
import {
|
||
usePromptApi,
|
||
promptCountApi,
|
||
promptExchangeBatchApi,
|
||
boxOrderApi,
|
||
boxOrderPaidApi,
|
||
boxOrderReviewApi,
|
||
boxesDetail
|
||
} from '@/API/index.js'
|
||
import {
|
||
miscPromptApi
|
||
} from '@/API/user.js'
|
||
|
||
export default {
|
||
mixins: [myMixins],
|
||
data() {
|
||
return {
|
||
tipvisible: false,
|
||
// 第五条必中
|
||
swiperList: [], // swiper列表数据
|
||
targetIndex: 1, // 指定的目标索引值
|
||
current: 0,
|
||
autoplay: false,
|
||
isFrist: true, //刚进来
|
||
|
||
boxId: '',
|
||
type: '',
|
||
prompt: '', //提示语
|
||
promptId: '',
|
||
|
||
isTxt: false,
|
||
promptTotal: 0,
|
||
show: false,
|
||
buyShow:false,
|
||
quantity: 1,
|
||
timer: null,
|
||
couponId:'',
|
||
detailData:{},
|
||
isTopUp:false,
|
||
isTip:false,
|
||
promptDetail:{
|
||
amount:'',
|
||
method:'',
|
||
period:'',
|
||
purchase:false
|
||
},
|
||
typeObj:{
|
||
'NONE':'', 'POINTS':'积分', 'ALIPAY':'支付宝', 'WECHAT':'微信', 'COIN':'代币'
|
||
},
|
||
isActivity:''
|
||
}
|
||
},
|
||
components: {
|
||
HeaderCom,BuyBoxCom,coinDeficitCom
|
||
},
|
||
onLoad(option) {
|
||
this.boxId = option.boxId
|
||
this.type = option.type
|
||
if(option.activity){
|
||
this.activity = option.activity
|
||
}
|
||
// this.couponId = option.couponId
|
||
// this.useCk()
|
||
},
|
||
mounted() {
|
||
if(!this.activity){
|
||
this.getPromptCount()
|
||
this.getDetail()
|
||
// this.getMiscPrompt()
|
||
}
|
||
this.getMiscPrompt()
|
||
|
||
},
|
||
methods: {
|
||
getMiscPrompt(){
|
||
miscPromptApi().then(res => {
|
||
if(res.code === 200){
|
||
this.promptDetail = res.data
|
||
}else{
|
||
this.$api.msg(res.message)
|
||
}
|
||
})
|
||
},
|
||
// 代币不足
|
||
coinDeficit(){
|
||
this.isTopUp = true
|
||
},
|
||
closeTop(){
|
||
this.isTopUp = false
|
||
},
|
||
|
||
sucClose(){
|
||
this.isTopUp = false
|
||
this.isTip = true
|
||
setTimeout(() => {
|
||
this.isTip = false
|
||
},1500)
|
||
},
|
||
buySuccess(){
|
||
this.buyShow = false
|
||
},
|
||
// 获取盲盒详情
|
||
getDetail() {
|
||
boxesDetail({
|
||
id: this.boxId
|
||
}).then(res => {
|
||
if (res.code === 200) {
|
||
this.detailData = res.data
|
||
} else {
|
||
this.$api.msg(res.message)
|
||
}
|
||
})
|
||
},
|
||
// 减
|
||
sub() {
|
||
if (this.quantity === 1) {
|
||
this.$api.msg("不能小于1！");
|
||
return;
|
||
}
|
||
if (this.quantity > 1) {
|
||
this.quantity--
|
||
}
|
||
},
|
||
// 加
|
||
add() {
|
||
this.quantity++
|
||
},
|
||
// 是否有提示卡
|
||
getPromptCount() {
|
||
promptCountApi().then(res => {
|
||
if (res.code === 200) {
|
||
if (res.data === '0') {
|
||
// this.$api.msg('暂无提示卡')
|
||
this.promptTotal = 0
|
||
} else {
|
||
this.promptTotal = Number(res.data)
|
||
}
|
||
} else {
|
||
this.$api.msg(res.message)
|
||
}
|
||
|
||
})
|
||
},
|
||
// 购买提示卡
|
||
buyPrompt() {
|
||
if(!this.activity){
|
||
if(!this.promptDetail.purchase){
|
||
this.$api.msg('无法购买提示卡')
|
||
return
|
||
}}
|
||
this.show = true
|
||
},
|
||
confirmPromptBuy() {
|
||
uni.showLoading()
|
||
promptExchangeBatchApi({
|
||
quantity: this.quantity
|
||
}).then(res => {
|
||
uni.hideLoading()
|
||
this.$api.msg(res.message)
|
||
if (res.code === 200) {
|
||
this.getPromptCount()
|
||
this.show = false
|
||
} else {
|
||
|
||
}
|
||
}).catch(err => {
|
||
uni.hideLoading()
|
||
})
|
||
},
|
||
useCk() {
|
||
|
||
uni.showLoading()
|
||
usePromptApi({
|
||
boxId: this.boxId
|
||
}).then(res => {
|
||
uni.hideLoading()
|
||
// this.swiperList = ['Slide 1', 'Slide 2', 'Slide 3', 'Slide 4', 'Slide 5', 'Slide 7', 'Slide 8', 'Slide 9',
|
||
// 'Slide 10', 'Slide 11', 'Slide 12', 'Slide 13', 'Slide 14', 'Slide 15', 'Slide 16', 'Slide 17',
|
||
// 'Slide 18', 'Slide 19'
|
||
// ]
|
||
this.swiperList = []
|
||
if (res.code === 200) {
|
||
this.promptId = res.data.id
|
||
this.prompt = res.data.prompt
|
||
let prompts = res.data.prompts //提示卡列表
|
||
this.swiperList = prompts
|
||
|
||
if (prompts.length > 19) {
|
||
// processedthis.swiperListArray = prompts.slice(0, );
|
||
} else {
|
||
// const fillArray = new Array(19 - prompts.length).fill(`${prompts.length}`);
|
||
// this.swiperList = prompts.concat(fillArray);
|
||
}
|
||
|
||
// this.swiperList.splice(6,0,`${this.prompt}1`)
|
||
console.log(this.swiperList)
|
||
this.isFrist = false
|
||
this.$nextTick(() => {
|
||
this.autoplay = true
|
||
setTimeout(() => {
|
||
this.autoplay = false;
|
||
this.isTxt = true
|
||
// this.$refs.swiper.swiperTo(6, 0);
|
||
}, 2980)
|
||
})
|
||
} else {
|
||
this.$api.msg(res.message)
|
||
}
|
||
|
||
}).catch(err => {
|
||
uni.hideLoading()
|
||
})
|
||
},
|
||
again() {
|
||
// if(this.autoplay){
|
||
// return
|
||
// }
|
||
promptCountApi().then(res => {
|
||
if (res.data === '0') {
|
||
this.$api.msg('暂无提示卡')
|
||
this.getPromptCount()
|
||
this.isFrist = true
|
||
this.isTxt = false
|
||
return
|
||
} else {
|
||
this.isTxt = false
|
||
this.autoplay = false;
|
||
this.swiperList = []
|
||
this.useCk()
|
||
}
|
||
})
|
||
},
|
||
goBack() {
|
||
uni.navigateBack()
|
||
},
|
||
closeTip() {
|
||
this.tipvisible = false
|
||
},
|
||
submit() {
|
||
this.tipvisible = true
|
||
},
|
||
buy() {
|
||
// if(this.promptId){
|
||
// uni.redirectTo({
|
||
// url:`/pages/index/boxOrderConfirm?boxId=${this.boxId}&type=${this.type}&promptId=${this.promptId}`
|
||
// })
|
||
// }else{
|
||
// uni.redirectTo({
|
||
// url:`/pages/index/boxOrderConfirm?boxId=${this.boxId}&type=${this.type}`
|
||
// })
|
||
// }
|
||
this.buyShow = true
|
||
|
||
},
|
||
// 盲盒购买订单回调
|
||
getBoxOrderPaid(no) {
|
||
boxOrderPaidApi({
|
||
no
|
||
}).then(payResult => {
|
||
if (payResult.data) {
|
||
clearInterval(this.timer); // 清除定时器
|
||
this.timer = null;
|
||
this.$api.msg('支付成功')
|
||
let listLength = 1
|
||
if (this.previewData.type === 'SINGLE') {
|
||
listLength = 1
|
||
} else if (this.previewData.type === 'TRIPLE') {
|
||
listLength = 3
|
||
} else {
|
||
listLength = 5
|
||
}
|
||
uni.redirectTo({
|
||
url: `/pages/index/draw?no=${no}&boxId=${this.previewData.boxId}&type=${listLength}`
|
||
})
|
||
uni.hideLoading()
|
||
}
|
||
}).catch(err => {
|
||
clearInterval(this.timer); // 清除定时器
|
||
this.timer = null;
|
||
uni.hideLoading()
|
||
})
|
||
},
|
||
},
|
||
onUnload() {
|
||
// 在页面离开时清除定时器
|
||
clearInterval(this.timer);
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
page {}
|
||
|
||
.card-page {
|
||
height: 100vh;
|
||
padding-top: 112rpx;
|
||
background-image: url('@/static/new/tip/bg.png');
|
||
background-repeat: no-repeat;
|
||
background-size: 100%;
|
||
|
||
.main-gun {
|
||
background-image: url('@/static/new/tip/card-g.png');
|
||
background-repeat: no-repeat;
|
||
background-size: 100%;
|
||
height: 880rpx;
|
||
padding-top: 76rpx;
|
||
position: relative;
|
||
.shix{
|
||
width: 100%;
|
||
text-align: center;
|
||
font-size: 30rpx;
|
||
color: red;
|
||
position: absolute;bottom: 30rpx;
|
||
}
|
||
.title-icon {
|
||
display: block;
|
||
margin: 0 auto;
|
||
width: 112rpx;
|
||
height: 52rpx;
|
||
}
|
||
|
||
.heng {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
background-image: url('@/static/new/tip/heng.png');
|
||
background-repeat: no-repeat;
|
||
background-size: 100%;
|
||
height: 80rpx;
|
||
width: 416rpx;
|
||
position: absolute;
|
||
left: 166rpx;
|
||
top: 410rpx;
|
||
font-weight: 500;
|
||
font-size: 28rpx;
|
||
color: #528FCC;
|
||
z-index: 1;
|
||
}
|
||
|
||
.swiper {
|
||
width: 416rpx;
|
||
height: 512rpx;
|
||
position: absolute;
|
||
left: 166rpx;
|
||
top: 200rpx;
|
||
// margin-left: 166rpx;
|
||
// margin-top: 64rpx;
|
||
z-index: 2;
|
||
|
||
.swiper-item {
|
||
height: 72rpx;
|
||
z-index: 2;
|
||
|
||
.item {
|
||
z-index: 2;
|
||
height: 72rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-weight: 500;
|
||
font-size: 28rpx;
|
||
color: #528FCC;
|
||
}
|
||
}
|
||
|
||
.active-swiper-item {
|
||
height: 80rpx;
|
||
z-index: 2;
|
||
|
||
.item {
|
||
height: 80rpx;
|
||
font-weight: bold;
|
||
font-size: 28rpx;
|
||
color: #528FCC;
|
||
z-index: 2;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.main {
|
||
background-image: url('@/static/new/tip/big-card.png');
|
||
background-repeat: no-repeat;
|
||
background-size: 100%;
|
||
height: 880rpx;
|
||
padding-top: 76rpx;
|
||
|
||
.title-icon {
|
||
display: block;
|
||
margin: 0 auto;
|
||
width: 112rpx;
|
||
height: 52rpx;
|
||
}
|
||
|
||
.tip {
|
||
padding-top: 350rpx;
|
||
font-weight: 800;
|
||
font-size: 40rpx;
|
||
color: #143D66;
|
||
text-align: center;
|
||
}
|
||
|
||
.heng-icon {
|
||
|
||
background-image: url('@/static/new/tip/heng.png');
|
||
background-repeat: no-repeat;
|
||
background-size: 100%;
|
||
width: 416rpx;
|
||
height: 80rpx;
|
||
display: block;
|
||
margin: 24rpx auto 18rpx auto;
|
||
}
|
||
|
||
.sub {
|
||
text-align: center;
|
||
font-size: 24rpx;
|
||
color: #999999;
|
||
}
|
||
}
|
||
.immediate-view{
|
||
|
||
|
||
position: fixed;
|
||
bottom: 32rpx;
|
||
left: 32rpx;
|
||
width: 686rpx;
|
||
height: 96rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
.immediate {
|
||
|
||
width: 320rpx;
|
||
height: 96rpx;
|
||
background: linear-gradient(90deg, #39B2FF 0%, #3354FF 100%), #D9D9D9;
|
||
border-radius: 16rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-weight: bold;
|
||
font-size: 32rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
.activityClass{
|
||
width: 100%;
|
||
}
|
||
}
|
||
|
||
|
||
.footer {
|
||
position: fixed;
|
||
bottom: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
padding: 32rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
.loading-view{
|
||
position: fixed;
|
||
bottom: 0;
|
||
left: 0;
|
||
// background-color: red;
|
||
width: 100%;
|
||
height: 160rpx;
|
||
// height: 100%;
|
||
z-index: 10;
|
||
}
|
||
|
||
.again {
|
||
width: 328rpx;
|
||
height: 96rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 16rpx;
|
||
border: 2rpx solid #EBEBEB;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-size: 32rpx;
|
||
color: #666666;
|
||
}
|
||
|
||
.buy {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 328rpx;
|
||
height: 96rpx;
|
||
background: linear-gradient(90deg, #39B2FF 0%, #3354FF 100%), #D9D9D9;
|
||
border-radius: 16rpx;
|
||
font-weight: bold;
|
||
font-size: 32rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
}
|
||
|
||
.popup-main {
|
||
padding: 30rpx 22rpx;
|
||
// padding: 32rpx 32rpx 0rpx 32rpx;
|
||
z-index: 9991;
|
||
|
||
// max-height: 900rpx;
|
||
// position: relative;
|
||
.popup-header {
|
||
display: flex;
|
||
align-items: center;
|
||
height: 158rpx;
|
||
|
||
.popup-header-img {
|
||
width: 158rpx;
|
||
height: 158rpx;
|
||
border-radius: 10rpx;
|
||
}
|
||
|
||
.popup-info {
|
||
margin-left: 25rpx;
|
||
height: 128rpx;
|
||
font-weight: bold;
|
||
font-size: 28rpx;
|
||
color: #333333;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
flex-direction: column;
|
||
.popup-info-name {
|
||
|
||
width: 482rpx;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
text-overflow: ellipsis;
|
||
|
||
}
|
||
|
||
.popup-info-price {
|
||
margin-top: 60rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.popup-price {
|
||
display: flex;
|
||
align-items: center;
|
||
font-weight: 300;
|
||
font-size: 16rpx;
|
||
color: #888888;
|
||
margin-left: 20rpx;
|
||
height: 50rpx;
|
||
display: flex;
|
||
align-items: flex-end;
|
||
padding-bottom: 8rpx;
|
||
text-decoration: line-through;
|
||
|
||
.popup-symbol {
|
||
// font-size: 20rpx;
|
||
}
|
||
}
|
||
|
||
.popup-clover {
|
||
display: flex;
|
||
align-items: center;
|
||
font-weight: bold;
|
||
font-size: 42rpx;
|
||
color: #000000;
|
||
height: 50rpx;
|
||
|
||
.clover-img {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
margin-right: 6rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.popup-title {
|
||
color: #333333;
|
||
font-weight: 800;
|
||
font-size: 28rpx;
|
||
margin-top: 48rpx;
|
||
margin-bottom: 24rpx;
|
||
}
|
||
|
||
.specification-list {
|
||
// display: flex;
|
||
// align-items: center;
|
||
// flex-wrap: wrap;
|
||
|
||
width: 100%;
|
||
max-height: 600rpx;
|
||
margin-bottom: 50rpx;
|
||
padding-bottom: 220rpx;
|
||
overflow-y: auto;
|
||
|
||
.specification-item {
|
||
z-index: 9999;
|
||
display: inline-block;
|
||
padding: 0 64rpx;
|
||
// width: 200rpx;
|
||
height: 56rpx;
|
||
line-height: 56rpx;
|
||
border: 2rpx solid #B3B3BE;
|
||
border-radius: 28rpx;
|
||
// display: flex;
|
||
// align-items: center;
|
||
// justify-content: center;
|
||
font-size: 24rpx;
|
||
color: #B3B3BE;
|
||
margin-right: 32rpx;
|
||
margin-bottom: 32rpx;
|
||
}
|
||
|
||
.specification-item-active {
|
||
border: 2rpx solid #333333;
|
||
color: #333333;
|
||
}
|
||
}
|
||
|
||
.popup-footer {
|
||
z-index: 9999;
|
||
background-color: #fff;
|
||
// padding-bottom: 20rpx;
|
||
margin-top: 30rpx;
|
||
|
||
.footer-num {
|
||
// display: flex;
|
||
// align-items: center;
|
||
// justify-content: space-between;
|
||
z-index: 9999;
|
||
margin-top: 20rpx;
|
||
|
||
.footer-info {
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 28rpx;
|
||
font-weight: 800;
|
||
color: #333333;
|
||
|
||
.footer-info-num {
|
||
margin-left: 10rpx;
|
||
font-size: 24rpx;
|
||
color: #999999;
|
||
font-weight: 400;
|
||
}
|
||
}
|
||
|
||
.item-step {
|
||
margin-top: 17rpx;
|
||
z-index: 9999;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.item-sub {
|
||
width: 41rpx;
|
||
height: 41rpx;
|
||
}
|
||
|
||
.item-num {
|
||
width: 78rpx;
|
||
font-size: 28rpx;
|
||
color: #333333;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
|
||
.item-add {
|
||
width: 41rpx;
|
||
height: 41rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.now-buy {
|
||
z-index: 9999;
|
||
margin-top: 46rpx;
|
||
|
||
|
||
width: 706rpx;
|
||
height: 88rpx;
|
||
background: linear-gradient(90deg, #39B2FF 0%, #3354FF 100%), #D9D9D9;
|
||
border-radius: 16rpx;
|
||
|
||
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-size: 32rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.custom-toast{
|
||
position: fixed;
|
||
width: 100%;
|
||
height: 100vh;
|
||
top: 0;
|
||
left: 0;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
z-index: 999999;
|
||
.toast-txt{
|
||
z-index: 999999;
|
||
border-radius: 6rpx;
|
||
padding: 6rpx 26rpx;
|
||
background-color: rgba(0,0,0,0.8);
|
||
color: #fff;
|
||
font-size: 28rpx;
|
||
}
|
||
}
|
||
</style> |