MoeJue/douyin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化uploader页面

Browse Source
This commit is contained in:
zyronon 2021-09-06 01:15:04 +08:00
parent a16d3c9dac
commit 4a36eec3fc
2 changed files with 71 additions and 89 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
src/pages/me/Uploader.less
View File

@ -360,24 +360,71 @@
.my-buttons {
display: flex;
justify-content: space-between;
align-items: center;
@width: 3.6rem;
.button {
.no-follow {
color: white;
border-radius: .2rem;
background: @primary-btn-color;
flex: 1;
height: @width;
display: flex;
align-items: center;
justify-content: center;
margin-right: .5rem;
box-sizing: border-box;
span {
margin-left: .2rem;
}
}
.followed {
flex: 1;
display: flex;
justify-content: space-around;
align-items: center;
.l-button {
color: white;
border-radius: .2rem;
background: @second-btn-color;
height: @width;
width: 50%;
margin-right: .5rem;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: center;
span {
margin-left: .2rem;
}
img {
transform: rotate(180deg);
}
}
}
.option {
position: relative;
width: 32%;
width: @width;
height: @width;
font-size: 1.2rem;
display: flex;
align-items: center;
justify-content: center;
border-radius: .2rem;
background: @second-btn-color;
height: 3rem;
color: white;
}
img {
@width: 1.6rem;
width: @width;
height: @width;
}
img {
@width: 1.6rem;
width: @width;
height: @width;
}
}

97
src/pages/me/Uploader.vue
View File

@ -51,12 +51,11 @@
<span>抖音号：605128307</span>
<img src="../../assets/img/icon/me/qrcode-gray.png" alt="" @click.stop="$nav('/my-card')">
</div>
<div class="signature f12" @click="$nav('/edit-userinfo-item',{type:3})">
<div class="signature f12">
<template v-if="!userinfo.desc">
<span>点击添加介绍，让大家认识你...</span>
<img src="../../assets/img/icon/me/write-gray.png" alt="">
</template>
<span v-else class="text">{{ userinfo.desc }}</span>
</div>
<div class="more">
<div class="age item" v-if="userinfo.birthday">
@ -90,18 +89,20 @@
</div>
</div>
<div class="my-buttons">
<div class="">
<div class="button" @click="$nav('/edit-userinfo')">
<img src="../../assets/img/icon/add-white.png" alt="">
</div>
<!-- <div class="button" @click="$nav('/edit-userinfo')">-->
<!-- <span>编辑资料</span>-->
<!-- </div>-->
<!-- <div class="button" @click="$nav('/edit-userinfo')">-->
<!-- <span>主页访客</span>-->
<!-- </div>-->
<div class="no-follow" v-if="false">
<img src="../../assets/img/icon/add-white.png" alt="">
<span>关注</span>
</div>
<div class="button" @click="$nav('/find-acquaintance')">
<div class="followed" v-else>
<div class="l-button">
<span>已关注</span>
<img src="../../assets/img/icon/arrow-up-white.png" alt="">
</div>
<div class="l-button">
<span>私信</span>
</div>
</div>
<div class="option">
<img src="../../assets/img/icon/arrow-up-white.png" alt="">
</div>
</div>
@ -109,8 +110,8 @@
</div>
<Indicator
name="videoList"
tabStyleWidth="25%"
:tabTexts="['作品','私密','喜欢','收藏']"
tabStyleWidth="50%"
:tabTexts="['作品','喜欢']"
v-model:active-index="contentIndex">
</Indicator>
<SlideRowList
@ -125,17 +126,6 @@
<Loading v-if="loadings.loading0" :is-full-screen="false"></Loading>
<no-more v-else/>
</SlideItem>
<SlideItem class="SlideItem"
@scroll="scroll"
:style="SlideItemStyle">
<div class="notice">
<img src="../../assets/img/icon/me/lock-gray.png" alt="">
<span>只有你能看到设为私密的作品和日常</span>
</div>
<Posters v-if="videos.private.total !== -1" mode="private" :list="videos.private.list"></Posters>
<Loading v-if="loadings.loading1" :is-full-screen="false"></Loading>
<no-more v-else/>
</SlideItem>
<SlideItem class="SlideItem"
@scroll="scroll"
:style="SlideItemStyle">
@ -147,61 +137,6 @@
<Loading v-if="loadings.loading2" :is-full-screen="false"></Loading>
<no-more v-else/>
</SlideItem>
<SlideItem class="SlideItem"
@scroll="scroll"
:style="SlideItemStyle">
<div class="notice">
<img src="../../assets/img/icon/me/lock-gray.png" alt="">
<span>只有你能看到自己的收藏列表</span>
</div>
<div class="collect" ref="collect">
<div class="video" v-if=" videos.collect.video.list.length">
<div class="top">
<div class="left">
<img src="../../assets/img/icon/me/video-whitegray.png" alt="">
<span>视频</span>
</div>
<div class="right">
<span>全部</span>
<back direction="right"></back>
</div>
</div>
<div class="list">
<div class="item"
v-for="i in videos.collect.video.list.length>3?videos.collect.video.list.slice(0,3):videos.collect.video.list">
<img class="poster" :src="$imgPreview(i.poster)" alt="">
<div class="num">
<img class="love" src="../../assets/img/icon/love.svg" alt="">
<span>{{ $likeNum(i.likeNum) }}</span>
</div>
</div>
</div>
</div>
<div class="audio" v-if=" videos.collect.video.list.length">
<div class="top">
<div class="left">
<img src="../../assets/img/icon/me/music-whitegray.png" alt="">
<span>音乐</span>
</div>
<div class="right">
<span>全部</span>
<back direction="right"></back>
</div>
</div>
<div class="list">
<div class="item"
v-for="i in videos.collect.video.list.length>3?videos.collect.video.list.slice(0,3):videos.collect.video.list">
<img class="poster" :src="$imgPreview(i.poster)" alt="">
<div class="title">用户创作的原声用户创作的原声用户创作的原声
</div>
</div>
</div>
</div>
</div>
<Loading v-if="loadings.loading3" :is-full-screen="false"></Loading>
<no-more v-else/>
</SlideItem>
</SlideRowList>
</div>
<transition name="fade">