From a5df9da99bfe74db40e5a4a16060a9308d3faafa Mon Sep 17 00:00:00 2001
From: Puqns67 <me@puqns67.icu>
Date: Thu, 21 Sep 2023 08:40:23 +0800
Subject: [PATCH] add page orders

Signed-off-by: Puqns67 <me@puqns67.icu>
---
 .../fruitable/controller/page/OrderPage.kt    | 15 +++++++
 .../datebase/repository/OrderRepository.kt    |  5 ++-
 src/main/resources/static/scripts/redirect.js |  6 +++
 src/main/resources/static/styles/order.less   |  4 --
 src/main/resources/static/styles/orders.less  | 42 +++++++++++++++++++
 src/main/resources/templates/cart.mustache    |  6 ---
 src/main/resources/templates/orders.mustache  | 24 +++++++++++
 7 files changed, 91 insertions(+), 11 deletions(-)

diff --git a/src/main/kotlin/team8/fruitable/controller/page/OrderPage.kt b/src/main/kotlin/team8/fruitable/controller/page/OrderPage.kt
index 207e846..685e0fb 100644
--- a/src/main/kotlin/team8/fruitable/controller/page/OrderPage.kt
+++ b/src/main/kotlin/team8/fruitable/controller/page/OrderPage.kt
@@ -10,6 +10,7 @@ import org.springframework.web.bind.annotation.RequestParam
 import org.springframework.web.servlet.mvc.support.RedirectAttributes
 import team8.fruitable.controller.util.error
 import team8.fruitable.datebase.entity.Item
+import team8.fruitable.datebase.entity.Order
 import team8.fruitable.datebase.entity.User
 import team8.fruitable.datebase.repository.*
 
@@ -32,6 +33,20 @@ class OrderPage(
     ): String {
         model["isOrder"] = true
         val user = this.getCurrentUser(token) ?: return error(attributes, "查看订单列表", "账户未登录", "/login")
+        val orders = orderRepository.findByUser(user)
+        val result: MutableList<Triple<Order, String, String>> = mutableListOf()
+        orders.forEach { order ->
+            val names: MutableList<String> = mutableListOf()
+            order.items.forEach { names.add(it.name!!) }
+            result.add(
+                Triple(
+                    order,
+                    names.joinToString(", "),
+                    order.items.getOrNull(0)?.getPictureLink() ?: "/images/placeholder.png"
+                )
+            )
+        }
+        model["orders"] = result
         model["user"] = user
         return "orders"
     }
diff --git a/src/main/kotlin/team8/fruitable/datebase/repository/OrderRepository.kt b/src/main/kotlin/team8/fruitable/datebase/repository/OrderRepository.kt
index d8b6e99..d436a6b 100644
--- a/src/main/kotlin/team8/fruitable/datebase/repository/OrderRepository.kt
+++ b/src/main/kotlin/team8/fruitable/datebase/repository/OrderRepository.kt
@@ -2,5 +2,8 @@ package team8.fruitable.datebase.repository
 
 import org.springframework.data.repository.CrudRepository
 import team8.fruitable.datebase.entity.Order
+import team8.fruitable.datebase.entity.User
 
-interface OrderRepository : CrudRepository<Order, Long>
+interface OrderRepository : CrudRepository<Order, Long> {
+    fun findByUser(user: User): List<Order>
+}
diff --git a/src/main/resources/static/scripts/redirect.js b/src/main/resources/static/scripts/redirect.js
index 9298fc2..a575336 100644
--- a/src/main/resources/static/scripts/redirect.js
+++ b/src/main/resources/static/scripts/redirect.js
@@ -10,4 +10,10 @@ window.addEventListener("DOMContentLoaded", () => {
             window.location.href = `/items/${v.getAttribute("tagid")}`
         })
     });
+
+    document.querySelectorAll("*[orderid]").forEach((v) => {
+        v.addEventListener("click", function () {
+            window.location.href = `/order/${v.getAttribute("orderid")}`
+        })
+    });
 });
diff --git a/src/main/resources/static/styles/order.less b/src/main/resources/static/styles/order.less
index bfbc6fa..36ba2cd 100644
--- a/src/main/resources/static/styles/order.less
+++ b/src/main/resources/static/styles/order.less
@@ -30,10 +30,6 @@
             display: flex;
             flex-direction: row;
             justify-content: space-between;
-
-            > .Title {
-
-            }
         }
     }
 }
diff --git a/src/main/resources/static/styles/orders.less b/src/main/resources/static/styles/orders.less
index e69de29..b99df20 100644
--- a/src/main/resources/static/styles/orders.less
+++ b/src/main/resources/static/styles/orders.less
@@ -0,0 +1,42 @@
+.TabForm {
+    width: 640px;
+}
+
+.Order {
+    margin-top: 10px;
+    margin-bottom: 10px;
+    border-radius: 15px;
+    background-color: teal;
+
+    > .Picture {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+
+        > img {
+            border-radius: 15px;
+            width: 100px;
+            height: 100px;
+        }
+    }
+
+    > .Infos {
+        display: flex;
+        flex: 1;
+        flex-direction: column;
+        padding: 5px 10px;
+        color: wheat;
+
+        > .Info {
+            display: flex;
+            flex-direction: column;
+            justify-content: space-between;
+        }
+    }
+}
+
+@media (min-width: 640px) {
+    #Contents {
+        width: 640px;
+    }
+}
diff --git a/src/main/resources/templates/cart.mustache b/src/main/resources/templates/cart.mustache
index 5c71b29..2dd84b9 100644
--- a/src/main/resources/templates/cart.mustache
+++ b/src/main/resources/templates/cart.mustache
@@ -76,12 +76,6 @@
             {{/items}}
         </div>
 
-        <div class="TabFormItems Items">
-            <div class="TabFormItem">
-
-            </div>
-        </div>
-
         <div class="TabButtons">
             <button class="TabButton" type="submit">创建订单</button>
         </div>
diff --git a/src/main/resources/templates/orders.mustache b/src/main/resources/templates/orders.mustache
index 9206175..0ed6c98 100644
--- a/src/main/resources/templates/orders.mustache
+++ b/src/main/resources/templates/orders.mustache
@@ -6,11 +6,14 @@
     <script type="text/javascript" src="/scripts/header.js"></script>
     <script type="text/javascript" src="/scripts/clock.js"></script>
     <script type="text/javascript" src="/scripts/top.js"></script>
+    <script type="text/javascript" src="/scripts/redirect.js"></script>
     <link type="image/x-icon" rel="icon" href="/images/favicon.ico">
     <!-- 页面公共的样式表 -->
     <link type="text/css" rel="stylesheet/less" href="/styles/header.less">
     <link type="text/css" rel="stylesheet" href="/styles/clock.css">
     <link type="text/css" rel="stylesheet" href="/styles/top.css">
+    <link type="text/css" rel="stylesheet/less" href="/styles/form.less">
+    <link type="text/css" rel="stylesheet/less" href="/styles/base.less">
     <!-- 页面特定的样式表 -->
     <link type="text/css" rel="stylesheet/less" href="/styles/orders.less">
     <!-- 外部小组件 -->
@@ -25,6 +28,27 @@
 
 <!-- 页面内容 -->
 <div id="Contents">
+    <div class="TabForm">
+        <div class="TabTitle">我的订单</div>
+
+        <div class="TabFormItems Orders">
+            {{#orders}}
+                <div class="TabFormItem Order" orderid="{{first.id}}">
+                    <div class="Picture">
+                        <img alt="商品图片" src="{{third}}">
+                    </div>
+                    <div class="Infos">
+                        <div class="Info">
+                            <div class="Title">{{second}}</div>
+                            <div class="TimeCreate">创建时间：{{first.createTime}}</div>
+                            <div class="TimeEdit">更新时间：{{first.editTime}}</div>
+                            <div class="PriceSum">总价格：{{first.priceSum}}</div>
+                        </div>
+                    </div>
+                </div>
+            {{/orders}}
+        </div>
+    </div>
 </div>
 
 </body>