Skip to content

W
wxapp
Commit 088620e6 by ArronYR
Options

add detail

parent 0acf7121
Showing with 319 additions and 97 deletions
app.json
...@@ -15,7 +15,6 @@ ...@@ -15,7 +15,6 @@
"pages/detail/index", "pages/detail/index",
"pages/detail/enroll/index", "pages/detail/enroll/index",
"pages/detail/appointment/index", "pages/detail/appointment/index",
"pages/guide/detail/index",
"components/navs/index", "components/navs/index",
"pages/search/search/search", "pages/search/search/search",
"pages/search/list/list" "pages/search/list/list"
......
app.wxss
/**app.wxss**/ /**app.wxss**/
page{
page {
background: #f5f5f5; background: #f5f5f5;
} }
.container { .container {
height: 100%; height: 100%;
display: flex; display: flex;
...@@ -35,3 +37,7 @@ page{ ...@@ -35,3 +37,7 @@ page{
.margin-top-10 { .margin-top-10 {
motion-path: 20px; motion-path: 20px;
} }
.margin-left-20 {
margin-left: 20px;
}
components/banners/index.js
// components/banners/index.js // components/banners/index.js
import api from '../../utils/Api.js'
const Util = require('../../utils/Util.js') const Util = require('../../utils/Util.js')
const formBehavior = require('../../behaviors/form.js') const formBehavior = require('../../behaviors/form.js')
const app = getApp() const app = getApp()
...@@ -33,24 +32,13 @@ Component({ ...@@ -33,24 +32,13 @@ Component({
}, },
attached() { attached() {
if (!this.data.banners.length) {
this._getBannerData()
}
}, },
/** /**
* 组件的方法列表 * 组件的方法列表
*/ */
methods: { methods: {
_getBannerData() {
api.home.banner({
token: app.globalData.token
}).then(res => {
this.setData({
banners: res.data
})
})
},
_tapBanner(event) { _tapBanner(event) {
let oid = event.currentTarget.dataset.oid let oid = event.currentTarget.dataset.oid
let type = event.currentTarget.dataset.type let type = event.currentTarget.dataset.type
......
pages/detail/index.js
...@@ -4,6 +4,7 @@ import Schedule from '../../utils/Schedule.js' ...@@ -4,6 +4,7 @@ import Schedule from '../../utils/Schedule.js'
const { const {
$Toast $Toast
} = require('../../iview/base/index'); } = require('../../iview/base/index');
const WxParse = require('../../wxParse/wxParse.js');
const app = getApp() const app = getApp()
Page({ Page({
...@@ -15,6 +16,8 @@ Page({ ...@@ -15,6 +16,8 @@ Page({
id: 0, id: 0,
detail: {}, detail: {},
comments: [],
currentPage: 1, currentPage: 1,
loading: true, loading: true,
hasMore: true, hasMore: true,
...@@ -43,7 +46,7 @@ Page({ ...@@ -43,7 +46,7 @@ Page({
new Schedule().task(this.getDetailData).delay(1200).task(() => { new Schedule().task(this.getDetailData).delay(1200).task(() => {
wx.hideNavigationBarLoading() wx.hideNavigationBarLoading()
wx.hideLoading() wx.hideLoading()
}) }).task(this.getCommentData)
}, },
/** /**
...@@ -71,14 +74,41 @@ Page({ ...@@ -71,14 +74,41 @@ Page({
* 页面相关事件处理函数--监听用户下拉动作 * 页面相关事件处理函数--监听用户下拉动作
*/ */
onPullDownRefresh: function() { onPullDownRefresh: function() {
this.setData({
detail: {},
comments: [],
loading: true,
hasMore: true,
currentPage: 1
})
wx.showNavigationBarLoading()
wx.showLoading({
title: '加载中...',
})
new Schedule().task(this.getDetailData).delay(1200).task(() => {
wx.hideNavigationBarLoading()
wx.stopPullDownRefresh()
wx.hideLoading()
}).task(this.getCommentData)
}, },
/** /**
* 页面上拉触底事件的处理函数 * 页面上拉触底事件的处理函数
*/ */
onReachBottom: function() { onReachBottom: function() {
let that = this
if (that.data.loading || !that.data.hasMore) {
return;
} else {
let page = that.data.currentPage + 1
new Schedule().task(() => {
that.setData({
loading: true,
currentPage: page
})
}).delay(1000).task(that.getCommentData)
}
}, },
/** /**
...@@ -92,7 +122,57 @@ Page({ ...@@ -92,7 +122,57 @@ Page({
api.project.detail({ api.project.detail({
id: this.data.id id: this.data.id
}).then(res => { }).then(res => {
console.log(res) if (!res.code) {
this.setData({
detail: res.data
})
var that = this;
WxParse.wxParse('description', 'html', res.data.description, that);
}
})
},
getCommentData: function() {
const p = this.data.currentPage
api.project.comments({
pid: this.data.id,
p,
}).then(res => {
if (res.code) {
this.setData({
hasMore: false,
loading: false
})
} else {
this.setData({
comments: this.data.comments.concat(res.data),
loading: false,
hasMore: res.data && res.data.length > 0 ? true : false,
currentPage: res.data && res.data.length > 0 ? p : (p - 1)
})
typeof callback == "function" && callback()
}
})
},
handleMap: function() {
wx.openLocation({
latitude: parseFloat(this.data.detail.latitude),
longitude: parseFloat(this.data.detail.longitude),
})
},
handleHome: function() {
},
handleCollect: function() {
},
handleShare: function() {
wx.showShareMenu({
}) })
} }
}) })
\ No newline at end of file
pages/detail/index.json
...@@ -2,6 +2,10 @@ ...@@ -2,6 +2,10 @@
"navigationBarTitleText": "详情", "navigationBarTitleText": "详情",
"enablePullDownRefresh": true, "enablePullDownRefresh": true,
"usingComponents": { "usingComponents": {
"i-toast": "/iview/toast/index" "banner": "/components/banners/index",
"i-toast": "/iview/toast/index",
"i-cell-group": "/iview/cell-group/index",
"i-cell": "/iview/cell/index",
"more": "/components/more/index"
} }
} }
\ No newline at end of file
pages/detail/index.wxml
<!--pages/detail/index.wxml--> <!--pages/detail/index.wxml-->
<import src="../../wxParse/wxParse.wxml" />
<view class='v-page'> <view class='v-page'>
<banner banners="{{detail.banners}}" />
<view class="attributes-wrapper">
<view class='header'>
<view class='title'>{{detail.title}}</view>
<view class='intro'>{{detail.tags}}</view>
</view>
<i-cell-group>
<i-cell>
<image slot="icon" src='/images/icon_tag.png' mode='scaleToFill' class='icon'></image>
<view>{{detail.created_at}}</view>
</i-cell>
<i-cell>
<image slot="icon" src='/images/icon_clock.png' mode='scaleToFill' class='icon'></image>
<view>报名截止：{{detail.time_period}}</view>
</i-cell>
<i-cell>
<image slot="icon" src='/images/icon_location.png' mode='scaleToFill' class='icon'></image>
<view>{{detail.location}}</view>
<view slot="footer">
<image src='/images/icon_map.png' class='icon-map' catchtap='handleMap'></image>
</view>
</i-cell>
<i-cell>
<image slot="icon" src='/images/icon_rmb.png' mode='scaleToFill' class='icon'></image>
<view class='text-red'>
<text>¥ {{detail.price}}</text>
<text class='margin-left-20'>会员价: ¥ {{detail.vip_price}}</text>
</view>
<view slot="footer">
<button class='btn-pay-vip'>购买会员卡</button>
</view>
</i-cell>
</i-cell-group>
</view>
<view class='desc-wrapper'>
<view class='title'>活动详情</view>
<view class='content'>
<template is="wxParse" data="{{wxParseData:description.nodes}}" />
</view>
</view>
<view class='comments-wrapper'>
<view class='title'>活动评价（{{comments.length > 0 ? comments.lenght : 0}}）</view>
<view class='content-wrapper'>
</view>
</view>
<more hasMore="{{hasMore}}" loading="{{loading}}" page="{{currentPage}}" />
<view class='actions-wrapper'>
<view class='actions-box'>
<view class='actions-section ops-wrapper'>
<view class='op-wrapper' catchtap='handleHome'>
<image src='/images/icon_home.png' class='icon'></image>
<text class='title'>首页</text>
</view>
<view class='op-wrapper' catchtap='handleCollect'>
<image src='/images/icon_star.png' class='icon'></image>
<text class='title'>收藏</text>
</view>
<view class='op-wrapper' catchtap='handleShare'>
<image src='/images/icon_share.png' class='icon'></image>
<text class='title'>分享</text>
</view>
</view>
<view class='actions-section btn-wrapper'>立即报名</view>
</view>
</view>
<i-toast id="toast" /> <i-toast id="toast" />
</view> </view>
\ No newline at end of file
pages/detail/index.wxss
/* pages/detail/index.wxss */ /* pages/detail/index.wxss */
\ No newline at end of file @import "/wxParse/wxParse.wxss";
.v-page {
position: relative;
padding-bottom: 60px;
}
.attributes-wrapper {
position: relative;
color: rgb(102, 102, 102);
font-size: 14px;
background-color: #fff;
}
.attributes-wrapper .header {
padding: 12px 15px;
border-bottom: 1px solid #eee;
}
.attributes-wrapper .header .title {
font-size: 16px;
color: rgb(51, 51, 51);
font-weight: bold;
}
.attributes-wrapper .header .intro {
font-size: 12px;
color: rgb(153, 153, 153);
margin-top: 5px;
}
.attributes-wrapper .icon {
width: 18px;
height: 18px;
vertical-align: middle;
margin-right: 5px;
}
.attributes-wrapper .btn-pay-vip {
outline: none;
color: rgb(255, 68, 0);
border: 1px solid rgb(255, 68, 0);
font-size: 12px;
background: none;
border-radius: 24px;
line-height: 2.1;
}
.attributes-wrapper .btn-pay-vip::after {
content: '';
display: none;
}
.attributes-wrapper .icon-map {
width: 18px;
height: 18px;
}
.desc-wrapper, .comments-wrapper {
background-color: #fff;
margin-top: 10px;
padding: 12px 15px;
}
.desc-wrapper .title, .comments-wrapper .title {
font-size: 16px;
color: rgb(71, 71, 71);
font-weight: bold;
padding: 10px 0;
}
.desc-wrapper .content {
font-size: 14px;
color: rgb(51, 51, 51);
}
.comments-wrapper .content-wrapper {
position: relative;
}
.actions-wrapper {
position: fixed;
left: 0;
right: 0;
bottom: 0;
background: #fff;
}
.actions-wrapper .actions-box {
display: flex;
align-items: stretch;
}
.actions-wrapper .actions-box .actions-section {
flex: 1;
display: flex;
align-content: center;
align-items: center;
}
.actions-section.ops-wrapper {
justify-content: space-around;
border-top: 1px solid #eee;
padding: 7px 0 6px;
}
.ops-wrapper .op-wrapper {
display: flex;
flex-direction: column;
align-content: center;
align-items: center;
}
.op-wrapper .icon {
width: 22px;
height: 22px;
display: inline-block;
}
.ops-wrapper .title {
font-size: 12px;
color: rgb(102, 102, 102);
}
.actions-section.btn-wrapper {
background-color: rgb(41, 163, 215);
text-align: center;
font-size: 16px;
color: #fff;
justify-content: center;
}
pages/guide/detail/index.js deleted 100644 → 0
// pages/guide/detail/index.js
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
pages/guide/detail/index.json deleted 100644 → 0
{}
\ No newline at end of file
pages/guide/detail/index.wxml deleted 100644 → 0
<!--pages/guide/detail/index.wxml-->
<text>pages/guide/detail/index.wxml</text>
pages/guide/detail/index.wxss deleted 100644 → 0
/* pages/guide/detail/index.wxss */
\ No newline at end of file
pages/guide/index.js
...@@ -102,7 +102,7 @@ Page({ ...@@ -102,7 +102,7 @@ Page({
}) })
} else { } else {
this.setData({ this.setData({
guides: res.data, guides: this.data.guides.concat(res.data),
loading: false, loading: false,
hasMore: res.data && res.data.length > 0 ? true : false, hasMore: res.data && res.data.length > 0 ? true : false,
currentPage: res.data && res.data.length > 0 ? p : (p - 1) currentPage: res.data && res.data.length > 0 ? p : (p - 1)
......
pages/index/index.js
...@@ -11,7 +11,9 @@ Page({ ...@@ -11,7 +11,9 @@ Page({
news: [], news: [],
heats: [], heats: [],
businesses: [], businesses: [],
guides: [] guides: [],
banners: []
}, },
/** /**
...@@ -26,6 +28,7 @@ Page({ ...@@ -26,6 +28,7 @@ Page({
*/ */
onReady: function() { onReady: function() {
this.getHomeData() this.getHomeData()
this.getBannerData()
}, },
/** /**
...@@ -84,5 +87,15 @@ Page({ ...@@ -84,5 +87,15 @@ Page({
}) })
typeof callback == "function" && callback() typeof callback == "function" && callback()
}) })
},
getBannerData: function() {
api.home.banner({
token: app.globalData.token
}).then(res => {
this.setData({
banners: res.data
})
})
} }
}) })
\ No newline at end of file
pages/index/index.wxml
<!--pages/index.wxml--> <!--pages/index.wxml-->
<view class='v-page'> <view class='v-page'>
<banner /> <banner banners="{{banners}}" />
<navs /> <navs />
<i-cell-group i-class="section-wrapper"> <i-cell-group i-class="section-wrapper">
......
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