576 lines
14 KiB
Vue
576 lines
14 KiB
Vue
|
<template>
|
|||
|
|
<view class="page">
|
|||
|
|
<u-navbar title="拼桌" :border-bottom="false" :background="bgc" back-icon-color="#fff" title-color='#fff'
|
|||
|
|
title-size='36' height='36' id="navbar">
|
|||
|
|
</u-navbar>
|
|||
|
|
<view class="tab">
|
|||
|
|
<view class="top">
|
|||
|
|
<view class="">
|
|||
|
|
<image src="https://api.ccttiot.com/smartmeter/img/static/uGaLZEBgL84ajaRfZ3Ja" mode=""></image>深度酒吧
|
|||
|
|
</view>
|
|||
|
|
<view class="" style="color: #B8B8B8;text-decoration: underline;" @click="btnjilu">
|
|||
|
|
我的记录
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="bot">
|
|||
|
|
<view :class="tabindex == 1 ? 'active' : ''" @click="btntab(1)">
|
|||
|
|
现场拼桌
|
|||
|
|
<view class="" v-if="tabindex == 1"></view>
|
|||
|
|
</view>
|
|||
|
|
<view :class="tabindex == 2 ? 'active' : ''" @click="btntab(2)">
|
|||
|
|
预约拼桌
|
|||
|
|
<view class="" v-if="tabindex == 2"></view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="bd" v-if="dateflag" @click="btnchaxun">
|
|||
|
|
<view class="bdtop">
|
|||
|
|
<image src="https://api.ccttiot.com/smartmeter/img/static/uFfH3gMS0VJVIvFPFzRR" class="bj" mode=""></image>
|
|||
|
|
<view class="fabu">
|
|||
|
|
发布拼桌，找人一起玩
|
|||
|
|
</view>
|
|||
|
|
<view class="myxx">
|
|||
|
|
<view class="myimg">
|
|||
|
|
<image class="tx" :src="teamobj.sponsorAvatar == null ? 'https://api.ccttiot.com/smartmeter/img/static/uykK7yDBpbUQoLZFZlXo' : teamobj.sponsorAvatar" mode=""></image>
|
|||
|
|
<image class="xb" src="https://api.ccttiot.com/smartmeter/img/static/urkC56KUGEuJxuV58Foa" mode=""></image>
|
|||
|
|
<image class="xb" src="https://api.ccttiot.com/smartmeter/img/static/uK5bsCu9k1JFbVfIINRV" mode=""></image>
|
|||
|
|
</view>
|
|||
|
|
<view class="myname">
|
|||
|
|
<view class="wo">
|
|||
|
|
<text v-if="teamtwoobj.userId == teamobj.sponsorId">我</text> {{teamobj.name}}
|
|||
|
|
</view>
|
|||
|
|
<view class="zhuohao">
|
|||
|
|
当前桌号：{{teamobj.boothName}}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="bdbot">
|
|||
|
|
<view class="lt">
|
|||
|
|
正在拼 : {{ dots }}
|
|||
|
|
</view>
|
|||
|
|
<view class="cen">
|
|||
|
|
（ <text>{{teamobj.currentNum}}</text> / {{teamobj.limitNum == null ? 0 : teamobj.limitNum}} · <text>拼桌成功</text> ）
|
|||
|
|
</view>
|
|||
|
|
<view class="rt">
|
|||
|
|
<image src="https://api.ccttiot.com/smartmeter/img/static/uYtfNn24hW5c7V1upB2T" mode=""></image>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="yuyue" v-else @click="btnfabu">
|
|||
|
|
<image class="bj" src="https://api.ccttiot.com/smartmeter/img/static/uKUaflogbDvZoaRlGXhL" mode=""></image>
|
|||
|
|
<view class="wenzi">
|
|||
|
|
<view class="top">
|
|||
|
|
发布拼桌，找人一起玩
|
|||
|
|
</view>
|
|||
|
|
<view class="duoshao">
|
|||
|
|
<view class="img">
|
|||
|
|
<image v-for="(img, index) in randomImages" :key="index" :src="img" mode=""></image>
|
|||
|
|
</view>
|
|||
|
|
<text style="margin-left: 30rpx;">快来一起发起拼桌吧</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="xzname">
|
|||
|
|
{{tabindex == 1 ? '现成拼桌池' : '预约拼桌池'}}
|
|||
|
|
</view>
|
|||
|
|
<view class="list">
|
|||
|
|
<view class="item_list" v-for="(item,index) in pinzhuolist" :key="index">
|
|||
|
|
<view class="top">
|
|||
|
|
{{item.name}}
|
|||
|
|
</view>
|
|||
|
|
<view class="myxx">
|
|||
|
|
<view class="myimg">
|
|||
|
|
<image class="tx" :src="item.sponsorAvatar" mode=""></image>
|
|||
|
|
<image v-if="item.sponsorSex == 1" class="xb" src="https://api.ccttiot.com/smartmeter/img/static/urkC56KUGEuJxuV58Foa" mode=""></image>
|
|||
|
|
<image v-if="item.sponsorSex == 0" class="xb" src="https://api.ccttiot.com/smartmeter/img/static/uK5bsCu9k1JFbVfIINRV" mode=""></image>
|
|||
|
|
</view>
|
|||
|
|
<view class="myname">
|
|||
|
|
<view class="wo" v-if="user.userId == item.sponsorId">
|
|||
|
|
<text>我</text> {{item.sponsorName}}
|
|||
|
|
</view>
|
|||
|
|
<view class="zhuohao">
|
|||
|
|
桌号：{{item.boothName}}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="jairu">
|
|||
|
|
<image :src="i" mode=""></image>
|
|||
|
|
已加{{item.currentNum == null ? '0' : item.currentNum}}人 | 剩余<text style="color: #FF8998;">{{Number(item.limitNum == null ? 0 : item.limitNum) - Number(item.currentNum == null ? 0 : item.currentNum)}}</text>人
|
|||
|
|
</view>
|
|||
|
|
<view class="jairu">
|
|||
|
|
<image src="https://api.ccttiot.com/smartmeter/img/static/uQJLuuCQzeAGrFQ995Nm" mode=""></image>
|
|||
|
|
{{item.prefer == 1 ? '偏好男性' : item.prefer == 2 ? '偏好女性' : '男女不限'}}
|
|||
|
|
</view>
|
|||
|
|
<!-- <view class="anniu">
|
|||
|
|
进入群聊
|
|||
|
|
</view> -->
|
|||
|
|
<view class="anniu" v-if="dateflag" style="background-color: #ccc;color: #fff;" @click="btnjrpz(item)">
|
|||
|
|
加入拼桌
|
|||
|
|
</view>
|
|||
|
|
<view class="anniu" v-else style="background-color: #FF8998;color: #fff;" @click="btnjrpz(item)">
|
|||
|
|
加入拼桌
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="wu" style="width: 480rpx;height: 370rpx;margin: auto;margin-top: 80rpx;" v-if="pinzhuolist.length == 0">
|
|||
|
|
<image style="width: 480rpx;height: 370rpx;" src="https://api.ccttiot.com/smartmeter/img/static/uQziwcKvCYhaHoaw5u93" mode=""></image>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
bgc: {
|
|||
|
|
backgroundColor: "#010000",
|
|||
|
|
},
|
|||
|
|
tabindex:1,
|
|||
|
|
pinzhuolist:[],
|
|||
|
|
user:'',
|
|||
|
|
teamobj:{},
|
|||
|
|
teamtwoobj:{},
|
|||
|
|
dateflag:false,
|
|||
|
|
dots: '.',
|
|||
|
|
timer: null,
|
|||
|
|
// 添加所有可选的图片数组
|
|||
|
|
allImages: [
|
|||
|
|
'https://api.ccttiot.com/smartmeter/img/static/uW6Nsdsbk3cm0JZcYdZ3',
|
|||
|
|
'https://api.ccttiot.com/smartmeter/img/static/u7ZMnMLrVfVloU1aQqlk',
|
|||
|
|
'https://api.ccttiot.com/smartmeter/img/static/uL3sR8uy6FQGX1WJlcuc',
|
|||
|
|
'https://api.ccttiot.com/smartmeter/img/static/uXnB3jfIGCwoAIGcNPsC',
|
|||
|
|
'https://api.ccttiot.com/smartmeter/img/static/uMo03QdTdngUdZXCXZLx',
|
|||
|
|
'https://api.ccttiot.com/smartmeter/img/static/uVbSWjNqRhZPiho4AIiJ',
|
|||
|
|
'https://api.ccttiot.com/smartmeter/img/static/uac9z9s7LPIMjidGwEUU',
|
|||
|
|
'https://api.ccttiot.com/smartmeter/img/static/uJPWutuFYeOejOAXn8FI',
|
|||
|
|
'https://api.ccttiot.com/smartmeter/img/static/uc95pV4gpCPfacUT56Sb',
|
|||
|
|
'https://api.ccttiot.com/smartmeter/img/static/uw3LumlMvIFxoR46Nk2M',
|
|||
|
|
'https://api.ccttiot.com/smartmeter/img/static/uWWUYfXUOpWsDGKO2cXT',
|
|||
|
|
'https://api.ccttiot.com/smartmeter/img/static/uuMZ9EM9dNIxvJJQ8PyG',
|
|||
|
|
'https://api.ccttiot.com/smartmeter/img/static/uAgBadpkh4G5w2ICo3Ri',
|
|||
|
|
'https://api.ccttiot.com/smartmeter/img/static/uQbjOPxJQsghlY79wutq',
|
|||
|
|
'https://api.ccttiot.com/smartmeter/img/static/u2ZFV9n4icW2oQr3rXPj',
|
|||
|
|
'https://api.ccttiot.com/smartmeter/img/static/ulR8mk1SEOghBK40NV6a',
|
|||
|
|
'https://api.ccttiot.com/smartmeter/img/static/uJpyxbAjX1iI0qRfXxHj',
|
|||
|
|
'https://api.ccttiot.com/smartmeter/img/static/uoxy6mhPIFyO2ojpEPNW',
|
|||
|
|
],
|
|||
|
|
// 随机选择的4张图片
|
|||
|
|
randomImages: []
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onLoad() {
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
onShow() {
|
|||
|
|
this.getdangqian()
|
|||
|
|
this.getinfo()
|
|||
|
|
this.getlist()
|
|||
|
|
this.getRandomImages() // 添加获取随机图片的调用
|
|||
|
|
},
|
|||
|
|
mounted() {
|
|||
|
|
this.timer = setInterval(() => {
|
|||
|
|
this.dots = this.dots.length >= 3 ? '.' : this.dots + '.'
|
|||
|
|
}, 500)
|
|||
|
|
},
|
|||
|
|
beforeDestroy() {
|
|||
|
|
clearInterval(this.timer)
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
// 查询是否有拼桌
|
|||
|
|
getdangqian(){
|
|||
|
|
this.$u.get(`/app/team/myTeam`).then(res => {
|
|||
|
|
if (res.code == 200) {
|
|||
|
|
this.teamtwoobj = res.data
|
|||
|
|
if (res.data) {
|
|||
|
|
this.teamobj = res.data.team
|
|||
|
|
this.dateflag = true
|
|||
|
|
}else{
|
|||
|
|
this.dateflag = false
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 获取个人信息
|
|||
|
|
getinfo(){
|
|||
|
|
this.$u.get(`/getInfo`).then(res => {
|
|||
|
|
if (res.code == 200) {
|
|||
|
|
this.user = res.user
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 点击跳转到发布拼桌
|
|||
|
|
btnfabu(){
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url:'/page_user/pingzhuo/cjpinzhuo?type=' + this.tabindex
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 请求拼桌列表
|
|||
|
|
getlist(){
|
|||
|
|
this.$u.get(`/app/team/getTeamList?pageNum=1&pageSize=99&type=${this.tabindex}`).then(res =>{
|
|||
|
|
if(res.code == 200){
|
|||
|
|
this.pinzhuolist = res.rows
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 点击切换tab
|
|||
|
|
btntab(num){
|
|||
|
|
this.tabindex = num
|
|||
|
|
this.getlist()
|
|||
|
|
},
|
|||
|
|
// 点击我的记录
|
|||
|
|
btnjilu(){
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url:'/page_user/pingzhuo/jilu?userid=' + this.user.userId
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 点击进入我的拼桌详情
|
|||
|
|
btnchaxun(){
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url:'/page_user/pingzhuo/zhuozixq?teamId=' + this.teamobj.id
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 点击加入拼桌
|
|||
|
|
btnjrpz(item){
|
|||
|
|
this.$u.post(`/app/team/joinTeam?teamId=${item.id}`).then(res =>{
|
|||
|
|
if(res.code == 200){
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url:'/page_user/pingzhuo/zhuozixq?teamId=' + item.id
|
|||
|
|
})
|
|||
|
|
}else{
|
|||
|
|
uni.showToast({
|
|||
|
|
title: res.msg,
|
|||
|
|
icon: 'none',
|
|||
|
|
duration:2000
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 获取随机图片
|
|||
|
|
getRandomImages() {
|
|||
|
|
// 复制原数组
|
|||
|
|
let tempArray = [...this.allImages]
|
|||
|
|
// 随机选择4张图片
|
|||
|
|
this.randomImages = []
|
|||
|
|
for(let i = 0; i < 4; i++) {
|
|||
|
|
if(tempArray.length > 0) {
|
|||
|
|
const randomIndex = Math.floor(Math.random() * tempArray.length)
|
|||
|
|
this.randomImages.push(tempArray[randomIndex])
|
|||
|
|
tempArray.splice(randomIndex, 1)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss">
|
|||
|
|
page {
|
|||
|
|
background: #010000;
|
|||
|
|
padding-bottom: 50rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
}
|
|||
|
|
.active{
|
|||
|
|
font-weight: 600;
|
|||
|
|
font-size: 32rpx !important;
|
|||
|
|
color: #FFFFFF !important;
|
|||
|
|
}
|
|||
|
|
.yuyue{
|
|||
|
|
width: 700rpx;
|
|||
|
|
height: 202rpx;
|
|||
|
|
position: relative;
|
|||
|
|
margin: auto;
|
|||
|
|
margin-top: 42rpx;
|
|||
|
|
.wenzi{
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
left: 0;
|
|||
|
|
padding: 36rpx 32rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
.top{
|
|||
|
|
font-weight: 600;
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
}
|
|||
|
|
.duoshao{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
margin-top: 44rpx;
|
|||
|
|
.img{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
image{
|
|||
|
|
width: 34rpx;
|
|||
|
|
height: 34rpx;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
margin-left: -10rpx;
|
|||
|
|
filter: blur(10px);
|
|||
|
|
-webkit-filter: blur(1px);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.bj{
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 700rpx;
|
|||
|
|
height: 202rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.list{
|
|||
|
|
width: 100%;
|
|||
|
|
padding: 0 24rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
.item_list{
|
|||
|
|
width: 340rpx;
|
|||
|
|
height: 344rpx;
|
|||
|
|
background: #1C1C1E;
|
|||
|
|
border-radius: 14rpx 14rpx 14rpx 14rpx;
|
|||
|
|
padding: 26rpx 22rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
margin-top: 22rpx;
|
|||
|
|
.anniu{
|
|||
|
|
width: 296rpx;
|
|||
|
|
height: 56rpx;
|
|||
|
|
background: #322C2D;
|
|||
|
|
border-radius: 6rpx 6rpx 6rpx 6rpx;
|
|||
|
|
font-weight: 600;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: #FF8998;
|
|||
|
|
text-align: center;
|
|||
|
|
line-height: 56rpx;
|
|||
|
|
margin-top: 18rpx;
|
|||
|
|
}
|
|||
|
|
.top{
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
}
|
|||
|
|
.jairu{
|
|||
|
|
margin-top: 22rpx;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
image{
|
|||
|
|
width: 22rpx;
|
|||
|
|
height: 22rpx;
|
|||
|
|
margin-right: 10rpx;
|
|||
|
|
}
|
|||
|
|
font-size: 22rpx;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
}
|
|||
|
|
.myxx{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
margin-top: 26rpx;
|
|||
|
|
.myname{
|
|||
|
|
.zhuohao{
|
|||
|
|
font-weight: 600;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
}
|
|||
|
|
.wo{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
text{
|
|||
|
|
width: 24rpx;
|
|||
|
|
height: 24rpx;
|
|||
|
|
background: linear-gradient( 135deg, #76FF8E 0%, #BAFFE5 100%);
|
|||
|
|
border-radius: 6rpx 6rpx 6rpx 6rpx;
|
|||
|
|
font-size: 16rpx;
|
|||
|
|
color: #1D5013;
|
|||
|
|
text-align: center;
|
|||
|
|
line-height: 24rpx;
|
|||
|
|
margin-right: 8rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.myimg{
|
|||
|
|
width: 62rpx;
|
|||
|
|
height: 62rpx;
|
|||
|
|
position: relative;
|
|||
|
|
margin-right: 30rpx;
|
|||
|
|
.tx{
|
|||
|
|
width: 62rpx;
|
|||
|
|
height: 62rpx;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
}
|
|||
|
|
.xb{
|
|||
|
|
width: 26rpx;
|
|||
|
|
height: 26rpx;
|
|||
|
|
position: absolute;
|
|||
|
|
bottom: 0;
|
|||
|
|
right: 0;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.xzname{
|
|||
|
|
font-weight: 600;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
width: 700rpx;
|
|||
|
|
margin: auto;
|
|||
|
|
margin-top: 42rpx;
|
|||
|
|
}
|
|||
|
|
.bd{
|
|||
|
|
width: 700rpx;
|
|||
|
|
height: 284rpx;
|
|||
|
|
margin: auto;
|
|||
|
|
margin-top: 42rpx;
|
|||
|
|
position: relative;
|
|||
|
|
.bdbot{
|
|||
|
|
position: absolute;
|
|||
|
|
bottom:0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 700rpx;
|
|||
|
|
height: 82rpx;
|
|||
|
|
background: #1C1C1E;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
align-items:center;
|
|||
|
|
padding: 26rpx 40rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
border-radius: 0 0 24rpx 24rpx;
|
|||
|
|
.lt{
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
width: 200rpx;
|
|||
|
|
}
|
|||
|
|
.cen{
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
text{
|
|||
|
|
color: #FF8998;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.rt{
|
|||
|
|
image{
|
|||
|
|
width: 32rpx;
|
|||
|
|
height: 32rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.bdtop{
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
left: 0;
|
|||
|
|
padding: 36rpx 32rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
.myxx{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
margin-top: 26rpx;
|
|||
|
|
.myname{
|
|||
|
|
.zhuohao{
|
|||
|
|
font-weight: 600;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
}
|
|||
|
|
.wo{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
text{
|
|||
|
|
width: 24rpx;
|
|||
|
|
height: 24rpx;
|
|||
|
|
background: linear-gradient( 135deg, #76FF8E 0%, #BAFFE5 100%);
|
|||
|
|
border-radius: 6rpx 6rpx 6rpx 6rpx;
|
|||
|
|
font-size: 16rpx;
|
|||
|
|
color: #1D5013;
|
|||
|
|
text-align: center;
|
|||
|
|
line-height: 24rpx;
|
|||
|
|
margin-right: 8rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.myimg{
|
|||
|
|
width: 62rpx;
|
|||
|
|
height: 62rpx;
|
|||
|
|
position: relative;
|
|||
|
|
margin-right: 30rpx;
|
|||
|
|
.tx{
|
|||
|
|
width: 62rpx;
|
|||
|
|
height: 62rpx;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
}
|
|||
|
|
.xb{
|
|||
|
|
width: 16rpx;
|
|||
|
|
height: 16rpx;
|
|||
|
|
position: absolute;
|
|||
|
|
bottom: 0;
|
|||
|
|
right: 0;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.fabu{
|
|||
|
|
font-weight: 600;
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
}
|
|||
|
|
.bj{
|
|||
|
|
width: 700rpx;
|
|||
|
|
height: 202rpx;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
left: 0;
|
|||
|
|
z-index: -1;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.tab{
|
|||
|
|
width: 750rpx;
|
|||
|
|
height: 180rpx;
|
|||
|
|
background: #1C1C1E;
|
|||
|
|
border-radius: 0rpx 0rpx 0rpx 0rpx;
|
|||
|
|
padding-top: 24rpx;
|
|||
|
|
padding-left: 52rpx;
|
|||
|
|
padding-right: 52rpx;
|
|||
|
|
padding-bottom: 28rpx;
|
|||
|
|
margin-top: 28rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
color: #fff;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
.bot{
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
padding: 0 140rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
color: #808080;
|
|||
|
|
margin-top: 38rpx;
|
|||
|
|
view{
|
|||
|
|
view{
|
|||
|
|
width: 40rpx;
|
|||
|
|
height: 6rpx;
|
|||
|
|
background: #FF8998;
|
|||
|
|
border-radius: 5rpx 5rpx 5rpx 5rpx;
|
|||
|
|
margin: auto;
|
|||
|
|
margin-top: 10rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.top{
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
view{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
image{
|
|||
|
|
width: 26rpx;
|
|||
|
|
height: 26rpx;
|
|||
|
|
margin-right: 14rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
</style>
|