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 0000000..b722296 Binary files /dev/null and b/assets/icon/order/package@2x.png differ diff --git a/assets/icon/order/right-arrow@2x.png b/assets/icon/order/right-arrow@2x.png new file mode 100644 index 0000000..5c9bd85 Binary files /dev/null and b/assets/icon/order/right-arrow@2x.png differ 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