order-list.ts 9.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349
  1. import PageContainerBehavior from "../../../../core/behavior/page-container.behavior";
  2. import tickleBehavior, {
  3. getTickleContext,
  4. } from "../../../../core/behavior/tickle.behavior";
  5. import { handleWeChatPayment } from "../../../../utils/util";
  6. import {
  7. orderListMethod,
  8. orderCancelMethod,
  9. orderPayMethod,
  10. } from "../../request";
  11. // module/article/pages/order-list/order-list.ts
  12. Page({
  13. behaviors: [PageContainerBehavior, tickleBehavior],
  14. properties: {},
  15. data: {
  16. showConfirm: false,
  17. currentTab: "all", // 当前选中的标签
  18. orders: [],
  19. filteredOrders: [], // 用于存储过滤后的订单
  20. patientId: 0,
  21. id: "",
  22. statusObj: {
  23. 0: "待付款",
  24. // 6: "待收货",
  25. 6: "已付款",
  26. 345: "交易成功",
  27. 2: "交易关闭",
  28. },
  29. statusClassObj: {
  30. 0: "status-pending",
  31. 6: "status-received",
  32. 345: "status-completed",
  33. 2: "status-closed",
  34. },
  35. selectedAddress: null,
  36. paying: false,
  37. payingId: '',
  38. showAddress: false,
  39. // 节流控制
  40. throttleTimers: {} as Record<string, boolean>,
  41. expandedItems: {} as Record<string, boolean>,
  42. },
  43. computed: {},
  44. // 节流 - 防止短时间内重复点击
  45. throttle(func: Function, delay: number = 1000, key: string = "default") {
  46. return (...args: any[]) => {
  47. // 如果该按钮正在节流中,直接返回
  48. if (this.data.throttleTimers[key]) {
  49. return;
  50. }
  51. // 设置节流定时器
  52. this.setData({
  53. [`throttleTimers.${key}`]: true,
  54. });
  55. // 执行函数
  56. const result = func.apply(this, args);
  57. // 延迟清除节流状态
  58. setTimeout(() => {
  59. this.setData({
  60. [`throttleTimers.${key}`]: false,
  61. });
  62. }, delay);
  63. return result;
  64. };
  65. },
  66. onLoad(options: any) {
  67. // 读取 tab 参数,默认为 all
  68. const tab = options?.tab || "all";
  69. this.setData({ currentTab: tab });
  70. },
  71. onShow() {
  72. this.filterOrdersList(this.data.currentTab);
  73. },
  74. // 切换tab
  75. onTabChange(event: any) {
  76. const type = event.detail.value;
  77. this.setData({ currentTab: type });
  78. this.filterOrdersList(type);
  79. },
  80. // 获取列表数据
  81. async getOrderList(progress: string) {
  82. const patientId = wx.getStorageSync("patientId");
  83. if (!patientId) {
  84. getTickleContext.call(this).showWarnMessage("请先登录");
  85. return;
  86. }
  87. const res = await orderListMethod(patientId, progress);
  88. if (res && res.data) {
  89. res.data.forEach((item: any) => {
  90. item.address = `${item.provinceName}${item.cityName}${item.areaName}${item.detailAddress}`;
  91. item.liaison =
  92. item.liaison !== null && item.liaison !== undefined
  93. ? item.liaison
  94. : "";
  95. item.phone =
  96. item.phone !== null && item.phone !== undefined ? item.phone : "";
  97. if (
  98. !item.provinceName ||
  99. !item.cityName ||
  100. !item.areaName ||
  101. !item.detailAddress ||
  102. !item.liaison ||
  103. !item.phone
  104. ) {
  105. item.showAddress = false;
  106. } else {
  107. item.showAddress = true;
  108. }
  109. if (item.items && Array.isArray(item.items)) {
  110. item.items = item.items.map((subItem: any) => {
  111. return {
  112. id: subItem.id || '',
  113. name: subItem.conditioningProgramName || '',
  114. description: (() => {
  115. const dose = subItem?.convertDose ?? '1';
  116. const unit = subItem?.convertUnit ?? '次';
  117. return `${dose} ${unit}`;
  118. })(),
  119. photo: subItem.conditioningProgramPhoto || '',
  120. price: subItem.unitPrice || 0,
  121. quantity: subItem?.totalMeasure || 0,
  122. }
  123. });
  124. }
  125. });
  126. // 批量初始化展开状态为false(默认折叠)
  127. const expandedItems: Record<string, boolean> = {};
  128. res.data.forEach((item: any) => {
  129. if (!this.data.expandedItems[item.id]) {
  130. expandedItems[item.id] = false;
  131. }
  132. });
  133. if (Object.keys(expandedItems).length > 0) {
  134. this.setData({ expandedItems: { ...this.data.expandedItems, ...expandedItems } });
  135. }
  136. this.setData({ orders: res.data });
  137. }
  138. },
  139. // 过滤订单l列表
  140. filterOrdersList(type: any) {
  141. // 根据当前选中的标签过滤订单
  142. switch (type) {
  143. // 全部订单
  144. case "all":
  145. this.getOrderList("");
  146. break;
  147. // 待付款订单
  148. case "pending":
  149. this.getOrderList("0");
  150. break;
  151. // 已付款订单
  152. case "paid":
  153. this.getOrderList("6");
  154. break;
  155. // 交易完成订单
  156. case "completed":
  157. this.getOrderList("345");
  158. break;
  159. // 交易关闭订单
  160. case "closed":
  161. this.getOrderList("2");
  162. break;
  163. default:
  164. break;
  165. }
  166. },
  167. // 订单支付
  168. onPay: function (event: any) {
  169. return this.throttle(
  170. async (e: any) => {
  171. const orderId = e.currentTarget.dataset.id;
  172. if (this.data.payingId) return; // 防重复
  173. this.setData({ paying: true, payingId: orderId });
  174. try {
  175. // 调用支付接口
  176. const payResult = await orderPayMethod(orderId);
  177. if (payResult && payResult.data) {
  178. const paymentParams = payResult.data;
  179. handleWeChatPayment(paymentParams, (res: any) => {
  180. // 支付成功,跳转到成功页面
  181. wx.redirectTo({
  182. url: "/module/article/pages/success-page/success-page?title=订单支付成功",
  183. });
  184. }, (error: any) => {
  185. this.setData({ paying: false, payingId: '' });
  186. if (error.errMsg === 'requestPayment:fail cancel') {
  187. wx.showToast({
  188. title: "支付已取消",
  189. icon: "none",
  190. });
  191. } else {
  192. wx.showToast({
  193. title: error.errMsg || "支付失败,请重试",
  194. icon: "none",
  195. });
  196. }
  197. });
  198. } else {
  199. wx.showToast({
  200. title: payResult.errMsg,
  201. icon: "none",
  202. });
  203. }
  204. } catch (error: any) {
  205. wx.showToast({
  206. title: error.errMsg,
  207. icon: "none",
  208. });
  209. } finally {
  210. this.setData({ paying: false, payingId: '' });
  211. }
  212. },
  213. 2000,
  214. "pay"
  215. )(event);
  216. },
  217. // 查看物流
  218. onSeeLogistics: function (e: any) {
  219. return this.throttle(
  220. (event: any) => {
  221. wx.showToast({
  222. title: "暂未开通",
  223. icon: "none",
  224. });
  225. },
  226. 2000,
  227. "logistics"
  228. )(e);
  229. },
  230. // 切换地址
  231. changeAddress: function (e: any) {
  232. return this.throttle(
  233. (event: any) => {
  234. const orderStatus = event.currentTarget.dataset.status;
  235. const id = event.currentTarget.dataset.id;
  236. // 根据订单状态判断是否可以切换地址. 待付款状态下可以切换地址
  237. if (orderStatus === "0") {
  238. wx.navigateTo({
  239. url:
  240. "/module/article/pages/manage-address/manage-address?type=orderList&orderId=" +
  241. id,
  242. });
  243. }
  244. },
  245. 2000,
  246. "changeAddress"
  247. )(e);
  248. },
  249. // 打开取消订单弹窗
  250. onCancel: function (event: any) {
  251. return this.throttle(
  252. (e: any) => {
  253. const orderId = e.currentTarget.dataset.id;
  254. // 处理订单取消逻辑
  255. this.setData({ id: orderId });
  256. this.setData({ showConfirm: true });
  257. },
  258. 2000,
  259. "cancel"
  260. )(event);
  261. },
  262. // 取消订单
  263. async cancelOrder(id: string) {
  264. this.setData({ showConfirm: true });
  265. try {
  266. await orderCancelMethod(id);
  267. /* 取消订单逻辑 */
  268. this.setData({ showConfirm: false });
  269. wx.navigateTo({
  270. url: "/module/article/pages/success-page/success-page?title=订单取消成功",
  271. });
  272. } catch (error: any) {
  273. getTickleContext.call(this).showWarnMessage(error.errMsg);
  274. }
  275. },
  276. // 确认取消订单
  277. confirmCancelDialog() {
  278. this.cancelOrder(this.data.id);
  279. },
  280. // 关闭取消订单弹窗
  281. closeDialog() {
  282. this.setData({ showConfirm: false });
  283. },
  284. // 确认收货
  285. onConfirmReceiving: function (e: any) {
  286. return this.throttle(
  287. (event: any) => {
  288. const orderId = event.currentTarget.dataset.id;
  289. wx.navigateTo({
  290. url: `/module/article/pages/confirm-receiving/confirm-receiving?orderId=${orderId}`,
  291. });
  292. },
  293. 2000,
  294. "confirmReceiving"
  295. )(e);
  296. },
  297. // 切换地址
  298. onChangeAddress(e: any) {
  299. const orderId = e.currentTarget.dataset.id;
  300. // 打开地址选择器,选择后更新对应订单的地址
  301. // 伪代码
  302. wx.chooseAddress({
  303. success: (res) => {
  304. // 假设你有 orders 数组
  305. const idx = this.data.orders.findIndex(
  306. (o: any) => o.orderId === orderId
  307. );
  308. if (idx !== -1) {
  309. this.setData({
  310. [`orders[${idx}].address`]: res.detailInfo,
  311. });
  312. }
  313. },
  314. });
  315. },
  316. // 订单详情
  317. onOrderDetail(e: any) {
  318. const id = e.currentTarget.dataset.id;
  319. const status = e.currentTarget.dataset.status;
  320. if (status === '0') {
  321. wx.navigateTo({
  322. url: `/module/order/pages/order-detail/order-detail?id=${id}&status=${status}`,
  323. });
  324. } else {
  325. wx.navigateTo({
  326. url: `/module/order/pages/other-detail/other-detail?id=${id}&status=${status}`,
  327. });
  328. }
  329. },
  330. //回到我的页面
  331. goMine() {
  332. wx.redirectTo({
  333. url: "/pages/mine/mine",
  334. });
  335. },
  336. // 切换服务包展开/收起
  337. toggleServicePackages(e: any) {
  338. const orderId = e.currentTarget.dataset.id;
  339. const currentExpanded = this.data.expandedItems[orderId] || false;
  340. this.setData({
  341. [`expandedItems[${orderId}]`]: !currentExpanded,
  342. });
  343. },
  344. });