xt / xcx-book · Commits

Go to a project

Commit 4bcdf52ffa86ab8e0976bfd544832c190ef6d3cc

Authored by vking
1 parent c5ba3518
build: skipped

taocan

Inline Side-by-side
Showing 8 changed files with 206 additions and 4 deletions
... ... @@ -38,7 +38,8 @@
"pages/reserve/remark",
"pages/reserve/findSeller",
"pages/customer/cancel",
"pages/customer/welcome"
"pages/customer/welcome",
"pages/taocan/index"
],
"subpackages": [
{
... ...
... ... @@ -4,7 +4,7 @@ Component({
* 组件的属性列表
*/
properties: {
detail:Object,//套餐
},
/**
... ...
... ... @@ -10,7 +10,7 @@
</view>
<view class="view flex align-end text-gray">
<view class="text-orange txt-28-h" style="margin-bottom: 4rpx;">¥</view>
<view class="text-orange txt-40-h margin-right-sm">123</view>
<view class="text-orange txt-40-h margin-right-sm text-bold">123</view>
<view class="huaxian flex align-end">
<view class="txt-20-h" style="margin-bottom: 8rpx;">¥</view>
<view class="txt-28-h" style="margin-bottom: 4rpx;">123</view>
... ... @@ -21,5 +21,7 @@
<view class="view margin-left-xs txt-24-h">8折</view>
</view>
</view>
<view class="button bg-blue-blue txt-28-h text-bold flex align-center justify-center">抢购</view>
<navigator url="/pages/taocan/index?sid={{detail.sid}}&pid={{detail.id}}" hover-class="navigator-hover">
<view class="button bg-blue-blue txt-28-h text-bold flex align-center justify-center">抢购</view>
</navigator>
</view>
... ...
// pages/taocan/index.js
import util from '../../utils/util';
import App from '../../utils/api';
Page({
/**
* 页面的初始数据
*/
data: {
current:0,
activityId:1,
packs:[
{id:1,},
{id:2,},
{id:3,},
{id:4,},
{id:5,},
],
},
/**
* 生命周期函数--监听页面加载
* sid 商家id
* pid 套餐id
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
},
touchTab(e){
let obj={
activityId:util.attr(e,'id'),
}
let index=util.attr(e,'index')
let length=this.data.packs.length;
let current=0
if(index>length-3){
current=length-3;
}else{
current=index>0?(index-1):0
}
obj.current=current
this.setData(obj)
},
swiperChange(e){
console.log(e)
if(e.detail.source!='touch') return;
this.setData({
current:e.detail.current
})
},
})
\ No newline at end of file
... ...
{
"usingComponents": {
"nav":"/components/nav/nav"
}
}
\ No newline at end of file
... ...
<!--pages/taocan/index.wxml-->
<nav hasHome>套餐详情</nav>
<view class="view">
<swiper
display-multiple-items="3"
class="view margin-left-lg"
bindchange="swiperChange"
current="{{current}}"
style="height: 80rpx;">
<block wx:for="{{packs}}" wx:key="*this">
<swiper-item
bindtap="touchTab" data-id="{{item.id}}" data-index="{{index}}"
class="swiper-item {{activityId==item.id?'active':''}} flex align-center">
<view class="txt-28-h">招牌六十人餐</view>
</swiper-item>
</block>
</swiper>
<view class="view box margin-lr margin-top-lg margin-bottom-sm padding">
<view class="view txt-40-h text-bold">招牌花开富贵六十人餐</view>
<view class="view flex align-end">
<view class="text-orange txt-28-h" style="margin-bottom: 4rpx;">¥</view>
<view class="text-orange txt-40-h margin-right-sm text-bold">123</view>
<view class="huaxian flex align-end">
<view class="txt-20-h" style="margin-bottom: 8rpx;">¥</view>
<view class="txt-28-h" style="margin-bottom: 4rpx;">123</view>
</view>
<view class="view flex text-orange align-end margin-left-sm" >
<view class="view tag" style="margin-bottom: 16rpx;"></view>
<view class="view margin-left-xs txt-24-h" style="margin-bottom: 10rpx;">8折</view>
</view>
</view>
<view class="view flex align-center txt-28-h margin-bottom" style="margin-top: 10rpx;">
<view class="view margin-right">
<view class="icon"></view>
<view>1111</view>
</view>
<view class="view margin-right">
<view class="icon"></view>
<view>1111</view>
</view>
<view class="view margin-right">
<view class="icon"></view>
<view>1111</view>
</view>
</view>
<image src="" style="width:100%;" mode="widthFix"></image>
</view>
</view>
... ...
/* pages/taocan/index.wxss */
@import "../../colorui/main.wxss";
.swiper-item{
position: relative;
}
.swiper-item.active:after{
position: absolute;
bottom: 4rpx;
width: 60rpx;
height: 6rpx;
background: linear-gradient(90deg, #3BBFF5 0%, #57A0FF 100%);
border-radius: 3rpx;
content: "";
left:calc(50% - 60rpx);
}
.swiper-item.active .txt-28-h{
font-weight: bold;
}
.box{
background: #FFFFFF;
box-shadow: 0px 0px 30rpx 0px #E5E5E5;
border-radius: 20rpx;
}
.huaxian{
position: relative;
}
.huaxian:after{
position: absolute;
content: "";
width: 100%;
height: 2rpx;
background-color: #CCCCCC;
left:0rpx;
top:20rpx;
}
.tag{
width: 22rpx;
height: 22rpx;
background: #FF7A00;
}
\ No newline at end of file
... ...
... ... @@ -720,6 +720,12 @@
"pathName": "pack-book/pages/book/b_index",
"query": "seller_id=80&seller_openid=oGefL4qKBWIh5xwyg3LVfkMbDumA&manager_id=763&goPath=roomtype/roomtype",
"scene": null
},
{
"name": "pages/taocan/index",
"pathName": "pages/taocan/index",
"query": "sid=1&pid=1",
"scene": null
}
]
}
... ...