瀏覽代碼

初步完成 我的 首页

release/210823_需求对对碰
王饶冀 3 年之前
父節點
當前提交
46f3565be2

+ 1
- 1
app.json 查看文件

{ {
"pages": [ "pages": [
"pages/myModule/index",
"pages/index/index", "pages/index/index",
"pages/logs/logs", "pages/logs/logs",
"pages/myModule/index",
"pages/releaseModule/index", "pages/releaseModule/index",
"pages/msgModule/index", "pages/msgModule/index",
"pages/index/components/listDetails/Details", "pages/index/components/listDetails/Details",

+ 1
- 0
components/listItem/listItem.wxss 查看文件

text-align: center; text-align: center;
color: #ef6f10; color: #ef6f10;
font-size: 20rpx; font-size: 20rpx;
font-style: italic;
} }
.list-certification .certification-img{ .list-certification .certification-img{
width: 26rpx; width: 26rpx;

二進制
images/home/exit-icon.png 查看文件


二進制
images/home/home-page-icon.png 查看文件


二進制
images/home/my-attention-icon.png 查看文件


二進制
images/home/my-collect-icon.png 查看文件


二進制
images/home/my-contact-icon.png 查看文件


二進制
images/home/my-release-icon.png 查看文件


+ 47
- 3
pages/myModule/index.js 查看文件

const app = getApp() const app = getApp()


Page({ Page({
data: {
currentIndex: 3
},
data: {
currentIndex: 3,
user: {
chatHeads: "https://wx.qlogo.cn/mmopen/vi_32/GhKAicgjqaCK1oZDfibe4ciaBWicWDnMFqibzWU0qp5diaE8tatUQCyTpDvlJIHJTbVprC1Dbwjh5WkWcgdmlO4VicJ8w/132",
name: "微信昵称微信昵称微微信微信昵称微信昵称微微信",
isPartner: true,
address: "上海市·徐汇区",
customerId:666967,
},
listData: [
{
title: "我发布的需求",
code: "my-release",
url: "我发布的需求",
},
{
title: "我收藏的需求",
code: "my-collect",
url: "我收藏的需求",
},
{
title: "我关注的类型",
code: "my-attention",
url: "我关注的类型",
},
{
title: "联系客服",
code: "my-contact",
url: "联系客服",
},
],
},
// 路由跳转
goRouterPage(e) {
let url = e.currentTarget.dataset.url;
let customerid = this.data.user.customerId;
// 前往主页
if (url == 'homepage') {
wx.navigateTo({
url: '/pages/index/components/homepage/homepage',
success: function (res) {
// 通过eventChannel向被打开页面传送数据
res.eventChannel.emit('customerid', { customerid })
}
})
}
},
}) })

+ 3
- 1
pages/myModule/index.json 查看文件

{ {
"component": true, "component": true,
"usingComponents": {}
"usingComponents": {
"van-icon": "@vant/weapp/icon/index"
}
} }

+ 42
- 6
pages/myModule/index.wxml 查看文件

<!--pages/myPage/myPage.wxml-->
<view class="home-page">
<!-- 顶部 -->
<view class="neirong">我的</view>
<view>到底</view>
<tabBar currentIndex="{{currentIndex}}"></tabBar>
<!-- pages/myPage/myPage.wxml -->
<view class="my-page page-container">
<!-- 顶部 -->
<view class="header card-view">
<view class="chatHeads fl">
<image class="chatHeads-img" src="{{ user.chatHeads }}" />
</view>
<view class="user-info fl">
<view class="user-name-box fl" wx:if="{{ user.isPartner }}">
<view class="user-name need yichu fl">{{ user.name }}</view>
<view class="user-isPartner fl">
<image class="certification-img" src="/images/home/certification-icon.png" />
平台认证
</view>
</view>
<view class="user-name-box fl" wx:else>
<view class="user-name yichu fl">{{ user.name }}</view>
</view>
<view class="user-address fl">
{{ user.address }}
</view>
<view class="show-home-page fl" bindtap="goRouterPage" data-url="homepage">
<image class="home-page-img" src="/images/home/home-page-icon.png" />
查 看 主 页 >>
</view>
</view>
<view class="exit-view">
<image class="exit-img" src="/images/home/exit-icon.png" />
退出
</view>
</view>
<!-- 内容 -->
<view class="content card-view">
<view class="li-view" wx:for="{{ listData }}" wx:key="*this" bindtap="goRouterPage" data-url="{{ item.url }}">
<image class="{{ item.code }}-img" src="/images/home/{{ item.code }}-icon.png" />
{{ item.title }}
<view class="right-icon fr">
<van-icon name="arrow" />
</view>
</view>
</view>
<tabBar currentIndex="{{currentIndex}}"></tabBar>
</view> </view>

+ 164
- 7
pages/myModule/index.wxss 查看文件

/* pages/myPage/myPage.wxss */ /* pages/myPage/myPage.wxss */
.home-page {
background: #f5f9ff;
padding: 20rpx;
min-height: 100%;
padding-bottom: 120rpx;

.card-view{
border-radius: 30rpx;
background: #fff;
box-sizing: border-box;
}

.header{
height: 200rpx;
padding: 48rpx 38rpx;
position: relative;
}
.user-info {
position: relative;
top: -10rpx;
}
.chatHeads {
width: 104rpx;
height: 104rpx;
background: #999;
border-radius: 50%;
}
.chatHeads-img {
width: 100%;
height: 100%;
border-radius: 50%;
}
.user-info {
width: calc(100% - 104rpx);
height: 104rpx;
box-sizing: border-box;
padding-left: 40rpx;
}
.user-name-box {
height: 40rpx;
width: 100%;
}
.user-name-box .user-name{
font-size: 28rpx;
color: #333;
font-weight: bold;
width: 100%;
}
.user-name-box .need {
max-width: calc(100% - 150rpx);
}
.user-name-box .user-isPartner {
width: 140rpx;
height: 39rpx;
line-height: 39rpx;
background-color: #fff0be;
border-radius: 19px;
color: #ef6f10;
font-size: 20rpx;
font-style: italic;
text-align: center;
box-sizing: border-box;
padding-right: 8rpx;
margin-left: 10rpx;
margin-top: 4rpx;
}
.user-name-box .certification-img{
width: 26rpx;
height: 27rpx;
position: relative;
top: 6rpx;
}

.user-address {
height: 40rpx;
line-height: 40rpx;
font-size: 24rpx;
color: #999999;
margin: 5rpx 0;
width: 100%;
}

.show-home-page {
height: 30rpx;
line-height: 30rpx;
font-size: 24rpx;
color: #728dd4;
width: 100%;
}
.show-home-page .home-page-img{
width: 23rpx;
height: 26rpx;
position: relative;
top: 4rpx;
margin-right: 5rpx;
}

.exit-view {
width: 138rpx;
height: 58rpx;
line-height: 58rpx;
text-align: center;
border-radius: 29rpx 0 0 29rpx;
color: #fff;
font-weight: bold;
position: absolute;
right: 0;
bottom: 32rpx;
background-color: #8496f3;
}

.exit-view .exit-img{
width: 26rpx;
height: 28rpx;
position: relative;
top: 4rpx;
}


.content {
padding: 5rpx 30rpx;
margin-top: 30rpx;
}
.content .li-view{
height: 90rpx;
line-height: 90rpx;
box-sizing: border-box;
border-bottom: 1px solid #f0f1f5;
font-size: 28rpx;
color: #333;
font-weight: bold;
padding:0 20rpx;
}
.content .li-view:last-child{
border-bottom: 0;
}

.content .li-view .my-release-img,
.content .li-view .my-attention-img,
.content .li-view .my-collect-img,
.content .li-view .my-contact-img{
position: relative;
top: 4rpx;
margin-right: 15rpx;
}

.content .li-view .my-release-img,
.content .li-view .my-attention-img{
width: 44rpx;
height: 41rpx;
top:7rpx;
}

.content .li-view .my-release-img{
top: 10rpx;
}

.content .li-view .my-collect-img{
width: 41rpx;
height: 41rpx;
top: 9rpx;
}

.content .li-view .my-contact-img{
width: 37rpx;
height: 35rpx;
} }


.neirong{
height: 1500rpx;
.content .li-view .right-icon {
font-size: 29rpx;
color: #d7dae4;
} }

+ 3
- 2
pages/releaseModule/index.js 查看文件

} }
let tags = this.data.tags; let tags = this.data.tags;
tags.forEach(el => { tags.forEach(el => {
el.isActive = false
el.isActive = '';
if (selectedTag.indexOf(el.typeName) != -1) { if (selectedTag.indexOf(el.typeName) != -1) {
el.isActive = true;
el.isActive = 'active' + selectedTag.indexOf(el.typeName);
} }
}) })
console.log(tags)
this.setData({ this.setData({
selectedTag, selectedTag,
tags tags

+ 1
- 1
pages/releaseModule/index.wxml 查看文件

<view class="tags-view"> <view class="tags-view">
<view class="title">需求类型(最少选择一个,最多可选择三个)</view> <view class="title">需求类型(最少选择一个,最多可选择三个)</view>
<view class="tags-item-box clearfix"> <view class="tags-item-box clearfix">
<view class="tag-item {{ item.isActive ? 'isActive' : '' }}" wx:for="{{tags}}" wx:key="*this">
<view class="tag-item {{ item.isActive }}" wx:for="{{tags}}" wx:key="*this">
<view class="tag" bindtap="tagSelectedChange" data-typename="{{ item.typeName }}"> <view class="tag" bindtap="tagSelectedChange" data-typename="{{ item.typeName }}">
{{ item.typeName }} {{ item.typeName }}
</view> </view>

+ 5
- 5
pages/releaseModule/index.wxss 查看文件

box-sizing: border-box; box-sizing: border-box;
padding: 0 10rpx; padding: 0 10rpx;
} }
/* .tags-item-box .tag-item.isActive:nth-child(1) .tag{
.tags-item-box .active0 .tag{
background-color: #e4f7ea; background-color: #e4f7ea;
color: #52cc7a; color: #52cc7a;
} */
.tags-item-box .isActive .tag{
}
.tags-item-box .active1 .tag{
background-color: #e4f1f7; background-color: #e4f1f7;
color: #3d97e6; color: #3d97e6;
} }
/* .tags-item-box .tag-item.isActive:nth-child(3) .tag{
.tags-item-box .active2 .tag{
background-color: #f7eee4; background-color: #f7eee4;
color: #ffa769; color: #ffa769;
} */
}
.tags-item-box .tag{ .tags-item-box .tag{
height: 50rpx; height: 50rpx;
line-height: 50rpx; line-height: 50rpx;

Loading…
取消
儲存