yvette
5 years ago
453 changed files with 36448 additions and 558 deletions
@ -1,14 +0,0 @@ |
|||
# Windows |
|||
[Dd]esktop.ini |
|||
Thumbs.db |
|||
$RECYCLE.BIN/ |
|||
|
|||
# macOS |
|||
.DS_Store |
|||
.fseventsd |
|||
.Spotlight-V100 |
|||
.TemporaryItems |
|||
.Trashes |
|||
|
|||
# Node.js |
|||
node_modules/ |
|||
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 1.8 KiB |
|
After Width: | Height: | Size: 27 KiB |
|
After Width: | Height: | Size: 18 KiB |
@ -0,0 +1,124 @@ |
|||
// pages/ask/index.js
|
|||
const device = wx.getSystemInfoSync(),rect = wx.getMenuButtonBoundingClientRect(); // 获取设备信息
|
|||
const width = device.windowWidth // 示例为一个与屏幕等宽的正方形裁剪框
|
|||
import commonApi from "../../utils/https/common" |
|||
import util from "../../utils/util" |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
menuWidth:width - rect.right + rect.width + 6, |
|||
list:[], |
|||
page_no:1, |
|||
total:1, |
|||
ques:'' |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
if(!options.id){ |
|||
util.back() |
|||
return; |
|||
} |
|||
this.setData({ |
|||
id:options.id |
|||
}) |
|||
this.getList() |
|||
}, |
|||
getList:function(){ |
|||
let list = this.data.list; |
|||
if(list.length>=this.data.total) return; |
|||
commonApi._post("ask/getQuestionList",{ |
|||
scene_id:this.data.id, |
|||
page_no:this.data.page_no, |
|||
page_num:10 |
|||
}).then(res=>{ |
|||
this.setData({ |
|||
list:list.concat(res.data.rows), |
|||
total:res.data.total, |
|||
page_no:this.data.page_no+1 |
|||
}) |
|||
console.log(res) |
|||
}) |
|||
}, |
|||
inputQues:function(e){ |
|||
this.setData({ |
|||
ques:e.detail.value |
|||
}) |
|||
}, |
|||
question:function(){ |
|||
if(!this.data.ques){ |
|||
wx.showToast({ |
|||
title: '请输入问题！', |
|||
}) |
|||
return; |
|||
} |
|||
commonApi.user_post("ask/postQuestion",{ |
|||
scene_id:this.data.id, |
|||
question:this.data.ques |
|||
}).then(res=>{ |
|||
if(res.code==1){ |
|||
wx.showToast({ |
|||
title: '提交成功待审核', |
|||
icon: 'success' |
|||
}) |
|||
this.setData({ |
|||
ques:"" |
|||
}) |
|||
} |
|||
}) |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
this.getList() |
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,5 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"title":"/pages/component/TitleHeader" |
|||
} |
|||
} |
|||
@ -0,0 +1,26 @@ |
|||
<!--pages/ask/index.wxml--> |
|||
<title title="问大家"> |
|||
<navigator url="my/index" class="ask-top-right" style="right:{{menuWidth}}px"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/ask/my.png" mode="widthFix"></image> |
|||
<view>我的问答</view> |
|||
</navigator> |
|||
</title> |
|||
<navigator url="info/index?id={{item.id}}" class="item" wx:for="{{list}}"> |
|||
<view class="item-ques"> |
|||
<image class="item-icon" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/ask/ask.png" mode="widthFix"></image> |
|||
<view class="ques">{{item.question_name}}</view> |
|||
</view> |
|||
<view class="item-ques"> |
|||
<image class="item-icon" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/ask/ans.png" mode="widthFix"></image> |
|||
<view class="ans">{{item.answer && item.answer.lastest_answer?item.answer.lastest_answer.answer:"暂无回答"}}</view> |
|||
</view> |
|||
<view class="ques-tip"> |
|||
<view class="ques-time">{{item.created_time}}提问</view> |
|||
<view class="ans-number">全部{{item.answer && item.answer.total ? item.answer.total : 0}}个回答 <text class="iconfont icon-you"></text> </view> |
|||
</view> |
|||
</navigator> |
|||
<view class="fixed-bottom-blank"></view> |
|||
<view class="fixed-bottom"> |
|||
<input type="text" bindinput="inputQues" placeholder="请输入5-50字的问题"></input> |
|||
<view class="btn" bindtap="question">提问</view> |
|||
</view> |
|||
@ -0,0 +1,81 @@ |
|||
/* pages/ask/index.wxss */ |
|||
.ask-top-right { |
|||
color: #000; |
|||
text-align: center; |
|||
font-size: 23rpx; |
|||
line-height: 23rpx; |
|||
position: absolute; |
|||
} |
|||
.ask-top-right image { |
|||
width: 27rpx; |
|||
margin: 0 auto; |
|||
margin-bottom: 2rpx; |
|||
} |
|||
.item { |
|||
padding: 30rpx 25rpx; |
|||
border-bottom: 1rpx solid #ccc; |
|||
} |
|||
.item-ques { |
|||
display: flex; |
|||
color: #000; |
|||
font-size: 29rpx; |
|||
margin-bottom: 33rpx; |
|||
line-height: 38rpx; |
|||
} |
|||
.item-ques image { |
|||
width: 36rpx; |
|||
margin-right: 18rpx; |
|||
} |
|||
.item-ques .ques { |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
} |
|||
.ques-tip { |
|||
margin-left: 54rpx; |
|||
color: #999999; |
|||
font-size: 24rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
} |
|||
.ans-number { |
|||
color: #0B898E; |
|||
font-size: 28rpx; |
|||
} |
|||
.ans-number .iconfont { |
|||
font-size: 28rpx; |
|||
} |
|||
.fixed-bottom { |
|||
position: fixed; |
|||
left: 0; |
|||
right: 0; |
|||
background: #FFFFFF; |
|||
box-shadow: 0px 0px 16rpx 0px rgba(6, 0, 1, 0.1); |
|||
height: 133rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
padding: 0 25rpx; |
|||
bottom: 0em; |
|||
} |
|||
.fixed-bottom-blank { |
|||
height: 140rpx; |
|||
} |
|||
.fixed-bottom input { |
|||
display: block; |
|||
width: 470rpx; |
|||
border: 1rpx solid #999; |
|||
height: 70rpx; |
|||
border-radius: 36rpx; |
|||
padding: 0 30rpx; |
|||
} |
|||
.fixed-bottom .btn { |
|||
width: 144rpx; |
|||
line-height: 72rpx; |
|||
background: #0B898E; |
|||
border-radius: 36rpx; |
|||
color: #fff; |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
text-align: center; |
|||
} |
|||
@ -0,0 +1,144 @@ |
|||
// pages/ask/info/index.js
|
|||
import commonApi from "../../../utils/https/common" |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
list:[], |
|||
total:1, |
|||
page_no:1, |
|||
keyword:'', |
|||
info:null |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
this.setData({ |
|||
id:options.id |
|||
}) |
|||
commonApi._post("ask/getQuestionDetail",{ |
|||
question_id:options.id |
|||
}).then(res=>{ |
|||
this.setData({ |
|||
info:res.data |
|||
}) |
|||
console.log(res) |
|||
}) |
|||
this.getList(); |
|||
}, |
|||
zan:function(e){ |
|||
let id = e.currentTarget.dataset.id; |
|||
commonApi.user_post("ask/like",{ |
|||
answer_id:id |
|||
}).then(res=>{ |
|||
if(res.code==1){ |
|||
let list = this.data.list; |
|||
list.map(item=>{ |
|||
if(item.id==id){ |
|||
item.is_like = item.is_like?false:true; |
|||
item.like_nums = item.is_like?(item.like_nums+1):(item.like_nums-1); |
|||
} |
|||
}) |
|||
this.setData({ |
|||
list:list |
|||
}) |
|||
} |
|||
}) |
|||
}, |
|||
getList:function(){ |
|||
let list = this.data.list; |
|||
if(list.length>=this.data.total) return; |
|||
commonApi.user_post("ask/getQuestionAnswers",{ |
|||
question_id:this.data.id, |
|||
page_no:this.data.page_no, |
|||
page_num:10 |
|||
}).then(res=>{ |
|||
res.data.rows.map(item=>{ |
|||
item.is_like = item.is_like?true:false; |
|||
}) |
|||
this.setData({ |
|||
page_no:this.data.page_no+1, |
|||
total:res.data.total, |
|||
list:list.concat(res.data.rows) |
|||
}) |
|||
}) |
|||
}, |
|||
changeKeyword:function(e){ |
|||
this.setData({ |
|||
keyword:e.detail.value |
|||
}) |
|||
}, |
|||
postAns:function(){ |
|||
if(!this.data.keyword){ |
|||
wx.showToast({ |
|||
title: '请输入回答内容', |
|||
icon: 'none' |
|||
}) |
|||
return; |
|||
} |
|||
commonApi.user_post("ask/postAnswer",{ |
|||
question_id:this.data.id, |
|||
answer:this.data.keyword |
|||
}).then(res=>{ |
|||
if(res.code==1){ |
|||
wx.showToast({ |
|||
title: '提交成功', |
|||
icon:'success' |
|||
}) |
|||
} |
|||
}) |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
this.getList() |
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,5 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"title":"/pages/component/TitleHeader" |
|||
} |
|||
} |
|||
@ -0,0 +1,39 @@ |
|||
<!--pages/ask/info/index.wxml--> |
|||
<title title="问答详情"></title> |
|||
<view class="top-box" wx:if="{{info}}"> |
|||
<navigator url="/pages/info/{{info.scene_type=='hotel'?'hotelProductInfo':'sceneProductInfo'}}/index?id={{info.scene_id}}" class="title"> |
|||
<view class="title-text">{{info.scene_title}}</view> |
|||
<view class="iconfont icon-you"></view> |
|||
</navigator> |
|||
<view class="ques-top"> |
|||
<image class="item-icon" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/ask/ask.png" mode="widthFix"></image> |
|||
<view class="ques">{{info.question_name}}</view> |
|||
</view> |
|||
<view class="ques-time">{{info.created_time}}提问</view> |
|||
</view> |
|||
<view class="list"> |
|||
<view class="list-top"> |
|||
<image class="item-icon" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/ask/ans.png" mode="widthFix"></image> |
|||
<view wx:if="{{total>0}}">共{{total}}个回答</view> |
|||
<view wx:else>暂无回答</view> |
|||
</view> |
|||
<view wx:if="{{list.length==0}}" style="text-align:center;line-height:350rpx;font-size:29rpx"> |
|||
还没有其他人回答，快来第一个回答吧！ |
|||
</view> |
|||
<view class="item" wx:for="{{list}}"> |
|||
<view class="author-info"> |
|||
<image src="{{item.avatar}}" mode="aspectFill"></image> |
|||
<view>{{item.nickname}}</view> |
|||
</view> |
|||
<view class="content">{{item.answer}}</view> |
|||
<view class="tips"> |
|||
<view class="time">{{item.created_time}}回答</view> |
|||
<view class="zan" bindtap="zan" data-id="{{item.id}}"><text class="iconfont {{item.is_like?'icon-zan1':'icon-zan'}}"></text> 有用 <text>{{item.like_nums}}</text></view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="fixed-bottom-blank"></view> |
|||
<view class="fixed-bottom"> |
|||
<input type="text" placeholder="请输入5-50字的回答" bindinput="changeKeyword"></input> |
|||
<view class="btn" bindtap="postAns">回答</view> |
|||
</view> |
|||
@ -0,0 +1,135 @@ |
|||
/* pages/ask/info/index.wxss */ |
|||
page { |
|||
background: #f6f6f6; |
|||
} |
|||
.top-box { |
|||
background: white; |
|||
border-radius: 0 0 13rpx 13rpx; |
|||
padding: 0 20rpx; |
|||
padding-bottom: 25rpx; |
|||
} |
|||
.title { |
|||
display: flex; |
|||
align-items: center; |
|||
height: 100rpx; |
|||
border-bottom: 1rpx solid #ccc; |
|||
margin: 0 20rpx; |
|||
justify-content: space-between; |
|||
} |
|||
.title-text { |
|||
font-weight: bold; |
|||
font-size: 37rpx; |
|||
} |
|||
.ques-top { |
|||
display: flex; |
|||
line-height: 38rpx; |
|||
margin: 20rpx; |
|||
} |
|||
.ques-top image { |
|||
width: 36rpx; |
|||
margin-right: 18rpx; |
|||
} |
|||
.ques-top .ques { |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
} |
|||
.ques-time { |
|||
margin-left: 74rpx; |
|||
font-size: 24rpx; |
|||
color: #999; |
|||
} |
|||
.list { |
|||
width: 710rpx; |
|||
background: #FFFFFF; |
|||
border-radius: 13rpx; |
|||
margin: 24rpx auto; |
|||
} |
|||
.list-top { |
|||
display: flex; |
|||
align-items: center; |
|||
border-bottom: 1rpx solid #ccc; |
|||
height: 100rpx; |
|||
font-size: 27rpx; |
|||
padding: 0 20rpx; |
|||
} |
|||
.list-top image { |
|||
width: 36rpx; |
|||
margin-right: 19rpx; |
|||
} |
|||
.item { |
|||
margin: 0 20rpx; |
|||
padding: 20rpx 0; |
|||
padding-bottom: 30rpx; |
|||
border-bottom: 1rpx solid #ccc; |
|||
} |
|||
.list .item:last-child { |
|||
border-bottom: none; |
|||
} |
|||
.author-info { |
|||
display: flex; |
|||
align-items: center; |
|||
font-size: 21rpx; |
|||
color: #666; |
|||
margin-bottom: 10rpx; |
|||
} |
|||
.author-info image { |
|||
width: 53rpx; |
|||
height: 53rpx; |
|||
border-radius: 50%; |
|||
margin-right: 21rpx; |
|||
} |
|||
.content { |
|||
margin-left: 74rpx; |
|||
font-size: 29rpx; |
|||
color: #000; |
|||
line-height: 44rpx; |
|||
margin-bottom: 20rpx; |
|||
} |
|||
.tips { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
margin-left: 74rpx; |
|||
color: #999999; |
|||
font-size: 24rpx; |
|||
} |
|||
.tips .zan.active { |
|||
|
|||
} |
|||
.icon-zan1 { |
|||
color: red; |
|||
} |
|||
.fixed-bottom { |
|||
position: fixed; |
|||
left: 0; |
|||
right: 0; |
|||
background: #FFFFFF; |
|||
box-shadow: 0px 0px 16rpx 0px rgba(6, 0, 1, 0.1); |
|||
height: 133rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
padding: 0 25rpx; |
|||
bottom: 0em; |
|||
} |
|||
.fixed-bottom-blank { |
|||
height: 140rpx; |
|||
} |
|||
.fixed-bottom input { |
|||
display: block; |
|||
width: 470rpx; |
|||
border: 1rpx solid #999; |
|||
height: 70rpx; |
|||
border-radius: 36rpx; |
|||
padding: 0 30rpx; |
|||
} |
|||
.fixed-bottom .btn { |
|||
width: 144rpx; |
|||
line-height: 72rpx; |
|||
background: #0B898E; |
|||
border-radius: 36rpx; |
|||
color: #fff; |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
text-align: center; |
|||
} |
|||
@ -0,0 +1,93 @@ |
|||
// pages/ask/my/index.js
|
|||
import commonApi from "../../../utils/https/common" |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
type:1, |
|||
list:[] |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
this.getList() |
|||
}, |
|||
changeType:function(e){ |
|||
let type = e.currentTarget.dataset.type; |
|||
this.setData({ |
|||
type:type, |
|||
list:[] |
|||
}) |
|||
this.getList(); |
|||
}, |
|||
getList:function(){ |
|||
let service="ask/myAnswers" |
|||
if(this.data.type==1){ |
|||
service="ask/myQuestions" |
|||
} |
|||
commonApi.user_post(service).then(res=>{ |
|||
console.log(res) |
|||
res.data.map((item)=>{ |
|||
if(item.questions && this.data.type==2){ |
|||
item.my_questions = item.questions; |
|||
} |
|||
}) |
|||
this.setData({ |
|||
list:res.data |
|||
}) |
|||
}) |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,5 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"title":"/pages/component/TitleHeader" |
|||
} |
|||
} |
|||
@ -0,0 +1,26 @@ |
|||
<!--pages/ask/my/index.wxml--> |
|||
<title title="我的问答"></title> |
|||
<view class="menus"> |
|||
<view class="{{type==1?'active':''}}" bindtap="changeType" data-type="1">提问</view> |
|||
<view class="{{type==2?'active':''}}" bindtap="changeType" data-type="2">回答</view> |
|||
</view> |
|||
<view class="item" wx:for="{{list}}"> |
|||
<navigator url="/pages/info/{{item.scene_type=='hotel'?'hotelProductInfo':'sceneProductInfo'}}/index?id={{item.scene_id}}" class="title"> |
|||
<view class="title-text">{{item.scene_title}}</view> |
|||
<view class="iconfont icon-you"></view> |
|||
</navigator> |
|||
<navigator url="../info/index?id={{item.id || item.question_id}}" class="ans-item" wx:for='{{item.my_questions}}'> |
|||
<view class="item-ques"> |
|||
<image class="item-icon" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/ask/ask.png" mode="widthFix"></image> |
|||
<view class="ques">{{item.question_name}}</view> |
|||
</view> |
|||
<view class="item-ques"> |
|||
<image class="item-icon" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/ask/ans.png" mode="widthFix"></image> |
|||
<view class="ans">{{item.answers && item.answers.rows && item.answers.rows[0]?item.answers.rows[0].answer:"暂无回答"}}</view> |
|||
</view> |
|||
<view class="ques-tip"> |
|||
<view class="ques-time">{{item.created_time}}提问</view> |
|||
<!-- <view class="ans-number">全部{{item.answers.total}}个回答 <text class="iconfont icon-you"></text> </view> --> |
|||
</view> |
|||
</navigator> |
|||
</view> |
|||
@ -0,0 +1,92 @@ |
|||
/* pages/ask/my/index.wxss */ |
|||
page { |
|||
background: #f6f6f6; |
|||
} |
|||
.menus { |
|||
display: flex; |
|||
align-items: center; |
|||
height: 86rpx; |
|||
background: white; |
|||
justify-content: center; |
|||
font-size: 29rpx; |
|||
color: #333; |
|||
} |
|||
.menus view:nth-child(1){ |
|||
margin-right: 236rpx; |
|||
} |
|||
.menus view.active { |
|||
font-weight: 500; |
|||
font-size: 37rpx; |
|||
} |
|||
.menus view { |
|||
line-height: 86rpx; |
|||
position: relative; |
|||
} |
|||
.menus view.active::after { |
|||
content: "!"; |
|||
font-size: 0; |
|||
display: block; |
|||
position: absolute; |
|||
width: 46rpx; |
|||
height: 5rpx; |
|||
background: #0B898E; |
|||
border-radius: 3rpx; |
|||
left: 50%; |
|||
margin-left: -23rpx; |
|||
bottom: 0; |
|||
} |
|||
.item { |
|||
background: white; |
|||
border-radius: 13rpx; |
|||
margin: 24rpx 20rpx; |
|||
} |
|||
.title { |
|||
display: flex; |
|||
align-items: center; |
|||
height: 100rpx; |
|||
border-bottom: 1rpx solid #ccc; |
|||
padding: 0 20rpx; |
|||
justify-content: space-between; |
|||
} |
|||
.title-text { |
|||
font-weight: bold; |
|||
font-size: 37rpx; |
|||
} |
|||
.item-ques { |
|||
display: flex; |
|||
color: #000; |
|||
font-size: 29rpx; |
|||
margin-bottom: 33rpx; |
|||
line-height: 38rpx; |
|||
} |
|||
.item-ques image { |
|||
width: 36rpx; |
|||
margin-right: 18rpx; |
|||
} |
|||
.item-ques .ques { |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
} |
|||
.ques-tip { |
|||
margin-left: 54rpx; |
|||
color: #999999; |
|||
font-size: 24rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
} |
|||
.ans-number { |
|||
color: #0B898E; |
|||
font-size: 28rpx; |
|||
} |
|||
.ans-number .iconfont { |
|||
font-size: 28rpx; |
|||
} |
|||
.ans-item { |
|||
margin: 0 20rpx; |
|||
padding: 30rpx 0; |
|||
border-bottom: 1rpx solid #ccc; |
|||
} |
|||
.item .ans-item:last-child { |
|||
border-bottom: none; |
|||
} |
|||
@ -1,3 +1,3 @@ |
|||
<!--pages/component/commonImage/index.wxml--> |
|||
<image wx:if='{{!finishLoadFlag}}' mode='{{mode}}' src='{{defaultImage}}' style='{{width ? "width:" + width : ""}};{{height ? "height:" + height : ""}}' /> |
|||
<image mode='{{mode}}' class='{{finishLoadFlag ? "" : "before-load"}}' src='{{originalImage}}' bindload='finishLoad' style='{{finishLoadFlag && width ? "width:" + width : ""}};{{finishLoadFlag && height ? "height:" + height : ""}}' /> |
|||
<image wx:if='{{!finishLoadFlag}}' mode='{{mode}}' src='{{defaultImage}}' style='display:block;{{width ? "width:" + width : ""}};{{height ? "height:" + height : ""}}' /> |
|||
<image mode='{{mode}}' class='{{finishLoadFlag ? "" : "before-load"}}' src='{{src}}' bindload='finishLoad' style='display:block;{{finishLoadFlag && width ? "width:" + width : ""}};{{finishLoadFlag && height ? "height:" + height : ""}}' /> |
|||
|
|||
@ -0,0 +1,146 @@ |
|||
// pages/component/myCalendar/index.js
|
|||
import util from "../../../utils/util" |
|||
Component({ |
|||
/** |
|||
* 组件的属性列表 |
|||
*/ |
|||
options: { |
|||
styleIsolation: 'apply-shared', |
|||
addGlobalClass: true |
|||
}, |
|||
properties: { |
|||
datelist:{ |
|||
type:Array, |
|||
value:[] |
|||
}, |
|||
activeDay:{ |
|||
type:String, |
|||
value:'' |
|||
} |
|||
}, |
|||
|
|||
/** |
|||
* 组件的初始数据 |
|||
*/ |
|||
data: { |
|||
year: 0, |
|||
month: 0, |
|||
date: ['日', '一', '二', '三', '四', '五', '六'], |
|||
dateArr: [], |
|||
isToday: 0, |
|||
isTodayWeek: false, |
|||
todayIndex: 0 |
|||
}, |
|||
lifetimes: { |
|||
attached: function() { |
|||
let now = new Date(); |
|||
let year = now.getFullYear(); |
|||
let month = now.getMonth() + 1; |
|||
this.dateInit(); |
|||
this.setData({ |
|||
year: year, |
|||
month: month, |
|||
isToday: '' + year + month + now.getDate() |
|||
}) |
|||
let dates={} |
|||
this.properties.datelist.map(item=>{ |
|||
dates[item.date] = item |
|||
}) |
|||
console.log(dates) |
|||
this.setData({ |
|||
dates:dates |
|||
}) |
|||
} |
|||
}, |
|||
/** |
|||
* 组件的方法列表 |
|||
*/ |
|||
methods: { |
|||
dateInit: function (setYear, setMonth) { |
|||
//全部时间的月份都是按0~11基准，显示月份才+1
|
|||
let dateArr = []; //需要遍历的日历数组数据
|
|||
let arrLen = 0; //dateArr的数组长度
|
|||
let now = setYear ? new Date(setYear, setMonth) : new Date(); |
|||
let year = setYear || now.getFullYear(); |
|||
let nextYear = 0; |
|||
let month = setMonth || now.getMonth(); //没有+1方便后面计算当月总天数
|
|||
let nextMonth = (month + 1) > 11 ? 1 : (month + 1); |
|||
let startWeek = new Date(year + '/' + (month + 1) + '/' + 1).getDay(); //目标月1号对应的星期
|
|||
let dayNums = new Date(year, nextMonth, 0).getDate(); //获取目标月有多少天
|
|||
let obj = {}; |
|||
let num = 0; |
|||
|
|||
if (month + 1 > 11) { |
|||
nextYear = year + 1; |
|||
dayNums = new Date(nextYear, nextMonth, 0).getDate(); |
|||
} |
|||
arrLen = startWeek + dayNums; |
|||
for (let i = 0; i < arrLen; i++) { |
|||
if (i >= startWeek) { |
|||
num = i - startWeek + 1; |
|||
let date =util.formatDate(new Date(year +'/' + (month + 1) +'/' + num)); |
|||
obj = { |
|||
isToday: '' + year + (month + 1) + num, |
|||
dateNum: num, |
|||
weight: 5, |
|||
date:date |
|||
} |
|||
} else { |
|||
obj = {}; |
|||
} |
|||
dateArr[i] = obj; |
|||
} |
|||
dateArr.map(monthDate=>{ |
|||
console.log(monthDate) |
|||
}) |
|||
this.setData({ |
|||
dateArr: dateArr |
|||
}) |
|||
|
|||
let nowDate = new Date(); |
|||
let nowYear = nowDate.getFullYear(); |
|||
let nowMonth = nowDate.getMonth() + 1; |
|||
let nowWeek = nowDate.getDay(); |
|||
let getYear = setYear || nowYear; |
|||
let getMonth = setMonth >= 0 ? (setMonth + 1) : nowMonth; |
|||
|
|||
if (nowYear == getYear && nowMonth == getMonth) { |
|||
this.setData({ |
|||
isTodayWeek: true, |
|||
todayIndex: nowWeek |
|||
}) |
|||
} else { |
|||
this.setData({ |
|||
isTodayWeek: false, |
|||
todayIndex: -1 |
|||
}) |
|||
} |
|||
}, |
|||
lastMonth: function () { |
|||
//全部时间的月份都是按0~11基准，显示月份才+1
|
|||
let year = this.data.month - 2 < 0 ? this.data.year - 1 : this.data.year; |
|||
let month = this.data.month - 2 < 0 ? 11 : this.data.month - 2; |
|||
this.setData({ |
|||
year: year, |
|||
month: (month + 1) |
|||
}) |
|||
this.dateInit(year, month); |
|||
}, |
|||
nextMonth: function () { |
|||
//全部时间的月份都是按0~11基准，显示月份才+1
|
|||
let year = this.data.month > 11 ? this.data.year + 1 : this.data.year; |
|||
let month = this.data.month > 11 ? 0 : this.data.month; |
|||
this.setData({ |
|||
year: year, |
|||
month: (month + 1) |
|||
}) |
|||
this.dateInit(year, month); |
|||
}, |
|||
onTapDay:function(e){ |
|||
let date = e.currentTarget.dataset.date; |
|||
console.log(date) |
|||
if(!date || date.price===null || date.stock==null || date.stock==0) return; |
|||
this.triggerEvent("onTapDay",date) |
|||
}, |
|||
} |
|||
}) |
|||
@ -0,0 +1,4 @@ |
|||
{ |
|||
"component": true, |
|||
"usingComponents": {} |
|||
} |
|||
@ -0,0 +1,23 @@ |
|||
<view class='wrap'> |
|||
<view> |
|||
<view class='date-show'> |
|||
<view class="iconfont icon-you-copy lt-arrow" bindtap='lastMonth'></view> |
|||
{{year}}年{{month}}月 |
|||
<view class="iconfont icon-you rt-arrow" bindtap='nextMonth'></view> |
|||
</view> |
|||
</view> |
|||
<view class='header'> |
|||
<view wx:for='{{date}}' class='{{(index == todayIndex) && isTodayWeek ? "weekMark" : ""}}'>{{item}}<view></view></view> |
|||
</view> |
|||
<view class='date-box'> |
|||
<view bindtap="onTapDay" wx:for='{{dateArr}}' class='{{activeDay == item.date ? "nowDay" : ""}}' data-date='{{dates[item.date]}}' style="flex-direction:column"> |
|||
<view class='date-head{{(!dates[item.date] || dates[item.date].stock<=0 || dates[item.date].stock==null || dates[item.date].price==null)?" disable":""}}'> |
|||
<view>{{item.dateNum}}</view> |
|||
</view> |
|||
<view class="date-tip" wx:if="{{dates[item.date] && dates[item.date].price!==null && dates[item.date].stock!=0 && dates[item.date].stock!==null}}">￥{{dates[item.date].price==0?'免费':(dates[item.date].price/100)}}</view> |
|||
<!-- <view class="date-tip disable" wx:if="{{dates[item.date] && (dates[item.date].stock==null || dates[item.date].price==null)}}">不可定</view> --> |
|||
<view class="date-tip disable" wx:if="{{dates[item.date] && dates[item.date].stock==0}}">售罄</view> |
|||
<!-- <view class='date-weight'>{{item.weight}}</view> --> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
@ -0,0 +1,116 @@ |
|||
.date-show{ |
|||
position: relative; |
|||
width: 250rpx; |
|||
font-family: PingFang-SC-Regular; |
|||
font-size: 40rpx; |
|||
color: #282828; |
|||
text-align: center; |
|||
margin: 30rpx auto; |
|||
} |
|||
.lt-arrow,.rt-arrow{ |
|||
position: absolute; |
|||
top: 1rpx; |
|||
width: 60rpx; |
|||
line-height: 60rpx; |
|||
padding-right: 0.6rem; |
|||
} |
|||
.lt-arrow image,.rt-arrow image{ |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
} |
|||
.lt-arrow{ |
|||
left: -110rpx; |
|||
/* transform: rotate(180deg); */ |
|||
} |
|||
.rt-arrow{ |
|||
right: -100rpx; |
|||
} |
|||
.header{ |
|||
font-size: 0; |
|||
padding: 0 24rpx; |
|||
} |
|||
.header>view{ |
|||
display: inline-block; |
|||
width: 14.285%; |
|||
color: #333; |
|||
font-size: 30rpx; |
|||
text-align: center; |
|||
border-bottom: 1px solid #D0D0D0; |
|||
padding: 39rpx 0; |
|||
} |
|||
.weekMark{ |
|||
position: relative; |
|||
} |
|||
.weekMark view{ |
|||
position: absolute; |
|||
bottom: 0; |
|||
left: 0; |
|||
width: 100%; |
|||
/* border-bottom: 1px solid #22A7F6; */ |
|||
} |
|||
.date-box{ |
|||
font-size: 0; |
|||
padding: 10rpx 0; |
|||
} |
|||
.date-box>view{ |
|||
position: relative; |
|||
width: 14.285%; |
|||
color: #020202; |
|||
font-size: 40rpx; |
|||
text-align: center; |
|||
vertical-align: middle; |
|||
height: 90rpx; |
|||
display: inline-flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
.date-head{ |
|||
/* height: 60rpx; */ |
|||
/* line-height: 60rpx; */ |
|||
font-size: 26rpx; |
|||
} |
|||
.date-head.disable { |
|||
color: #999; |
|||
} |
|||
.date-tip { |
|||
font-size: 24rpx; |
|||
line-height: 26rpx; |
|||
color: #D62828; |
|||
} |
|||
.date-tip.disable { |
|||
color: #999; |
|||
} |
|||
.nowDay .date-head{ |
|||
width: 60rpx; |
|||
line-height: 60rpx; |
|||
border-radius: 50%; |
|||
text-align: center; |
|||
color: #fff; |
|||
background-color: #0B898E; |
|||
margin: 0 auto; |
|||
} |
|||
.date-weight{ |
|||
font-size: 22rpx; |
|||
padding: 15rpx 0; |
|||
} |
|||
.nowDay .date-weight{ |
|||
color: #0B898E; |
|||
} |
|||
.one{ |
|||
position: absolute; |
|||
bottom: 0; |
|||
right: 5rpx; |
|||
width: 20rpx; |
|||
height: 20rpx; |
|||
border-radius: 50%; |
|||
background-color: red; |
|||
} |
|||
.two{ |
|||
position: absolute; |
|||
bottom: 30rpx; |
|||
right: 5rpx; |
|||
width: 20rpx; |
|||
height: 20rpx; |
|||
border-radius: 50%; |
|||
background-color: blue; |
|||
} |
|||
@ -1,54 +1,261 @@ |
|||
//index.js
|
|||
//获取应用实例
|
|||
const app = getApp() |
|||
|
|||
let app = getApp() |
|||
import commonApi from "../../utils/https/common" |
|||
import util from "../../utils/util" |
|||
Page({ |
|||
data: { |
|||
motto: 'Hello World', |
|||
userInfo: {}, |
|||
hasUserInfo: false, |
|||
canIUse: wx.canIUse('button.open-type.getUserInfo') |
|||
banner:[], |
|||
xiaobanner:[], |
|||
height:0, |
|||
padHeight:0, |
|||
right:0, |
|||
weather:null, |
|||
saleProduct:null, |
|||
roadProduct:null, |
|||
fourProduct:[], |
|||
hotIndex:0, |
|||
indexHot:[], |
|||
area_ids:["zhangjiagang","changshu","taicang","kunshan","wujiang","wuzhong","xiangcheng","gusu","gongyeyuanqu","gaoxin"], |
|||
month:"", |
|||
months:['JAN','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','oct','nov','dec'], |
|||
date:"", |
|||
list:[], |
|||
listMore:true, |
|||
isTest:false |
|||
}, |
|||
//事件处理函数
|
|||
bindViewTap: function() { |
|||
wx.navigateTo({ |
|||
url: '../logs/logs' |
|||
onLoad: function () { |
|||
let systemInfo = wx.getSystemInfoSync(),rect = wx.getMenuButtonBoundingClientRect(); |
|||
let height = (rect.top - systemInfo.statusBarHeight) * 2 + rect.height; |
|||
this.getList() |
|||
this.setData({ |
|||
height:height, |
|||
padHeight:systemInfo.statusBarHeight, |
|||
right:(systemInfo.screenWidth - rect.right) + rect.width |
|||
}) |
|||
commonApi._post("pbservice/Other/getClientConfig",{ |
|||
unique_key:"wechatxcx" |
|||
}).then(res=>{ |
|||
let data = JSON.parse(res.data) |
|||
this.setData({ |
|||
indexHot:data.indexHot, |
|||
isTest:data.isTest |
|||
}) |
|||
this.getFourProduct() |
|||
}) |
|||
this.getTwoProduct() |
|||
this.getBanner() |
|||
this.getWeather() |
|||
// 获取今天的日期
|
|||
let today = new Date(); |
|||
this.setData({ |
|||
month:(this.data.months[today.getMonth()]).toUpperCase(), |
|||
date:today.getDate() |
|||
}) |
|||
|
|||
}, |
|||
onLoad: function () { |
|||
if (app.globalData.userInfo) { |
|||
// 一城百馆
|
|||
city:function(){ |
|||
wx.navigateToMiniProgram({ |
|||
appId: 'wx114d514f39cb1fed', |
|||
path:"pages/index/index" |
|||
}) |
|||
}, |
|||
changeHotIndex:function(e){ |
|||
this.setData({ |
|||
hotIndex:e.currentTarget.dataset.index, |
|||
fourProduct:[] |
|||
}) |
|||
this.getFourProduct() |
|||
}, |
|||
getBanner:function(){ |
|||
commonApi._post("adv/getAdvByKey",{ |
|||
key:"xcxBanner" |
|||
}).then(res=>{ |
|||
this.setData({ |
|||
banner:res.data.content || [] |
|||
}) |
|||
}) |
|||
commonApi._post("adv/getAdvByKey",{ |
|||
key:"xiaobanner" |
|||
}).then(res=>{ |
|||
this.setData({ |
|||
userInfo: app.globalData.userInfo, |
|||
hasUserInfo: true |
|||
xiaobanner:res.data.content || [] |
|||
}) |
|||
} else if (this.data.canIUse){ |
|||
// 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
|
|||
// 所以此处加入 callback 以防止这种情况
|
|||
app.userInfoReadyCallback = res => { |
|||
}) |
|||
}, |
|||
getWeather:function(){ |
|||
commonApi._post('pbservice/Ztfw/getWeather').then(res=>{ |
|||
console.log(res) |
|||
this.setData({ |
|||
weather:res.data |
|||
}) |
|||
}) |
|||
}, |
|||
saleDetail:function(){ |
|||
}, |
|||
getTwoProduct:function(){ |
|||
// 获取首页限时特惠
|
|||
commonApi._post('act/fast_sale_now',{ |
|||
offset:0, |
|||
limit:1 |
|||
}).then(res=>{ |
|||
if(res.data[0] && res.data[0].fast_sales_sku[0]){ |
|||
this.setData({ |
|||
userInfo: res.userInfo, |
|||
hasUserInfo: true |
|||
saleProduct:res.data[0].fast_sales_sku[0] |
|||
}) |
|||
} |
|||
} else { |
|||
// 在没有 open-type=getUserInfo 版本的兼容处理
|
|||
wx.getUserInfo({ |
|||
success: res => { |
|||
app.globalData.userInfo = res.userInfo |
|||
this.setData({ |
|||
userInfo: res.userInfo, |
|||
hasUserInfo: true |
|||
}) |
|||
}) |
|||
commonApi._post("product/get_product_by_tag",{ |
|||
tag_id:17, |
|||
offset:0, |
|||
limit:1 |
|||
}).then(res=>{ |
|||
this.setData({ |
|||
roadProduct:res.data.list[0] |
|||
}) |
|||
}) |
|||
}, |
|||
getFourProduct:function(){ |
|||
let item = this.data.indexHot[this.data.hotIndex],service="product/get_product_by_tag",data={ |
|||
tag_id:item.id, |
|||
offset:0, |
|||
limit:4, |
|||
sort:'weight', |
|||
order:'desc' |
|||
}; |
|||
if(item.type=='scene'){ |
|||
service="scene/get_scene_by_tag"; |
|||
} |
|||
else if(item.type=='movie'){ |
|||
service="Cinema/getHotMovieList"; |
|||
data = { |
|||
page:1, |
|||
pageSize:4 |
|||
}; |
|||
} |
|||
commonApi._post(service,data).then(res=>{ |
|||
this.setData({ |
|||
fourProduct:res.data.list || res.data |
|||
}) |
|||
}) |
|||
}, |
|||
tagGotoDetail:function(e){ |
|||
let item = e.currentTarget.dataset.item; |
|||
if(this.data.indexHot[this.data.hotIndex].type=='movie'){ |
|||
wx.navigateTo({ |
|||
url: '/pages/list/movieticket/list/info/index?id='+item.third_id+'&title='+item.title, |
|||
}) |
|||
} |
|||
else { |
|||
util.gotoDetail(item) |
|||
} |
|||
}, |
|||
productGotoDetail:function(e){ |
|||
let item = e.currentTarget.dataset.item; |
|||
util.gotoDetail(item) |
|||
}, |
|||
gotoPath:function(e){ |
|||
wx.navigateTo({ |
|||
url: e.currentTarget.dataset.path, |
|||
}) |
|||
}, |
|||
gotoUrl:function(e){ |
|||
let url = e.currentTarget.dataset.url; |
|||
app.globalData.weburl = url; |
|||
wx.navigateTo({ |
|||
url:"/pages/pbService/web/index" |
|||
}) |
|||
}, |
|||
garbage:function(){ |
|||
wx.navigateToMiniProgram({ |
|||
appId: 'wx13be821f3b1afed3', |
|||
path:'pages/home/home' |
|||
}) |
|||
}, |
|||
gotoSku:function(){ |
|||
commonApi.user_post("pbservice/Ztfw/sukangCode").then(res=>{ |
|||
console.log(res) |
|||
app.globalData.weburl = res.data.url; |
|||
wx.navigateTo({ |
|||
url: '/pages/pbService/web/index' |
|||
}) |
|||
return; |
|||
}) |
|||
}, |
|||
audioGuide:function(){ |
|||
wx.navigateToMiniProgram({ |
|||
appId: 'wx74f380bc721a0379', |
|||
path:'/pages/listen/listen' |
|||
}) |
|||
}, |
|||
// 热门推荐
|
|||
getList:function(){ |
|||
if(!this.data.listMore) return; |
|||
commonApi._post("search/recommend",{ |
|||
offset:this.data.list.length, |
|||
limit:10 |
|||
}).then(res=>{ |
|||
res.data.map(item=>{ |
|||
if(item.ext.display_tags){ |
|||
item.ext.display_tags = item.ext.display_tags.split(",").splice(0,2) |
|||
} |
|||
else { |
|||
item.ext.display_tags = [] |
|||
} |
|||
}) |
|||
if(res.data.length<10) { |
|||
this.setData({ |
|||
listMore:false |
|||
}) |
|||
} |
|||
this.setData({ |
|||
list:this.data.list.concat(res.data) |
|||
}) |
|||
console.log(res) |
|||
}) |
|||
}, |
|||
onReachBottom:function(){ |
|||
this.getList() |
|||
}, |
|||
gotoDetail:function(e){ |
|||
let item = e.currentTarget.dataset.item; |
|||
if(item.type=='travels'){ |
|||
// 游记做特殊处理 其他都按照原来的来
|
|||
wx.navigateTo({ |
|||
url: '/pages/info/strategyInfo/index?id='+item.s_id, |
|||
}) |
|||
} |
|||
else { |
|||
util.gotoDetail(item.ext); |
|||
} |
|||
}, |
|||
getUserInfo: function(e) { |
|||
console.log(e) |
|||
app.globalData.userInfo = e.detail.userInfo |
|||
this.setData({ |
|||
userInfo: e.detail.userInfo, |
|||
hasUserInfo: true |
|||
meituan:function(){ |
|||
wx.navigateToMiniProgram({ |
|||
appId: 'wxde8ac0a21135c07d', |
|||
path:"hotel/pages/h5/index?q=https%3A%2F%2Ffenxiao.meituan.com%2Fopdtor%2Fh5%2Fhotel%2Fsearch%3FpartnerId%3D16829" |
|||
}) |
|||
}, |
|||
// 轮播图点击
|
|||
bannerClick:function(e){ |
|||
let item = e.currentTarget.dataset.item; |
|||
if(item.action=='href'){ |
|||
wx.navigateTo({ |
|||
url: item.href, |
|||
}) |
|||
} |
|||
else if(item.action=="web"){ |
|||
app.globalData.weburl = item.href; |
|||
wx.navigateTo({ |
|||
url: "/pages/pbService/web/index", |
|||
}) |
|||
} |
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
|
|||
@ -1,3 +1,5 @@ |
|||
{ |
|||
"usingComponents": {} |
|||
"usingComponents": { |
|||
"common-image":"/pages/component/commonImage/index" |
|||
} |
|||
} |
|||
@ -1,27 +1,256 @@ |
|||
<!--index.wxml--> |
|||
<view class="container"> |
|||
<view class="userinfo"> |
|||
<button wx:if="{{!hasUserInfo && canIUse}}" open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 获取头像昵称 </button> |
|||
<block wx:else> |
|||
<image bindtap="bindViewTap" class="userinfo-avatar" src="{{userInfo.avatarUrl}}" mode="cover"></image> |
|||
<text class="userinfo-nickname">{{userInfo.nickName}}</text> |
|||
</block> |
|||
</view> |
|||
<view class="usermotto"> |
|||
<text class="user-motto">{{motto}}</text> |
|||
</view> |
|||
<navigator url="/pages/login/index">登录授权</navigator> |
|||
<navigator url="/pages/list/store/index">feiyi</navigator> |
|||
<navigator url="/pages/list/activity/index">活动</navigator> |
|||
<navigator url="/pages/list/card/index">一卡游苏州</navigator> |
|||
<navigator url="/pages/list/road/index">精品线路</navigator> |
|||
<navigator url="/pages/list/strategy/index">攻略</navigator> |
|||
<navigator url="/pages/list/hotel/index">酒店住宿</navigator> |
|||
<navigator url="/pages/list/night/index">夜游苏州</navigator> |
|||
<navigator url="/pages/list/sale/index">限时特惠</navigator> |
|||
<navigator url="/pages/list/movieticket/index">电影票</navigator> |
|||
<navigator url="/pages/list/theatre/index">影院</navigator> |
|||
<navigator url="/pages/pbService/feiyi/index">非遗</navigator> |
|||
<navigator url="/pages/pbService/wwcx/index">文物查询</navigator> |
|||
<navigator url="/pages/list/six/index">苏城六纪</navigator> |
|||
<swiper class="swiper" indicator-dots="{{true}}" |
|||
autoplay="{{true}}" interval="{{5000}}" duration="{{300}}"> |
|||
<block wx:for="{{banner}}" wx:key="*this"> |
|||
<swiper-item bindtap="bannerClick" data-item="{{item}}"> |
|||
<image src="{{item.img}}" mode="aspectFill"></image> |
|||
</swiper-item> |
|||
</block> |
|||
</swiper> |
|||
<view wx:if="{{weather}}" class="top-box" style="right:{{right}}px;top:{{padHeight}}px;height:{{height}}px"> |
|||
<image src="{{weather.icon}}" mode="aspectFill"></image> |
|||
<view class="weather-num">{{weather.max_temp}}°</view> |
|||
<view class="weather">{{weather.weather}}</view> |
|||
<navigator url="/pages/search/index" class="search-box textOver"> |
|||
<view class="iconfont icon-sousuo"></view> |
|||
<view class="textOver">搜索想要的旅游产品或服务</view> |
|||
</navigator> |
|||
<image bindtap="gotoPath" data-path="/pages/user/service/index" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/top_service.png" mode="aspectFill"></image> |
|||
<image bindtap="gotoPath" data-path="/pages/list/message/index" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/top_msg.png" mode="aspectFill"></image> |
|||
</view> |
|||
<view class="top-icons"> |
|||
<view bindtap="gotoPath" data-path="/pages/list/activity/index" class="top-icon-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/icon1.png" mode="widthFix"></image> |
|||
<view class="top-icon-text">活动日历</view> |
|||
</view> |
|||
<view bindtap="gotoPath" data-path="/pages/list/scene/index" class="top-icon-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/icon3.png" mode="widthFix"></image> |
|||
<view class="top-icon-text">景点门票</view> |
|||
</view> |
|||
<view bindtap="gotoPath" data-path="/pages/list/hotel/index" class="top-icon-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/icon4.png" mode="widthFix"></image> |
|||
<view class="top-icon-text">酒店住宿</view> |
|||
</view> |
|||
<view bindtap="gotoPath" data-path="/pages/list/night/index" class="top-icon-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/icon5.png" mode="widthFix"></image> |
|||
<view class="top-icon-text">夜游苏州</view> |
|||
</view> |
|||
<view bindtap="gotoPath" data-path="/pages/list/card/index" class="top-icon-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/icon2.png" mode="widthFix"></image> |
|||
<view class="top-icon-text">一卡游苏州</view> |
|||
</view> |
|||
<view bindtap="gotoPath" data-path="/pages/list/museum/index" class="top-icon-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/icon6.png" mode="widthFix"></image> |
|||
<view class="top-icon-text">场馆预约</view> |
|||
</view> |
|||
<view bindtap="gotoPath" data-path="/pages/list/{{isTest?'scene':'feiyi'}}/index" class="top-icon-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/icon7.png" mode="widthFix"></image> |
|||
<view class="top-icon-text">非遗专卖</view> |
|||
</view> |
|||
<view bindtap="gotoPath" data-path="/pages/list/{{isTest?'activity':'theatre'}}/index" class="top-icon-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/icon8.png" mode="widthFix"></image> |
|||
<view class="top-icon-text">剧场演出</view> |
|||
</view> |
|||
<view bindtap="gotoPath" data-path="/pages/list/{{isTest?'road':'techan'}}/index" class="top-icon-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/icon9.png" mode="widthFix"></image> |
|||
<view class="top-icon-text">文创特产</view> |
|||
</view> |
|||
<view bindtap="gotoPath" data-path="/pages/list/movieticket/index" class="top-icon-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/icon10.png" mode="widthFix"></image> |
|||
<view class="top-icon-text">电影购票</view> |
|||
</view> |
|||
</view> |
|||
<view class="content"> |
|||
<view class="sale-road-boxes"> |
|||
<view class="sale-box"> |
|||
<view bindtap="gotoPath" data-path="/pages/list/{{isTest==false?'sale':'scene'}}/index" class="sale-title"><text>限时特惠</text>超值商品限时抢购</view> |
|||
<view class="sale-product" wx:if="{{saleProduct && isTest==false}}" bindtap="productGotoDetail" data-item="{{saleProduct.sku.product}}"> |
|||
<view class="sale-product-bg"></view> |
|||
<common-image class="sale-img" width="173rpx" height="165rpx" src="{{saleProduct.sku.headimg}}" mode="aspectFill"></common-image> |
|||
<!-- <image src="{{saleProduct.sku.headimg}}" class="sale-img" mode="aspectFill"></image> --> |
|||
<image class="sale-tip-img" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/sale.png" mode="widthFix"></image> |
|||
<view class="sale-info"> |
|||
<view class="sale-product-title textOver2">{{saleProduct.sku.product.title+saleProduct.sku.sku_name}}</view> |
|||
<view class="sale-price">￥{{saleProduct.price/100}}起</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="sale-box"> |
|||
<view bindtap="gotoPath" data-path="/pages/list/road/index" class="sale-title"><text>精品线路</text>精品线路精心挑选</view> |
|||
<view bindtap="productGotoDetail" data-item="{{roadProduct}}" class="sale-product" wx:if="{{roadProduct}}"> |
|||
<view class="sale-product-bg road-product-bg"></view> |
|||
<common-image class="sale-img" width="173rpx" height="165rpx" src="{{roadProduct.headimg}}" mode="aspectFill"></common-image> |
|||
<!-- <image src="{{roadProduct.headimg}}" class="sale-img" mode="aspectFill"></image> --> |
|||
<image class="sale-tip-img" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/road.png" mode="widthFix"></image> |
|||
<view class="sale-info"> |
|||
<view class="sale-product-title textOver2">{{roadProduct.title}}</view> |
|||
<view class="sale-price" style="color:#009989">￥{{roadProduct.price/100}}起</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="small-swiper-box"> |
|||
<swiper class="small-swiper" indicator-dots="{{true}}" |
|||
autoplay="{{true}}" interval="{{5000}}" duration="{{300}}"> |
|||
<block wx:for="{{xiaobanner}}" wx:key="*this"> |
|||
<swiper-item bindtap="bannerClick" data-item="{{item}}"> |
|||
<image style="border-radius:77rpx" src="{{item.img}}" mode="aspectFill"></image> |
|||
</swiper-item> |
|||
</block> |
|||
</swiper> |
|||
</view> |
|||
<!-- <view class="sale-road-boxes" style="margin-top:0"> |
|||
<image mode="widthFix" style="width:267rpx" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/title1.png"></image> |
|||
</view> |
|||
<view class="product-tags" wx:if="{{isTest==false}}"> |
|||
<view bindtap="changeHotIndex" data-index="{{index}}" class="product-tag{{hotIndex==index?' active':''}}" wx:for="{{indexHot}}">{{item.name}}</view> |
|||
</view> |
|||
<view class="tag-product-list"> |
|||
<view class="tag-product" wx:for="{{fourProduct}}" bindtap="tagGotoDetail" data-item="{{item}}"> |
|||
<common-image width="337rpx" height="213rpx" src="{{item.headimg}}" mode="aspectFill"></common-image> |
|||
<view class="product-info"> |
|||
<view class="textOver tag-product-title">{{item.title}}</view> |
|||
<view wx:if="{{indexHot[hotIndex].type!='movie'}}" class="textOver tag-product-address"><text class="iconfont icon-location"></text>{{item.address}}</view> |
|||
<view wx:else class="tag-product-address textOver">{{item.type}}</view> |
|||
<view wx:if="{{indexHot[hotIndex].type!='movie'}}" class="tag-product-price-box"> |
|||
<view class="price"><text class="unit">￥</text><text>{{item.price/100}}</text><text>起</text></view> |
|||
<view class="sale-number"><text>已售</text> {{item.sales_number}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="more-btn" bindtap="gotoPath" data-path="{{indexHot[hotIndex].url}}">查看更多<text class="iconfont icon-you"></text></view> --> |
|||
<view class="sale-road-boxes" style="margin-top:0"> |
|||
<image mode="widthFix" style="width:206rpx" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/title5.png"></image> |
|||
</view> |
|||
<view class="pic-list" style="margin-top:20rpx"> |
|||
<image bindtap="gotoPath" data-path="/pages/list/{{isTest?'road':'food'}}/index" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/pic1.png" mode="aspectFill"></image> |
|||
<image bindtap="audioGuide" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/pic2.png" mode="aspectFill"></image> |
|||
<image bindtap="gotoPath" data-path="/pages/list/strategy/index" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/pic3.png" mode="aspectFill"></image> |
|||
<image bindtap="city" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/pic4.png" mode="aspectFill"></image> |
|||
</view> |
|||
<view class="sale-road-boxes" style="margin-top:0"> |
|||
<image mode="widthFix" style="width:267rpx" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/title2.png"></image> |
|||
<navigator url="/pages/pbService/index" class="title-more">更多<text class="iconfont icon-you"></text> </navigator> |
|||
</view> |
|||
<view style="overflow-x:auto"> |
|||
<view class="pbservice"> |
|||
<!-- <view class="pbservice-item" bindtap="gotoSku"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/pb1.png" mode="widthFix"></image> |
|||
<view>苏康码</view> |
|||
</view> --> |
|||
<view bindtap="gotoPath" data-path="/pages/pbService/bike/index?type=1" class="pbservice-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/pb2.png" mode="widthFix"></image> |
|||
<view>找厕所</view> |
|||
</view> |
|||
<view bindtap="gotoPath" data-path="/pages/pbService/bike/index?type=2" class="pbservice-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/pb3.png" mode="widthFix"></image> |
|||
<view>停车场</view> |
|||
</view> |
|||
<view bindtap="gotoPath" data-path="/pages/pbService/security/index" class="pbservice-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/pb4.png" mode="widthFix"></image> |
|||
<view>安全服务</view> |
|||
</view> |
|||
<!-- <view bindtap="gotoPath" data-path="/pages/pbService/security/index" class="pbservice-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/pb9.png" mode="widthFix"></image> |
|||
<view>景区舒适度</view> |
|||
</view> --> |
|||
<view bindtap="gotoPath" data-path="/pages/pbService/bike/index?type=0" class="pbservice-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/pb10.png" mode="widthFix"></image> |
|||
<view>公共自行车</view> |
|||
</view> |
|||
<view bindtap="gotoPath" data-path="/pages/pbService/library/index" class="pbservice-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/pb14.png" style="width:53rpx" mode="widthFix"></image> |
|||
<view>借书还书</view> |
|||
</view> |
|||
|
|||
<view bindtap="gotoPath" data-path="/pages/pbService/feiyi/index" class="pbservice-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/pb5.png" mode="widthFix"></image> |
|||
<view>非遗传承</view> |
|||
</view> |
|||
<view bindtap="gotoUrl" data-url='https://hot-map.sz-trip.com/' class="pbservice-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/pb15.png" mode="widthFix" style="width:53rpx"></image> |
|||
<view>投资导引图</view> |
|||
</view> |
|||
<view bindtap="gotoPath" data-path="/pages/pbService/wbdw/index" class="pbservice-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/pb6.png" mode="widthFix"></image> |
|||
<view>文保单位</view> |
|||
</view> |
|||
<view bindtap="gotoPath" data-path="/pages/pbService/wwcx/index" class="pbservice-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/pb7.png" style="width:53rpx" mode="widthFix"></image> |
|||
<view>文物查询</view> |
|||
</view> |
|||
<view bindtap="gotoPath" data-path="/pages/pbService/appreciate/index" class="pbservice-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/pb8.png" style="width:53rpx" mode="widthFix"></image> |
|||
<view>在线鉴赏</view> |
|||
</view> |
|||
<view bindtap="gotoPath" data-path="/pages/pbService/gym/index" class="pbservice-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/pb12.png" mode="widthFix"></image> |
|||
<view>体育场馆</view> |
|||
</view> |
|||
<view bindtap="garbage" class="pbservice-item"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/pb11.png" mode="widthFix"></image> |
|||
<view>垃圾分类</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="sale-road-boxes" style="margin-top:0"> |
|||
<image mode="widthFix" style="width:267rpx" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/title3.png"></image> |
|||
</view> |
|||
<view class="six-box"> |
|||
<image bindtap="gotoPath" data-path="/pages/list/six/index?area={{area_ids[index]}}" wx:for="{{10}}" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/six{{index+1}}.png" mode="widthFix"></image> |
|||
</view> |
|||
<view class="sale-road-boxes" style="margin-top:0"> |
|||
<image mode="widthFix" style="width:267rpx" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/title4.png"></image> |
|||
</view> |
|||
<view class="hot-list" wx:if="{{isTest==false}}"> |
|||
<view class="hot-list-item" wx:for="{{2}}" wx:for-index="number"> |
|||
<view wx:for="{{list}}" wx:if="{{index%2==number}}" bindtap="gotoDetail" data-item="{{item}}"> |
|||
<view wx:if="{{number==0 && index==0}}" class="hot-item today-hot"> |
|||
<common-image class="today-main-img" width="100%" height="615rpx" src="{{item.ext.headimg}}" mode="aspectFill"></common-image> |
|||
<image class="today-tip-img" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/index/today.png" mode="widthFix"></image> |
|||
<view class="today-date">{{date}} {{month}}</view> |
|||
<view class="today-hot-box"> |
|||
<view class="today-hot-tag textOver" wx:for="{{item.ext.display_tags && ext.display_tags.length>0}}">{{item.ext.display_tags[0]}}</view> |
|||
<view class="today-hot-title">{{item.title}}</view> |
|||
</view> |
|||
</view> |
|||
<view class="hot-item" wx:elif="{{item.type=='travels'}}"> |
|||
<view style="position:relative"> |
|||
<common-image width="100%" src="{{item.ext.headimg}}" mode="widthFix"></common-image> |
|||
<view class="hot-location textOver">{{item.ext.subtitle}}</view> |
|||
</view> |
|||
<view class="hot-info"> |
|||
<view class="hot-title">{{item.title}}</view> |
|||
<view class="tags textOver" style="margin-bottom:0"> |
|||
<view class="icon-box"> |
|||
<text class="iconfont icon-xin"></text> |
|||
<text>{{item.ext.like_number}}</text> |
|||
</view> |
|||
<view class="icon-box"> |
|||
<text class="iconfont icon-eye"></text> |
|||
<text>{{item.ext.view_number}}</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view wx:else class="hot-item"> |
|||
<view style="position:relative"> |
|||
<common-image width="100%" src="{{item.ext.headimg}}" mode="widthFix"></common-image> |
|||
<view class="hot-location textOver"><text class="iconfont icon-location"></text>{{item.ext.address}}</view> |
|||
</view> |
|||
<view class="hot-info"> |
|||
<view class="hot-title">{{item.title}}</view> |
|||
<view class="tags textOver"> |
|||
<view wx:for="{{item.ext.display_tags}}" class="tag textOver">{{item}}</view> |
|||
</view> |
|||
<view class="hot-price"><text>￥</text><text>{{item.ext.price/100}}</text><text>起</text></view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view wx:else style="text-align:center;line-height:100rpx;font-size:24rpx;color:#666"> |
|||
暂无更多推荐 |
|||
</view> |
|||
</view> |
|||
|
|||
@ -1,21 +1,461 @@ |
|||
/**index.wxss**/ |
|||
.userinfo { |
|||
.swiper,.swiper image { |
|||
width: 100%; |
|||
display: block; |
|||
height: 367rpx; |
|||
} |
|||
.top-box { |
|||
position: absolute; |
|||
display: flex; |
|||
align-items: center; |
|||
left: 9rpx; |
|||
margin-right: 19rpx; |
|||
top: 14rpx; |
|||
justify-content: space-between; |
|||
} |
|||
.top-box image { |
|||
flex-shrink: 0; |
|||
width: 53rpx; |
|||
height: 53rpx; |
|||
display: block; |
|||
margin-left: 14rpx; |
|||
} |
|||
.search-box { |
|||
flex: 1; |
|||
width: 423rpx; |
|||
height: 54rpx; |
|||
background: #F6F6F6; |
|||
border-radius: 27rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
color: #999999; |
|||
font-size: 23rpx; |
|||
margin: 0 30rpx; |
|||
} |
|||
.search-box .iconfont { |
|||
font-size: 28rpx; |
|||
margin-left: 20rpx; |
|||
margin-right: 10rpx; |
|||
} |
|||
.top-box .weather-num,.top-box .weather { |
|||
flex-shrink: 0; |
|||
color: #fff; |
|||
} |
|||
.top-box .weather-num { |
|||
font-size: 29rpx; |
|||
margin-bottom: 10rpx; |
|||
margin-left: 4rpx; |
|||
} |
|||
.top-box .weather { |
|||
font-size: 19rpx; |
|||
margin-top: 20rpx; |
|||
margin-left: -4rpx; |
|||
} |
|||
.top-icons { |
|||
background: #FFFFFF; |
|||
box-shadow: 0px 3rpx 26rpx 0px rgba(6, 0, 1, 0.13); |
|||
border-radius: 27rpx; |
|||
margin: 0 20rpx; |
|||
margin-top: -20rpx; |
|||
position: relative; |
|||
z-index: 1; |
|||
display: flex; |
|||
padding: 34rpx 0; |
|||
padding-bottom: 7rpx; |
|||
justify-content: space-between; |
|||
flex-wrap: wrap; |
|||
} |
|||
.top-icon-item { |
|||
margin-bottom: 30rpx; |
|||
line-height: 37rpx; |
|||
font-size: 25rpx; |
|||
color: #000; |
|||
text-align: center; |
|||
flex-shrink: 0; |
|||
width: 20%; |
|||
} |
|||
.top-icon-item:nth-child(5n){ |
|||
margin-right: 0; |
|||
} |
|||
.top-icon-item image { |
|||
width: 87rpx; |
|||
display: block; |
|||
margin: 0 auto; |
|||
margin-bottom: 18rpx; |
|||
} |
|||
.content { |
|||
margin: 0 25rpx; |
|||
} |
|||
.sale-road-boxes { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
margin-top: 60rpx; |
|||
} |
|||
.sale-box { |
|||
flex-shrink: 0; |
|||
width: 337rpx; |
|||
} |
|||
.sale-title { |
|||
color: #999999; |
|||
font-size: 20rpx; |
|||
margin-bottom: 20rpx; |
|||
} |
|||
.sale-title text { |
|||
color: #000000; |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
margin-right: 8rpx; |
|||
} |
|||
.sale-product { |
|||
width: 337rpx; |
|||
position: relative; |
|||
height: 165rpx; |
|||
overflow: hidden; |
|||
border-radius: 8rpx; |
|||
} |
|||
.sale-product-bg { |
|||
width: 197rpx; |
|||
height: 165rpx; |
|||
position: absolute; |
|||
left: 0; |
|||
top: 0; |
|||
background: linear-gradient(90deg, #F78C56, #FB6044); |
|||
|
|||
.userinfo-avatar { |
|||
} |
|||
.road-product-bg { |
|||
background: linear-gradient(90deg, #35CFB4, #00A6A0); |
|||
} |
|||
.sale-img { |
|||
position: absolute; |
|||
right: 0; |
|||
top: 0; |
|||
width: 173rpx; |
|||
height: 165rpx; |
|||
} |
|||
.sale-info { |
|||
position: absolute; |
|||
left: 20rpx; |
|||
top: 20rpx; |
|||
bottom: 20rpx; |
|||
width: 140rpx; |
|||
} |
|||
.sale-product-title { |
|||
font-size: 28rpx; |
|||
color: #fff; |
|||
font-weight: 500; |
|||
line-height: 36rpx; |
|||
} |
|||
.sale-price { |
|||
padding: 0 10rpx; |
|||
color: #F44747; |
|||
font-size: 25rpx; |
|||
line-height: 39rpx; |
|||
background: #FFFFFF; |
|||
border-radius: 5rpx; |
|||
margin-top: 15rpx; |
|||
display: inline-block; |
|||
} |
|||
.sale-tip-img { |
|||
position: absolute; |
|||
width: 180rpx; |
|||
left: 157rpx; |
|||
top: 0; |
|||
} |
|||
.small-swiper { |
|||
height: 154rpx; |
|||
} |
|||
.small-swiper image { |
|||
display: block; |
|||
width: 100%; |
|||
height: 154rpx; |
|||
} |
|||
.small-swiper-box { |
|||
margin: 85rpx 0; |
|||
width: 100%; |
|||
height: 154rpx; |
|||
border-radius: 77rpx; |
|||
overflow: hidden; |
|||
} |
|||
.product-tags { |
|||
display: flex; |
|||
margin-top: 40rpx; |
|||
margin-bottom: 50rpx; |
|||
overflow-x: auto; |
|||
} |
|||
.product-tag { |
|||
padding: 0 20rpx; |
|||
height: 43rpx; |
|||
background: #F4F4F4; |
|||
border-radius: 21rpx; |
|||
font-size: 27rpx; |
|||
color: #666; |
|||
margin-right: 20rpx; |
|||
flex-shrink: 0; |
|||
} |
|||
.product-tag.active { |
|||
background: #0B898E; |
|||
color: #fff; |
|||
} |
|||
.tag-product-list { |
|||
display: flex; |
|||
flex-wrap: wrap; |
|||
justify-content: space-between; |
|||
} |
|||
.tag-product { |
|||
width: 337rpx; |
|||
background: #FFFFFF; |
|||
box-shadow: -1rpx 1rpx 16rpx 0px rgba(6, 0, 1, 0.1); |
|||
border-radius: 13rpx; |
|||
margin-bottom: 35rpx; |
|||
} |
|||
.tag-product image { |
|||
display: block; |
|||
width: 337rpx; |
|||
height: 213rpx; |
|||
border-radius: 13rpx 13rpx 0px 0px; |
|||
} |
|||
.tag-product .product-info { |
|||
padding: 20rpx; |
|||
padding-bottom: 0; |
|||
} |
|||
.tag-product .tag-product-title { |
|||
font-size: 33rpx; |
|||
color: #333333; |
|||
font-weight: 500; |
|||
margin-bottom: 10rpx; |
|||
} |
|||
.tag-product .tag-product-address { |
|||
color: #999; |
|||
font-size: 22rpx; |
|||
line-height: 40rpx; |
|||
padding-bottom: 10rpx; |
|||
} |
|||
.tag-product-price-box { |
|||
display: flex; |
|||
height: 70rpx; |
|||
align-items: center; |
|||
border-top: 1rpx solid #ccc; |
|||
justify-content: space-between; |
|||
} |
|||
.tag-product .tag-product-address .iconfont { |
|||
font-size: 26rpx; |
|||
} |
|||
.price { |
|||
color: #D62828; |
|||
font-size: 24rpx; |
|||
} |
|||
.price text:nth-child(2){ |
|||
font-weight: 500; |
|||
font-size: 33rpx; |
|||
} |
|||
.price text:nth-child(3){ |
|||
font-size: 20rpx; |
|||
color: #8D8D8D; |
|||
margin-left: 4rpx; |
|||
} |
|||
.sale-number { |
|||
font-size: 24rpx; |
|||
color: #666; |
|||
} |
|||
.sale-number text { |
|||
font-size: 21rpx; |
|||
} |
|||
.more-btn { |
|||
line-height: 77rpx; |
|||
border: 1rpx solid #0B898E; |
|||
border-radius: 39rpx; |
|||
text-align: center; |
|||
color: #0B898E; |
|||
font-size: 31rpx; |
|||
font-weight: 500; |
|||
} |
|||
.pic-list { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
margin: 90rpx 0; |
|||
} |
|||
.pic-list image { |
|||
width: 160rpx; |
|||
height: 200rpx; |
|||
display: block; |
|||
} |
|||
.title-more { |
|||
font-size: 27rpx; |
|||
color: #0B898E; |
|||
} |
|||
.title-more .iconfont { |
|||
font-size: 22rpx; |
|||
} |
|||
.pbservice { |
|||
width: calc(175rpx * 6); |
|||
display: flex; |
|||
margin-top: 20rpx; |
|||
flex-wrap: wrap; |
|||
margin-bottom: 100rpx; |
|||
} |
|||
.pbservice-item { |
|||
width: 175rpx; |
|||
text-align: center; |
|||
font-size: 25rpx; |
|||
color: #333; |
|||
line-height: 24rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
flex-direction: column; |
|||
} |
|||
.pbservice-item image { |
|||
width: 63rpx; |
|||
margin-bottom: 20rpx; |
|||
margin-top: 50rpx; |
|||
} |
|||
.six-box { |
|||
margin-top: 43rpx; |
|||
display: flex; |
|||
margin-bottom: 80rpx; |
|||
flex-wrap: wrap; |
|||
justify-content: space-between; |
|||
} |
|||
.six-box image { |
|||
width: 128rpx; |
|||
height: 128rpx; |
|||
margin: 20rpx; |
|||
border-radius: 50%; |
|||
height: 110rpx; |
|||
margin-bottom: 20rpx; |
|||
} |
|||
|
|||
.userinfo-nickname { |
|||
color: #aaa; |
|||
.hot-list { |
|||
display: flex; |
|||
margin-top: 47rpx; |
|||
justify-content: space-between; |
|||
} |
|||
.hot-list-item { |
|||
width: 337rpx; |
|||
} |
|||
.hot-item { |
|||
background: white; |
|||
box-shadow: -1rpx 1rpx 16rpx 0px rgba(6, 0, 1, 0.1); |
|||
border-radius: 15rpx; |
|||
margin-bottom: 35rpx; |
|||
} |
|||
.hot-item image:nth-child(1) { |
|||
display: block; |
|||
width: 100%; |
|||
border-radius: 15rpx 15rpx 0 0; |
|||
} |
|||
.hot-item .hot-info { |
|||
padding: 20rpx 25rpx; |
|||
} |
|||
.hot-item .hot-title { |
|||
font-size: 32rpx; |
|||
color: #333; |
|||
font-weight: 500; |
|||
} |
|||
.hot-info .tags { |
|||
display: flex; |
|||
align-items: center; |
|||
width: 286rpx; |
|||
margin: 15rpx 0; |
|||
} |
|||
.hot-info .tag { |
|||
margin-right: 16rpx; |
|||
line-height: 32rpx; |
|||
border: 1rpx solid #0B898E; |
|||
border-radius: 5rpx; |
|||
box-sizing: border-box; |
|||
padding: 0 10rpx; |
|||
color: #0B898E; |
|||
font-size: 20rpx; |
|||
} |
|||
.hot-info .tag:last-child { |
|||
margin-right: 0; |
|||
} |
|||
.hot-price { |
|||
color: #D62828; |
|||
font-size: 24rpx; |
|||
} |
|||
.hot-price text:nth-child(2){ |
|||
font-size: 33rpx; |
|||
font-weight: 500; |
|||
} |
|||
.hot-price text:nth-child(3){ |
|||
font-size: 20rpx; |
|||
color: #8D8D8D; |
|||
margin-left: 4rpx; |
|||
} |
|||
.hot-location { |
|||
position: absolute; |
|||
color: #fff; |
|||
line-height: 32rpx; |
|||
font-size: 19rpx; |
|||
padding: 20rpx; |
|||
bottom: 0; |
|||
left: 0; |
|||
right: 0; |
|||
} |
|||
.hot-location .iconfont { |
|||
font-size: 22rpx; |
|||
margin-right: 10rpx; |
|||
} |
|||
.hot-info .tags .icon-box { |
|||
flex-shrink: 0; |
|||
width: 50%; |
|||
text-align: left; |
|||
color: #666666; |
|||
font-size: 21rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.hot-info .tags .icon-box .iconfont { |
|||
font-size: 30rpx; |
|||
margin-right: 5rpx; |
|||
} |
|||
.today-hot { |
|||
position: relative; |
|||
border-radius: 15rpx; |
|||
font-size: 0; |
|||
} |
|||
.today-hot .today-main-img { |
|||
border-radius: 15rpx; |
|||
height: 615rpx; |
|||
} |
|||
.today-hot-box { |
|||
position: absolute; |
|||
left: 10rpx; |
|||
right: 10rpx; |
|||
bottom: 10rpx; |
|||
} |
|||
.today-hot-tag { |
|||
line-height: 34rpx; |
|||
max-width: 265rpx; |
|||
background: #FF2245; |
|||
border-radius: 15rpx 15rpx 0px 0px; |
|||
padding: 0 15rpx; |
|||
color: #fff; |
|||
font-size: 20rpx; |
|||
display: inline-block; |
|||
margin: 0 40rpx; |
|||
} |
|||
.today-hot-title { |
|||
background: rgba(255, 255, 255, 0.8); |
|||
padding: 20rpx 28rpx; |
|||
border-radius: 13rpx; |
|||
font-size: 33rpx; |
|||
color: #000; |
|||
font-weight: 500; |
|||
|
|||
.usermotto { |
|||
margin-top: 200px; |
|||
} |
|||
.today-hot .today-tip-img { |
|||
position: absolute; |
|||
width: 154rpx; |
|||
left: 11rpx; |
|||
top: 31rpx; |
|||
} |
|||
.today-date { |
|||
position: absolute; |
|||
top: 65rpx; |
|||
left: 11rpx; |
|||
width: 154rpx; |
|||
text-align: center; |
|||
font-size: 30rpx; |
|||
color: #fff; |
|||
letter-spacing: 3rpx; |
|||
font-weight: 500; |
|||
} |
|||
@ -0,0 +1,103 @@ |
|||
// pages/info/activityInfo/index.js
|
|||
import commonApi from "../../../utils/https/common" |
|||
let app = getApp() |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
id:null, |
|||
info:null |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
let id = options.id; |
|||
this.setData({ |
|||
id:id |
|||
}) |
|||
commonApi._post("pbservice/Actcalendar/getActDetail",{ |
|||
id:id |
|||
}).then(res=>{ |
|||
this.setData({ |
|||
info:res.data |
|||
}) |
|||
console.log(res) |
|||
}) |
|||
}, |
|||
order:function(){ |
|||
let skuid = this.data.info.sku_id; |
|||
if(!skuid) return; |
|||
commonApi._post("product/get_sku_detail_by_id",{ |
|||
sku_id:skuid |
|||
}).then(res=>{ |
|||
if(!res.data){ |
|||
wx.showToast({ |
|||
title: '本活动不支持预约', |
|||
icon:'none' |
|||
}) |
|||
return; |
|||
} |
|||
app.globalData.couponInfo = null; |
|||
app.globalData.product = { |
|||
sku:res.data, |
|||
product:res.data.product |
|||
} |
|||
wx.navigateTo({ |
|||
url: '/pages/order/scene/index?type=museum', |
|||
}) |
|||
}) |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,5 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"title":"/pages/component/TitleHeader" |
|||
} |
|||
} |
|||
@ -0,0 +1,45 @@ |
|||
<!--pages/info/activityInfo/index.wxml--> |
|||
<wxs src="../../../utils/filter.wxs" module="tool" /> |
|||
<title title="活动"></title> |
|||
<!-- <swiper class="swiper" indicator-dots="{{true}}" |
|||
autoplay="{{true}}" interval="{{2000}}" duration="{{300}}"> |
|||
<block wx:for="{{listimgs}}" wx:key="*this"> |
|||
<swiper-item> |
|||
<image src="{{item}}" mode="aspectFill"></image> |
|||
</swiper-item> |
|||
</block> |
|||
</swiper> --> |
|||
<view wx:if="{{info}}"> |
|||
<image src="{{info.post_url}}" mode="widthFix" class="swiper"></image> |
|||
<view class="top-box"> |
|||
<view class="top-box-title">{{info.name}}</view> |
|||
<view class="top-tip-box" wx:if="{{info.begin_date || info.end_date}}"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/activity/time.png" mode="widthFix"></image> |
|||
<text>活动时间：{{info.begin_date}} ~ {{info.end_date}}</text> |
|||
</view> |
|||
<view class="top-tip-box" wx:if="{{info.detail_address}}"> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/activity/location.png" mode="widthFix"></image> |
|||
<text>活动地点：{{info.detail_address}}</text> |
|||
</view> |
|||
</view> |
|||
<!-- <view class="box-title">活动场次</view> |
|||
<view style="height:30rpx"></view> |
|||
<view class="time" wx:for="{{10}}">活动场次名称 2020/06/13 9:00:00至2020/06/13 12:00:00</view> --> |
|||
<view class="box-title">活动时间</view> |
|||
<view class="box-content"> |
|||
<!-- 2020/12/20 14:00-16:30 --> |
|||
{{info.begin_date}} ~ {{info.end_date}} |
|||
</view> |
|||
<view class="box-title">活动详情</view> |
|||
<!-- <view class="box-content">展览预约开放期间需遵守如下规定： |
|||
1、文化馆展厅预约开放时间为周一至周五9：30-11：30。周六、周日暂不开放。（上午10：30后停止入场） |
|||
2、疫情防控期间暂时关闭文化馆南门、西门及文化馆与图书馆连廊通道，仅开放文化馆北门为出入口。 |
|||
</view> --> |
|||
<rich-text class="box-content" nodes="{{tool.formateRichText(info.intro)}}"></rich-text> |
|||
<!-- <view class="box-tip" wx:if="{{info && info.is_bind_our_sku==0}}">* 本活动无需在线预约，可直接前往。</view> --> |
|||
</view> |
|||
<view style="height:124rpx" wx:if="{{info && info.is_bind_our_sku!=0 && info.sku_id}}"></view> |
|||
<view class="bottom-fixed" wx:if="{{info && info.is_bind_our_sku!=0 && info.sku_id}}"> |
|||
<view class="bottom-btn" bindtap="order" wx:if="{{info.is_act_end==0}}">预约活动</view> |
|||
<view class="bottom-btn disable" wx:else>活动已过期</view> |
|||
</view> |
|||
@ -0,0 +1,95 @@ |
|||
/* pages/info/activityInfo/index.wxss */ |
|||
.swiper ,.swiper image{ |
|||
width: 100%; |
|||
height: 330rpx; |
|||
display: block; |
|||
} |
|||
.top-box { |
|||
margin: 25rpx; |
|||
margin-top: -25rpx; |
|||
position: relative; |
|||
z-index: 1; |
|||
background: #FFFFFF; |
|||
box-shadow: 0px 0px 16rpx 0px rgba(6, 0, 1, 0.1); |
|||
border-radius: 13rpx; |
|||
padding: 20rpx 30rpx; |
|||
} |
|||
.top-box-title { |
|||
font-size: 31rpx; |
|||
color: #000; |
|||
} |
|||
.top-tip-box { |
|||
font-size: 24rpx; |
|||
color: #999; |
|||
display: flex; |
|||
align-items: center; |
|||
margin-top: 20rpx; |
|||
} |
|||
.top-tip-box image { |
|||
width: 29rpx; |
|||
height: 29rpx; |
|||
display: block; |
|||
margin-right: 25rpx; |
|||
} |
|||
.box-title { |
|||
font-weight: 500; |
|||
font-size: 35rpx; |
|||
color: #000; |
|||
margin: 0 27rpx; |
|||
margin-top: 50rpx; |
|||
} |
|||
.box-content { |
|||
margin: 0 27rpx; |
|||
font-size: 25rpx; |
|||
color: #333; |
|||
margin-top: 34rpx; |
|||
display: block; |
|||
} |
|||
.box-tip { |
|||
margin: 0 27rpx; |
|||
color: #D62828; |
|||
margin-top: 50rpx; |
|||
font-size: 25rpx; |
|||
margin-bottom: 30rpx; |
|||
} |
|||
.time { |
|||
margin: 0 27rpx; |
|||
margin-bottom: 17rpx; |
|||
border: 1rpx solid #999; |
|||
border-radius: 10rpx; |
|||
color: #666; |
|||
font-size: 24rpx; |
|||
padding: 0 19rpx; |
|||
line-height: 73rpx; |
|||
} |
|||
.time.active { |
|||
border-color: #0B898E; |
|||
background: #0B898E; |
|||
color: #fff; |
|||
} |
|||
.bottom-fixed { |
|||
position: fixed; |
|||
width: 750rpx; |
|||
height: 104rpx; |
|||
background: #FFFFFF; |
|||
left: 0; |
|||
bottom: 0; |
|||
box-shadow: -1rpx 1rpx 16rpx 0px rgba(6, 0, 1, 0.1); |
|||
display: flex; |
|||
z-index: 1; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
.bottom-btn { |
|||
width: 391rpx; |
|||
line-height: 74rpx; |
|||
background: #D62828; |
|||
border-radius: 37rpx; |
|||
font-size: 31rpx; |
|||
font-weight: 500; |
|||
color: #fff; |
|||
text-align: center; |
|||
} |
|||
.bottom-btn.disable { |
|||
background: #ccc; |
|||
} |
|||
@ -0,0 +1,168 @@ |
|||
// pages/info/roadInfo/index.js
|
|||
let device = wx.getSystemInfoSync(); |
|||
const ratio = device.windowWidth / 750; |
|||
import commonApi from "../../../utils/https/common" |
|||
import util from "../../../utils/util" |
|||
let app = getApp() |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
fixed:false, |
|||
type:1, |
|||
info:null, |
|||
top:0 |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
if(options.id){ |
|||
this.setData({ |
|||
id:options.id |
|||
}) |
|||
} |
|||
else { |
|||
util.back(); |
|||
return; |
|||
} |
|||
let rect = wx.getMenuButtonBoundingClientRect(); |
|||
let height = (rect.top - device.statusBarHeight) * 2 + rect.height + device.statusBarHeight; |
|||
console.log(height) |
|||
this.setData({ |
|||
top:height |
|||
}) |
|||
let api = commonApi._post; |
|||
if(wx.getStorageSync("jstrip_token")){ |
|||
api = commonApi.user_post; |
|||
} |
|||
api("product/get_product_detail",{ |
|||
id:options.id |
|||
}).then(res=>{ |
|||
res.data.display_tags = (res.data.display_tags?res.data.display_tags.split(","):[]).splice(0,2); |
|||
res.data.sku.map(item=>{ |
|||
item.sku_model.recharge = item.sku_model.recharge?item.sku_model.recharge.split(","):[]; |
|||
item.sku_model.recharge.map(item=>{ |
|||
item = Number(item); |
|||
}) |
|||
}) |
|||
this.setData({ |
|||
info:res.data |
|||
}) |
|||
}) |
|||
}, |
|||
changeMenu:function(e){ |
|||
let index = e.currentTarget.dataset.index,that = this; |
|||
const query=wx.createSelectorQuery(); //创建节点查询器
|
|||
query.select("#box"+index).boundingClientRect() //选择toViewid获取位置信息
|
|||
query.selectViewport().scrollOffset() //获取页面查询位置的
|
|||
query.exec(function(res) { |
|||
let scrollTop = res[0].top + res[1].scrollTop - 110 * ratio - that.data.top; |
|||
wx.pageScrollTo({ |
|||
scrollTop: scrollTop + 4, |
|||
duration: 0 |
|||
}) |
|||
that.setData({ |
|||
type:index |
|||
}) |
|||
}) |
|||
}, |
|||
order:function(){ |
|||
app.globalData.couponInfo = null; |
|||
app.globalData.product = { |
|||
product:this.data.info, |
|||
sku:this.data.info.sku[0] |
|||
} |
|||
wx.navigateTo({ |
|||
url: '/pages/order/card/index' |
|||
}) |
|||
}, |
|||
onPageScroll:function(e){ |
|||
let that = this,height = this.data.top; |
|||
let topHeight = height; |
|||
wx.createSelectorQuery().select('#menus').boundingClientRect(function(rect){ |
|||
console.log(rect.top,topHeight) |
|||
if(rect.top<=topHeight){ |
|||
// 此时应该把menus固定在顶部
|
|||
that.setData({ |
|||
fixed:true |
|||
}) |
|||
} |
|||
else{ |
|||
that.setData({ |
|||
fixed:false |
|||
}) |
|||
} |
|||
// 滚动时判断滚动到哪个部分了
|
|||
const query=wx.createSelectorQuery(); //创建节点查询器
|
|||
query.select("#box1").boundingClientRect() //选择toViewid获取位置信息
|
|||
query.select("#box2").boundingClientRect() //选择toViewid获取位置信息
|
|||
let minHeight = that.data.fixed?(110 * ratio + height): topHeight; |
|||
query.exec(function(res) { |
|||
if(res[1].top<minHeight){ |
|||
that.setData({ |
|||
type:2 |
|||
}) |
|||
} |
|||
else { |
|||
that.setData({ |
|||
type:1 |
|||
}) |
|||
} |
|||
}) |
|||
}).exec() |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,5 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"title":"/pages/component/TitleHeader" |
|||
} |
|||
} |
|||
@ -0,0 +1,54 @@ |
|||
<!--pages/info/hotelProductInfo/index.wxml--> |
|||
<wxs src="../../../utils/filter.wxs" module="tool" /> |
|||
<title title="产品详情"></title> |
|||
<swiper class="swiper" indicator-dots="{{true}}" wx:if="{{info}}" |
|||
autoplay="{{true}}" interval="{{2000}}" duration="{{300}}"> |
|||
<block wx:for="{{info.listimg}}" wx:key="*this"> |
|||
<swiper-item> |
|||
<image src="{{item}}" mode="aspectFill"></image> |
|||
</swiper-item> |
|||
</block> |
|||
</swiper> |
|||
<view class="top-info" wx:if="{{info}}"> |
|||
<view class="title">{{info.title}}</view> |
|||
<view class="tags-box textOver"> |
|||
<view class="tag textOver" wx:for="{{info.display_tags}}">{{item}}<view class="line"></view></view> |
|||
<view class="tags-price"><text>￥</text><text>{{info.price/100}}</text><text>起</text></view> |
|||
</view> |
|||
</view> |
|||
<view class="scroll-all-box" id="menus"> |
|||
<view class="scroll-menus{{fixed?' fixed-menus':''}}" style="top:{{top}}px"> |
|||
<view class="scroll-menu-item{{type==1?' active':''}}" bindtap="changeMenu" data-index="1">产品详情</view> |
|||
<view class="scroll-menu-item{{type==2?' active':''}}" bindtap="changeMenu" data-index="2">预定须知</view> |
|||
</view> |
|||
<view style="height:85rpx" wx:if="{{fixed}}"></view> |
|||
<view class="info-box" id="box1"> |
|||
<view class="info-title">产品详情</view> |
|||
<!-- <rich-text class="details"></rich-text> --> |
|||
<rich-text class="detail" nodes="{{tool.formateRichText(info.content)}}"></rich-text> |
|||
<!-- <view class="details" wx:for="{{6}}"> |
|||
在这里，酣畅淋漓的做一场偶像梦，你就是星光闪耀的明日之星！下一站天王天后，等你来！ |
|||
演出形式、内容：半露天卡通剧场，儿童剧，亲子互动 |
|||
表演时长：30分钟 |
|||
表演故事线：“最Q童星奖”PK赛现场直播啦！刚从电影学院新鲜出炉的小明星们，赶快大展身手吧！ |
|||
</view> --> |
|||
</view> |
|||
<view class="info-box" id="box2"> |
|||
<view class="info-title">预定须知</view> |
|||
<rich-text class="detail" nodes="{{tool.formateRichText(info.book_info)}}"></rich-text> |
|||
<!-- <rich-text class="details" nodes="{{filter.formateRichText(skuInfo[0].feeDescription)}}"></rich-text> --> |
|||
<!-- <view class="details" wx:for="{{6}}"> |
|||
在这里，酣畅淋漓的做一场偶像梦，你就是星光闪耀的明日之星！下一站天王天后，等你来！ |
|||
演出形式、内容：半露天卡通剧场，儿童剧，亲子互动 |
|||
表演时长：30分钟 |
|||
表演故事线：“最Q童星奖”PK赛现场直播啦！刚从电影学院新鲜出炉的小明星们，赶快大展身手吧！ |
|||
</view> --> |
|||
</view> |
|||
</view> |
|||
<view style="height:140rpx"></view> |
|||
<view class="fixed-bottom" wx:if="{{info}}"> |
|||
<view class="kefu-box"> |
|||
￥{{info.price/100}} |
|||
</view> |
|||
<view bindtap="order" class="btn">立即预订</view> |
|||
</view> |
|||
@ -0,0 +1,368 @@ |
|||
/* pages/info/hotelProductInfo/index.wxss */ |
|||
page { |
|||
background: #f2f2f2; |
|||
} |
|||
.swiper { |
|||
width: 100%; |
|||
height: 400rpx; |
|||
} |
|||
.swiper image { |
|||
height: 400rpx; |
|||
display: block; |
|||
width: 100%; |
|||
} |
|||
.top-info { |
|||
border-radius: 20rpx 20rpx 0 0; |
|||
background: white; |
|||
position: relative; |
|||
z-index: 1; |
|||
margin-top: -20rpx; |
|||
padding: 20rpx 40rpx; |
|||
} |
|||
.top-info .title { |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
color: #000; |
|||
} |
|||
.tags-box { |
|||
margin-top: 10rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
color: #0B898E; |
|||
font-size: 27rpx; |
|||
height: 50rpx; |
|||
} |
|||
.tags-box .tag { |
|||
position: relative; |
|||
line-height: 20rpx; |
|||
font-size: 20rpx; |
|||
font-weight: 500; |
|||
line-height: 50rpx; |
|||
margin-right: 10rpx; |
|||
} |
|||
.tags-box .tag .line { |
|||
content: "1"; |
|||
display: block; |
|||
font-size: 0; |
|||
position: absolute; |
|||
left: 0; |
|||
right: 0; |
|||
background: #DAF3E9; |
|||
height: 8rpx; |
|||
top: 30rpx; |
|||
z-index: -1; |
|||
} |
|||
.tags-price { |
|||
flex: 1; |
|||
text-align: right; |
|||
color: #D62828; |
|||
} |
|||
.tags-price text:nth-child(1){ |
|||
font-size: 27rpx; |
|||
} |
|||
.tags-price text:nth-child(2){ |
|||
font-size: 40rpx; |
|||
font-weight: bold; |
|||
} |
|||
.tags-price text:nth-child(3){ |
|||
font-size: 20rpx; |
|||
color: #999999; |
|||
margin-left: 4rpx; |
|||
} |
|||
.tags-box .iconfont { |
|||
margin-left: 4rpx; |
|||
font-size: 24rpx; |
|||
} |
|||
.address-box { |
|||
justify-content: space-between; |
|||
margin-top: 0; |
|||
} |
|||
.info-address { |
|||
color: #666; |
|||
font-size: 27rpx; |
|||
margin-bottom: 0rpx; |
|||
height: 30rpx; |
|||
line-height: 30rpx; |
|||
} |
|||
.address-box .iconfont { |
|||
font-size: 34rpx; |
|||
} |
|||
.date-all-box { |
|||
margin: 24rpx 20rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
height: 80rpx; |
|||
border-radius: 13rpx; |
|||
background: #0B898E; |
|||
font-size: 31rpx; |
|||
color: #fff; |
|||
font-weight: 500; |
|||
padding: 0 37rpx; |
|||
} |
|||
.days { |
|||
text-align: center; |
|||
font-size: 400; |
|||
width: 84rpx; |
|||
line-height: 34rpx; |
|||
height: 34rpx; |
|||
border-radius: 18rpx; |
|||
border: 1px solid white; |
|||
font-size: 23rpx; |
|||
} |
|||
.picker text { |
|||
font-weight: 400; |
|||
font-size: 21rpx; |
|||
margin-left: 13rpx; |
|||
} |
|||
.product-item { |
|||
display: flex; |
|||
align-items: flex-end; |
|||
justify-content: space-between; |
|||
margin: 20rpx; |
|||
padding: 24rpx 20rpx; |
|||
background: white; |
|||
border-radius: 13rpx; |
|||
} |
|||
.product-item image { |
|||
width: 201rpx; |
|||
height: 201rpx; |
|||
border-radius: 10rpx; |
|||
margin-right: 26rpx; |
|||
flex-shrink: 0; |
|||
} |
|||
.product-item .product-info { |
|||
flex: 1; |
|||
} |
|||
.product-item .product-info .title { |
|||
font-size: 32rpx; |
|||
color: #000; |
|||
font-weight: 500; |
|||
} |
|||
.product-right { |
|||
flex-shrink: 0; |
|||
margin-left: 20rpx; |
|||
} |
|||
.product-right .price { |
|||
color: #D62828; |
|||
font-size: 40rpx; |
|||
font-weight: 500; |
|||
} |
|||
.product-right .price::before { |
|||
content: "￥"; |
|||
font-size: 27rpx; |
|||
font-weight: 400; |
|||
} |
|||
.product-right .btn { |
|||
color: #fff; |
|||
width: 120rpx; |
|||
line-height: 80rpx; |
|||
background: #D62828; |
|||
border-radius: 13rpx; |
|||
font-size: 31rpx; |
|||
font-weight: 500; |
|||
text-align: center; |
|||
margin-top: 20rpx; |
|||
} |
|||
.product-info .subtitle { |
|||
font-size: 24rpx; |
|||
line-height: 36rpx; |
|||
height: 72rpx; |
|||
margin-top: 10rpx; |
|||
margin-bottom: 20rpx; |
|||
color: #999; |
|||
white-space: normal; |
|||
} |
|||
.product-tags { |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.product-tag { |
|||
font-size: 20rpx; |
|||
color: #0B898E; |
|||
border-radius: 16rpx; |
|||
line-height: 30rpx; |
|||
border: 1rpx solid; |
|||
padding: 0 15rpx; |
|||
margin-right: 13rpx; |
|||
} |
|||
.product-tags .product-tags:last-child { |
|||
margin-right: 0; |
|||
} |
|||
.box { |
|||
margin: 20rpx; |
|||
background: white; |
|||
border-radius: 13rpx; |
|||
} |
|||
.box-top { |
|||
line-height: 95rpx; |
|||
border-bottom: 1rpx solid #d9d9d9; |
|||
font-weight: 500; |
|||
color: #000; |
|||
font-size: 35rpx; |
|||
padding: 0 20rpx; |
|||
} |
|||
.box-top .iconfont { |
|||
color: #0B898E; |
|||
font-size: 33rpx; |
|||
margin-right: 16rpx; |
|||
} |
|||
.empty-box { |
|||
text-align: center; |
|||
padding: 40rpx 0; |
|||
font-size: 23rpx; |
|||
color: #333; |
|||
} |
|||
.empty-btn { |
|||
margin: 0 auto; |
|||
margin-top: 30rpx; |
|||
width: 283rpx; |
|||
line-height: 79rpx; |
|||
border: 1rpx solid #0B898E; |
|||
border-radius: 39rpx; |
|||
color: #0B898E; |
|||
font-size: 32rpx; |
|||
margin-bottom: 10rpx; |
|||
} |
|||
.box-top .score { |
|||
color: #D62828; |
|||
font-size: 30rpx; |
|||
font-weight: 400; |
|||
margin-left: 11rpx; |
|||
} |
|||
.product-comment { |
|||
margin: 0 20rpx; |
|||
border-bottom: 1rpx solid #ccc; |
|||
padding: 33rpx 0; |
|||
} |
|||
.product-comment-top { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
color: #999999; |
|||
align-items: center; |
|||
font-size: 24rpx; |
|||
} |
|||
.product-comment-top image { |
|||
flex-shrink: 0; |
|||
width: 57rpx; |
|||
height: 57rpx; |
|||
border-radius: 50%; |
|||
} |
|||
.product-comment-top .comment-info { |
|||
flex: 1; |
|||
margin: 0 15rpx; |
|||
color: #666; |
|||
font-size: 21rpx; |
|||
} |
|||
.product-comment-top .comment-info .iconfont { |
|||
color: #D62828; |
|||
font-size: 22rpx; |
|||
} |
|||
.product-comment-top .comment-info .iconfont text { |
|||
margin-right: 6rpx; |
|||
} |
|||
.comment-content { |
|||
margin-left: 72rpx; |
|||
margin-top: 36rpx; |
|||
font-size: 28rpx; |
|||
color: #000; |
|||
} |
|||
.more-comment-btn { |
|||
line-height: 93rpx; |
|||
margin-right: 20rpx; |
|||
text-align: right; |
|||
color: #999; |
|||
font-size: 27rpx; |
|||
font-weight: 500; |
|||
} |
|||
.more-comment-btn .iconfont { |
|||
margin-left: 6rpx; |
|||
font-size: 24rpx; |
|||
} |
|||
.all-comment-num { |
|||
float: right; |
|||
color: #999999; |
|||
font-size: 27rpx; |
|||
font-weight: 400; |
|||
} |
|||
.scroll-all-box { |
|||
margin: 24rpx 0; |
|||
background: white; |
|||
} |
|||
.scroll-menus { |
|||
padding: 0 40rpx; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
font-size: 29rpx; |
|||
color: #333; |
|||
height: 84rpx; |
|||
border-bottom: 1rpx solid #d9d9d9; |
|||
} |
|||
.scroll-menu-item { |
|||
position: relative; |
|||
line-height: 84rpx; |
|||
} |
|||
.scroll-menu-item:nth-child(1){ |
|||
margin-right: 247rpx; |
|||
} |
|||
.scroll-menu-item.active::after { |
|||
content: "1"; |
|||
font-size: 0; |
|||
display: block; |
|||
position: absolute; |
|||
width: 46rpx; |
|||
height: 6rpx; |
|||
border-radius: 3rpx; |
|||
background: #0B898E; |
|||
left: 50%; |
|||
margin-left: -23rpx; |
|||
bottom: 0rpx; |
|||
} |
|||
.fixed-menus { |
|||
position: fixed; |
|||
left: 0; |
|||
right: 0; |
|||
background: white; |
|||
z-index: 1; |
|||
} |
|||
.info-title { |
|||
font-size: 35rpx; |
|||
font-weight: bold; |
|||
color: #000; |
|||
margin-bottom: 30rpx; |
|||
} |
|||
.info-box { |
|||
padding: 20rpx 40rpx; |
|||
} |
|||
.fixed-bottom { |
|||
position: fixed; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
height: 140rpx; |
|||
background: white; |
|||
display: flex; |
|||
align-items: center; |
|||
box-shadow: 0px 0px 16rpx 0px rgba(6, 0, 1, 0.1); |
|||
padding: 0 40rpx; |
|||
color: #666666; |
|||
font-size: 23rpx; |
|||
justify-content: space-between; |
|||
text-align: center; |
|||
} |
|||
.fixed-bottom .kefu-box { |
|||
color: #D62828; |
|||
font-size: 36rpx; |
|||
font-weight: 500; |
|||
} |
|||
.btn { |
|||
color: #fff; |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
width: 294rpx; |
|||
line-height: 78rpx; |
|||
background: #D62828; |
|||
border-radius: 39rpx; |
|||
text-align: center; |
|||
} |
|||
@ -0,0 +1,73 @@ |
|||
// pages/info/foodInfo/index.js
|
|||
import commonApi from "../../../utils/https/common" |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
info:null |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
commonApi._post("scene/detail",{ |
|||
id:options.id |
|||
}).then(res=>{ |
|||
this.setData({ |
|||
info:res.data |
|||
}) |
|||
}) |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,5 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"title":"/pages/component/TitleHeader" |
|||
} |
|||
} |
|||
@ -0,0 +1,17 @@ |
|||
<wxs src="../../../utils/filter.wxs" module="tool" /> |
|||
<title title="产品详情"></title> |
|||
<swiper class="swiper" indicator-dots="{{true}}" wx:if="{{info}}" |
|||
autoplay="{{true}}" interval="{{2000}}" duration="{{300}}"> |
|||
<block wx:for="{{info.listimg}}" wx:key="*this"> |
|||
<swiper-item> |
|||
<image src="{{item}}" mode="aspectFill"></image> |
|||
</swiper-item> |
|||
</block> |
|||
</swiper> |
|||
<view class="top-box" wx:if="{{info}}"> |
|||
<view class="title">{{info.title}}</view> |
|||
<view class="info-address">{{info.address}}</view> |
|||
</view> |
|||
<view class="content"> |
|||
<rich-text nodes="{{tool.formateRichText(info.content)}}"></rich-text> |
|||
</view> |
|||
@ -0,0 +1,34 @@ |
|||
/* pages/info/foodInfo/index.wxss */ |
|||
.swiper { |
|||
width: 100%; |
|||
height: 400rpx; |
|||
} |
|||
.swiper image { |
|||
height: 400rpx; |
|||
display: block; |
|||
width: 100%; |
|||
} |
|||
page { |
|||
background: #f6f6f6; |
|||
} |
|||
.top-box { |
|||
padding: 20rpx 39rpx; |
|||
background: white; |
|||
border-radius: 20rpx 20rpx 0px 0px; |
|||
margin-bottom: 25rpx; |
|||
} |
|||
.title { |
|||
font-size: 32rpx; |
|||
color: #000; |
|||
font-weight:500; |
|||
} |
|||
.info-address { |
|||
color: #666; |
|||
font-size: 27rpx; |
|||
margin-top: 20rpx; |
|||
} |
|||
.content { |
|||
font-size: 30rpx; |
|||
padding: 40rpx; |
|||
background: white; |
|||
} |
|||
@ -0,0 +1,123 @@ |
|||
// pages/info/sceneProductInfo/index.js
|
|||
import commonApi from "../../../utils/https/common" |
|||
let app = getApp() |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
info:{}, |
|||
number:['一','二','三','四','五','六','七','八','九','十','十一','十二'], |
|||
skuIndex:0, |
|||
bookingInfo:null, |
|||
skuName:"" |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
let api = commonApi._post |
|||
if(wx.getStorageSync("jstrip_token")){ |
|||
api = commonApi.user_post |
|||
} |
|||
api("product/get_product_detail",{ |
|||
id:options.id |
|||
}).then(res=>{ |
|||
let tags = res.data.display_tags?res.data.display_tags.split(","):[]; |
|||
res.data.tags = tags.splice(0,2); |
|||
res.data.sku.map(item=>{ |
|||
item.display_tags = (item.display_tags?item.display_tags.split(','):[]).splice(0,2) |
|||
}) |
|||
// res.data.listimg = res.data.listimg?res.data.listimg.split(","):[];
|
|||
this.setData({ |
|||
info:res.data |
|||
}) |
|||
console.log(res) |
|||
}) |
|||
}, |
|||
changeSku:function(e){ |
|||
this.setData({ |
|||
skuIndex:e.currentTarget.dataset.index |
|||
}) |
|||
}, |
|||
showNotice:function(e){ |
|||
let sku = e.currentTarget.dataset.sku; |
|||
this.setData({ |
|||
skuName:sku.sku_name, |
|||
bookingInfo:sku.sku_model |
|||
}) |
|||
}, |
|||
closeMask:function(){ |
|||
this.setData({ |
|||
skuName:"", |
|||
bookingInfo:null |
|||
}) |
|||
}, |
|||
gotoLocation:function(){ |
|||
let info = this.data.info; |
|||
if(info && info.lat && info.lon){ |
|||
wx.openLocation({ |
|||
latitude: Number(info.lat), |
|||
longitude: Number(info.lon) |
|||
}) |
|||
} |
|||
}, |
|||
order:function(e){ |
|||
app.globalData.couponInfo = null; |
|||
app.globalData.product = e.currentTarget.dataset; |
|||
wx.navigateTo({ |
|||
url: '/pages/order/food/index', |
|||
}) |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,6 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"title":"/pages/component/TitleHeader", |
|||
"notice":"/pages/component/notice/notice" |
|||
} |
|||
} |
|||
@ -0,0 +1,78 @@ |
|||
<!--pages/info/sceneProductInfo/index.wxml--> |
|||
<wxs src="../../../utils/filter.wxs" module="tool" /> |
|||
<title title="产品详情"></title> |
|||
<view class="iconfont icon-xin"></view> |
|||
<swiper class="swiper" indicator-dots="{{true}}" |
|||
autoplay="{{true}}" interval="{{2000}}" duration="{{300}}" wx:if="{{info.listimg}}"> |
|||
<block wx:for="{{info.listimg}}" wx:key="*this"> |
|||
<swiper-item> |
|||
<image src="{{item}}" mode="aspectFill"></image> |
|||
</swiper-item> |
|||
</block> |
|||
</swiper> |
|||
<view class="top-info"> |
|||
<view class="title">{{info.title}}</view> |
|||
<view class="tags-box textOver" style="height:auto"> |
|||
<view class="tag textOver" wx:for="{{info.tags}}">{{item}}<view class="line"></view></view> |
|||
<view class="tags-price"><text>￥</text><text>{{info.price/100}}</text><text>起</text></view> |
|||
<!-- <view class="tags-text">详情 <text class="iconfont icon-you"></text></view> --> |
|||
</view> |
|||
</view> |
|||
<view class="box"> |
|||
<view class="box-top" style="border-top:none;border-bottom:1rpx solid #d9d9d9"> |
|||
<text>{{info.title}}</text> |
|||
</view> |
|||
<view class="product-item" wx:for="{{info.sku}}"> |
|||
<view class="skutitle">{{item.sku_name}}</view> |
|||
<view class="product-box"> |
|||
<view class="product-left textOver"> |
|||
<view class="product-tags"> |
|||
<view class="product-tag textOver" wx:for="{{item.display_tags}}">{{item}}</view> |
|||
</view> |
|||
<view class="order-tip-text" bindtap="showNotice" data-sku="{{item}}">预订须知>></view> |
|||
</view> |
|||
<view class="product-right"> |
|||
<view class="price"><text>￥</text><text>{{item.price/100}}</text><text>起</text></view> |
|||
<view class="btn" data-product="{{info}}" data-sku="{{item}}" bindtap="order">立即预订</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<!-- <view class="empty-box"> |
|||
<view>这里空空如也，快去向大家提问吧!</view> |
|||
<view class="empty-btn">去提问</view> |
|||
</view> --> |
|||
</view> |
|||
<view class="box" wx:if="{{info}}"> |
|||
<view class="box-top" style="border-top:none"> |
|||
<text>商家信息</text> |
|||
</view> |
|||
<view class="info-address"> |
|||
<text>商家电话：{{info.supplier_tel}}</text> |
|||
<view class="iconfont icon-dianhua"></view> |
|||
</view> |
|||
<view class="info-address"> |
|||
<text>商家地址：{{info.supplier_address}}</text> |
|||
<view class="iconfont icon-daohang" bindtap="gotoLocation"></view> |
|||
</view> |
|||
<view class="box-top"> |
|||
<text>购买须知</text> |
|||
</view> |
|||
<view class="sku-items"> |
|||
<view class="sku-item{{skuIndex==index?' active':''}}" bindtap="changeSku" data-index="{{index}}" wx:for="{{info.sku}}">套餐{{number[index]}}</view> |
|||
<!-- <view class="sku-item">套餐一</view> --> |
|||
<!-- <view class="sku-item">套餐一</view> --> |
|||
</view> |
|||
<view class="details"> |
|||
<rich-text nodes="{{tool.formateRichText(info.sku[skuIndex].sku_model.bookinfo)}}"></rich-text> |
|||
<!-- <rich-text nodes="{{tool.formateRichText(info.sku[skuIndex].sku_model.detailinfo)}}"></rich-text> --> |
|||
<!-- <rich-text nodes="{{tool.formateRichText(info.sku[skuIndex].sku_model.expenseinfo)}}"></rich-text> --> |
|||
<!-- <rich-text nodes="{{tool.formateRichText(info.sku[skuIndex].sku_model.extrainfo)}}"></rich-text> --> |
|||
</view> |
|||
<view class="box-top"> |
|||
<text>产品详情</text> |
|||
</view> |
|||
<view class="details"> |
|||
<rich-text nodes="{{tool.formateRichText(info.content)}}"></rich-text> |
|||
</view> |
|||
</view> |
|||
<notice wx:if="{{bookingInfo}}" bind:close="closeMask" bookingInfo="{{bookingInfo}}" skuName="{{skuName}}"></notice> |
|||
@ -0,0 +1,309 @@ |
|||
/* pages/info/sceneProductInfo/index.wxss */ |
|||
page { |
|||
background: #f2f2f2; |
|||
} |
|||
.swiper { |
|||
width: 100%; |
|||
height: 400rpx; |
|||
} |
|||
.swiper image { |
|||
height: 400rpx; |
|||
display: block; |
|||
width: 100%; |
|||
} |
|||
.top-info { |
|||
border-radius: 20rpx 20rpx 0 0; |
|||
background: white; |
|||
position: relative; |
|||
z-index: 1; |
|||
margin-top: -20rpx; |
|||
padding: 20rpx 40rpx; |
|||
} |
|||
.top-info .title { |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
color: #000; |
|||
} |
|||
.tags-box { |
|||
margin-top: 10rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
color: #0B898E; |
|||
font-size: 27rpx; |
|||
height: 50rpx; |
|||
} |
|||
.tags-box .tag { |
|||
position: relative; |
|||
line-height: 20rpx; |
|||
font-size: 20rpx; |
|||
font-weight: 500; |
|||
line-height: 50rpx; |
|||
margin-right: 10rpx; |
|||
} |
|||
.tags-box .tag .line { |
|||
content: "1"; |
|||
display: block; |
|||
font-size: 0; |
|||
position: absolute; |
|||
left: 0; |
|||
right: 0; |
|||
background: #DAF3E9; |
|||
height: 8rpx; |
|||
top: 30rpx; |
|||
z-index: -1; |
|||
} |
|||
.tags-text { |
|||
flex: 1; |
|||
text-align: right; |
|||
} |
|||
.tags-box .iconfont { |
|||
margin-left: 4rpx; |
|||
font-size: 24rpx; |
|||
} |
|||
.address-box { |
|||
justify-content: space-between; |
|||
margin-top: 0; |
|||
} |
|||
.info-address { |
|||
color: #666; |
|||
font-size: 27rpx; |
|||
margin-bottom: 0rpx; |
|||
height: 30rpx; |
|||
line-height: 30rpx; |
|||
} |
|||
.address-box .iconfont { |
|||
font-size: 34rpx; |
|||
} |
|||
.box { |
|||
margin: 20rpx; |
|||
padding: 0 20rpx; |
|||
background: white; |
|||
border-radius: 13rpx; |
|||
} |
|||
.box-top { |
|||
line-height: 120rpx; |
|||
border-top: 1rpx solid #d9d9d9; |
|||
font-weight: 500; |
|||
color: #000; |
|||
font-size: 35rpx; |
|||
} |
|||
.info-address { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
margin-bottom: 30rpx; |
|||
color: #999; |
|||
font-size: 29rpx; |
|||
} |
|||
.info-address .iconfont { |
|||
color: #0B898E; |
|||
font-size: 31rpx; |
|||
} |
|||
.product-item { |
|||
margin: 0 20rpx; |
|||
padding: 27rpx 0; |
|||
border-bottom: 1rpx solid #ccc; |
|||
} |
|||
.skutitle { |
|||
font-size: 29rpx; |
|||
color: #333; |
|||
font-weight: 500; |
|||
} |
|||
.product-box { |
|||
display: flex; |
|||
align-items: flex-end; |
|||
justify-content: space-between; |
|||
margin-top: 20rpx; |
|||
} |
|||
.product-left { |
|||
flex: 1; |
|||
} |
|||
.product-tags { |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.product-tag { |
|||
font-size: 20rpx; |
|||
color: #0B898E; |
|||
border-radius: 16rpx; |
|||
line-height: 30rpx; |
|||
border: 1rpx solid; |
|||
padding: 0 15rpx; |
|||
margin-right: 13rpx; |
|||
} |
|||
.product-tags .product-tags:last-child { |
|||
margin-right: 0; |
|||
} |
|||
.order-tip-text { |
|||
margin-top: 33rpx; |
|||
font-size: 24rpx; |
|||
color: #666; |
|||
} |
|||
.product-right { |
|||
text-align: center; |
|||
flex-shrink: 0; |
|||
} |
|||
.product-right .price { |
|||
color: #D62828; |
|||
font-size: 24rpx; |
|||
margin-bottom: 20rpx; |
|||
} |
|||
.product-right .price text:nth-child(2){ |
|||
font-weight: 500; |
|||
font-size: 33rpx; |
|||
} |
|||
.product-right .price text:nth-child(3){ |
|||
color: #8D8D8D; |
|||
font-size: 20rpx; |
|||
} |
|||
.product-right .btn { |
|||
background: #D62828; |
|||
color: #fff; |
|||
border-radius: 30px; |
|||
line-height: 60rpx; |
|||
font-size: 29rpx; |
|||
font-weight: 500; |
|||
width: 176rpx; |
|||
} |
|||
.box .product-item:last-child { |
|||
border-bottom: none; |
|||
} |
|||
.box-top .iconfont { |
|||
color: #0B898E; |
|||
font-size: 33rpx; |
|||
margin-right: 16rpx; |
|||
} |
|||
.empty-box { |
|||
text-align: center; |
|||
padding: 40rpx 0; |
|||
font-size: 23rpx; |
|||
color: #333; |
|||
} |
|||
.empty-btn { |
|||
margin: 0 auto; |
|||
margin-top: 30rpx; |
|||
width: 283rpx; |
|||
line-height: 79rpx; |
|||
border: 1rpx solid #0B898E; |
|||
border-radius: 39rpx; |
|||
color: #0B898E; |
|||
font-size: 32rpx; |
|||
margin-bottom: 10rpx; |
|||
} |
|||
.box-top .score { |
|||
color: #D62828; |
|||
font-size: 30rpx; |
|||
font-weight: 400; |
|||
margin-left: 11rpx; |
|||
} |
|||
.product-comment { |
|||
margin: 0 20rpx; |
|||
border-bottom: 1rpx solid #ccc; |
|||
padding: 33rpx 0; |
|||
} |
|||
.product-comment-top { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
color: #999999; |
|||
align-items: center; |
|||
font-size: 24rpx; |
|||
} |
|||
.product-comment-top image { |
|||
flex-shrink: 0; |
|||
width: 57rpx; |
|||
height: 57rpx; |
|||
border-radius: 50%; |
|||
} |
|||
.product-comment-top .comment-info { |
|||
flex: 1; |
|||
margin: 0 15rpx; |
|||
color: #666; |
|||
font-size: 21rpx; |
|||
} |
|||
.product-comment-top .comment-info .iconfont { |
|||
color: #D62828; |
|||
font-size: 22rpx; |
|||
} |
|||
.product-comment-top .comment-info .iconfont text { |
|||
margin-right: 6rpx; |
|||
} |
|||
.comment-content { |
|||
margin-left: 72rpx; |
|||
margin-top: 36rpx; |
|||
font-size: 28rpx; |
|||
color: #000; |
|||
} |
|||
.more-comment-btn { |
|||
line-height: 93rpx; |
|||
margin-right: 20rpx; |
|||
text-align: right; |
|||
color: #999; |
|||
font-size: 27rpx; |
|||
font-weight: 500; |
|||
} |
|||
.more-comment-btn .iconfont { |
|||
margin-left: 6rpx; |
|||
font-size: 24rpx; |
|||
} |
|||
.all-comment-num { |
|||
float: right; |
|||
color: #999999; |
|||
font-size: 27rpx; |
|||
font-weight: 400; |
|||
} |
|||
.icon-xin,.icon-shoucang { |
|||
position: fixed; |
|||
right: 20rpx; |
|||
margin-top: 20rpx; |
|||
width: 60rpx; |
|||
line-height: 60rpx; |
|||
background: rgba(0, 0, 0, 0.4); |
|||
border-radius: 50%; |
|||
text-align: center; |
|||
color: #fff; |
|||
font-size: 36rpx; |
|||
z-index: 3; |
|||
} |
|||
.icon-shoucang { |
|||
color: #D62828; |
|||
} |
|||
.tags-price { |
|||
flex: 1; |
|||
text-align: right; |
|||
color: #D62828; |
|||
} |
|||
.tags-price text:nth-child(1){ |
|||
font-size: 27rpx; |
|||
} |
|||
.tags-price text:nth-child(2){ |
|||
font-size: 40rpx; |
|||
font-weight: bold; |
|||
} |
|||
.tags-price text:nth-child(3){ |
|||
font-size: 20rpx; |
|||
color: #999999; |
|||
margin-left: 4rpx; |
|||
} |
|||
.sku-items { |
|||
display: flex; |
|||
align-items: center; |
|||
flex-wrap: wrap; |
|||
margin-bottom: 1rpx; |
|||
} |
|||
.sku-item { |
|||
padding: 0 46rpx; |
|||
font-size: 29rpx; |
|||
color: #666; |
|||
border: 1rpx solid #999; |
|||
line-height: 58rpx; |
|||
margin-right: 40rpx; |
|||
margin-bottom: 25rpx; |
|||
} |
|||
.sku-item.active { |
|||
background: #0B898E; |
|||
border-color: #0B898E; |
|||
color: #fff; |
|||
} |
|||
.details { |
|||
padding-bottom: 30rpx; |
|||
} |
|||
@ -0,0 +1,129 @@ |
|||
// pages/info/roadInfo/index.js
|
|||
let device = wx.getSystemInfoSync(); |
|||
const ratio = device.windowWidth / 750; |
|||
import commonApi from "../../../utils/https/common" |
|||
import util from "../../../utils/util" |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
fixed:false, |
|||
type:1, |
|||
top:0, |
|||
info:null |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
let rect = wx.getMenuButtonBoundingClientRect(); |
|||
let height = (rect.top - device.statusBarHeight) * 2 + rect.height + device.statusBarHeight; |
|||
console.log(height) |
|||
this.setData({ |
|||
top:height |
|||
}) |
|||
commonApi._post("scene/detail",{ |
|||
id:options.id |
|||
}).then(res=>{ |
|||
this.setData({ |
|||
info:res.data |
|||
}) |
|||
}) |
|||
}, |
|||
changeMenu:function(e){ |
|||
let index = e.currentTarget.dataset.index,that = this; |
|||
const query=wx.createSelectorQuery(); //创建节点查询器
|
|||
query.select("#box"+index).boundingClientRect() //选择toViewid获取位置信息
|
|||
query.selectViewport().scrollOffset() //获取页面查询位置的
|
|||
query.exec(function(res) { |
|||
let scrollTop = res[0].top + res[1].scrollTop - 110 * ratio - that.data.top; |
|||
wx.pageScrollTo({ |
|||
scrollTop: scrollTop + 4, |
|||
duration: 0 |
|||
}) |
|||
that.setData({ |
|||
type:index |
|||
}) |
|||
}) |
|||
}, |
|||
onPageScroll:function(e){ |
|||
let that = this,height = this.data.top; |
|||
let topHeight = height; |
|||
// 滚动时判断滚动到哪个部分了
|
|||
const query=wx.createSelectorQuery(); //创建节点查询器
|
|||
query.select("#box1").boundingClientRect() //选择toViewid获取位置信息
|
|||
query.select("#box2").boundingClientRect() //选择toViewid获取位置信息
|
|||
query.select("#box3").boundingClientRect() //选择toViewid获取位置信息
|
|||
let minHeight = that.data.fixed?(110 * ratio + height): topHeight; |
|||
query.exec(function(res) { |
|||
if(res[2].top<minHeight){ |
|||
that.setData({ |
|||
type:3 |
|||
}) |
|||
} |
|||
else if(res[1].top<minHeight){ |
|||
that.setData({ |
|||
type:2 |
|||
}) |
|||
} |
|||
else { |
|||
that.setData({ |
|||
type:1 |
|||
}) |
|||
} |
|||
}) |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,5 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"title":"/pages/component/TitleHeader" |
|||
} |
|||
} |
|||
@ -0,0 +1,38 @@ |
|||
<!--pages/info/hotelProductInfo/index.wxml--> |
|||
<wxs src="../../../utils/filter.wxs" module="tool" /> |
|||
<title title="酒店详情"></title> |
|||
<view class="scroll-all-box" id="menus" wx:if="{{info}}"> |
|||
<view class="scroll-menus fixed-menus"> |
|||
<view class="scroll-menu-item{{type==1?' active':''}}" bindtap="changeMenu" data-index="1">介绍</view> |
|||
<view class="scroll-menu-item{{type==2?' active':''}}" bindtap="changeMenu" data-index="2">设施与服务</view> |
|||
<view class="scroll-menu-item{{type==3?' active':''}}" bindtap="changeMenu" data-index="3">预定须知</view> |
|||
</view> |
|||
<view style="height:85rpx"></view> |
|||
<view class="info-box" id="box1"> |
|||
<view class="info-title">介绍</view> |
|||
<!-- <rich-text class="details"></rich-text> --> |
|||
<rich-text class="detail" nodes="{{tool.formateRichText(info.content)}}"></rich-text> |
|||
</view> |
|||
<view class="info-box" id="box2"> |
|||
<view class="info-title">设施与服务</view> |
|||
<rich-text class="detail" nodes="{{tool.formateRichText(info.service_info)}}"></rich-text> |
|||
<!-- <rich-text class="details" nodes="{{filter.formateRichText(skuInfo[0].feeDescription)}}"></rich-text> --> |
|||
<!-- <view class="details" wx:for="{{6}}"> |
|||
在这里，酣畅淋漓的做一场偶像梦，你就是星光闪耀的明日之星！下一站天王天后，等你来！ |
|||
演出形式、内容：半露天卡通剧场，儿童剧，亲子互动 |
|||
表演时长：30分钟 |
|||
表演故事线：“最Q童星奖”PK赛现场直播啦！刚从电影学院新鲜出炉的小明星们，赶快大展身手吧！ |
|||
</view> --> |
|||
</view> |
|||
<view class="info-box" id="box3"> |
|||
<view class="info-title">预定须知</view> |
|||
<rich-text class="detail" nodes="{{tool.formateRichText(info.book_info)}}"></rich-text> |
|||
<!-- <rich-text class="details" nodes="{{filter.formateRichText(skuInfo[0].bookingInfo)}}"></rich-text> --> |
|||
<!-- <view class="details" wx:for="{{6}}"> |
|||
在这里，酣畅淋漓的做一场偶像梦，你就是星光闪耀的明日之星！下一站天王天后，等你来！ |
|||
演出形式、内容：半露天卡通剧场，儿童剧，亲子互动 |
|||
表演时长：30分钟 |
|||
表演故事线：“最Q童星奖”PK赛现场直播啦！刚从电影学院新鲜出炉的小明星们，赶快大展身手吧！ |
|||
</view> --> |
|||
</view> |
|||
</view> |
|||
@ -0,0 +1,361 @@ |
|||
/* pages/info/hotelProductInfo/index.wxss */ |
|||
page { |
|||
background: #f2f2f2; |
|||
} |
|||
.swiper { |
|||
width: 100%; |
|||
height: 400rpx; |
|||
} |
|||
.swiper image { |
|||
height: 400rpx; |
|||
display: block; |
|||
width: 100%; |
|||
} |
|||
.top-info { |
|||
border-radius: 20rpx 20rpx 0 0; |
|||
background: white; |
|||
position: relative; |
|||
z-index: 1; |
|||
margin-top: -20rpx; |
|||
padding: 20rpx 40rpx; |
|||
} |
|||
.top-info .title { |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
color: #000; |
|||
} |
|||
.tags-box { |
|||
margin-top: 10rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
color: #0B898E; |
|||
font-size: 27rpx; |
|||
height: 50rpx; |
|||
} |
|||
.tags-box .tag { |
|||
position: relative; |
|||
line-height: 20rpx; |
|||
font-size: 20rpx; |
|||
font-weight: 500; |
|||
line-height: 50rpx; |
|||
} |
|||
.tags-box .tag .line { |
|||
content: "1"; |
|||
display: block; |
|||
font-size: 0; |
|||
position: absolute; |
|||
left: 0; |
|||
right: 0; |
|||
background: #DAF3E9; |
|||
height: 8rpx; |
|||
top: 30rpx; |
|||
z-index: -1; |
|||
} |
|||
.tags-price { |
|||
flex: 1; |
|||
text-align: right; |
|||
color: #D62828; |
|||
} |
|||
.tags-price text:nth-child(1){ |
|||
font-size: 27rpx; |
|||
} |
|||
.tags-price text:nth-child(2){ |
|||
font-size: 40rpx; |
|||
font-weight: bold; |
|||
} |
|||
.tags-price text:nth-child(3){ |
|||
font-size: 20rpx; |
|||
color: #999999; |
|||
margin-left: 4rpx; |
|||
} |
|||
.tags-box .iconfont { |
|||
margin-left: 4rpx; |
|||
font-size: 24rpx; |
|||
} |
|||
.address-box { |
|||
justify-content: space-between; |
|||
margin-top: 0; |
|||
} |
|||
.info-address { |
|||
color: #666; |
|||
font-size: 27rpx; |
|||
margin-bottom: 0rpx; |
|||
height: 30rpx; |
|||
line-height: 30rpx; |
|||
} |
|||
.address-box .iconfont { |
|||
font-size: 34rpx; |
|||
} |
|||
.date-all-box { |
|||
margin: 24rpx 20rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
height: 80rpx; |
|||
border-radius: 13rpx; |
|||
background: #0B898E; |
|||
font-size: 31rpx; |
|||
color: #fff; |
|||
font-weight: 500; |
|||
padding: 0 37rpx; |
|||
} |
|||
.days { |
|||
text-align: center; |
|||
font-size: 400; |
|||
width: 84rpx; |
|||
line-height: 34rpx; |
|||
height: 34rpx; |
|||
border-radius: 18rpx; |
|||
border: 1px solid white; |
|||
font-size: 23rpx; |
|||
} |
|||
.picker text { |
|||
font-weight: 400; |
|||
font-size: 21rpx; |
|||
margin-left: 13rpx; |
|||
} |
|||
.product-item { |
|||
display: flex; |
|||
align-items: flex-end; |
|||
justify-content: space-between; |
|||
margin: 20rpx; |
|||
padding: 24rpx 20rpx; |
|||
background: white; |
|||
border-radius: 13rpx; |
|||
} |
|||
.product-item image { |
|||
width: 201rpx; |
|||
height: 201rpx; |
|||
border-radius: 10rpx; |
|||
margin-right: 26rpx; |
|||
flex-shrink: 0; |
|||
} |
|||
.product-item .product-info { |
|||
flex: 1; |
|||
} |
|||
.product-item .product-info .title { |
|||
font-size: 32rpx; |
|||
color: #000; |
|||
font-weight: 500; |
|||
} |
|||
.product-right { |
|||
flex-shrink: 0; |
|||
margin-left: 20rpx; |
|||
} |
|||
.product-right .price { |
|||
color: #D62828; |
|||
font-size: 40rpx; |
|||
font-weight: 500; |
|||
} |
|||
.product-right .price::before { |
|||
content: "￥"; |
|||
font-size: 27rpx; |
|||
font-weight: 400; |
|||
} |
|||
.product-right .btn { |
|||
color: #fff; |
|||
width: 120rpx; |
|||
line-height: 80rpx; |
|||
background: #D62828; |
|||
border-radius: 13rpx; |
|||
font-size: 31rpx; |
|||
font-weight: 500; |
|||
text-align: center; |
|||
margin-top: 20rpx; |
|||
} |
|||
.product-info .subtitle { |
|||
font-size: 24rpx; |
|||
line-height: 36rpx; |
|||
height: 72rpx; |
|||
margin-top: 10rpx; |
|||
margin-bottom: 20rpx; |
|||
color: #999; |
|||
white-space: normal; |
|||
} |
|||
.product-tags { |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.product-tag { |
|||
font-size: 20rpx; |
|||
color: #0B898E; |
|||
border-radius: 16rpx; |
|||
line-height: 30rpx; |
|||
border: 1rpx solid; |
|||
padding: 0 15rpx; |
|||
margin-right: 13rpx; |
|||
} |
|||
.product-tags .product-tags:last-child { |
|||
margin-right: 0; |
|||
} |
|||
.box { |
|||
margin: 20rpx; |
|||
background: white; |
|||
border-radius: 13rpx; |
|||
} |
|||
.box-top { |
|||
line-height: 95rpx; |
|||
border-bottom: 1rpx solid #d9d9d9; |
|||
font-weight: 500; |
|||
color: #000; |
|||
font-size: 35rpx; |
|||
padding: 0 20rpx; |
|||
} |
|||
.box-top .iconfont { |
|||
color: #0B898E; |
|||
font-size: 33rpx; |
|||
margin-right: 16rpx; |
|||
} |
|||
.empty-box { |
|||
text-align: center; |
|||
padding: 40rpx 0; |
|||
font-size: 23rpx; |
|||
color: #333; |
|||
} |
|||
.empty-btn { |
|||
margin: 0 auto; |
|||
margin-top: 30rpx; |
|||
width: 283rpx; |
|||
line-height: 79rpx; |
|||
border: 1rpx solid #0B898E; |
|||
border-radius: 39rpx; |
|||
color: #0B898E; |
|||
font-size: 32rpx; |
|||
margin-bottom: 10rpx; |
|||
} |
|||
.box-top .score { |
|||
color: #D62828; |
|||
font-size: 30rpx; |
|||
font-weight: 400; |
|||
margin-left: 11rpx; |
|||
} |
|||
.product-comment { |
|||
margin: 0 20rpx; |
|||
border-bottom: 1rpx solid #ccc; |
|||
padding: 33rpx 0; |
|||
} |
|||
.product-comment-top { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
color: #999999; |
|||
align-items: center; |
|||
font-size: 24rpx; |
|||
} |
|||
.product-comment-top image { |
|||
flex-shrink: 0; |
|||
width: 57rpx; |
|||
height: 57rpx; |
|||
border-radius: 50%; |
|||
} |
|||
.product-comment-top .comment-info { |
|||
flex: 1; |
|||
margin: 0 15rpx; |
|||
color: #666; |
|||
font-size: 21rpx; |
|||
} |
|||
.product-comment-top .comment-info .iconfont { |
|||
color: #D62828; |
|||
font-size: 22rpx; |
|||
} |
|||
.product-comment-top .comment-info .iconfont text { |
|||
margin-right: 6rpx; |
|||
} |
|||
.comment-content { |
|||
margin-left: 72rpx; |
|||
margin-top: 36rpx; |
|||
font-size: 28rpx; |
|||
color: #000; |
|||
} |
|||
.more-comment-btn { |
|||
line-height: 93rpx; |
|||
margin-right: 20rpx; |
|||
text-align: right; |
|||
color: #999; |
|||
font-size: 27rpx; |
|||
font-weight: 500; |
|||
} |
|||
.more-comment-btn .iconfont { |
|||
margin-left: 6rpx; |
|||
font-size: 24rpx; |
|||
} |
|||
.all-comment-num { |
|||
float: right; |
|||
color: #999999; |
|||
font-size: 27rpx; |
|||
font-weight: 400; |
|||
} |
|||
.scroll-all-box { |
|||
background: white; |
|||
} |
|||
.scroll-menus { |
|||
padding: 0 40rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
font-size: 29rpx; |
|||
color: #333; |
|||
height: 84rpx; |
|||
border-bottom: 1rpx solid #d9d9d9; |
|||
} |
|||
.scroll-menu-item { |
|||
position: relative; |
|||
line-height: 84rpx; |
|||
} |
|||
.scroll-menu-item.active::after { |
|||
content: "1"; |
|||
font-size: 0; |
|||
display: block; |
|||
position: absolute; |
|||
width: 46rpx; |
|||
height: 6rpx; |
|||
border-radius: 3rpx; |
|||
background: #0B898E; |
|||
left: 50%; |
|||
margin-left: -23rpx; |
|||
bottom: 0rpx; |
|||
} |
|||
.fixed-menus { |
|||
position: fixed; |
|||
left: 0; |
|||
right: 0; |
|||
background: white; |
|||
z-index: 1; |
|||
} |
|||
.info-title { |
|||
font-size: 35rpx; |
|||
font-weight: bold; |
|||
color: #000; |
|||
margin-bottom: 30rpx; |
|||
} |
|||
.info-box { |
|||
padding: 20rpx 40rpx; |
|||
} |
|||
.fixed-bottom { |
|||
position: fixed; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
height: 140rpx; |
|||
background: white; |
|||
display: flex; |
|||
align-items: center; |
|||
box-shadow: 0px 0px 16rpx 0px rgba(6, 0, 1, 0.1); |
|||
padding: 0 40rpx; |
|||
color: #666666; |
|||
font-size: 23rpx; |
|||
justify-content: space-between; |
|||
text-align: center; |
|||
} |
|||
.fixed-bottom .iconfont { |
|||
font-size: 34rpx; |
|||
} |
|||
.btn { |
|||
color: #fff; |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
width: 294rpx; |
|||
line-height: 78rpx; |
|||
background: #D62828; |
|||
border-radius: 39rpx; |
|||
text-align: center; |
|||
} |
|||
@ -0,0 +1,246 @@ |
|||
// pages/info/hotelProductInfo/index.js
|
|||
import util from "../../../utils/util" |
|||
import commonApi from "../../../utils/https/common" |
|||
let app = getApp() |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
listimgs:[], |
|||
startDate:"",//入住时间
|
|||
endDate:"",//离店时间
|
|||
startDateText:"",//入住时间转文字
|
|||
endDateText:"",//离店时间转文字
|
|||
days:1,//住店的日期总数
|
|||
today:"",//今天，也就是入住可以选择的日期
|
|||
tomorrow:"",//离店最早可以选择的日期
|
|||
sceneInfo:null, |
|||
ask:[], |
|||
isLike:0, |
|||
commentTotal:0, |
|||
comment:[], |
|||
products:[], |
|||
isTest:true |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
this.setData({ |
|||
id:options.id |
|||
}) |
|||
commonApi._post("pbservice/Other/getClientConfig",{ |
|||
unique_key:"wechatxcx" |
|||
}).then(res=>{ |
|||
let data = JSON.parse(res.data); |
|||
this.setData({ |
|||
isTest:data.isTest |
|||
}) |
|||
}) |
|||
// 先初始化日期
|
|||
let today = new Date(),tomorrow = new Date(today.getTime() + 24 * 60 * 60 * 1000); |
|||
this.setData({ |
|||
today:util.formatDate(today), |
|||
startDate:util.formatDate(today), |
|||
endDate:util.formatDate(tomorrow), |
|||
startDateText:util.dateToText(today), |
|||
endDateText:util.dateToText(tomorrow), |
|||
tomorrow:util.formatDate(tomorrow) |
|||
}) |
|||
this.getDetail() |
|||
this.getProduct() |
|||
}, |
|||
getProduct:function(){ |
|||
commonApi._post("scene/get_hotel_sku_list",{ |
|||
start_time:this.data.startDate, |
|||
end_time:this.data.endDate, |
|||
scene_id:this.data.id |
|||
}).then(res=>{ |
|||
res.data.map(item=>{ |
|||
item.display_tags = (item.display_tags?item.display_tags.split(","):[]).splice(0,2) |
|||
}) |
|||
this.setData({ |
|||
products:res.data |
|||
}) |
|||
console.log(res) |
|||
}) |
|||
}, |
|||
order:function(e){ |
|||
let item = e.currentTarget.dataset.item; |
|||
item.startDate = this.data.startDate; |
|||
item.endDate = this.data.endDate; |
|||
item.startDateText = this.data.startDateText; |
|||
item.endDateText = this.data.endDateText; |
|||
item.startDay = this.getDay(item.startDate); |
|||
item.endDay = this.getDay(item.endDate); |
|||
item.days = this.data.days; |
|||
app.globalData.product = item; |
|||
app.globalData.couponInfo = null; |
|||
wx.navigateTo({ |
|||
url: '/pages/order/hotel/index', |
|||
}) |
|||
}, |
|||
getDay:function(date){ |
|||
let d = new Date(date.replace(/-/g,'/')).getDay(); |
|||
let days = ["日","一","二","三","四","五","六"]; |
|||
return days[d]; |
|||
}, |
|||
getDetail:function(){ |
|||
// 获取详情
|
|||
commonApi._post("scene/detail",{ |
|||
id:this.data.id |
|||
}).then(res=>{ |
|||
if(!res.data) { |
|||
util.back(); |
|||
return; |
|||
} |
|||
// res.data.listimg = res.data.listimg?res.data.listimg.split(","):[];
|
|||
res.data.display_tags = (res.data.display_tags?res.data.display_tags.split(","):[]).splice(0,2); |
|||
this.setData({ |
|||
sceneInfo:res.data |
|||
}) |
|||
}) |
|||
// 获取问大家
|
|||
commonApi._post("ask/getQuestionList",{ |
|||
scene_id:this.data.id, |
|||
page_no:1, |
|||
page_num:3 |
|||
}).then(res=>{ |
|||
console.log(res) |
|||
this.setData({ |
|||
ask:res.data.rows |
|||
}) |
|||
}) |
|||
// 获取是否喜欢
|
|||
commonApi.user_post("scene/is_scene_collection",{ |
|||
scene_id:this.data.id |
|||
}).then(res=>{ |
|||
this.setData({ |
|||
isLike:res.data |
|||
}) |
|||
}) |
|||
// 获取评价列表
|
|||
commonApi.user_post("scene/get_comment",{ |
|||
scene_id:this.data.id |
|||
}).then(res=>{ |
|||
res.data.list.map(item=>{ |
|||
item.rate = Number(item.rate) |
|||
}) |
|||
this.setData({ |
|||
comment:res.data.list, |
|||
commentTotal:res.data.total |
|||
}) |
|||
}) |
|||
}, |
|||
like:function(){ |
|||
let id = this.data.id,isLike = this.data.isLike; |
|||
commonApi.user_post(isLike!=1?"scene/scene_collection":"scene/scene_cancel_collection",{ |
|||
scene_id:id |
|||
}).then(res=>{ |
|||
if(res.code==1){ |
|||
wx.showToast({ |
|||
title: '操作成功', |
|||
}) |
|||
this.setData({ |
|||
isLike:isLike==1?0:1 |
|||
}) |
|||
} |
|||
}) |
|||
}, |
|||
gotoLocation:function(){ |
|||
let info = this.data.sceneInfo; |
|||
wx.openLocation({ |
|||
latitude: Number(info.lat), |
|||
longitude: Number(info.lon), |
|||
}) |
|||
}, |
|||
changeInDate:function(e){ |
|||
console.log(e) |
|||
let date = new Date(e.detail.value.replace(/-/g,'/')); |
|||
let tomorrow = new Date(date.getTime() + 24 * 60 * 60 * 1000); |
|||
this.setData({ |
|||
startDate:util.formatDate(date), |
|||
startDateText:util.dateToText(date), |
|||
tomorrow:util.formatDate(tomorrow) |
|||
}) |
|||
// 如果开始日期要比结束日期晚的话 那么结束日期自动变成开始日期的下一天
|
|||
let endDate = new Date(this.data.endDate.replace(/-/g,'/')); |
|||
if(endDate.getTime()<date.getTime()){ |
|||
this.setData({ |
|||
endDate:util.formatDate(tomorrow), |
|||
endDateText:util.dateToText(tomorrow) |
|||
}) |
|||
} |
|||
this.calcDays(); |
|||
}, |
|||
changeLeaveDate:function(e){ |
|||
let date = new Date(e.detail.value.replace(/-/g,'/')); |
|||
this.setData({ |
|||
endDate:util.formatDate(date), |
|||
endDateText:util.dateToText(date) |
|||
}) |
|||
this.calcDays(); |
|||
}, |
|||
calcDays:function(){ |
|||
let endDate = this.data.endDate.replace(/-/g,'/'),startDate = this.data.startDate.replace(/-/g,'/'); |
|||
endDate = new Date(endDate).getTime(); |
|||
startDate = new Date(startDate).getTime(); |
|||
let days = Math.round((endDate - startDate) / (1000 * 24 * 60 * 60)) |
|||
this.setData({ |
|||
days:days |
|||
}) |
|||
this.getProduct() |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,5 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"title":"/pages/component/TitleHeader" |
|||
} |
|||
} |
|||
@ -0,0 +1,98 @@ |
|||
<!--pages/info/hotelProductInfo/index.wxml--> |
|||
<title title="产品详情"></title> |
|||
<view class="iconfont {{isLike==1?'icon-shoucang':'icon-xin'}}" bindtap="like"></view> |
|||
<swiper class="swiper" indicator-dots="{{true}}" wx:if="{{sceneInfo}}" |
|||
autoplay="{{true}}" interval="{{2000}}" duration="{{300}}"> |
|||
<block wx:for="{{sceneInfo.listimg}}" wx:key="*this"> |
|||
<swiper-item> |
|||
<image src="{{item}}" mode="aspectFill"></image> |
|||
</swiper-item> |
|||
</block> |
|||
</swiper> |
|||
<view class="top-info" wx:if="{{sceneInfo}}"> |
|||
<view class="title">{{sceneInfo.title}}</view> |
|||
<view class="tags-box textOver"> |
|||
<view class="tag textOver" wx:for="{{sceneInfo.display_tags}}">{{item}}<view class="line"></view></view> |
|||
<navigator url="../hotelInfo/index?id={{id}}" class="tags-text">详情 <text class="iconfont icon-you"></text></navigator> |
|||
</view> |
|||
<view class="tags-box textOver address-box"> |
|||
<view class="info-address textOver">地址：{{sceneInfo.address}}</view> |
|||
<view bindtap="gotoLocation" class="iconfont icon-daohang"></view> |
|||
</view> |
|||
</view> |
|||
<view class="date-all-box"> |
|||
<picker mode="date" value="{{date}}" start="{{today}}" bindchange="changeInDate"> |
|||
<view class="picker"> |
|||
{{startDateText}}<text>入住</text> |
|||
</view> |
|||
</picker> |
|||
<view class="days">{{days}}晚</view> |
|||
<picker mode="date" value="{{date}}" start="{{tomorrow}}" bindchange="changeLeaveDate"> |
|||
<view class="picker"> |
|||
{{endDateText}}<text>离店</text> |
|||
</view> |
|||
</picker> |
|||
</view> |
|||
<view class="product-item" wx:for="{{products}}"> |
|||
<image src="{{item.headimg}}" mode="aspectFill"></image> |
|||
<view class="product-info textOver"> |
|||
<view class="title textOver">{{item.product.title+item.sku_name}}</view> |
|||
<view class="subtitle textOver2">{{item.sku_model.area}} {{item.sku_model.bed_type}} {{item.sku_model.breakfast}}</view> |
|||
<view class="product-tags textOver"> |
|||
<view class="product-tag textOver" wx:for="{{item.display_tags}}">{{item}}</view> |
|||
</view> |
|||
</view> |
|||
<view class="product-right"> |
|||
<view class="price">{{item.price_sum/100}}</view> |
|||
<view class="btn" bindtap="order" data-item="{{item}}">预订</view> |
|||
</view> |
|||
</view> |
|||
<view class="box" wx:if="{{isTest==false}}"> |
|||
<view class="box-top"> |
|||
<text class="iconfont icon-tiwen1"></text><text>问大家</text> |
|||
</view> |
|||
<view class="empty-box" wx:if="{{!ask || ask.length==0}}"> |
|||
<view>这里空空如也，快去向大家提问吧!</view> |
|||
<navigator url="/pages/ask/index?id={{id}}" class="empty-btn">去提问</navigator> |
|||
</view> |
|||
<view class="ask-list" wx:else> |
|||
<navigator url="/pages/ask/info/index?id={{item.id}}" class="ask-item" wx:for="{{ask}}"> |
|||
<view class="item-ques"> |
|||
<image class="item-icon" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/ask/ask.png" mode="widthFix"></image> |
|||
<view class="ques">{{item.question_name}}</view> |
|||
<view class="ques-num" wx:if="{{item.answer.total!=0}}">{{item.answer.total}}个回答</view> |
|||
<view class="ques-num" wx:if="{{item.answer.total==0}}">暂无回答</view> |
|||
</view> |
|||
<!-- <view class="item-ques"> |
|||
<image class="item-icon" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/ask/ans.png" mode="widthFix"></image> |
|||
<view class="ans">{{item.answer && item.answer.lastest_answer?item.answer.lastest_answer.answer:"暂无回答"}}</view> |
|||
</view> |
|||
<view class="ques-tip"> |
|||
<view class="ques-time">{{item.created_time}}提问</view> |
|||
</view> --> |
|||
</navigator> |
|||
<navigator style="border-top:1rpx solid #ccc" url="/pages/ask/index?id={{sceneInfo.id}}" class="more-comment-btn">查看全部问答<text class="iconfont icon-you"></text></navigator> |
|||
</view> |
|||
</view> |
|||
<view class="box"> |
|||
<view class="box-top"> |
|||
<text class="iconfont icon-tiwen"></text><text>游客点评</text><text class="score" wx:if="{{info && info.rate && commentTotal>0}}">{{info.rate}}分</text> |
|||
<text class="all-comment-num">共{{commentTotal}}条</text> |
|||
</view> |
|||
<view class="empty-box" wx:if="{{!comment || comment.length==0}}"> |
|||
<view>这里空空如也，快去点评吧!</view> |
|||
<!-- <navigator url="/pages/ask/index?id={{id}}" class="empty-btn">去点评</navigator> --> |
|||
</view> |
|||
<navigator wx:for="{{comment}}" url="/pages/list/comments/index?id={{info.id}}" class="product-comment"> |
|||
<view class="product-comment-top"> |
|||
<image src="{{item.user.avatar}}" mode="aspectFill"></image> |
|||
<view class="comment-info"> |
|||
<view class="nickname">{{item.user.nickname}}</view> |
|||
<view class="iconfont"><text wx:for="{{item.rate}}" class="icon-xingxing"></text><text wx:for="{{5 - item.rate}}" style="color:#999" class="icon-xingxing"></text></view> |
|||
</view> |
|||
<view class="comment-date">{{item.create_time}}</view> |
|||
</view> |
|||
<view class="comment-content">{{item.content}}</view> |
|||
</navigator> |
|||
<navigator url="/pages/list/comments/index?sceneid={{id}}" wx:if="{{comment.length>0}}" class="more-comment-btn">查看全部点评<text class="iconfont icon-you"></text></navigator> |
|||
</view> |
|||
@ -0,0 +1,338 @@ |
|||
/* pages/info/hotelProductInfo/index.wxss */ |
|||
page { |
|||
background: #f2f2f2; |
|||
} |
|||
.swiper { |
|||
width: 100%; |
|||
height: 400rpx; |
|||
} |
|||
.swiper image { |
|||
height: 400rpx; |
|||
display: block; |
|||
width: 100%; |
|||
} |
|||
.top-info { |
|||
border-radius: 20rpx 20rpx 0 0; |
|||
background: white; |
|||
position: relative; |
|||
z-index: 1; |
|||
margin-top: -20rpx; |
|||
padding: 20rpx 40rpx; |
|||
} |
|||
.top-info .title { |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
color: #000; |
|||
} |
|||
.tags-box { |
|||
margin-top: 10rpx; |
|||
margin-bottom: 20rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
color: #0B898E; |
|||
font-size: 27rpx; |
|||
height: 50rpx; |
|||
} |
|||
.tags-box .tag { |
|||
position: relative; |
|||
line-height: 20rpx; |
|||
font-size: 20rpx; |
|||
font-weight: 500; |
|||
line-height: 50rpx; |
|||
margin-right: 10rpx; |
|||
} |
|||
.tags-box .tag .line { |
|||
content: "1"; |
|||
display: block; |
|||
font-size: 0; |
|||
position: absolute; |
|||
left: 0; |
|||
right: 0; |
|||
background: #DAF3E9; |
|||
height: 8rpx; |
|||
top: 30rpx; |
|||
z-index: -1; |
|||
} |
|||
.tags-text { |
|||
flex: 1; |
|||
text-align: right; |
|||
} |
|||
.tags-box .iconfont { |
|||
margin-left: 4rpx; |
|||
font-size: 24rpx; |
|||
} |
|||
.address-box { |
|||
justify-content: space-between; |
|||
margin-top: 0; |
|||
} |
|||
.info-address { |
|||
color: #666; |
|||
font-size: 27rpx; |
|||
margin-bottom: 0rpx; |
|||
height: 30rpx; |
|||
line-height: 30rpx; |
|||
} |
|||
.address-box .iconfont { |
|||
font-size: 34rpx; |
|||
} |
|||
.date-all-box { |
|||
margin: 24rpx 20rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
height: 80rpx; |
|||
border-radius: 13rpx; |
|||
background: #0B898E; |
|||
font-size: 31rpx; |
|||
color: #fff; |
|||
font-weight: 500; |
|||
padding: 0 37rpx; |
|||
} |
|||
.days { |
|||
text-align: center; |
|||
font-size: 400; |
|||
width: 84rpx; |
|||
line-height: 34rpx; |
|||
height: 34rpx; |
|||
border-radius: 18rpx; |
|||
border: 1px solid white; |
|||
font-size: 23rpx; |
|||
} |
|||
.picker text { |
|||
font-weight: 400; |
|||
font-size: 21rpx; |
|||
margin-left: 13rpx; |
|||
} |
|||
.product-item { |
|||
display: flex; |
|||
align-items: flex-end; |
|||
justify-content: space-between; |
|||
margin: 20rpx; |
|||
padding: 24rpx 20rpx; |
|||
background: white; |
|||
border-radius: 13rpx; |
|||
} |
|||
.product-item image { |
|||
width: 201rpx; |
|||
height: 201rpx; |
|||
border-radius: 10rpx; |
|||
margin-right: 26rpx; |
|||
flex-shrink: 0; |
|||
} |
|||
.product-item .product-info { |
|||
flex: 1; |
|||
} |
|||
.product-item .product-info .title { |
|||
font-size: 32rpx; |
|||
color: #000; |
|||
font-weight: 500; |
|||
} |
|||
.product-right { |
|||
flex-shrink: 0; |
|||
margin-left: 20rpx; |
|||
} |
|||
.product-right .price { |
|||
color: #D62828; |
|||
font-size: 40rpx; |
|||
font-weight: 500; |
|||
} |
|||
.product-right .price::before { |
|||
content: "￥"; |
|||
font-size: 27rpx; |
|||
font-weight: 400; |
|||
} |
|||
.product-right .btn { |
|||
color: #fff; |
|||
width: 120rpx; |
|||
line-height: 80rpx; |
|||
background: #D62828; |
|||
border-radius: 13rpx; |
|||
font-size: 31rpx; |
|||
font-weight: 500; |
|||
text-align: center; |
|||
margin-top: 20rpx; |
|||
} |
|||
.product-info .subtitle { |
|||
font-size: 24rpx; |
|||
line-height: 36rpx; |
|||
height: 72rpx; |
|||
margin-top: 10rpx; |
|||
margin-bottom: 20rpx; |
|||
color: #999; |
|||
white-space: normal; |
|||
} |
|||
.product-tags { |
|||
display: flex; |
|||
align-items: center; |
|||
height: 30rpx; |
|||
} |
|||
.product-tag { |
|||
font-size: 20rpx; |
|||
color: #0B898E; |
|||
border-radius: 16rpx; |
|||
line-height: 26rpx; |
|||
border: 1rpx solid; |
|||
padding: 0 15rpx; |
|||
margin-right: 13rpx; |
|||
} |
|||
.product-tags .product-tags:last-child { |
|||
margin-right: 0; |
|||
} |
|||
.box { |
|||
margin: 20rpx; |
|||
background: white; |
|||
border-radius: 13rpx; |
|||
} |
|||
.box-top { |
|||
line-height: 95rpx; |
|||
border-bottom: 1rpx solid #d9d9d9; |
|||
font-weight: 500; |
|||
color: #000; |
|||
font-size: 35rpx; |
|||
padding: 0 20rpx; |
|||
} |
|||
.box-top .iconfont { |
|||
color: #0B898E; |
|||
font-size: 33rpx; |
|||
margin-right: 16rpx; |
|||
} |
|||
.empty-box { |
|||
text-align: center; |
|||
padding: 40rpx 0; |
|||
font-size: 23rpx; |
|||
color: #333; |
|||
} |
|||
.empty-btn { |
|||
margin: 0 auto; |
|||
margin-top: 30rpx; |
|||
width: 283rpx; |
|||
line-height: 79rpx; |
|||
border: 1rpx solid #0B898E; |
|||
border-radius: 39rpx; |
|||
color: #0B898E; |
|||
font-size: 32rpx; |
|||
margin-bottom: 10rpx; |
|||
} |
|||
.box-top .score { |
|||
color: #D62828; |
|||
font-size: 30rpx; |
|||
font-weight: 400; |
|||
margin-left: 11rpx; |
|||
} |
|||
.product-comment { |
|||
margin: 0 20rpx; |
|||
border-bottom: 1rpx solid #ccc; |
|||
padding: 33rpx 0; |
|||
} |
|||
.product-comment-top { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
color: #999999; |
|||
align-items: center; |
|||
font-size: 24rpx; |
|||
} |
|||
.product-comment-top image { |
|||
flex-shrink: 0; |
|||
width: 57rpx; |
|||
height: 57rpx; |
|||
border-radius: 50%; |
|||
} |
|||
.product-comment-top .comment-info { |
|||
flex: 1; |
|||
margin: 0 15rpx; |
|||
color: #666; |
|||
font-size: 21rpx; |
|||
} |
|||
.product-comment-top .comment-info .iconfont { |
|||
color: #D62828; |
|||
font-size: 22rpx; |
|||
} |
|||
.product-comment-top .comment-info .iconfont text { |
|||
margin-right: 6rpx; |
|||
} |
|||
.comment-content { |
|||
margin-left: 72rpx; |
|||
margin-top: 36rpx; |
|||
font-size: 28rpx; |
|||
color: #000; |
|||
} |
|||
.more-comment-btn { |
|||
line-height: 93rpx; |
|||
margin: 0 20rpx; |
|||
text-align: right; |
|||
color: #999; |
|||
font-size: 27rpx; |
|||
font-weight: 500; |
|||
} |
|||
.more-comment-btn .iconfont { |
|||
margin-left: 6rpx; |
|||
font-size: 24rpx; |
|||
} |
|||
.all-comment-num { |
|||
float: right; |
|||
color: #999999; |
|||
font-size: 27rpx; |
|||
font-weight: 400; |
|||
} |
|||
.ask-list .ask-item:nth-child(1) { |
|||
margin-top: 40rpx; |
|||
} |
|||
.ask-item { |
|||
padding: 0 25rpx; |
|||
margin-bottom: 40rpx; |
|||
} |
|||
.item-ques { |
|||
display: flex; |
|||
color: #000; |
|||
align-items: center; |
|||
font-size: 29rpx; |
|||
line-height: 38rpx; |
|||
} |
|||
.item-ques image { |
|||
width: 36rpx; |
|||
margin-right: 18rpx; |
|||
flex-shrink: 0; |
|||
} |
|||
.item-ques .ques { |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
flex: 1; |
|||
} |
|||
.ques-tip { |
|||
margin-left: 54rpx; |
|||
color: #999999; |
|||
font-size: 24rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
} |
|||
.ans-number { |
|||
color: #0B898E; |
|||
font-size: 28rpx; |
|||
} |
|||
.ans-number .iconfont { |
|||
font-size: 28rpx; |
|||
} |
|||
.icon-xin,.icon-shoucang { |
|||
position: absolute; |
|||
right: 20rpx; |
|||
margin-top: 20rpx; |
|||
width: 60rpx; |
|||
line-height: 60rpx; |
|||
background: rgba(0, 0, 0, 0.4); |
|||
border-radius: 50%; |
|||
text-align: center; |
|||
color: #fff; |
|||
font-size: 36rpx; |
|||
z-index: 1; |
|||
} |
|||
.icon-shoucang { |
|||
color: #D62828; |
|||
} |
|||
.ques-num { |
|||
flex-shrink: 0; |
|||
margin-left: 10rpx; |
|||
font-size: 29rpx; |
|||
color: #999; |
|||
font-weight: 400; |
|||
} |
|||
@ -0,0 +1,87 @@ |
|||
// pages/info/museumInfo/index.js
|
|||
import commonApi from "../../../utils/https/common" |
|||
let app = getApp() |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
info:null |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
commonApi._post("scene/detail_for_venue",{ |
|||
id:options.id |
|||
}).then(res=>{ |
|||
// res.data.listimg = res.data.listimg?res.data.listimg.split(","):[];
|
|||
this.setData({ |
|||
info:res.data |
|||
}) |
|||
}) |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
order:function(){ |
|||
if(!this.data.info.product_venue) return; |
|||
if(!this.data.info.product_venue.sku[0]) return; |
|||
app.globalData.couponInfo = null; |
|||
app.globalData.product = { |
|||
product:this.data.info.product_venue, |
|||
sku:this.data.info.product_venue.sku[0] |
|||
} |
|||
wx.navigateTo({ |
|||
url: '/pages/order/scene/index?type=museum' |
|||
}) |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,5 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"title":"/pages/component/TitleHeader" |
|||
} |
|||
} |
|||
@ -0,0 +1,25 @@ |
|||
<!--pages/info/museumInfo/index.wxml--> |
|||
<wxs src="../../../utils/filter.wxs" module="tool" /> |
|||
<title title="场馆详情"></title> |
|||
<swiper class="swiper" indicator-dots="{{true}}" wx:if="{{info}}" |
|||
autoplay="{{true}}" interval="{{2000}}" duration="{{300}}"> |
|||
<block wx:for="{{info.listimg}}" wx:key="*this"> |
|||
<swiper-item> |
|||
<image src="{{item}}" mode="aspectFill"></image> |
|||
</swiper-item> |
|||
</block> |
|||
</swiper> |
|||
<view class="info" wx:if="{{info}}"> |
|||
<view class="title">{{info.title}}</view> |
|||
<view class="location"><text class="iconfont icon-location"></text>{{info.address}}</view> |
|||
<view class="location" style="margin-bottom:0"><text class="iconfont icon-dianhua2"></text>{{info.tel}}</view> |
|||
</view> |
|||
<view class="detail-title">预订须知</view> |
|||
<rich-text wx:if="{{info}}" class="detail" nodes="{{tool.formateRichText(info.book_info)}}"></rich-text> |
|||
<view class="detail-title">场馆介绍</view> |
|||
<rich-text wx:if="{{info}}" class="detail" nodes="{{tool.formateRichText(info.content)}}"></rich-text> |
|||
<!-- <view class="detail" wx:if="{{info}}">{{info.open_time}}</view> --> |
|||
<view style="height:104rpx" wx:if="{{info.product_venue && info.product_venue.sku && info.product_venue.sku.length>0}}"></view> |
|||
<view class="fixed-btn" wx:if="{{info.product_venue && info.product_venue.sku && info.product_venue.sku.length>0}}"> |
|||
<view bindtap="order" class="btn">参观预约</view> |
|||
</view> |
|||
@ -0,0 +1,63 @@ |
|||
/* pages/info/museumInfo/index.wxss */ |
|||
.swiper,.swiper image { |
|||
width: 100%; |
|||
height: 330rpx; |
|||
display: block; |
|||
} |
|||
.info { |
|||
margin: 0 25rpx; |
|||
margin-top: -30rpx; |
|||
position: relative; |
|||
z-index: 1; |
|||
background: #FFFFFF; |
|||
box-shadow: 0px 0px 16rpx 0px rgba(6, 0, 1, 0.1); |
|||
border-radius: 13rpx; |
|||
padding: 30rpx; |
|||
} |
|||
.info .title { |
|||
font-size: 31rpx; |
|||
color: #000; |
|||
margin-bottom: 20rpx; |
|||
} |
|||
.info .location { |
|||
color: #999999; |
|||
font-size: 24rpx; |
|||
margin-bottom: 20rpx; |
|||
} |
|||
.info .location .iconfont { |
|||
margin-right: 10rpx; |
|||
font-size: 26rpx; |
|||
} |
|||
.detail-title { |
|||
font-weight: 500; |
|||
font-size: 35rpx; |
|||
color: #000; |
|||
margin: 26rpx; |
|||
margin-top: 45rpx; |
|||
} |
|||
.detail { |
|||
display: block; |
|||
padding: 26rpx; |
|||
} |
|||
.fixed-btn { |
|||
position: fixed; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
height: 104rpx; |
|||
background: #FFFFFF; |
|||
box-shadow: -1rpx 1rpx 16rpx 0px rgba(6, 0, 1, 0.1); |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
.fixed-btn .btn { |
|||
width: 391rpx; |
|||
line-height: 73rpx; |
|||
background: #D62828; |
|||
border-radius: 37rpx; |
|||
text-align: center; |
|||
color: #fff; |
|||
font-size: 31rpx; |
|||
font-weight: 500; |
|||
} |
|||
@ -0,0 +1,76 @@ |
|||
// pages/info/newsInfo/index.js
|
|||
import commonApi from "../../../utils/https/common" |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
info:null |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
commonApi._post("pbservice/Actcalendar/getInfoDetail",{ |
|||
id:options.id |
|||
}).then(res=>{ |
|||
res.data.list_imgs = res.data.photographer?res.data.photographer.split(","):[]; |
|||
|
|||
this.setData({ |
|||
info:res.data |
|||
}) |
|||
console.log(res) |
|||
}) |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,5 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"title":"/pages/component/TitleHeader" |
|||
} |
|||
} |
|||
@ -0,0 +1,15 @@ |
|||
<!--pages/info/newsInfo/index.wxml--> |
|||
<wxs src="../../../utils/filter.wxs" module="tool" /> |
|||
<title title="资讯详情"></title> |
|||
<image wx:if="{{info}}" class="swiper" src="{{info.cover}}" mode="aspectFill"></image> |
|||
<view class="content" wx:if="{{info}}"> |
|||
<view class="title">{{info.title}}</view> |
|||
<view class="subtitle" wx:if="{{info.source}}">来源：{{info.source}}</view> |
|||
<view class="subtitle" wx:if="{{info.author}}">作者：{{info.author}}</view> |
|||
<view class="subtitle" wx:if="{{info.editor}}">编辑：{{info.editor}}</view> |
|||
<view class="subtitle" wx:if="{{info.photographer}}">摄影：{{info.photographer}}</view> |
|||
</view> |
|||
<view class="content" style="margin-top:20rpx;border-radius:0" wx:if="{{info}}"> |
|||
<view class="title">详情内容:</view> |
|||
<rich-text class="detail" nodes="{{tool.formateRichText(info.content)}}"></rich-text> |
|||
</view> |
|||
@ -0,0 +1,32 @@ |
|||
/* pages/info/newsInfo/index.wxss */ |
|||
page { |
|||
background: #f6f6f6; |
|||
} |
|||
.swiper { |
|||
width: 100%; |
|||
height: 400rpx; |
|||
} |
|||
.swiper image { |
|||
height: 400rpx; |
|||
display: block; |
|||
width: 100%; |
|||
} |
|||
.content { |
|||
position: relative; |
|||
z-index: 1; |
|||
margin-top: -20rpx; |
|||
border-radius: 20rpx 20rpx 0 0; |
|||
background: white; |
|||
padding: 30rpx 40rpx; |
|||
} |
|||
.content .title { |
|||
font-size: 32rpx; |
|||
color: #000; |
|||
margin-bottom: 20rpx; |
|||
font-weight: bold; |
|||
} |
|||
.content .subtitle { |
|||
font-size: 24rpx; |
|||
color: #666; |
|||
line-height: 40rpx; |
|||
} |
|||
@ -0,0 +1,246 @@ |
|||
// pages/info/roadInfo/index.js
|
|||
let device = wx.getSystemInfoSync(); |
|||
const ratio = device.windowWidth / 750; |
|||
import commonApi from "../../../utils/https/common" |
|||
let app = getApp() |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
fixed:false, |
|||
type:1, |
|||
top:0, |
|||
isLike:0, |
|||
commentTotal:0, |
|||
comment:[], |
|||
info:null, |
|||
skuFlag:null, |
|||
producNum:1, |
|||
skuIndex:0 |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
let rect = wx.getMenuButtonBoundingClientRect(); |
|||
let height = (rect.top - device.statusBarHeight) * 2 + rect.height + device.statusBarHeight; |
|||
console.log(height) |
|||
this.setData({ |
|||
top:height, |
|||
id:options.id |
|||
}) |
|||
commonApi._post("product/get_product_detail",{ |
|||
id:options.id |
|||
}).then(res=>{ |
|||
res.data.display_tags = (res.data.display_tags?res.data.display_tags.split(","):[]).splice(0,2) |
|||
this.setData({ |
|||
info:res.data |
|||
}) |
|||
}) |
|||
if(wx.getStorageSync("jstrip_token")){ |
|||
commonApi.user_post("product/is_product_collection",{ |
|||
product_id:options.id |
|||
}).then(res=>{ |
|||
this.setData({ |
|||
isLike:res.data |
|||
}) |
|||
}) |
|||
} |
|||
// 获取评价列表
|
|||
commonApi._post("product/product_comment_list",{ |
|||
product_id:options.id |
|||
}).then(res=>{ |
|||
res.data.list.map(item=>{ |
|||
item.rate = Number(item.rate) |
|||
}) |
|||
this.setData({ |
|||
comment:res.data.list, |
|||
commentTotal:res.data.total |
|||
}) |
|||
}) |
|||
}, |
|||
like:function(){ |
|||
let id = this.data.id,isLike = this.data.isLike; |
|||
commonApi.user_post("product/"+(isLike==1?"product_cancel_collection":"product_collection"),{ |
|||
product_id:id |
|||
}).then(res=>{ |
|||
if(res.code==1){ |
|||
this.setData({ |
|||
isLike:isLike==1?0:1 |
|||
}) |
|||
} |
|||
}) |
|||
}, |
|||
changeMenu:function(e){ |
|||
let index = e.currentTarget.dataset.index,that = this; |
|||
const query=wx.createSelectorQuery(); //创建节点查询器
|
|||
query.select("#box"+index).boundingClientRect() //选择toViewid获取位置信息
|
|||
query.selectViewport().scrollOffset() //获取页面查询位置的
|
|||
query.exec(function(res) { |
|||
let scrollTop = res[0].top + res[1].scrollTop - 110 * ratio - that.data.top; |
|||
wx.pageScrollTo({ |
|||
scrollTop: scrollTop + 4, |
|||
duration: 0 |
|||
}) |
|||
that.setData({ |
|||
type:index |
|||
}) |
|||
}) |
|||
}, |
|||
onPageScroll:function(e){ |
|||
let that = this,height = this.data.top; |
|||
let topHeight = height; |
|||
wx.createSelectorQuery().select('#menus').boundingClientRect(function(rect){ |
|||
console.log(rect.top,topHeight) |
|||
if(rect.top<=topHeight){ |
|||
// 此时应该把menus固定在顶部
|
|||
that.setData({ |
|||
fixed:true |
|||
}) |
|||
} |
|||
else{ |
|||
that.setData({ |
|||
fixed:false |
|||
}) |
|||
} |
|||
// 滚动时判断滚动到哪个部分了
|
|||
const query=wx.createSelectorQuery(); //创建节点查询器
|
|||
query.select("#box1").boundingClientRect() //选择toViewid获取位置信息
|
|||
query.select("#box2").boundingClientRect() //选择toViewid获取位置信息
|
|||
query.select("#box3").boundingClientRect() //选择toViewid获取位置信息
|
|||
let minHeight = that.data.fixed?(110 * ratio + height): topHeight; |
|||
query.exec(function(res) { |
|||
if(res[2].top<minHeight){ |
|||
that.setData({ |
|||
type:3 |
|||
}) |
|||
} |
|||
else if(res[1].top<minHeight){ |
|||
that.setData({ |
|||
type:2 |
|||
}) |
|||
} |
|||
else { |
|||
that.setData({ |
|||
type:1 |
|||
}) |
|||
} |
|||
}) |
|||
}).exec() |
|||
|
|||
}, |
|||
showCart:function(){ |
|||
this.setData({ |
|||
skuFlag:"cart" |
|||
}) |
|||
}, |
|||
hideSku:function(){ |
|||
this.setData({ |
|||
skuFlag:null |
|||
}) |
|||
}, |
|||
minus:function(){ |
|||
if(this.data.producNum==1) return; |
|||
this.setData({ |
|||
producNum:this.data.producNum-1 |
|||
}) |
|||
}, |
|||
add:function(){ |
|||
this.setData({ |
|||
producNum:this.data.producNum+1 |
|||
}) |
|||
}, |
|||
selectSku:function(e){ |
|||
let index = e.currentTarget.dataset.index; |
|||
this.setData({ |
|||
skuIndex:index |
|||
}) |
|||
}, |
|||
showOrder:function(){ |
|||
this.setData({ |
|||
skuFlag:'order' |
|||
}) |
|||
}, |
|||
order:function(){ |
|||
if(this.data.skuFlag=='order'){ |
|||
app.globalData.couponInfo = null; |
|||
// 购买
|
|||
let product = [{ |
|||
product:this.data.info, |
|||
sku:this.data.info.sku[this.data.skuIndex], |
|||
productNum:this.data.producNum |
|||
}]; |
|||
app.globalData.postProduct = product; |
|||
wx.navigateTo({ |
|||
url: '/pages/order/postOrder/index', |
|||
}) |
|||
} |
|||
else { |
|||
commonApi.user_post("cart/add_sku",{ |
|||
sku_id:this.data.info.sku[this.data.skuIndex].id, |
|||
num:this.data.producNum |
|||
}).then(res=>{ |
|||
if(res.code==1){ |
|||
wx.showToast({ |
|||
title: '加入购物车成功', |
|||
icon:"success" |
|||
}); |
|||
this.setData({ |
|||
skuFlag:null |
|||
}) |
|||
} |
|||
}) |
|||
} |
|||
}, |
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,5 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"title":"/pages/component/TitleHeader" |
|||
} |
|||
} |
|||
@ -0,0 +1,124 @@ |
|||
<!--pages/info/hotelProductInfo/index.wxml--> |
|||
<wxs src="../../../utils/filter.wxs" module="tool" /> |
|||
<title title="产品详情"></title> |
|||
<view class="iconfont {{isLike==1?'icon-shoucang':'icon-xin'}}" bindtap="like"></view> |
|||
<swiper class="swiper" indicator-dots="{{true}}" wx:if="{{info}}" |
|||
autoplay="{{true}}" interval="{{2000}}" duration="{{300}}"> |
|||
<block wx:for="{{info.listimg}}" wx:key="*this"> |
|||
<swiper-item> |
|||
<image src="{{item}}" mode="aspectFill"></image> |
|||
</swiper-item> |
|||
</block> |
|||
</swiper> |
|||
<view class="top-info" wx:if="{{info}}"> |
|||
<view class="title">{{info.title}}</view> |
|||
<view class="subtitle">{{info.subtitle}}</view> |
|||
<view class="tags-box textOver"> |
|||
<view class="tag textOver" wx:for="{{info.display_tags}}">{{item}}<view class="line"></view></view> |
|||
<view class="tags-price"><text>￥</text><text>{{info.price/100}}</text><text>起</text></view> |
|||
</view> |
|||
</view> |
|||
<view class="scroll-all-box" id="menus" wx:if="{{info}}"> |
|||
<view class="scroll-menus{{fixed?' fixed-menus':''}}" style="top:{{top}}px"> |
|||
<view class="scroll-menu-item{{type==1?' active':''}}" bindtap="changeMenu" data-index="1">产品特色</view> |
|||
<view class="scroll-menu-item{{type==2?' active':''}}" bindtap="changeMenu" data-index="2">费用说明</view> |
|||
<view class="scroll-menu-item{{type==3?' active':''}}" bindtap="changeMenu" data-index="3">预定须知</view> |
|||
</view> |
|||
<view style="height:85rpx" wx:if="{{fixed}}"></view> |
|||
<view class="info-box" id="box1"> |
|||
<view class="info-title">产品特色</view> |
|||
<rich-text class="details" nodes="{{tool.formateRichText(info.content)}}"></rich-text> |
|||
<!-- <rich-text class="details"></rich-text> --> |
|||
<!-- <view class="details" wx:for="{{6}}"> |
|||
在这里，酣畅淋漓的做一场偶像梦，你就是星光闪耀的明日之星！下一站天王天后，等你来！ |
|||
演出形式、内容：半露天卡通剧场，儿童剧，亲子互动 |
|||
表演时长：30分钟 |
|||
表演故事线：“最Q童星奖”PK赛现场直播啦！刚从电影学院新鲜出炉的小明星们，赶快大展身手吧！ |
|||
</view> --> |
|||
</view> |
|||
<view class="info-box" id="box2"> |
|||
<view class="info-title">费用说明</view> |
|||
<rich-text class="details" nodes="{{tool.formateRichText(info.expense_info)}}"></rich-text> |
|||
<!-- <rich-text class="details" nodes="{{filter.formateRichText(skuInfo[0].feeDescription)}}"></rich-text> --> |
|||
<!-- <view class="details" wx:for="{{6}}"> |
|||
在这里，酣畅淋漓的做一场偶像梦，你就是星光闪耀的明日之星！下一站天王天后，等你来！ |
|||
演出形式、内容：半露天卡通剧场，儿童剧，亲子互动 |
|||
表演时长：30分钟 |
|||
表演故事线：“最Q童星奖”PK赛现场直播啦！刚从电影学院新鲜出炉的小明星们，赶快大展身手吧！ |
|||
</view> --> |
|||
</view> |
|||
<view class="info-box" id="box3"> |
|||
<view class="info-title">预订须知</view> |
|||
<rich-text class="details" nodes="{{tool.formateRichText(info.book_info)}}"></rich-text> |
|||
<!-- <rich-text class="details" nodes="{{filter.formateRichText(skuInfo[0].bookingInfo)}}"></rich-text> --> |
|||
<!-- <view class="details" wx:for="{{6}}"> |
|||
在这里，酣畅淋漓的做一场偶像梦，你就是星光闪耀的明日之星！下一站天王天后，等你来！ |
|||
演出形式、内容：半露天卡通剧场，儿童剧，亲子互动 |
|||
表演时长：30分钟 |
|||
表演故事线：“最Q童星奖”PK赛现场直播啦！刚从电影学院新鲜出炉的小明星们，赶快大展身手吧！ |
|||
</view> --> |
|||
</view> |
|||
</view> |
|||
<view class="box"> |
|||
<view class="box-top"> |
|||
<text class="iconfont icon-tiwen"></text><text>游客点评</text><text class="score" wx:if="{{info && info.rate && commentTotal>0}}">{{info.rate}}分</text> |
|||
<text class="all-comment-num">共{{commentTotal}}条</text> |
|||
</view> |
|||
<view class="empty-box" wx:if="{{!comment || comment.length==0}}"> |
|||
<view>这里空空如也，快去点评吧!</view> |
|||
<!-- <navigator url="/pages/ask/index?id={{id}}" class="empty-btn">去点评</navigator> --> |
|||
</view> |
|||
<navigator wx:for="{{comment}}" url="/pages/list/comments/index?productid={{id}}" class="product-comment"> |
|||
<view class="product-comment-top"> |
|||
<image src="{{item.user.avatar}}" mode="aspectFill"></image> |
|||
<view class="comment-info"> |
|||
<view class="nickname">{{item.user.nickname}}</view> |
|||
<view class="iconfont"><text wx:for="{{item.rate}}" class="icon-xingxing"></text><text wx:for="{{5 - item.rate}}" style="color:#999" class="icon-xingxing"></text></view> |
|||
</view> |
|||
<view class="comment-date">{{item.create_time}}</view> |
|||
</view> |
|||
<view class="comment-content">{{item.content}}</view> |
|||
</navigator> |
|||
<navigator url="/pages/list/comments/index?productid={{id}}" wx:if="{{comment.length>0}}" class="more-comment-btn">查看全部点评<text class="iconfont icon-you"></text></navigator> |
|||
</view> |
|||
<view style="height:140rpx"></view> |
|||
<view class="fixed-bottom"> |
|||
<navigator url="/pages/user/service/index" class="kefu-box"> |
|||
<view class="iconfont icon-kefu"></view> |
|||
<view>客服</view> |
|||
</navigator> |
|||
<navigator url="/pages/user/cartlist/list" class="kefu-box" style="margin-left:70rpx"> |
|||
<view class="iconfont icon-gouwuche"></view> |
|||
<view>购物车</view> |
|||
</navigator> |
|||
<view style="flex:1"></view> |
|||
<view class="btns"> |
|||
<view class="btn" bindtap="showCart">加入购物车</view> |
|||
<view class="btn" bindtap="showOrder">立即预订</view> |
|||
</view> |
|||
</view> |
|||
<view class="mask" wx:if="{{skuFlag}}"> |
|||
<view class="mask-bg" bindtap="hideSku"></view> |
|||
<view class="mask-content"> |
|||
<view class="iconfont icon-close" bindtap="hideSku"></view> |
|||
<view class="sku-info-box"> |
|||
<image src="{{info.sku[skuIndex].headimg}}" mode="aspectFill"></image> |
|||
<view class="sku-info"> |
|||
<view class="sku-price">{{info.sku[skuIndex].price/100}}</view> |
|||
<view class="sku-name">已选择：{{info.sku[skuIndex].sku_name}}</view> |
|||
</view> |
|||
</view> |
|||
<view class="sku-names"> |
|||
<view bindtap="selectSku" data-index="{{index}}" class="sku-name-item textOver{{index==skuIndex?' active':''}}" wx:for="{{info.sku}}">{{item.sku_name}}</view> |
|||
</view> |
|||
<view class="number-box"> |
|||
<text>数量</text> |
|||
<view class="iconfont icon-sami-select" bindtap="minus"></view> |
|||
<view class="number">{{producNum}}</view> |
|||
<view class="iconfont icon-add-select" bindtap="add"></view> |
|||
</view> |
|||
<view class="btn-box"> |
|||
<view class="mask-btn" bindtap="order">{{skuFlag=='cart'?'确认':'立即购买'}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
@ -0,0 +1,513 @@ |
|||
/* pages/info/hotelProductInfo/index.wxss */ |
|||
page { |
|||
background: #f2f2f2; |
|||
} |
|||
.swiper { |
|||
width: 100%; |
|||
height: 400rpx; |
|||
} |
|||
.swiper image { |
|||
height: 400rpx; |
|||
display: block; |
|||
width: 100%; |
|||
} |
|||
.top-info { |
|||
border-radius: 20rpx 20rpx 0 0; |
|||
background: white; |
|||
position: relative; |
|||
z-index: 1; |
|||
margin-top: -20rpx; |
|||
padding: 20rpx 40rpx; |
|||
} |
|||
.top-info .title { |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
color: #000; |
|||
} |
|||
.top-info .subtitle { |
|||
color: #666; |
|||
font-size: 27rpx; |
|||
margin-top: 20rpx; |
|||
} |
|||
.tags-box { |
|||
margin-top: 10rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
color: #0B898E; |
|||
font-size: 27rpx; |
|||
height: 50rpx; |
|||
} |
|||
.tags-box .tag { |
|||
position: relative; |
|||
line-height: 20rpx; |
|||
font-size: 20rpx; |
|||
font-weight: 500; |
|||
line-height: 50rpx; |
|||
margin-right: 10rpx; |
|||
} |
|||
.tags-box .tag .line { |
|||
content: "1"; |
|||
display: block; |
|||
font-size: 0; |
|||
position: absolute; |
|||
left: 0; |
|||
right: 0; |
|||
background: #DAF3E9; |
|||
height: 8rpx; |
|||
top: 30rpx; |
|||
z-index: -1; |
|||
} |
|||
.tags-price { |
|||
flex: 1; |
|||
text-align: right; |
|||
color: #D62828; |
|||
} |
|||
.tags-price text:nth-child(1){ |
|||
font-size: 27rpx; |
|||
} |
|||
.tags-price text:nth-child(2){ |
|||
font-size: 40rpx; |
|||
font-weight: bold; |
|||
} |
|||
.tags-price text:nth-child(3){ |
|||
font-size: 20rpx; |
|||
color: #999999; |
|||
margin-left: 4rpx; |
|||
} |
|||
.tags-box .iconfont { |
|||
margin-left: 4rpx; |
|||
font-size: 24rpx; |
|||
} |
|||
.address-box { |
|||
justify-content: space-between; |
|||
margin-top: 0; |
|||
} |
|||
.info-address { |
|||
color: #666; |
|||
font-size: 27rpx; |
|||
margin-bottom: 0rpx; |
|||
height: 30rpx; |
|||
line-height: 30rpx; |
|||
} |
|||
.address-box .iconfont { |
|||
font-size: 34rpx; |
|||
} |
|||
.date-all-box { |
|||
margin: 24rpx 20rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
height: 80rpx; |
|||
border-radius: 13rpx; |
|||
background: #0B898E; |
|||
font-size: 31rpx; |
|||
color: #fff; |
|||
font-weight: 500; |
|||
padding: 0 37rpx; |
|||
} |
|||
.days { |
|||
text-align: center; |
|||
font-size: 400; |
|||
width: 84rpx; |
|||
line-height: 34rpx; |
|||
height: 34rpx; |
|||
border-radius: 18rpx; |
|||
border: 1px solid white; |
|||
font-size: 23rpx; |
|||
} |
|||
.picker text { |
|||
font-weight: 400; |
|||
font-size: 21rpx; |
|||
margin-left: 13rpx; |
|||
} |
|||
.product-item { |
|||
display: flex; |
|||
align-items: flex-end; |
|||
justify-content: space-between; |
|||
margin: 20rpx; |
|||
padding: 24rpx 20rpx; |
|||
background: white; |
|||
border-radius: 13rpx; |
|||
} |
|||
.product-item image { |
|||
width: 201rpx; |
|||
height: 201rpx; |
|||
border-radius: 10rpx; |
|||
margin-right: 26rpx; |
|||
flex-shrink: 0; |
|||
} |
|||
.product-item .product-info { |
|||
flex: 1; |
|||
} |
|||
.product-item .product-info .title { |
|||
font-size: 32rpx; |
|||
color: #000; |
|||
font-weight: 500; |
|||
} |
|||
.product-right { |
|||
flex-shrink: 0; |
|||
margin-left: 20rpx; |
|||
} |
|||
.product-right .price { |
|||
color: #D62828; |
|||
font-size: 40rpx; |
|||
font-weight: 500; |
|||
} |
|||
.product-right .price::before { |
|||
content: "￥"; |
|||
font-size: 27rpx; |
|||
font-weight: 400; |
|||
} |
|||
.product-right .btn { |
|||
color: #fff; |
|||
width: 120rpx; |
|||
line-height: 80rpx; |
|||
background: #D62828; |
|||
border-radius: 13rpx; |
|||
font-size: 31rpx; |
|||
font-weight: 500; |
|||
text-align: center; |
|||
margin-top: 20rpx; |
|||
} |
|||
.product-info .subtitle { |
|||
font-size: 24rpx; |
|||
line-height: 36rpx; |
|||
height: 72rpx; |
|||
margin-top: 10rpx; |
|||
margin-bottom: 20rpx; |
|||
color: #999; |
|||
white-space: normal; |
|||
} |
|||
.product-tags { |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.product-tag { |
|||
font-size: 20rpx; |
|||
color: #0B898E; |
|||
border-radius: 16rpx; |
|||
line-height: 30rpx; |
|||
border: 1rpx solid; |
|||
padding: 0 15rpx; |
|||
margin-right: 13rpx; |
|||
} |
|||
.product-tags .product-tags:last-child { |
|||
margin-right: 0; |
|||
} |
|||
.box { |
|||
margin: 20rpx; |
|||
background: white; |
|||
border-radius: 13rpx; |
|||
} |
|||
.box-top { |
|||
line-height: 95rpx; |
|||
border-bottom: 1rpx solid #d9d9d9; |
|||
font-weight: 500; |
|||
color: #000; |
|||
font-size: 35rpx; |
|||
padding: 0 20rpx; |
|||
} |
|||
.box-top .iconfont { |
|||
color: #0B898E; |
|||
font-size: 33rpx; |
|||
margin-right: 16rpx; |
|||
} |
|||
.empty-box { |
|||
text-align: center; |
|||
padding: 40rpx 0; |
|||
font-size: 23rpx; |
|||
color: #333; |
|||
} |
|||
.empty-btn { |
|||
margin: 0 auto; |
|||
margin-top: 30rpx; |
|||
width: 283rpx; |
|||
line-height: 79rpx; |
|||
border: 1rpx solid #0B898E; |
|||
border-radius: 39rpx; |
|||
color: #0B898E; |
|||
font-size: 32rpx; |
|||
margin-bottom: 10rpx; |
|||
} |
|||
.box-top .score { |
|||
color: #D62828; |
|||
font-size: 30rpx; |
|||
font-weight: 400; |
|||
margin-left: 11rpx; |
|||
} |
|||
.product-comment { |
|||
margin: 0 20rpx; |
|||
border-bottom: 1rpx solid #ccc; |
|||
padding: 33rpx 0; |
|||
} |
|||
.product-comment-top { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
color: #999999; |
|||
align-items: center; |
|||
font-size: 24rpx; |
|||
} |
|||
.product-comment-top image { |
|||
flex-shrink: 0; |
|||
width: 57rpx; |
|||
height: 57rpx; |
|||
border-radius: 50%; |
|||
} |
|||
.product-comment-top .comment-info { |
|||
flex: 1; |
|||
margin: 0 15rpx; |
|||
color: #666; |
|||
font-size: 21rpx; |
|||
} |
|||
.product-comment-top .comment-info .iconfont { |
|||
color: #D62828; |
|||
font-size: 22rpx; |
|||
} |
|||
.product-comment-top .comment-info .iconfont text { |
|||
margin-right: 6rpx; |
|||
} |
|||
.comment-content { |
|||
margin-left: 72rpx; |
|||
margin-top: 36rpx; |
|||
font-size: 28rpx; |
|||
color: #000; |
|||
} |
|||
.more-comment-btn { |
|||
line-height: 93rpx; |
|||
margin-right: 20rpx; |
|||
text-align: right; |
|||
color: #999; |
|||
font-size: 27rpx; |
|||
font-weight: 500; |
|||
} |
|||
.more-comment-btn .iconfont { |
|||
margin-left: 6rpx; |
|||
font-size: 24rpx; |
|||
} |
|||
.all-comment-num { |
|||
float: right; |
|||
color: #999999; |
|||
font-size: 27rpx; |
|||
font-weight: 400; |
|||
} |
|||
.scroll-all-box { |
|||
margin: 24rpx 0; |
|||
background: white; |
|||
} |
|||
.scroll-menus { |
|||
padding: 0 40rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
font-size: 29rpx; |
|||
color: #333; |
|||
height: 84rpx; |
|||
border-bottom: 1rpx solid #d9d9d9; |
|||
} |
|||
.scroll-menu-item { |
|||
position: relative; |
|||
line-height: 84rpx; |
|||
} |
|||
.scroll-menu-item.active::after { |
|||
content: "1"; |
|||
font-size: 0; |
|||
display: block; |
|||
position: absolute; |
|||
width: 46rpx; |
|||
height: 6rpx; |
|||
border-radius: 3rpx; |
|||
background: #0B898E; |
|||
left: 50%; |
|||
margin-left: -23rpx; |
|||
bottom: 0rpx; |
|||
} |
|||
.fixed-menus { |
|||
position: fixed; |
|||
left: 0; |
|||
right: 0; |
|||
background: white; |
|||
z-index: 1; |
|||
} |
|||
.info-title { |
|||
font-size: 35rpx; |
|||
font-weight: bold; |
|||
color: #000; |
|||
margin-bottom: 30rpx; |
|||
} |
|||
.info-box { |
|||
padding: 20rpx 40rpx; |
|||
} |
|||
.fixed-bottom { |
|||
position: fixed; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
height: 140rpx; |
|||
background: white; |
|||
display: flex; |
|||
align-items: center; |
|||
box-shadow: 0px 0px 16rpx 0px rgba(6, 0, 1, 0.1); |
|||
padding: 0 40rpx; |
|||
color: #666666; |
|||
font-size: 23rpx; |
|||
justify-content: space-between; |
|||
text-align: center; |
|||
} |
|||
.fixed-bottom .iconfont { |
|||
font-size: 34rpx; |
|||
} |
|||
.btns { |
|||
color: #fff; |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
border-radius: 39rpx; |
|||
text-align: center; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
.btns .btn{ |
|||
width: 216rpx; |
|||
line-height: 78rpx; |
|||
background: #D62828; |
|||
} |
|||
.btns .btn:nth-child(1){ |
|||
margin-right: 3rpx; |
|||
border-radius: 39rpx 0 0 39rpx; |
|||
} |
|||
.btns .btn:nth-child(2){ |
|||
border-radius: 0 39rpx 39rpx 0; |
|||
} |
|||
.mask-content { |
|||
position: absolute; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
width: 100%; |
|||
} |
|||
.mask-content .icon-close { |
|||
position: absolute; |
|||
right: 40rpx; |
|||
top: 40rpx; |
|||
} |
|||
.sku-info-box { |
|||
margin: 50rpx 40rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
} |
|||
.sku-info-box image { |
|||
width: 218rpx; |
|||
height: 180rpx; |
|||
border-radius: 13rpx; |
|||
display: block; |
|||
margin-right: 40rpx; |
|||
flex-shrink: 0; |
|||
} |
|||
.sku-info { |
|||
flex: 1; |
|||
} |
|||
.sku-price { |
|||
font-size: 40rpx; |
|||
font-weight: 500; |
|||
color: #D62828; |
|||
margin: 20rpx 0; |
|||
} |
|||
.sku-price::before { |
|||
content: "￥"; |
|||
font-weight: 400; |
|||
font-size: 27rpx; |
|||
} |
|||
.sku-name { |
|||
font-size: 27rpx; |
|||
color: #666666; |
|||
} |
|||
.sku-names { |
|||
display: flex; |
|||
font-size: 29rpx; |
|||
color: #333; |
|||
margin: 0 40rpx; |
|||
text-align: center; |
|||
flex-wrap: wrap; |
|||
margin-bottom: 20rpx; |
|||
} |
|||
.sku-name-item { |
|||
background: #EFEFEF; |
|||
border: 1rpx solid #EFEFEF; |
|||
width: 318rpx; |
|||
line-height: 77rpx; |
|||
border-radius: 14rpx; |
|||
margin-bottom: 25rpx; |
|||
margin-right: 30rpx; |
|||
} |
|||
.sku-name-item:nth-child(2n){ |
|||
margin-right: 0; |
|||
} |
|||
.sku-name-item.active { |
|||
color: #0B898E; |
|||
border-color: #0B898E; |
|||
background: rgba(11, 137, 142, 0.1); |
|||
} |
|||
.number-box { |
|||
display: flex; |
|||
align-items: center; |
|||
border-top: 1rpx solid #ccc; |
|||
justify-content: space-between; |
|||
margin: 0 40rpx; |
|||
padding: 40rpx 0; |
|||
} |
|||
.number-box text { |
|||
flex: 1; |
|||
font-size: 29rpx; |
|||
color: #333; |
|||
} |
|||
.number-box view { |
|||
border: 1rpx solid #666; |
|||
border-radius: 7rpx; |
|||
text-align: center; |
|||
width: 67rpx; |
|||
line-height: 67rpx; |
|||
font-size: 33rpx; |
|||
color: #000; |
|||
} |
|||
.number-box view.disable { |
|||
border-color: #ccc; |
|||
color: #999; |
|||
} |
|||
.number-box view.number { |
|||
width: 94rpx; |
|||
margin: 0 15rpx; |
|||
} |
|||
.btn-box { |
|||
height: 138rpx; |
|||
background: #FFFFFF; |
|||
box-shadow: 0px 0px 16rpx 0px rgba(6, 0, 1, 0.1); |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
.mask-btn { |
|||
width: 670rpx; |
|||
line-height: 78rpx; |
|||
background: #D62828; |
|||
border-radius: 39rpx; |
|||
color: #fff; |
|||
text-align: center; |
|||
font-size: 33rpx; |
|||
font-weight: 500; |
|||
} |
|||
.icon-xin,.icon-shoucang { |
|||
position: absolute; |
|||
right: 20rpx; |
|||
margin-top: 20rpx; |
|||
width: 60rpx; |
|||
line-height: 60rpx; |
|||
background: rgba(0, 0, 0, 0.4); |
|||
border-radius: 50%; |
|||
text-align: center; |
|||
color: #fff; |
|||
font-size: 36rpx; |
|||
z-index: 1; |
|||
} |
|||
.icon-shoucang { |
|||
color: #D62828; |
|||
} |
|||
@ -0,0 +1,179 @@ |
|||
// pages/info/roadInfo/index.js
|
|||
let device = wx.getSystemInfoSync(); |
|||
const ratio = device.windowWidth / 750; |
|||
import commonApi from "../../../utils/https/common" |
|||
let app = getApp() |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
fixed:false, |
|||
type:1, |
|||
top:0, |
|||
info:null, |
|||
comment:[], |
|||
commentTotal:0 |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
let rect = wx.getMenuButtonBoundingClientRect(); |
|||
let height = (rect.top - device.statusBarHeight) * 2 + rect.height + device.statusBarHeight; |
|||
console.log(height) |
|||
this.setData({ |
|||
top:height, |
|||
id:options.id |
|||
}) |
|||
let api = commonApi._post; |
|||
if(wx.getStorageSync("jstrip_token")){ |
|||
api = commonApi.user_post; |
|||
} |
|||
api("product/get_product_detail",{ |
|||
id:options.id |
|||
}).then(res=>{ |
|||
res.data.display_tags = (res.data.display_tags?res.data.display_tags.split(","):[]).splice(0,2); |
|||
this.setData({ |
|||
info:res.data |
|||
}) |
|||
}) |
|||
commonApi._post("product/product_comment_list",{ |
|||
product_id:options.id, |
|||
offset:0, |
|||
limit:3 |
|||
}).then(res=>{ |
|||
res.data.list.map(item=>{ |
|||
item.rate = Number(item.rate) |
|||
}) |
|||
this.setData({ |
|||
commentTotal:res.data.total, |
|||
comment:res.data.list |
|||
}) |
|||
}) |
|||
}, |
|||
changeMenu:function(e){ |
|||
let index = e.currentTarget.dataset.index,that = this; |
|||
const query=wx.createSelectorQuery(); //创建节点查询器
|
|||
query.select("#box"+index).boundingClientRect() //选择toViewid获取位置信息
|
|||
query.selectViewport().scrollOffset() //获取页面查询位置的
|
|||
query.exec(function(res) { |
|||
let scrollTop = res[0].top + res[1].scrollTop - 110 * ratio - that.data.top; |
|||
wx.pageScrollTo({ |
|||
scrollTop: scrollTop + 4, |
|||
duration: 0 |
|||
}) |
|||
that.setData({ |
|||
type:index |
|||
}) |
|||
}) |
|||
}, |
|||
onPageScroll:function(e){ |
|||
let that = this,height = this.data.top; |
|||
let topHeight = height; |
|||
wx.createSelectorQuery().select('#menus').boundingClientRect(function(rect){ |
|||
console.log(rect.top,topHeight) |
|||
if(rect.top<=topHeight){ |
|||
// 此时应该把menus固定在顶部
|
|||
that.setData({ |
|||
fixed:true |
|||
}) |
|||
} |
|||
else{ |
|||
that.setData({ |
|||
fixed:false |
|||
}) |
|||
} |
|||
// 滚动时判断滚动到哪个部分了
|
|||
const query=wx.createSelectorQuery(); //创建节点查询器
|
|||
query.select("#box1").boundingClientRect() //选择toViewid获取位置信息
|
|||
query.select("#box2").boundingClientRect() //选择toViewid获取位置信息
|
|||
query.select("#box3").boundingClientRect() //选择toViewid获取位置信息
|
|||
query.select("#box4").boundingClientRect() //选择toViewid获取位置信息
|
|||
let minHeight = that.data.fixed?(110 * ratio + height): topHeight; |
|||
query.exec(function(res) { |
|||
if(res[3].top<minHeight){ |
|||
that.setData({ |
|||
type:4 |
|||
}) |
|||
} |
|||
else if(res[2].top<minHeight){ |
|||
that.setData({ |
|||
type:3 |
|||
}) |
|||
} |
|||
else if(res[1].top<minHeight){ |
|||
that.setData({ |
|||
type:2 |
|||
}) |
|||
} |
|||
else { |
|||
that.setData({ |
|||
type:1 |
|||
}) |
|||
} |
|||
}) |
|||
}).exec() |
|||
|
|||
}, |
|||
order:function(){ |
|||
app.globalData.couponInfo = null; |
|||
app.globalData.product = { |
|||
product:this.data.info |
|||
} |
|||
wx.navigateTo({ |
|||
url: '/pages/order/road/index?id='+this.data.info.id |
|||
}) |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,5 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"title":"/pages/component/TitleHeader" |
|||
} |
|||
} |
|||
@ -0,0 +1,93 @@ |
|||
<!--pages/info/hotelProductInfo/index.wxml--> |
|||
<wxs src="../../../utils/filter.wxs" module="tool" /> |
|||
<title title="产品详情"></title> |
|||
<swiper class="swiper" indicator-dots="{{true}}" wx:if="{{info}}" |
|||
autoplay="{{true}}" interval="{{2000}}" duration="{{300}}"> |
|||
<block wx:for="{{info.listimg}}" wx:key="*this"> |
|||
<swiper-item> |
|||
<image src="{{item}}" mode="aspectFill"></image> |
|||
</swiper-item> |
|||
</block> |
|||
</swiper> |
|||
<view class="top-info" wx:if="{{info}}"> |
|||
<view class="title">{{info.title}}</view> |
|||
<view class="tags-box textOver"> |
|||
<view class="tag textOver" wx:for="{{info.display_tags}}">{{item}}<view class="line"></view></view> |
|||
<view class="tags-price"><text>￥</text><text>{{info.price/100}}</text><text>起</text></view> |
|||
</view> |
|||
</view> |
|||
<view class="scroll-all-box" id="menus" wx:if="{{info}}"> |
|||
<view class="scroll-menus{{fixed?' fixed-menus':''}}" style="top:{{top}}px"> |
|||
<view class="scroll-menu-item{{type==1?' active':''}}" bindtap="changeMenu" data-index="1">费用说明</view> |
|||
<view class="scroll-menu-item{{type==2?' active':''}}" bindtap="changeMenu" data-index="2">预定须知</view> |
|||
<view class="scroll-menu-item{{type==3?' active':''}}" bindtap="changeMenu" data-index="3">退改说明</view> |
|||
<view class="scroll-menu-item{{type==4?' active':''}}" bindtap="changeMenu" data-index="4">线路详情</view> |
|||
</view> |
|||
<view style="height:85rpx" wx:if="{{fixed}}"></view> |
|||
<view class="info-box" id="box1" wx:if="{{info}}"> |
|||
<view class="info-title">费用说明</view> |
|||
<rich-text class="details" nodes="{{tool.formateRichText(info.expense_info)}}"></rich-text> |
|||
<!-- <view class="details" wx:for="{{6}}"> |
|||
在这里，酣畅淋漓的做一场偶像梦，你就是星光闪耀的明日之星！下一站天王天后，等你来！ |
|||
演出形式、内容：半露天卡通剧场，儿童剧，亲子互动 |
|||
表演时长：30分钟 |
|||
表演故事线：“最Q童星奖”PK赛现场直播啦！刚从电影学院新鲜出炉的小明星们，赶快大展身手吧！ |
|||
</view> --> |
|||
</view> |
|||
<view class="info-box" id="box2" wx:if="{{info}}"> |
|||
<view class="info-title">预定须知</view> |
|||
<rich-text class="details" nodes="{{tool.formateRichText(info.book_info)}}"></rich-text> |
|||
<!-- <rich-text class="details" nodes="{{filter.formateRichText(skuInfo[0].bookingInfo)}}"></rich-text> --> |
|||
<!-- <view class="details" wx:for="{{6}}"> |
|||
在这里，酣畅淋漓的做一场偶像梦，你就是星光闪耀的明日之星！下一站天王天后，等你来！ |
|||
演出形式、内容：半露天卡通剧场，儿童剧，亲子互动 |
|||
表演时长：30分钟 |
|||
表演故事线：“最Q童星奖”PK赛现场直播啦！刚从电影学院新鲜出炉的小明星们，赶快大展身手吧！ |
|||
</view> --> |
|||
</view> |
|||
<view class="info-box" id="box3" wx:if="{{info}}"> |
|||
<view class="info-title">退改说明</view> |
|||
<rich-text class="details" nodes="{{tool.formateRichText(info.cancel_info)}}"></rich-text> |
|||
<!-- <rich-text class="details" nodes="{{filter.formateRichText(skuInfo[0].refundDescription)}}"></rich-text> --> |
|||
<!-- <view class="details" wx:for="{{6}}"> |
|||
在这里，酣畅淋漓的做一场偶像梦，你就是星光闪耀的明日之星！下一站天王天后，等你来！ |
|||
演出形式、内容：半露天卡通剧场，儿童剧，亲子互动 |
|||
表演时长：30分钟 |
|||
表演故事线：“最Q童星奖”PK赛现场直播啦！刚从电影学院新鲜出炉的小明星们，赶快大展身手吧！ |
|||
</view> --> |
|||
</view> |
|||
<view class="info-box" id="box4" wx:if="{{info}}"> |
|||
<view class="info-title">线路详情</view> |
|||
<rich-text class="details" nodes="{{tool.formateRichText(info.content)}}"></rich-text> |
|||
</view> |
|||
</view> |
|||
<view class="box"> |
|||
<view class="box-top"> |
|||
<text class="iconfont icon-tiwen"></text><text>游客点评</text><text class="score" wx:if="{{info && info.rate && commentTotal>0}}">{{info.rate}}分</text> |
|||
<text class="all-comment-num">共{{commentTotal}}条</text> |
|||
</view> |
|||
<view class="empty-box" wx:if="{{!comment || comment.length==0}}"> |
|||
<view>这里空空如也，快去点评吧!</view> |
|||
<!-- <navigator url="/pages/ask/index?id={{id}}" class="empty-btn">去点评</navigator> --> |
|||
</view> |
|||
<navigator wx:for="{{comment}}" url="/pages/list/comments/index?id={{info.id}}" class="product-comment"> |
|||
<view class="product-comment-top"> |
|||
<image src="{{item.user.avatar}}" mode="aspectFill"></image> |
|||
<view class="comment-info"> |
|||
<view class="nickname">{{item.user.nickname}}</view> |
|||
<view class="iconfont"><text wx:for="{{item.rate}}" class="icon-xingxing"></text><text wx:for="{{5 - item.rate}}" style="color:#999" class="icon-xingxing"></text></view> |
|||
</view> |
|||
<view class="comment-date">{{item.create_time}}</view> |
|||
</view> |
|||
<view class="comment-content">{{item.content}}</view> |
|||
</navigator> |
|||
<navigator url="/pages/list/comments/index?productid={{id}}" wx:if="{{comment.length>0}}" class="more-comment-btn">查看全部点评<text class="iconfont icon-you"></text></navigator> |
|||
</view> |
|||
<view style="height:140rpx"></view> |
|||
<view class="fixed-bottom"> |
|||
<navigator url="/pages/user/service/index" class="kefu-box"> |
|||
<view class="iconfont icon-kefu"></view> |
|||
<view>客服</view> |
|||
</navigator> |
|||
<view class="btn" bindtap="order">立即预订</view> |
|||
</view> |
|||
@ -0,0 +1,362 @@ |
|||
/* pages/info/hotelProductInfo/index.wxss */ |
|||
page { |
|||
background: #f2f2f2; |
|||
} |
|||
.swiper { |
|||
width: 100%; |
|||
height: 400rpx; |
|||
} |
|||
.swiper image { |
|||
height: 400rpx; |
|||
display: block; |
|||
width: 100%; |
|||
} |
|||
.top-info { |
|||
border-radius: 20rpx 20rpx 0 0; |
|||
background: white; |
|||
position: relative; |
|||
z-index: 1; |
|||
margin-top: -20rpx; |
|||
padding: 20rpx 40rpx; |
|||
} |
|||
.top-info .title { |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
color: #000; |
|||
} |
|||
.tags-box { |
|||
margin-top: 10rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
color: #0B898E; |
|||
font-size: 27rpx; |
|||
height: 50rpx; |
|||
} |
|||
.tags-box .tag { |
|||
position: relative; |
|||
line-height: 20rpx; |
|||
font-size: 20rpx; |
|||
font-weight: 500; |
|||
line-height: 50rpx; |
|||
} |
|||
.tags-box .tag .line { |
|||
content: "1"; |
|||
display: block; |
|||
font-size: 0; |
|||
position: absolute; |
|||
left: 0; |
|||
right: 0; |
|||
background: #DAF3E9; |
|||
height: 8rpx; |
|||
top: 30rpx; |
|||
z-index: -1; |
|||
} |
|||
.tags-price { |
|||
flex: 1; |
|||
text-align: right; |
|||
color: #D62828; |
|||
} |
|||
.tags-price text:nth-child(1){ |
|||
font-size: 27rpx; |
|||
} |
|||
.tags-price text:nth-child(2){ |
|||
font-size: 40rpx; |
|||
font-weight: bold; |
|||
} |
|||
.tags-price text:nth-child(3){ |
|||
font-size: 20rpx; |
|||
color: #999999; |
|||
margin-left: 4rpx; |
|||
} |
|||
.tags-box .iconfont { |
|||
margin-left: 4rpx; |
|||
font-size: 24rpx; |
|||
} |
|||
.address-box { |
|||
justify-content: space-between; |
|||
margin-top: 0; |
|||
} |
|||
.info-address { |
|||
color: #666; |
|||
font-size: 27rpx; |
|||
margin-bottom: 0rpx; |
|||
height: 30rpx; |
|||
line-height: 30rpx; |
|||
} |
|||
.address-box .iconfont { |
|||
font-size: 34rpx; |
|||
} |
|||
.date-all-box { |
|||
margin: 24rpx 20rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
height: 80rpx; |
|||
border-radius: 13rpx; |
|||
background: #0B898E; |
|||
font-size: 31rpx; |
|||
color: #fff; |
|||
font-weight: 500; |
|||
padding: 0 37rpx; |
|||
} |
|||
.days { |
|||
text-align: center; |
|||
font-size: 400; |
|||
width: 84rpx; |
|||
line-height: 34rpx; |
|||
height: 34rpx; |
|||
border-radius: 18rpx; |
|||
border: 1px solid white; |
|||
font-size: 23rpx; |
|||
} |
|||
.picker text { |
|||
font-weight: 400; |
|||
font-size: 21rpx; |
|||
margin-left: 13rpx; |
|||
} |
|||
.product-item { |
|||
display: flex; |
|||
align-items: flex-end; |
|||
justify-content: space-between; |
|||
margin: 20rpx; |
|||
padding: 24rpx 20rpx; |
|||
background: white; |
|||
border-radius: 13rpx; |
|||
} |
|||
.product-item image { |
|||
width: 201rpx; |
|||
height: 201rpx; |
|||
border-radius: 10rpx; |
|||
margin-right: 26rpx; |
|||
flex-shrink: 0; |
|||
} |
|||
.product-item .product-info { |
|||
flex: 1; |
|||
} |
|||
.product-item .product-info .title { |
|||
font-size: 32rpx; |
|||
color: #000; |
|||
font-weight: 500; |
|||
} |
|||
.product-right { |
|||
flex-shrink: 0; |
|||
margin-left: 20rpx; |
|||
} |
|||
.product-right .price { |
|||
color: #D62828; |
|||
font-size: 40rpx; |
|||
font-weight: 500; |
|||
} |
|||
.product-right .price::before { |
|||
content: "￥"; |
|||
font-size: 27rpx; |
|||
font-weight: 400; |
|||
} |
|||
.product-right .btn { |
|||
color: #fff; |
|||
width: 120rpx; |
|||
line-height: 80rpx; |
|||
background: #D62828; |
|||
border-radius: 13rpx; |
|||
font-size: 31rpx; |
|||
font-weight: 500; |
|||
text-align: center; |
|||
margin-top: 20rpx; |
|||
} |
|||
.product-info .subtitle { |
|||
font-size: 24rpx; |
|||
line-height: 36rpx; |
|||
height: 72rpx; |
|||
margin-top: 10rpx; |
|||
margin-bottom: 20rpx; |
|||
color: #999; |
|||
white-space: normal; |
|||
} |
|||
.product-tags { |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.product-tag { |
|||
font-size: 20rpx; |
|||
color: #0B898E; |
|||
border-radius: 16rpx; |
|||
line-height: 30rpx; |
|||
border: 1rpx solid; |
|||
padding: 0 15rpx; |
|||
margin-right: 13rpx; |
|||
} |
|||
.product-tags .product-tags:last-child { |
|||
margin-right: 0; |
|||
} |
|||
.box { |
|||
margin: 20rpx; |
|||
background: white; |
|||
border-radius: 13rpx; |
|||
} |
|||
.box-top { |
|||
line-height: 95rpx; |
|||
border-bottom: 1rpx solid #d9d9d9; |
|||
font-weight: 500; |
|||
color: #000; |
|||
font-size: 35rpx; |
|||
padding: 0 20rpx; |
|||
} |
|||
.box-top .iconfont { |
|||
color: #0B898E; |
|||
font-size: 33rpx; |
|||
margin-right: 16rpx; |
|||
} |
|||
.empty-box { |
|||
text-align: center; |
|||
padding: 40rpx 0; |
|||
font-size: 23rpx; |
|||
color: #333; |
|||
} |
|||
.empty-btn { |
|||
margin: 0 auto; |
|||
margin-top: 30rpx; |
|||
width: 283rpx; |
|||
line-height: 79rpx; |
|||
border: 1rpx solid #0B898E; |
|||
border-radius: 39rpx; |
|||
color: #0B898E; |
|||
font-size: 32rpx; |
|||
margin-bottom: 10rpx; |
|||
} |
|||
.box-top .score { |
|||
color: #D62828; |
|||
font-size: 30rpx; |
|||
font-weight: 400; |
|||
margin-left: 11rpx; |
|||
} |
|||
.product-comment { |
|||
margin: 0 20rpx; |
|||
border-bottom: 1rpx solid #ccc; |
|||
padding: 33rpx 0; |
|||
} |
|||
.product-comment-top { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
color: #999999; |
|||
align-items: center; |
|||
font-size: 24rpx; |
|||
} |
|||
.product-comment-top image { |
|||
flex-shrink: 0; |
|||
width: 57rpx; |
|||
height: 57rpx; |
|||
border-radius: 50%; |
|||
} |
|||
.product-comment-top .comment-info { |
|||
flex: 1; |
|||
margin: 0 15rpx; |
|||
color: #666; |
|||
font-size: 21rpx; |
|||
} |
|||
.product-comment-top .comment-info .iconfont { |
|||
color: #D62828; |
|||
font-size: 22rpx; |
|||
} |
|||
.product-comment-top .comment-info .iconfont text { |
|||
margin-right: 6rpx; |
|||
} |
|||
.comment-content { |
|||
margin-left: 72rpx; |
|||
margin-top: 36rpx; |
|||
font-size: 28rpx; |
|||
color: #000; |
|||
} |
|||
.more-comment-btn { |
|||
line-height: 93rpx; |
|||
margin-right: 20rpx; |
|||
text-align: right; |
|||
color: #999; |
|||
font-size: 27rpx; |
|||
font-weight: 500; |
|||
} |
|||
.more-comment-btn .iconfont { |
|||
margin-left: 6rpx; |
|||
font-size: 24rpx; |
|||
} |
|||
.all-comment-num { |
|||
float: right; |
|||
color: #999999; |
|||
font-size: 27rpx; |
|||
font-weight: 400; |
|||
} |
|||
.scroll-all-box { |
|||
margin: 24rpx 0; |
|||
background: white; |
|||
} |
|||
.scroll-menus { |
|||
padding: 0 40rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
font-size: 29rpx; |
|||
color: #333; |
|||
height: 84rpx; |
|||
border-bottom: 1rpx solid #d9d9d9; |
|||
} |
|||
.scroll-menu-item { |
|||
position: relative; |
|||
line-height: 84rpx; |
|||
} |
|||
.scroll-menu-item.active::after { |
|||
content: "1"; |
|||
font-size: 0; |
|||
display: block; |
|||
position: absolute; |
|||
width: 46rpx; |
|||
height: 6rpx; |
|||
border-radius: 3rpx; |
|||
background: #0B898E; |
|||
left: 50%; |
|||
margin-left: -23rpx; |
|||
bottom: 0rpx; |
|||
} |
|||
.fixed-menus { |
|||
position: fixed; |
|||
left: 0; |
|||
right: 0; |
|||
background: white; |
|||
z-index: 1; |
|||
} |
|||
.info-title { |
|||
font-size: 35rpx; |
|||
font-weight: bold; |
|||
color: #000; |
|||
margin-bottom: 30rpx; |
|||
} |
|||
.info-box { |
|||
padding: 20rpx 40rpx; |
|||
} |
|||
.fixed-bottom { |
|||
position: fixed; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
height: 140rpx; |
|||
background: white; |
|||
display: flex; |
|||
align-items: center; |
|||
box-shadow: 0px 0px 16rpx 0px rgba(6, 0, 1, 0.1); |
|||
padding: 0 40rpx; |
|||
color: #666666; |
|||
font-size: 23rpx; |
|||
justify-content: space-between; |
|||
text-align: center; |
|||
} |
|||
.fixed-bottom .iconfont { |
|||
font-size: 34rpx; |
|||
} |
|||
.btn { |
|||
color: #fff; |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
width: 294rpx; |
|||
line-height: 78rpx; |
|||
background: #D62828; |
|||
border-radius: 39rpx; |
|||
text-align: center; |
|||
} |
|||
@ -0,0 +1,128 @@ |
|||
// pages/info/roadInfo/index.js
|
|||
let device = wx.getSystemInfoSync(); |
|||
const ratio = device.windowWidth / 750; |
|||
import commonApi from "../../../utils/https/common" |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
fixed:false, |
|||
type:1, |
|||
top:0, |
|||
info:null |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
let rect = wx.getMenuButtonBoundingClientRect(); |
|||
let height = (rect.top - device.statusBarHeight) * 2 + rect.height + device.statusBarHeight; |
|||
console.log(height) |
|||
this.setData({ |
|||
top:height |
|||
}) |
|||
commonApi._post("scene/detail",{ |
|||
id:options.id |
|||
}).then(res=>{ |
|||
this.setData({ |
|||
info:res.data |
|||
}) |
|||
}) |
|||
}, |
|||
changeMenu:function(e){ |
|||
let index = e.currentTarget.dataset.index,that = this; |
|||
const query=wx.createSelectorQuery(); //创建节点查询器
|
|||
query.select("#box"+index).boundingClientRect() //选择toViewid获取位置信息
|
|||
query.selectViewport().scrollOffset() //获取页面查询位置的
|
|||
query.exec(function(res) { |
|||
let scrollTop = res[0].top + res[1].scrollTop - 110 * ratio - that.data.top; |
|||
wx.pageScrollTo({ |
|||
scrollTop: scrollTop + 4, |
|||
duration: 0 |
|||
}) |
|||
that.setData({ |
|||
type:index |
|||
}) |
|||
}) |
|||
}, |
|||
onPageScroll:function(e){ |
|||
let that = this,height = this.data.top; |
|||
let topHeight = height; |
|||
// 滚动时判断滚动到哪个部分了
|
|||
const query=wx.createSelectorQuery(); //创建节点查询器
|
|||
query.select("#box1").boundingClientRect() //选择toViewid获取位置信息
|
|||
query.select("#box2").boundingClientRect() //选择toViewid获取位置信息
|
|||
query.select("#box3").boundingClientRect() //选择toViewid获取位置信息
|
|||
let minHeight = that.data.fixed?(110 * ratio + height): topHeight; |
|||
query.exec(function(res) { |
|||
if(res[2].top<minHeight){ |
|||
that.setData({ |
|||
type:3 |
|||
}) |
|||
} |
|||
else if(res[1].top<minHeight){ |
|||
that.setData({ |
|||
type:2 |
|||
}) |
|||
} |
|||
else { |
|||
that.setData({ |
|||
type:1 |
|||
}) |
|||
} |
|||
}) |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,5 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"title":"/pages/component/TitleHeader" |
|||
} |
|||
} |
|||
@ -0,0 +1,41 @@ |
|||
<!--pages/info/hotelProductInfo/index.wxml--> |
|||
<wxs src="../../../utils/filter.wxs" module="tool" /> |
|||
<title title="景点详情"></title> |
|||
<view class="scroll-all-box" id="menus" wx:if="{{info}}"> |
|||
<view class="scroll-menus fixed-menus"> |
|||
<view class="scroll-menu-item{{type==1?' active':''}}" bindtap="changeMenu" data-index="1">景点介绍</view> |
|||
<view class="scroll-menu-item{{type==2?' active':''}}" bindtap="changeMenu" data-index="2">开放时间</view> |
|||
<view class="scroll-menu-item{{type==3?' active':''}}" bindtap="changeMenu" data-index="3">优待政策</view> |
|||
</view> |
|||
<view style="height:85rpx"></view> |
|||
<view class="info-box" id="box1"> |
|||
<view class="info-title">景点介绍</view> |
|||
<rich-text class="detail" nodes="{{tool.formateRichText(info.content)}}"></rich-text> |
|||
<!-- <rich-text class="details"></rich-text> --> |
|||
<!-- <view class="details" wx:for="{{6}}"> |
|||
在这里，酣畅淋漓的做一场偶像梦，你就是星光闪耀的明日之星！下一站天王天后，等你来！ |
|||
演出形式、内容：半露天卡通剧场，儿童剧，亲子互动 |
|||
表演时长：30分钟 |
|||
表演故事线：“最Q童星奖”PK赛现场直播啦！刚从电影学院新鲜出炉的小明星们，赶快大展身手吧！ |
|||
</view> --> |
|||
</view> |
|||
<view class="info-box" id="box2"> |
|||
<view class="info-title">开放时间</view> |
|||
<rich-text class="detail" nodes="{{tool.formateRichText(info.time_info)}}"></rich-text> |
|||
<!-- <rich-text class="details" nodes="{{filter.formateRichText(skuInfo[0].feeDescription)}}"></rich-text> --> |
|||
<!-- <view class="details"> |
|||
{{info.open_time}} |
|||
</view> --> |
|||
</view> |
|||
<view class="info-box" id="box3"> |
|||
<view class="info-title">优待政策</view> |
|||
<rich-text class="detail" nodes="{{tool.formateRichText(info.extra_info)}}"></rich-text> |
|||
<!-- <rich-text class="details" nodes="{{filter.formateRichText(skuInfo[0].bookingInfo)}}"></rich-text> --> |
|||
<!-- <view class="details" wx:for="{{6}}"> |
|||
在这里，酣畅淋漓的做一场偶像梦，你就是星光闪耀的明日之星！下一站天王天后，等你来！ |
|||
演出形式、内容：半露天卡通剧场，儿童剧，亲子互动 |
|||
表演时长：30分钟 |
|||
表演故事线：“最Q童星奖”PK赛现场直播啦！刚从电影学院新鲜出炉的小明星们，赶快大展身手吧！ |
|||
</view> --> |
|||
</view> |
|||
</view> |
|||
@ -0,0 +1,361 @@ |
|||
/* pages/info/hotelProductInfo/index.wxss */ |
|||
page { |
|||
background: #f2f2f2; |
|||
} |
|||
.swiper { |
|||
width: 100%; |
|||
height: 400rpx; |
|||
} |
|||
.swiper image { |
|||
height: 400rpx; |
|||
display: block; |
|||
width: 100%; |
|||
} |
|||
.top-info { |
|||
border-radius: 20rpx 20rpx 0 0; |
|||
background: white; |
|||
position: relative; |
|||
z-index: 1; |
|||
margin-top: -20rpx; |
|||
padding: 20rpx 40rpx; |
|||
} |
|||
.top-info .title { |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
color: #000; |
|||
} |
|||
.tags-box { |
|||
margin-top: 10rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
color: #0B898E; |
|||
font-size: 27rpx; |
|||
height: 50rpx; |
|||
} |
|||
.tags-box .tag { |
|||
position: relative; |
|||
line-height: 20rpx; |
|||
font-size: 20rpx; |
|||
font-weight: 500; |
|||
line-height: 50rpx; |
|||
} |
|||
.tags-box .tag .line { |
|||
content: "1"; |
|||
display: block; |
|||
font-size: 0; |
|||
position: absolute; |
|||
left: 0; |
|||
right: 0; |
|||
background: #DAF3E9; |
|||
height: 8rpx; |
|||
top: 30rpx; |
|||
z-index: -1; |
|||
} |
|||
.tags-price { |
|||
flex: 1; |
|||
text-align: right; |
|||
color: #D62828; |
|||
} |
|||
.tags-price text:nth-child(1){ |
|||
font-size: 27rpx; |
|||
} |
|||
.tags-price text:nth-child(2){ |
|||
font-size: 40rpx; |
|||
font-weight: bold; |
|||
} |
|||
.tags-price text:nth-child(3){ |
|||
font-size: 20rpx; |
|||
color: #999999; |
|||
margin-left: 4rpx; |
|||
} |
|||
.tags-box .iconfont { |
|||
margin-left: 4rpx; |
|||
font-size: 24rpx; |
|||
} |
|||
.address-box { |
|||
justify-content: space-between; |
|||
margin-top: 0; |
|||
} |
|||
.info-address { |
|||
color: #666; |
|||
font-size: 27rpx; |
|||
margin-bottom: 0rpx; |
|||
height: 30rpx; |
|||
line-height: 30rpx; |
|||
} |
|||
.address-box .iconfont { |
|||
font-size: 34rpx; |
|||
} |
|||
.date-all-box { |
|||
margin: 24rpx 20rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
height: 80rpx; |
|||
border-radius: 13rpx; |
|||
background: #0B898E; |
|||
font-size: 31rpx; |
|||
color: #fff; |
|||
font-weight: 500; |
|||
padding: 0 37rpx; |
|||
} |
|||
.days { |
|||
text-align: center; |
|||
font-size: 400; |
|||
width: 84rpx; |
|||
line-height: 34rpx; |
|||
height: 34rpx; |
|||
border-radius: 18rpx; |
|||
border: 1px solid white; |
|||
font-size: 23rpx; |
|||
} |
|||
.picker text { |
|||
font-weight: 400; |
|||
font-size: 21rpx; |
|||
margin-left: 13rpx; |
|||
} |
|||
.product-item { |
|||
display: flex; |
|||
align-items: flex-end; |
|||
justify-content: space-between; |
|||
margin: 20rpx; |
|||
padding: 24rpx 20rpx; |
|||
background: white; |
|||
border-radius: 13rpx; |
|||
} |
|||
.product-item image { |
|||
width: 201rpx; |
|||
height: 201rpx; |
|||
border-radius: 10rpx; |
|||
margin-right: 26rpx; |
|||
flex-shrink: 0; |
|||
} |
|||
.product-item .product-info { |
|||
flex: 1; |
|||
} |
|||
.product-item .product-info .title { |
|||
font-size: 32rpx; |
|||
color: #000; |
|||
font-weight: 500; |
|||
} |
|||
.product-right { |
|||
flex-shrink: 0; |
|||
margin-left: 20rpx; |
|||
} |
|||
.product-right .price { |
|||
color: #D62828; |
|||
font-size: 40rpx; |
|||
font-weight: 500; |
|||
} |
|||
.product-right .price::before { |
|||
content: "￥"; |
|||
font-size: 27rpx; |
|||
font-weight: 400; |
|||
} |
|||
.product-right .btn { |
|||
color: #fff; |
|||
width: 120rpx; |
|||
line-height: 80rpx; |
|||
background: #D62828; |
|||
border-radius: 13rpx; |
|||
font-size: 31rpx; |
|||
font-weight: 500; |
|||
text-align: center; |
|||
margin-top: 20rpx; |
|||
} |
|||
.product-info .subtitle { |
|||
font-size: 24rpx; |
|||
line-height: 36rpx; |
|||
height: 72rpx; |
|||
margin-top: 10rpx; |
|||
margin-bottom: 20rpx; |
|||
color: #999; |
|||
white-space: normal; |
|||
} |
|||
.product-tags { |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.product-tag { |
|||
font-size: 20rpx; |
|||
color: #0B898E; |
|||
border-radius: 16rpx; |
|||
line-height: 30rpx; |
|||
border: 1rpx solid; |
|||
padding: 0 15rpx; |
|||
margin-right: 13rpx; |
|||
} |
|||
.product-tags .product-tags:last-child { |
|||
margin-right: 0; |
|||
} |
|||
.box { |
|||
margin: 20rpx; |
|||
background: white; |
|||
border-radius: 13rpx; |
|||
} |
|||
.box-top { |
|||
line-height: 95rpx; |
|||
border-bottom: 1rpx solid #d9d9d9; |
|||
font-weight: 500; |
|||
color: #000; |
|||
font-size: 35rpx; |
|||
padding: 0 20rpx; |
|||
} |
|||
.box-top .iconfont { |
|||
color: #0B898E; |
|||
font-size: 33rpx; |
|||
margin-right: 16rpx; |
|||
} |
|||
.empty-box { |
|||
text-align: center; |
|||
padding: 40rpx 0; |
|||
font-size: 23rpx; |
|||
color: #333; |
|||
} |
|||
.empty-btn { |
|||
margin: 0 auto; |
|||
margin-top: 30rpx; |
|||
width: 283rpx; |
|||
line-height: 79rpx; |
|||
border: 1rpx solid #0B898E; |
|||
border-radius: 39rpx; |
|||
color: #0B898E; |
|||
font-size: 32rpx; |
|||
margin-bottom: 10rpx; |
|||
} |
|||
.box-top .score { |
|||
color: #D62828; |
|||
font-size: 30rpx; |
|||
font-weight: 400; |
|||
margin-left: 11rpx; |
|||
} |
|||
.product-comment { |
|||
margin: 0 20rpx; |
|||
border-bottom: 1rpx solid #ccc; |
|||
padding: 33rpx 0; |
|||
} |
|||
.product-comment-top { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
color: #999999; |
|||
align-items: center; |
|||
font-size: 24rpx; |
|||
} |
|||
.product-comment-top image { |
|||
flex-shrink: 0; |
|||
width: 57rpx; |
|||
height: 57rpx; |
|||
border-radius: 50%; |
|||
} |
|||
.product-comment-top .comment-info { |
|||
flex: 1; |
|||
margin: 0 15rpx; |
|||
color: #666; |
|||
font-size: 21rpx; |
|||
} |
|||
.product-comment-top .comment-info .iconfont { |
|||
color: #D62828; |
|||
font-size: 22rpx; |
|||
} |
|||
.product-comment-top .comment-info .iconfont text { |
|||
margin-right: 6rpx; |
|||
} |
|||
.comment-content { |
|||
margin-left: 72rpx; |
|||
margin-top: 36rpx; |
|||
font-size: 28rpx; |
|||
color: #000; |
|||
} |
|||
.more-comment-btn { |
|||
line-height: 93rpx; |
|||
margin-right: 20rpx; |
|||
text-align: right; |
|||
color: #999; |
|||
font-size: 27rpx; |
|||
font-weight: 500; |
|||
} |
|||
.more-comment-btn .iconfont { |
|||
margin-left: 6rpx; |
|||
font-size: 24rpx; |
|||
} |
|||
.all-comment-num { |
|||
float: right; |
|||
color: #999999; |
|||
font-size: 27rpx; |
|||
font-weight: 400; |
|||
} |
|||
.scroll-all-box { |
|||
background: white; |
|||
} |
|||
.scroll-menus { |
|||
padding: 0 40rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
font-size: 29rpx; |
|||
color: #333; |
|||
height: 84rpx; |
|||
border-bottom: 1rpx solid #d9d9d9; |
|||
} |
|||
.scroll-menu-item { |
|||
position: relative; |
|||
line-height: 84rpx; |
|||
} |
|||
.scroll-menu-item.active::after { |
|||
content: "1"; |
|||
font-size: 0; |
|||
display: block; |
|||
position: absolute; |
|||
width: 46rpx; |
|||
height: 6rpx; |
|||
border-radius: 3rpx; |
|||
background: #0B898E; |
|||
left: 50%; |
|||
margin-left: -23rpx; |
|||
bottom: 0rpx; |
|||
} |
|||
.fixed-menus { |
|||
position: fixed; |
|||
left: 0; |
|||
right: 0; |
|||
background: white; |
|||
z-index: 1; |
|||
} |
|||
.info-title { |
|||
font-size: 35rpx; |
|||
font-weight: bold; |
|||
color: #000; |
|||
margin-bottom: 30rpx; |
|||
} |
|||
.info-box { |
|||
padding: 20rpx 40rpx; |
|||
} |
|||
.fixed-bottom { |
|||
position: fixed; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
height: 140rpx; |
|||
background: white; |
|||
display: flex; |
|||
align-items: center; |
|||
box-shadow: 0px 0px 16rpx 0px rgba(6, 0, 1, 0.1); |
|||
padding: 0 40rpx; |
|||
color: #666666; |
|||
font-size: 23rpx; |
|||
justify-content: space-between; |
|||
text-align: center; |
|||
} |
|||
.fixed-bottom .iconfont { |
|||
font-size: 34rpx; |
|||
} |
|||
.btn { |
|||
color: #fff; |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
width: 294rpx; |
|||
line-height: 78rpx; |
|||
background: #D62828; |
|||
border-radius: 39rpx; |
|||
text-align: center; |
|||
} |
|||
@ -0,0 +1,196 @@ |
|||
// pages/info/sceneProductInfo/index.js
|
|||
import commonApi from "../../../utils/https/common" |
|||
import util from "../../../utils/util" |
|||
let app = getApp() |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
info:null, |
|||
bookingInfo:null, |
|||
bookingInfoTitle:"", |
|||
safeBottom:app.globalData.safeBottom, |
|||
isLike:0, |
|||
comment:[], |
|||
commentTotal:0, |
|||
isTest:true |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
if(!options.id){ |
|||
util.back() |
|||
return; |
|||
} |
|||
commonApi._post("pbservice/Other/getClientConfig",{ |
|||
unique_key:"wechatxcx" |
|||
}).then(res=>{ |
|||
let data = JSON.parse(res.data); |
|||
this.setData({ |
|||
isTest:data.isTest |
|||
}) |
|||
}) |
|||
this.setData({ |
|||
id:options.id |
|||
}) |
|||
commonApi._post("scene/detail",{ |
|||
id:options.id |
|||
}).then(res=>{ |
|||
if(!res.data){ |
|||
wx.showToast({ |
|||
title: '产品已下架', |
|||
icon:'none' |
|||
}) |
|||
setTimeout(()=>{ |
|||
util.back(); |
|||
},1000) |
|||
return; |
|||
} |
|||
res.data.display_tags = (res.data.display_tags?res.data.display_tags.split(","):[]).splice(0,2); |
|||
// res.data.listimg = res.data.listimg?res.data.listimg.split(","):[];
|
|||
res.data.product.map(product=>{ |
|||
product.sku.map(sku=>{ |
|||
sku.display_tags = (sku.display_tags?sku.display_tags.split(","):[]).splice(0,2); |
|||
}) |
|||
}) |
|||
this.setData({ |
|||
info:res.data |
|||
}) |
|||
}) |
|||
// 获取收藏的状态
|
|||
if(wx.getStorageSync("jstrip_token")){ |
|||
commonApi.user_post("scene/is_scene_collection",{ |
|||
scene_id:options.id |
|||
}).then(res=>{ |
|||
this.setData({ |
|||
isLike:res.data |
|||
}) |
|||
}) |
|||
} |
|||
commonApi._post("ask/getQuestionList",{ |
|||
scene_id:options.id, |
|||
page_no:1, |
|||
page_num:3 |
|||
}).then(res=>{ |
|||
this.setData({ |
|||
ask:res.data.rows |
|||
}) |
|||
console.log(res) |
|||
}) |
|||
// 获取评价列表
|
|||
commonApi._post("scene/get_comment",{ |
|||
scene_id:options.id |
|||
}).then(res=>{ |
|||
res.data.list.map(item=>{ |
|||
item.rate = Number(item.rate) |
|||
}) |
|||
this.setData({ |
|||
comment:res.data.list.splice(0,3), |
|||
commentTotal:res.data.total |
|||
}) |
|||
console.log(res) |
|||
}) |
|||
}, |
|||
like:function(){ |
|||
let id = this.data.id,isLike = Number(this.data.isLike); |
|||
console.log(isLike) |
|||
commonApi.user_post(isLike!=1?"scene/scene_collection":"scene/scene_cancel_collection",{ |
|||
scene_id:id |
|||
}).then(res=>{ |
|||
if(res.code==1){ |
|||
console.log(isLike) |
|||
wx.showToast({ |
|||
title: '操作成功', |
|||
}) |
|||
this.setData({ |
|||
isLike:isLike==1?0:1 |
|||
}) |
|||
} |
|||
}) |
|||
}, |
|||
gotolocation:function(){ |
|||
let info = this.data.info; |
|||
wx.openLocation({ |
|||
latitude: Number(info.lat), |
|||
longitude: Number(info.lon) |
|||
}) |
|||
}, |
|||
audioGuide:function(){ |
|||
wx.navigateToMiniProgram({ |
|||
appId: 'wx74f380bc721a0379', |
|||
path:'/pages/listen/listen' |
|||
}) |
|||
}, |
|||
showBookingInfo:function(e){ |
|||
this.setData({ |
|||
bookingInfo:e.currentTarget.dataset.item.sku_model, |
|||
bookingInfoTitle:e.currentTarget.dataset.item.sku_name |
|||
}) |
|||
}, |
|||
closeMask:function(){ |
|||
this.setData({ |
|||
bookingInfo:null |
|||
}) |
|||
}, |
|||
order:function(e){ |
|||
app.globalData.couponInfo = null; |
|||
// let sku = e.currentTarget.dataset.sku,product = e.currentTarget.dataset.product;
|
|||
app.globalData.product = e.currentTarget.dataset; |
|||
wx.navigateTo({ |
|||
url: '/pages/order/scene/index', |
|||
}) |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,6 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"title":"/pages/component/TitleHeader", |
|||
"notice":"/pages/component/notice/notice" |
|||
} |
|||
} |
|||
@ -0,0 +1,106 @@ |
|||
<!--pages/info/sceneProductInfo/index.wxml--> |
|||
<title title="产品详情"></title> |
|||
<view class="iconfont {{isLike==1?'icon-shoucang':'icon-xin'}}" bindtap="like"></view> |
|||
<view class="audio-box" bindtap="audioGuide"> |
|||
<view>语音导览</view> |
|||
<image src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/info/play-btn.png" mode="widthFix"></image> |
|||
</view> |
|||
<swiper class="swiper" indicator-dots="{{true}}" wx:if="{{info}}" |
|||
autoplay="{{true}}" interval="{{2000}}" duration="{{300}}"> |
|||
<block wx:for="{{info.listimg}}" wx:key="*this"> |
|||
<swiper-item> |
|||
<image src="{{item}}" mode="aspectFill"></image> |
|||
</swiper-item> |
|||
</block> |
|||
</swiper> |
|||
<view class="top-info" wx:if="{{info}}"> |
|||
<view class="title">{{info.title}}</view> |
|||
<view class="tags-box textOver"> |
|||
<view class="tag textOver" wx:for="{{info.display_tags}}">{{item}}<view class="line"></view></view> |
|||
<!-- <view class="tags-text">详情 <text class="iconfont icon-you"></text></view> --> |
|||
</view> |
|||
<view class="tags-box address-box" style="height:auto"> |
|||
<view class="info-address">开园时间：{{info.open_time}}</view> |
|||
<navigator url="/pages/info/sceneInfo/index?id={{info.id}}" class="iconfont" style="font-size:27rpx;flex-shrink:0">优待政策 | 景点介绍 <text class="iconfont icon-you" style="font-size:24rpx"></text></navigator> |
|||
</view> |
|||
<view class="tags-box textOver address-box"> |
|||
<view class="info-address">地址：{{info.address}}</view> |
|||
<view class="iconfont icon-daohang" bindtap="gotolocation"></view> |
|||
</view> |
|||
</view> |
|||
<view class="box" wx:if="{{info}}" wx:for="{{info.product}}"> |
|||
<view class="box-top"> |
|||
<text>{{item.title}}</text> |
|||
</view> |
|||
<view class="product-item" wx:for="{{item.sku}}" wx:for-item="sku"> |
|||
<view class="skutitle">{{sku.sku_name}}</view> |
|||
<view class="product-box"> |
|||
<view class="product-left textOver"> |
|||
<view class="product-tags"> |
|||
<view class="product-tag textOver" wx:for="{{sku.display_tags}}">{{item}}</view> |
|||
</view> |
|||
<view class="order-tip-text" bindtap="showBookingInfo" data-item="{{sku}}">预订须知>></view> |
|||
</view> |
|||
<view class="product-right"> |
|||
<view class="price"><text>￥</text><text>{{sku.price?sku.price/100:0}}</text><text>起</text></view> |
|||
<view bindtap="order" data-sku="{{sku}}" data-product="{{item}}" class="btn">立即预订</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<!-- <view class="empty-box"> |
|||
<view>这里空空如也，快去向大家提问吧!</view> |
|||
<view class="empty-btn">去提问</view> |
|||
</view> --> |
|||
</view> |
|||
<view class="box" wx:if="{{isTest==false}}"> |
|||
<view class="box-top"> |
|||
<text class="iconfont icon-tiwen1"></text><text>问大家</text> |
|||
</view> |
|||
<view class="empty-box" wx:if="{{!ask || ask.length==0}}"> |
|||
<view>这里空空如也，快去向大家提问吧!</view> |
|||
<navigator url="/pages/ask/index?id={{id}}" class="empty-btn">去提问</navigator> |
|||
</view> |
|||
<view class="ask-list" wx:else> |
|||
<navigator url="/pages/ask/info/index?id={{item.id}}" class="ask-item" wx:for="{{ask}}"> |
|||
<view class="item-ques"> |
|||
<image class="item-icon" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/ask/ask.png" mode="widthFix"></image> |
|||
<view class="ques">{{item.question_name}}</view> |
|||
<view class="ques-num" wx:if="{{item.answer.total!=0}}">{{item.answer.total}}个回答</view> |
|||
<view class="ques-num" wx:if="{{item.answer.total==0}}">暂无回答</view> |
|||
</view> |
|||
<!-- <view class="item-ques"> |
|||
<image class="item-icon" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/ask/ans.png" mode="widthFix"></image> |
|||
<view class="ans">{{item.answer && item.answer.lastest_answer?item.answer.lastest_answer.answer:"暂无回答"}}</view> |
|||
</view> |
|||
<view class="ques-tip"> |
|||
<view class="ques-time">{{item.created_time}}提问</view> --> |
|||
<!-- <view class="ans-number">全部{{item.answer && item.answer.total ? item.answer.total : 0}}个回答 <text class="iconfont icon-you"></text> </view> --> |
|||
<!-- </view> --> |
|||
</navigator> |
|||
<navigator style="border-top:1rpx solid #ccc" url="/pages/ask/index?id={{info.id}}" class="more-comment-btn">查看全部问答<text class="iconfont icon-you"></text></navigator> |
|||
</view> |
|||
</view> |
|||
<view class="box"> |
|||
<view class="box-top"> |
|||
<text class="iconfont icon-tiwen"></text><text>游客点评</text><text class="score" wx:if="{{info && commentTotal>0}}">{{info.rate}}分</text> |
|||
<text class="all-comment-num">共{{commentTotal}}条</text> |
|||
</view> |
|||
<view class="empty-box" wx:if="{{!comment || comment.length==0}}"> |
|||
<view>这里空空如也，快去点评吧!</view> |
|||
<!-- <navigator url="/pages/ask/index?id={{id}}" class="empty-btn">去点评</navigator> --> |
|||
</view> |
|||
<navigator wx:for="{{comment}}" url="/pages/list/comments/index?id={{info.id}}" class="product-comment"> |
|||
<view class="product-comment-top"> |
|||
<image src="{{item.user.avatar}}" mode="aspectFill"></image> |
|||
<view class="comment-info"> |
|||
<view class="nickname">{{item.user.nickname}}</view> |
|||
<view class="iconfont"><text wx:for="{{item.rate}}" class="icon-xingxing"></text><text wx:for="{{5 - item.rate}}" style="color:#999" class="icon-xingxing"></text></view> |
|||
</view> |
|||
<view class="comment-date">{{item.create_time}}</view> |
|||
</view> |
|||
<view class="comment-content">{{item.content}}</view> |
|||
</navigator> |
|||
<navigator url="/pages/list/comments/index?sceneid={{id}}" wx:if="{{comment.length>0}}" class="more-comment-btn">查看全部点评<text class="iconfont icon-you"></text></navigator> |
|||
</view> |
|||
<view style="height:{{safeBottom}}px"></view> |
|||
<notice bookingInfo="{{bookingInfo}}" skuName="{{bookingInfoTitle}}" wx:if="{{bookingInfo}}" bind:close="closeMask"></notice> |
|||
@ -0,0 +1,323 @@ |
|||
/* pages/info/sceneProductInfo/index.wxss */ |
|||
page { |
|||
background: #f2f2f2; |
|||
} |
|||
.swiper { |
|||
width: 100%; |
|||
height: 400rpx; |
|||
} |
|||
.swiper image { |
|||
height: 400rpx; |
|||
display: block; |
|||
width: 100%; |
|||
} |
|||
.top-info { |
|||
border-radius: 20rpx 20rpx 0 0; |
|||
background: white; |
|||
position: relative; |
|||
z-index: 1; |
|||
margin-top: -20rpx; |
|||
padding: 20rpx 40rpx; |
|||
} |
|||
.top-info .title { |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
color: #000; |
|||
} |
|||
.tags-box { |
|||
margin-top: 10rpx; |
|||
margin-bottom: 20rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
color: #0B898E; |
|||
font-size: 27rpx; |
|||
height: 50rpx; |
|||
} |
|||
.tags-box .tag { |
|||
position: relative; |
|||
line-height: 20rpx; |
|||
font-size: 20rpx; |
|||
font-weight: 500; |
|||
line-height: 50rpx; |
|||
margin-right: 10rpx; |
|||
} |
|||
.tags-box .tag .line { |
|||
content: "1"; |
|||
display: block; |
|||
font-size: 0; |
|||
position: absolute; |
|||
left: 0; |
|||
right: 0; |
|||
background: #DAF3E9; |
|||
height: 8rpx; |
|||
top: 30rpx; |
|||
z-index: -1; |
|||
} |
|||
.tags-text { |
|||
flex: 1; |
|||
text-align: right; |
|||
} |
|||
.tags-box .iconfont { |
|||
margin-left: 4rpx; |
|||
font-size: 24rpx; |
|||
} |
|||
.address-box { |
|||
justify-content: space-between; |
|||
margin-top: 0; |
|||
} |
|||
.info-address { |
|||
color: #666; |
|||
font-size: 27rpx; |
|||
margin-bottom: 0rpx; |
|||
line-height: 40rpx; |
|||
} |
|||
.address-box .iconfont { |
|||
font-size: 34rpx; |
|||
} |
|||
.box { |
|||
margin: 20rpx; |
|||
background: white; |
|||
border-radius: 13rpx; |
|||
} |
|||
.box-top { |
|||
line-height: 95rpx; |
|||
border-bottom: 1rpx solid #d9d9d9; |
|||
font-weight: 500; |
|||
color: #000; |
|||
font-size: 35rpx; |
|||
padding: 0 20rpx; |
|||
} |
|||
.product-item { |
|||
margin: 0 20rpx; |
|||
padding: 27rpx 0; |
|||
border-bottom: 1rpx solid #ccc; |
|||
} |
|||
.skutitle { |
|||
font-size: 29rpx; |
|||
color: #333; |
|||
font-weight: 500; |
|||
} |
|||
.product-box { |
|||
display: flex; |
|||
align-items: flex-end; |
|||
justify-content: space-between; |
|||
margin-top: 20rpx; |
|||
} |
|||
.product-left { |
|||
flex: 1; |
|||
} |
|||
.product-tags { |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.product-tag { |
|||
font-size: 20rpx; |
|||
color: #0B898E; |
|||
border-radius: 16rpx; |
|||
line-height: 30rpx; |
|||
border: 1rpx solid; |
|||
padding: 0 15rpx; |
|||
margin-right: 13rpx; |
|||
} |
|||
.product-tags .product-tags:last-child { |
|||
margin-right: 0; |
|||
} |
|||
.order-tip-text { |
|||
margin-top: 33rpx; |
|||
font-size: 24rpx; |
|||
color: #666; |
|||
} |
|||
.product-right { |
|||
text-align: center; |
|||
flex-shrink: 0; |
|||
} |
|||
.product-right .price { |
|||
color: #D62828; |
|||
font-size: 24rpx; |
|||
margin-bottom: 20rpx; |
|||
} |
|||
.product-right .price text:nth-child(2){ |
|||
font-weight: 500; |
|||
font-size: 33rpx; |
|||
} |
|||
.product-right .price text:nth-child(3){ |
|||
color: #8D8D8D; |
|||
font-size: 20rpx; |
|||
} |
|||
.product-right .btn { |
|||
background: #D62828; |
|||
color: #fff; |
|||
border-radius: 30px; |
|||
line-height: 60rpx; |
|||
font-size: 29rpx; |
|||
font-weight: 500; |
|||
width: 176rpx; |
|||
} |
|||
.box .product-item:last-child { |
|||
border-bottom: none; |
|||
} |
|||
.box-top .iconfont { |
|||
color: #0B898E; |
|||
font-size: 33rpx; |
|||
margin-right: 16rpx; |
|||
} |
|||
.empty-box { |
|||
text-align: center; |
|||
padding: 40rpx 0; |
|||
font-size: 23rpx; |
|||
color: #333; |
|||
} |
|||
.empty-btn { |
|||
margin: 0 auto; |
|||
margin-top: 30rpx; |
|||
width: 283rpx; |
|||
line-height: 79rpx; |
|||
border: 1rpx solid #0B898E; |
|||
border-radius: 39rpx; |
|||
color: #0B898E; |
|||
font-size: 32rpx; |
|||
margin-bottom: 10rpx; |
|||
} |
|||
.box-top .score { |
|||
color: #D62828; |
|||
font-size: 30rpx; |
|||
font-weight: 400; |
|||
margin-left: 11rpx; |
|||
} |
|||
.product-comment { |
|||
margin: 0 20rpx; |
|||
border-bottom: 1rpx solid #ccc; |
|||
padding: 33rpx 0; |
|||
} |
|||
.product-comment-top { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
color: #999999; |
|||
align-items: center; |
|||
font-size: 24rpx; |
|||
} |
|||
.product-comment-top image { |
|||
flex-shrink: 0; |
|||
width: 57rpx; |
|||
height: 57rpx; |
|||
border-radius: 50%; |
|||
} |
|||
.product-comment-top .comment-info { |
|||
flex: 1; |
|||
margin: 0 15rpx; |
|||
color: #666; |
|||
font-size: 21rpx; |
|||
} |
|||
.product-comment-top .comment-info .iconfont { |
|||
color: #D62828; |
|||
font-size: 22rpx; |
|||
} |
|||
.product-comment-top .comment-info .iconfont text { |
|||
margin-right: 6rpx; |
|||
} |
|||
.comment-content { |
|||
margin-left: 72rpx; |
|||
margin-top: 36rpx; |
|||
font-size: 28rpx; |
|||
color: #000; |
|||
} |
|||
.more-comment-btn { |
|||
line-height: 93rpx; |
|||
margin-right: 20rpx; |
|||
text-align: right; |
|||
color: #999; |
|||
font-size: 27rpx; |
|||
font-weight: 500; |
|||
} |
|||
.more-comment-btn .iconfont { |
|||
margin-left: 6rpx; |
|||
font-size: 24rpx; |
|||
} |
|||
.all-comment-num { |
|||
float: right; |
|||
color: #999999; |
|||
font-size: 27rpx; |
|||
font-weight: 400; |
|||
} |
|||
.ask-list .ask-item:nth-child(1) { |
|||
margin-top: 40rpx; |
|||
} |
|||
.ask-item { |
|||
padding: 0 25rpx; |
|||
margin-bottom: 40rpx; |
|||
} |
|||
.item-ques { |
|||
display: flex; |
|||
color: #000; |
|||
align-items: center; |
|||
font-size: 29rpx; |
|||
line-height: 38rpx; |
|||
} |
|||
.item-ques image { |
|||
width: 36rpx; |
|||
margin-right: 18rpx; |
|||
flex-shrink: 0; |
|||
} |
|||
.item-ques .ques { |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
flex: 1; |
|||
} |
|||
.ques-tip { |
|||
margin-left: 54rpx; |
|||
color: #999999; |
|||
font-size: 24rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
} |
|||
.ans-number { |
|||
color: #0B898E; |
|||
font-size: 28rpx; |
|||
} |
|||
.ans-number .iconfont { |
|||
font-size: 28rpx; |
|||
} |
|||
.icon-xin,.icon-shoucang { |
|||
position: absolute; |
|||
right: 20rpx; |
|||
margin-top: 20rpx; |
|||
width: 60rpx; |
|||
line-height: 60rpx; |
|||
background: rgba(0, 0, 0, 0.4); |
|||
border-radius: 50%; |
|||
text-align: center; |
|||
color: #fff; |
|||
font-size: 36rpx; |
|||
z-index: 1; |
|||
} |
|||
.icon-shoucang { |
|||
color: #D62828; |
|||
} |
|||
.ques-num { |
|||
flex-shrink: 0; |
|||
margin-left: 10rpx; |
|||
font-size: 29rpx; |
|||
color: #999; |
|||
font-weight: 400; |
|||
} |
|||
.audio-box { |
|||
display: flex; |
|||
align-items: center; |
|||
position: absolute; |
|||
left: 0; |
|||
height: 64rpx; |
|||
background: rgba(0, 0, 0, 0.4); |
|||
color: #fafafa; |
|||
width: 211rpx; |
|||
justify-content: center; |
|||
border-radius: 0 32rpx 32rpx 0; |
|||
margin-top: 282rpx; |
|||
font-size: 31rpx; |
|||
z-index: 1; |
|||
} |
|||
.audio-box image { |
|||
width: 45rpx; |
|||
display: block; |
|||
margin-left: 10rpx; |
|||
} |
|||
@ -0,0 +1,89 @@ |
|||
// pages/info/showInfo/index.js
|
|||
import commonApi from "../../../utils/https/common" |
|||
let app = getApp() |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
info:null |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
commonApi.user_post('product/get_product_detail',{ |
|||
id:options.id |
|||
}).then(res=>{ |
|||
res.data.display_tags = (res.data.display_tags?res.data.display_tags.split(","):[]).splice(0,2); |
|||
this.setData({ |
|||
info:res.data |
|||
}) |
|||
}) |
|||
}, |
|||
order:function(){ |
|||
if(this.data.info.sku.length==0){ |
|||
wx.showToast({ |
|||
title: '该演出暂时无法预约', |
|||
icon:'none' |
|||
}) |
|||
return; |
|||
} |
|||
app.globalData.couponInfo = null; |
|||
app.globalData.product = this.data.info; |
|||
wx.navigateTo({ |
|||
url: '/pages/order/show/index?id='+this.data.id, |
|||
}) |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,5 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"title":"/pages/component/TitleHeader" |
|||
} |
|||
} |
|||
@ -0,0 +1,31 @@ |
|||
<!--pages/info/showInfo/index.wxml--> |
|||
<wxs src="../../../utils/filter.wxs" module="tool" /> |
|||
<title title="产品详情"></title> |
|||
<view wx:if="{{info}}"> |
|||
<swiper class="swiper" indicator-dots="{{true}}" |
|||
autoplay="{{true}}" interval="{{2000}}" duration="{{300}}"> |
|||
<block wx:for="{{info.listimg}}" wx:key="*this"> |
|||
<swiper-item> |
|||
<image src="{{item}}" mode="aspectFill"></image> |
|||
</swiper-item> |
|||
</block> |
|||
</swiper> |
|||
<view class="top-box"> |
|||
<view class="title">{{info.title}}</view> |
|||
<view class="tags"> |
|||
<view class="tag" wx:for="{{info.display_tags}}">{{item}}</view> |
|||
</view> |
|||
<view class="time">演出时间：<text wx:for="{{info.sku[0].sku_model.next_show_date}}">{{item}}</text></view> |
|||
<view class="show-location">{{info.scene_name}}</view> |
|||
<view class="show-address"><text class="iconfont icon-location"></text>{{info.scene_address}}</view> |
|||
</view> |
|||
</view> |
|||
<view class="all-title">演出详情</view> |
|||
<rich-text wx:if="{{info}}" class="detail" nodes="{{tool.formateRichText(info.content)}}"></rich-text> |
|||
<view class="all-title">预定须知</view> |
|||
<!-- <rich-text class="detail"></rich-text> --> |
|||
<rich-text wx:if="{{info}}" class="detail" nodes="{{tool.formateRichText(info.book_info)}}"></rich-text> |
|||
<view style="height:120rpx"></view> |
|||
<view class="fixed-bottom"> |
|||
<view class="btn" bindtap="order">立即预约</view> |
|||
</view> |
|||
@ -0,0 +1,83 @@ |
|||
/* pages/info/showInfo/index.wxss */ |
|||
page { |
|||
background: #f6f6f6; |
|||
} |
|||
.swiper,.swiper image { |
|||
display: block; |
|||
width: 100%; |
|||
height: 330rpx; |
|||
} |
|||
.top-box { |
|||
border-bottom: 1rpx solid #ccc; |
|||
padding: 22rpx 27rpx; |
|||
} |
|||
.top-box .title { |
|||
font-size: 32rpx; |
|||
color: #000; |
|||
font-weight: 500; |
|||
margin-bottom: 10rpx; |
|||
} |
|||
.top-box .tags { |
|||
display: flex; |
|||
color: #0B898E; |
|||
font-size: 20rpx; |
|||
margin-bottom: 20rpx; |
|||
} |
|||
.top-box .tag { |
|||
margin-right: 20rpx; |
|||
padding: 0 15rpx; |
|||
line-height: 30rpx; |
|||
border-radius: 16rpx; |
|||
border: 1rpx solid; |
|||
} |
|||
.top-box .time { |
|||
font-size: 27rpx; |
|||
color: #333; |
|||
padding-bottom: 20rpx; |
|||
border-bottom: 1rpx solid #ccc; |
|||
} |
|||
.show-location { |
|||
margin: 20rpx 0; |
|||
font-size: 28rpx; |
|||
color: #666; |
|||
} |
|||
.show-address { |
|||
color: #999999; |
|||
font-size: 24rpx; |
|||
margin-bottom: 10rpx; |
|||
} |
|||
.show-location .iconfont { |
|||
font-size: 26rpx; |
|||
margin-right: 10rpx; |
|||
} |
|||
.all-title { |
|||
margin: 27rpx; |
|||
font-weight: 500; |
|||
font-size: 35rpx; |
|||
} |
|||
.detail { |
|||
padding: 0 27rpx; |
|||
display: block; |
|||
} |
|||
.fixed-bottom { |
|||
position: fixed; |
|||
left: 0; |
|||
right: 0; |
|||
height: 104rpx; |
|||
background: #FFFFFF; |
|||
box-shadow: -1rpx 1rpx 16rpx 0px rgba(6, 0, 1, 0.1); |
|||
text-align: center; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
bottom: 0; |
|||
} |
|||
.fixed-bottom .btn { |
|||
width: 391rpx; |
|||
line-height: 74rpx; |
|||
background: #D62828; |
|||
border-radius: 37rpx; |
|||
color: #fff; |
|||
font-size: 31rpx; |
|||
font-weight: 500; |
|||
} |
|||
@ -0,0 +1,99 @@ |
|||
// pages/info/strategyInfo/index.js
|
|||
import commonApi from "../../../utils/https/common" |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
info:null |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
commonApi.user_post("travels/getDetail",{ |
|||
id:options.id |
|||
}).then(res=>{ |
|||
res.data.img = res.data.img?res.data.img.split(","):[] |
|||
this.setData({ |
|||
info:res.data |
|||
}) |
|||
console.log(res) |
|||
}) |
|||
commonApi._post("travels/addView",{ |
|||
id:options.id |
|||
}).then(res=>{ |
|||
|
|||
}) |
|||
}, |
|||
setLike:function(){ |
|||
commonApi.user_post("travels/like",{ |
|||
id:this.data.info.id |
|||
}).then(res=>{ |
|||
if(res.code==1){ |
|||
let info = this.data.info; |
|||
info.is_like = res.data.is_like; |
|||
if(info.is_like==1) { |
|||
info.like_number++ |
|||
} |
|||
else { |
|||
info.like_number-- |
|||
} |
|||
this.setData({ |
|||
info:info |
|||
}) |
|||
} |
|||
}) |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,5 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"title":"/pages/component/TitleHeader" |
|||
} |
|||
} |
|||
@ -0,0 +1,29 @@ |
|||
<!--pages/info/strategyInfo/index.wxml--> |
|||
<wxs src="../../../utils/filter.wxs" module="filter" /> |
|||
<title title="游记攻略"></title> |
|||
<view wx:if="{{info}}"> |
|||
<swiper class="swiper" indicator-dots="{{true}}" |
|||
autoplay="{{true}}" interval="{{2000}}" duration="{{300}}" wx:if="{{info.img}}"> |
|||
<block wx:for="{{info.img}}" wx:key="*this"> |
|||
<swiper-item> |
|||
<image src="{{item}}" mode="aspectFill"></image> |
|||
</swiper-item> |
|||
</block> |
|||
</swiper> |
|||
<!-- <image src="{{info.headimg}}" mode="widthFix" style="width:100%;display:block"></image> --> |
|||
<view class="content"> |
|||
<view class="title">{{info.title}}</view> |
|||
<view class="author-info"> |
|||
<image src="{{info.avatar}}" mode="aspectFill"></image> |
|||
<view class="username">{{info.nickname}}</view> |
|||
</view> |
|||
<rich-text nodes="{{filter.formateRichText(info.detail)}}"></rich-text> |
|||
<view class="icons"> |
|||
<text class="iconfont icon-aixin{{info.is_like==1?'1':''}}" bindtap="setLike"></text> |
|||
<text class="icon-num">{{info.like_number}}</text> |
|||
<text class="iconfont icon-eye"></text> |
|||
<text class="icon-num">{{info.view_number}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
@ -0,0 +1,45 @@ |
|||
/* pages/info/strategyInfo/index.wxss */ |
|||
.content { |
|||
position: relative; |
|||
z-index: 1; |
|||
border-radius: 20rpx 20rpx 0 0; |
|||
background: white; |
|||
margin-top: -20rpx; |
|||
padding: 35rpx; |
|||
} |
|||
.title { |
|||
font-size: 36rpx; |
|||
font-weight: 500; |
|||
color: #000; |
|||
} |
|||
.author-info { |
|||
display: flex; |
|||
align-items: center; |
|||
font-size: 23rpx; |
|||
color: #999; |
|||
margin-bottom: 45rpx; |
|||
margin-top: 10rpx; |
|||
} |
|||
.author-info image { |
|||
width: 32rpx; |
|||
height: 32rpx; |
|||
border-radius: 50%; |
|||
margin-right: 10rpx; |
|||
} |
|||
.swiper,.swiper image { |
|||
width: 100%; |
|||
display: block; |
|||
height: 340rpx; |
|||
} |
|||
.icons { |
|||
text-align: right; |
|||
color: #666666; |
|||
font-size: 28rpx; |
|||
} |
|||
.icons .iconfont { |
|||
margin-left: 35rpx; |
|||
margin-right: 7rpx; |
|||
} |
|||
.icons .icon-aixin1 { |
|||
color: #d02324; |
|||
} |
|||
@ -0,0 +1,99 @@ |
|||
// pages/list/comments/index.js
|
|||
import commonApi from "../../../utils/https/common" |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
productid:null, |
|||
sceneid:null, |
|||
list:[], |
|||
total:1 |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad: function (options) { |
|||
if(options.productid){ |
|||
this.setData({ |
|||
productid:options.productid |
|||
}) |
|||
} |
|||
else if(options.sceneid){ |
|||
this.setData({ |
|||
sceneid:options.sceneid |
|||
}) |
|||
} |
|||
this.getList() |
|||
}, |
|||
getList:function(){ |
|||
let service="product/product_comment_list",list = this.data.list,data = { |
|||
offset:list.length, |
|||
limit:10, |
|||
product_id:this.data.productid, |
|||
scene_id:this.data.sceneid |
|||
} |
|||
if(this.data.total<=list.length) return; |
|||
if(this.data.sceneid){ |
|||
service = "scene/get_comment" |
|||
} |
|||
commonApi._post(service,data).then(res=>{ |
|||
console.log(res) |
|||
this.setData({ |
|||
total:res.data.total, |
|||
list:list.concat(res.data.list) |
|||
}) |
|||
}) |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh: function () { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom: function () { |
|||
this.getList(); |
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage: function () { |
|||
|
|||
} |
|||
}) |
|||
@ -0,0 +1,5 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"title":"/pages/component/TitleHeader" |
|||
} |
|||
} |
|||
@ -0,0 +1,17 @@ |
|||
<!--pages/list/comments/index.wxml--> |
|||
<title title="评论"></title> |
|||
<view class="comment-title">全部评论</view> |
|||
<view class="comment-item" wx:for="{{list}}"> |
|||
<view class="comment-top"> |
|||
<image src="{{item.user.avatar}}" mode="aspectFill"></image> |
|||
<view class="author-info"> |
|||
<view class="author-name">{{item.user.nickname}}</view> |
|||
<view class="author-time">{{item.create_time}}</view> |
|||
</view> |
|||
</view> |
|||
<view class="comment-detail">{{item.content}}</view> |
|||
</view> |
|||
<view wx:if="{{list.length==0}}" class="common-empty" style="z-index:-1"> |
|||
<image mode="widthFix" src="https://fastadmin.oss-cn-shenzhen.aliyuncs.com/xcxImages/other/nodata.png"></image> |
|||
<view>暂无内容</view> |
|||
</view> |
|||
Some files were not shown because too many files changed in this diff
Loading…
Reference in new issue