verdnatura/salix-front
verdnatura
/
salix-front
2
2
Fork 1
Code Issues Pull Requests 97 Releases Wiki Activity

WIP: refs #6416 - refactor-InvoiceIn #196

Closed
jsegarra wants to merge 17 commits from 6416-refactor-InvoiceIn into dev
pull from: 6416-refactor-InvoiceIn
merge into: verdnatura:dev
Conversation 0 Commits 17 Files Changed 27 +941 -355
27 changed files with 941 additions and 355 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

79
src/components/CrudModel.vue
View File

@ -4,14 +4,15 @@ import { computed, ref, watch } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useQuasar } from 'quasar'; import { useQuasar } from 'quasar';
import { useValidator } from 'src/composables/useValidator'; import { useValidator } from 'src/composables/useValidator';
import { useStateStore } from 'stores/useStateStore'; // import { useStateStore } from 'stores/useStateStore';
import VnPaginate from 'components/ui/VnPaginate.vue'; import VnPaginate from 'components/ui/VnPaginate.vue';
import VnConfirm from 'components/ui/VnConfirm.vue'; import VnConfirm from 'components/ui/VnConfirm.vue';
import SkeletonTable from 'components/ui/SkeletonTable.vue'; import SkeletonTable from 'components/ui/SkeletonTable.vue';
import { tMobile } from 'src/composables/tMobile'; import { tMobile } from 'src/composables/tMobile';
import VnTeleport from 'components/ui/VnTeleport.vue';
const quasar = useQuasar(); const quasar = useQuasar();
const stateStore = useStateStore(); // const stateStore = useStateStore();
const { t } = useI18n(); const { t } = useI18n();
const { validate } = useValidator(); const { validate } = useValidator();
@ -275,42 +276,44 @@ watch(formUrl, async () => {
</template> </template>
</VnPaginate> </VnPaginate>
<SkeletonTable v-if="!formData" /> <SkeletonTable v-if="!formData" />
<Teleport to="#st-actions" v-if="stateStore?.isSubToolbarShown()"> <VnTeleport>
<QBtnGroup push style="column-gap: 10px"> <template #st-actions>
<slot name="moreBeforeActions" /> <QBtnGroup push style="column-gap: 10px">
<QBtn <slot name="moreBeforeActions" />
:label="tMobile('globals.remove')" <QBtn
color="primary" :label="tMobile('globals.remove')"
icon="delete" color="primary"
flat icon="delete"
@click="remove(selected)" flat
:disable="!selected?.length" @click="remove(selected)"
:title="t('globals.remove')" :disable="!selected?.length"
v-if="$props.defaultRemove" :title="t('globals.remove')"
/> v-if="$props.defaultRemove"
<QBtn />
:label="tMobile('globals.reset')" <QBtn
color="primary" :label="tMobile('globals.reset')"
icon="restart_alt" color="primary"
flat icon="restart_alt"
@click="reset" flat
:disable="!hasChanges" @click="reset"
:title="t('globals.reset')" :disable="!hasChanges"
v-if="$props.defaultReset" :title="t('globals.reset')"
/> v-if="$props.defaultReset"
<QBtn />
:label="tMobile('globals.save')" <QBtn
ref="saveButtonRef" :label="tMobile('globals.save')"
color="primary" ref="saveButtonRef"
icon="save" color="primary"
@click="onSubmit" icon="save"
:disable="!hasChanges" @click="onSubmit"
:title="t('globals.save')" :disable="!hasChanges"
v-if="$props.defaultSave" :title="t('globals.save')"
/> v-if="$props.defaultSave"
<slot name="moreAfterActions" /> />
</QBtnGroup> <slot name="moreAfterActions" />
</Teleport> </QBtnGroup>
</template>
</VnTeleport>
<QInnerLoading <QInnerLoading
:showing="isLoading" :showing="isLoading"
:label="t && t('globals.pleaseWait')" :label="t && t('globals.pleaseWait')"

33
src/components/ui/VnBtn.vue Normal file
View File

@ -0,0 +1,33 @@
<script setup>
import { useI18n } from 'vue-i18n';
const $props = defineProps({
class: { type: String, require: true, default: null },
padding: { type: String, require: true, default: null },
color: { type: String, require: true, default: null },
icon: { type: String, require: true, default: null },
promise: { type: Function, require: true, default: null },
});
const { t } = useI18n();
async function onClick() {
if ($props.promise) return await $props.promise();
}
</script>
<template>
<QBtn
:class="$props.class"
:padding="$props.padding"
:icon="$props.icon"
flat
:color="$props.color"
round
@click="onClick()"
>
<QTooltip>
<slot name="tooltip">
{{ t('components.smartCard.downloadFile') }}
</slot></QTooltip
>
</QBtn>
</template>
<style lang="scss" scoped></style>

18
src/components/ui/VnCard.vue Normal file
View File

@ -0,0 +1,18 @@
<script setup>
import { useI18n } from 'vue-i18n';
const $props = defineProps({
columns: { type: Object, require: true, default: null },
rows: { type: Object, require: true, default: null },
});
const { t } = useI18n();
</script>
<template>
<QCard>
<slot name="header"></slot>
<slot name="body"></slot>
<slot name="footer"></slot>
</QCard>
</template>
<style lang="scss" scoped></style>

19
src/components/ui/VnCardSection.vue Normal file
View File

@ -0,0 +1,19 @@
<script setup>
import { useI18n } from 'vue-i18n';
const $props = defineProps({
title: { type: String, require: true, default: 'twoFactor.validate' },
href: { type: String, require: true, default: null },
});
const { t } = useI18n();
</script>
<template>
<QCardSection class="q-pa-none">
<a class="header" :href="$props.href">
{{ t($props.title) }}
<slot name="icon"></slot>
</a>
<slot name="btn"></slot>
</QCardSection>
</template>
<style lang="scss" scoped></style>

16
src/components/ui/VnChip.vue Normal file
View File

@ -0,0 +1,16 @@
<script setup>
import { useI18n } from 'vue-i18n';
const $props = defineProps({
class: { type: String, require: true, default: null },
color: { type: String, require: true, default: null },
title: { type: String, require: true, default: null },
});
const { t } = useI18n();
</script>
<template>
<QChip dense :class="$props.class" :color="$props.color" :title="$props.title">
<slot name="body"> </slot
></QChip>
</template>
<style lang="scss" scoped></style>

13
src/components/ui/VnIcon.vue Normal file
View File

@ -0,0 +1,13 @@
<script setup>
import { useI18n } from 'vue-i18n';
const $props = defineProps({
name: { type: String, require: true, default: null },
color: { type: String, require: true, default: null },
});
const { t } = useI18n();
</script>
<template>
<QIcon :name="$props.name" :color="$props.color" />
</template>
<style lang="scss" scoped></style>

34
src/components/ui/VnTable.vue Normal file
View File

@ -0,0 +1,34 @@
<script setup>
import { useI18n } from 'vue-i18n';
const $props = defineProps({
columns: { type: Object, require: true, default: null },
rows: { type: Object, require: true, default: null },
hasSummary: { type: Boolean, require: true, default: false },
summary: { type: Object, require: true, default: null },
});
const { t } = useI18n();
</script>
<template>
<QTable :columns="$props.columns" :rows="$props.rows" flat hide-pagination>
<template #header="props">
<QTr :props="props" class="bg">
<QTh v-for="col in props.cols" :key="col.name" :props="props">
{{ t(col.label) }}
</QTh>
</QTr>
</template>
<template #bottom-row v-if="hasSummary">
<QTr class="bg">
<QTd v-for="col in $props.columns" :key="col.name" :props="props">{{
$props.summary[col.name]
}}</QTd>
</QTr>
</template>
</QTable>
</template>
<style lang="scss" scoped>
.bg {
background-color: var(--vn-light-gray);
}
</style>

14
src/components/ui/VnTeleport.vue Normal file
View File

@ -0,0 +1,14 @@
<script setup>
import { useStateStore } from 'stores/useStateStore';
const stateStore = useStateStore();
</script>
<template>
<Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()">
<slot name="st-data"></slot>
</Teleport>
<Teleport to="#st-actions" v-if="stateStore?.isSubToolbarShown()">
<slot name="st-actions"></slot>
</Teleport>
</template>

4
src/pages/Claim/Card/ClaimAction.vue
View File

@ -13,6 +13,7 @@ import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
import VnConfirm from 'src/components/ui/VnConfirm.vue'; import VnConfirm from 'src/components/ui/VnConfirm.vue';
import TicketDescriptorProxy from 'src/pages/Ticket/Card/TicketDescriptorProxy.vue'; import TicketDescriptorProxy from 'src/pages/Ticket/Card/TicketDescriptorProxy.vue';
import { useArrayData } from 'composables/useArrayData'; import { useArrayData } from 'composables/useArrayData';
import VnTeleport from 'components/ui/VnTeleport.vue';
const { t } = useI18n(); const { t } = useI18n();
const quasar = useQuasar(); const quasar = useQuasar();
@ -267,7 +268,8 @@ async function importToNewRefundTicket() {
/> />
</QCard> </QCard>
</QDrawer> </QDrawer>
<Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()"> </Teleport> <VnTeleport></VnTeleport>
<!-- <Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()"> </Teleport> -->
<CrudModel <CrudModel
v-if="claim" v-if="claim"
data-key="ClaimEnds" data-key="ClaimEnds"

39
src/pages/Claim/Card/ClaimLines.vue
View File

@ -4,11 +4,12 @@ import { ref, computed } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useQuasar } from 'quasar'; import { useQuasar } from 'quasar';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { useStateStore } from 'stores/useStateStore'; // import { useStateStore } from 'stores/useStateStore';
import { useArrayData } from 'composables/useArrayData'; import { useArrayData } from 'composables/useArrayData';
import { toDate, toCurrency, toPercentage } from 'filters/index'; import { toDate, toCurrency, toPercentage } from 'filters/index';
import CrudModel from 'components/CrudModel.vue'; import CrudModel from 'components/CrudModel.vue';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
import VnTeleport from 'components/ui/VnTeleport.vue';
import VnDiscount from 'components/common/vnDiscount.vue'; import VnDiscount from 'components/common/vnDiscount.vue';
import ClaimLinesImport from './ClaimLinesImport.vue'; import ClaimLinesImport from './ClaimLinesImport.vue';
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue'; import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
@ -17,7 +18,7 @@ const quasar = useQuasar();
const route = useRoute(); const route = useRoute();
const { t } = useI18n(); const { t } = useI18n();
const stateStore = useStateStore(); // const stateStore = useStateStore();
const arrayData = useArrayData('ClaimLines'); const arrayData = useArrayData('ClaimLines');
const store = arrayData.store; const store = arrayData.store;
@ -157,23 +158,25 @@ function showImportDialog() {
} }
</script> </script>
<template> <template>
<Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()"> <VnTeleport>
<div class="row q-gutter-md"> <template #st-data>
<div> <div class="row q-gutter-md">
{{ t('Amount') }} <div>
<QChip :dense="$q.screen.lt.sm"> {{ t('Amount') }}
{{ toCurrency(amount) }} <QChip :dense="$q.screen.lt.sm">
</QChip> {{ toCurrency(amount) }}
</QChip>
</div>
<QSeparator dark vertical />
<div>
{{ t('Amount Claimed') }}
<QChip color="positive" :dense="$q.screen.lt.sm">
{{ toCurrency(amountClaimed) }}
</QChip>
</div>
</div> </div>
<QSeparator dark vertical /> </template>
<div> </VnTeleport>
{{ t('Amount Claimed') }}
<QChip color="positive" :dense="$q.screen.lt.sm">
{{ toCurrency(amountClaimed) }}
</QChip>
</div>
</div>
</Teleport>
<FetchData <FetchData
:url="`Claims/${route.params.id}`" :url="`Claims/${route.params.id}`"

34
src/pages/Entry/Card/EntryBuys.vue
View File

@ -11,9 +11,10 @@ import VnInput from 'src/components/common/VnInput.vue';
import FetchedTags from 'components/ui/FetchedTags.vue'; import FetchedTags from 'components/ui/FetchedTags.vue';
import VnConfirm from 'components/ui/VnConfirm.vue'; import VnConfirm from 'components/ui/VnConfirm.vue';
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue'; import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
import VnTeleport from 'components/ui/VnTeleport.vue';
import { useQuasar } from 'quasar'; import { useQuasar } from 'quasar';
import { useStateStore } from 'stores/useStateStore'; // import { useStateStore } from 'stores/useStateStore';
import { toCurrency } from 'src/filters'; import { toCurrency } from 'src/filters';
import axios from 'axios'; import axios from 'axios';
import useNotify from 'src/composables/useNotify.js'; import useNotify from 'src/composables/useNotify.js';
@ -22,7 +23,7 @@ const quasar = useQuasar();
const route = useRoute(); const route = useRoute();
const router = useRouter(); const router = useRouter();
const { t } = useI18n(); const { t } = useI18n();
const stateStore = useStateStore(); // const stateStore = useStateStore();
const { notify } = useNotify(); const { notify } = useNotify();
const rowsSelected = ref([]); const rowsSelected = ref([]);
@ -293,20 +294,21 @@ const showLockIcon = (groupingMode, mode) => {
auto-load auto-load
@on-fetch="(data) => (packagingsOptions = data)" @on-fetch="(data) => (packagingsOptions = data)"
/> />
<Teleport to="#st-actions" v-if="stateStore?.isSubToolbarShown()"> <VnTeleport>
<QBtnGroup push style="column-gap: 10px"> <template #st-actions>
<slot name="moreBeforeActions" /> <QBtnGroup push style="column-gap: 10px">
<QBtn <slot name="moreBeforeActions" />
:label="t('globals.remove')" <QBtn
color="primary" :label="t('globals.remove')"
icon="delete" color="primary"
flat icon="delete"
@click="openRemoveDialog()" flat
:disable="!rowsSelected?.length" @click="openRemoveDialog()"
:title="t('globals.remove')" :disable="!rowsSelected?.length"
/> :title="t('globals.remove')"
</QBtnGroup> /> </QBtnGroup
</Teleport> ></template>
</VnTeleport>
<VnPaginate <VnPaginate
ref="entryBuysPaginateRef" ref="entryBuysPaginateRef"
data-key="EntryBuys" data-key="EntryBuys"

49
src/pages/Entry/Card/EntryBuysImport.vue
View File

@ -9,13 +9,14 @@ import FetchData from 'components/FetchData.vue';
import VnSelectFilter from 'components/common/VnSelectFilter.vue'; import VnSelectFilter from 'components/common/VnSelectFilter.vue';
import VnSelectDialog from 'src/components/common/VnSelectDialog.vue'; import VnSelectDialog from 'src/components/common/VnSelectDialog.vue';
import FilterItemForm from 'src/components/FilterItemForm.vue'; import FilterItemForm from 'src/components/FilterItemForm.vue';
import VnTeleport from 'components/ui/VnTeleport.vue';
import { useStateStore } from 'stores/useStateStore'; // import { useStateStore } from 'stores/useStateStore';
import axios from 'axios'; import axios from 'axios';
import useNotify from 'src/composables/useNotify.js'; import useNotify from 'src/composables/useNotify.js';
import { toCurrency } from 'filters/index'; import { toCurrency } from 'filters/index';
const stateStore = useStateStore(); // const stateStore = useStateStore();
const route = useRoute(); const route = useRoute();
const router = useRouter(); const router = useRouter();
const { t } = useI18n(); const { t } = useI18n();
@ -175,27 +176,29 @@ const redirectToBuysView = () => {
auto-load auto-load
/> />
<QForm> <QForm>
<Teleport to="#st-actions" v-if="stateStore?.isSubToolbarShown()"> <VnTeleport>
<div> <template #st-actions>
<QBtnGroup push class="q-gutter-x-sm"> <div>
<QBtn <QBtnGroup push class="q-gutter-x-sm">
:label="t('globals.cancel')" <QBtn
color="primary" :label="t('globals.cancel')"
icon="restart_alt" color="primary"
flat icon="restart_alt"
@click="redirectToBuysView()" flat
/> @click="redirectToBuysView()"
<QBtn />
:label="t('globals.save')" <QBtn
color="primary" :label="t('globals.save')"
icon="save" color="primary"
type="submit" icon="save"
:disable="!importData.file" type="submit"
@click="onSubmit()" :disable="!importData.file"
/> @click="onSubmit()"
</QBtnGroup> />
</div> </QBtnGroup>
</Teleport> </div>
</template>
</VnTeleport>
<QCard class="q-pa-lg"> <QCard class="q-pa-lg">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <div class="col">

6
src/pages/InvoiceIn/Card/InvoiceInCard.vue
View File

@ -8,9 +8,9 @@ import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import { useArrayData } from 'src/composables/useArrayData'; import { useArrayData } from 'src/composables/useArrayData';
import { onMounted, watch } from 'vue'; import { onMounted, watch } from 'vue';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
const stateStore = useStateStore(); const stateStore = useStateStore();
const { t } = useI18n(); import in18n from '../in18n';
const { t } = useI18n(in18n);
const route = useRoute(); const route = useRoute();
const filter = { const filter = {
@ -60,7 +60,7 @@ watch(
<VnSearchbar <VnSearchbar
data-key="InvoiceInList" data-key="InvoiceInList"
url="InvoiceIns/filter" url="InvoiceIns/filter"
:label="t('Search invoice')" :label="t('searchInvoice')"
:info="t('You can search by invoice reference')" :info="t('You can search by invoice reference')"
/> />
</Teleport> </Teleport>

399
src/pages/InvoiceIn/Card/InvoiceInSummary.vue
View File

@ -6,6 +6,13 @@ import { toCurrency, toDate } from 'src/filters';
import { getUrl } from 'src/composables/getUrl'; import { getUrl } from 'src/composables/getUrl';
import CardSummary from 'components/ui/CardSummary.vue'; import CardSummary from 'components/ui/CardSummary.vue';
import VnLv from 'src/components/ui/VnLv.vue'; import VnLv from 'src/components/ui/VnLv.vue';
import VnTable from 'src/components/ui/VnTable.vue';
import VnCardSection from 'src/components/ui/VnCardSection.vue';
import VnCard from 'src/components/ui/VnCard.vue';
import VnIcon from 'src/components/ui/VnIcon.vue';
import VnBtn from 'src/components/ui/VnBtn.vue';
import in18n from '../in18n';
import VnChip from 'src/components/ui/VnChip.vue';
onMounted(async () => { onMounted(async () => {
salixUrl.value = await getUrl(''); salixUrl.value = await getUrl('');
@ -13,7 +20,7 @@ onMounted(async () => {
}); });
const route = useRoute(); const route = useRoute();
const { t } = useI18n(); const { t } = useI18n(in18n);
const $props = defineProps({ const $props = defineProps({
id: { id: {
@ -207,215 +214,205 @@ function getLink(param) {
</template> </template>
<template #body="{ entity: invoiceIn }"> <template #body="{ entity: invoiceIn }">
<!--Basic Data--> <!--Basic Data-->
<QCard class="vn-one"> <VnCard class="vn-max">
<QCardSection class="q-pa-none"> <template #header>
<a class="header" :href="getLink('basic-data')"> <VnCardSection
{{ t('invoiceIn.pageTitles.basicData') }} :title="'invoiceIn.pageTitles.basicData'"
<QIcon name="open_in_new" color="primary" /> :href="`#/invoice-in/${entityId}/basic-data`"
</a> >
</QCardSection> <template #icon>
<VnLv <VnIcon name="open_in_new" color="primary" />
:label="t('invoiceIn.summary.supplier')" </template>
:value="invoiceIn.supplier?.name" <template #btn>
/> <VnBtn
<VnLv class="q-ml-sm"
:label="t('invoiceIn.summary.supplierRef')" padding="xs"
:value="invoiceIn.supplierRef" flat
/> color="primary"
<VnLv round
:label="t('invoiceIn.summary.currency')" icon="cloud_download"
:value="invoiceIn.currency?.code" :promise="() => downloadFile(invoiceIn.dmsFk)"
/> >
<VnLv <template #tooltip>
:label="t('invoiceIn.summary.docNumber')" {{ t('components.smartCard.downloadFile') }}
:value="`${invoiceIn.serial}/${invoiceIn.serialNumber}`" </template>
/> </VnBtn>
</QCard> </template>
<QCard class="vn-one"> </VnCardSection>
<QCardSection class="q-pa-none"> </template>
<a class="header" :href="getLink('basic-data')"> <template #body>
{{ t('invoiceIn.pageTitles.basicData') }} <div class="card-section">
<QIcon name="open_in_new" color="primary" /> <div class="vn-one card">
</a> <VnLv
</QCardSection> :label="t('invoiceIn.summary.supplier')"
<VnLv :value="invoiceIn.supplier.name"
:ellipsis-value="false" />
:label="t('invoiceIn.summary.issued')" <VnLv
:value="toDate(invoiceIn.issued)" :label="t('invoiceIn.summary.supplierRef')"
/> :value="invoiceIn.supplierRef"
<VnLv />
:label="t('invoiceIn.summary.operated')" <VnLv
:value="toDate(invoiceIn.operated)" :label="t('invoiceIn.summary.currency')"
/> :value="invoiceIn.currency.code"
<VnLv />
:label="t('invoiceIn.summary.bookEntried')" <VnLv
:value="toDate(invoiceIn.bookEntried)" :label="t('invoiceIn.summary.docNumber')"
/> :value="`${invoiceIn.serial}/${invoiceIn.serialNumber}`"
<VnLv />
:label="t('invoiceIn.summary.bookedDate')" </div>
:value="toDate(invoiceIn.booked)" <div class="card vn-two">
/> <VnLv
</QCard> :label="t('invoiceIn.summary.issued')"
<QCard class="vn-one"> :value="toDate(invoiceIn.issued)"
<QCardSection class="q-pa-none"> />
<a class="header" :href="getLink('basic-data')"> <VnLv
{{ t('invoiceIn.pageTitles.basicData') }} :label="t('invoiceIn.summary.operated')"
<QIcon name="open_in_new" color="primary" /> :value="toDate(invoiceIn.operated)"
</a> />
</QCardSection> <VnLv
<VnLv :label="t('invoiceIn.summary.bookEntried')"
:label="t('invoiceIn.summary.sage')" :value="toDate(invoiceIn.bookEntried)"
:value="invoiceIn.sageWithholding?.withholding" />
/> <VnLv
<VnLv :label="t('invoiceIn.summary.bookedDate')"
:label="t('invoiceIn.summary.vat')" :value="toDate(invoiceIn.booked)"
:value="invoiceIn.expenseDeductible?.name" />
/> </div>
<VnLv <div class="card vn-three">
:label="t('invoiceIn.summary.company')" <div class="q-px-sm">
:value="invoiceIn.company?.code" <VnLv
/> :label="t('invoiceIn.summary.taxableBase')"
<VnLv :value="toCurrency(invoiceIn.totals.totalTaxableBase)"
:label="t('invoiceIn.summary.booked')" />
:value="invoiceIn.isBooked" <VnLv
/> label="Total"
</QCard> :value="toCurrency(invoiceIn.totals.totalVat)"
<QCard class="vn-one"> />
<QCardSection class="q-pa-none"> <VnLv :label="t('invoiceIn.summary.dueTotal')">
<a class="header" :href="getLink('basic-data')"> <template #value>
{{ t('invoiceIn.pageTitles.basicData') }} <VnChip
<QIcon name="open_in_new" color="primary" /> dense
</a> class="q-pa-xs"
</QCardSection> :color="
<QCardSection class="q-pa-none"> amountsNotMatch
<div class="bordered q-px-sm q-mx-auto"> ? 'negative'
<VnLv : 'transparent'
:label="t('invoiceIn.summary.taxableBase')" "
:value="toCurrency(invoiceIn.totals.totalTaxableBase)" :title="
/> amountsNotMatch
<VnLv ? t('invoiceIn.summary.noMatch')
label="Total" : t('invoiceIn.summary.dueTotal')
:value="toCurrency(invoiceIn.totals.totalVat)" "
/> >
<VnLv :label="t('invoiceIn.summary.dueTotal')"> <template #body>
<template #value> {{
<QChip toCurrency(
dense invoiceIn.totals.totalDueDay
class="q-pa-xs" )
:color="amountsNotMatch ? 'negative' : 'transparent'" }}
:title=" </template>
amountsNotMatch </VnChip>
? t('invoiceIn.summary.noMatch') </template>
: t('invoiceIn.summary.dueTotal') </VnLv>
" </div>
> </div>
{{ toCurrency(invoiceIn.totals.totalDueDay) }} <div class="card vn-four q-mb-md">
</QChip> <VnLv
</template> :label="t('invoiceIn.summary.sage')"
</VnLv> :value="invoiceIn.sageWithholding.withholding"
/>
<VnLv
:label="t('invoiceIn.summary.vat')"
:value="invoiceIn.expenseDeductible?.name"
/>
<VnLv
:label="t('invoiceIn.summary.company')"
:value="invoiceIn.company.code"
/>
<VnLv
:label="t('invoiceIn.summary.booked')"
:value="invoiceIn.isBooked"
/>
</div>
</div> </div>
</QCardSection> </template>
</QCard> </VnCard>
<!--Vat--> <!--Vat-->
<QCard v-if="invoiceIn.invoiceInTax.length"> <VnCard v-if="invoiceIn.invoiceInTax.length" class="vn-three">
<a class="header" :href="getLink('vat')"> <template #header>
{{ t('invoiceIn.card.vat') }} <VnCardSection :title="'invoiceIn.card.vat'"> </VnCardSection>
<QIcon name="open_in_new" color="primary" /> </template>
</a> <template #body>
<QTable <VnTable
:columns="vatColumns" :columns="vatColumns"
:rows="invoiceIn.invoiceInTax" :rows="invoiceIn.invoiceInTax"
flat :has-summary="true"
hide-pagination :summary="{
> landed: toCurrency(invoiceIn.totals.totalTaxableBase),
<template #header="props"> }"
<QTr :props="props" class="bg"> >
<QTh v-for="col in props.cols" :key="col.name" :props="props"> </VnTable>
{{ t(col.label) }} </template>
</QTh> </VnCard>
</QTr>
</template>
<template #bottom-row>
<QTr class="bg">
<QTd></QTd>
<QTd>{{ toCurrency(invoiceIn.totals.totalTaxableBase) }}</QTd>
<QTd></QTd>
<QTd></QTd>
<QTd>{{
toCurrency(getTaxTotal(invoiceIn.invoiceInTax))
}}</QTd>
<QTd></QTd>
</QTr>
</template>
</QTable>
</QCard>
<!--Due Day--> <!--Due Day-->
<QCard v-if="invoiceIn.invoiceInDueDay.length"> <VnCard v-if="invoiceIn.invoiceInDueDay.length" class="vn-two">
<a class="header" :href="getLink('due-day')"> <template #header>
{{ t('invoiceIn.card.dueDay') }} <VnCardSection :title="'invoiceIn.card.dueDay'"> </VnCardSection>
<QIcon name="open_in_new" color="primary" /> </template>
</a> <template #body
<QTable ><VnTable
class="full-width" :columns="dueDayColumns"
:columns="dueDayColumns" :rows="invoiceIn.invoiceInDueDay"
:rows="invoiceIn.invoiceInDueDay" :has-summary="true"
flat :summary="{ amount: toCurrency(invoiceIn.totals.totalDueDay) }"
hide-pagination >
> </VnTable>
<template #header="props"> </template>
<QTr :props="props" class="bg"> </VnCard>
<QTh v-for="col in props.cols" :key="col.name" :props="props">
{{ t(col.label) }}
</QTh>
</QTr>
</template>
<template #bottom-row>
<QTr class="bg">
<QTd></QTd>
<QTd></QTd>
<QTd>{{ toCurrency(invoiceIn.totals.totalDueDay) }}</QTd>
<QTd></QTd>
</QTr>
</template>
</QTable>
</QCard>
<!--Intrastat--> <!--Intrastat-->
<QCard v-if="invoiceIn.invoiceInIntrastat.length"> <VnCard v-if="invoiceIn.invoiceInIntrastat.length">
<a class="header" :href="getUrl('intrastat')"> <template #header>
{{ t('invoiceIn.card.intrastat') }} <VnCardSection :title="'invoiceIn.card.intrastat'"> </VnCardSection>
<QIcon name="open_in_new" color="primary" /> </template>
</a> <template #body
<QTable ><VnTable
:columns="intrastatColumns" :columns="intrastatColumns"
:rows="invoiceIn.invoiceInIntrastat" :rows="invoiceIn.invoiceInIntrastat"
flat :has-summary="true"
hide-pagination :summary="{
> amount: toCurrency(intrastatTotals.amount),
<template #header="props"> net: intrastatTotals.net,
<QTr :props="props" class="bg"> stems: intrastatTotals.stems,
<QTh v-for="col in props.cols" :key="col.name" :props="props"> }"
{{ t(col.label) }} >
</QTh> </VnTable>
</QTr> </template>
</template> </VnCard>
<template #bottom-row>
<QTr class="bg">
<QTd></QTd>
<QTd>{{ toCurrency(intrastatTotals.amount) }}</QTd>
<QTd>{{ intrastatTotals.net }}</QTd>
<QTd>{{ intrastatTotals.stems }}</QTd>
<QTd></QTd>
</QTr>
</template>
</QTable>
</QCard>
</template> </template>
</CardSummary> </CardSummary>
</template> </template>
<style lang="scss" scoped> <style lang="scss" scoped>
.bg { .q-card {
background-color: var(--vn-light-gray); .vn-max {
background-color: unset;
}
.card-section {
display: flex;
flex-wrap: wrap;
row-gap: 10px;
column-gap: 10px;
.card {
flex: 1 1 30%;
width: 100%;
background-color: var(--vn-gray);
padding: 15px;
font-size: 16px;
min-width: 275px;
border-radius: 4px;
}
}
} }
.bordered { .bordered {
border: 1px solid var(--vn-text); border: 1px solid var(--vn-text);
max-width: 18em; max-width: 18em;

12
src/pages/InvoiceIn/InvoiceInList.vue
View File

@ -11,6 +11,7 @@ import VnLv from 'src/components/ui/VnLv.vue';
import CardList from 'src/components/ui/CardList.vue'; import CardList from 'src/components/ui/CardList.vue';
import InvoiceInFilter from './InvoiceInFilter.vue'; import InvoiceInFilter from './InvoiceInFilter.vue';
import { getUrl } from 'src/composables/getUrl'; import { getUrl } from 'src/composables/getUrl';
import in18n from './in18n';
import InvoiceInSummary from './Card/InvoiceInSummary.vue'; import InvoiceInSummary from './Card/InvoiceInSummary.vue';
import { useSummaryDialog } from 'src/composables/useSummaryDialog'; import { useSummaryDialog } from 'src/composables/useSummaryDialog';
@ -18,7 +19,7 @@ const stateStore = useStateStore();
const router = useRouter(); const router = useRouter();
const { viewSummary } = useSummaryDialog(); const { viewSummary } = useSummaryDialog();
let url = ref(); let url = ref();
const { t } = useI18n(); const { t } = useI18n(in18n);
onMounted(async () => { onMounted(async () => {
stateStore.rightDrawer = true; stateStore.rightDrawer = true;
@ -36,7 +37,7 @@ function navigate(id) {
<Teleport to="#searchbar"> <Teleport to="#searchbar">
<VnSearchbar <VnSearchbar
data-key="InvoiceInList" data-key="InvoiceInList"
:label="t('Search invoice')" :label="t('searchInvoice')"
:info="t('You can search by invoice reference')" :info="t('You can search by invoice reference')"
/> />
</Teleport> </Teleport>
@ -148,6 +149,13 @@ function navigate(id) {
</QPageSticky> </QPageSticky>
</template> </template>
<style lang="scss" scoped>
.card-list {
width: 100%;
max-width: 60em;
}
</style>
<i18n> <i18n>
es: es:
Search invoice: Buscar factura recibida Search invoice: Buscar factura recibida

8
src/pages/InvoiceIn/i18n.json Normal file
View File

@ -0,0 +1,8 @@
{
"es": {
"searchInvoice": "Buscar factura emitida"
},
"en": {
"searchInvoice": "Seaasdrch invoice"
}
}

3
src/pages/InvoiceIn/i18n/en.json Normal file
View File

@ -0,0 +1,3 @@
{
"searchInvoice": "Seaasdrch invoice"
}

3
src/pages/InvoiceIn/i18n/es.json Normal file
View File

@ -0,0 +1,3 @@
{
"searchInvoice": "Buasdscar factura emitida"
}

19
src/pages/InvoiceIn/in18n.js Normal file
View File

@ -0,0 +1,19 @@
// OPTION 1
import en from './i18n/en.json';
import es from './i18n/es.json';
// OPTION 2
import _messages from './i18n.json';
// OPTION 3
const messages = {
en: {
searchInvoice: 'Search invoice',
},
es: {
searchInvoice: 'Buscar factura emitida',
},
};
export default {
messages: _messages,
};

14
src/pages/InvoiceOut/InvoiceOutNegativeBases.vue
View File

@ -6,6 +6,7 @@ import { QCheckbox, QBtn } from 'quasar';
import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue'; import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
import InvoiceOutNegativeFilter from './InvoiceOutNegativeBasesFilter.vue'; import InvoiceOutNegativeFilter from './InvoiceOutNegativeBasesFilter.vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue'; import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import VnTeleport from 'components/ui/VnTeleport.vue';
import { toCurrency } from 'src/filters'; import { toCurrency } from 'src/filters';
import { useInvoiceOutGlobalStore } from 'src/stores/invoiceOutGlobal.js'; import { useInvoiceOutGlobalStore } from 'src/stores/invoiceOutGlobal.js';
@ -217,9 +218,16 @@ const selectWorkerId = (id) => {
<template> <template>
<template v-if="stateStore.isHeaderMounted()"> <template v-if="stateStore.isHeaderMounted()">
<Teleport to="#st-actions" v-if="stateStore?.isSubToolbarShown()"> <VnTeleport>
<QBtn color="primary" icon-right="archive" no-caps @click="downloadCSV()" /> <template #st-actions>
</Teleport> <QBtn
color="primary"
icon-right="archive"
no-caps
@click="downloadCSV()"
/>
</template>
</VnTeleport>
</template> </template>
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above> <QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
<QScrollArea class="fit text-grey-8"> <QScrollArea class="fit text-grey-8">

57
src/pages/Supplier/Card/SupplierConsumption.vue
View File

@ -8,16 +8,17 @@ import FetchedTags from 'components/ui/FetchedTags.vue';
import SendEmailDialog from 'components/common/SendEmailDialog.vue'; import SendEmailDialog from 'components/common/SendEmailDialog.vue';
import SupplierConsumptionFilter from './SupplierConsumptionFilter.vue'; import SupplierConsumptionFilter from './SupplierConsumptionFilter.vue';
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue'; import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
import VnTeleport from 'components/ui/VnTeleport.vue';
import { toDate } from 'src/filters'; import { toDate } from 'src/filters';
import { dashIfEmpty } from 'src/filters'; import { dashIfEmpty } from 'src/filters';
import { usePrintService } from 'composables/usePrintService'; import { usePrintService } from 'composables/usePrintService';
import useNotify from 'src/composables/useNotify.js'; import useNotify from 'src/composables/useNotify.js';
import axios from 'axios'; import axios from 'axios';
import { useStateStore } from 'stores/useStateStore'; // import { useStateStore } from 'stores/useStateStore';
import { useArrayData } from 'composables/useArrayData'; import { useArrayData } from 'composables/useArrayData';
const stateStore = useStateStore(); // const stateStore = useStateStore();
const { t } = useI18n(); const { t } = useI18n();
const route = useRoute(); const route = useRoute();
const { openReport, sendEmail } = usePrintService(); const { openReport, sendEmail } = usePrintService();
@ -115,31 +116,33 @@ onMounted(async () => {
</script> </script>
<template> <template>
<Teleport to="#st-actions" v-if="stateStore.isSubToolbarShown()"> <VnTeleport>
<QBtn <template #st-actions>
:disabled="!dateRanges.from && !dateRanges.to" <QBtn
color="primary" :disabled="!dateRanges.from && !dateRanges.to"
icon-right="picture_as_pdf" color="primary"
no-caps icon-right="picture_as_pdf"
class="q-mr-md" no-caps
@click="openReportPdf()" class="q-mr-md"
> @click="openReportPdf()"
<QTooltip> >
{{ t('Open as PDF') }} <QTooltip>
</QTooltip> {{ t('Open as PDF') }}
</QBtn> </QTooltip>
<QBtn </QBtn>
:disabled="!dateRanges.from && !dateRanges.to" <QBtn
color="primary" :disabled="!dateRanges.from && !dateRanges.to"
icon-right="email" color="primary"
no-caps icon-right="email"
@click="openSendEmailDialog()" no-caps
> @click="openSendEmailDialog()"
<QTooltip> >
{{ t('Send to email') }} <QTooltip>
</QTooltip> {{ t('Send to email') }}
</QBtn> </QTooltip>
</Teleport> </QBtn>
</template>
</VnTeleport>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above> <QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>

48
src/pages/Travel/Card/TravelThermographsForm.vue
View File

@ -2,7 +2,7 @@
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { reactive, ref, onBeforeMount } from 'vue'; import { reactive, ref, onBeforeMount } from 'vue';
import { useRoute, useRouter } from 'vue-router'; import { useRoute, useRouter } from 'vue-router';
import VnTeleport from 'components/ui/VnTeleport.vue';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue'; import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
import VnSelectDialog from 'components/common/VnSelectDialog.vue'; import VnSelectDialog from 'components/common/VnSelectDialog.vue';
@ -11,7 +11,7 @@ import VnInput from 'src/components/common/VnInput.vue';
import CreateThermographForm from 'src/components/CreateThermographForm.vue'; import CreateThermographForm from 'src/components/CreateThermographForm.vue';
import { useState } from 'src/composables/useState'; import { useState } from 'src/composables/useState';
import { useStateStore } from 'stores/useStateStore'; // import { useStateStore } from 'stores/useStateStore';
import axios from 'axios'; import axios from 'axios';
import useNotify from 'src/composables/useNotify.js'; import useNotify from 'src/composables/useNotify.js';
@ -22,7 +22,7 @@ const props = defineProps({
}, },
}); });
const stateStore = useStateStore(); // const stateStore = useStateStore();
const { t } = useI18n(); const { t } = useI18n();
const route = useRoute(); const route = useRoute();
const router = useRouter(); const router = useRouter();
@ -214,26 +214,28 @@ const onThermographCreated = async (data) => {
class="full-width" class="full-width"
style="max-width: 800px" style="max-width: 800px"
> >
<Teleport to="#st-actions" v-if="stateStore?.isSubToolbarShown()"> <VnTeleport>
<div> <template #st-actions>
<QBtnGroup push class="q-gutter-x-sm"> <div>
<slot name="moreActions" /> <QBtnGroup push class="q-gutter-x-sm">
<QBtn <slot name="moreActions" />
color="primary" <QBtn
icon="restart_alt" color="primary"
flat icon="restart_alt"
@click="reset()" flat
:label="t('globals.reset')" @click="reset()"
/> :label="t('globals.reset')"
<QBtn />
color="primary" <QBtn
icon="save" color="primary"
@click="onSubmit()" icon="save"
:label="t('globals.save')" @click="onSubmit()"
/> :label="t('globals.save')"
</QBtnGroup> />
</div> </QBtnGroup>
</Teleport> </div>
</template>
</VnTeleport>
<QCard class="q-pa-lg"> <QCard class="q-pa-lg">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <div class="col">

75
test/vitest/__tests__/components/common/VnBtn.js Normal file
View File

@ -0,0 +1,75 @@
import { vi, describe, expect, it, beforeAll, afterEach } from 'vitest';
import { createWrapper } from 'app/test/vitest/helper';
import VnBtn from 'src/components/common/VnBtn.vue';
describe('VnBtn', () => {
let vm;
beforeAll(() => {
vm = createWrapper(VnBtn, {
global: {
stubs: ['FetchData', 'VnPaginate'],
mocks: {
fetch: vi.fn(),
},
},
propsData: {
model: 'Claim',
},
}).vm;
});
afterEach(() => {
vi.clearAllMocks();
});
describe('formatValue()', () => {
it('should return Yes if has a true boolean', async () => {
const result = vm.formatValue(true);
expect(result).toEqual('Yes');
});
it('should return No if has a true boolean', async () => {
const result = vm.formatValue(false);
expect(result).toEqual('No');
});
it('should return Nothing if has no params', async () => {
const result = vm.formatValue();
expect(result).toEqual('Nothing');
});
it('should return a string from a string value', async () => {
const result = vm.formatValue('Something');
expect(result).toEqual(`"Something"`);
});
it('should call to format a date', async () => {
vi.mock('src/filters', () => ({
toDate: () => {
return 'Date formatted';
},
}));
const result = vm.formatValue('01-01-1970');
expect(result).toEqual('Date formatted');
});
});
describe('actionColor()', () => {
it('should return positive if insert', async () => {
const result = vm.actionColor('insert');
expect(result).toEqual('positive');
});
it('should return positive if update', async () => {
const result = vm.actionColor('update');
expect(result).toEqual('positive');
});
it('should return negative if delete', async () => {
const result = vm.actionColor('delete');
expect(result).toEqual('negative');
});
});
});

75
test/vitest/__tests__/components/common/VnCard.js Normal file
View File

@ -0,0 +1,75 @@
import { vi, describe, expect, it, beforeAll, afterEach } from 'vitest';
import { createWrapper } from 'app/test/vitest/helper';
import VnCard from 'src/components/common/VnCard.vue';
describe('VnCard', () => {
let vm;
beforeAll(() => {
vm = createWrapper(VnCard, {
global: {
stubs: ['FetchData', 'VnPaginate'],
mocks: {
fetch: vi.fn(),
},
},
propsData: {
model: 'Claim',
},
}).vm;
});
afterEach(() => {
vi.clearAllMocks();
});
describe('formatValue()', () => {
it('should return Yes if has a true boolean', async () => {
const result = vm.formatValue(true);
expect(result).toEqual('Yes');
});
it('should return No if has a true boolean', async () => {
const result = vm.formatValue(false);
expect(result).toEqual('No');
});
it('should return Nothing if has no params', async () => {
const result = vm.formatValue();
expect(result).toEqual('Nothing');
});
it('should return a string from a string value', async () => {
const result = vm.formatValue('Something');
expect(result).toEqual(`"Something"`);
});
it('should call to format a date', async () => {
vi.mock('src/filters', () => ({
toDate: () => {
return 'Date formatted';
},
}));
const result = vm.formatValue('01-01-1970');
expect(result).toEqual('Date formatted');
});
});
describe('actionColor()', () => {
it('should return positive if insert', async () => {
const result = vm.actionColor('insert');
expect(result).toEqual('positive');
});
it('should return positive if update', async () => {
const result = vm.actionColor('update');
expect(result).toEqual('positive');
});
it('should return negative if delete', async () => {
const result = vm.actionColor('delete');
expect(result).toEqual('negative');
});
});
});

75
test/vitest/__tests__/components/common/VnCardSection.js Normal file
View File

@ -0,0 +1,75 @@
import { vi, describe, expect, it, beforeAll, afterEach } from 'vitest';
import { createWrapper } from 'app/test/vitest/helper';
import VnCardSection from 'src/components/common/VnCardSection.vue';
describe('VnCardSection', () => {
let vm;
beforeAll(() => {
vm = createWrapper(VnCardSection, {
global: {
stubs: ['FetchData', 'VnPaginate'],
mocks: {
fetch: vi.fn(),
},
},
propsData: {
model: 'Claim',
},
}).vm;
});
afterEach(() => {
vi.clearAllMocks();
});
describe('formatValue()', () => {
it('should return Yes if has a true boolean', async () => {
const result = vm.formatValue(true);
expect(result).toEqual('Yes');
});
it('should return No if has a true boolean', async () => {
const result = vm.formatValue(false);
expect(result).toEqual('No');
});
it('should return Nothing if has no params', async () => {
const result = vm.formatValue();
expect(result).toEqual('Nothing');
});
it('should return a string from a string value', async () => {
const result = vm.formatValue('Something');
expect(result).toEqual(`"Something"`);
});
it('should call to format a date', async () => {
vi.mock('src/filters', () => ({
toDate: () => {
return 'Date formatted';
},
}));
const result = vm.formatValue('01-01-1970');
expect(result).toEqual('Date formatted');
});
});
describe('actionColor()', () => {
it('should return positive if insert', async () => {
const result = vm.actionColor('insert');
expect(result).toEqual('positive');
});
it('should return positive if update', async () => {
const result = vm.actionColor('update');
expect(result).toEqual('positive');
});
it('should return negative if delete', async () => {
const result = vm.actionColor('delete');
expect(result).toEqual('negative');
});
});
});

75
test/vitest/__tests__/components/common/VnChip.js Normal file
View File

@ -0,0 +1,75 @@
import { vi, describe, expect, it, beforeAll, afterEach } from 'vitest';
import { createWrapper } from 'app/test/vitest/helper';
import VnChip from 'src/components/common/VnChip.vue';
describe('VnChip', () => {
let vm;
beforeAll(() => {
vm = createWrapper(VnChip, {
global: {
stubs: ['FetchData', 'VnPaginate'],
mocks: {
fetch: vi.fn(),
},
},
propsData: {
model: 'Claim',
},
}).vm;
});
afterEach(() => {
vi.clearAllMocks();
});
describe('formatValue()', () => {
it('should return Yes if has a true boolean', async () => {
const result = vm.formatValue(true);
expect(result).toEqual('Yes');
});
it('should return No if has a true boolean', async () => {
const result = vm.formatValue(false);
expect(result).toEqual('No');
});
it('should return Nothing if has no params', async () => {
const result = vm.formatValue();
expect(result).toEqual('Nothing');
});
it('should return a string from a string value', async () => {
const result = vm.formatValue('Something');
expect(result).toEqual(`"Something"`);
});
it('should call to format a date', async () => {
vi.mock('src/filters', () => ({
toDate: () => {
return 'Date formatted';
},
}));
const result = vm.formatValue('01-01-1970');
expect(result).toEqual('Date formatted');
});
});
describe('actionColor()', () => {
it('should return positive if insert', async () => {
const result = vm.actionColor('insert');
expect(result).toEqual('positive');
});
it('should return positive if update', async () => {
const result = vm.actionColor('update');
expect(result).toEqual('positive');
});
it('should return negative if delete', async () => {
const result = vm.actionColor('delete');
expect(result).toEqual('negative');
});
});
});

75
test/vitest/__tests__/components/common/VnTable.js Normal file
View File

@ -0,0 +1,75 @@
import { vi, describe, expect, it, beforeAll, afterEach } from 'vitest';
import { createWrapper } from 'app/test/vitest/helper';
import VnTable from 'src/components/common/VnTable.vue';
describe('VnTable', () => {
let vm;
beforeAll(() => {
vm = createWrapper(VnTable, {
global: {
stubs: ['FetchData', 'VnPaginate'],
mocks: {
fetch: vi.fn(),
},
},
propsData: {
model: 'Claim',
},
}).vm;
});
afterEach(() => {
vi.clearAllMocks();
});
describe('formatValue()', () => {
it('should return Yes if has a true boolean', async () => {
const result = vm.formatValue(true);
expect(result).toEqual('Yes');
});
it('should return No if has a true boolean', async () => {
const result = vm.formatValue(false);
expect(result).toEqual('No');
});
it('should return Nothing if has no params', async () => {
const result = vm.formatValue();
expect(result).toEqual('Nothing');
});
it('should return a string from a string value', async () => {
const result = vm.formatValue('Something');
expect(result).toEqual(`"Something"`);
});
it('should call to format a date', async () => {
vi.mock('src/filters', () => ({
toDate: () => {
return 'Date formatted';
},
}));
const result = vm.formatValue('01-01-1970');
expect(result).toEqual('Date formatted');
});
});
describe('actionColor()', () => {
it('should return positive if insert', async () => {
const result = vm.actionColor('insert');
expect(result).toEqual('positive');
});
it('should return positive if update', async () => {
const result = vm.actionColor('update');
expect(result).toEqual('positive');
});
it('should return negative if delete', async () => {
const result = vm.actionColor('delete');
expect(result).toEqual('negative');
});
});
});