refactor: refs #8316 used VnSection and VnCardBeta on ItemCard
gitea/salix-front/pipeline/pr-dev There was a failure building this commit
Details
gitea/salix-front/pipeline/pr-dev There was a failure building this commit
Details
This commit is contained in:
parent
0fba2ade32
commit
37a71f7594
|
|
@ -1,19 +1,11 @@
|
|||
<script setup>
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import VnCardBeta from 'components/common/VnCardBeta.vue';
|
||||
import ItemDescriptor from './ItemDescriptor.vue';
|
||||
import ItemListFilter from '../ItemListFilter.vue';
|
||||
</script>
|
||||
<template>
|
||||
<VnCard
|
||||
<VnCardBeta
|
||||
data-key="Item"
|
||||
base-url="Items"
|
||||
:descriptor="ItemDescriptor"
|
||||
:filter-panel="ItemListFilter"
|
||||
search-data-key="ItemList"
|
||||
:searchbar-props="{
|
||||
url: 'Items/filter',
|
||||
label: 'searchbar.label',
|
||||
info: 'searchbar.info',
|
||||
}"
|
||||
/>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -6,15 +6,14 @@ import VnImg from 'src/components/ui/VnImg.vue';
|
|||
import VnTable from 'components/VnTable/VnTable.vue';
|
||||
import { toDate } from 'src/filters';
|
||||
import FetchedTags from 'src/components/ui/FetchedTags.vue';
|
||||
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
|
||||
import { useSummaryDialog } from 'src/composables/useSummaryDialog';
|
||||
import ItemSummary from '../Item/Card/ItemSummary.vue';
|
||||
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
|
||||
import ItemDescriptorProxy from './Card/ItemDescriptorProxy.vue';
|
||||
import ItemTypeDescriptorProxy from './ItemType/Card/ItemTypeDescriptorProxy.vue';
|
||||
import { cloneItem } from 'src/pages/Item/composables/cloneItem';
|
||||
import RightMenu from 'src/components/common/RightMenu.vue';
|
||||
import ItemListFilter from './ItemListFilter.vue';
|
||||
import VnSection from 'src/components/common/VnSection.vue';
|
||||
|
||||
const entityId = computed(() => route.params.id);
|
||||
const { openCloneDialog } = cloneItem();
|
||||
|
|
@ -22,6 +21,7 @@ const { viewSummary } = useSummaryDialog();
|
|||
const { t } = useI18n();
|
||||
const tableRef = ref();
|
||||
const route = useRoute();
|
||||
const dataKey = 'ItemList';
|
||||
|
||||
const itemFilter = {
|
||||
include: [
|
||||
|
|
@ -298,73 +298,78 @@ const columns = computed(() => [
|
|||
},
|
||||
]);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<VnSearchbar
|
||||
data-key="ItemList"
|
||||
:label="t('item.searchbar.label')"
|
||||
:info="t('You can search by id')"
|
||||
/>
|
||||
<RightMenu>
|
||||
<template #right-panel>
|
||||
<VnSection
|
||||
:data-key="dataKey"
|
||||
:columns="columns"
|
||||
prefix="item"
|
||||
:array-data-props="{
|
||||
url: 'Items',
|
||||
order: ['isActive DESC', 'name', 'id']
|
||||
}"
|
||||
>
|
||||
<template #rightMenu>
|
||||
<ItemListFilter data-key="ItemList" />
|
||||
</template>
|
||||
</RightMenu>
|
||||
<VnTable
|
||||
ref="tableRef"
|
||||
data-key="ItemList"
|
||||
url="Items/filter"
|
||||
:create="{
|
||||
urlCreate: 'Items',
|
||||
title: t('Create Item'),
|
||||
onDataSaved: () => tableRef.redirect(),
|
||||
formInitialData: {
|
||||
editorFk: entityId,
|
||||
},
|
||||
}"
|
||||
:order="['isActive DESC', 'name', 'id']"
|
||||
:columns="columns"
|
||||
redirect="Item"
|
||||
:is-editable="false"
|
||||
:right-search="false"
|
||||
:filter="itemFilter"
|
||||
>
|
||||
<template #column-image="{ row }">
|
||||
<VnImg
|
||||
:id="row?.id"
|
||||
zoom-resolution="1600x900"
|
||||
:zoom="true"
|
||||
class="rounded"
|
||||
/>
|
||||
<template #body>
|
||||
<VnTable
|
||||
ref="tableRef"
|
||||
:data-key="dataKey"
|
||||
:columns="columns"
|
||||
:right-search="false"
|
||||
redirect="Item"
|
||||
url="Items/filter"
|
||||
:create="{
|
||||
urlCreate: 'Items',
|
||||
title: t('Create Item'),
|
||||
onDataSaved: () => tableRef.redirect(),
|
||||
formInitialData: {
|
||||
editorFk: entityId,
|
||||
},
|
||||
}"
|
||||
:is-editable="false"
|
||||
:filter="itemFilter"
|
||||
>
|
||||
<template #column-image="{ row }">
|
||||
<VnImg
|
||||
:id="row?.id"
|
||||
zoom-resolution="1600x900"
|
||||
:zoom="true"
|
||||
class="rounded"
|
||||
/>
|
||||
</template>
|
||||
<template #column-id="{ row }">
|
||||
<span class="link" @click.stop>
|
||||
{{ row.id }}
|
||||
<ItemDescriptorProxy :id="row.id" />
|
||||
</span>
|
||||
</template>
|
||||
<template #column-typeName="{ row }">
|
||||
<span class="link" @click.stop>
|
||||
{{ row.typeName }}
|
||||
{{ row.typeFk }}
|
||||
<ItemTypeDescriptorProxy :id="row.typeFk" />
|
||||
</span>
|
||||
</template>
|
||||
<template #column-userName="{ row }">
|
||||
<span class="link" @click.stop>
|
||||
{{ row.userName }}
|
||||
<WorkerDescriptorProxy :id="row.buyerFk" />
|
||||
</span>
|
||||
</template>
|
||||
<template #column-description="{ row }">
|
||||
<div class="row column full-width justify-between items-start">
|
||||
{{ row?.name }}
|
||||
<div v-if="row?.subName" class="subName">
|
||||
{{ row?.subName.toUpperCase() }}
|
||||
</div>
|
||||
</div>
|
||||
<FetchedTags :item="row" :columns="3" />
|
||||
</template>
|
||||
</VnTable>
|
||||
</template>
|
||||
<template #column-id="{ row }">
|
||||
<span class="link" @click.stop>
|
||||
{{ row.id }}
|
||||
<ItemDescriptorProxy :id="row.id" />
|
||||
</span>
|
||||
</template>
|
||||
<template #column-typeName="{ row }">
|
||||
<span class="link" @click.stop>
|
||||
{{ row.typeName }}
|
||||
{{ row.typeFk }}
|
||||
<ItemTypeDescriptorProxy :id="row.typeFk" />
|
||||
</span>
|
||||
</template>
|
||||
<template #column-userName="{ row }">
|
||||
<span class="link" @click.stop>
|
||||
{{ row.userName }}
|
||||
<WorkerDescriptorProxy :id="row.buyerFk" />
|
||||
</span>
|
||||
</template>
|
||||
<template #column-description="{ row }">
|
||||
<div class="row column full-width justify-between items-start">
|
||||
{{ row?.name }}
|
||||
<div v-if="row?.subName" class="subName">
|
||||
{{ row?.subName.toUpperCase() }}
|
||||
</div>
|
||||
</div>
|
||||
<FetchedTags :item="row" :columns="3" />
|
||||
</template>
|
||||
</VnTable>
|
||||
</VnSection>
|
||||
</template>
|
||||
<style lang="scss" scoped>
|
||||
.subName {
|
||||
|
|
|
|||
|
|
@ -217,3 +217,5 @@ item:
|
|||
minSalesQuantity: 'Cantidad mínima de venta'
|
||||
genus: 'Genus'
|
||||
specie: 'Specie'
|
||||
search: 'Search item'
|
||||
searchInfo: 'You can search by id'
|
||||
|
|
|
|||
|
|
@ -219,3 +219,5 @@ item:
|
|||
achieved: 'Conseguido'
|
||||
concept: 'Concepto'
|
||||
state: 'Estado'
|
||||
search: 'Buscar artículo'
|
||||
searchInfo: 'Puedes buscar por id'
|
||||
|
|
|
|||
|
|
@ -1,25 +1,12 @@
|
|||
import { RouterView } from 'vue-router';
|
||||
|
||||
export default {
|
||||
path: '/item',
|
||||
name: 'Item',
|
||||
const itemCard = {
|
||||
name: 'ItemCard',
|
||||
path: ':id',
|
||||
component: () => import('src/pages/Item/Card/ItemCard.vue'),
|
||||
redirect: { name: 'ItemSummary' },
|
||||
meta: {
|
||||
title: 'items',
|
||||
icon: 'vn:item',
|
||||
moduleName: 'Item',
|
||||
keyBinding: 'a',
|
||||
},
|
||||
component: RouterView,
|
||||
redirect: { name: 'ItemMain' },
|
||||
menus: {
|
||||
main: [
|
||||
'ItemList',
|
||||
'WasteBreakdown',
|
||||
'ItemFixedPrice',
|
||||
'ItemRequest',
|
||||
'ItemTypeList',
|
||||
],
|
||||
card: [
|
||||
menu: [
|
||||
'ItemBasicData',
|
||||
'ItemLog',
|
||||
'ItemDiary',
|
||||
|
|
@ -29,24 +16,143 @@ export default {
|
|||
'ItemBarcode',
|
||||
'ItemShelving',
|
||||
'ItemLastEntries',
|
||||
'ItemTags',
|
||||
],
|
||||
]
|
||||
},
|
||||
children: [
|
||||
{
|
||||
name: 'ItemSummary',
|
||||
path: 'summary',
|
||||
meta: {
|
||||
title: 'summary',
|
||||
icon: 'launch',
|
||||
},
|
||||
component: () => import('src/pages/Item/Card/ItemSummary.vue'),
|
||||
},
|
||||
{
|
||||
path: 'basic-data',
|
||||
name: 'ItemBasicData',
|
||||
meta: {
|
||||
title: 'basicData',
|
||||
icon: 'vn:settings',
|
||||
},
|
||||
component: () => import('src/pages/Item/Card/ItemBasicData.vue'),
|
||||
},
|
||||
{
|
||||
path: 'log',
|
||||
name: 'ItemLog',
|
||||
meta: {
|
||||
title: 'log',
|
||||
icon: 'vn:History',
|
||||
},
|
||||
component: () => import('src/pages/Item/Card/ItemLog.vue'),
|
||||
},
|
||||
{
|
||||
path: 'diary',
|
||||
name: 'ItemDiary',
|
||||
meta: {
|
||||
title: 'diary',
|
||||
icon: 'vn:transaction',
|
||||
},
|
||||
component: () => import('src/pages/Item/Card/ItemDiary.vue'),
|
||||
},
|
||||
{
|
||||
path: 'tags',
|
||||
name: 'ItemTags',
|
||||
meta: {
|
||||
title: 'tags',
|
||||
icon: 'vn:tag',
|
||||
},
|
||||
component: () => import('src/pages/Item/Card/ItemTags.vue'),
|
||||
},
|
||||
{
|
||||
path: 'tax',
|
||||
name: 'ItemTax',
|
||||
meta: {
|
||||
title: 'tax',
|
||||
icon: 'vn:tax',
|
||||
},
|
||||
component: () => import('src/pages/Item/Card/ItemTax.vue'),
|
||||
},
|
||||
{
|
||||
path: 'botanical',
|
||||
name: 'ItemBotanical',
|
||||
meta: {
|
||||
title: 'botanical',
|
||||
icon: 'vn:botanical',
|
||||
},
|
||||
component: () => import('src/pages/Item/Card/ItemBotanical.vue'),
|
||||
},
|
||||
{
|
||||
path: 'barcode',
|
||||
name: 'ItemBarcode',
|
||||
meta: {
|
||||
title: 'barcode',
|
||||
icon: 'vn:barcode',
|
||||
},
|
||||
component: () => import('src/pages/Item/Card/ItemBarcode.vue'),
|
||||
},
|
||||
{
|
||||
path: 'shelving',
|
||||
name: 'ItemShelving',
|
||||
meta: {
|
||||
title: 'shelving',
|
||||
icon: 'vn:inventory',
|
||||
},
|
||||
component: () => import('src/pages/Item/Card/ItemShelving.vue'),
|
||||
},
|
||||
{
|
||||
path: 'last-entries',
|
||||
name: 'ItemLastEntries',
|
||||
meta: {
|
||||
title: 'lastEntries',
|
||||
icon: 'vn:regentry',
|
||||
},
|
||||
component: () => import('src/pages/Item/Card/ItemLastEntries.vue'),
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
export default {
|
||||
name: 'Item',
|
||||
path: '/item',
|
||||
meta: {
|
||||
title: 'items',
|
||||
icon: 'vn:item',
|
||||
moduleName: 'Item',
|
||||
keyBinding: 'a',
|
||||
menu: [
|
||||
'ItemList',
|
||||
'WasteBreakdown',
|
||||
'ItemFixedPrice',
|
||||
'ItemRequest',
|
||||
'ItemTypeList'
|
||||
],
|
||||
},
|
||||
component: RouterView,
|
||||
redirect: { name: 'ItemMain' },
|
||||
children: [
|
||||
{
|
||||
name: 'ItemMain',
|
||||
path: '',
|
||||
name: 'ItemMain',
|
||||
component: () => import('src/components/common/VnModule.vue'),
|
||||
redirect: { name: 'ItemList' },
|
||||
redirect: { name: 'ItemIndexMain' },
|
||||
children: [
|
||||
{
|
||||
path: 'list',
|
||||
name: 'ItemList',
|
||||
meta: {
|
||||
title: 'list',
|
||||
icon: 'view_list',
|
||||
},
|
||||
path:'',
|
||||
name: 'ItemIndexMain',
|
||||
redirect: { name: 'ItemList' },
|
||||
component: () => import('src/pages/Item/ItemList.vue'),
|
||||
children: [
|
||||
{
|
||||
name: 'ItemList',
|
||||
path: 'list',
|
||||
meta: {
|
||||
title: 'list',
|
||||
icon: 'view_list',
|
||||
},
|
||||
},
|
||||
itemCard,
|
||||
],
|
||||
},
|
||||
{
|
||||
path: 'request',
|
||||
|
|
@ -99,103 +205,5 @@ export default {
|
|||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
name: 'ItemCard',
|
||||
path: ':id',
|
||||
component: () => import('src/pages/Item/Card/ItemCard.vue'),
|
||||
redirect: { name: 'ItemSummary' },
|
||||
children: [
|
||||
{
|
||||
name: 'ItemSummary',
|
||||
path: 'summary',
|
||||
meta: {
|
||||
title: 'summary',
|
||||
icon: 'launch',
|
||||
},
|
||||
component: () => import('src/pages/Item/Card/ItemSummary.vue'),
|
||||
},
|
||||
{
|
||||
path: 'basic-data',
|
||||
name: 'ItemBasicData',
|
||||
meta: {
|
||||
title: 'basicData',
|
||||
icon: 'vn:settings',
|
||||
},
|
||||
component: () => import('src/pages/Item/Card/ItemBasicData.vue'),
|
||||
},
|
||||
{
|
||||
path: 'tags',
|
||||
name: 'ItemTags',
|
||||
meta: {
|
||||
title: 'tags',
|
||||
icon: 'vn:tags',
|
||||
},
|
||||
component: () => import('src/pages/Item/Card/ItemTags.vue'),
|
||||
},
|
||||
{
|
||||
path: 'last-entries',
|
||||
name: 'ItemLastEntries',
|
||||
meta: {
|
||||
title: 'lastEntries',
|
||||
icon: 'vn:regentry',
|
||||
},
|
||||
component: () => import('src/pages/Item/Card/ItemLastEntries.vue'),
|
||||
},
|
||||
{
|
||||
path: 'tax',
|
||||
name: 'ItemTax',
|
||||
meta: {
|
||||
title: 'tax',
|
||||
icon: 'vn:tax',
|
||||
},
|
||||
component: () => import('src/pages/Item/Card/ItemTax.vue'),
|
||||
},
|
||||
{
|
||||
path: 'botanical',
|
||||
name: 'ItemBotanical',
|
||||
meta: {
|
||||
title: 'botanical',
|
||||
icon: 'local_florist',
|
||||
},
|
||||
component: () => import('src/pages/Item/Card/ItemBotanical.vue'),
|
||||
},
|
||||
{
|
||||
path: 'shelving',
|
||||
name: 'ItemShelving',
|
||||
meta: {
|
||||
title: 'shelving',
|
||||
icon: 'vn:inventory',
|
||||
},
|
||||
component: () => import('src/pages/Item/Card/ItemShelving.vue'),
|
||||
},
|
||||
{
|
||||
path: 'barcode',
|
||||
name: 'ItemBarcode',
|
||||
meta: {
|
||||
title: 'barcode',
|
||||
icon: 'vn:barcode',
|
||||
},
|
||||
component: () => import('src/pages/Item/Card/ItemBarcode.vue'),
|
||||
},
|
||||
{
|
||||
path: 'diary',
|
||||
name: 'ItemDiary',
|
||||
meta: {
|
||||
title: 'diary',
|
||||
icon: 'vn:transaction',
|
||||
},
|
||||
component: () => import('src/pages/Item/Card/ItemDiary.vue'),
|
||||
},
|
||||
{
|
||||
path: 'log',
|
||||
name: 'ItemLog',
|
||||
meta: {
|
||||
title: 'log',
|
||||
icon: 'vn:History',
|
||||
},
|
||||
component: () => import('src/pages/Item/Card/ItemLog.vue'),
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
};
|
||||
|
|
|
|||
Loading…
Reference in New Issue