xt / xcx-book · Commits

Go to a project

Commit 4cc53365301ceb669181e97013ca1693e49c6162

Authored by vking
1 parent 6bd4c3b9
build: skipped

taocan

Inline Side-by-side
Showing 9 changed files with 222 additions and 8 deletions
... ... @@ -40,7 +40,8 @@
"pages/customer/cancel",
"pages/customer/welcome",
"pages/taocan/index",
"pages/taocan/order"
"pages/taocan/order",
"pages/taocan/orderHis"
],
"subpackages": [
{
... ...
... ... @@ -41,7 +41,7 @@
url="/pages/taocan/order?id={{order.id}}">
<subject order="{{order}}" hasTopStatus>
<view class="view flex justify-end margin-top">
<view class="solid txt-26-h text-blue">到店使用</view>
<view class="txt-26-h text-blue subject-button flex justify-center align-center">到店使用</view>
</view>
</subject>
</navigator>
... ...
... ... @@ -111,4 +111,9 @@
.transverse-list .seller{
width: 98%;
margin: 0 auto;
}
.subject-button{
width: 158rpx;
height: 52rpx;
border: 2rpx solid #42A5FF;
}
\ No newline at end of file
... ...
... ... @@ -59,13 +59,15 @@
<view class="text-gray txt-28-h">实际付款</view>
<view class="txt-28-h">¥888.00</view>
</view>
<view class="view padding-bottom padding-lr-lg flex justify-between">
<view class="text-gray txt-28-h">交易快照</view>
<view class="view txt-28-h flex-treble flex align-center justify-end">
<view class="padding-right-sm">发生交易纠纷时，可作为判断依据</view>
<view class="more"></view>
<navigator url="/pages/taocan/orderHis?id={{order.id}}">
<view class="view padding-bottom padding-lr-lg flex justify-between">
<view class="text-gray txt-28-h">交易快照</view>
<view class="view txt-28-h flex-treble flex align-center justify-end">
<view class="padding-right-sm">发生交易纠纷时，可作为判断依据</view>
<view class="more"></view>
</view>
</view>
</view>
</navigator>
<view class="view padding-bottom padding-lr-lg flex justify-between">
<view class="text-gray txt-28-h">订单编号</view>
<view class="txt-28-h">¥888.00</view>
... ...
// pages/taocan/orderHis.js
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
},
toggleRule(){
this.setData({
hasShowRule:!this.data.hasShowRule,
})
}
})
\ No newline at end of file
... ...
{
"usingComponents": {
"nav":"/components/nav/nav"
}
}
\ No newline at end of file
... ...
<!--pages/taocan/orderHis.wxml-->
<nav hasHome>套餐详情</nav>
<view class="text-orange txt-28-h padding-lr-lg tips">发生交易纠纷时，此页面可作为判断依据。</view>
<view class="view" style="padding-bottom: 150rpx;">
<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-44-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 labels" style="margin-top: 10rpx;">
<view class="view margin-right flex align-center">
<view class="view icon icon1"></view>
<view class="view txt-28-h bg-white">包间可用</view>
</view>
<view class="view margin-right flex align-center">
<view class="view icon icon2"></view>
<view class="view txt-28-h bg-white">免预约</view>
</view>
<view class="view margin-right flex align-center">
<view class="view icon icon3"></view>
<view class="view txt-28-h bg-white">随时退</view>
</view>
</view>
<image src="" style="width:100%;background-color: #cccccc;border-radius: 10rpx;" mode="widthFix"></image>
</view>
<view class="view box margin-lr margin-top-sm margin-bottom-sm">
<view class="txt-30-h padding solid-bottom">购买须知</view>
<view class="view padding block">
<view class="flex align-center margin-bottom-sm">
<view class="dot"></view>
<view class="txt-30-h text-bold">有效期</view>
</view>
<view class="text-df">123123</view>
</view>
<view class="view padding block">
<view class="flex align-center margin-bottom-sm">
<view class="dot"></view>
<view class="txt-30-h text-bold">使用时间</view>
</view>
<view class="text-df">123123</view>
</view>
<view class="view padding block padding-bottom-sm">
<view class="flex align-center margin-bottom-sm">
<view class="dot"></view>
<view class="txt-30-h text-bold">使用规则</view>
</view>
<view class="text-df" wx:if="{{hasShowRule}}">
<text>123123</text>
</view>
<view class="flex justify-center align-center rule margin-top-sm margin-bottom-sm" bindtap="toggleRule">
<view class="txt-28-h">{{hasShowRule?'收起':'展开更多'}}</view>
<view class="view icon {{hasShowRule?'show':''}}"></view>
</view>
</view>
</view>
</view>
... ...
/* pages/taocan/orderHis.wxss */
@import "../../colorui/main.wxss";
.tips{
background: #FDF9F5;
padding-top: 12rpx;
padding-bottom: 12rpx;
}
.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-image: url("http://nosqn.colorcun.com/taocan/1%20%281%29.png");
}
.labels .icon{
width: 24rpx;
height: 24rpx;
margin-right: 10rpx;
}
.labels .icon1{
background-image: url("http://nosqn.colorcun.com/taocan/1%20%287%29.png");
}
.labels .icon2{
background-image: url("http://nosqn.colorcun.com/taocan/1%20%288%29.png");
}
.labels .icon3{
background-image: url("http://nosqn.colorcun.com/taocan/1%20%289%29.png");
}
.block .dot{
width: 8rpx;
height: 26rpx;
background: linear-gradient(180deg, #3BBFF5 0%, #57A0FF 100%);
margin-right: 20rpx;
}
.rule .icon{
width: 22rpx;
height: 12rpx;
margin-left: 20rpx;
background-image: url("http://nosqn.colorcun.com/taocan/1%20%285%29.png");
}
.rule .icon.show{
background-image: url("http://nosqn.colorcun.com/taocan/1%20%286%29.png");
}
\ No newline at end of file
... ...
... ... @@ -732,6 +732,12 @@
"pathName": "pages/taocan/order",
"query": "id=1",
"scene": null
},
{
"name": "pages/taocan/orderHis",
"pathName": "pages/taocan/orderHis",
"query": "id=1",
"scene": null
}
]
}
... ...