From 92fb85b8afaacc4a8b5dbb41eea2d0e35eeb6862 Mon Sep 17 00:00:00 2001
From: Vidhu Kant Sharma <vidhukant@vidhukant.com>
Date: Wed, 4 Oct 2023 20:31:21 +0530
Subject: first commit

---
 src/views/AllBrands.vue    |   9 +++
 src/views/AllCustomers.vue |   7 +++
 src/views/AllItems.vue     |   7 +++
 src/views/HomeView.vue     |   5 ++
 src/views/LogIn.vue        | 139 +++++++++++++++++++++++++++++++++++++++++++++
 src/views/NewCustomer.vue  |   7 +++
 src/views/NewItem.vue      |   7 +++
 src/views/Register.vue     | 106 ++++++++++++++++++++++++++++++++++
 8 files changed, 287 insertions(+)
 create mode 100644 src/views/AllBrands.vue
 create mode 100644 src/views/AllCustomers.vue
 create mode 100644 src/views/AllItems.vue
 create mode 100644 src/views/HomeView.vue
 create mode 100644 src/views/LogIn.vue
 create mode 100644 src/views/NewCustomer.vue
 create mode 100644 src/views/NewItem.vue
 create mode 100644 src/views/Register.vue

(limited to 'src/views')

diff --git a/src/views/AllBrands.vue b/src/views/AllBrands.vue
new file mode 100644
index 0000000..d07e316
--- /dev/null
+++ b/src/views/AllBrands.vue
@@ -0,0 +1,9 @@
+<script setup lang="ts">
+import brandsTable from './../components/brands_table.vue'
+import newBrand from './../components/new_brand.vue'
+</script>
+
+<template>
+  <newBrand />
+  <brandsTable />
+</template>
diff --git a/src/views/AllCustomers.vue b/src/views/AllCustomers.vue
new file mode 100644
index 0000000..ba9096b
--- /dev/null
+++ b/src/views/AllCustomers.vue
@@ -0,0 +1,7 @@
+<script setup lang="ts">
+import clientsTable from './../components/customers_table.vue'
+</script>
+
+<template>
+  <clientsTable />
+</template>
diff --git a/src/views/AllItems.vue b/src/views/AllItems.vue
new file mode 100644
index 0000000..9cf3708
--- /dev/null
+++ b/src/views/AllItems.vue
@@ -0,0 +1,7 @@
+<script setup lang="ts">
+import itemsTable from './../components/items_table.vue'
+</script>
+
+<template>
+  <itemsTable />
+</template>
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
new file mode 100644
index 0000000..6b087a7
--- /dev/null
+++ b/src/views/HomeView.vue
@@ -0,0 +1,5 @@
+<script setup lang="ts"></script>
+
+<template>
+  <h1>OpenBills Home Page</h1>
+</template>
diff --git a/src/views/LogIn.vue b/src/views/LogIn.vue
new file mode 100644
index 0000000..fb9bdcd
--- /dev/null
+++ b/src/views/LogIn.vue
@@ -0,0 +1,139 @@
+<script setup lang="ts">
+import { ref, toRaw } from "vue"
+import { RouterLink, useRouter } from 'vue-router'
+import axios from "axios"
+import { useToast } from 'vue-toast-notification'
+
+const toast = useToast({
+  position: 'top-right'
+})
+
+const router = useRouter()
+
+const isLoading = ref(false)
+const email = ref("")
+const password = ref("")
+
+const login = async (e) => {
+  e.preventDefault()
+  isLoading.value = true
+
+  try {
+    const res = await axios.post('/auth/signin', {
+      "accountname": toRaw(email.value),
+      "password": toRaw(password.value),
+      "method": "email"
+    })
+
+    localStorage.setItem("authToken", res.data.auth_token)
+    localStorage.setItem("refToken", res.data.refresh_token)
+    toast.default(`Welcome, ${res.data.data.Username}`)
+    router.push({ path: "/" })
+  } catch (err) {
+    const statusCode = err.request.status
+
+    switch(statusCode) {
+      case 401:
+        toast.error('Password is incorrect')
+        break;
+      case 404:
+        toast.error('User does not exist')
+        break;
+      default:
+        toast.error('An unhandled exception occoured. Please check logs')
+    }
+  }
+
+  isLoading.value = false
+}
+</script>
+
+<template>
+  <div id="login-form" class="mx-auto mt-5">
+    <ul class="nav nav-pills nav-justified mb-3" id="ex1" role="tablist">
+      <li class="nav-item" role="presentation">
+        <RouterLink
+          class="nav-link active"
+          id="tab-login"
+          data-mdb-toggle="pill"
+          to="/login"
+          role="tab"
+          aria-controls="pills-login"
+          aria-selected="true"
+          >Login</RouterLink
+        >
+      </li>
+      <li class="nav-item" role="presentation">
+        <RouterLink
+          class="nav-link"
+          id="tab-register"
+          data-mdb-toggle="pill"
+          to="/register"
+          role="tab"
+          aria-controls="pills-register"
+          aria-selected="false"
+          >Register</RouterLink
+        >
+      </li>
+    </ul>
+
+    <div>
+      <form v-on:submit="login">
+        <div class="form-floating mb-4">
+          <input
+            id="login-email-input"
+            type="text"
+            class="form-control"
+            placeholder=""
+            v-model="email"
+          />
+          <label for="login-email-input">E-Mail</label>
+        </div>
+
+        <div class="form-floating mb-4">
+          <input
+            id="login-password-input"
+            type="password"
+            class="form-control"
+            placeholder=""
+            v-model="password"
+          />
+          <label for="login-password-input">Password</label>
+        </div>
+
+        <!--
+        <div class="row mb-4">
+          <div class="col-md-6 d-flex justify-content-center">
+            <div class="form-check mb-3 mb-md-0">
+              <input class="form-check-input" type="checkbox" value="" id="loginCheck" checked />
+              <label class="form-check-label" for="loginCheck"> Remember me </label>
+            </div>
+          </div>
+
+          <div class="col-md-6 d-flex justify-content-center">
+            <a href="#!">Forgot password?</a>
+          </div>
+        </div>
+        -->
+
+        <button type="submit" class="btn btn-primary btn-block mb-4" :class="{ disabled: isLoading }">
+          Sign In
+          <div v-if="isLoading" class="spinner-border spinner-border-sm ms-1" role="status">
+            <span class="sr-only"></span>
+          </div>
+        </button>
+
+        <div class="text-center">
+          <p>Not a member? <RouterLink to="/register">Register</RouterLink></p>
+        </div>
+      </form>
+    </div>
+  </div>
+</template>
+
+<style>
+#login-form {
+  max-width: 30rem;
+  width: 100%;
+}
+</style>
diff --git a/src/views/NewCustomer.vue b/src/views/NewCustomer.vue
new file mode 100644
index 0000000..d19995e
--- /dev/null
+++ b/src/views/NewCustomer.vue
@@ -0,0 +1,7 @@
+<script setup lang="ts">
+import newCustomer from './../components/new_customer.vue'
+</script>
+
+<template>
+  <newCustomer />
+</template>
diff --git a/src/views/NewItem.vue b/src/views/NewItem.vue
new file mode 100644
index 0000000..89690c6
--- /dev/null
+++ b/src/views/NewItem.vue
@@ -0,0 +1,7 @@
+<script setup lang="ts">
+import newItem from './../components/new_item.vue'
+</script>
+
+<template>
+  <newItem />
+</template>
diff --git a/src/views/Register.vue b/src/views/Register.vue
new file mode 100644
index 0000000..b96a0d1
--- /dev/null
+++ b/src/views/Register.vue
@@ -0,0 +1,106 @@
+<script setup lang="ts">
+import { RouterLink } from 'vue-router'
+</script>
+
+<template>
+  <div id="signin-form" class="mx-auto mt-5">
+    <ul class="nav nav-pills nav-justified mb-3" id="ex1" role="tablist">
+      <li class="nav-item" role="presentation">
+        <RouterLink
+          class="nav-link"
+          id="tab-login"
+          data-mdb-toggle="pill"
+          to="/login"
+          role="tab"
+          aria-controls="pills-login"
+          aria-selected="true"
+          >Login</RouterLink
+        >
+      </li>
+      <li class="nav-item" role="presentation">
+        <RouterLink
+          class="nav-link active"
+          id="tab-register"
+          data-mdb-toggle="pill"
+          to="/register"
+          role="tab"
+          aria-controls="pills-register"
+          aria-selected="false"
+          >Register</RouterLink
+        >
+      </li>
+    </ul>
+
+    <div>
+      <form>
+        <div class="form-floating mb-4">
+          <input
+            id="login-username-input"
+            type="text"
+            class="form-control"
+            placeholder=""
+          />
+          <label for="login-username-input">Username</label>
+        </div>
+
+        <div class="form-floating mb-4">
+          <input
+            id="login-email-input"
+            type="text"
+            class="form-control"
+            placeholder=""
+          />
+          <label for="login-email-input">E-Mail</label>
+        </div>
+
+        <div class="form-floating mb-4">
+          <input
+            id="login-password-input"
+            type="password"
+            class="form-control"
+            placeholder=""
+          />
+          <label for="login-password-input">Password</label>
+        </div>
+
+        <div class="form-floating mb-4">
+          <input
+            id="login-password-confirm-input"
+            type="password"
+            class="form-control"
+            placeholder=""
+          />
+          <label for="login-password-confirm-input">Confirm Password</label>
+        </div>
+
+        <!--
+      <div class="row mb-4">
+        <div class="col-md-6 d-flex justify-content-center">
+          <div class="form-check mb-3 mb-md-0">
+            <input class="form-check-input" type="checkbox" value="" id="loginCheck" checked />
+            <label class="form-check-label" for="loginCheck"> Remember me </label>
+          </div>
+        </div>
+
+        <div class="col-md-6 d-flex justify-content-center">
+          <a href="#!">Forgot password?</a>
+        </div>
+      </div>
+      -->
+
+        <button type="submit" class="btn btn-primary btn-block mb-4">Create Account</button>
+
+        <div class="text-center">
+          <p>Already have an account? <RouterLink to="/login">Sign In</RouterLink></p>
+        </div>
+      </form>
+    </div>
+  </div>
+</template>
+
+<style>
+#signin-form {
+  max-width: 30rem;
+  width: 100%;
+}
+</style>
-- 
cgit v1.2.3