Skip to content

C
cust-app
Commit 34c253ce authored by liwei's avatar liwei
Browse files
Options

规范化了我的页面的css样式名称

parent 3c3b8675
Hide whitespace changes
Inline Side-by-side
Showing with 554 additions and 434 deletions
pages/components/article/Item.vue
View file @ 34c253ce
......@@ -125,8 +125,8 @@
watch: {
info: {
handler(newValue) {
if (newValue?.pictureUrls?.length) {
this.imgs = newValue.pictureUrls
if (newValue?.url?.length) {
this.imgs = newValue.url
}
},
deep: true,
......
pages/components/article/List.vue
View file @ 34c253ce
......@@ -145,8 +145,8 @@
item.memAvatar = item.memAvatar.replace(/\\/g, '/')
}
//处理动态照片
if (item.pictureUrls != null){
item.pictureUrls = item.pictureUrls.replace(/\\/g, '/').split(',')
if (item.url != null){
item.url = item.url.replace(/\\/g, '/').split(',')
}
//处理性别
item.memSex = getValue('sex',item.memSex)
......
pages/tab/article.vue
View file @ 34c253ce
......@@ -71,9 +71,8 @@
],
//当前tab
current: 1,
arr: [],
total: 0,
num: 0,
//登录弹窗
isLoginPop: false
};
},
......
pages/tab/my.vue
View file @ 34c253ce
<template>
<view class="" style="background: #F4F5F9;">
<view style="background: #F4F5F9;">
<!-- 没登录-->
<view class="home-page-container" style="min-height: 100vh;" @touchmove.stop.prevent="() => {}" v-if="nologin==true">
<image class="bgc-imga" :src="baseUrl+'/user/bg-c.png'" mode="aspectFill"></image>
<u-navbar leftText=" " title=" " :bgColor="bgColor" :fixed="false" :safeAreaInsetTop="true"
:placeholder="true">
<view class="noLogin-container" @touchmove.stop.prevent="() => {}" v-if="nologin==true">
<image class="noLogin-background-image" :src="baseUrl+'/user/bg-c.png'" mode="aspectFill"></image>
<u-navbar leftText=" " title=" " bgColor="rgba(255, 255, 255, 0)" :fixed="false" :safeAreaInsetTop="true" :placeholder="true">
<view class="u-nav-slot" slot="left">
<view class="text"> </view>
<view class="texts"> </view>
</view>
<view class="u-nav-slot" slot="center">
<view class="texts"> 我的 </view>
</view>
</u-navbar>
<view class="noimg">
<view class="noLogin-image">
<image :src="baseUrl+'/user/nologin.png'" style="width: 100%;height: 100%;" mode="aspectFill"/>
</view>
<view class="text"> 登录后才能查看我的哦 </view>
<view class="nobutton" @click="login"> 点此登录 </view>
<view class="noLogin-text"> 登录后才能查看我的哦 </view>
<view class="noLogin-button" @click="login"> 点此登录 </view>
</view>
<!-- 已登录-->
<view class="" v-if="nologin == false">
<!-- 顶部 背景-->
<image class="bgc-imga" :src="baseUrl+'/user/my2.png'" mode="aspectFill"/>
<!-- 顶部 第一部分-->
<view class="logion">
<image class="bgc-imgas" :src="baseUrl+'/user/my22.png'" mode="aspectFill"></image>
<view class="sss">
<view class="logo">
<image :src="info.headPortrait" style="width: 100%;height: 100%;border-radius: 50%;"
mode="aspectFill">
</image>
<view class="logola">
<image :src="baseUrl+'/user/myrz.png'" class="cuo" mode="aspectFill"
<view class="Login-container" v-if="nologin == false">
<!-- 顶部-->
<view class="top">
<!-- 顶部背景-->
<image class="top-background" :src="baseUrl+'/user/my22.png'" mode="aspectFill"></image>
<view class="top-content">
<view class="top-avatar">
<!-- 头像-->
<image class="top-avatar-image" :src="info.headPortrait" mode="aspectFill"/>
<view class="top-avatar-label">
<image :src="baseUrl+'/user/myrz.png'" class="label-image" mode="aspectFill"
v-if="info.waitApprovedStatus == 'EXAMINE' || info.waitApprovedStatus=='REFUSE'"/>
<image :src="baseUrl+'/user/yrz.png'" class="cuo" mode="aspectFill" v-else/>
<view class="shenhe">
<image :src="baseUrl+'/user/yrz.png'" class="label-image" mode="aspectFill" v-else/>
<view class="label-title">
{{ info.waitApprovedStatus == 'EXAMINE' ?
"审核中": info.waitApprovedStatus == 'PASS' ?
"已认证": info.waitApprovedStatus == 'REFUSE' ?
......@@ -46,38 +43,32 @@
</view>
</view>
</view>
<view class="names">
<text v-if="info.nickName">{{info.nickName}}</text><text v-else>0</text>
<view class="top-name">
<text v-if="info.nickName">{{info.nickName}}</text>
<text v-else>0</text>
</view>
<view class="div">
<view class="diving" @click="gotolike(1,info.ilike)">
<view class="divtast">
<view class="top-tabs">
<view class="tab-1" @click="gotolike(1,info.ilike)">
<view class="tab-1-num">
<text v-if="info.ilike">{{info.ilike}}</text><text v-else>0</text>
</view>
<view class="divingname">
<view class="tab-1-text">
我喜欢的
</view>
</view>
<view class="diving" style="margin: 0 136rpx;" @click="gotolike(2,info.likeMe)">
<!-- <view class="divtast" v-if="info.likeMe==0">-->
<view class="divtast">
<view class="tab-2" style="margin: 0 136rpx;" @click="gotolike(2,info.likeMe)">
<view class="tab-2-num">
<text v-if="info.likeMe">{{info.likeMe}}</text><text v-else>0</text>
</view>
<!-- <view class="vimg" v-else>-->
<!-- <image :src="info.likeMeheadPortrait" class="simg" mode="aspectFill"></image>-->
<!-- </view>-->
<view class="divingname">
<view class="tab-2-text">
喜欢我的
</view>
</view>
<view class="diving" @click="gotolike(3,info.lovers)">
<view class="divtast">
<view class="tab-3" @click="gotolike(3,info.lovers)">
<view class="tab-3-num">
<text v-if="info.lovers">{{info.lovers}}</text><text v-else>0</text>
</view>
<view class="divingname">
<view class="tab-3-text">
互相喜欢
</view>
</view>
......@@ -85,30 +76,30 @@
</view>
</view>
<!-- 认证 第二部分-->
<view class="box">
<view class="boxsing" style="height: 52rpx;">
<view class="boxsname" style="margin-left: 42rpx;">
<!-- 认证 第一部分-->
<view class="content-1">
<view class="double-auth">
<view class="double-auth-title" style="margin-left: 42rpx;">
双重认证
</view>
<view class="boxsnames" style="width: 88rpx;margin-left: 0rpx;">
<view class="double-auth-text" style="width: 88rpx;margin-left: 0rpx;">
（{{numtwo}}/2）
</view>
<view class="boxsnames" style="margin-left: 0rpx;">
<view class="double-auth-text" style="margin-left: 0rpx;">
配对成功率提升200%
</view>
<view class="boxsbutton" @click="gotomation">
<view class="double-auth-button" @click="gotomation">
立即认证
</view>
</view>
<view class="boxsing" style="height: 52rpx;">
<view class="boxsname" style="margin-left: 42rpx;">
<view class="personal-data">
<view class="personal-data-title">
个人资料
</view>
<view class="boxsnames">
<view class="personal-data-desc">
资料完善80%以上双倍曝光
</view>
<view class="boxsbutton" @click="updateInformation">
<view class="personal-data-button" @click="updateInformation">
立即完善
</view>
</view>
......@@ -116,26 +107,30 @@
</view>
</view>
<!-- 动态 第三部分-->
<view class="box" @click="goCommunity" v-if="(info.userArticleViewResponse.articleImg !== null && info.userArticleViewResponse.articleImg.length) || info.userArticleViewResponse.articleContent !== null">
<view class="boxsing">
<image :src="baseUrl+'/user/106.svg'" style="width: 42rpx;height: 42rpx;margin-left: 42rpx;;"
mode="aspectFill">
</image>
<view class="boxsname">
我的动态
</view>
<!-- 动态 第二部分-->
<view class="content-2" @click="goCommunity" v-if="(info.articleInfo.articleImg !== null && info.articleInfo.articleImg.length) || info.articleInfo.articleContent !== null">
<view class="my-article">
<view class="my-article-title">
<image class="title-image" :src="baseUrl+'/user/106.svg'" mode="aspectFill"/>
<view class="title-text">
我的动态
</view>
</view>
<view class="my-article-more">
查看更多
<u-icon name="arrow-right" size="13" bold="true"></u-icon>
</view>
</view>
<view class="strs" v-if="info.userArticleViewResponse.articleContent !== null">
{{info.userArticleViewResponse.articleContent}}
<view class="my-article-content" v-if="info.articleInfo.articleContent !== null">
{{info.articleInfo.articleContent}}
</view>
<view :class="['imgs',info.userArticleViewResponse.articleImg.length == 2 ? 'twoTemp':'']" v-if="info.userArticleViewResponse.articleImg !== null && info.userArticleViewResponse.articleImg.length">
<image v-for="item in info.userArticleViewResponse.articleImg" :src="item" mode="aspectFill"></image>
<view :class="['my-article-image-1',info.articleInfo.articleImg.length == 2 ? 'my-article-image-2':'']" v-if="info.articleInfo.articleImg !== null && info.articleInfo.articleImg.length">
<image v-for="item in info.articleInfo.articleImg" :src="item" mode="aspectFill"></image>
</view>
</view>
<!-- 操作项 第四部分-->
<view class="box" style="">
<!-- 操作项 第三部分-->
<view class="content-3">
<view class="box-bottom" v-for="(item,index) in button" :key="index" @click="whether(index)">
<view class="box-bottom-left">
<image :src="item.img" class="box-bottom-img" mode="aspectFill"></image>
......@@ -199,8 +194,6 @@ import {setUserProfile} from '../../api/login/index'
nologin: '',//登录标志
userInfo:{},//用户信息
token:'',//token
img: this.$BASE_URL,
bgColor: "rgba(255, 255, 255, 0)",
button: [
{
name: "金币",
......@@ -224,16 +217,17 @@ import {setUserProfile} from '../../api/login/index'
img: this.$store.state.imgUrl+'/user/myset.png',
}],
info: {
headPortrait:'http://192.168.1.80/upload/CmsBanner/20241230/18E63B570FF04DB3A8EFE277D58256C4.jpg',
headPortrait:'http://192.168.1.7/upload/CmsBanner/20241230/18E63B570FF04DB3A8EFE277D58256C4.jpg',
nickName:'11111',
ilike:'6',
likeMe:'7',
lovers:'8',
goldBalance:0,
userArticleViewResponse:{
waitApprovedStatus:'PASS',
articleInfo:{
articleImg:[
'http://192.168.1.80/upload/CmsBanner/20241230/18E63B570FF04DB3A8EFE277D58256C4.jpg',
'http://192.168.1.80/upload/CmsBanner/20241230/18E63B570FF04DB3A8EFE277D58256C4.jpg'
'http://192.168.1.7/upload/CmsBanner/20241230/18E63B570FF04DB3A8EFE277D58256C4.jpg',
'http://192.168.1.7/upload/CmsBanner/20241230/18E63B570FF04DB3A8EFE277D58256C4.jpg'
],
articleContent:'将昨天的快乐在今天发出去，就是双倍快乐！'
}
......@@ -363,354 +357,444 @@ import {setUserProfile} from '../../api/login/index'
</script>
<style lang="scss" scoped>
.logion {
width: 100%;
height: 750rpx;
position: relative;
}
.twoTemp{
&:after{
width: calc(33% - 10rpx);
content: '';
}
image{
&:last-child{
margin-left: 10rpx;
}
}
}
.imgs{
display: flex;
justify-content: space-between;
padding: 30rpx 42rpx;
image{
width: calc(33% - 10rpx);
height: 198rpx;
border-radius: 12rpx;
}
}
.strs{
padding: 30rpx 42rpx;
font-size: 28rpx;
color: #333333;
}
.box-bottom-text-la {
font-size: 36rpx;
font-family: 'PingFang SC-Heavy, PingFang SC';
font-weight: 400;
color: #5B83E8;
line-height: 36rpx;
margin-left: 20rpx;
}
.box-bottom-right-img {
width: 11rpx;
height: 20rpx;
margin: 0 38rpx 0 14rpx;
}
.box-bottom-right-name {
font-size: 28rpx;
font-family: 'PingFang SC-Regular, PingFang SC';
font-weight: 400;
color: #B7B7B7;
line-height: 28rpx;
}
.box-bottom-right {
display: flex;
align-items: center;
justify-content: flex-end;
}
.box-bottom-text {
font-size: 28rpx;
font-family: 'PingFang SC-Heavy';
font-weight: bolder;
color: rgba(45, 49, 50, 0.9);
line-height: 28rpx;
margin-left: 24rpx;
}
.box-bottom-img {
height: 36rpx;
width: 36rpx;
margin-left: 42rpx;
}
.box-bottom-left {
display: flex;
align-items: center;
}
.box-bottom {
width: 100%;
height: 36rpx;
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 66rpx;
}
.box-bottom:first-child {
padding-top: 30rpx;
}
.box-bottom:last-child {
padding-bottom: 40rpx;
}
.boxsbutton {
width: 152rpx;
height: 52rpx;
background: #E7EDFC;
display: flex;
align-items: center;
justify-content: center;
font-size: 24rpx;
font-family: 'PingFang SC-Regular, PingFang SC';
font-weight: 400;
color: #446CD2;
line-height: 52rpx;
margin-left: auto;
border-radius: 33rpx;
margin-right: 42rpx;
}
.boxsnames {
height: 34rpx;
font-size: 24rpx;
font-family: 'PingFang SC-Regular, PingFang SC';
font-weight: 400;
line-height: 34rpx;
margin-left: 18rpx;
color: rgba(45, 49, 50, 0.9);
}
.boxsname {
height: 40rpx;
font-size: 28rpx;
font-family: 'PingFang SC-Heavy';
font-weight: bolder;
color: rgba(45, 49, 50, 0.9);
line-height: 40rpx;
margin-left: 14rpx;
}
.boxsing {
display: flex;
align-items: center;
height: 42rpx;
padding-top: 42rpx;
}
.box {
width: 686rpx;
background: #FFFFFF;
border-radius: 24rpx;
margin: 0 auto;
margin-top: 32rpx;
position: relative;
}
.divingname {
width: 96rpx;
height: 24rpx;
font-size: 24rpx;
font-family: 'Source Han Sans CN-Regular, Source Han Sans CN';
font-weight: 400;
color: #B1B4C5;
line-height: 24rpx;
}
.simg {
width: 100%;
height: 100%;
border-radius: 50%;
filter: blur(4rpx);
transform: translate3d(0, 0, 0);
}
.vimg {
border: 5rpx solid #CCD9EF;
width: 96rpx;
height: 96rpx;
margin-top: 30rpx;
border-radius: 50%;
box-sizing: border-box;
}
.divtast {
width: 96rpx;
height: 96rpx;
margin-top: 30rpx;
display: flex;
font-size: 40rpx;
font-family: 'Arial-Regular, Arial';
font-weight: 400;
color: #000000;
line-height: 40rpx;
justify-content: center;
align-items: center;
}
.diving {
width: 102rpx;
display: flex;
flex-direction: column;
justify-content: center;
}
.div {
width: 100%;
display: flex;
justify-content: center;
align-items: center;
margin-top: 50rpx;
}
.sss {
position: absolute;
width: 100%;
height: 100%;
left: 0rpx;
}
.names {
width: 100%;
text-align: center;
height: 44rpx;
font-size: 32rpx;
// font-weight: bold;
// font-family: 'PingFang SC-Bold, PingFang SC';
font-family: 'Arial-Regular, Arial';
font-weight: 600;
color: #333333;
line-height: 44rpx;
margin-top: 28rpx;
}
.shenhe {
height: 28rpx;
font-size: 20rpx;
font-family: 'PingFang SC-Bold, PingFang SC';
font-weight: bold;
color: #86A6F3;
margin-left: 8rpx;
line-height: 28rpx;
}
.cuo {
width: 20rpx;
height: 20rpx;
}
.logo {
width: 184rpx;
height: 184rpx;
border: 6rpx solid #CCD9EF;
margin: 0 auto;
border-radius: 50%;
margin-top: 186rpx;
position: relative;
.logola {
width: 126rpx;
height: 36rpx;
background: rgba(222, 231, 252, 1);
border-radius: 23rpx;
border: 2rpx solid #86A6F3;
position: absolute;
left: 30rpx;
bottom: -18rpx;
display: flex;
align-items: center;
justify-content: center;
}
}
.texts {
height: 50rpx;
font-size: 32rpx;
font-family: 'PingFang SC-Bold, PingFang SC';
// font-weight: bold;
color: #000000;
line-height: 50rpx;
}
.nobutton {
width: 392rpx;
height: 84rpx;
background: linear-gradient(86deg, #C2D2F9 0%, #C5C2F3 100%);
border-radius: 42rpx;
display: flex;
align-items: center;
justify-content: center;
font-size: 28rpx;
margin: 0 auto;
font-family: 'PingFang SC-Regular, PingFang SC';
font-weight: 400;
color: #415C9E;
margin-top: 40rpx;
}
.text {
width: 100%;
height: 44rpx;
font-size: 32rpx;
font-family: 'PingFang SC-Regular, PingFang SC';
font-weight: 400;
color: #C9C9D0;
line-height: 44rpx;
text-align: center;
margin-top: 104rpx;
}
.noimg {
width: 338rpx;
height: 338rpx;
margin: 0 auto;
padding-top: 200rpx;
}
page {
height: 100%;
background: linear-gradient(180deg, #F4F5F9 0%, #F4F5F9 100%);
}
.bgc-img {
position: absolute;
top: -80rpx;
left: 40rpx;
width: 670rpx;
pointer-events: none;
height: 100%;
}
.noLogin-container{
min-height: 100vh;
.noLogin-background-image{
position: absolute;
top: -100rpx;
left: 0rpx;
width: 100%;
height: 100%;
pointer-events: none;
}
.u-nav-slot{
.texts {
height: 50rpx;
font-size: 32rpx;
font-family: 'PingFang SC-Bold, PingFang SC';
color: #000000;
line-height: 50rpx;
}
}
.noLogin-image{
width: 338rpx;
height: 338rpx;
margin: 0 auto;
padding-top: 200rpx;
}
.noLogin-text{
width: 100%;
height: 44rpx;
font-size: 32rpx;
font-family: 'PingFang SC-Regular, PingFang SC';
font-weight: 400;
color: #C9C9D0;
line-height: 44rpx;
text-align: center;
margin-top: 104rpx;
}
.noLogin-button{
width: 392rpx;
height: 84rpx;
background: linear-gradient(86deg, #C2D2F9 0%, #C5C2F3 100%);
border-radius: 42rpx;
display: flex;
align-items: center;
justify-content: center;
font-size: 28rpx;
margin: 0 auto;
font-family: 'PingFang SC-Regular, PingFang SC';
font-weight: 400;
color: #415C9E;
margin-top: 40rpx;
}
}
.bgc-imga {
position: absolute;
top: -100rpx;
left: 0rpx;
width: 100%;
height: 100%;
pointer-events: none;
}
.Login-container{
.top {
width: 100%;
height: 750rpx;
position: relative;
.top-background{
position: absolute;
top: 0rpx;
left: 0rpx;
width: 100%;
height: 100%;
}
.top-content{
position: absolute;
width: 100%;
height: 100%;
left: 0rpx;
.top-avatar {
width: 184rpx;
height: 184rpx;
border: 6rpx solid #CCD9EF;
margin: 0 auto;
border-radius: 50%;
margin-top: 186rpx;
position: relative;
.top-avatar-image{
width: 100%;
height: 100%;
border-radius: 50%;
}
.top-avatar-label {
width: 126rpx;
height: 36rpx;
background: rgba(222, 231, 252, 1);
border-radius: 23rpx;
border: 2rpx solid #86A6F3;
position: absolute;
left: 30rpx;
bottom: -18rpx;
display: flex;
align-items: center;
justify-content: center;
.label-image{
width: 20rpx;
height: 20rpx;
}
.label-title {
height: 28rpx;
font-size: 20rpx;
font-family: 'PingFang SC-Bold, PingFang SC';
font-weight: bold;
color: #86A6F3;
margin-left: 8rpx;
line-height: 28rpx;
}
}
}
.top-name{
width: 100%;
text-align: center;
height: 44rpx;
font-size: 32rpx;
font-family: 'Arial-Regular, Arial';
font-weight: 600;
color: #333333;
line-height: 44rpx;
margin-top: 28rpx;
}
.top-tabs{
width: 100%;
display: flex;
justify-content: center;
align-items: center;
margin-top: 50rpx;
.tab-1{
width: 102rpx;
display: flex;
flex-direction: column;
justify-content: center;
.tab-1-num{
width: 96rpx;
height: 96rpx;
margin-top: 30rpx;
display: flex;
font-size: 40rpx;
font-family: 'Arial-Regular, Arial';
font-weight: 400;
color: #000000;
line-height: 40rpx;
justify-content: center;
align-items: center;
}
.tab-1-text{
width: 96rpx;
height: 24rpx;
font-size: 24rpx;
font-family: 'Source Han Sans CN-Regular, Source Han Sans CN';
font-weight: 400;
color: #B1B4C5;
line-height: 24rpx;
}
}
.tab-2{
width: 102rpx;
display: flex;
flex-direction: column;
justify-content: center;
.tab-2-num{
width: 96rpx;
height: 96rpx;
margin-top: 30rpx;
display: flex;
font-size: 40rpx;
font-family: 'Arial-Regular, Arial';
font-weight: 400;
color: #000000;
line-height: 40rpx;
justify-content: center;
align-items: center;
}
.tab-2-text{
width: 96rpx;
height: 24rpx;
font-size: 24rpx;
font-family: 'Source Han Sans CN-Regular, Source Han Sans CN';
font-weight: 400;
color: #B1B4C5;
line-height: 24rpx;
}
}
.tab-3{
width: 102rpx;
display: flex;
flex-direction: column;
justify-content: center;
.tab-3-num{
width: 96rpx;
height: 96rpx;
margin-top: 30rpx;
display: flex;
font-size: 40rpx;
font-family: 'Arial-Regular, Arial';
font-weight: 400;
color: #000000;
line-height: 40rpx;
justify-content: center;
align-items: center;
}
.tab-3-text{
width: 96rpx;
height: 24rpx;
font-size: 24rpx;
font-family: 'Source Han Sans CN-Regular, Source Han Sans CN';
font-weight: 400;
color: #B1B4C5;
line-height: 24rpx;
}
}
}
}
}
.content-1{
width: 686rpx;
background: #FFFFFF;
border-radius: 24rpx;
margin: 0 auto;
margin-top: 32rpx;
position: relative;
.double-auth{
display: flex;
align-items: center;
height: 52rpx;
padding-top: 42rpx;
.double-auth-title{
height: 40rpx;
font-size: 28rpx;
font-family: 'PingFang SC-Heavy';
font-weight: bolder;
color: rgba(45, 49, 50, 0.9);
line-height: 40rpx;
margin-left: 42rpx;
}
.double-auth-text{
height: 34rpx;
font-size: 24rpx;
font-family: 'PingFang SC-Regular, PingFang SC';
font-weight: 400;
line-height: 34rpx;
margin-left: 18rpx;
color: rgba(45, 49, 50, 0.9);
}
.double-auth-button{
width: 152rpx;
height: 52rpx;
background: #E7EDFC;
display: flex;
align-items: center;
justify-content: center;
font-size: 24rpx;
font-family: 'PingFang SC-Regular, PingFang SC';
font-weight: 400;
color: #446CD2;
line-height: 52rpx;
margin-left: auto;
border-radius: 33rpx;
margin-right: 42rpx;
}
}
.personal-data{
display: flex;
align-items: center;
padding-top: 42rpx;
height: 52rpx;
.personal-data-title{
height: 40rpx;
font-size: 28rpx;
font-family: 'PingFang SC-Heavy';
font-weight: bolder;
color: rgba(45, 49, 50, 0.9);
line-height: 40rpx;
margin-left: 42rpx;
}
.personal-data-desc{
height: 34rpx;
font-size: 24rpx;
font-family: 'PingFang SC-Regular, PingFang SC';
font-weight: 400;
line-height: 34rpx;
margin-left: 18rpx;
color: rgba(45, 49, 50, 0.9);
}
.personal-data-button{
width: 152rpx;
height: 52rpx;
background: #E7EDFC;
display: flex;
align-items: center;
justify-content: center;
font-size: 24rpx;
font-family: 'PingFang SC-Regular, PingFang SC';
font-weight: 400;
color: #446CD2;
line-height: 52rpx;
margin-left: auto;
border-radius: 33rpx;
margin-right: 42rpx;
}
}
}
.content-2{
width: 686rpx;
background: #FFFFFF;
border-radius: 24rpx;
margin: 0 auto;
margin-top: 32rpx;
position: relative;
.my-article {
display: flex;
justify-content: space-between;
align-items: center;
height: 42rpx;
padding-top: 42rpx;
.my-article-title{
display: flex;
.title-image{
width: 42rpx;
height: 42rpx;
margin-left: 42rpx;
}
.title-text{
height: 40rpx;
font-size: 28rpx;
font-family: 'PingFang SC-Heavy';
font-weight: bolder;
color: rgba(45, 49, 50, 0.9);
line-height: 40rpx;
margin-left: 14rpx;
}
}
.my-article-more{
display: flex;
height: 40rpx;
font-size: 28rpx;
font-family: 'PingFang SC-Heavy';
font-weight: bolder;
color: rgba(45, 49, 50, 0.9);
line-height: 40rpx;
margin-right: 42rpx;
}
}
.my-article-content{
padding: 30rpx 42rpx;
font-size: 28rpx;
color: #333333;
}
.my-article-image-1{
display: flex;
justify-content: space-between;
padding: 30rpx 42rpx;
image{
width: calc(33% - 10rpx);
height: 198rpx;
border-radius: 12rpx;
}
}
.my-article-image-2{
&:after{
width: calc(33% - 10rpx);
content: '';
}
image{
&:last-child{
margin-left: 10rpx;
}
}
}
}
.content-3{
width: 686rpx;
background: #FFFFFF;
border-radius: 24rpx;
margin: 0 auto;
margin-top: 32rpx;
position: relative;
.box-bottom {
width: 100%;
height: 36rpx;
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 66rpx;
.box-bottom-left {
display: flex;
align-items: center;
.box-bottom-img {
height: 36rpx;
width: 36rpx;
margin-left: 42rpx;
}
.box-bottom-text {
font-size: 28rpx;
font-family: 'PingFang SC-Heavy';
font-weight: bolder;
color: rgba(45, 49, 50, 0.9);
line-height: 28rpx;
margin-left: 24rpx;
}
.box-bottom-text-la {
font-size: 36rpx;
font-family: 'PingFang SC-Heavy, PingFang SC';
font-weight: 400;
color: #5B83E8;
line-height: 36rpx;
margin-left: 20rpx;
}
}
.box-bottom-right {
display: flex;
align-items: center;
justify-content: flex-end;
.box-bottom-right-img {
width: 11rpx;
height: 20rpx;
margin: 0 38rpx 0 14rpx;
}
.box-bottom-right-name {
font-size: 28rpx;
font-family: 'PingFang SC-Regular, PingFang SC';
font-weight: 400;
color: #B7B7B7;
line-height: 28rpx;
}
}
}
.box-bottom:first-child {
padding-top: 30rpx;
}
.box-bottom:last-child {
padding-bottom: 40rpx;
}
}
}
.bgc-imgas {
position: absolute;
top: 0rpx;
left: 0rpx;
width: 100%;
height: 100%;
}
.popup-container {
height: 562rpx;
width: 544rpx;
......
pagesUser/userInfo.vue
View file @ 34c253ce
......@@ -101,11 +101,17 @@
<view class="card" style="height: auto;"
v-if="(userData.articleImg !== null && userData.articleImg.length) || userData.articleContent !== null">
<view class="content">
<view class="have_image">
<image :src="baseUrl+'/user/106.svg'" mode="aspectFill"/>
<view class="title" style="font-family: SC-Bold;">
我的动态
</view>
<view class="have_image_two">
<view class="have_image_title">
<image :src="baseUrl+'/user/106.svg'" mode="aspectFill"/>
<view class="title" style="font-family: SC-Bold;">
我的动态
</view>
</view>
<view class="boxsname2">
查看更多
<u-icon name="arrow-right" size="13" bold="true"></u-icon>
</view>
</view>
<view class="strs" v-if="userData.articleContent !== null">
{{userData.articleContent}}
......@@ -671,6 +677,37 @@
}
}
.have_image_two {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 28rpx;
font-weight: bold;
.have_image_title{
display: flex;
align-items: center;
}
image {
width: 28rpx;
height: 28rpx;
}
.title {
padding-left: 12rpx;
}
.boxsname2{
display: flex;
height: 40rpx;
font-size: 28rpx;
font-family: 'PingFang SC-Heavy';
font-weight: bolder;
color: rgba(45, 49, 50, 0.9);
line-height: 40rpx;
margin-right: 42rpx;
}
}
.one {
font-size: 28rpx;
margin-top: 26rpx;
......
pageslogin/index.vue
View file @ 34c253ce
......@@ -160,7 +160,7 @@
};
</script>
<style lang="scss">
<style lang="scss" scoped>
page {
height: 100%;
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment