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 @@ @@ -40,7 +40,8 @@
40 "pages/customer/cancel", 40 "pages/customer/cancel",
41 "pages/customer/welcome", 41 "pages/customer/welcome",
42 "pages/taocan/index", 42 "pages/taocan/index",
43 - "pages/taocan/order" 43 + "pages/taocan/order",
  44 + "pages/taocan/orderHis"
44 ], 45 ],
45 "subpackages": [ 46 "subpackages": [
46 { 47 {
@@ -41,7 +41,7 @@ @@ -41,7 +41,7 @@
41 url="/pages/taocan/order?id={{order.id}}"> 41 url="/pages/taocan/order?id={{order.id}}">
42 <subject order="{{order}}" hasTopStatus> 42 <subject order="{{order}}" hasTopStatus>
43 <view class="view flex justify-end margin-top"> 43 <view class="view flex justify-end margin-top">
44 - <view class="solid txt-26-h text-blue">到店使用</view> 44 + <view class="txt-26-h text-blue subject-button flex justify-center align-center">到店使用</view>
45 </view> 45 </view>
46 </subject> 46 </subject>
47 </navigator> 47 </navigator>
@@ -111,4 +111,9 @@ @@ -111,4 +111,9 @@
111 .transverse-list .seller{ 111 .transverse-list .seller{
112 width: 98%; 112 width: 98%;
113 margin: 0 auto; 113 margin: 0 auto;
  114 +}
  115 +.subject-button{
  116 + width: 158rpx;
  117 + height: 52rpx;
  118 + border: 2rpx solid #42A5FF;
114 } 119 }
@@ -59,13 +59,15 @@ @@ -59,13 +59,15 @@
59 <view class="text-gray txt-28-h">实际付款</view> 59 <view class="text-gray txt-28-h">实际付款</view>
60 <view class="txt-28-h">¥888.00</view> 60 <view class="txt-28-h">¥888.00</view>
61 </view> 61 </view>
62 - <view class="view padding-bottom padding-lr-lg flex justify-between">  
63 - <view class="text-gray txt-28-h">交易快照</view>  
64 - <view class="view txt-28-h flex-treble flex align-center justify-end">  
65 - <view class="padding-right-sm">发生交易纠纷时，可作为判断依据</view>  
66 - <view class="more"></view> 62 + <navigator url="/pages/taocan/orderHis?id={{order.id}}">
  63 + <view class="view padding-bottom padding-lr-lg flex justify-between">
  64 + <view class="text-gray txt-28-h">交易快照</view>
  65 + <view class="view txt-28-h flex-treble flex align-center justify-end">
  66 + <view class="padding-right-sm">发生交易纠纷时，可作为判断依据</view>
  67 + <view class="more"></view>
  68 + </view>
67 </view> 69 </view>
68 - </view> 70 + </navigator>
69 <view class="view padding-bottom padding-lr-lg flex justify-between"> 71 <view class="view padding-bottom padding-lr-lg flex justify-between">
70 <view class="text-gray txt-28-h">订单编号</view> 72 <view class="text-gray txt-28-h">订单编号</view>
71 <view class="txt-28-h">¥888.00</view> 73 <view class="txt-28-h">¥888.00</view>
  1 +// pages/taocan/orderHis.js
  2 +Page({
  3 +
  4 + /**
  5 + * 页面的初始数据
  6 + */
  7 + data: {
  8 +
  9 + },
  10 +
  11 + /**
  12 + * 生命周期函数--监听页面加载
  13 + */
  14 + onLoad: function (options) {
  15 +
  16 + },
  17 +
  18 + /**
  19 + * 生命周期函数--监听页面初次渲染完成
  20 + */
  21 + onReady: function () {
  22 +
  23 + },
  24 +
  25 + /**
  26 + * 生命周期函数--监听页面显示
  27 + */
  28 + onShow: function () {
  29 +
  30 + },
  31 +
  32 + /**
  33 + * 生命周期函数--监听页面隐藏
  34 + */
  35 + onHide: function () {
  36 +
  37 + },
  38 +
  39 + /**
  40 + * 生命周期函数--监听页面卸载
  41 + */
  42 + onUnload: function () {
  43 +
  44 + },
  45 +
  46 + /**
  47 + * 页面相关事件处理函数--监听用户下拉动作
  48 + */
  49 + onPullDownRefresh: function () {
  50 +
  51 + },
  52 +
  53 + /**
  54 + * 页面上拉触底事件的处理函数
  55 + */
  56 + onReachBottom: function () {
  57 +
  58 + },
  59 +
  60 + /**
  61 + * 用户点击右上角分享
  62 + */
  63 + onShareAppMessage: function () {
  64 +
  65 + },
  66 + toggleRule(){
  67 + this.setData({
  68 + hasShowRule:!this.data.hasShowRule,
  69 + })
  70 + }
  71 +})
  1 +{
  2 + "usingComponents": {
  3 + "nav":"/components/nav/nav"
  4 + }
  5 +}
  1 +<!--pages/taocan/orderHis.wxml-->
  2 +<nav hasHome>套餐详情</nav>
  3 +<view class="text-orange txt-28-h padding-lr-lg tips">发生交易纠纷时，此页面可作为判断依据。</view>
  4 +<view class="view" style="padding-bottom: 150rpx;">
  5 + <view class="view box margin-lr margin-top-lg margin-bottom-sm padding">
  6 + <view class="view txt-40-h text-bold">招牌花开富贵六十人餐</view>
  7 + <view class="view flex align-end">
  8 + <view class="text-orange txt-28-h" style="margin-bottom: 4rpx;">¥</view>
  9 + <view class="text-orange txt-44-h margin-right-sm text-bold">123</view>
  10 + <view class="huaxian flex align-end">
  11 + <view class="txt-20-h" style="margin-bottom: 8rpx;">¥</view>
  12 + <view class="txt-28-h" style="margin-bottom: 4rpx;">123</view>
  13 + </view>
  14 + <view class="view flex text-orange align-end margin-left-sm" >
  15 + <view class="view tag" style="margin-bottom: 16rpx;"></view>
  16 + <view class="view margin-left-xs txt-24-h" style="margin-bottom: 10rpx;">8折</view>
  17 + </view>
  18 + </view>
  19 + <view class="view flex align-center txt-28-h margin-bottom labels" style="margin-top: 10rpx;">
  20 + <view class="view margin-right flex align-center">
  21 + <view class="view icon icon1"></view>
  22 + <view class="view txt-28-h bg-white">包间可用</view>
  23 + </view>
  24 + <view class="view margin-right flex align-center">
  25 + <view class="view icon icon2"></view>
  26 + <view class="view txt-28-h bg-white">免预约</view>
  27 + </view>
  28 + <view class="view margin-right flex align-center">
  29 + <view class="view icon icon3"></view>
  30 + <view class="view txt-28-h bg-white">随时退</view>
  31 + </view>
  32 + </view>
  33 + <image src="" style="width:100%;background-color: #cccccc;border-radius: 10rpx;" mode="widthFix"></image>
  34 + </view>
  35 + <view class="view box margin-lr margin-top-sm margin-bottom-sm">
  36 + <view class="txt-30-h padding solid-bottom">购买须知</view>
  37 + <view class="view padding block">
  38 + <view class="flex align-center margin-bottom-sm">
  39 + <view class="dot"></view>
  40 + <view class="txt-30-h text-bold">有效期</view>
  41 + </view>
  42 + <view class="text-df">123123</view>
  43 + </view>
  44 + <view class="view padding block">
  45 + <view class="flex align-center margin-bottom-sm">
  46 + <view class="dot"></view>
  47 + <view class="txt-30-h text-bold">使用时间</view>
  48 + </view>
  49 + <view class="text-df">123123</view>
  50 + </view>
  51 + <view class="view padding block padding-bottom-sm">
  52 + <view class="flex align-center margin-bottom-sm">
  53 + <view class="dot"></view>
  54 + <view class="txt-30-h text-bold">使用规则</view>
  55 + </view>
  56 + <view class="text-df" wx:if="{{hasShowRule}}">
  57 + <text>123123</text>
  58 + </view>
  59 + <view class="flex justify-center align-center rule margin-top-sm margin-bottom-sm" bindtap="toggleRule">
  60 + <view class="txt-28-h">{{hasShowRule?'收起':'展开更多'}}</view>
  61 + <view class="view icon {{hasShowRule?'show':''}}"></view>
  62 + </view>
  63 + </view>
  64 + </view>
  65 +</view>
  1 +/* pages/taocan/orderHis.wxss */
  2 +@import "../../colorui/main.wxss";
  3 +.tips{
  4 + background: #FDF9F5;
  5 + padding-top: 12rpx;
  6 + padding-bottom: 12rpx;
  7 +}
  8 +.box{
  9 + background: #FFFFFF;
  10 + box-shadow: 0px 0px 30rpx 0px #E5E5E5;
  11 + border-radius: 20rpx;
  12 +}
  13 +.huaxian{
  14 + position: relative;
  15 +}
  16 +.huaxian:after{
  17 + position: absolute;
  18 + content: "";
  19 + width: 100%;
  20 + height: 2rpx;
  21 + background-color: #CCCCCC;
  22 + left:0rpx;
  23 + top:20rpx;
  24 +}
  25 +.tag{
  26 + width: 22rpx;
  27 + height: 22rpx;
  28 + background-image: url("http://nosqn.colorcun.com/taocan/1%20%281%29.png");
  29 +}
  30 +.labels .icon{
  31 + width: 24rpx;
  32 + height: 24rpx;
  33 + margin-right: 10rpx;
  34 +
  35 +}
  36 +.labels .icon1{
  37 + background-image: url("http://nosqn.colorcun.com/taocan/1%20%287%29.png");
  38 +}
  39 +.labels .icon2{
  40 + background-image: url("http://nosqn.colorcun.com/taocan/1%20%288%29.png");
  41 +}
  42 +.labels .icon3{
  43 + background-image: url("http://nosqn.colorcun.com/taocan/1%20%289%29.png");
  44 +}
  45 +.block .dot{
  46 + width: 8rpx;
  47 + height: 26rpx;
  48 + background: linear-gradient(180deg, #3BBFF5 0%, #57A0FF 100%);
  49 + margin-right: 20rpx;
  50 +}
  51 +.rule .icon{
  52 + width: 22rpx;
  53 + height: 12rpx;
  54 + margin-left: 20rpx;
  55 + background-image: url("http://nosqn.colorcun.com/taocan/1%20%285%29.png");
  56 +}
  57 +.rule .icon.show{
  58 + background-image: url("http://nosqn.colorcun.com/taocan/1%20%286%29.png");
  59 +}
@@ -732,6 +732,12 @@ @@ -732,6 +732,12 @@
732 "pathName": "pages/taocan/order", 732 "pathName": "pages/taocan/order",
733 "query": "id=1", 733 "query": "id=1",
734 "scene": null 734 "scene": null
  735 + },
  736 + {
  737 + "name": "pages/taocan/orderHis",
  738 + "pathName": "pages/taocan/orderHis",
  739 + "query": "id=1",
  740 + "scene": null
735 } 741 }
736 ] 742 ]
737 } 743 }