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.
230 lines
4.7 KiB
230 lines
4.7 KiB
<template>
|
|
<view class="buyOne">
|
|
<view class="buyOne-con" v-for="(a,i) in categoryList" :key="i">
|
|
<view class="name">{{a.name}}
|
|
<view class="r" :class="a.is_buy ==1?'r-on':''" @click="a.is_buy!=0?'':openPage(1,a,1)">{{a.is_buy ==1?'已购买':'¥'+a.price}}</view>
|
|
</view>
|
|
<view class="ul" v-for="(b,idx) in a.children" :key="idx">
|
|
<view class="a">
|
|
<view class="l">
|
|
{{b.name}}
|
|
</view>
|
|
<view class="r" :class="b.is_buy ==1?'r-on':''" @click="b.is_buy!=0?'':openPage(1,a,2,idx)">{{b.is_buy ==1?'已购买':'¥'+b.price}}</view>
|
|
</view>
|
|
<view class="b">
|
|
<view class="li" v-for="(c,idx1) in b.children" :key="idx1">
|
|
<view class="l">
|
|
{{c.name}}
|
|
</view>
|
|
<view class="r" @click="c.is_buy!=0?'':openPage(1,b,3,idx,idx1)" :class="c.is_buy ==1?'r-on':''">{{c.is_buy ==1?'已购买':'¥'+c.price}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="buyOne-bottom">
|
|
<image @click="openPage(2)" :src="staticUrl('/static/buy-01.png')"></image>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
categoryList: []
|
|
};
|
|
},
|
|
onShow(o) {
|
|
this.getList();
|
|
},
|
|
methods: {
|
|
openPage(index,a,type,idx,idx1) {
|
|
if(index == 1){
|
|
if(!uni.getStorageSync("userToken")){
|
|
uni.navigateTo({
|
|
url: "/pages/login/login"
|
|
})
|
|
return ;
|
|
}
|
|
a.idx = idx
|
|
a.idx1 = idx1
|
|
a.type = type
|
|
console.log(index,a,type,idx,idx1);
|
|
uni.setStorageSync("teamInfo",a)
|
|
uni.navigateTo({
|
|
url: "/pages/question/buyTwo"
|
|
})
|
|
}else if(index == 2){
|
|
if(!uni.getStorageSync('userToken')){
|
|
uni.navigateTo({
|
|
url: "/pages/login/login"
|
|
})
|
|
return ;
|
|
}
|
|
uni.navigateTo({
|
|
url: "/pages/question/list"
|
|
})
|
|
}
|
|
},
|
|
//获取列表
|
|
async getList() {
|
|
uni.showLoading({
|
|
title: "加载中"
|
|
})
|
|
const { code, data, msg } = await this.$api.categoryTreeList({})
|
|
if (code == 200) {
|
|
uni.hideLoading();
|
|
this.categoryList =data;
|
|
} else {
|
|
uni.hideLoading()
|
|
uni.showToast({
|
|
icon: "none",
|
|
title: msg
|
|
})
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
.buyOne{
|
|
width: 100%;
|
|
padding: 0 25rpx 280rpx;
|
|
overflow: hidden;
|
|
box-sizing: border-box;
|
|
&-con {
|
|
margin-top: 20rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 20rpx;
|
|
box-sizing: border-box;
|
|
padding: 0 30rpx;
|
|
.name{
|
|
font-size: 34rpx;
|
|
font-weight: bold;
|
|
padding-top: 20rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
.r {
|
|
font-weight: normal;
|
|
width: 100rpx;
|
|
height: 40rpx;
|
|
line-height: 40rpx;
|
|
background: #FFFFFF;
|
|
border: 1px solid #F01B1B;
|
|
border-radius: 40rpx;
|
|
font-size: 22rpx;
|
|
color: #F01B1B;
|
|
display: block;
|
|
text-align: center;
|
|
margin-left: 20rpx;
|
|
&-on {
|
|
width: 100rpx;
|
|
padding: 0;
|
|
border-color: #EAEAEA;
|
|
background: #EAEAEA;
|
|
color: #222222;
|
|
}
|
|
}
|
|
}
|
|
.a {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
border-bottom: 1px solid #EAEAEA;
|
|
padding: 20rpx 0;
|
|
.l {
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: 30rpx;
|
|
font-weight: 400;
|
|
color: #222222;
|
|
line-height: 40rpx;
|
|
|
|
image {
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
margin-right: 18rpx;
|
|
}
|
|
|
|
}
|
|
|
|
.r {
|
|
height: 40rpx;
|
|
width: 100rpx;
|
|
line-height: 40rpx;
|
|
background: #FFFFFF;
|
|
border: 1px solid #F01B1B;
|
|
border-radius: 40rpx;
|
|
font-size: 22rpx;
|
|
color: #F01B1B;
|
|
display: block;
|
|
text-align: center;
|
|
margin-left: 20rpx;
|
|
&-on {
|
|
width: 100rpx;
|
|
padding: 0;
|
|
border-color: #EAEAEA;
|
|
background: #EAEAEA;
|
|
color: #222222;
|
|
}
|
|
}
|
|
}
|
|
.b {
|
|
.li{
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding: 20rpx 0;
|
|
}
|
|
.l {
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: 30rpx;
|
|
font-weight: 400;
|
|
color: #222222;
|
|
line-height: 40rpx;
|
|
|
|
image {
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
margin-right: 18rpx;
|
|
}
|
|
}
|
|
.r {
|
|
height: 40rpx;
|
|
width: 100rpx;
|
|
line-height: 40rpx;
|
|
background: #FFFFFF;
|
|
border: 1px solid #F01B1B;
|
|
border-radius: 40rpx;
|
|
font-size: 22rpx;
|
|
color: #F01B1B;
|
|
display: block;
|
|
text-align: center;
|
|
margin-left: 20rpx;
|
|
|
|
&-on {
|
|
width: 100rpx;
|
|
padding: 0;
|
|
border-color: #EAEAEA;
|
|
background: #EAEAEA;
|
|
color: #222222;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
&-bottom{
|
|
position: fixed;
|
|
bottom:0;
|
|
width: 100%;
|
|
text-align: right;
|
|
image{
|
|
width: 151rpx;
|
|
height: 151rpx;
|
|
margin-right: 5%;
|
|
}
|
|
}
|
|
}
|
|
</style> |