112 lines
4.5 KiB
Vue
112 lines
4.5 KiB
Vue
<script setup>
|
|
import { reactive, ref } from 'vue';
|
|
import { useI18n } from 'vue-i18n';
|
|
import { useRoute, useRouter } from 'vue-router';
|
|
|
|
import FormModel from 'components/FormModel.vue';
|
|
import VnRow from 'components/ui/VnRow.vue';
|
|
import VnSelect from 'src/components/common/VnSelect.vue';
|
|
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
|
|
|
import { useStateStore } from 'stores/useStateStore';
|
|
import { toDate } from 'src/filters';
|
|
|
|
const { t } = useI18n();
|
|
|
|
const newAccountForm = reactive({
|
|
supplierFk: null,
|
|
travelFk: null,
|
|
companyFk: null,
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<QPage>
|
|
<VnSubToolbar />
|
|
<pre>TODO <b>Cuentas</b></pre>
|
|
|
|
<FormModel
|
|
url-create="Entries"
|
|
model="account"
|
|
:form-initial-data="newAccountForm"
|
|
>
|
|
<template #form="{ data, validate }">
|
|
<VnRow class="row q-gutter-md q-mb-md">
|
|
<div class="col">
|
|
<VnSelect
|
|
:label="t('Supplier')"
|
|
class="full-width"
|
|
v-model="data.supplierFk"
|
|
:options="suppliersOptions"
|
|
option-value="id"
|
|
option-label="nickname"
|
|
hide-selected
|
|
:required="true"
|
|
:rules="validate('account.supplierFk')"
|
|
>
|
|
<template #option="scope">
|
|
<QItem v-bind="scope.itemProps">
|
|
<QItemSection>
|
|
<QItemLabel>{{ scope.opt?.nickname }}</QItemLabel>
|
|
<QItemLabel caption>
|
|
#{{ scope.opt?.id }}
|
|
</QItemLabel>
|
|
</QItemSection>
|
|
</QItem>
|
|
</template>
|
|
</VnSelect>
|
|
</div>
|
|
</VnRow>
|
|
<VnRow class="row q-gutter-md q-mb-md">
|
|
<div class="col">
|
|
<VnSelect
|
|
:label="t('Travel')"
|
|
class="full-width"
|
|
v-model="data.travelFk"
|
|
:options="travelsOptions"
|
|
option-value="id"
|
|
option-label="warehouseInName"
|
|
map-options
|
|
hide-selected
|
|
:required="true"
|
|
:rules="validate('account.travelFk')"
|
|
>
|
|
<template #option="scope">
|
|
<QItem v-bind="scope.itemProps">
|
|
<QItemSection>
|
|
<QItemLabel
|
|
>{{ scope.opt?.agencyModeName }} -
|
|
{{ scope.opt?.warehouseInName }} ({{
|
|
toDate(scope.opt?.shipped)
|
|
}}) →
|
|
{{ scope.opt?.warehouseOutName }} ({{
|
|
toDate(scope.opt?.landed)
|
|
}})</QItemLabel
|
|
>
|
|
</QItemSection>
|
|
</QItem>
|
|
</template>
|
|
</VnSelect>
|
|
</div>
|
|
</VnRow>
|
|
<VnRow class="row q-gutter-md q-mb-md">
|
|
<div class="col">
|
|
<VnSelect
|
|
:label="t('Company')"
|
|
class="full-width"
|
|
v-model="data.companyFk"
|
|
:options="companiesOptions"
|
|
option-value="id"
|
|
option-label="code"
|
|
map-options
|
|
hide-selected
|
|
:required="true"
|
|
:rules="validate('account.companyFk')"
|
|
/>
|
|
</div>
|
|
</VnRow>
|
|
</template>
|
|
</FormModel>
|
|
</QPage>
|
|
</template>
|