百富门答题小程序
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

73 lines
1.5 KiB

<template>
<view class="home">
<view class="content">
<span class="font-bold mb-60">您是否有品鉴威士忌的习惯?</span>
<view class="mian-btn" :class="{active:isActive === 'yes'}" @click="setActive('yes')"></view>
<view class="mian-btn" :class="{active:isActive === 'no'}" @click="setActive('no')"></view>
<view class="b-btn mt-60">
<view class="pre-btn">
上一题
</view>
<view class="next-btn" @click="next">
下一题
</view>
</view>
<text class="second-color">欢快无限饮&nbsp;&nbsp;饮酒有限度</text>
</view>
</view>
</template>
<script>
export default {
data() {
return {
isActive:null
}
},
methods: {
setActive(value){
this.isActive = value
},
next(){
if(this.isActive!==null){
uni.navigateTo({
url:'/pages_order/info/chooseArea'
})
}else{
uni.showToast({
title:'请选择后进行下一题',
icon: 'none'
})
}
}
}
}
</script>
<style lang="scss" scoped>
.b-btn{
width: 86%;
display: flex;
justify-content: space-between;
padding-top: 20vh;
.pre-btn{
border: 4rpx solid #f1e0c6;
padding: 16rpx 90rpx;
border-radius: 66rpx;
color: #e6bf7f;
}
.next-btn{
background-image: url('../../static/image/home/btn.png');
background-size: contain;
background-repeat: no-repeat;
background-position: center;
width: 40vw;
display: flex;
align-items: center;
justify-content: center;
color: white;
}
}
</style>