Browse Source

爱心互助页面修改

master
zhaoyongnian 5 years ago
parent
commit
f99185dd10
  1. 3
      app.json
  2. 71
      pages/heartNew/heartNew.js
  3. 15
      pages/heartNew/heartNew.json
  4. 19
      pages/heartNew/heartNew.wxml
  5. 94
      pages/heartNew/heartNew.wxss

3
app.json

@ -14,7 +14,8 @@
"pages/detail/detail", "pages/detail/detail",
"pages/accept/accept", "pages/accept/accept",
"pages/gridLeaderRegister/gridLeaderRegister", "pages/gridLeaderRegister/gridLeaderRegister",
"pages/heart/heart" "pages/heart/heart",
"pages/heartNew/heartNew"
], ],
"subPackages": [ "subPackages": [
{ {

71
pages/heartNew/heartNew.js

@ -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 () {
}
})

15
pages/heartNew/heartNew.json

@ -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"
}

19
pages/heartNew/heartNew.wxml

@ -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>

94
pages/heartNew/heartNew.wxss

@ -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…
Cancel
Save