From c9f171e5d53bac197e59c2fa197740127bcecea8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=A8=8B=E5=BA=8F=E5=91=98=E5=B0=8F=E5=A2=A8?= <2291200076@qq.com> Date: Mon, 20 Mar 2023 23:34:59 +0800 Subject: [PATCH] =?UTF-8?q?=E5=B0=8F=E7=A8=8B=E5=BA=8F=E5=95=86=E5=93=81?= =?UTF-8?q?=E5=88=97=E8=A1=A8=E9=A1=B5=E4=BC=98=E5=8C=96=EF=BC=9B=E6=B7=BB?= =?UTF-8?q?=E5=8A=A0=E6=88=91=E7=9A=84=E8=AE=A2=E5=8D=95=E9=A1=B5=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- TODOs.md | 3 +- weixin-miniprogram/app.json | 3 +- weixin-miniprogram/pages/index/index.js | 6 +- weixin-miniprogram/pages/index/index.wxml | 8 +- weixin-miniprogram/pages/person/person.js | 24 +- .../pages/shop/components/good-list-card.wxss | 2 +- weixin-miniprogram/pages/shop/goodDetail.js | 4 +- weixin-miniprogram/pages/shop/myOrder.js | 83 +++++ weixin-miniprogram/pages/shop/myOrder.json | 4 + weixin-miniprogram/pages/shop/myOrder.wxml | 17 ++ weixin-miniprogram/pages/shop/myOrder.wxss | 16 + .../shop/{orderConfirm.js => orderDetail.js} | 2 +- .../{orderConfirm.json => orderDetail.json} | 0 .../{orderConfirm.wxml => orderDetail.wxml} | 4 +- .../{orderConfirm.wxss => orderDetail.wxss} | 288 +++++++++--------- weixin-miniprogram/pages/shop/shop.js | 20 +- weixin-miniprogram/services/order.js | 14 +- 17 files changed, 331 insertions(+), 167 deletions(-) create mode 100644 weixin-miniprogram/pages/shop/myOrder.js create mode 100644 weixin-miniprogram/pages/shop/myOrder.json create mode 100644 weixin-miniprogram/pages/shop/myOrder.wxml create mode 100644 weixin-miniprogram/pages/shop/myOrder.wxss rename weixin-miniprogram/pages/shop/{orderConfirm.js => orderDetail.js} (98%) rename weixin-miniprogram/pages/shop/{orderConfirm.json => orderDetail.json} (100%) rename weixin-miniprogram/pages/shop/{orderConfirm.wxml => orderDetail.wxml} (97%) rename weixin-miniprogram/pages/shop/{orderConfirm.wxss => orderDetail.wxss} (93%) diff --git a/TODOs.md b/TODOs.md index da117bf..22ba6a5 100644 --- a/TODOs.md +++ b/TODOs.md @@ -34,10 +34,11 @@ https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/userProf 优点： -订单id使用 雪花id（分布式） +订单id使用 雪花id（可以分布式部署） 遇到的问题： nacos CPU占满问题，解决方案：提issue，多次测试，找到问题（HTTPDebug），问题解决 +iPhone部分版本不支持webp格式图片 ----- diff --git a/weixin-miniprogram/app.json b/weixin-miniprogram/app.json index 5bc9270..98bc8cf 100644 --- a/weixin-miniprogram/app.json +++ b/weixin-miniprogram/app.json @@ -7,7 +7,8 @@ "pages/residents/reportHistory", "pages/shop/shop", "pages/shop/goodDetail", - "pages/shop/orderConfirm", + "pages/shop/orderDetail", + "pages/shop/myOrder", "pages/scan/entrance", "pages/person/person" ], diff --git a/weixin-miniprogram/pages/index/index.js b/weixin-miniprogram/pages/index/index.js index c2cb890..84d4ad3 100644 --- a/weixin-miniprogram/pages/index/index.js +++ b/weixin-miniprogram/pages/index/index.js @@ -170,8 +170,12 @@ Page({ magicButton() { wx.navigateTo({ + // 扫码进社区 // url: "/pages/scan/entrance?a=1" - url: "/pages/shop/orderConfirm?orderId=1748800678865801225" + // 订单确认页 + // url: "/pages/shop/orderDetail?orderId=1748800678865801225" + // 我的订单 + url: '/pages/shop/myOrder' }) } }) diff --git a/weixin-miniprogram/pages/index/index.wxml b/weixin-miniprogram/pages/index/index.wxml index 2744f7b..c1d8699 100644 --- a/weixin-miniprogram/pages/index/index.wxml +++ b/weixin-miniprogram/pages/index/index.wxml @@ -14,7 +14,9 @@ {{ menuItem.title }} - - - 调试信息：{{ debugText }} + + + + + \ No newline at end of file diff --git a/weixin-miniprogram/pages/person/person.js b/weixin-miniprogram/pages/person/person.js index 6934c94..7212d42 100644 --- a/weixin-miniprogram/pages/person/person.js +++ b/weixin-miniprogram/pages/person/person.js @@ -16,11 +16,17 @@ Page({ avatarUrl: defaultAvatarUrl, nickName: "请登录", displayUserId: "", - menuList: [{ - id: "logout", - color: 'red', - title: "退出登录", - }] + menuList: [ + { + id: "myOrder", + title: "我的订单", + }, + { + id: "logout", + color: 'red', + title: "退出登录", + } + ] }, /** @@ -111,6 +117,14 @@ Page({ console.log("event.target", event.target) let menuId = event.target.id switch (menuId) { + // 我的订单 + case "myOrder": + wx.navigateTo({ + url: '/pages/shop/myOrder' + }) + break + + // 退出登录 case "logout": wx.clearStorageSync() app.globalData.userInfo = null diff --git a/weixin-miniprogram/pages/shop/components/good-list-card.wxss b/weixin-miniprogram/pages/shop/components/good-list-card.wxss index 4e754ff..e35ceee 100644 --- a/weixin-miniprogram/pages/shop/components/good-list-card.wxss +++ b/weixin-miniprogram/pages/shop/components/good-list-card.wxss @@ -8,7 +8,7 @@ } .good-card-image { - background-color: bisque; + /* background-color: bisque; */ background-position: center; background-repeat: no-repeat; background-size: cover; diff --git a/weixin-miniprogram/pages/shop/goodDetail.js b/weixin-miniprogram/pages/shop/goodDetail.js index 4351ed1..dbf9163 100644 --- a/weixin-miniprogram/pages/shop/goodDetail.js +++ b/weixin-miniprogram/pages/shop/goodDetail.js @@ -88,7 +88,7 @@ Page({ // 跳转订单查看页面（携带订单号） wx.navigateTo({ // url: "/pages/scan/entrance?a=1" - url: "/pages/shop/orderConfirm?orderId=" + orderId + url: "/pages/shop/orderDetail?orderId=" + orderId }) })(); }, @@ -102,4 +102,4 @@ Page({ }) })(); } -}) \ No newline at end of file +}) diff --git a/weixin-miniprogram/pages/shop/myOrder.js b/weixin-miniprogram/pages/shop/myOrder.js new file mode 100644 index 0000000..8a007a5 --- /dev/null +++ b/weixin-miniprogram/pages/shop/myOrder.js @@ -0,0 +1,83 @@ +// pages/shop/myOrder.js + +const goodService = require("../../services/good") +const orderService = require("../../services/order") + +Page({ + + /** + * 页面的初始数据 + */ + data: { + orderList: [], + }, + + /** + * 生命周期函数--监听页面加载 + */ + onLoad(options) { + this.loadPageData() + }, + + /** + * 生命周期函数--监听页面初次渲染完成 + */ + onReady() { + + }, + + /** + * 生命周期函数--监听页面显示 + */ + onShow() { + + }, + + /** + * 生命周期函数--监听页面隐藏 + */ + onHide() { + + }, + + /** + * 生命周期函数--监听页面卸载 + */ + onUnload() { + + }, + + /** + * 页面相关事件处理函数--监听用户下拉动作 + */ + onPullDownRefresh() { + + }, + + /** + * 页面上拉触底事件的处理函数 + */ + onReachBottom() { + + }, + + /** + * 用户点击右上角分享 + */ + onShareAppMessage() { + + }, + + loadPageData() { + (async () => { + let orderList = await orderService.listUserOrder() + console.log("orderList", orderList) + this.setData({ + orderList: orderList.map(order => { + order.displayDate = order.orderDate.replace("T", " ") + return order + }) + }) + })(); + } +}) \ No newline at end of file diff --git a/weixin-miniprogram/pages/shop/myOrder.json b/weixin-miniprogram/pages/shop/myOrder.json new file mode 100644 index 0000000..cafaff7 --- /dev/null +++ b/weixin-miniprogram/pages/shop/myOrder.json @@ -0,0 +1,4 @@ +{ + "usingComponents": {}, + "navigationBarTitleText": "我的订单" +} \ No newline at end of file diff --git a/weixin-miniprogram/pages/shop/myOrder.wxml b/weixin-miniprogram/pages/shop/myOrder.wxml new file mode 100644 index 0000000..f13563e --- /dev/null +++ b/weixin-miniprogram/pages/shop/myOrder.wxml @@ -0,0 +1,17 @@ + + + + + 订单号： + {{ item.id }} + + + 创建时间： + {{ item.displayDate }} + + + 订单状态： + {{ item.orderStatus }} + + + \ No newline at end of file diff --git a/weixin-miniprogram/pages/shop/myOrder.wxss b/weixin-miniprogram/pages/shop/myOrder.wxss new file mode 100644 index 0000000..ea6f218 --- /dev/null +++ b/weixin-miniprogram/pages/shop/myOrder.wxss @@ -0,0 +1,16 @@ +/* pages/shop/myOrder.wxss */ +.container { + padding: 20px 8vw; +} + +.order-card { + border-radius: 12px; + box-shadow: 0 2px 10px 0 rgba(0, 0, 0, .2); + margin: 10px 0; + padding: 15px 20px; +} + +.order-info-key { + display: inline-block; + min-width: 90px; +} diff --git a/weixin-miniprogram/pages/shop/orderConfirm.js b/weixin-miniprogram/pages/shop/orderDetail.js similarity index 98% rename from weixin-miniprogram/pages/shop/orderConfirm.js rename to weixin-miniprogram/pages/shop/orderDetail.js index d8e470c..1ef1b72 100644 --- a/weixin-miniprogram/pages/shop/orderConfirm.js +++ b/weixin-miniprogram/pages/shop/orderDetail.js @@ -1,4 +1,4 @@ -// pages/shop/orderConfirm.js +// pages/shop/orderDetail.js const orderService = require("../../services/order") diff --git a/weixin-miniprogram/pages/shop/orderConfirm.json b/weixin-miniprogram/pages/shop/orderDetail.json similarity index 100% rename from weixin-miniprogram/pages/shop/orderConfirm.json rename to weixin-miniprogram/pages/shop/orderDetail.json diff --git a/weixin-miniprogram/pages/shop/orderConfirm.wxml b/weixin-miniprogram/pages/shop/orderDetail.wxml similarity index 97% rename from weixin-miniprogram/pages/shop/orderConfirm.wxml rename to weixin-miniprogram/pages/shop/orderDetail.wxml index 7f8609b..9a52fbd 100644 --- a/weixin-miniprogram/pages/shop/orderConfirm.wxml +++ b/weixin-miniprogram/pages/shop/orderDetail.wxml @@ -1,4 +1,4 @@ - + 🎉 @@ -47,4 +47,4 @@ 确认支付 - \ No newline at end of file + diff --git a/weixin-miniprogram/pages/shop/orderConfirm.wxss b/weixin-miniprogram/pages/shop/orderDetail.wxss similarity index 93% rename from weixin-miniprogram/pages/shop/orderConfirm.wxss rename to weixin-miniprogram/pages/shop/orderDetail.wxss index de0474b..a0ff3a1 100644 --- a/weixin-miniprogram/pages/shop/orderConfirm.wxss +++ b/weixin-miniprogram/pages/shop/orderDetail.wxss @@ -1,144 +1,144 @@ -/* pages/shop/orderConfirm.wxss */ -.page-title-container { - margin-top: 16px; - text-align: center; -} - -.page-title-emoji { - font-size: 72px; -} - -.page-title { - /* border: 2px dashed black; */ - display: inline-block; - padding: 15px 20px; - font-size: 20px; -} - -.order-info { - background-color: tomato; - padding: 10px 18px; - margin: 10px; - border-radius: 10px; - color: #fff3f1; - font-weight: 500; - line-height: 1.8em; -} - -.good-list-title { - text-align: center; - margin-top: 20px; - margin-bottom: 20px; - font-weight: 500; - font-size: 18px; -} - -/* 商品列表样式 */ -.good-card-container { - /* border: 1px solid grey; */ - border-radius: 12px; - box-shadow: 0 2px 10px 0 rgba(0, 0, 0, .2); - margin: 0 14px; - padding: 15px 20px; - display: grid; - grid-template-columns: 120px 1fr 50px; - grid-template-rows: 4fr 3fr; - place-items: center; - gap: 0 8px; - margin-bottom: 10px; -} - -.good-card-image { - width: 88px; - height: 88px; - background-color: teal; - background-position: center; - background-repeat: no-repeat; - background-size: cover; - border: 1px solid grey; - border-radius: 5px; - grid-row-start: 1; - grid-row-end: 3; -} - -.good-card-info { - width: 100%; -} - -/* 商品标题 */ -.good-title-container { - grid-column-start: 2; - grid-column-end: 4; -} - -.good-title { - font-size: 30rpx; - color: #333; - font-weight: 400; - display: -webkit-box; - height: 72rpx; - -webkit-box-orient: vertical; - -webkit-line-clamp: 2; - overflow: hidden; - word-break: break-word; - line-height: 36rpx; - margin: 4rpx 0; -} - -/* 商品价格 */ -.good-price { - white-space: nowrap; - font-weight: 700; - margin: 0; - display: inline; - position: relative; -} - -.good-price-counter { - color: #fa4126; - font-size: 36rpx; -} - -.good-price .good-price-symbol { - font-size: 24rpx; - display: inline; -} - -.good-price .good-price-number { - display: inline; -} - -/* 屏幕底部 确认支付按钮 */ -.bottom-controlbox { - background-color: white; - position: fixed; - z-index: 999; - bottom: 0; - left: 0; - right: 0; - width: 100%; - padding-top: 6px; - padding-bottom: 12px; - border-top: 1px solid grey; - text-align: center; -} - -.bottom-buttons { - height: 100%; - display: inline-block; -} - -.btn { - width: 254rpx; - height: 80rpx; - display: inline-grid; - align-items: center; - justify-content: center; - color: white; -} - -#btn-confirm-payment { - background-color: #fa4126; - color: #fff; - border-radius: 40rpx; -} +/* pages/shop/orderDetail.wxss */ +.page-title-container { + margin-top: 16px; + text-align: center; +} + +.page-title-emoji { + font-size: 72px; +} + +.page-title { + /* border: 2px dashed black; */ + display: inline-block; + padding: 15px 20px; + font-size: 20px; +} + +.order-info { + background-color: tomato; + padding: 10px 18px; + margin: 10px; + border-radius: 10px; + color: #fff3f1; + font-weight: 500; + line-height: 1.8em; +} + +.good-list-title { + text-align: center; + margin-top: 20px; + margin-bottom: 20px; + font-weight: 500; + font-size: 18px; +} + +/* 商品列表样式 */ +.good-card-container { + /* border: 1px solid grey; */ + border-radius: 12px; + box-shadow: 0 2px 10px 0 rgba(0, 0, 0, .2); + margin: 0 14px; + padding: 15px 20px; + display: grid; + grid-template-columns: 120px 1fr 50px; + grid-template-rows: 4fr 3fr; + place-items: center; + gap: 0 8px; + margin-bottom: 10px; +} + +.good-card-image { + width: 88px; + height: 88px; + background-color: teal; + background-position: center; + background-repeat: no-repeat; + background-size: cover; + border: 1px solid grey; + border-radius: 5px; + grid-row-start: 1; + grid-row-end: 3; +} + +.good-card-info { + width: 100%; +} + +/* 商品标题 */ +.good-title-container { + grid-column-start: 2; + grid-column-end: 4; +} + +.good-title { + font-size: 30rpx; + color: #333; + font-weight: 400; + display: -webkit-box; + height: 72rpx; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; + overflow: hidden; + word-break: break-word; + line-height: 36rpx; + margin: 4rpx 0; +} + +/* 商品价格 */ +.good-price { + white-space: nowrap; + font-weight: 700; + margin: 0; + display: inline; + position: relative; +} + +.good-price-counter { + color: #fa4126; + font-size: 36rpx; +} + +.good-price .good-price-symbol { + font-size: 24rpx; + display: inline; +} + +.good-price .good-price-number { + display: inline; +} + +/* 屏幕底部 确认支付按钮 */ +.bottom-controlbox { + background-color: white; + position: fixed; + z-index: 999; + bottom: 0; + left: 0; + right: 0; + width: 100%; + padding-top: 6px; + padding-bottom: 12px; + border-top: 1px solid grey; + text-align: center; +} + +.bottom-buttons { + height: 100%; + display: inline-block; +} + +.btn { + width: 254rpx; + height: 80rpx; + display: inline-grid; + align-items: center; + justify-content: center; + color: white; +} + +#btn-confirm-payment { + background-color: #fa4126; + color: #fff; + border-radius: 40rpx; +} diff --git a/weixin-miniprogram/pages/shop/shop.js b/weixin-miniprogram/pages/shop/shop.js index a520296..55e7d31 100644 --- a/weixin-miniprogram/pages/shop/shop.js +++ b/weixin-miniprogram/pages/shop/shop.js @@ -8,8 +8,11 @@ Page({ * 页面的初始数据 */ data: { + // 筛选条件 sidebarActiveId: -1, searchText: '', + + // 数据 sidebarList: [ { id: -1, @@ -128,15 +131,20 @@ Page({ }, sidebarItemTap(event) { + console.log("sidebarActiveId", this.data.sidebarActiveId) // 清除原来的选中项，并设置新的选中项 // console.log("event.target", event.target) // console.log("event.currentTarget", event.currentTarget) let dataset = event.currentTarget.dataset console.log("dataset", dataset) + if (this.data.sidebarActiveId === dataset.item.id) { + console.log("点的分类已选中，跳过") + return // 点的分类就是当前激活的分类，直接跳过 + } this.setData({ sidebarActiveId: dataset.item.id, }) - this.loadPageData() + this.updatePageData() return }, @@ -167,10 +175,10 @@ Page({ }, updatePageData() { + this.setData({ + tabbarList: [], + }); (async () => { - this.setData({ - tabbarList: [], - }) let goodListPromise = goodService.getGoodList(this.data.sidebarActiveId, this.data.searchText) Promise.all([ goodListPromise, @@ -180,7 +188,9 @@ Page({ this.setData({ tabbarList: goodList, }) + // wx.nextTick(() => { + // }) }) })(); } -}) \ No newline at end of file +}) diff --git a/weixin-miniprogram/services/order.js b/weixin-miniprogram/services/order.js index aa17584..460b694 100644 --- a/weixin-miniprogram/services/order.js +++ b/weixin-miniprogram/services/order.js @@ -16,7 +16,7 @@ export function createOrder(orderList) { }) } -/** 商品下单 */ +/** 获取订单详情 */ export function getOrderDetail(orderId) { return send_request({ url: '/shop/order/miniprogram/orderDetail', @@ -26,3 +26,15 @@ export function getOrderDetail(orderId) { } }) } + +/** 我的订单 */ +export function listUserOrder() { + let userInfo = wx.getStorageSync("userInfo") + return send_request({ + url: '/shop/order/miniprogram/listUserOrder', + method: "GET", + data: { + "userId": userInfo.id, + } + }) +}