From 1faed0f4b01ff18477f41668e5e56720f83bbc12 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=BD=87?= Date: Tue, 14 Jan 2025 05:13:23 +0800 Subject: [PATCH] tab3 --- app.json | 5 +- app.wxss | 12 ++ assets/icon/order/package@2x.png | Bin 0 -> 386 bytes assets/icon/order/right-arrow@2x.png | Bin 0 -> 670 bytes pages/order/detail-group/index.js | 72 ++++++++++++ pages/order/detail-group/index.json | 3 + pages/order/detail-group/index.wxml | 65 +++++++++++ pages/order/detail-group/index.wxss | 131 +++++++++++++++++++++ pages/order/detail/index.js | 66 +++++++++++ pages/order/detail/index.json | 4 + pages/order/detail/index.wxml | 87 ++++++++++++++ pages/order/detail/index.wxss | 165 +++++++++++++++++++++++++++ pages/order/index/index.js | 10 ++ pages/order/index/index.wxml | 53 ++++++++- pages/order/index/index.wxss | 131 +++++++++++++++++++++ pages/order/success/index.js | 66 +++++++++++ pages/order/success/index.json | 3 + pages/order/success/index.wxml | 9 ++ pages/order/success/index.wxss | 35 ++++++ 19 files changed, 915 insertions(+), 2 deletions(-) create mode 100644 assets/icon/order/package@2x.png create mode 100644 assets/icon/order/right-arrow@2x.png create mode 100644 pages/order/detail-group/index.js create mode 100644 pages/order/detail-group/index.json create mode 100644 pages/order/detail-group/index.wxml create mode 100644 pages/order/detail-group/index.wxss create mode 100644 pages/order/detail/index.js create mode 100644 pages/order/detail/index.json create mode 100644 pages/order/detail/index.wxml create mode 100644 pages/order/detail/index.wxss create mode 100644 pages/order/success/index.js create mode 100644 pages/order/success/index.json create mode 100644 pages/order/success/index.wxml create mode 100644 pages/order/success/index.wxss diff --git a/app.json b/app.json index 7f0361f..86f52f3 100644 --- a/app.json +++ b/app.json @@ -13,7 +13,10 @@ "pages/help/address/index/index", "pages/help/address/edit/index", "pages/shop/detail/index", - "pages/shop/success/index" + "pages/shop/success/index", + "pages/order/detail/index", + "pages/order/detail-group/index", + "pages/order/success/index" ], "window": { "navigationBarTextStyle": "black", diff --git a/app.wxss b/app.wxss index 8434d30..05ac232 100644 --- a/app.wxss +++ b/app.wxss @@ -138,6 +138,9 @@ page-container .content{ .spliter{ border-bottom: 1px solid rgba(153, 153, 153, 0.2); } +.spliter.dashed{ + border-bottom: 1px dashed rgba(153, 153, 153, 0.2); +} .money,.money-promation,.money-normal,.money-disable{ font-size: 36rpx; font-weight: 500; @@ -163,4 +166,13 @@ page-container .content{ text-decoration: line-through; font-size: 28rpx; font-weight:normal; +} + +.bottom-bar{ + border-radius: 24rpx 24rpx 0 0; + padding:24rpx 24rpx 84rpx; + position:fixed; + bottom:0; + left:0;right:0; + background-color: #fff; } \ No newline at end of file diff --git a/assets/icon/order/package@2x.png b/assets/icon/order/package@2x.png new file mode 100644 index 0000000000000000000000000000000000000000..b7222962603d5361c5a345452b002f7e195a1361 GIT binary patch literal 386 zcmV-|0e$|7P)Px#1am@3R0s$N2z&@+hyVZqEJ;K`R9J=Wm)&u~Fc5_IGAV!#;tntsgc8z1DhPBC zDo8qj4k&?8L6Qnk2e^aH1I~;jWa(tc&%=E)evqYG?O8u_1`OjeB-csu8NhvJ$Vx=s zqL>!IQzm9FA{(W@KzPnF4Xd0|`meN)-rrRk3b@1&0L=U6YQ#(S z=a``qW~hW2Dq)67n4uE?!B9{N$A&(B(a1N>Z=@>5cjzj{YtR9h`4!{Yue4Xjwm)pd g0ay-}uZA&_FJbA~&YX?l*#H0l07*qoM6N<$f_xXEnE(I) literal 0 HcmV?d00001 diff --git a/assets/icon/order/right-arrow@2x.png b/assets/icon/order/right-arrow@2x.png new file mode 100644 index 0000000000000000000000000000000000000000..5c9bd853cbf0546224328df3776ba86a2a019ae1 GIT binary patch literal 670 zcmV;P0%84$P)Px#1am@3R0s$N2z&@+hyVZrNJ&INR7i=v)k|v=Q53-O|4F9NA&V>q3gaUoGl{i@ zrmgk!_#G;!UAu583e}AtKoBh0cPWBPH{H3-47iCuMU~}(rktv91GLtr*?VZDq z^SF25KZguEY&04-fIF2+<@@2`;l*`;g<*%*+UM5VZ%LB8OYzBqKpD6xB9Bz{TF~OK zL)Ue`OifKK15Kc1t*wS(xZUY=>_ot`v$KmzrSefkmVu^-EcSZ6+n(p`CrM(i9RxTz zIq8?n<#oq#=7AYtNmYH{_xFyDj&h?TL4ecK)Bg1I^tP(b0r!Ci#+aJtdAoTl%>)7* zA0PiLl}ekXQt7hN7EtwleIn87<1S6{oSl+E)XC|5)%Z$ zhhDF@1l&te-}n9fENE^JpwsDC*L6QRjxz_$GMH(mO2-0WaAjQA-TVz*G{#g%Ez;QF zALs&u_AaPux7+Q0{a4PYr)^}ou6s*FW&uRR06&I(?_33|*XuK?x&efMvDU7}ar}N* z&e$yt!>|EtF=(X`k;hRKy&9D_R)s0HM_QSxu0&C^mL)g$44chnpsEL|8j@BP$MG7V zS@LtWGzfyGs_p=xi1bx;HA@@E0)rrE0vin8Q3E`Stvvt&5$OXf?RNX^IM_(AR;$&E#p1rI2IG&0fn1)UNEp3Byi#Q*>R07*qoM6N<$ Ef+vwX=l}o! literal 0 HcmV?d00001 diff --git a/pages/order/detail-group/index.js b/pages/order/detail-group/index.js new file mode 100644 index 0000000..a6bb092 --- /dev/null +++ b/pages/order/detail-group/index.js @@ -0,0 +1,72 @@ +// pages/order/detail-group/index.js +Page({ + + /** + * 页面的初始数据 + */ + data: { + + }, + + goToSuccess(){ + wx.navigateTo({ + url: '/pages/order/success/index', + }) + }, + + /** + * 生命周期函数--监听页面加载 + */ + onLoad(options) { + + }, + + /** + * 生命周期函数--监听页面初次渲染完成 + */ + onReady() { + + }, + + /** + * 生命周期函数--监听页面显示 + */ + onShow() { + + }, + + /** + * 生命周期函数--监听页面隐藏 + */ + onHide() { + + }, + + /** + * 生命周期函数--监听页面卸载 + */ + onUnload() { + + }, + + /** + * 页面相关事件处理函数--监听用户下拉动作 + */ + onPullDownRefresh() { + + }, + + /** + * 页面上拉触底事件的处理函数 + */ + onReachBottom() { + + }, + + /** + * 用户点击右上角分享 + */ + onShareAppMessage() { + + } +}) \ No newline at end of file diff --git a/pages/order/detail-group/index.json b/pages/order/detail-group/index.json new file mode 100644 index 0000000..8835af0 --- /dev/null +++ b/pages/order/detail-group/index.json @@ -0,0 +1,3 @@ +{ + "usingComponents": {} +} \ No newline at end of file diff --git a/pages/order/detail-group/index.wxml b/pages/order/detail-group/index.wxml new file mode 100644 index 0000000..e2bc848 --- /dev/null +++ b/pages/order/detail-group/index.wxml @@ -0,0 +1,65 @@ + + + + + 【洗吹】精致造型 + + 周一至周五可用 + 免预约 + + + 9.9 + + + + 二维码区域，小程序存储总量限制 + + + + + + 椰岛造型 + 距离 2.1km + + + + + + 导航 + + + + + + 电话 + + + + + 订单信息 + + + 交易订单 + 4972003158292222817 + 复制 + + + 交易方式 + 微信支付 + + + 手机号码 + 157****0627 + + + 下单时间 + 2024/10/10 12:03:21 + + + + + + + + + \ No newline at end of file diff --git a/pages/order/detail-group/index.wxss b/pages/order/detail-group/index.wxss new file mode 100644 index 0000000..af246ae --- /dev/null +++ b/pages/order/detail-group/index.wxss @@ -0,0 +1,131 @@ +.page-container .title{ + font-weight: 600; + font-size:32rpx; + display: flex; + align-items: center; +} + +.prd-info .head{ + display: flex; +} +.prd-info .head .image{ + width:120rpx;height:120rpx; +} +.prd-info .head .center{ + flex: 1; + margin-left:20rpx; + margin-top:10rpx; +} +.prd-info .head .money{ + margin-top:10rpx; +} +.prd-info .head .tags{ + margin-top:22rpx; +} +.prd-info .spliter{ + margin:20rpx 0 30rpx 0; +} +.prd-info .qrcode{ + width:400rpx;height:400rpx; + margin: 0 auto; + background-color: #999; +} + +.address{ + display: flex; +} +.address .left{ + flex:1; +} +.address .left .text1{ + font-size: 36rpx; + font-weight: 500; +} +.address .left .text2{ + font-size: 26rpx; + margin-top:40rpx; +} +.address .icon-con{ + background-color: rgba(153, 153, 153, 0.1); + border-radius: 50%; + display: inline-flex; + align-items: center; + padding:8rpx; +} +.address .icon{ + width:30rpx;height:30rpx; +} +.address .right{ + font-size: 26rpx; + color: #888888; + margin-left:48rpx; + text-align: center; +} +.address .right .text{ + margin-top:32rpx; +} + + +.order-info .kv{ + display: flex; + align-items: center; + height:58rpx; +} +.order-info .spliter{ + margin:28rpx 0 18rpx 0; +} +.order-info .kv .key{ + font-size: 26rpx; + color: #888888; +} +.order-info .kv .value{ + font-size: 28rpx; + margin-left:30rpx; + flex:1; + display:flex; + align-items: center; +} +.order-info .kv .copy{ + font-size: 20rpx; + border-radius: 60rpx; + border: 0.5px solid rgba(153, 153, 153, 0.5); + color: #888888; + line-height: 32rpx; + padding:0 14rpx; +} +.order-info .kv .tag{ + border: 1rpx solid #EB0000; + color: #EB0000; + font-size: 24rpx; + border-radius: 8rpx; + line-height: 40rpx; + padding:0 10rpx; + margin-left: 32rpx; +} + + + +.bottom-bar{ + padding:34rpx 34rpx 94rpx; + text-align: right; +} +.bottom-bar .button{ + line-height: 72rpx; + padding:0 36rpx; + font-weight: normal; + border-radius: 18rpx; +} +.bottom-bar .button1{ + color: #555555; + border: 1rpx solid rgba(153, 153, 153, 0.5); + font-size: 32rpx; +} +.bottom-bar .button2{ + color: #1A4DEB; + border: 1rpx solid #1A4DEB; + font-size: 32rpx; + margin-left:30rpx; +} +.patch{ + padding-bottom:200rpx; +} \ No newline at end of file diff --git a/pages/order/detail/index.js b/pages/order/detail/index.js new file mode 100644 index 0000000..d20a4aa --- /dev/null +++ b/pages/order/detail/index.js @@ -0,0 +1,66 @@ +// pages/order/detail/index.js +Page({ + + /** + * 页面的初始数据 + */ + data: { + + }, + + /** + * 生命周期函数--监听页面加载 + */ + onLoad(options) { + + }, + + /** + * 生命周期函数--监听页面初次渲染完成 + */ + onReady() { + + }, + + /** + * 生命周期函数--监听页面显示 + */ + onShow() { + + }, + + /** + * 生命周期函数--监听页面隐藏 + */ + onHide() { + + }, + + /** + * 生命周期函数--监听页面卸载 + */ + onUnload() { + + }, + + /** + * 页面相关事件处理函数--监听用户下拉动作 + */ + onPullDownRefresh() { + + }, + + /** + * 页面上拉触底事件的处理函数 + */ + onReachBottom() { + + }, + + /** + * 用户点击右上角分享 + */ + onShareAppMessage() { + + } +}) \ No newline at end of file diff --git a/pages/order/detail/index.json b/pages/order/detail/index.json new file mode 100644 index 0000000..781f718 --- /dev/null +++ b/pages/order/detail/index.json @@ -0,0 +1,4 @@ +{ + "usingComponents": {}, + "navigationBarTitleText": "订单详情" +} \ No newline at end of file diff --git a/pages/order/detail/index.wxml b/pages/order/detail/index.wxml new file mode 100644 index 0000000..e5e8d6b --- /dev/null +++ b/pages/order/detail/index.wxml @@ -0,0 +1,87 @@ +待接单 + + 跑腿员 + + + + + 张三 + 已安全送达0件 + + + + + + 送货地址 + + 朝阳时代西锦12栋1单元2072 + 何灵先生 158****3822 + + + + 取件信息 + + + + + + + + 妈妈驿站 (朝阳时代西锦)  共5件包裹 + + 1-1-1111 + 2-2-2222 + 3-3-3333 + 4-4-4444 + + + + + 菜鸟驿站 (朝阳时代西锦)  共1件包裹 + + 1-1-1111 + 2-2-2222 + 3-3-3333 + 4-4-4444 + + + + + + 送达方式 + 敲门递件 + + + + + 订单信息 + + + 订单编号 + 2024071166325555 + 复制 + + + 提交时间 + 2024-07-11 16:46:32 + + + 取件数量 + 5 + + + 跑腿费用 + + 3.5 + 先享后付 + + + + + + + + \ No newline at end of file diff --git a/pages/order/detail/index.wxss b/pages/order/detail/index.wxss new file mode 100644 index 0000000..f1b97cf --- /dev/null +++ b/pages/order/detail/index.wxss @@ -0,0 +1,165 @@ +.page-container .title{ + font-weight: 600; + font-size:32rpx; + display: flex; + align-items: center; +} +.page-container .title .left{ + flex:1; +} +.page-container .title .right{ + font-weight: normal; + font-size: 30rpx; +} +.page-container .title .right .time{ + color:#EB0000; + font-weight: 500; + font-size: 32rpx; + margin-left: 10rpx; +} +.order-status{ + margin:50rpx 20rpx; + display: flex; + align-items: center; + font-size: 40rpx; + font-weight: 600; +} +.order-status.waiting{ + color:#1A4DEB; +} +.order-status::before{ + content: ""; + display: block; + width:10rpx;height:44rpx; + margin-right:24rpx; + border-radius: 6rpx; + background-color:#000; +} +.order-status.waiting::before{ + background-color: #1A4DEB; +} +.page-container .spliter{ + margin:24rpx 0 40rpx 0; +} +.sender .info{ + display: flex; + align-items: center; +} +.sender .info .avatar{ + width:100rpx;height:100rpx; +} +.sender .info .center{ + margin-left:24rpx; + flex:1; +} +.sender .info .name{ + font-size: 30rpx; + font-weight: 600; +} +.sender .info .desc{ + font-size: 26rpx; + color: #888888; + margin-top:24rpx; +} +.sender .info .button{ + font-size: 24rpx; + font-weight: normal; + border: 0.6px solid #1A4DEB; + color:#1A4DEB; + border-radius: 12rpx; +} +.sender .info .icon{ + width:24rpx;height:24rpx; +} +.address .text{ + font-size: 34rpx; + font-weight: 500; +} +.address .user{ + font-size: 32rpx; + color: #888888; + margin-top:26rpx; +} +.package-info{ + +} + +.package-info .package{ +} +.package-info .package .p-title{ + font-size: 30rpx; + color: #888888; +} +.package-info .package .code-list{ + font-size: 34rpx; + display: flex; + justify-content: space-between; + flex-wrap: wrap; + row-gap: 30rpx; + column-gap: 84rpx; + margin-top: 30rpx; +} +.package-info .package .item{ + +} +.order-info .kv{ + display: flex; + align-items: center; + height:64rpx; +} +.order-info .kv .key{ + font-size: 30rpx; + color: #888888; +} +.order-info .kv .value{ + font-size: 32rpx; + margin-left:30rpx; + flex:1; + display:flex; + align-items: center; +} +.order-info .kv .copy{ + font-size: 22rpx; + border-radius: 60rpx; + background-color: #EBF0FF; + color:#1A4DEB; + line-height: 32rpx; + padding:0 14rpx; +} +.order-info .kv .tag{ + border: 1rpx solid #EB0000; + color: #EB0000; + font-size: 24rpx; + border-radius: 8rpx; + line-height: 40rpx; + padding:0 10rpx; + margin-left: 32rpx; +} +.bottom-bar{ + padding:34rpx 34rpx 94rpx; + text-align: right; +} +.bottom-bar .button{ + line-height: 72rpx; + padding:0 36rpx; + font-weight: normal; + border-radius: 18rpx; +} +.bottom-bar .button1{ + color: #555555; + border: 1rpx solid rgba(153, 153, 153, 0.5); + font-size: 32rpx; +} +.bottom-bar .button2{ + color: #1A4DEB; + border: 1rpx solid #1A4DEB; + font-size: 32rpx; + margin-left:30rpx; +} +.patch{ + padding-bottom:200rpx; +} + +.send-way .left{ + padding:10rpx 0; +} \ No newline at end of file diff --git a/pages/order/index/index.js b/pages/order/index/index.js index d78d36d..090e7db 100644 --- a/pages/order/index/index.js +++ b/pages/order/index/index.js @@ -11,6 +11,16 @@ Page({ const tabIndex = event.currentTarget.dataset.index; this.setData({tabIndex}) }, + goToDetail(){ + wx.navigateTo({ + url: '/pages/order/detail/index', + }) + }, + goToGroupDetail(){ + wx.navigateTo({ + url: '/pages/order/detail-group/index', + }) + }, /** * 生命周期函数--监听页面加载 diff --git a/pages/order/index/index.wxml b/pages/order/index/index.wxml index 3e91ac3..fc4528a 100644 --- a/pages/order/index/index.wxml +++ b/pages/order/index/index.wxml @@ -8,7 +8,58 @@ - + + + + + + + 代取快递 + + {{index==0?'待接单':(index==1?'已接单':'')}} + + + + + 朝阳时代西锦12栋1单元2072 + 下单时间：2024-12-07 10:58:31 + + + + + + + + + + + + + + + + + + 待使用 + + + + + 【洗吹】精致造型 + + 周一至周五可用 + 免预约 + + + 9.9 + + + + + + + + 暂无相关订单 \ No newline at end of file diff --git a/pages/order/index/index.wxss b/pages/order/index/index.wxss index 3ff9023..a4c8e83 100644 --- a/pages/order/index/index.wxss +++ b/pages/order/index/index.wxss @@ -34,6 +34,84 @@ opacity: 1; } +.order-list{} +.order-list .item{ + background-color: #fff; + border-radius: 18rpx; + margin:24rpx 0; + padding:30rpx; +} +.order-list .head{ + display: flex; + align-items: center; +} +.order-list .head .center{ + margin-left:24rpx; + flex:1; + font-size:34rpx; + font-weight: 500; +} +.order-list .head .status{ + font-size: 32rpx; +} +.order-list .head .status.waiting{ + color: #1A4DEB; +} +.order-list .head .status.receiving{ + color:#FF8400; +} +.order-list .head .icon-con{ + padding: 10rpx; + background-color: #1A4DEB; + border-radius: 50%; + display: flex; + align-items: center; +} +.order-list .head .icon-con .icon{ + width:36rpx;height:36rpx; + display: inline-block; +} +.order-list .head{ + display: flex; +} +.order-list .content{ + margin-top:24rpx; + margin-left:80rpx; +} +.order-list .content .address{ + margin-top:30rpx; + font-size: 34rpx; + font-weight: 500; +} +.order-list .content .time{ + font-size: 26rpx; + color:#888888; + margin-top:24rpx; + padding-bottom:48rpx; +} +.order-list .content .pay{ + display: flex; + justify-content: space-between; + align-items: center; + margin-top:12rpx; + font-size: 26rpx; + color: #888888; +} +.order-list .content .pay .money{ + margin-left:12rpx; +} +.order-list .content .pay .left{ + border-bottom: 0.5px solid rgba(136, 136, 136, 0.2); + padding:20rpx 0; +} +.order-list .content .pay .button{ + margin:0; + border-radius: 18rpx; + font-size:28rpx; + line-height: 1; + padding:20rpx 24rpx; +} + .list-empty{ text-align: center; margin-top:380rpx; @@ -44,4 +122,57 @@ .list-empty .text{ font-size:30rpx; color:#7C8695 +} + +.group-list .item{ + background-color: #fff; + border-radius: 18rpx; + padding: 30rpx 40rpx; + margin:24rpx 0; +} +.group-list .item.status-waiting .status{ + color: #1A4DEB; +} +.group-list .head{ + display: flex; +} +.group-list .head .name{ + font-size: 32rpx; + font-weight: 600; + flex:1; + display: flex; + align-items: center; +} +.group-list .head .name .icon{ + width:28rpx;height:28rpx; + margin-left:4rpx; +} + +.group-list .content{ + display: flex; + margin-top:30rpx; +} +.group-list .content .image{ + width:160rpx;height:160rpx; +} +.group-list .content .center{ + flex:1; + margin-left:40rpx; +} +.group-list .content .tags{ + margin-top:22rpx; +} +.group-list .btns{ + text-align: right; +} +.group-list .btns .button{ + font-size: 27rpx; + font-weight: normal; + line-height: 1; + padding:16rpx 26rpx; + border-radius: 12rpx; +} +.group-list .btns .button2{ + color: #1A4DEB; + margin-left: 20rpx; } \ No newline at end of file diff --git a/pages/order/success/index.js b/pages/order/success/index.js new file mode 100644 index 0000000..c9325b5 --- /dev/null +++ b/pages/order/success/index.js @@ -0,0 +1,66 @@ +// pages/order/success/index.js +Page({ + + /** + * 页面的初始数据 + */ + data: { + + }, + + /** + * 生命周期函数--监听页面加载 + */ + onLoad(options) { + + }, + + /** + * 生命周期函数--监听页面初次渲染完成 + */ + onReady() { + + }, + + /** + * 生命周期函数--监听页面显示 + */ + onShow() { + + }, + + /** + * 生命周期函数--监听页面隐藏 + */ + onHide() { + + }, + + /** + * 生命周期函数--监听页面卸载 + */ + onUnload() { + + }, + + /** + * 页面相关事件处理函数--监听用户下拉动作 + */ + onPullDownRefresh() { + + }, + + /** + * 页面上拉触底事件的处理函数 + */ + onReachBottom() { + + }, + + /** + * 用户点击右上角分享 + */ + onShareAppMessage() { + + } +}) \ No newline at end of file diff --git a/pages/order/success/index.json b/pages/order/success/index.json new file mode 100644 index 0000000..8835af0 --- /dev/null +++ b/pages/order/success/index.json @@ -0,0 +1,3 @@ +{ + "usingComponents": {} +} \ No newline at end of file diff --git a/pages/order/success/index.wxml b/pages/order/success/index.wxml new file mode 100644 index 0000000..f121106 --- /dev/null +++ b/pages/order/success/index.wxml @@ -0,0 +1,9 @@ + + + 扫码核销成功 + + + + + + \ No newline at end of file diff --git a/pages/order/success/index.wxss b/pages/order/success/index.wxss new file mode 100644 index 0000000..f977661 --- /dev/null +++ b/pages/order/success/index.wxss @@ -0,0 +1,35 @@ +.success{ + background-color: #fff; + text-align: center; + height: 100%; + width:100%; + position: absolute; + padding-top:150rpx; + box-sizing: border-box; +} +.success .msg{ + font-size: 36rpx; + font-weight: 500; + margin-top:38rpx; +} +.success .prd-indo{ + border-top:1rpx dashed rgba(153, 153, 153, 0.5); + border-bottom:1rpx dashed rgba(153, 153, 153, 0.5); + padding:48rpx 0; + display: flex; + text-align: left; + margin:100rpx 50rpx; + font-size: 32rpx; + font-weight: 500; +} +.success .prd-indo .name{ + flex:1; +} +.success .button{ + position: absolute; + line-height: 90rpx; + width:320rpx; + background-color: #F1F1F1; + left:calc(50% - 160rpx); + bottom:180rpx; +} \ No newline at end of file