cart page

mobile/lib/main.dart

@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import 'package:mobile/repos/cart.dart';
 import 'package:mobile/repos/product.dart';
 import 'package:provider/provider.dart';
 import 'pages/landing_page.dart';
@@ -15,36 +16,24 @@ class MyApp extends StatelessWidget {
   Widget build(BuildContext context) {
     return MultiProvider(
       providers: [
+        ChangeNotifierProvider(create: (_) => BottomNavigationBarRepo()),
         ChangeNotifierProvider(create: (_) => ProductRepo()),
-        ChangeNotifierProvider(create: (_) => BottomNavigationBarRepo())
+        ChangeNotifierProvider(create: (_) => CartRepo()),
       ],
       child: MaterialApp(
         title: 'Fresh Plaza',
         theme: ThemeData(
           colorScheme: ColorScheme.fromSeed(seedColor: Colors.blue),
-          scaffoldBackgroundColor: const Color(0xECF6F0FF),
+          scaffoldBackgroundColor: const Color(0xFFDFDFDF),
+          textTheme: const TextTheme(
+            headlineLarge: TextStyle(color: Color(0xFF000000), fontSize: 64),
+            bodyLarge: TextStyle(color: Color(0xFF000000), fontSize: 20),
+            bodyMedium: TextStyle(color: Color(0xFF000000), fontSize: 16),
+          ),
           useMaterial3: true,
         ),
-        home: const MyHomePage(title: 'Fresh Plaza'),
+        home: const LandingPage(),
       ),
     );
   }
 }
-
-class MyHomePage extends StatefulWidget {
-  const MyHomePage({super.key, required this.title});
-
-  final String title;
-
-  @override
-  State<MyHomePage> createState() => _MyHomePageState();
-}
-
-class _MyHomePageState extends State<MyHomePage> {
-  @override
-  Widget build(BuildContext context) {
-    return const Scaffold(
-      body: LandingPage(),
-    );
-  }
-}

mobile/lib/pages/all_products_page.dart

@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:mobile/repos/product.dart';
+import 'package:mobile/widgets/primary_card.dart';
 import 'package:provider/provider.dart';
 import 'product_page.dart';
 
@@ -17,13 +18,7 @@ class ProductListItem extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Container(
+    return PrimaryCard(
-      margin: const EdgeInsets.all(10),
-      height: 100,
-      decoration: BoxDecoration(
-          color: const Color(0xFFFFFFFF),
-          border: Border.all(color: const Color(0xFF666666)),
-          borderRadius: const BorderRadius.all(Radius.circular(10))),
       child: ElevatedButton(
           style: ButtonStyle(
               backgroundColor: WidgetStateProperty.all(Colors.transparent),
@@ -45,16 +40,9 @@ class ProductListItem extends StatelessWidget {
                     mainAxisAlignment: MainAxisAlignment.spaceBetween,
                     crossAxisAlignment: CrossAxisAlignment.start,
                     children: [
-                      Text(
+                      Text(name, style: Theme.of(context).textTheme.bodyLarge),
-                        name,
+                      Text("${price.toString()} kr",
-                        style:
+                          style: Theme.of(context).textTheme.bodyMedium),
-                            const TextStyle(fontSize: 20, color: Colors.black),
-                      ),
-                      Text(
-                        "${price.toString()} kr",
-                        style:
-                            const TextStyle(fontSize: 16, color: Colors.black),
-                      )
                     ],
                   )),
               ClipRRect(

mobile/lib/pages/cart_page.dart

@@ -1,10 +1,158 @@
 import 'package:flutter/material.dart';
+import 'package:mobile/repos/cart.dart';
+import 'package:mobile/widgets/primary_button.dart';
+import 'package:mobile/widgets/primary_card.dart';
+import 'package:provider/provider.dart';
+
+class CartItemView extends StatelessWidget {
+  final CartRepo cartRepo;
+  final int productId;
+  final String name;
+  final int price;
+  final String imagePath;
+  final int amount;
+
+  const CartItemView(
+      {super.key,
+      required this.cartRepo,
+      required this.productId,
+      required this.name,
+      required this.price,
+      required this.imagePath,
+      required this.amount});
+
+  @override
+  Widget build(BuildContext context) {
+    return PrimaryCard(
+      child: Row(
+        children: [
+          Expanded(
+            child: Container(
+                padding: const EdgeInsets.all(10),
+                child: Row(
+                  children: [
+                    Expanded(
+                      child: Column(
+                        crossAxisAlignment: CrossAxisAlignment.start,
+                        children: [
+                          Expanded(
+                            child: Text(name,
+                                style: Theme.of(context).textTheme.bodyLarge),
+                          ),
+                          Text("$price kr",
+                              style: Theme.of(context).textTheme.bodyMedium),
+                        ],
+                      ),
+                    ),
+                    Row(
+                      children: [
+                        Column(
+                          children: [
+                            Expanded(
+                              child: Text("$amount stk",
+                                  style: Theme.of(context).textTheme.bodyLarge),
+                            ),
+                            Row(
+                              children: [
+                                IconButton(
+                                    onPressed: () {
+                                      cartRepo.incrementAmount(productId);
+                                    },
+                                    icon: const Icon(Icons.add)),
+                                IconButton(
+                                    onPressed: () {
+                                      cartRepo.decrementAmount(productId);
+                                    },
+                                    icon: const Icon(Icons.remove))
+                              ],
+                            ),
+                          ],
+                        )
+                      ],
+                    ),
+                  ],
+                )),
+          ),
+          IconButton(
+              onPressed: () {
+                cartRepo.removeCartItem(cartRepo.withProductId(productId));
+              },
+              icon: const Icon(Icons.delete_outline)),
+          Image(width: 100, image: AssetImage(imagePath))
+        ],
+      ),
+    );
+  }
+}
 
 class CartPage extends StatelessWidget {
   const CartPage({super.key});
 
   @override
   Widget build(BuildContext context) {
-    return Row();
+    return Column(
+      children: [
+        Expanded(
+          child: Consumer<CartRepo>(
+            builder: (_, cartRepo, __) {
+              final cart = cartRepo.allCartItems();
+              return ListView.builder(
+                shrinkWrap: true,
+                itemBuilder: (_, idx) => CartItemView(
+                    cartRepo: cartRepo,
+                    productId: cart[idx].product.id,
+                    name: cart[idx].product.name,
+                    price: cart[idx].product.price,
+                    imagePath: "assets/${cart[idx].product.name}.png",
+                    amount: cart[idx].amount),
+                itemCount: cart.length,
+              );
+            },
+          ),
+        ),
+        Container(
+          decoration: const BoxDecoration(color: Color(0xFFFFFFFF), boxShadow: [
+            BoxShadow(
+              blurRadius: 10,
+              spreadRadius: -4,
+            )
+          ]),
+          padding: const EdgeInsets.all(10),
+          child: Column(
+            children: [
+              Row(
+                children: [
+                  Expanded(
+                    child: Container(
+                      margin: const EdgeInsets.only(right: 10),
+                      child: PrimaryButton(
+                          onPressed: () {}, child: const Text("Indtast vare")),
+                    ),
+                  ),
+                  Expanded(
+                    child: Container(
+                      margin: const EdgeInsets.only(left: 10),
+                      child: PrimaryButton(
+                          onPressed: () {}, child: const Text("Skan vare")),
+                    ),
+                  ),
+                ],
+              ),
+              Row(
+                children: [
+                  Expanded(
+                    child: Container(
+                      margin: const EdgeInsets.only(top: 10),
+                      child: PrimaryButton(
+                          onPressed: () {}, child: const Text("Afslut indkøb")),
+                    ),
+                  ),
+                ],
+              ),
+            ],
+          ),
+        ),
+      ],
+    );
   }
 }

mobile/lib/pages/landing_page.dart

@@ -8,25 +8,28 @@ class LandingPage extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Row(mainAxisAlignment: MainAxisAlignment.center, children: [
+    return Scaffold(
-      Column(
+      body: Row(mainAxisAlignment: MainAxisAlignment.center, children: [
-        mainAxisAlignment: MainAxisAlignment.center,
+        Column(
-        children: [
+          mainAxisAlignment: MainAxisAlignment.center,
-          const Text("Fresh Plaza", style: TextStyle(fontSize: 64.0)),
+          children: [
-          PrimaryButton(
+            Text("Fresh Plaza",
-              onPressed: () => {
+                style: Theme.of(context).textTheme.headlineLarge),
-                    Navigator.of(context).push(MaterialPageRoute(
+            PrimaryButton(
-                        builder: (context) => const LogInPage()))
+                onPressed: () => {
-                  },
+                      Navigator.of(context).push(MaterialPageRoute(
-              child: const Text("Log ind")),
+                          builder: (context) => const LogInPage()))
-          PrimaryButton(
+                    },
-              onPressed: () => {
+                child: const Text("Log ind")),
-                    Navigator.of(context).push(MaterialPageRoute(
+            PrimaryButton(
-                        builder: (context) => const RegisterPage()))
+                onPressed: () => {
-                  },
+                      Navigator.of(context).push(MaterialPageRoute(
-              child: const Text("Opret bruger"))
+                          builder: (context) => const RegisterPage()))
-        ],
+                    },
-      )
+                child: const Text("Opret bruger"))
-    ]);
+          ],
+        )
+      ]),
+    );
   }
 }

mobile/lib/pages/log_in_page.dart

@@ -13,9 +13,9 @@ class LogInPage extends StatelessWidget {
       Column(
         mainAxisAlignment: MainAxisAlignment.center,
         children: [
-          const Text(
+          Text(
             "Log ind",
-            style: TextStyle(fontSize: 64),
+            style: Theme.of(context).textTheme.headlineLarge,
           ),
           const PrimaryInput(
               label: "Mail/Tlf", placeholderText: "f.eks. example@example.com"),

mobile/lib/pages/product_page.dart

@@ -57,11 +57,11 @@ class ProductPage extends StatelessWidget {
                   ),
                   Text(
                     product.name,
-                    style: const TextStyle(fontSize: 20),
+                    style: Theme.of(context).textTheme.bodyLarge,
                   ),
                   Text(
                     "${product.price} kr",
-                    style: const TextStyle(fontSize: 16),
+                    style: Theme.of(context).textTheme.bodyLarge,
                   ),
                   Padding(
                     padding: const EdgeInsets.only(top: 20, bottom: 20),

mobile/lib/pages/register_page.dart

@@ -13,9 +13,9 @@ class RegisterPage extends StatelessWidget {
       Column(
         mainAxisAlignment: MainAxisAlignment.center,
         children: [
-          const Text(
+          Text(
             "Opret bruger",
-            style: TextStyle(fontSize: 64),
+            style: Theme.of(context).textTheme.headlineLarge,
           ),
           const PrimaryInput(label: "Fornavn", placeholderText: "Fornavn"),
           const PrimaryInput(

mobile/lib/repos/cart.dart

@@ -0,0 +1,105 @@
+import 'package:flutter/material.dart';
+import 'package:mobile/repos/product.dart';
+
+class ProductIdException implements Exception {}
+
+class CartRepo extends ChangeNotifier {
+  final List<CartItem> cart = [
+    CartItem(
+        product: Product(
+            id: 1,
+            name: "Letmælk",
+            price: 13,
+            description: "Konventionel letmælk med fedtprocent på 1,5%"),
+        amount: 1),
+    CartItem(
+        product: Product(
+            id: 2,
+            name: "Frilands Øko Supermælk",
+            price: 20,
+            description:
+                "Økologisk mælk af frilandskøer med fedtprocent på 3,5%. Ikke homogeniseret eller pasteuriseret. Skaber store muskler og styrker knoglerne 💪"),
+        amount: 6),
+    CartItem(
+        product: Product(
+            id: 1,
+            name: "Letmælk",
+            price: 13,
+            description: "Konventionel letmælk med fedtprocent på 1,5%"),
+        amount: 1),
+    CartItem(
+        product: Product(
+            id: 1,
+            name: "Letmælk",
+            price: 13,
+            description: "Konventionel letmælk med fedtprocent på 1,5%"),
+        amount: 1),
+    CartItem(
+        product: Product(
+            id: 1,
+            name: "Letmælk",
+            price: 13,
+            description: "Konventionel letmælk med fedtprocent på 1,5%"),
+        amount: 1),
+    CartItem(
+        product: Product(
+            id: 1,
+            name: "Letmælk",
+            price: 13,
+            description: "Konventionel letmælk med fedtprocent på 1,5%"),
+        amount: 1),
+    CartItem(
+        product: Product(
+            id: 1,
+            name: "Letmælk",
+            price: 13,
+            description: "Konventionel letmælk med fedtprocent på 1,5%"),
+        amount: 1),
+    CartItem(
+        product: Product(
+            id: 1,
+            name: "Letmælk",
+            price: 13,
+            description: "Konventionel letmælk med fedtprocent på 1,5%"),
+        amount: 1),
+  ];
+
+  List<CartItem> allCartItems() {
+    return cart;
+  }
+
+  CartItem withProductId(int productId) {
+    for (var i = 0; i < cart.length; i++) {
+      if (cart[i].product.id == productId) {
+        return cart[i];
+      }
+    }
+    throw ProductIdException();
+  }
+
+  void incrementAmount(int productId) {
+    var cartItem = withProductId(productId);
+    cartItem.amount++;
+    notifyListeners();
+  }
+
+  void decrementAmount(int productId) {
+    var cartItem = withProductId(productId);
+    if (--cartItem.amount <= 0) {
+      removeCartItem(cartItem);
+    }
+    notifyListeners();
+  }
+
+  void removeCartItem(CartItem cartItem) {
+    cart.remove(cartItem);
+    notifyListeners();
+  }
+}
+
+class CartItem {
+  final Product product;
+  int amount;
+
+  CartItem({required this.product, required this.amount});
+}

mobile/lib/widgets/primary_card.dart

@@ -0,0 +1,17 @@
+import 'package:flutter/material.dart';
+
+class PrimaryCard extends StatelessWidget {
+  final Widget child;
+
+  const PrimaryCard({
+    super.key,
+    required this.child,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return Card(
+      child: SizedBox(height: 100, child: child),
+    );
+  }
+}