websoft-uniapp仓库模板
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
10 KiB

<template>
<view>
<uni-section style="background: linear-gradient(#bddbfe, #ffffff)">
<uni-row class="team-item">
<uni-col :span="6">
<view class="team-item-image">
<uv-avatar
src="https://oss.wsdns.cn/20240612/0eb637277e5a4bff9d40b16ddb64b1f0.jpeg?x-oss-process=image/resize,m_fixed,w_750/quality,Q_90"
shape="square"
size="70"
randomBgColor
></uv-avatar>
</view>
</uni-col>
<uni-col :span="18">
<uv-cell :cellStyle="{ padding: '0' }" :border="false" @click="openUrl(`/package/team/info`)">
<template v-slot:title>
<uv-text text="技能大帅提升班" size="20"></uv-text>
</template>
<template v-slot:label>
<view>
<uni-tag text="技能大师工作室" size="mini" type="warning"></uni-tag>
</view>
</template>
<template v-slot:value>
<view>
<uni-icons type="right" size="20"></uni-icons>
</view>
</template>
</uv-cell>
</uni-col>
</uni-row>
<uv-gap height="20"></uv-gap>
<view class="team-item-desc web-text-secondary">
<uv-text
:lines="2"
text="搜索世界各地美食,美食研究所“只做安心食品”,让用户买得放心,吃得安心。本团队为美食研究所唯一官方社群,集结各地美食家。轻松愉悦的社群环境,大胆畅聊品质生活、共同分享独到的美食品鉴感受。"
></uv-text>
</view>
<uv-gap height="10"></uv-gap>
<view class="team-item-info-avatar-group">
<uv-avatar-group :urls="urls" size="24" gap="0.5"></uv-avatar-group>
<uv-text class="web-text-secondary" style="padding-left: 16rpx" text="506成员在学习"></uv-text>
</view>
<uv-gap height="20"></uv-gap>
<view class="save-btn-bar">
<uv-button class="save-btn"
:customStyle="{background: 'linear-gradient(to right, #c8fffe, #5fccfb)',borderRadius: '30px',color: '#ffffff', border: 'none', padding: '22px 30px'}"
text="申请加入"></uv-button>
<uv-gap height="20"></uv-gap>
</view>
</uni-section>
<uv-sticky bgColor="#fff">
<uv-tabs :list="list" @click="onTabs"></uv-tabs>
</uv-sticky>
<block v-if="index == 0">
<uni-section :title="name">
<uni-list>
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="人才调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="能力调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="满意调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="人才调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="能力调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="满意调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="人才调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="能力调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="满意调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="人才调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="能力调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="满意调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="人才调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="能力调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="满意调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="人才调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="能力调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="满意调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="人才调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="能力调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="满意调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="人才调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="能力调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="满意调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="人才调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="能力调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="满意调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="人才调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="能力调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="满意调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="人才调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="能力调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="满意调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="人才调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="能力调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="满意调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="人才调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="能力调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="满意调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="人才调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="能力调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="满意调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="人才调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="能力调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="满意调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="人才调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="能力调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="满意调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="人才调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="能力调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="满意调研" />
</uni-list>
</uni-section>
</block>
<block v-if="index == 1">
<uni-section :title="name">
<uni-list>
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="人才调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="能力调研" />
<uni-list-item thumb="https://oss.wsdns.cn/20240607/6f446190344b471ca8363523cfd2546b.png" link title="满意调研" />
</uni-list>
</uni-section>
</block>
</view>
</template>
<script>
export default {
data() {
return {
index: 0,
name: '学习任务',
list: [
{
name: '学习任务'
},
{
name: '动态'
},
{
name: '课件'
},
{
name: '新闻'
},
{
name: '相册'
},
{
name: '知识开发'
},
{
name: '积分排行榜'
},
{
name: '团队仪表盘'
}
],
urls: [
'https://cdn.uviewui.com/uview/album/1.jpg',
'https://cdn.uviewui.com/uview/album/2.jpg',
'https://cdn.uviewui.com/uview/album/3.jpg',
'https://cdn.uviewui.com/uview/album/4.jpg',
'https://cdn.uviewui.com/uview/album/7.jpg',
'https://cdn.uviewui.com/uview/album/6.jpg',
'https://cdn.uviewui.com/uview/album/5.jpg'
]
};
},
methods: {
onTabs(e) {
this.index = e.index;
this.name = e.name;
},
openUrl(url) {
uni.navigateTo({
url
});
}
}
};
</script>
<style lang="scss">
.team-item {
padding: 0 16rpx;
&-info {
margin-bottom: 6rpx;
&-avatar-group {
display: flex;
width: 680rpx;
margin: 0rpx auto;
}
}
&-image {
display: flex;
justify-content: center;
}
&-info-title{
font-size: 38rpx;
font-weight: 400;
}
&:before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.1);
}
}
.team-item-desc{
width: 680rpx;
margin: auto;
}
.save-btn-bar{
width: 400rpx;
margin: auto;
}
.news-activity {
padding: 0 20rpx;
display: flex;
align-items: center;
}
.more-team {
text-align: center;
font-size: 28rpx;
}
</style>