255 lines
9.3 KiB
Vue
255 lines
9.3 KiB
Vue
<script setup>
|
|
import { ref } from 'vue';
|
|
import { useRoute } from 'vue-router';
|
|
import { useI18n } from 'vue-i18n';
|
|
|
|
import FetchData from 'components/FetchData.vue';
|
|
import FormModel from 'components/FormModel.vue';
|
|
import VnRow from 'components/ui/VnRow.vue';
|
|
import VnInput from 'src/components/common/VnInput.vue';
|
|
import VnSelect from 'src/components/common/VnSelect.vue';
|
|
import VnSelectDialog from 'src/components/common/VnSelectDialog.vue';
|
|
import FilterItemForm from 'src/components/FilterItemForm.vue';
|
|
import CreateIntrastatForm from './CreateIntrastatForm.vue';
|
|
|
|
const route = useRoute();
|
|
const { t } = useI18n();
|
|
|
|
const itemTypesOptions = ref([]);
|
|
const intrastatsOptions = ref([]);
|
|
const expensesOptions = ref([]);
|
|
|
|
const onIntrastatCreated = (response, formData) => {
|
|
intrastatsOptions.value = [...intrastatsOptions.value, response];
|
|
formData.intrastatFk = response.id;
|
|
};
|
|
</script>
|
|
<template>
|
|
<FetchData
|
|
url="ItemTypes"
|
|
:filter="{
|
|
fields: ['id', 'name', 'categoryFk'],
|
|
include: 'category',
|
|
order: 'name ASC',
|
|
}"
|
|
@on-fetch="(data) => (itemTypesOptions = data)"
|
|
auto-load
|
|
/>
|
|
<FetchData
|
|
url="Intrastats"
|
|
:filter="{
|
|
fields: ['id', 'description'],
|
|
order: 'description ASC',
|
|
}"
|
|
@on-fetch="(data) => (intrastatsOptions = data)"
|
|
auto-load
|
|
/>
|
|
<FetchData
|
|
url="Expenses"
|
|
:filter="{
|
|
fields: ['id', 'name'],
|
|
order: 'name ASC',
|
|
}"
|
|
@on-fetch="(data) => (expensesOptions = data)"
|
|
auto-load
|
|
/>
|
|
<FormModel
|
|
:url="`Items/${route.params.id}`"
|
|
:url-update="`Items/${route.params.id}`"
|
|
model="item"
|
|
auto-load
|
|
:clear-store-on-unmount="false"
|
|
>
|
|
<template #form="{ data }">
|
|
<VnRow>
|
|
<VnSelect
|
|
:label="t('item.basicData.type')"
|
|
v-model="data.typeFk"
|
|
:options="itemTypesOptions"
|
|
option-value="id"
|
|
option-label="name"
|
|
hide-selected
|
|
map-options
|
|
required
|
|
>
|
|
<template #option="scope">
|
|
<QItem v-bind="scope.itemProps">
|
|
<QItemSection>
|
|
<QItemLabel>{{ scope.opt?.name }}</QItemLabel>
|
|
<QItemLabel caption>
|
|
{{ scope.opt?.category?.name }}
|
|
</QItemLabel>
|
|
</QItemSection>
|
|
</QItem>
|
|
</template>
|
|
</VnSelect>
|
|
<VnInput :label="t('item.basicData.reference')" v-model="data.comment" />
|
|
<VnInput
|
|
:label="t('item.basicData.relevancy')"
|
|
type="number"
|
|
v-model="data.relevancy"
|
|
/>
|
|
</VnRow>
|
|
<VnRow class="row q-gutter-md q-mb-md">
|
|
<VnInput
|
|
:label="t('item.basicData.stems')"
|
|
type="number"
|
|
v-model="data.stems"
|
|
/>
|
|
<VnInput
|
|
:label="t('item.basicData.multiplier')"
|
|
type="number"
|
|
v-model="data.stemMultiplier"
|
|
/>
|
|
<VnSelectDialog
|
|
:label="t('item.basicData.generic')"
|
|
v-model="data.genericFk"
|
|
url="Items/withName"
|
|
:fields="['id', 'name']"
|
|
sort-by="id DESC"
|
|
option-value="id"
|
|
option-label="name"
|
|
map-options
|
|
hide-selected
|
|
action-icon="filter_alt"
|
|
>
|
|
<template #form>
|
|
<FilterItemForm
|
|
url="Items/withName"
|
|
@item-selected="data.genericFk = $event"
|
|
/>
|
|
</template>
|
|
<template #option="scope">
|
|
<QItem v-bind="scope.itemProps">
|
|
<QItemSection>
|
|
<QItemLabel>{{ scope.opt?.name }}</QItemLabel>
|
|
<QItemLabel caption> #{{ scope.opt?.id }} </QItemLabel>
|
|
</QItemSection>
|
|
</QItem>
|
|
</template>
|
|
</VnSelectDialog>
|
|
</VnRow>
|
|
<VnRow>
|
|
<VnSelectDialog
|
|
:label="t('item.basicData.intrastat')"
|
|
v-model="data.intrastatFk"
|
|
:options="intrastatsOptions"
|
|
option-value="id"
|
|
option-label="description"
|
|
map-options
|
|
hide-selected
|
|
>
|
|
<template #form>
|
|
<CreateIntrastatForm
|
|
@on-data-saved="
|
|
(_, requestResponse) =>
|
|
onIntrastatCreated(requestResponse, data)
|
|
"
|
|
/>
|
|
</template>
|
|
<template #option="scope">
|
|
<QItem v-bind="scope.itemProps">
|
|
<QItemSection>
|
|
<QItemLabel>{{ scope.opt?.description }}</QItemLabel>
|
|
<QItemLabel caption> #{{ scope.opt?.id }} </QItemLabel>
|
|
</QItemSection>
|
|
</QItem>
|
|
</template>
|
|
</VnSelectDialog>
|
|
<div class="col">
|
|
<VnSelect
|
|
:label="t('item.basicData.expense')"
|
|
v-model="data.expenseFk"
|
|
:options="expensesOptions"
|
|
option-value="id"
|
|
option-label="name"
|
|
hide-selected
|
|
map-options
|
|
/>
|
|
</div>
|
|
</VnRow>
|
|
<VnRow>
|
|
<VnInput
|
|
:label="t('item.basicData.weightByPiece')"
|
|
v-model.number="data.weightByPiece"
|
|
:min="0"
|
|
type="number"
|
|
/>
|
|
<VnInput
|
|
:label="t('item.basicData.boxUnits')"
|
|
v-model.number="data.packingOut"
|
|
:min="0"
|
|
type="number"
|
|
/>
|
|
<VnInput
|
|
:label="t('item.basicData.recycledPlastic')"
|
|
v-model.number="data.recycledPlastic"
|
|
:min="0"
|
|
type="number"
|
|
/>
|
|
<VnInput
|
|
:label="t('item.basicData.nonRecycledPlastic')"
|
|
v-model.number="data.nonRecycledPlastic"
|
|
:min="0"
|
|
type="number"
|
|
/>
|
|
</VnRow>
|
|
<VnRow class="row q-gutter-md q-mb-md">
|
|
<QCheckbox
|
|
v-model="data.isActive"
|
|
:label="t('item.basicData.isActive')"
|
|
/>
|
|
<QCheckbox
|
|
v-model="data.hasKgPrice"
|
|
:label="t('item.basicData.hasKgPrice')"
|
|
/>
|
|
<QCheckbox
|
|
v-model="data.isCustomInspectionRequired"
|
|
:label="t('item.basicData.isCustomInspectionRequired')"
|
|
/>
|
|
</VnRow>
|
|
<VnRow class="row q-gutter-md q-mb-md">
|
|
<div>
|
|
<QCheckbox
|
|
v-model="data.isFragile"
|
|
:label="t('item.basicData.isFragile')"
|
|
class="q-mr-sm"
|
|
/>
|
|
<QIcon name="info" class="cursor-pointer" size="xs">
|
|
<QTooltip max-width="300px">
|
|
{{ t('item.basicData.isFragileTooltip') }}
|
|
</QTooltip>
|
|
</QIcon>
|
|
</div>
|
|
<div>
|
|
<QCheckbox
|
|
v-model="data.isPhotoRequested"
|
|
:label="t('item.basicData.isPhotoRequested')"
|
|
class="q-mr-sm"
|
|
/>
|
|
<QIcon name="info" class="cursor-pointer" size="xs">
|
|
<QTooltip>
|
|
{{ t('item.basicData.isPhotoRequestedTooltip') }}
|
|
</QTooltip>
|
|
</QIcon>
|
|
</div>
|
|
</VnRow>
|
|
<VnRow>
|
|
<VnInput
|
|
:label="t('item.basicData.description')"
|
|
type="textarea"
|
|
v-model="data.description"
|
|
fill-input
|
|
/>
|
|
<VnInput
|
|
v-show="data.isPhotoRequested"
|
|
type="textarea"
|
|
:label="t('globals.comment')"
|
|
v-model="data.photoMotivation"
|
|
fill-input
|
|
/>
|
|
</VnRow>
|
|
</template>
|
|
</FormModel>
|
|
</template>
|