- Invoice listing in frontend

resources/js/Oasis/Modules/Invoices/components/InvoiceActionsMobile.vue

@@ -4,7 +4,7 @@
         <!--Base location-->
         <div class="mobile-actions">
             <MobileActionButton @click.native="showLocations" icon="filter">
-                {{ $route.meta.title }}
+                {{ directoryName }}
             </MobileActionButton>
             <MobileActionButton @click.native="createButton" icon="file-plus">
                 Create
@@ -32,8 +32,13 @@
         },
         computed: {
             ...mapGetters([
-                //
+                'currentFolder'
             ]),
+			directoryName() {
+				return this.currentFolder
+					? this.currentFolder.name
+					: 'Invoices'
+			},
         },
         data() {
             return {

resources/js/Oasis/Modules/Invoices/components/InvoiceBrowser.vue

@@ -144,32 +144,6 @@
 				id: undefined,
 				location: 'invoices',
 			})
-
-			this.$store.commit('LOADING_STATE', {
-				isLoading: false,
-				data: [
-					{
-						id: 'c2fa9df5-se64-499b-b001-94691ccb14e2',
-						name: 'Nitex s.r.o. - 3260,00 EUR',
-						invoiceNumber: '2021001',
-						total: '3260,00 EUR',
-						created_at: '12. April. 2021',
-						clientName: 'Nitex s.r.o.',
-						file_url: 'http://192.168.1.198:8000/file/9ti6r4481cqtuk36-190001-FMkuIZM5TYWjp0TpxoTPjSYj96a5qMtM.pdf',
-						mimetype: 'pdf',
-					},
-					{
-						id: 'c3fa9df5-ee64-499b-b001-94691ccb14e1',
-						name: 'VueFileManager s.r.o. - 220,00 EUR',
-						invoiceNumber: '2021002',
-						total: '220,00 EUR',
-						created_at: '9. April. 2021',
-						clientName: 'VueFileManager s.r.o.',
-						file_url: 'http://192.168.1.198:8000/file/9ti6r4481cqtuk36-190001-FMkuIZM5TYWjp0TpxoTPjSYj96a5qMtM.pdf',
-						mimetype: 'pdf',
-					},
-				],
-			})
 		}
 	}
 </script>

resources/js/Oasis/Modules/Invoices/components/InvoiceDesktopToolbar.vue

@@ -6,7 +6,7 @@
 				<!--<chevron-left-icon :class="{'is-active': browseHistory.length > 1 }" class="icon-back" size="17" />-->
 
 				<span class="location-title">
-					Invoices
+					{{ directoryName }}
 				</span>
 			</div>
 
@@ -90,8 +90,14 @@
 		computed: {
 			...mapGetters([
 				'isVisibleSidebar',
+				'currentFolder',
 				'clipboard',
 			]),
+			directoryName() {
+				return this.currentFolder
+					? this.currentFolder.name
+					: this.homeDirectory.name
+			},
 			canActiveInView() {
 				let locations = [
 					'invoices',

resources/js/Oasis/Modules/Invoices/components/InvoiceFilterMobile.vue

@@ -2,11 +2,11 @@
     <MenuMobile name="invoice-filter">
         <MenuMobileGroup>
             <OptionGroup>
-                <Option @click.native="showLocation('invoices')" title="Invoices" icon="file-text" is-hover-disabled="true" />
-                <Option @click.native="showLocation('advance-invoices')" title="Advance Invoices" icon="clock" is-hover-disabled="true" />
+                <Option @click.native="showLocation('invoices')" :is-active="$isThisLocation('invoices')" title="Invoices" icon="file-text" is-hover-disabled="true" />
+                <Option @click.native="showLocation('advance-invoices')" :is-active="$isThisLocation('advance-invoices')" title="Advance Invoices" icon="clock" is-hover-disabled="true" />
             </OptionGroup>
             <OptionGroup>
-                <Option @click.native="showLocation('clients')" title="Clients" icon="users" is-hover-disabled="true" />
+                <Option @click.native="showLocation('clients')" :is-active="$isThisLocation('clients')" title="Clients" icon="users" is-hover-disabled="true" />
             </OptionGroup>
         </MenuMobileGroup>
     </MenuMobile>
@@ -34,31 +34,13 @@ export default {
     },
     methods: {
 		showLocation(location) {
-
-		},
-        flushBrowseHistory() {
-            this.$store.commit('FLUSH_FOLDER_HISTORY')
-        },
-        goToFiles() {
-            this.$store.dispatch('getFolder', [{folder: this.homeDirectory, back: false, init: true}])
-            this.flushBrowseHistory()
-        },
-        goToLatest() {
-            this.$store.dispatch('getLatest')
-            this.flushBrowseHistory()
-        },
-        goToTrash() {
-            this.$store.dispatch('getTrash')
-            this.flushBrowseHistory()
-        },
-        goToShared() {
-            this.$store.dispatch('getShared', [{back: false, init: false}])
-            this.flushBrowseHistory()
-        },
-        goToParticipantUploads() {
-            this.$store.dispatch('getParticipantUploads')
-            this.flushBrowseHistory()
-        }
+			let routes = {
+				'invoices': 'getInvoices',
+				'advance-invoices': 'getAdvanceInvoices',
+				'clients': 'getClients',
+			}
+			this.$store.dispatch(routes[location])
+		}
     }
 }
 </script>

resources/js/Oasis/Modules/Invoices/components/InvoiceItem.vue

@@ -357,7 +357,7 @@ export default {
         width: 100%;
         display: flex;
         align-items: center;
-        padding: 7px 7px 7px 15px;
+        padding: 12px 7px 12px 15px;
 
         &.is-dragenter {
             border-radius: 8px;