mobile optimization

This commit is contained in:
Peter Papp
2021-05-03 09:07:35 +02:00
parent 434c45299c
commit 23611defc1
12 changed files with 195 additions and 58 deletions
+16 -1
View File
@@ -4,6 +4,9 @@
<!--File preview window-->
<FilePreview />
<!--Popups-->
<ConfirmPopup />
<InvoiceMobileMenu />
<ClientMobileMenu />
<InvoiceCreateMenu />
@@ -69,6 +72,7 @@
import InvoiceMobileMenu from '@/Oasis/Invoices/components/InvoiceMobileMenu'
import ClientMobileMenu from '@/Oasis/Invoices/components/ClientMobileMenu'
import InvoiceCreateMenu from '@/Oasis/Invoices/components/InvoiceCreateMenu'
import ConfirmPopup from '@/components/Others/Popup/ConfirmPopup'
import {UsersIcon, FileTextIcon, ClockIcon, Edit2Icon} from 'vue-feather-icons'
import SidebarNavigation from '@/components/Sidebar/SidebarNavigation'
@@ -83,7 +87,8 @@
name: 'Settings',
computed: {
...mapGetters([
'config'
'currentFolder',
'config',
]),
},
components: {
@@ -95,6 +100,7 @@
ClientMobileMenu,
MobileNavigation,
ContentSidebar,
ConfirmPopup,
FileTextIcon,
ContentGroup,
FilePreview,
@@ -129,6 +135,15 @@
events.$on('mobile-menu:hide', () => this.isScaledDown = false)
this.$store.dispatch('getRegularInvoices')
events.$on('action:confirmed', data => {
if (data.operation === 'delete-invoice') {
axios.delete(`/api/oasis/invoices/${data.id}`)
.then(() => this.goTo(this.currentFolder.location))
.catch(() => this.$isSomethingWrong())
}
})
}
}
</script>
@@ -305,8 +305,8 @@
]),
pageTitle() {
return {
'regular': 'Create Regular Invoice',
'advance': 'Create Advance Invoice',
'regular-invoice': 'Create Regular Invoice',
'advance-invoice': 'Create Advance Invoice',
}[this.$route.query.type]
},
isNewClient() {
@@ -76,7 +76,9 @@ export default {
methods: {
goToCompany() {
this.$router.push({name: 'ClientDetail', params: {id: this.item.client_id}})
events.$emit('file-preview:hide')
this.isVisible = false
},
downloadItem() {
@@ -94,7 +96,15 @@ export default {
this.$store.dispatch('fileInfoToggle', true)
},
deleteItem() {
events.$emit('confirm:open', {
title: `Are you sure you want to delete invoice number ${this.item.invoiceNumber}?`,
message: 'Your invoice will be permanently deleted.',
buttonColor: 'danger-solid',
action: {
id: this.item.id,
operation: 'delete-invoice'
}
})
},
closeAndResetContextMenu() {
// Close context menu
@@ -2,11 +2,11 @@
<MenuMobile name="invoice-create">
<MenuMobileGroup>
<OptionGroup>
<Option @click.native="showLocation('regular-invoice')" title="Create Invoice" icon="file-plus" is-hover-disabled="true" />
<Option @click.native="showLocation('advance-invoice')" title="Create Advance Invoice" icon="clock" is-hover-disabled="true" />
<Option @click.native="createInvoice('regular-invoice')" title="Create Invoice" icon="file-plus" is-hover-disabled="true" />
<Option @click.native="createInvoice('advance-invoice')" title="Create Advance Invoice" icon="clock" is-hover-disabled="true" />
</OptionGroup>
<OptionGroup>
<Option @click.native="showLocation('clients')" title="Create Client" icon="user-plus" is-hover-disabled="true" />
<Option @click.native="createClient" title="Create Client" icon="user-plus" is-hover-disabled="true" />
</OptionGroup>
</MenuMobileGroup>
</MenuMobile>
@@ -33,32 +33,12 @@ export default {
]),
},
methods: {
showLocation(location) {
createInvoice(type) {
this.$router.push({name: 'CreateInvoice', query: {type: type}})
},
createClient() {
this.$router.push({name: 'CreateClient'})
},
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()
}
}
}
</script>
@@ -128,8 +128,18 @@
events.$emit('popover:open', 'desktop-create-invoices')
},
deleteInvoice() {
if (this.clipboard.length > 0)
this.$store.dispatch('deleteInvoice')
if (this.clipboard.length > 0) {
events.$emit('confirm:open', {
title: `Are you sure you want to delete invoice number ${this.clipboard[0].invoiceNumber}?`,
message: 'Your invoice will be permanently deleted.',
buttonColor: 'danger-solid',
action: {
id: this.clipboard[0].id,
operation: 'delete-invoice'
}
})
}
},
shareInvoice() {
alert('Send Invoice')
@@ -117,6 +117,9 @@ export default {
}
if (!this.isMobileSelectMode && this.$isMobile()) {
this.$store.commit('CLIPBOARD_CLEAR')
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.item)
events.$emit('file-preview:show')
}
@@ -14,12 +14,11 @@
<Option @click.native="" title="Edit Invoice" icon="rename" />
<Option @click.native="" title="Send Invoice" icon="send" />
<Option @click.native="goToCompany" title="Go to Company" icon="user" />
<Option @click.native="" :title="$t('context_menu.delete')" icon="trash" />
<Option @click.native="deleteInvoice" :title="$t('context_menu.delete')" icon="trash" />
</OptionGroup>
<OptionGroup>
<Option @click.native="" :title="$t('context_menu.detail')" icon="detail" />
<Option @click.native="" :title="$t('context_menu.download')" icon="download" />
<Option @click.native="downloadInvoice" :title="$t('context_menu.download')" icon="download" />
</OptionGroup>
</MenuMobileGroup>
</MenuMobile>
@@ -33,6 +32,7 @@ import OptionGroup from '@/components/FilesView/OptionGroup'
import MenuMobile from '@/components/Mobile/MenuMobile'
import Option from '@/components/FilesView/Option'
import {mapGetters} from 'vuex'
import {events} from '@/bus'
export default {
name: 'FileMenuMobile',
@@ -56,8 +56,22 @@ export default {
}
},
methods: {
downloadInvoice() {
this.$downloadFile(this.clipboard[0].file_url, this.clipboard[0].name + '.' + this.clipboard[0].mimetype)
},
goToCompany() {
this.$router.push({name: 'ClientDetail', params: {id: this.item.client_id}})
this.$router.push({name: 'ClientDetail', params: {id: this.clipboard[0].client_id}})
},
deleteInvoice() {
events.$emit('confirm:open', {
title: `Are you sure you want to delete invoice number ${this.clipboard[0].invoiceNumber}?`,
message: 'Your invoice will be permanently deleted.',
buttonColor: 'danger-solid',
action: {
id: this.clipboard[0].id,
operation: 'delete-invoice'
}
})
},
}
}