小程序订单详情筛选条件完成

2023-03-21 14:53:33 +08:00 · 2023-03-21 14:53:33 +08:00 · 87eaf03b9d
commit 87eaf03b9d
parent c9f171e5d5
8 changed files with 166 additions and 67 deletions
--- a/backend/microservice-provider-shop-8003/src/main/java/com/cxyxiaomo/epp/shop/controller/OrderController.java
+++ b/backend/microservice-provider-shop-8003/src/main/java/com/cxyxiaomo/epp/shop/controller/OrderController.java
@ -2,6 +2,7 @@ package com.cxyxiaomo.epp.shop.controller;

 import com.alibaba.fastjson2.JSONArray;
 import com.alibaba.fastjson2.JSONObject;
+import com.cxyxiaomo.epp.common.enums.OrderStatus;
 import com.cxyxiaomo.epp.common.pojo.Order;
 import com.cxyxiaomo.epp.common.pojo.OrderDetail;
 import com.cxyxiaomo.epp.common.response.Res;
@ -13,10 +14,7 @@ import com.cxyxiaomo.epp.shop.service.OrderService;
 import org.springframework.web.bind.annotation.*;

 import javax.annotation.Resource;
-import java.util.HashMap;
-import java.util.LinkedList;
-import java.util.List;
-import java.util.Map;
+import java.util.*;
 import java.util.stream.Collectors;

@RestController
@ -130,12 +128,25 @@ public class OrderController {
     */
    @GetMapping("/miniprogram/listUserOrder")
    @ResponseBody
-    public Res listUserOrder(@RequestParam Integer userId) {
+    public Res listUserOrder(@RequestParam Integer userId,
+                             @RequestParam(value = "filter", required = false) String orderStatusFilter) {
        if (userId == null) {
            return Res.error("参数错误");
        }
-        List<Order> orders = orderService.listUserOrder(userId);
+        List<Order> orders = orderService.listUserOrder(userId, orderStatusFilter);
        List<OrderVO> orderVOS = OrderVO.convertFrom(orders);
-        return Res.success(orderVOS);
+
+        HashMap<String, Object> map = new HashMap<>();
+
+
+        JSONObject filter = new JSONObject();
+        Arrays.stream(OrderStatus.values())
+                .forEach(orderStatus -> filter.put(orderStatus.getValue(), orderStatus.toString()));
+        // List<String> filter = Arrays.stream(OrderStatus.values())
+        //         .map(OrderStatus::toString).collect(Collectors.toList());
+
+        map.put("filter", filter);
+        map.put("orders", orderVOS);
+        return Res.success(map);
    }
 }
--- a/backend/microservice-provider-shop-8003/src/main/java/com/cxyxiaomo/epp/shop/dao/OrderDao.java
+++ b/backend/microservice-provider-shop-8003/src/main/java/com/cxyxiaomo/epp/shop/dao/OrderDao.java
@ -32,9 +32,10 @@ public interface OrderDao {
     * 根据用户 ID 查询订单列表
     *
     * @param userId
+     * @param orderStatus
     * @return
     */
-    List<Order> listOrderByUserId(Integer userId);
+    List<Order> listOrderByUserId(@Param("userId") Integer userId, @Param("orderStatus") String orderStatus);

    /**
     * 创建订单
--- a/backend/microservice-provider-shop-8003/src/main/java/com/cxyxiaomo/epp/shop/service/OrderService.java
+++ b/backend/microservice-provider-shop-8003/src/main/java/com/cxyxiaomo/epp/shop/service/OrderService.java
@ -105,8 +105,8 @@ public class OrderService {
     * @param userId
     * @return
     */
-    public List<Order> listUserOrder(Integer userId) {
-        List<Order> orders = orderDao.listOrderByUserId(userId);
+    public List<Order> listUserOrder(Integer userId, String orderStatus) {
+        List<Order> orders = orderDao.listOrderByUserId(userId, orderStatus);
        return orders;
    }
 }
--- a/backend/microservice-provider-shop-8003/src/main/resources/mybatis/mapper/OrderMapper.xml
+++ b/backend/microservice-provider-shop-8003/src/main/resources/mybatis/mapper/OrderMapper.xml
@ -37,6 +37,9 @@
        SELECT *
        FROM `order`
        WHERE user_id = #{userId}
+        <if test="orderStatus != null and orderStatus != ''">
+            AND order_status = #{orderStatus}
+        </if>
        order by order_date desc
    </select>

--- a/weixin-miniprogram/pages/shop/myOrder.js
+++ b/weixin-miniprogram/pages/shop/myOrder.js
@ -9,6 +9,12 @@ Page({
   * 页面的初始数据
   */
  data: {
+    filterActiveId: '',
+    filterActiveName: '',
+    filterList: [],
+
+    filterPirckerIndex: 0,
+
    orderList: [],
  },

@ -68,12 +74,61 @@ Page({

  },

+  // filterRadioChange(e) {
+  //   console.log("e.detail.value", e.detail.value)
+  //   this.setData({
+  //     filterActiveId: e.detail.value,
+  //   })
+  //   this.updatePageData()
+  // },
+
+  filterPickerChange(e) {
+    console.log("e.detail.value", e.detail.value)
+    let filter = this.data.filterList[e.detail.value]
+    console.log("filterActiveId", filter.id)
+    console.log("filterActiveName", filter.name)
+    this.setData({
+      filterActiveId: filter.id,
+      filterActiveName: filter.name
+    })
+    this.updatePageData()
+  },
+
  loadPageData() {
    (async () => {
-      let orderList = await orderService.listUserOrder()
-      console.log("orderList", orderList)
+      let userOrder = await orderService.listUserOrder()
+      console.log("userOrder", userOrder)
+      let filterList = Object.keys(userOrder.filter).map(key => {
+        return {
+          id: key,
+          name: userOrder.filter[key],
+        }
+      })
+      filterList.unshift({
+        id: '',
+        name: "全部",
+      })
+      console.log("filterList", filterList)
      this.setData({
-        orderList: orderList.map(order => {
+        filterList: filterList,
+        filterActiveName: "全部",
+        orderList: userOrder.orders.map(order => {
+          order.displayDate = order.orderDate.replace("T", " ")
+          return order
+        })
+      })
+    })();
+  },
+
+  updatePageData() {
+    this.setData({
+      orderList: [],
+    });
+    (async () => {
+      let userOrder = await orderService.listUserOrder(this.data.filterActiveId)
+      console.log("userOrder", userOrder)
+      this.setData({
+        orderList: userOrder.orders.map(order => {
          order.displayDate = order.orderDate.replace("T", " ")
          return order
        })
--- a/weixin-miniprogram/pages/shop/myOrder.wxml
+++ b/weixin-miniprogram/pages/shop/myOrder.wxml
@ -1,17 +1,34 @@
 <!--pages/shop/myOrder.wxml-->
-<view class="container">
-<view class="order-card" wx:for="{{orderList}}" wx:for-item="item" wx:key="id">
-  <view>
-    <text class="order-info-key">订单号：</text>
-    <text>{{ item.id }}</text>
-  </view>
-  <view>
-    <text class="order-info-key">创建时间：</text>
-    <text>{{ item.displayDate }}</text>
-  </view>
-  <view>
-    <text class="order-info-key">订单状态：</text>
-    <text>{{ item.orderStatus }}</text>
-  </view>
+
+<!-- 筛选条件 -->
+<view class="filterbar">
+  <!-- <radio-group bindchange="filterRadioChange" data-item="{{filter}}">
+      <label class="radio-item" wx:for="{{filterList}}" wx:for-item="filter" wx:key="id">
+        <radio value="{{filter.id}}" checked="{{ filter.id == filterActiveId }}" />{{filter.name}}
+      </label>
+    </radio-group> -->
+  <picker range="{{filterList}}" range-key="name" value="{{filterPirckerIndex}}" bindchange="filterPickerChange">
+    <view class="picker">
+      订单状态(点击筛选)：{{filterActiveName}}
+    </view>
+  </picker>
 </view>
+
+<view class="container">
+
+  <!-- 订单列表 -->
+  <view class="order-card" wx:for="{{orderList}}" wx:for-item="item" wx:key="id">
+    <view>
+      <text class="order-info-key">订单号：</text>
+      <text>{{ item.id }}</text>
+    </view>
+    <view>
+      <text class="order-info-key">创建时间：</text>
+      <text>{{ item.displayDate }}</text>
+    </view>
+    <view>
+      <text class="order-info-key">订单状态：</text>
+      <text>{{ item.orderStatus }}</text>
+    </view>
+  </view>
 </view>
--- a/weixin-miniprogram/pages/shop/myOrder.wxss
+++ b/weixin-miniprogram/pages/shop/myOrder.wxss
@ -1,6 +1,17 @@
 /* pages/shop/myOrder.wxss */
+.filterbar {
+  position: fixed;
+  top: 0;
+  width: 100%;
+  padding: 10px 20px;
+  background-color: white;
+  border: 1px solid black;
+}
+
 .container {
  padding: 20px 8vw;
+
+  margin-top: 30px;
 }

 .order-card {
--- a/weixin-miniprogram/services/order.js
+++ b/weixin-miniprogram/services/order.js
@ -1,40 +1,41 @@
-/* eslint-disable no-param-reassign */
-
-const send_request = require('../utils/sendRequest')
-
-/** 商品下单 */
-export function createOrder(orderList) {
-  let userInfo = wx.getStorageSync("userInfo")
-  // orderList 结构为 [ { goodId, count }, ... ]
-  return send_request({
-    url: '/shop/order/miniprogram/createOrder',
-    method: "POST",
-    data: {
-      "userId": userInfo.id,
-      "orderList": orderList
-    }
-  })
-}
-
-/** 获取订单详情 */
-export function getOrderDetail(orderId) {
-  return send_request({
-    url: '/shop/order/miniprogram/orderDetail',
-    method: "GET",
-    data: {
-      "orderId": orderId
-    }
-  })
-}
-
-/** 我的订单 */
-export function listUserOrder() {
-  let userInfo = wx.getStorageSync("userInfo")
-  return send_request({
-    url: '/shop/order/miniprogram/listUserOrder',
-    method: "GET",
-    data: {
-      "userId": userInfo.id,
-    }
-  })
-}
+/* eslint-disable no-param-reassign */
+
+const send_request = require('../utils/sendRequest')
+
+/** 商品下单 */
+export function createOrder(orderList) {
+  let userInfo = wx.getStorageSync("userInfo")
+  // orderList 结构为 [ { goodId, count }, ... ]
+  return send_request({
+    url: '/shop/order/miniprogram/createOrder',
+    method: "POST",
+    data: {
+      "userId": userInfo.id,
+      "orderList": orderList
+    }
+  })
+}
+
+/** 获取订单详情 */
+export function getOrderDetail(orderId) {
+  return send_request({
+    url: '/shop/order/miniprogram/orderDetail',
+    method: "GET",
+    data: {
+      "orderId": orderId
+    }
+  })
+}
+
+/** 我的订单 */
+export function listUserOrder(filter) {
+  let userInfo = wx.getStorageSync("userInfo")
+  return send_request({
+    url: '/shop/order/miniprogram/listUserOrder',
+    method: "GET",
+    data: {
+      "userId": userInfo.id,
+      "filter": filter || "",
+    }
+  })
+}