add currency format

shift-build-2464
Nadim Salloum 2021-06-14 14:43:21 +03:00
parent 74660f2fc8
commit dcc0245ffc
11 changed files with 978 additions and 44 deletions

View File

@ -245,7 +245,7 @@ class CarController extends Controller
'initial_date' => $car->initial_date_formatted,
'colour' => $car->colour,
'last_check_date' => $car->last_check_date_formatted,
'kilometers' => $car->kilometers,
'kilometers' => $car->kilometers_formatted,
'known_damage' => $car->known_damage,
'notes' => $car->notes,
'deleted_at' => $car->deleted_at,

View File

@ -191,7 +191,7 @@ class ContactController extends Controller
'initial_date' => $car->initial_date_formatted,
'colour' => $car->colour,
'last_check_date' => $car->last_check_date_formatted,
'kilometers' => $car->kilometers,
'kilometers' => $car->kilometers_formatted,
'known_damage' => $car->known_damage,
'notes' => $car->notes,
'link' => route('cars.show', $car),

View File

@ -80,7 +80,7 @@ class ContractController extends Controller
'name' => $car->name,
'colour' => $car->colour,
'last_check_date' => $car->last_check_date_formatted,
'kilometers' => $car->kilometers,
'kilometers' => $car->kilometers_formatted,
'initial_date' => $car->initial_date_formatted,
];
}
@ -139,7 +139,7 @@ class ContractController extends Controller
'is_sell_contract' => $contract->isSellContract(),
'type' => $contract->type,
'type_formatted' => $contract->type_formatted,
'price' => $contract->price->getAmount(),
'price' => (int)$contract->price->getAmount(),
'insurance_type' => (string)$contract->insurance_type,
'car' => [
'id' => $contract->car->id,
@ -227,7 +227,7 @@ class ContractController extends Controller
'initial_date' => $contract->car->initial_date_formatted,
'colour' => $contract->car->colour,
'last_check_date' => $contract->car->last_check_date_formatted,
'kilometers' => $contract->car->kilometers,
'kilometers' => $contract->car->kilometers_formatted,
'known_damage' => $contract->car->known_damage,
'notes' => $contract->car->notes,
'deleted_at' => $contract->car->deleted_at,

View File

@ -32,9 +32,9 @@ class Car extends Model
return $out;
}
public function getKilometersAttrobute($kilometers)
public function getKilometersFormattedAttribute()
{
return $kilometers;
return number_format($this->kilometers, 0, '.', '\'');
}
public function getInitialDateFormattedAttribute()

56
package-lock.json generated
View File

@ -5,6 +5,7 @@
"packages": {
"": {
"dependencies": {
"vue-currency-input": "^2.0.0",
"vue-multiselect": "^3.0.0-alpha.2",
"vue-unicons": "^3.2.1",
"vue3-datepicker": "^0.2.4",
@ -15632,6 +15633,45 @@
"integrity": "sha512-HPKQMN7gfcUqS5SxoO0VxqLRRSPkG1H1FqglsHccz6BatBatNtm/Vyy8brApktZxNCfnAkrSVDpxg3/FNDeOgQ==",
"deprecated": "Sorry but vue-analytics is no longer maintained. I would suggest you switch to vue-gtag, with love, the guy who made the package."
},
"node_modules/vue-currency-input": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/vue-currency-input/-/vue-currency-input-2.0.0.tgz",
"integrity": "sha512-y6KnBmz5Y/CIB3El94ax0UzSicaRMMjjknnSHlivMaEhOJwyw19sxXoPeUhsoG0fKYsvRpGiOqFmiqpmi1+zAA==",
"dependencies": {
"vue-demi": "^0.9.0"
},
"peerDependencies": {
"@vue/composition-api": "^1.0.0-rc.1",
"vue": "^2.6 || ^3.0.0"
},
"peerDependenciesMeta": {
"@vue/composition-api": {
"optional": true
}
}
},
"node_modules/vue-currency-input/node_modules/vue-demi": {
"version": "0.9.1",
"resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.9.1.tgz",
"integrity": "sha512-7s1lufRD2l369eFWPjgLvhqCRk0XzGWJsQc7K4q+0mZtixyGIvsK1Cg88P4NcaRIEiBuuN4q1NN4SZKFKwQswA==",
"hasInstallScript": true,
"bin": {
"vue-demi-fix": "bin/vue-demi-fix.js",
"vue-demi-switch": "bin/vue-demi-switch.js"
},
"funding": {
"url": "https://github.com/sponsors/antfu"
},
"peerDependencies": {
"@vue/composition-api": "^1.0.0-beta.1",
"vue": "^2.6.0 || >=3.0.0-rc.1"
},
"peerDependenciesMeta": {
"@vue/composition-api": {
"optional": true
}
}
},
"node_modules/vue-loader": {
"version": "16.2.0",
"resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.2.0.tgz",
@ -28605,6 +28645,22 @@
"resolved": "https://registry.npmjs.org/vue-analytics/-/vue-analytics-5.22.1.tgz",
"integrity": "sha512-HPKQMN7gfcUqS5SxoO0VxqLRRSPkG1H1FqglsHccz6BatBatNtm/Vyy8brApktZxNCfnAkrSVDpxg3/FNDeOgQ=="
},
"vue-currency-input": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/vue-currency-input/-/vue-currency-input-2.0.0.tgz",
"integrity": "sha512-y6KnBmz5Y/CIB3El94ax0UzSicaRMMjjknnSHlivMaEhOJwyw19sxXoPeUhsoG0fKYsvRpGiOqFmiqpmi1+zAA==",
"requires": {
"vue-demi": "^0.9.0"
},
"dependencies": {
"vue-demi": {
"version": "0.9.1",
"resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.9.1.tgz",
"integrity": "sha512-7s1lufRD2l369eFWPjgLvhqCRk0XzGWJsQc7K4q+0mZtixyGIvsK1Cg88P4NcaRIEiBuuN4q1NN4SZKFKwQswA==",
"requires": {}
}
}
},
"vue-loader": {
"version": "16.2.0",
"resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.2.0.tgz",

View File

@ -27,6 +27,7 @@
"vue-loader": "^16.1.2"
},
"dependencies": {
"vue-currency-input": "^2.0.0",
"vue-multiselect": "^3.0.0-alpha.2",
"vue-unicons": "^3.2.1",
"vue3-datepicker": "^0.2.4",

898
public/js/app.js vendored

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,20 @@
<template>
<input ref="inputRef" type="text" :value="formattedValue">
</template>
<script>
import useCurrencyInput from 'vue-currency-input'
export default {
name: 'CurrencyInput',
props: {
modelValue: Number,
options: Object
},
setup (props) {
const { formattedValue, inputRef } = useCurrencyInput(props.options)
return { inputRef, formattedValue }
}
}
</script>

View File

@ -14,7 +14,7 @@
<div class="col-span-6 sm:col-span-4">
<jet-label for="amount" value="Betrag" />
<jet-input id="amount" type="text" class="mt-1 block w-full" v-model="form.amount" ref="amount" autocomplete="amount" />
<currency-input v-model="form.amount" :options="currencyOptions" id="price" class="w-full mt-1 block border-gray-300 focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 rounded-md shadow-sm" ref="amount"/>
<jet-input-error :message="form.errors.amount" class="mt-2" />
</div>
@ -35,7 +35,6 @@
</jet-button>
</template>
</dialog-modal>
<!-- <multiselect class="mt-1 block w-full" @select="updateTypeSelection" v-model="typeSelection" deselect-label="Kann nicht entfernt werden" track-by="key" label="label" placeholder="Versicherung auswählen" :options="types" :searchable="false" :allow-empty="false" /> -->
</template>
<script>
@ -47,6 +46,7 @@ import Datepicker from 'vue3-datepicker'
import { useForm } from '@inertiajs/inertia-vue3'
import { ref } from 'vue'
import DialogModal from '@/Jetstream/DialogModal.vue'
import CurrencyInput from '@/Components/CurrencyInput'
export default {
components: {
@ -56,6 +56,7 @@ export default {
JetInputError,
DialogModal,
Datepicker,
CurrencyInput,
},
props: {
id: Number,
@ -70,6 +71,12 @@ export default {
type: '1',
contract_id: this.id,
}),
currencyOptions: {
currency: 'CHF',
locale: 'de-CH',
exportValueAsInteger: true,
hideGroupingSeparatorOnFocus: false,
},
}
},
methods: {

View File

@ -55,7 +55,7 @@
<div class="col-span-6 sm:col-span-4">
<jet-label for="kilometers" value="Kilometerstand" />
<jet-input id="kilometers" type="text" class="mt-1 block w-full" v-model="form.kilometers" ref="kilometers" autocomplete="kilometers" />
<currency-input v-model="form.kilometers" :options="currencyOptions" id="kilometers" class="w-full mt-1 block border-gray-300 focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 rounded-md shadow-sm" ref="kilometers" />
<jet-input-error :message="form.errors.kilometers" class="mt-2" />
</div>
@ -87,6 +87,7 @@ import JetActionMessage from '@/Jetstream/ActionMessage'
import JetInputError from '@/Jetstream/InputError'
import Multiselect from 'vue-multiselect'
import Datepicker from 'vue3-datepicker'
import CurrencyInput from '@/Components/CurrencyInput'
export default {
components: {
@ -96,6 +97,7 @@ export default {
JetActionMessage,
Multiselect,
Datepicker,
CurrencyInput,
},
props: {
form: Object,
@ -110,6 +112,14 @@ export default {
carModels: [],
brandSelection: this.brand,
car_modelSelection: this.car_model,
currencyOptions: {
currency: 'CHF',
locale: 'de-CH',
exportValueAsInteger: true,
hideGroupingSeparatorOnFocus: false,
precision: 0,
currencyDisplay: 'hidden',
},
}
},
methods: {

View File

@ -19,7 +19,7 @@
<div class="col-span-6 sm:col-span-4">
<jet-label for="price" value="Betrag" />
<jet-input id="price" type="text" class="mt-1 block w-full" v-model="form.price" ref="price" autocomplete="price" />
<currency-input v-model="form.price" :options="currencyOptions" id="price" class="w-full mt-1 block border-gray-300 focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 rounded-md shadow-sm" ref="price"/>
<jet-input-error :message="form.errors.price" class="mt-2" />
</div>
@ -55,6 +55,7 @@ import JetInputError from '@/Jetstream/InputError'
import JetFormSection from '@/Jetstream/FormSection'
import Datepicker from 'vue3-datepicker'
import { useForm } from '@inertiajs/inertia-vue3'
import CurrencyInput from '@/Components/CurrencyInput'
export default {
components: {
@ -65,6 +66,7 @@ export default {
JetInputError,
JetActionMessage,
Datepicker,
CurrencyInput,
},
props: {
data: Object,
@ -74,6 +76,12 @@ export default {
data() {
return {
form: useForm(this.meta.form_name, this.data),
currencyOptions: {
currency: 'CHF',
locale: 'de-CH',
exportValueAsInteger: true,
hideGroupingSeparatorOnFocus: false,
},
}
},
methods: {