add register feature

client/package.json

@@ -8,7 +8,10 @@
     "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs --fix --ignore-path .gitignore"
   },
   "dependencies": {
+    "axios": "^0.27.2",
     "pinia": "^2.0.17",
+    "sweetalert": "^2.1.2",
+    "sweetalert2": "^11.4.28",
     "vue": "^3.2.37",
     "vue-router": "^4.1.3"
   },

client/src/components/ProductCard.vue

@@ -4,7 +4,7 @@
 <template>
   <div class="col-12 col-md-3 py-4">
     <div class="card">
-      <img src="product.imgUrl" class="card-img-top" />
+      <img src="https://d1sag4ddilekf6.azureedge.net/compressed_webp/items/6-CZKUTTNENCDKJE-CZKUTTNFCBJERT/detail/menueditor_item_8b40b72d70604f82a5ced870fa1c160f_1632546311834810509.webp" class="card-img-top" />
       <div class="card-body">
         <h5 class="card-title">product.id -product.name </h5>
         <p class="card-text">product.description</p>

client/src/stores/useAllStore.js

@@ -1,9 +1,14 @@
 import { defineStore } from "pinia";
+import axios from "axios";
+import router from "../router";
+import swal from "sweetalert";
 
+const baseUrl = "http://localhost:3000";
 export const useAllStore = defineStore({
   id: "useAllStore",
   state: () => ({
     counter: 0,
+    isLogin: false,
   }),
   getters: {
     doubleCount: (state) => state.counter * 2,
@@ -12,5 +17,49 @@ export const useAllStore = defineStore({
     increment() {
       this.counter++;
     },
+
+    errorShow(err) {
+      if (Array.isArray(err.response.data)) {
+        console.log("masuk pertama");
+        let message = err.response.data.map((m) => m).join("\n");
+        swal({
+          title: err.response.status + " " + err.response.statusText,
+          text: message,
+          icon: "error",
+        });
+      } else {
+        swal({
+          title: err.response.status + " " + err.response.statusText,
+          text: err.response.data.message,
+          icon: "error",
+        });
+      }
+    },
+
+    successShow(success) {
+      swal({
+        title: success.response.status + " " + success.response.statusText,
+        text: success.response.data.message,
+        icon: "success",
+      });
+    },
+
+    async registerHandler(email, password) {
+      try {
+        const { data } = await axios({
+          method: "post",
+          url: `${baseUrl}/register`,
+          data: {
+            email: email,
+            password: password,
+          },
+        });
+
+        router.push({ name: "login" });
+      } catch (error) {
+        console.log(error);
+        this.errorShow(error);
+      }
+    },
   },
 });