liuyongli
3 years ago
parent
7ad3d81dc4
commit
b52c85a3f7
@ -1,3 +1,7 @@
|
||||
{
|
||||
"usingComponents": {}
|
||||
"usingComponents": {},
|
||||
"backgroundTextStyle": "light",
|
||||
"navigationBarBackgroundColor": "#006BFF",
|
||||
"navigationBarTitleText": "硕为思汽车智能洞查",
|
||||
"navigationBarTextStyle": "white"
|
||||
}
|
||||
@ -1,23 +1,21 @@
|
||||
<!--index.wxml-->
|
||||
<view class="container">
|
||||
<view class="userinfo">
|
||||
<block wx:if="{{canIUseOpenData}}">
|
||||
<view class="userinfo-avatar" bindtap="bindViewTap">
|
||||
<open-data type="userAvatarUrl"></open-data>
|
||||
<scroll-view class="scrollList" scroll-x="true" enable-flex="true">
|
||||
<text wx:for="{{condition}}" class="{{index === 0 ? 'actived' : ''}}">{{item}}</text>
|
||||
</scroll-view>
|
||||
<view class="top">
|
||||
<!-- <view style="width: 100%;position: fixed;left: 0rpx;">
|
||||
<image class="logo1" src="" style="width: 286rpx;height: 24rpx;"></image>
|
||||
<image class="logo2" src="" style="width: 750rpx;height: 100rpx;"></image>
|
||||
</view> -->
|
||||
<view wx:for="{{toplist}}" wx:key="url" class="top_box">
|
||||
<view class="box_image">
|
||||
<image style="width: 100%;height: 100%;" src="{{item.url}}"></image>
|
||||
</view>
|
||||
<open-data type="userNickName"></open-data>
|
||||
</block>
|
||||
<block wx:elif="{{!hasUserInfo}}">
|
||||
<button wx:if="{{canIUseGetUserProfile}}" bindtap="getUserProfile"> 获取头像昵称 </button>
|
||||
<button wx:elif="{{canIUse}}" open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 获取头像昵称 </button>
|
||||
<view wx:else> 请使用1.4.4及以上版本基础库 </view>
|
||||
</block>
|
||||
<block wx:else>
|
||||
<image bindtap="bindViewTap" class="userinfo-avatar" src="{{userInfo.avatarUrl}}" mode="cover"></image>
|
||||
<text class="userinfo-nickname">{{userInfo.nickName}}</text>
|
||||
</block>
|
||||
</view>
|
||||
<view class="usermotto">
|
||||
<text class="user-motto">{{motto}}</text>
|
||||
<view class="box_bot">
|
||||
<view class="box_title">{{item.title}}</view>
|
||||
<view class="box_num">{{item.num}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -1,19 +1,95 @@
|
||||
/**index.wxss**/
|
||||
.userinfo {
|
||||
.scrollList{
|
||||
width: calc(100% - 48rpx);
|
||||
display: flex;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
height: 80rpx;
|
||||
background: #fff;
|
||||
}
|
||||
.scrollList text{
|
||||
background: #F6F6F6;
|
||||
border-radius: 2px;
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
margin:0 8rpx;
|
||||
padding: 18rpx 24rpx;
|
||||
height: min-content;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.scrollList .actived{
|
||||
font-size: 12px;
|
||||
font-weight: bold;
|
||||
color: #027AFF;
|
||||
background: #F0F5FF;
|
||||
}
|
||||
/* .condition{
|
||||
height: 50rpx;
|
||||
background-color: #027AFF;
|
||||
margin: 32rpx 32rpx 48rpx 32rpx;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4,1fr);
|
||||
grid-gap: 32rpx;
|
||||
} */
|
||||
.condition text{
|
||||
text-align: center;
|
||||
background: #FAFBFD;
|
||||
border-radius: 4rpx;
|
||||
font-size: 10px;
|
||||
color: #333333;
|
||||
padding: 16rpx 24rpx;
|
||||
}
|
||||
.condition .active{
|
||||
color: #027AFF;
|
||||
}
|
||||
|
||||
.top {
|
||||
/* background-color: #006BFF; */
|
||||
height: 556rpx;
|
||||
width: 100%;
|
||||
border-bottom-left-radius: 56rpx;
|
||||
display: flex;
|
||||
/* overflow: scroll; */
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
/* position: sticky; */
|
||||
top: 0rpx;
|
||||
z-index: 5;
|
||||
}
|
||||
::-webkit-scrollbar {
|
||||
/*隐藏滚轮*/
|
||||
display: none;
|
||||
}
|
||||
.top_box {
|
||||
background-color: white;
|
||||
padding-top: 0.4rem;
|
||||
flex-shrink: 0;
|
||||
width: 160rpx;
|
||||
height: 228rpx;
|
||||
border-radius: 10%;
|
||||
margin-top: 266rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
color: #aaa;
|
||||
justify-content: space-around;
|
||||
padding-left: 36rpx;
|
||||
margin-right: 1rem;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.userinfo-avatar {
|
||||
overflow: hidden;
|
||||
width: 128rpx;
|
||||
height: 128rpx;
|
||||
margin: 20rpx;
|
||||
border-radius: 50%;
|
||||
.box_image {
|
||||
width: 70rpx;
|
||||
height: 70rpx;
|
||||
border-radius: 6rem;
|
||||
box-shadow: #FFDEC5 0rem 0.5rem 1rem;
|
||||
}
|
||||
|
||||
.usermotto {
|
||||
margin-top: 200px;
|
||||
}
|
||||
.box_title {
|
||||
color: #999999;
|
||||
font-size: 24rpx;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.box_num {
|
||||
font-weight: 900;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
Loading…
Reference in new issue