刮刮前端
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.
 
 
 
 

92 lines
1.7 KiB

<template>
<view>
<view class="nav_area"></view>
<view class="setPage">
<view class="switch_item" v-for="(item, index) in datasList" @click="toSet">
<view class="icon_new"><image src="" mode=""></image></view>
<view style="flex:1;">
<view class=""><text>面值:</text>{{amount}}</view>
<view style="font-size: 12px;"><text>最高中奖金额</text>20</view>
</view>
<switch checked="true" @change="" color="#00E266" @click.stop="" />
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
datasList: [1,2,3],
amount: '',
}
},
methods: {
toSet(){
uni.navigateTo({
url: '/pages/about/bonusSet/bonusSet'
})
}
},
onLoad(e) {
uni.setNavigationBarTitle({
title: e.title
})
this.amount = e.title.split('专区')[0];
}
}
</script>
<style lang="scss" scoped>
.nav_area {
position: fixed;
top: 0px;
left: 0px;
z-index: 99;
background-color: #fff;
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.05);
width: 700rpx;
height: 88rpx;
padding: 0px 25rpx;
padding-top: var(--status-bar-height);
box-sizing: content-box;
color: #b0b0b0;
font-size: 14px;
}
.setPage{
padding: 40rpx;
font-size: 14px;
color: #444;
}
.switch_item{
height: 132rpx;
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 40rpx;
line-height: 60rpx;
.icon_new{
width: 240rpx;
height: 132rpx;
margin-right: 20rpx;
image{
width: 240rpx;
height: 132rpx;
border-radius: 5px;
background-color: #000;
}
}
text{
color: #999;
}
switch{
scale: (0.8);
transform-origin: 100% 50%;//垂直居中、靠右
}
}
</style>