5 changed files with 201 additions and 1 deletions
@ -0,0 +1,71 @@ |
|||||
|
// pages/heartNew/heartNew.js
|
||||
|
const app = getApp() |
||||
|
Page({ |
||||
|
|
||||
|
/** |
||||
|
* 页面的初始数据 |
||||
|
*/ |
||||
|
data: { |
||||
|
statusHeight: 0, // 自定义头部状态栏高度
|
||||
|
navigationHeight: 0, // 自定义头部导航栏高度
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面加载 |
||||
|
*/ |
||||
|
onLoad: function (options) { |
||||
|
this.setData({ |
||||
|
statusHeight: app.globalData.deviceInfo.statusHeight, |
||||
|
navigationHeight: app.globalData.deviceInfo.navigationHeight, |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面初次渲染完成 |
||||
|
*/ |
||||
|
onReady: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面显示 |
||||
|
*/ |
||||
|
onShow: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面隐藏 |
||||
|
*/ |
||||
|
onHide: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面卸载 |
||||
|
*/ |
||||
|
onUnload: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面相关事件处理函数--监听用户下拉动作 |
||||
|
*/ |
||||
|
onPullDownRefresh: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面上拉触底事件的处理函数 |
||||
|
*/ |
||||
|
onReachBottom: function () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 用户点击右上角分享 |
||||
|
*/ |
||||
|
onShareAppMessage: function () { |
||||
|
|
||||
|
} |
||||
|
}) |
@ -0,0 +1,15 @@ |
|||||
|
{ |
||||
|
"navigationBarTitleText": "e锦水", |
||||
|
"navigationStyle": "custom", |
||||
|
"navigationBarTextStyle": "white", |
||||
|
"usingComponents": { |
||||
|
"wux-tabs": "/dist/tabs/index", |
||||
|
"wux-tab": "/dist/tab/index", |
||||
|
"activity": "../../components/activity/activity", |
||||
|
"load-more": "../../components/loadMore/loadMore", |
||||
|
"no-data": "../../components/nodata/nodata" |
||||
|
}, |
||||
|
"enablePullDownRefresh": true, |
||||
|
"backgroundColor": "#f8f8f8", |
||||
|
"backgroundTextStyle": "dark" |
||||
|
} |
@ -0,0 +1,19 @@ |
|||||
|
<view class="header" style="height: {{statusHeight + navigationHeight}}px;"> |
||||
|
<image class="header-bg" src="https://epdc-kongcun.elinkit.com.cn/epdcFile/M00/00/06/rBAB7160-w6AJBH6AAAk6D4lsPc207.png" /> |
||||
|
<view class="navigation" style="height: {{navigationHeight}}px; top: {{statusHeight}}px;"> |
||||
|
志愿者去哪儿 |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="home" style="margin-top: {{statusHeight + navigationHeight}}px"> |
||||
|
<view class="belong-grid"> |
||||
|
<image class="belong-grid-bg" src="https://epdc-kongcun.elinkit.com.cn/epdcFile/M00/00/06/rBAB7160-u6ATTx1AAEZrXGthow458.png" /> |
||||
|
<view class="newbelong-grid"> |
||||
|
<view class="grid"> |
||||
|
<image src="https://epdc-kongcun.elinkit.com.cn/epdcFile/M00/00/09/rBAB717MflOADIYLAACi6KzN7k4722.png" /> |
||||
|
</view> |
||||
|
<view class="volunteer"> |
||||
|
<image src="https://epdc-kongcun.elinkit.com.cn/epdcFile/M00/00/09/rBAB717MhrKAB80nAAApr5c7VJQ292.png" /> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
@ -0,0 +1,94 @@ |
|||||
|
page { |
||||
|
width: 100%; |
||||
|
height: auto; |
||||
|
overflow-y: auto; |
||||
|
background: #f7f7f7; |
||||
|
} |
||||
|
|
||||
|
.header { |
||||
|
position: fixed; |
||||
|
width: 100%; |
||||
|
top: 0; |
||||
|
left: 0; |
||||
|
z-index: 888; |
||||
|
} |
||||
|
|
||||
|
.header .header-bg { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
position: absolute; |
||||
|
z-index: 10; |
||||
|
left: 0; |
||||
|
top: 0; |
||||
|
} |
||||
|
|
||||
|
.header .navigation { |
||||
|
width: 100%; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
color: rgba(255, 255, 255, 0.9); |
||||
|
font-size: 32rpx; |
||||
|
position: relative; |
||||
|
z-index: 100; |
||||
|
letter-spacing: 2rpx; |
||||
|
} |
||||
|
|
||||
|
.home { |
||||
|
width: 100%; |
||||
|
} |
||||
|
|
||||
|
.belong-grid { |
||||
|
width: 100%; |
||||
|
height: 138rpx; |
||||
|
box-sizing: border-box; |
||||
|
padding-top: 16rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.belong-grid .newbelong-grid { |
||||
|
display: flex; |
||||
|
flex-direction: row; |
||||
|
/* align-items: center; */ |
||||
|
justify-content: space-between; |
||||
|
} |
||||
|
|
||||
|
.belong-grid .belong-grid-bg { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
position: absolute; |
||||
|
top: 0; |
||||
|
left: 0; |
||||
|
z-index: 10; |
||||
|
} |
||||
|
|
||||
|
.belong-grid .newbelong-grid .grid { |
||||
|
margin-left: 21rpx; |
||||
|
/* width: 90%; */ |
||||
|
width: calc(100% - 234rpx); |
||||
|
height: 62rpx; |
||||
|
position: relative; |
||||
|
z-index: 100; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
} |
||||
|
|
||||
|
.belong-grid .newbelong-grid .grid image { |
||||
|
width: 100%; |
||||
|
height: 46rpx; |
||||
|
} |
||||
|
|
||||
|
.belong-grid .newbelong-grid .volunteer { |
||||
|
margin-right: 15rpx; |
||||
|
width: 90rpx; |
||||
|
height: 62rpx; |
||||
|
position: relative; |
||||
|
z-index: 100; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
} |
||||
|
|
||||
|
.belong-grid .newbelong-grid .volunteer image { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
} |
Loading…
Reference in new issue