refs #6897 change image, fit component
This commit is contained in:
parent
9fe5fd2391
commit
e62e914e48
|
@ -39,7 +39,7 @@ const enterEvent = {
|
||||||
|
|
||||||
const defaultAttrs = {
|
const defaultAttrs = {
|
||||||
filled: !$props.showTitle,
|
filled: !$props.showTitle,
|
||||||
class: 'q-px-sm q-pb-xs q-pt-none',
|
class: 'q-px-sm q-pb-xs q-pt-none fit',
|
||||||
dense: true,
|
dense: true,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -80,7 +80,7 @@ const components = {
|
||||||
event: updateEvent,
|
event: updateEvent,
|
||||||
attrs: {
|
attrs: {
|
||||||
dense: true,
|
dense: true,
|
||||||
class: $props.showTitle ? 'q-py-sm q-mt-md' : 'q-px-md q-py-xs',
|
class: $props.showTitle ? 'q-py-sm q-mt-md' : 'q-px-md q-py-xs fit',
|
||||||
'toggle-indeterminate': true,
|
'toggle-indeterminate': true,
|
||||||
},
|
},
|
||||||
forceAttrs,
|
forceAttrs,
|
||||||
|
@ -89,7 +89,7 @@ const components = {
|
||||||
component: markRaw(VnSelect),
|
component: markRaw(VnSelect),
|
||||||
event: updateEvent,
|
event: updateEvent,
|
||||||
attrs: {
|
attrs: {
|
||||||
class: 'q-px-md q-pb-xs q-pt-none',
|
class: 'q-px-md q-pb-xs q-pt-none fit',
|
||||||
dense: true,
|
dense: true,
|
||||||
filled: !$props.showTitle,
|
filled: !$props.showTitle,
|
||||||
},
|
},
|
||||||
|
|
|
@ -54,7 +54,6 @@ function toValueAttrs(attrs) {
|
||||||
v-bind="mix(toComponent).attrs"
|
v-bind="mix(toComponent).attrs"
|
||||||
v-on="mix(toComponent).event ?? {}"
|
v-on="mix(toComponent).event ?? {}"
|
||||||
v-model="model"
|
v-model="model"
|
||||||
class="fit"
|
|
||||||
/>
|
/>
|
||||||
</span>
|
</span>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
@ -442,6 +442,8 @@ entry:
|
||||||
packagingFk: Package
|
packagingFk: Package
|
||||||
packingOut: Package out
|
packingOut: Package out
|
||||||
landing: Landing
|
landing: Landing
|
||||||
|
isExcludedFromAvailable: Es inventory
|
||||||
|
isRaid: Raid
|
||||||
ticket:
|
ticket:
|
||||||
pageTitles:
|
pageTitles:
|
||||||
tickets: Tickets
|
tickets: Tickets
|
||||||
|
|
|
@ -441,6 +441,8 @@ entry:
|
||||||
packagingFk: Embalaje
|
packagingFk: Embalaje
|
||||||
packingOut: Embalaje envíos
|
packingOut: Embalaje envíos
|
||||||
landing: Llegada
|
landing: Llegada
|
||||||
|
isExcludedFromAvailable: Es inventario
|
||||||
|
isRaid: Redada
|
||||||
ticket:
|
ticket:
|
||||||
pageTitles:
|
pageTitles:
|
||||||
tickets: Tickets
|
tickets: Tickets
|
||||||
|
|
|
@ -12,6 +12,8 @@ const router = useRouter();
|
||||||
const stateStore = useStateStore();
|
const stateStore = useStateStore();
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
import { toDate } from 'src/filters';
|
import { toDate } from 'src/filters';
|
||||||
|
import VnImg from 'src/components/ui/VnImg.vue';
|
||||||
|
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||||
const rowsFetchDataRef = ref(null);
|
const rowsFetchDataRef = ref(null);
|
||||||
const editTableCellDialogRef = ref(null);
|
const editTableCellDialogRef = ref(null);
|
||||||
const allColumnNames = ref([]);
|
const allColumnNames = ref([]);
|
||||||
|
@ -73,10 +75,20 @@ const getInputEvents = (col) => {
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
const columns = computed(() => [
|
const columns = [
|
||||||
{
|
{
|
||||||
label: t('entry.latestBuys.tableVisibleColumns.picture'),
|
label: t('entry.latestBuys.tableVisibleColumns.image'),
|
||||||
name: 'picture',
|
name: 'image',
|
||||||
|
columnField: {
|
||||||
|
component: VnImg,
|
||||||
|
attrs: (id) => {
|
||||||
|
return {
|
||||||
|
id,
|
||||||
|
width: '50px',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
columnFilter: false
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
align: 'left',
|
align: 'left',
|
||||||
|
@ -229,7 +241,7 @@ const columns = computed(() => [
|
||||||
},
|
},
|
||||||
format: (row, dashIfEmpty) => dashIfEmpty(toDate(row.landing))
|
format: (row, dashIfEmpty) => dashIfEmpty(toDate(row.landing))
|
||||||
},
|
},
|
||||||
]);
|
];
|
||||||
|
|
||||||
const editTableCellFormFieldsOptions = [
|
const editTableCellFormFieldsOptions = [
|
||||||
{ field: 'packing', label: t('entry.latestBuys.packing') },
|
{ field: 'packing', label: t('entry.latestBuys.packing') },
|
||||||
|
@ -267,15 +279,16 @@ const applyColumnFilter = async (col) => {
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
stateStore.rightDrawer = true;
|
stateStore.rightDrawer = true;
|
||||||
const filteredColumns = columns.value.filter((col) => col.name !== 'picture');
|
// const filteredColumns = columns.value.filter((col) => col.name !== 'picture');
|
||||||
allColumnNames.value = filteredColumns.map((col) => col.name);
|
// allColumnNames.value = filteredColumns.map((col) => col.name);
|
||||||
await arrayData.fetch({ append: false });
|
// await arrayData.fetch({ append: false });
|
||||||
});
|
});
|
||||||
|
|
||||||
onUnmounted(() => (stateStore.rightDrawer = false));
|
onUnmounted(() => (stateStore.rightDrawer = false));
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
<VnSubToolbar/>
|
||||||
<VnTable
|
<VnTable
|
||||||
ref="tableRef"
|
ref="tableRef"
|
||||||
data-key="LatestBuys"
|
data-key="LatestBuys"
|
||||||
|
|
|
@ -7,31 +7,45 @@ import EntryFilter from './EntryFilter.vue';
|
||||||
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
|
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
|
||||||
import { useStateStore } from 'stores/useStateStore';
|
import { useStateStore } from 'stores/useStateStore';
|
||||||
import VnTable from 'components/VnTable/VnTable.vue';
|
import VnTable from 'components/VnTable/VnTable.vue';
|
||||||
import { useSummaryDialog } from 'src/composables/useSummaryDialog';
|
|
||||||
import RightMenu from 'src/components/common/RightMenu.vue';
|
import RightMenu from 'src/components/common/RightMenu.vue';
|
||||||
import { toDate } from 'src/filters';
|
import { toDate } from 'src/filters';
|
||||||
|
|
||||||
const stateStore = useStateStore();
|
const stateStore = useStateStore();
|
||||||
const router = useRouter();
|
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
const { viewSummary } = useSummaryDialog();
|
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const entityId = computed(() => route.params.id);
|
const entityId = computed(() => route.params.id);
|
||||||
function navigate(id) {
|
|
||||||
router.push({ path: `/entry/${id}` });
|
|
||||||
}
|
|
||||||
|
|
||||||
const redirectToCreateView = () => {
|
const entryFilter = {
|
||||||
router.push({ name: 'EntryCreate' });
|
include: [
|
||||||
|
{
|
||||||
|
relation: 'supplier',
|
||||||
|
scope: {
|
||||||
|
fields: ['id', 'name'],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
relation: 'travel',
|
||||||
|
scope: {
|
||||||
|
fields: ['id', 'ref'],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
relation: 'company',
|
||||||
|
scope: {
|
||||||
|
fields: ['id', 'code'],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
};
|
};
|
||||||
|
|
||||||
const columns = computed(() => [
|
const columns = computed(() => [
|
||||||
|
|
||||||
{
|
{
|
||||||
align: 'left',
|
align: 'left',
|
||||||
label: t('entry.list.tableVisibleColumns.id'),
|
label: t('entry.list.tableVisibleColumns.id'),
|
||||||
name: 'id',
|
name: 'id',
|
||||||
isTitle: true,
|
isTitle: true,
|
||||||
create: true,
|
cardVisible: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
align: 'left',
|
align: 'left',
|
||||||
|
@ -39,12 +53,14 @@ const columns = computed(() => [
|
||||||
name: 'reference',
|
name: 'reference',
|
||||||
isTitle: true,
|
isTitle: true,
|
||||||
create: true,
|
create: true,
|
||||||
|
cardVisible: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
align: 'left',
|
align: 'left',
|
||||||
label: t('entry.list.tableVisibleColumns.created'),
|
label: t('entry.list.tableVisibleColumns.created'),
|
||||||
name: 'created',
|
name: 'created',
|
||||||
create: true,
|
create: true,
|
||||||
|
cardVisible: true,
|
||||||
component: 'date',
|
component: 'date',
|
||||||
columnField: {
|
columnField: {
|
||||||
component: null,
|
component: null,
|
||||||
|
@ -56,6 +72,7 @@ const columns = computed(() => [
|
||||||
label: t('entry.list.tableVisibleColumns.supplierFk'),
|
label: t('entry.list.tableVisibleColumns.supplierFk'),
|
||||||
name: 'supplierFk',
|
name: 'supplierFk',
|
||||||
create: true,
|
create: true,
|
||||||
|
cardVisible: true,
|
||||||
component: 'select',
|
component: 'select',
|
||||||
attrs: {
|
attrs: {
|
||||||
url: 'suppliers',
|
url: 'suppliers',
|
||||||
|
@ -70,6 +87,7 @@ const columns = computed(() => [
|
||||||
align: 'left',
|
align: 'left',
|
||||||
label: t('entry.list.tableVisibleColumns.isBooked'),
|
label: t('entry.list.tableVisibleColumns.isBooked'),
|
||||||
name: 'isBooked',
|
name: 'isBooked',
|
||||||
|
cardVisible: true,
|
||||||
create: true,
|
create: true,
|
||||||
component: 'checkbox',
|
component: 'checkbox',
|
||||||
},
|
},
|
||||||
|
@ -77,6 +95,7 @@ const columns = computed(() => [
|
||||||
align: 'left',
|
align: 'left',
|
||||||
label: t('entry.list.tableVisibleColumns.isConfirmed'),
|
label: t('entry.list.tableVisibleColumns.isConfirmed'),
|
||||||
name: 'isConfirmed',
|
name: 'isConfirmed',
|
||||||
|
cardVisible: true,
|
||||||
create: true,
|
create: true,
|
||||||
component: 'checkbox',
|
component: 'checkbox',
|
||||||
},
|
},
|
||||||
|
@ -84,9 +103,58 @@ const columns = computed(() => [
|
||||||
align: 'left',
|
align: 'left',
|
||||||
label: t('entry.list.tableVisibleColumns.isOrdered'),
|
label: t('entry.list.tableVisibleColumns.isOrdered'),
|
||||||
name: 'isOrdered',
|
name: 'isOrdered',
|
||||||
|
cardVisible: true,
|
||||||
create: true,
|
create: true,
|
||||||
component: 'checkbox',
|
component: 'checkbox',
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
align: 'left',
|
||||||
|
label: t('entry.list.tableVisibleColumns.companyFk'),
|
||||||
|
name: 'companyFk',
|
||||||
|
component: 'select',
|
||||||
|
attrs: {
|
||||||
|
url: 'companies',
|
||||||
|
fields: ['id', 'code'],
|
||||||
|
},
|
||||||
|
create: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
align: 'left',
|
||||||
|
label: t('entry.list.tableVisibleColumns.travelFk'),
|
||||||
|
name: 'travelFk',
|
||||||
|
component: 'select',
|
||||||
|
attrs: {
|
||||||
|
url: 'travels',
|
||||||
|
fields: ['id', 'ref'],
|
||||||
|
},
|
||||||
|
create: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
align: 'left',
|
||||||
|
label: t('entry.list.tableVisibleColumns.isExcludedFromAvailable'),
|
||||||
|
name: 'isExcludedFromAvailable',
|
||||||
|
chip: {
|
||||||
|
color: null,
|
||||||
|
condition: (value) => value,
|
||||||
|
icon: 'vn:inventory',
|
||||||
|
},
|
||||||
|
columnFilter: {
|
||||||
|
inWhere: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
align: 'left',
|
||||||
|
label: t('entry.list.tableVisibleColumns.isRaid'),
|
||||||
|
name: 'isRaid',
|
||||||
|
chip: {
|
||||||
|
color: null,
|
||||||
|
condition: (value) => value,
|
||||||
|
icon: 'vn:net',
|
||||||
|
},
|
||||||
|
columnFilter: {
|
||||||
|
inWhere: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
]);
|
]);
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
stateStore.rightDrawer = true;
|
stateStore.rightDrawer = true;
|
||||||
|
@ -110,6 +178,7 @@ onMounted(async () => {
|
||||||
url="Entries/filter"
|
url="Entries/filter"
|
||||||
url-create="Entries"
|
url-create="Entries"
|
||||||
save-url="Entries/crud"
|
save-url="Entries/crud"
|
||||||
|
:filter="entryFilter"
|
||||||
:create="{
|
:create="{
|
||||||
urlCreate: 'Entries',
|
urlCreate: 'Entries',
|
||||||
title: 'Create entry',
|
title: 'Create entry',
|
||||||
|
|
Loading…
Reference in New Issue