WIP
This commit is contained in:
parent
73f5c1c636
commit
7e1fced429
|
|
@ -0,0 +1,82 @@
|
|||
<script setup>
|
||||
import { reactive, ref } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import VnRow from 'components/ui/VnRow.vue';
|
||||
import FormModelPopup from './FormModelPopup.vue';
|
||||
|
||||
const emit = defineEmits(['onDataSaved']);
|
||||
|
||||
const props = defineProps({});
|
||||
|
||||
const { t } = useI18n();
|
||||
|
||||
const editFormData = reactive({
|
||||
uploadMethod: 'computer',
|
||||
file: null,
|
||||
quantity: null,
|
||||
});
|
||||
|
||||
const options = [
|
||||
{ label: t('Select from computer'), value: 'computer' },
|
||||
{ label: t('Import from external URL'), value: 'URL' },
|
||||
];
|
||||
|
||||
const onDataSaved = (data) => {
|
||||
emit('onDataSaved', data);
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<!-- <FetchData
|
||||
url="Warehouses"
|
||||
@on-fetch="(data) => (warehousesOptions = data)"
|
||||
auto-load
|
||||
/> -->
|
||||
<FormModelPopup
|
||||
url-create="Items/regularize"
|
||||
model="Items"
|
||||
:title="t('Edit photo')"
|
||||
:form-initial-data="editFormData"
|
||||
@on-data-saved="onDataSaved($event)"
|
||||
>
|
||||
<template #form-inputs="{}">
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<QOptionGroup
|
||||
:options="options"
|
||||
type="radio"
|
||||
v-model="editFormData.uploadMethod"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<QFile
|
||||
:label="t('entry.buys.file')"
|
||||
:multiple="false"
|
||||
v-model="editFormData.file"
|
||||
@update:model-value="onFileChange($event)"
|
||||
class="required"
|
||||
>
|
||||
<template #append>
|
||||
<QIcon name="vn:attach" class="cursor-pointer">
|
||||
<QTooltip>{{ t('Select a file') }}</QTooltip>
|
||||
</QIcon>
|
||||
</template>
|
||||
</QFile>
|
||||
</div>
|
||||
</VnRow>
|
||||
<pre>{{ editFormData }}</pre>
|
||||
</template>
|
||||
</FormModelPopup>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Edit photo: Editar foto
|
||||
Select from computer: Seleccionar desde ordenador
|
||||
Import from external URL: Importar desde URL externa
|
||||
</i18n>
|
||||
|
|
@ -9,6 +9,7 @@ import VnLv from 'src/components/ui/VnLv.vue';
|
|||
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
|
||||
import VnConfirm from 'components/ui/VnConfirm.vue';
|
||||
import RegularizeStockForm from 'components/RegularizeStockForm.vue';
|
||||
import EditPictureForm from 'components/EditPictureForm.vue';
|
||||
|
||||
import { useState } from 'src/composables/useState';
|
||||
import useCardDescription from 'src/composables/useCardDescription';
|
||||
|
|
@ -43,6 +44,7 @@ const entityId = computed(() => {
|
|||
return $props.id || route.params.id;
|
||||
});
|
||||
const regularizeStockFormDialog = ref(null);
|
||||
const editPhotoFormDialog = ref(null);
|
||||
const item = ref(null);
|
||||
const available = ref(null);
|
||||
const visible = ref(null);
|
||||
|
|
@ -122,6 +124,10 @@ const openRegularizeStockForm = () => {
|
|||
regularizeStockFormDialog.value.show();
|
||||
};
|
||||
|
||||
const openEditPhotoForm = () => {
|
||||
editPhotoFormDialog.value.show();
|
||||
};
|
||||
|
||||
const cloneItem = async () => {
|
||||
try {
|
||||
const { data } = await axios.post(`Items/${entityId.value}/clone`);
|
||||
|
|
@ -181,30 +187,54 @@ const openCloneDialog = async () => {
|
|||
</QItem>
|
||||
</template>
|
||||
<template #before>
|
||||
<QImg :src="getItemAvatar()" class="photo">
|
||||
<template #error>
|
||||
<div
|
||||
class="absolute-full picture text-center q-pa-md flex flex-center"
|
||||
>
|
||||
<div>
|
||||
<div class="text-grey-5" style="opacity: 0.4; font-size: 5vh">
|
||||
<QIcon name="vn:item" />
|
||||
</div>
|
||||
<div class="text-grey-5" style="opacity: 0.4">
|
||||
{{ t('item.descriptor.item') }}
|
||||
<div class="relative-position">
|
||||
<QImg :src="getItemAvatar()" class="photo" style="position: relative">
|
||||
<template #error>
|
||||
<div
|
||||
class="absolute-full picture text-center q-pa-md flex flex-center"
|
||||
>
|
||||
<div>
|
||||
<div
|
||||
class="text-grey-5"
|
||||
style="opacity: 0.4; font-size: 5vh"
|
||||
>
|
||||
<QIcon name="vn:item" />
|
||||
</div>
|
||||
<div class="text-grey-5" style="opacity: 0.4">
|
||||
{{ t('item.descriptor.item') }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</QImg>
|
||||
<div class="row justify-between full-width bg-primary">
|
||||
</template>
|
||||
</QImg>
|
||||
<QBtn
|
||||
color="primary"
|
||||
size="lg"
|
||||
round
|
||||
class="edit-photo-btn"
|
||||
@click="openEditPhotoForm()"
|
||||
>
|
||||
<QIcon name="edit" size="sm" />
|
||||
<QDialog ref="editPhotoFormDialog">
|
||||
<EditPictureForm />
|
||||
</QDialog>
|
||||
</QBtn>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="row justify-between items-center full-width bg-primary"
|
||||
style="height: 54px"
|
||||
>
|
||||
<div class="col column items-center">
|
||||
<span class="text-uppercase">
|
||||
<span class="text-uppercase" style="font-size: 11px">
|
||||
{{ t('item.descriptor.visible') }}
|
||||
</span>
|
||||
<span class="text-weight-bold text-h5">{{ visible }}</span>
|
||||
</div>
|
||||
<div class="col column items-center">
|
||||
<div
|
||||
class="col column items-center separation-borders"
|
||||
style="font-size: 11px"
|
||||
>
|
||||
<span class="text-uppercase">
|
||||
{{ t('item.descriptor.available') }}
|
||||
</span>
|
||||
|
|
@ -231,7 +261,7 @@ const openCloneDialog = async () => {
|
|||
<VnLv :label="t('item.descriptor.stems')" :value="entity.value7" />
|
||||
</template>
|
||||
<template #actions="{}">
|
||||
<QCardActions>
|
||||
<QCardActions class="row justify-center">
|
||||
<QBtn
|
||||
:to="{ name: 'ItemDiary' }"
|
||||
size="md"
|
||||
|
|
@ -257,4 +287,17 @@ es:
|
|||
.photo {
|
||||
height: 256px;
|
||||
}
|
||||
|
||||
.edit-photo-btn {
|
||||
position: absolute;
|
||||
right: 12px;
|
||||
bottom: 12px;
|
||||
z-index: 1;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.separation-borders {
|
||||
border-left: 1px solid #ffffff;
|
||||
border-right: 1px solid #ffffff;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -133,6 +133,26 @@ const getEntryQueryParams = (supplier) => {
|
|||
<VnLv :label="t('supplier.summary.payDay')" :value="entity.payDay" />
|
||||
<VnLv :label="t('supplier.summary.account')" :value="entity.account" />
|
||||
</template>
|
||||
<template #icons="{ entity }">
|
||||
<QCardActions class="q-gutter-x-md">
|
||||
<QIcon
|
||||
v-if="!entity.isActive"
|
||||
name="vn:disabled"
|
||||
color="primary"
|
||||
size="xs"
|
||||
>
|
||||
<QTooltip>{{ t('Inactive supplier') }}</QTooltip>
|
||||
</QIcon>
|
||||
<QIcon
|
||||
v-if="!entity.isSerious"
|
||||
name="vn:supplierfalse"
|
||||
color="primary"
|
||||
size="xs"
|
||||
>
|
||||
<QTooltip>{{ t('Unverified supplier') }}</QTooltip>
|
||||
</QIcon>
|
||||
</QCardActions>
|
||||
</template>
|
||||
<template #actions="{ entity }">
|
||||
<QCardActions>
|
||||
<QBtn
|
||||
|
|
@ -176,4 +196,6 @@ es:
|
|||
Go to client: Ir a cliente
|
||||
Create invoiceIn: Crear factura recibida
|
||||
Go to module index: Ir al índice del módulo
|
||||
Inactive supplier: Proveedor inactivo
|
||||
Unverified supplier: Proveedor no verificado
|
||||
</i18n>
|
||||
|
|
|
|||
Loading…
Reference in New Issue