Discount calculations frontend

This commit is contained in:
Peter Papp
2021-05-03 16:52:32 +02:00
parent eb2a7323e9
commit 9793a55efd
2 changed files with 228 additions and 77 deletions
+84 -2
View File
@@ -56,7 +56,7 @@
"/chunks/oasis/invoices/client-detail.js": "/chunks/oasis/invoices/client-detail.js?id=d10dd00193bb29222ec7", "/chunks/oasis/invoices/client-detail.js": "/chunks/oasis/invoices/client-detail.js?id=d10dd00193bb29222ec7",
"/chunks/oasis/invoices/client-invoices.js": "/chunks/oasis/invoices/client-invoices.js?id=a95ccce067bd07bd73ac", "/chunks/oasis/invoices/client-invoices.js": "/chunks/oasis/invoices/client-invoices.js?id=a95ccce067bd07bd73ac",
"/chunks/oasis/invoices/create-client.js": "/chunks/oasis/invoices/create-client.js?id=c092e8eebdde4a9a1aad", "/chunks/oasis/invoices/create-client.js": "/chunks/oasis/invoices/create-client.js?id=c092e8eebdde4a9a1aad",
"/chunks/oasis/invoices/create-invoice.js": "/chunks/oasis/invoices/create-invoice.js?id=7dc45b850190d3880f37", "/chunks/oasis/invoices/create-invoice.js": "/chunks/oasis/invoices/create-invoice.js?id=e264237fc70a6ca79b94",
"/chunks/oasis/invoices/list.js": "/chunks/oasis/invoices/list.js?id=a622e568efb24e955520", "/chunks/oasis/invoices/list.js": "/chunks/oasis/invoices/list.js?id=a622e568efb24e955520",
"/chunks/oasis/invoices/profile.js": "/chunks/oasis/invoices/profile.js?id=94f783e4d95215ff00a1", "/chunks/oasis/invoices/profile.js": "/chunks/oasis/invoices/profile.js?id=94f783e4d95215ff00a1",
"/chunks/oasis/invoices~chunks/platform~chunks/shared.js": "/chunks/oasis/invoices~chunks/platform~chunks/shared.js?id=a53a01abf7a98a9c2d15", "/chunks/oasis/invoices~chunks/platform~chunks/shared.js": "/chunks/oasis/invoices~chunks/platform~chunks/shared.js?id=a53a01abf7a98a9c2d15",
@@ -381,5 +381,87 @@
"/chunks/oasis/invoices/create-invoice.55753e07146337bc85aa.hot-update.js": "/chunks/oasis/invoices/create-invoice.55753e07146337bc85aa.hot-update.js", "/chunks/oasis/invoices/create-invoice.55753e07146337bc85aa.hot-update.js": "/chunks/oasis/invoices/create-invoice.55753e07146337bc85aa.hot-update.js",
"/chunks/oasis/invoices/create-invoice.f23ba6ba9a8ebcd94d1c.hot-update.js": "/chunks/oasis/invoices/create-invoice.f23ba6ba9a8ebcd94d1c.hot-update.js", "/chunks/oasis/invoices/create-invoice.f23ba6ba9a8ebcd94d1c.hot-update.js": "/chunks/oasis/invoices/create-invoice.f23ba6ba9a8ebcd94d1c.hot-update.js",
"/chunks/oasis/invoices/create-invoice.133c9452e3f3b963f4b8.hot-update.js": "/chunks/oasis/invoices/create-invoice.133c9452e3f3b963f4b8.hot-update.js", "/chunks/oasis/invoices/create-invoice.133c9452e3f3b963f4b8.hot-update.js": "/chunks/oasis/invoices/create-invoice.133c9452e3f3b963f4b8.hot-update.js",
"/chunks/oasis/invoices/create-invoice.18147e2594153da4071c.hot-update.js": "/chunks/oasis/invoices/create-invoice.18147e2594153da4071c.hot-update.js" "/chunks/oasis/invoices/create-invoice.18147e2594153da4071c.hot-update.js": "/chunks/oasis/invoices/create-invoice.18147e2594153da4071c.hot-update.js",
"/chunks/oasis/invoices/create-invoice.e3449e049ee0fa4f1b6f.hot-update.js": "/chunks/oasis/invoices/create-invoice.e3449e049ee0fa4f1b6f.hot-update.js",
"/chunks/oasis/invoices/create-invoice.0c159b12262dfbc5b00b.hot-update.js": "/chunks/oasis/invoices/create-invoice.0c159b12262dfbc5b00b.hot-update.js",
"/chunks/oasis/invoices/create-invoice.e533f15bd33914a79b0b.hot-update.js": "/chunks/oasis/invoices/create-invoice.e533f15bd33914a79b0b.hot-update.js",
"/chunks/oasis/invoices/create-invoice.7b45f0f5ed70aa7225ca.hot-update.js": "/chunks/oasis/invoices/create-invoice.7b45f0f5ed70aa7225ca.hot-update.js",
"/chunks/oasis/invoices/create-invoice.311402fbfd48d6e2beb4.hot-update.js": "/chunks/oasis/invoices/create-invoice.311402fbfd48d6e2beb4.hot-update.js",
"/chunks/oasis/invoices/create-invoice.51d257986a17f18e3a35.hot-update.js": "/chunks/oasis/invoices/create-invoice.51d257986a17f18e3a35.hot-update.js",
"/chunks/oasis/invoices/create-invoice.2dc8ad748e4e59ebc5ea.hot-update.js": "/chunks/oasis/invoices/create-invoice.2dc8ad748e4e59ebc5ea.hot-update.js",
"/chunks/oasis/invoices/create-invoice.1eeaa4dd4677ac4d3e8c.hot-update.js": "/chunks/oasis/invoices/create-invoice.1eeaa4dd4677ac4d3e8c.hot-update.js",
"/chunks/oasis/invoices/create-invoice.7ed366ef5870e89c6ce6.hot-update.js": "/chunks/oasis/invoices/create-invoice.7ed366ef5870e89c6ce6.hot-update.js",
"/chunks/oasis/invoices/create-invoice.7f16ad4e9d3064db8581.hot-update.js": "/chunks/oasis/invoices/create-invoice.7f16ad4e9d3064db8581.hot-update.js",
"/chunks/oasis/invoices/create-invoice.62a26cef693863c98630.hot-update.js": "/chunks/oasis/invoices/create-invoice.62a26cef693863c98630.hot-update.js",
"/chunks/oasis/invoices/create-invoice.14f8a7f75625743ac3cc.hot-update.js": "/chunks/oasis/invoices/create-invoice.14f8a7f75625743ac3cc.hot-update.js",
"/chunks/oasis/invoices/create-invoice.3438bfde66a2af8a2c84.hot-update.js": "/chunks/oasis/invoices/create-invoice.3438bfde66a2af8a2c84.hot-update.js",
"/chunks/oasis/invoices/create-invoice.ea2c5f8bd2390359d2ae.hot-update.js": "/chunks/oasis/invoices/create-invoice.ea2c5f8bd2390359d2ae.hot-update.js",
"/chunks/oasis/invoices/create-invoice.4052ff979862569cbedd.hot-update.js": "/chunks/oasis/invoices/create-invoice.4052ff979862569cbedd.hot-update.js",
"/chunks/oasis/invoices/create-invoice.5d05b9564ed45fe8b583.hot-update.js": "/chunks/oasis/invoices/create-invoice.5d05b9564ed45fe8b583.hot-update.js",
"/chunks/oasis/invoices/create-invoice.b9fe4a1b32fae2672fad.hot-update.js": "/chunks/oasis/invoices/create-invoice.b9fe4a1b32fae2672fad.hot-update.js",
"/chunks/oasis/invoices/create-invoice.11a2af108f4b862371e5.hot-update.js": "/chunks/oasis/invoices/create-invoice.11a2af108f4b862371e5.hot-update.js",
"/chunks/oasis/invoices/create-invoice.7737846126a79d150ca2.hot-update.js": "/chunks/oasis/invoices/create-invoice.7737846126a79d150ca2.hot-update.js",
"/chunks/oasis/invoices/create-invoice.ccd2ebda046b440ae734.hot-update.js": "/chunks/oasis/invoices/create-invoice.ccd2ebda046b440ae734.hot-update.js",
"/chunks/oasis/invoices/create-invoice.3c989554bc1882a21b68.hot-update.js": "/chunks/oasis/invoices/create-invoice.3c989554bc1882a21b68.hot-update.js",
"/chunks/oasis/invoices/create-invoice.ce96a757337fcb60d0b5.hot-update.js": "/chunks/oasis/invoices/create-invoice.ce96a757337fcb60d0b5.hot-update.js",
"/chunks/oasis/invoices/create-invoice.c8e8bc6ab417b3af89fe.hot-update.js": "/chunks/oasis/invoices/create-invoice.c8e8bc6ab417b3af89fe.hot-update.js",
"/chunks/oasis/invoices/create-invoice.90162412fcbf5db7368b.hot-update.js": "/chunks/oasis/invoices/create-invoice.90162412fcbf5db7368b.hot-update.js",
"/chunks/oasis/invoices/create-invoice.691e79c344060d8f97ed.hot-update.js": "/chunks/oasis/invoices/create-invoice.691e79c344060d8f97ed.hot-update.js",
"/chunks/oasis/invoices/create-invoice.9db32723ed9da94a33f0.hot-update.js": "/chunks/oasis/invoices/create-invoice.9db32723ed9da94a33f0.hot-update.js",
"/chunks/oasis/invoices/create-invoice.46fac9267e2be280a1f7.hot-update.js": "/chunks/oasis/invoices/create-invoice.46fac9267e2be280a1f7.hot-update.js",
"/chunks/oasis/invoices/create-invoice.3051607fc98adc353afa.hot-update.js": "/chunks/oasis/invoices/create-invoice.3051607fc98adc353afa.hot-update.js",
"/chunks/oasis/invoices/create-invoice.28cd24eba07e46ddc4c8.hot-update.js": "/chunks/oasis/invoices/create-invoice.28cd24eba07e46ddc4c8.hot-update.js",
"/chunks/oasis/invoices/create-invoice.9a3acdc1a3297d003dd4.hot-update.js": "/chunks/oasis/invoices/create-invoice.9a3acdc1a3297d003dd4.hot-update.js",
"/chunks/oasis/invoices/create-invoice.c74a429be1c795d8cee9.hot-update.js": "/chunks/oasis/invoices/create-invoice.c74a429be1c795d8cee9.hot-update.js",
"/chunks/oasis/invoices/create-invoice.e26644bea9ed7109d255.hot-update.js": "/chunks/oasis/invoices/create-invoice.e26644bea9ed7109d255.hot-update.js",
"/chunks/oasis/invoices/create-invoice.f738c5d1f9dd85c22b0f.hot-update.js": "/chunks/oasis/invoices/create-invoice.f738c5d1f9dd85c22b0f.hot-update.js",
"/chunks/oasis/invoices/create-invoice.3b626413f85bca230f79.hot-update.js": "/chunks/oasis/invoices/create-invoice.3b626413f85bca230f79.hot-update.js",
"/chunks/oasis/invoices/create-invoice.9f29341d155f53c7f3d5.hot-update.js": "/chunks/oasis/invoices/create-invoice.9f29341d155f53c7f3d5.hot-update.js",
"/chunks/oasis/invoices/create-invoice.bbc7d60bbd5a7bd9b41d.hot-update.js": "/chunks/oasis/invoices/create-invoice.bbc7d60bbd5a7bd9b41d.hot-update.js",
"/chunks/oasis/invoices/create-invoice.824477a010ea10889acf.hot-update.js": "/chunks/oasis/invoices/create-invoice.824477a010ea10889acf.hot-update.js",
"/chunks/oasis/invoices/create-invoice.19723a66b0c074495a2a.hot-update.js": "/chunks/oasis/invoices/create-invoice.19723a66b0c074495a2a.hot-update.js",
"/chunks/oasis/invoices/create-invoice.bef0b9d5cb81eb5330b5.hot-update.js": "/chunks/oasis/invoices/create-invoice.bef0b9d5cb81eb5330b5.hot-update.js",
"/chunks/oasis/invoices/create-invoice.0bd7c8c052467d01985c.hot-update.js": "/chunks/oasis/invoices/create-invoice.0bd7c8c052467d01985c.hot-update.js",
"/chunks/oasis/invoices/create-invoice.2b931633a990f74122a0.hot-update.js": "/chunks/oasis/invoices/create-invoice.2b931633a990f74122a0.hot-update.js",
"/chunks/oasis/invoices/create-invoice.e0b60badf05e33432548.hot-update.js": "/chunks/oasis/invoices/create-invoice.e0b60badf05e33432548.hot-update.js",
"/chunks/oasis/invoices/create-invoice.99e1dfee8ce724a6e507.hot-update.js": "/chunks/oasis/invoices/create-invoice.99e1dfee8ce724a6e507.hot-update.js",
"/chunks/oasis/invoices/create-invoice.a20b59289ad1b5609a07.hot-update.js": "/chunks/oasis/invoices/create-invoice.a20b59289ad1b5609a07.hot-update.js",
"/chunks/oasis/invoices/create-invoice.f164b030f87952a265cb.hot-update.js": "/chunks/oasis/invoices/create-invoice.f164b030f87952a265cb.hot-update.js",
"/chunks/oasis/invoices/create-invoice.d3eae4afaddf9e6150bf.hot-update.js": "/chunks/oasis/invoices/create-invoice.d3eae4afaddf9e6150bf.hot-update.js",
"/chunks/oasis/invoices/create-invoice.713d904bcd64890f4f2a.hot-update.js": "/chunks/oasis/invoices/create-invoice.713d904bcd64890f4f2a.hot-update.js",
"/chunks/oasis/invoices/create-invoice.d12c74f94a16d27ffff0.hot-update.js": "/chunks/oasis/invoices/create-invoice.d12c74f94a16d27ffff0.hot-update.js",
"/chunks/oasis/invoices/create-invoice.032a92c37046bb2a2089.hot-update.js": "/chunks/oasis/invoices/create-invoice.032a92c37046bb2a2089.hot-update.js",
"/chunks/oasis/invoices/create-invoice.71c164db066919e4698c.hot-update.js": "/chunks/oasis/invoices/create-invoice.71c164db066919e4698c.hot-update.js",
"/chunks/oasis/invoices/create-invoice.9bb7f95a875f2fba3609.hot-update.js": "/chunks/oasis/invoices/create-invoice.9bb7f95a875f2fba3609.hot-update.js",
"/chunks/oasis/invoices/create-invoice.0add1990796aa2b4efdc.hot-update.js": "/chunks/oasis/invoices/create-invoice.0add1990796aa2b4efdc.hot-update.js",
"/chunks/oasis/invoices/create-invoice.9ee070940ae898f32fb3.hot-update.js": "/chunks/oasis/invoices/create-invoice.9ee070940ae898f32fb3.hot-update.js",
"/chunks/oasis/invoices/create-invoice.791bae8701b4a4f394c3.hot-update.js": "/chunks/oasis/invoices/create-invoice.791bae8701b4a4f394c3.hot-update.js",
"/chunks/oasis/invoices/create-invoice.23758608e6d9ae16fffd.hot-update.js": "/chunks/oasis/invoices/create-invoice.23758608e6d9ae16fffd.hot-update.js",
"/chunks/oasis/invoices/create-invoice.fca4eeca6d0da922ff3a.hot-update.js": "/chunks/oasis/invoices/create-invoice.fca4eeca6d0da922ff3a.hot-update.js",
"/chunks/oasis/invoices/create-invoice.e8b137cf1d0b75e9fb16.hot-update.js": "/chunks/oasis/invoices/create-invoice.e8b137cf1d0b75e9fb16.hot-update.js",
"/chunks/oasis/invoices/create-invoice.6646762aae61aa188c25.hot-update.js": "/chunks/oasis/invoices/create-invoice.6646762aae61aa188c25.hot-update.js",
"/chunks/oasis/invoices/create-invoice.9d7d892dc8fdd314cb63.hot-update.js": "/chunks/oasis/invoices/create-invoice.9d7d892dc8fdd314cb63.hot-update.js",
"/chunks/oasis/invoices/create-invoice.05ef14e6192f31303652.hot-update.js": "/chunks/oasis/invoices/create-invoice.05ef14e6192f31303652.hot-update.js",
"/chunks/oasis/invoices/create-invoice.88a9f86c5031a4a92511.hot-update.js": "/chunks/oasis/invoices/create-invoice.88a9f86c5031a4a92511.hot-update.js",
"/chunks/oasis/invoices/create-invoice.53d5c5f61cb197f64996.hot-update.js": "/chunks/oasis/invoices/create-invoice.53d5c5f61cb197f64996.hot-update.js",
"/chunks/oasis/invoices/create-invoice.9aa52bdf59a716ba574b.hot-update.js": "/chunks/oasis/invoices/create-invoice.9aa52bdf59a716ba574b.hot-update.js",
"/chunks/oasis/invoices/create-invoice.f4fbf58786a99550c121.hot-update.js": "/chunks/oasis/invoices/create-invoice.f4fbf58786a99550c121.hot-update.js",
"/chunks/oasis/invoices/create-invoice.64d19e98d750b0504d02.hot-update.js": "/chunks/oasis/invoices/create-invoice.64d19e98d750b0504d02.hot-update.js",
"/chunks/oasis/invoices/create-invoice.80ae5e7ef62597f3d21e.hot-update.js": "/chunks/oasis/invoices/create-invoice.80ae5e7ef62597f3d21e.hot-update.js",
"/chunks/oasis/invoices/create-invoice.8fa6f2bcdad83e1821ed.hot-update.js": "/chunks/oasis/invoices/create-invoice.8fa6f2bcdad83e1821ed.hot-update.js",
"/chunks/oasis/invoices/create-invoice.4c65bbacdc401cacab07.hot-update.js": "/chunks/oasis/invoices/create-invoice.4c65bbacdc401cacab07.hot-update.js",
"/chunks/oasis/invoices/create-invoice.eb46ae4c5241b4687ef7.hot-update.js": "/chunks/oasis/invoices/create-invoice.eb46ae4c5241b4687ef7.hot-update.js",
"/chunks/oasis/invoices/create-invoice.2499f8263f2f909b79bf.hot-update.js": "/chunks/oasis/invoices/create-invoice.2499f8263f2f909b79bf.hot-update.js",
"/chunks/oasis/invoices/create-invoice.6fb566262caa46c71c81.hot-update.js": "/chunks/oasis/invoices/create-invoice.6fb566262caa46c71c81.hot-update.js",
"/chunks/oasis/invoices/create-invoice.7f49bb34e13de85f46be.hot-update.js": "/chunks/oasis/invoices/create-invoice.7f49bb34e13de85f46be.hot-update.js",
"/chunks/oasis/invoices/create-invoice.dfb707ecdfe9a3aa543c.hot-update.js": "/chunks/oasis/invoices/create-invoice.dfb707ecdfe9a3aa543c.hot-update.js",
"/chunks/oasis/invoices/create-invoice.ca3f0445e7e948886448.hot-update.js": "/chunks/oasis/invoices/create-invoice.ca3f0445e7e948886448.hot-update.js",
"/chunks/oasis/invoices/create-invoice.662d842dc26e1c27ad56.hot-update.js": "/chunks/oasis/invoices/create-invoice.662d842dc26e1c27ad56.hot-update.js",
"/chunks/oasis/invoices/create-invoice.0fb6e028ae5b15c79a44.hot-update.js": "/chunks/oasis/invoices/create-invoice.0fb6e028ae5b15c79a44.hot-update.js",
"/chunks/oasis/invoices/create-invoice.3d4904c89c0a78b71470.hot-update.js": "/chunks/oasis/invoices/create-invoice.3d4904c89c0a78b71470.hot-update.js",
"/chunks/oasis/invoices/create-invoice.5804addc080b8ed62d11.hot-update.js": "/chunks/oasis/invoices/create-invoice.5804addc080b8ed62d11.hot-update.js",
"/chunks/oasis/invoices/create-invoice.1d1ce4a53ffbb6c810e6.hot-update.js": "/chunks/oasis/invoices/create-invoice.1d1ce4a53ffbb6c810e6.hot-update.js",
"/chunks/oasis/invoices/create-invoice.092613c9c8c9a92be2c4.hot-update.js": "/chunks/oasis/invoices/create-invoice.092613c9c8c9a92be2c4.hot-update.js",
"/chunks/oasis/invoices/create-invoice.94802f10381b6e75e16e.hot-update.js": "/chunks/oasis/invoices/create-invoice.94802f10381b6e75e16e.hot-update.js",
"/chunks/oasis/invoices/create-invoice.2b5ed34190ba7483775a.hot-update.js": "/chunks/oasis/invoices/create-invoice.2b5ed34190ba7483775a.hot-update.js"
} }
@@ -4,57 +4,11 @@
<PageHeader :title="pageTitle" /> <PageHeader :title="pageTitle" />
<div id="page-content"> <div id="page-content">
<div class="content-page order"> <div class="content-page">
<ValidationObserver @submit.prevent="createInvoice" ref="createInvoice" v-slot="{ invalid }" tag="form" class="steps form block-form"> <ValidationObserver @submit.prevent="createInvoice" ref="createInvoice" v-slot="{ invalid }" tag="form" class="form block-form">
<PageTab> <PageTab>
<PageTabGroup>
<FormLabel icon="edit">Items</FormLabel>
<div class="duplicator">
<div class="plan-item duplicator-item" v-for="(item, index) in invoice.items" :key="index++">
<x-icon @click="removeRow(item)" v-if="index !== 0" size="22" class="delete-item hover-text-theme" />
<div class="block-wrapper">
<label>Description:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="description" rules="required" v-slot="{ errors }">
<input v-model="item.description" placeholder="Type item description..." type="text" :class="{'is-error': errors[0]}" class="focus-border-theme" />
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
<div class="wrapper-inline">
<div class="block-wrapper">
<label>Amount:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="amount" rules="required" v-slot="{ errors }">
<input v-model.number="item.amount" placeholder="The amount in Pcs." type="number" :class="{'is-error': errors[0]}" class="focus-border-theme" />
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
<div v-if="isVatPayer" class="block-wrapper">
<label>Tax Rate:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="tax_rate" rules="required" v-slot="{ errors }">
<input v-model.number="item.tax_rate" placeholder="Type item tax rate in %..." type="number" step="1" min="1" max="100" :class="{'is-error': errors[0]}" class="focus-border-theme" />
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
<div class="block-wrapper">
<label>Price:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="price" rules="required" v-slot="{ errors }">
<input v-model.number="item.price" placeholder="Type the item price..." type="number" step="0.01" :class="{'is-error': errors[0]}" class="focus-border-theme" />
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
</div>
</div>
<ButtonBase @click.native="addRow" class="duplicator-add-button" button-style="theme" style="width: 100%">
Add New Item
</ButtonBase>
</div>
</PageTabGroup>
<!--Properties-->
<PageTabGroup> <PageTabGroup>
<FormLabel icon="tool">Invoice Properties</FormLabel> <FormLabel icon="tool">Invoice Properties</FormLabel>
@@ -89,6 +43,7 @@
</div> </div>
</PageTabGroup> </PageTabGroup>
<!--Client-->
<PageTabGroup> <PageTabGroup>
<FormLabel icon="user">Client</FormLabel> <FormLabel icon="user">Client</FormLabel>
@@ -190,6 +145,56 @@
</div> </div>
</PageTabGroup> </PageTabGroup>
<!--Items-->
<PageTabGroup>
<FormLabel icon="edit">Items</FormLabel>
<div class="duplicator">
<div class="plan-item duplicator-item" v-for="(item, index) in invoice.items" :key="index++">
<x-icon @click="removeRow(item)" v-if="index !== 0" size="22" class="delete-item hover-text-theme" />
<div class="block-wrapper">
<label>Description:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="description" rules="required" v-slot="{ errors }">
<input v-model="item.description" placeholder="Type item description..." type="text" :class="{'is-error': errors[0]}" class="focus-border-theme" />
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
<div class="wrapper-inline">
<div class="block-wrapper">
<label>Amount:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="amount" rules="required" v-slot="{ errors }">
<input v-model.number="item.amount" placeholder="The amount in Pcs." type="number" :class="{'is-error': errors[0]}" class="focus-border-theme" />
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
<div v-if="isVatPayer" class="block-wrapper">
<label>Tax Rate:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="tax_rate" rules="required" v-slot="{ errors }">
<input v-model.number="item.tax_rate" placeholder="Type item tax rate in %..." type="number" step="1" min="1" max="100" :class="{'is-error': errors[0]}" class="focus-border-theme" />
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
<div class="block-wrapper">
<label>Price:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="price" rules="required" v-slot="{ errors }">
<input v-model.number="item.price" placeholder="Type the item price..." type="number" step="0.01" :class="{'is-error': errors[0]}" class="focus-border-theme" />
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
</div>
</div>
<ButtonBase @click.native="addRow" class="duplicator-add-button" button-style="theme" style="width: 100%">
Add New Item
</ButtonBase>
</div>
</PageTabGroup>
<!--Discount-->
<PageTabGroup> <PageTabGroup>
<FormLabel icon="credit-card">Discount</FormLabel> <FormLabel icon="credit-card">Discount</FormLabel>
@@ -216,12 +221,13 @@
<div v-if="isDiscount" class="block-wrapper"> <div v-if="isDiscount" class="block-wrapper">
<label>Discount Rate:</label> <label>Discount Rate:</label>
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="discount_rate" rules="required" v-slot="{ errors }"> <ValidationProvider tag="div" mode="passive" class="input-wrapper" name="discount_rate" rules="required" v-slot="{ errors }">
<input v-model.number="invoice.discount_rate" placeholder="" type="number" :class="{'is-error': errors[0]}" class="focus-border-theme" /> <input v-model.number="invoice.discount_rate" placeholder="" max="100" min="0" type="number" :class="{'is-error': errors[0]}" class="focus-border-theme" />
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span> <span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider> </ValidationProvider>
</div> </div>
</PageTabGroup> </PageTabGroup>
<!--Others-->
<PageTabGroup> <PageTabGroup>
<FormLabel icon="settings">Others</FormLabel> <FormLabel icon="settings">Others</FormLabel>
@@ -255,12 +261,23 @@
<FormLabel icon="credit-card">Invoice Summary</FormLabel> <FormLabel icon="credit-card">Invoice Summary</FormLabel>
<div class="summary-list" :class="{'is-error': isError}"> <div class="summary-list" :class="{'is-error': isError}">
<div v-for="(tax, i) in taxBased" :key="i" class="row small"> <div v-if="isDiscount && invoice.discount_rate > 0" class="row small">
<div class="cell"> <div class="cell">
<span>Základ DPH {{ tax.rate }}%</span> <span>Discount</span>
</div> </div>
<div class="cell"> <div class="cell">
<span>{{ formatNumber(tax.total) }}</span> <span>- {{ formatNumber(invoice.discount_rate) }} {{ invoice.discount_type === 'percent' ? '%' : ''}}</span>
</div>
</div>
<div :class="{'is-offset': isDiscount && invoice.discount_rate > 0}">
<div v-for="(tax, i) in taxBased" :key="i" class="row small">
<div class="cell">
<span>Základ DPH {{ tax.rate }}%</span>
</div>
<div class="cell">
<span>{{ formatNumber(tax.total) }}</span>
</div>
</div> </div>
</div> </div>
@@ -362,13 +379,32 @@
}) })
} else { } else {
bag.find(bagItem => { bag.find(bagItem => {
if (bagItem.rate === item.tax_rate)
// Count total tax rate for percentage
if (bagItem.rate === item.tax_rate) {
bagItem.total += (item.price * item.amount) bagItem.total += (item.price * item.amount)
}
}) })
} }
} }
}) })
// Count discount
if (this.isDiscount) {
bag.forEach(bagItem => {
if (this.invoice.discount_type === 'percent') {
bagItem.total -= bagItem.total * (this.invoice.discount_rate / 100)
}
if (this.invoice.discount_type === 'value') {
let percentage_of_discount = this.invoice.discount_rate / (this.total + this.invoice.discount_rate)
bagItem.total -= bagItem.total * percentage_of_discount
}
})
}
return bag return bag
}, },
taxSummary() { taxSummary() {
@@ -387,14 +423,33 @@
} else { } else {
bag.find(bagItem => { bag.map(bagItem => {
if (bagItem.rate === item.tax_rate)
// Count total tax rate for percentage
if (bagItem.rate === item.tax_rate) {
bagItem.total += (item.price * item.amount) * (item.tax_rate / 100) bagItem.total += (item.price * item.amount) * (item.tax_rate / 100)
}
}) })
} }
} }
}) })
// Count discount
if (this.isDiscount) {
bag.forEach(bagItem => {
if (this.invoice.discount_type === 'percent') {
bagItem.total -= bagItem.total * (this.invoice.discount_rate / 100)
}
if (this.invoice.discount_type === 'value') {
let percentage_of_discount = this.invoice.discount_rate / (this.total + this.invoice.discount_rate)
bagItem.total -= bagItem.total * percentage_of_discount
}
})
}
return bag return bag
}, },
total() { total() {
@@ -405,6 +460,7 @@
let total_without_tax = (item.price * item.amount) let total_without_tax = (item.price * item.amount)
// Count tax
if (item.tax_rate) { if (item.tax_rate) {
total_without_tax += total_without_tax * (item.tax_rate / 100) total_without_tax += total_without_tax * (item.tax_rate / 100)
} }
@@ -413,6 +469,18 @@
} }
}) })
// Count discount
if (this.isDiscount) {
if (this.invoice.discount_type === 'percent') {
total -= total * (this.invoice.discount_rate / 100)
}
if (this.invoice.discount_type === 'value') {
total -= this.invoice.discount_rate
}
}
return total return total
} }
}, },
@@ -428,7 +496,7 @@
return { return {
isLoading: true, isLoading: true,
isError: false, isError: false,
isDiscount: false, isDiscount: true,
isVatPayer: false, isVatPayer: false,
clients: [], clients: [],
latestInvoiceNumber: undefined, latestInvoiceNumber: undefined,
@@ -472,13 +540,20 @@
{ {
id: 1, id: 1,
description: 'Item 1', description: 'Item 1',
amount: 1, amount: 2,
tax_rate: 20, tax_rate: 20,
price: 200, price: 200,
} },
{
id: 2,
description: 'Item 2',
amount: 1,
tax_rate: 10,
price: 100,
},
], ],
discount_type: 'percent', discount_type: 'value',
discount_rate: '10', discount_rate: 10,
client: '0354bab9-1b23-4d17-aa5f-fd8e9aaaf0a2', client: '0354bab9-1b23-4d17-aa5f-fd8e9aaaf0a2',
client_avatar: '', client_avatar: '',
client_name: 'VueFileManager Inc.', client_name: 'VueFileManager Inc.',
@@ -628,24 +703,17 @@
@import '@assets/vuefilemanager/_forms'; @import '@assets/vuefilemanager/_forms';
#page-content { #page-content {
max-width: 1190px; max-width: 1100px;
} }
.order { .content-page {
display: flex; display: grid;
grid-template-columns: 2fr 1fr;
margin-bottom: 30px; margin-bottom: 30px;
gap: 50px;
.steps { .form {
flex: 0 0 65%; max-width: 100%;
padding-right: 30px;
.form {
max-width: 100%;
}
}
.summary {
flex: 0 0 34%;
} }
} }
@@ -719,6 +787,7 @@
span { span {
@include font-size(14); @include font-size(14);
font-weight: 600;
} }
} }
} }