Billing profile implementation

resources/js/Oasis/Modules/Invoices/Invoice.vue

@@ -14,7 +14,50 @@
         <MobileNavigation />
         <SidebarNavigation />
 
-		<router-view :class="{'is-scaled-down': isScaledDown}" />
+		<div id="viewport">
+
+			<!--Sidebar navigation-->
+			<ContentSidebar>
+				<ContentGroup title="Invoices" class="navigator menu-list-wrapper vertical">
+					<a @click="goTo('regular-invoice')" :class="{'is-active': $isThisLocation(['regular-invoice']) && $route.name === 'InvoicesList'}" class="menu-list-item link">
+						<div class="icon text-theme">
+							<file-text-icon size="17" />
+						</div>
+						<div class="label text-theme">
+							Invoices
+						</div>
+					</a>
+					<a @click="goTo('advance-invoice')" :class="{'is-active': $isThisLocation(['advance-invoice']) && $route.name === 'InvoicesList'}" class="menu-list-item link">
+						<div class="icon text-theme">
+							<clock-icon size="17" />
+						</div>
+						<div class="label text-theme">
+							Advance Invoices
+						</div>
+					</a>
+				</ContentGroup>
+				<ContentGroup title="Others" class="navigator menu-list-wrapper vertical">
+					<a @click="goTo('clients')" :class="{'is-active': $isThisLocation(['clients']) && $route.name === 'InvoicesList'}" class="menu-list-item link">
+						<div class="icon text-theme">
+							<users-icon size="17" />
+						</div>
+						<div class="label text-theme">
+							Clients
+						</div>
+					</a>
+					<router-link :to="{name: 'InvoicesProfile'}" class="menu-list-item link">
+						<div class="icon text-theme">
+							<edit2-icon size="17" />
+						</div>
+						<div class="label text-theme">
+							Billing Profile
+						</div>
+					</router-link>
+				</ContentGroup>
+			</ContentSidebar>
+
+			<router-view :class="{'is-scaled-down': isScaledDown}" />
+		</div>
     </div>
 </template>
 
@@ -25,7 +68,7 @@
 	import ClientMobileMenu from '@/Oasis/Modules/Invoices/components/ClientMobileMenu'
 	import InvoiceCreateMenu from '@/Oasis/Modules/Invoices/components/InvoiceCreateMenu'
 
-	import {UsersIcon, FileTextIcon, ClockIcon} from 'vue-feather-icons'
+	import {UsersIcon, FileTextIcon, ClockIcon, Edit2Icon} from 'vue-feather-icons'
 	import SidebarNavigation from '@/components/Sidebar/SidebarNavigation'
 	import MobileNavigation from '@/components/Others/MobileNavigation'
 	import ContentSidebar from '@/components/Sidebar/ContentSidebar'
@@ -53,6 +96,7 @@
 			FileTextIcon,
 			ContentGroup,
 			FilePreview,
+			Edit2Icon,
 			UsersIcon,
 			ClockIcon,
 		},
@@ -68,14 +112,21 @@
 					'advance-invoice': 'getAdvanceInvoices',
 					'clients': 'getClients',
 				}
+
+				if (this.$route.name !== 'InvoicesList') {
+					this.$router.push({name: 'InvoicesList'})
+				}
+
 				this.$store.dispatch(routes[location])
-			}
+			},
 		},
 		mounted() {
 			events.$on('mobile-menu:show', () => this.isScaledDown = true)
 
 			events.$on('fileItem:deselect', () => this.isScaledDown = false)
 			events.$on('mobile-menu:hide', () => this.isScaledDown = false)
+
+			this.$store.dispatch('getRegularInvoices')
 		}
 	}
 </script>