Skip to content

W
wxapp
Commit 088620e6 by ArronYR
Options

add detail

parent 0acf7121
Showing with 318 additions and 95 deletions
app.json
......@@ -15,7 +15,6 @@
"pages/detail/index",
"pages/detail/enroll/index",
"pages/detail/appointment/index",
"pages/guide/detail/index",
"components/navs/index",
"pages/search/search/search",
"pages/search/list/list"
......
app.wxss
/**app.wxss**/
page{
page {
background: #f5f5f5;
}
.container {
height: 100%;
display: flex;
......@@ -35,3 +37,7 @@ page{
.margin-top-10 {
motion-path: 20px;
}
.margin-left-20 {
margin-left: 20px;
}
components/banners/index.js
// components/banners/index.js
import api from '../../utils/Api.js'
const Util = require('../../utils/Util.js')
const formBehavior = require('../../behaviors/form.js')
const app = getApp()
......@@ -33,24 +32,13 @@ Component({
},
attached() {
if (!this.data.banners.length) {
this._getBannerData()
}
},
/**
* 组件的方法列表
*/
methods: {
_getBannerData() {
api.home.banner({
token: app.globalData.token
}).then(res => {
this.setData({
banners: res.data
})
})
},
_tapBanner(event) {
let oid = event.currentTarget.dataset.oid
let type = event.currentTarget.dataset.type
......
pages/detail/index.js
......@@ -4,6 +4,7 @@ import Schedule from '../../utils/Schedule.js'
const {
$Toast
} = require('../../iview/base/index');
const WxParse = require('../../wxParse/wxParse.js');
const app = getApp()
Page({
......@@ -15,6 +16,8 @@ Page({
id: 0,
detail: {},
comments: [],
currentPage: 1,
loading: true,
hasMore: true,
......@@ -43,7 +46,7 @@ Page({
new Schedule().task(this.getDetailData).delay(1200).task(() => {
wx.hideNavigationBarLoading()
wx.hideLoading()
})
}).task(this.getCommentData)
},
/**
......@@ -71,14 +74,41 @@ Page({
* 页面相关事件处理函数--监听用户下拉动作
*/
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() {
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({
api.project.detail({
id: this.data.id
}).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 @@
"navigationBarTitleText": "详情",
"enablePullDownRefresh": true,
"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-->
<import src="../../wxParse/wxParse.wxml" />
<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" />
</view>
\ No newline at end of file
pages/detail/index.wxss
/* pages/detail/index.wxss */
@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({
})
} else {
this.setData({
guides: res.data,
guides: this.data.guides.concat(res.data),
loading: false,
hasMore: res.data && res.data.length > 0 ? true : false,
currentPage: res.data && res.data.length > 0 ? p : (p - 1)
......
pages/index/index.js
......@@ -11,7 +11,9 @@ Page({
news: [],
heats: [],
businesses: [],
guides: []
guides: [],
banners: []
},
/**
......@@ -26,6 +28,7 @@ Page({
*/
onReady: function() {
this.getHomeData()
this.getBannerData()
},
/**
......@@ -84,5 +87,15 @@ Page({
})
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-->
<view class='v-page'>
<banner />
<banner banners="{{banners}}" />
<navs />
<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