removed annoying notifications on HTTP 204

5 files changed, 31 insertions, 26 deletions

diff --git a/src/components/brands_table.vue b/src/components/brands_table.vue
index 20429ec..3a604b1 100644
--- a/src/components/brands_table.vue
+++ b/src/components/brands_table.vue
@@ -32,6 +32,10 @@ const handleDelete = async (id) => {
     </div>
   </div>
 
+  <div v-else-if="props.brands.length === 0" class="w-100 d-flex justify-content-center">
+    <p>No brands added!</p>
+  </div>
+
   <table v-else class="table table-striped table-hover">
     <thead>
       <tr>
diff --git a/src/components/customers_table.vue b/src/components/customers_table.vue
index 163c6b1..3632291 100644
--- a/src/components/customers_table.vue
+++ b/src/components/customers_table.vue
@@ -19,8 +19,6 @@ const getAllCustomers = async () => {
     const res = await axios.get('/customer')
     if (res.status === 200) {
       allCustomers.value = res.data.data
-    } else if (res.status === 204) {
-      toast.warning('No records found')
     }
   } catch (err) {
     toast.error('An unhandled exception occoured. Please check logs')
@@ -56,6 +54,10 @@ onMounted(() => {
     </div>
   </div>
 
+  <div v-else-if="allCustomers.length === 0" class="w-100 d-flex justify-content-center">
+    <p>No customers added! <RouterLink to="/customer/new">Add new.</RouterLink></p>
+  </div>
+
   <table v-else class="table table-striped table-hover">
     <thead>
       <tr>
diff --git a/src/components/invoice_header_editor.vue b/src/components/invoice_header_editor.vue
index ffc5fb0..83c5281 100644
--- a/src/components/invoice_header_editor.vue
+++ b/src/components/invoice_header_editor.vue
@@ -27,8 +27,6 @@ const getAllCustomers = async () => {
     const r = await axios.get('/customer')
     if (r.status === 200) {
       allCustomers.value = r.data.data
-    } else if (r.status === 204) {
-      toast.warning('No customers found')
     }
   } catch (err) {
     toast.error('An unhandled exception occoured. Please check logs')
@@ -129,7 +127,8 @@ onMounted(() => {
         aria-label="Select Brand"
         id="item-brand-input"
       >
-        <option selected disabled value="null">Select Customer</option>
+        <option v-if="allCustomers.length === 0" selected disabled value="null">No customers added in OpenBills!</option>
+        <option v-else selected disabled value="null">Select Customer</option>
         <option v-for="customer in allCustomers" :value="customer" :key="customer['id']">
           {{ customer["Name"] }}
         </option>
diff --git a/src/components/items_table.vue b/src/components/items_table.vue
index b18c91d..f429eb8 100644
--- a/src/components/items_table.vue
+++ b/src/components/items_table.vue
@@ -14,23 +14,19 @@ const isLoading = ref(false)
 
 const getAllItems = async () => {
   allItems.value = []
-  allBrands.value = []
-  isLoading.value = true
-
-  try {
-    const res = await axios.get('/item')
-    if (res.status === 200) {
-      allItems.value = res.data.data
-    } else if (res.status === 204) {
-      toast.warning('No records found')
-    }
-
-    const r = await axios.get('/brand')
-    if (r.status === 200) {
-      allBrands.value = r.data.data
-    } else if (r.status === 204) {
-      toast.warning('No records found')
-    }
+   allBrands.value = []
+   isLoading.value = true
+
+   try {
+     const res = await axios.get('/item')
+     if (res.status === 200) {
+       allItems.value = res.data.data
+     }
+
+     const r = await axios.get('/brand')
+     if (r.status === 200) {
+       allBrands.value = r.data.data
+     }
   } catch (err) {
     toast.error('An unhandled exception occoured. Please check logs')
     console.error(err)
@@ -65,6 +61,10 @@ onMounted(() => {
     </div>
   </div>
 
+  <div v-else-if="allItems.length === 0" class="w-100 d-flex justify-content-center">
+    <p>No items added! <RouterLink to="/item/new">Add new.</RouterLink></p>
+  </div>
+
   <table v-else class="table table-striped table-hover">
     <thead>
       <tr>
diff --git a/src/components/new_item.vue b/src/components/new_item.vue
index 8b1f3f6..e93d0ea 100644
--- a/src/components/new_item.vue
+++ b/src/components/new_item.vue
@@ -10,7 +10,7 @@ const toast = useToast({
 
 const isLoading = ref(true)
 const item = ref(new Item())
-const itemBrand = ref({ id: 0, name: '' })
+const itemBrand = ref(null)
 const allBrands = ref([])
 
 const getAllBrands = async () => {
@@ -21,8 +21,6 @@ const getAllBrands = async () => {
     const r = await axios.get('/brand')
     if (r.status === 200) {
       allBrands.value = r.data.data
-    } else if (r.status === 204) {
-      toast.warning('No brands found')
     }
   } catch (err) {
     toast.error('An unhandled exception occoured. Please check logs')
@@ -129,13 +127,15 @@ onMounted(() => {
     </div>
     <div class="col-md-3">
       <label for="item-brand-input" class="form-label">Brand</label>
+
       <select
         class="form-select"
         aria-label="Select Brand"
         id="item-brand-input"
         v-model="itemBrand"
       >
-        <option selected disabled value="0">Select Brand</option>
+        <option v-if="allBrands.length == 0" selected disabled value="null">No brands added in OpenBills!</option>
+        <option v-else selected disabled value="null">Select Brand</option>
 
         <option v-for="brand in allBrands" :value="brand" :key="brand.id">
           {{ brand.Name }}