i18n implementation into invoice module

This commit is contained in:
Peter Papp
2021-05-07 11:32:48 +02:00
parent 070f8b4d40
commit 73672bc023
31 changed files with 431 additions and 299 deletions
@@ -27,7 +27,7 @@
<div class="item-info">
<span class="item-size">
Created at: {{ item.created_at }}, Total: {{ item.totalNet }}
{{ $t('file_detail.created_at') }}: {{ item.created_at }}, {{ $t('global.total') }}: {{ item.totalNet }}
</span>
</div>
</div>
@@ -50,7 +50,7 @@ import {mapGetters} from 'vuex'
import {events} from '@/bus'
export default {
name: 'InvoiceItem',
name: 'ClientItem',
props: [
'item'
],
@@ -7,11 +7,10 @@
:title="clipboard[0].name"
:subtitle="clipboard[0].email"
/>
<MenuMobileGroup>
<OptionGroup class="menu-option-group">
<Option @click.native="goToProfile" title="Edit" icon="rename" />
<Option @click.native="deleteItem" title="Delete" icon="trash" />
<Option @click.native="goToProfile" :title="$t('in.menu.edit')" icon="rename" />
<Option @click.native="deleteItem" :title="$t('in.menu.delete')" icon="trash" />
</OptionGroup>
<OptionGroup>
<Option @click.native="goToProfile" :title="$t('context_menu.detail')" icon="detail" />
@@ -57,8 +56,8 @@ export default {
},
deleteItem() {
events.$emit('confirm:open', {
title: `Are you sure you want to delete client ${this.clipboard[0].name}?`,
message: 'Your client will be permanently deleted.',
title: this.$t('in.popup.delete_client.title', {name: this.clipboard[0].name}),
message: this.$t('in.popup.delete_client.message'),
buttonColor: 'danger-solid',
action: {
id: this.clipboard[0].id,
@@ -5,11 +5,11 @@
<!--Invoice message-->
<div class="text-content" v-if="hasBillingProfile && $isThisLocation(['regular-invoice', 'advance-invoice']) && !isLoading">
<h1 class="title">
Create Your First Invoice
{{ $t('in.empty.invoice_page_title') }}
</h1>
<p class="description">
It's very easy, just click on the button below.
{{ $t('in.empty.invoice_page_description') }}
</p>
<ButtonBase @click.native="createInvoice" button-style="theme" class="button">
@@ -20,30 +20,30 @@
<!--Client Message-->
<div class="text-content" v-if="hasBillingProfile && $isThisLocation('clients') && !isLoading">
<h1 class="title">
Create Your First Client
{{ $t('in.empty.client_page_title') }}
</h1>
<p class="description">
It's very easy, just click on the button below.
{{ $t('in.empty.invoice_page_description') }}
</p>
<ButtonBase @click.native="createClient" button-style="theme" class="button">
Create Client
{{ $t('in.form.create_client') }}
</ButtonBase>
</div>
<!--Billing Profile Message-->
<div class="text-content" v-if="! hasBillingProfile">
<h1 class="title">
You don't have billing profile
{{ $t('in.empty.bill_profile_title') }}
</h1>
<p class="description">
Before your first invoice, please set up your billing profile.
{{ $t('in.empty.bill_profile_description') }}
</p>
<ButtonBase @click.native="createBillingProfile" button-style="theme" class="button">
Set up Billing Profile
{{ $t('in.button.setup_bill_profile') }}
</ButtonBase>
</div>
@@ -81,7 +81,7 @@
return this.entries && this.entries.length == 0
},
buttonTitle() {
return this.$isThisLocation('regular-invoice') ? 'Create Regular Invoice' : 'Create Advance Invoice'
return this.$isThisLocation('regular-invoice') ? this.$t('in_editor.page.create_regular_invoice') : this.$t('in_editor.page.create_advance_invoice')
},
hasBillingProfile() {
return this.user && this.user.data.attributes.has_billing_profile
@@ -7,7 +7,7 @@
{{ directoryName }}
</MobileActionButton>
<MobileActionButton @click.native="createButton" icon="file-plus">
Create
{{ $t('create') }}
</MobileActionButton>
<MobileActionButton @click.native="showViewOptions" icon="th-list">
{{ $t('preview_sorting.preview_sorting_button') }}
@@ -24,7 +24,7 @@
import {events} from '@/bus'
export default {
name: 'FileActionsMobile',
name: 'InvoiceActionsMobile',
components: {
MobileActionButtonUpload,
MobileActionButton,
@@ -37,7 +37,7 @@
directoryName() {
return this.currentFolder
? this.currentFolder.name
: 'Invoices'
: this.$t('in.nav.invoices')
},
},
data() {
@@ -4,9 +4,9 @@
<!--Invoice-->
<div v-show="isInvoice" class="menu-options" id="menu-list">
<OptionGroup class="menu-option-group">
<Option @click.native="editItem" 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="editItem" :title="$t('in.menu.edit_invoice')" icon="rename" />
<Option @click.native="" :title="$t('in.menu.send_invoice')" icon="send" />
<Option @click.native="goToCompany" :title="$t('in.menu.show_company')" icon="user" />
<Option @click.native="deleteInvoice" :title="$t('context_menu.delete')" icon="trash" />
</OptionGroup>
@@ -19,11 +19,11 @@
<!--Client-->
<div v-show="isClient" class="menu-options" id="menu-list">
<OptionGroup class="menu-option-group">
<Option @click.native="goToCompany" title="Edit" icon="rename" />
<Option @click.native="deleteClient" title="Delete" icon="trash" />
<Option @click.native="goToCompany" :title="$t('in.menu.edit')" icon="rename" />
<Option @click.native="deleteClient" :title="$t('context_menu.delete')" icon="trash" />
</OptionGroup>
<OptionGroup>
<Option @click.native="goToCompany" title="Go to Profile" icon="user" />
<Option @click.native="goToCompany" :title="$t('in.menu.show_company')" icon="user" />
<Option @click.native="showDetail" :title="$t('context_menu.detail')" icon="detail" />
</OptionGroup>
</div>
@@ -100,8 +100,8 @@ export default {
},
deleteInvoice() {
events.$emit('confirm:open', {
title: `Are you sure you want to delete invoice number ${this.item.invoice_number}?`,
message: 'Your invoice will be permanently deleted.',
title: this.$t('in.popup.delete_invoice.title', {number: this.item.invoice_number}),
message: this.$t('in.popup.delete_invoice.message'),
buttonColor: 'danger-solid',
action: {
id: this.item.id,
@@ -111,8 +111,8 @@ export default {
},
deleteClient() {
events.$emit('confirm:open', {
title: `Are you sure you want to delete client ${this.item.name}?`,
message: 'Your client will be permanently deleted.',
title: this.$t('in.popup.delete_client.title', {name: this.item.name}),
message: this.$t('in.popup.delete_client.message'),
buttonColor: 'danger-solid',
action: {
id: this.item.id,
@@ -2,11 +2,11 @@
<MenuMobile name="invoice-create">
<MenuMobileGroup>
<OptionGroup>
<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" />
<Option @click.native="createInvoice('regular-invoice')" :title="$t('in.create.regular_invoice')" icon="file-plus" is-hover-disabled="true" />
<Option @click.native="createInvoice('advance-invoice')" :title="$t('in.create.advance_invoice')" icon="clock" is-hover-disabled="true" />
</OptionGroup>
<OptionGroup>
<Option @click.native="createClient" title="Create Client" icon="user-plus" is-hover-disabled="true" />
<Option @click.native="createClient" :title="$t('in.create.client')" icon="user-plus" is-hover-disabled="true" />
</OptionGroup>
</MenuMobileGroup>
</MenuMobile>
@@ -14,7 +14,7 @@
<!--Search bar-->
<ToolbarGroup style="margin-left: 0">
<SearchBar v-model="query" @reset-query="query = ''" placeholder="Search your invoices..." />
<SearchBar v-model="query" @reset-query="query = ''" :placeholder="searchPlaceholder" />
</ToolbarGroup>
<!--Creating controls-->
@@ -23,11 +23,11 @@
<ToolbarButton @click.stop.native="createCreateMenu" source="plus" :action="$t('actions.create_folder')" />
<PopoverItem name="desktop-create-invoices">
<OptionGroup>
<Option @click.stop.native="createInvoice('regular-invoice')" title="Create Regular Invoice" icon="file-plus" />
<Option @click.stop.native="createInvoice('advance-invoice')" title="Create Advance Invoice" icon="clock" />
<Option @click.stop.native="createInvoice('regular-invoice')" :title="$t('in_editor.page.create_regular_invoice')" icon="file-plus" />
<Option @click.stop.native="createInvoice('advance-invoice')" :title="$t('in_editor.page.create_advance_invoice')" icon="clock" />
</OptionGroup>
<OptionGroup>
<Option @click.native="createClient" title="Create Client" icon="user-plus" />
<Option @click.native="createClient" :title="$t('in.create.client')" icon="user-plus" />
</OptionGroup>
</PopoverItem>
</PopoverWrapper>
@@ -94,7 +94,7 @@
'clipboard',
]),
directoryName() {
return this.currentFolder ? this.currentFolder.name : 'Invoices'
return this.currentFolder ? this.currentFolder.name : this.$t('in.nav.invoices')
},
canActiveInView() {
let locations = [
@@ -104,6 +104,11 @@
]
return !this.$isThisLocation(locations) || this.clipboard.length === 0
},
searchPlaceholder() {
return this.currentFolder && ['regular-invoice', 'advance-invoice'].includes(this.currentFolder.location)
? this.$t('inputs.placeholder_search_invoices')
: this.$t('inputs.placeholder_search_clients')
},
},
data() {
return {
@@ -133,8 +138,8 @@
if (this.$isThisLocation(['regular-invoice', 'advance-invoice']) && this.clipboard.length > 0) {
events.$emit('confirm:open', {
title: `Are you sure you want to delete invoice number ${this.clipboard[0].invoice_number}?`,
message: 'Your invoice will be permanently deleted.',
title: this.$t('in.popup.delete_invoice.title', {number: this.clipboard[0].invoice_number}),
message: this.$t('in.popup.delete_invoice.message'),
buttonColor: 'danger-solid',
action: {
id: this.clipboard[0].id,
@@ -145,8 +150,8 @@
if (this.$isThisLocation('clients') && this.clipboard.length > 0) {
events.$emit('confirm:open', {
title: `Are you sure you want to delete client ${this.clipboard[0].name}?`,
message: 'Your client will be permanently deleted.',
title: this.$t('in.popup.delete_client.title', {name: this.clipboard[0].name}),
message: this.$t('in.popup.delete_client.message'),
buttonColor: 'danger-solid',
action: {
id: this.clipboard[0].id,
@@ -2,11 +2,11 @@
<MenuMobile name="invoice-filter">
<MenuMobileGroup>
<OptionGroup>
<Option @click.native="showLocation('regular-invoice')" :is-active="$isThisLocation('regular-invoice')" title="Invoices" icon="file-text" is-hover-disabled="true" />
<Option @click.native="showLocation('advance-invoice')" :is-active="$isThisLocation('advance-invoice')" title="Advance Invoices" icon="clock" is-hover-disabled="true" />
<Option @click.native="showLocation('regular-invoice')" :is-active="$isThisLocation('regular-invoice')" :title="$t('in.nav.invoices')" icon="file-text" is-hover-disabled="true" />
<Option @click.native="showLocation('advance-invoice')" :is-active="$isThisLocation('advance-invoice')" :title="$t('in.nav.advance_invoices')" icon="clock" is-hover-disabled="true" />
</OptionGroup>
<OptionGroup>
<Option @click.native="showLocation('clients')" :is-active="$isThisLocation('clients')" title="Clients" icon="users" is-hover-disabled="true" />
<Option @click.native="showLocation('clients')" :is-active="$isThisLocation('clients')" :title="$t('in.nav.clients')" icon="users" is-hover-disabled="true" />
</OptionGroup>
</MenuMobileGroup>
</MenuMobile>
@@ -23,18 +23,18 @@
<ListInfo v-if="isSingleFile && !isEmpty">
<ListInfoItem
title="Email"
:title="$t('in_editor.client_email')"
:content="singleFile.email"
/>
<ListInfoItem
title="Total Net"
:title="$t('in.total_net')"
:content="singleFile.totalNet"
/>
<ListInfoItem
title="Total Invoices"
:content="singleFile.totalInvoices + ' Pcs.'"
:title="$t('in.total_invoices')"
:content="singleFile.totalInvoices + ' ' + $t('global.pcs')"
/>
<!--Created At-->
@@ -61,7 +61,7 @@
<TitlePreview
icon="file-text"
:title="singleFile.client_name"
:subtitle="'Invoice - ' + singleFile.invoice_number"
:subtitle="$t('invoice_title') + ' - ' + singleFile.invoice_number"
/>
</div>
@@ -69,17 +69,17 @@
<ListInfo v-if="isSingleFile && !isEmpty">
<ListInfoItem
title="Invoice Number"
:title="$t('invoice_number')"
:content="singleFile.invoice_number"
/>
<ListInfoItem
title="Total"
:title="$t('total')"
:content="singleFile.total"
/>
<ListInfoItem
title="Client"
:title="$t('client')"
:content="singleFile.client_name"
/>
@@ -106,7 +106,7 @@
import {events} from "@/bus"
export default {
name: 'InfoSidebar',
name: 'InvoiceInfoSidebar',
components: {
FilePreviewDetail,
ImageMetaData,
@@ -20,7 +20,7 @@
<div class="item-info">
<span class="item-size">
{{ item.created_at }}, n. {{ item.invoice_number }}
{{ item.created_at }}, {{ $t('in.n-abbreviation') }} {{ item.invoice_number }}
</span>
</div>
</div>
@@ -5,18 +5,17 @@
class="headline"
icon="file-text"
:title="clipboard[0].name"
:subtitle="'Invoice - ' + clipboard[0].invoice_number"
:subtitle="$t('in.invoice') + ' - ' + clipboard[0].invoice_number"
/>
<!--Trash location-->
<MenuMobileGroup>
<OptionGroup class="menu-option-group">
<Option @click.native="editInvoice" 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="editInvoice" :title="$t('in.menu.edit_invoice')" icon="rename" />
<Option @click.native="" :title="$t('in.menu.send_invoice')" icon="send" />
<Option @click.native="goToCompany" :title="$t('in.menu.show_company')" icon="user" />
<Option @click.native="deleteInvoice" :title="$t('context_menu.delete')" icon="trash" />
</OptionGroup>
<OptionGroup>
<Option @click.native="downloadInvoice" :title="$t('context_menu.download')" icon="download" />
</OptionGroup>
@@ -35,7 +34,7 @@ import {mapGetters} from 'vuex'
import {events} from '@/bus'
export default {
name: 'FileMenuMobile',
name: 'InvoiceMobileMenu',
components: {
MenuMobileGroup,
ThumbnailItem,
@@ -67,8 +66,8 @@ export default {
},
deleteInvoice() {
events.$emit('confirm:open', {
title: `Are you sure you want to delete invoice number ${this.clipboard[0].invoice_number}?`,
message: 'Your invoice will be permanently deleted.',
title: this.$t('in.popup.delete_invoice.title', {number: this.clipboard[0].invoice_number}),
message: this.$t('in.popup.delete_invoice.message'),
buttonColor: 'danger-solid',
action: {
id: this.clipboard[0].id,
@@ -17,7 +17,7 @@ import Option from '@/components/FilesView/Option'
import {mapGetters} from 'vuex'
export default {
name: 'InvoiceFilterMobile',
name: 'InvoiceSortingMobile',
components: {
MenuMobileGroup,
OptionGroup,
@@ -30,32 +30,7 @@ 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()
}
}
}
</script>