Merge pull request 'feat: #8612 changed shelving to VnTable & created e2e tests' (!1432) from 8612-shelvinge2e into dev
gitea/salix-front/pipeline/head This commit looks good
Details
gitea/salix-front/pipeline/head This commit looks good
Details
Reviewed-on: #1432 Reviewed-by: Javier Segarra <jsegarra@verdnatura.es>
This commit is contained in:
commit
07055dcfec
|
|
@ -1,14 +1,17 @@
|
|||
<script setup>
|
||||
import VnPaginate from 'components/ui/VnPaginate.vue';
|
||||
import CardList from 'components/ui/CardList.vue';
|
||||
import VnLv from 'components/ui/VnLv.vue';
|
||||
import { computed } from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
import ShelvingFilter from 'pages/Shelving/Card/ShelvingFilter.vue';
|
||||
import ShelvingSummary from 'pages/Shelving/Card/ShelvingSummary.vue';
|
||||
import { useSummaryDialog } from 'src/composables/useSummaryDialog';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import VnTable from 'components/VnTable/VnTable.vue';
|
||||
import VnSection from 'src/components/common/VnSection.vue';
|
||||
import ShelvingFilter from 'pages/Shelving/Card/ShelvingFilter.vue';
|
||||
import ShelvingSummary from './Card/ShelvingSummary.vue';
|
||||
import { useSummaryDialog } from 'src/composables/useSummaryDialog';
|
||||
import exprBuilder from './ShelvingExprBuilder.js';
|
||||
import VnSelect from 'src/components/common/VnSelect.vue';
|
||||
import VnCheckbox from 'src/components/common/VnCheckbox.vue';
|
||||
|
||||
const { t } = useI18n();
|
||||
const router = useRouter();
|
||||
const { viewSummary } = useSummaryDialog();
|
||||
const dataKey = 'ShelvingList';
|
||||
|
|
@ -17,9 +20,56 @@ const filter = {
|
|||
include: [{ relation: 'parking' }],
|
||||
};
|
||||
|
||||
function navigate(id) {
|
||||
router.push({ path: `/shelving/${id}` });
|
||||
}
|
||||
const columns = computed(() => [
|
||||
{
|
||||
align: 'left',
|
||||
name: 'code',
|
||||
label: t('globals.code'),
|
||||
isId: true,
|
||||
isTitle: true,
|
||||
columnFilter: false,
|
||||
create: true,
|
||||
},
|
||||
{
|
||||
align: 'left',
|
||||
name: 'parking',
|
||||
label: t('shelving.list.parking'),
|
||||
sortable: true,
|
||||
format: (val) => val?.code ?? '',
|
||||
cardVisible: true,
|
||||
},
|
||||
{
|
||||
align: 'left',
|
||||
name: 'priority',
|
||||
label: t('shelving.list.priority'),
|
||||
sortable: true,
|
||||
cardVisible: true,
|
||||
create: true,
|
||||
},
|
||||
{
|
||||
align: 'left',
|
||||
name: 'isRecyclable',
|
||||
label: t('shelving.summary.recyclable'),
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
align: 'right',
|
||||
label: '',
|
||||
name: 'tableActions',
|
||||
actions: [
|
||||
{
|
||||
title: t('components.smartCard.viewSummary'),
|
||||
icon: 'preview',
|
||||
action: (row) => viewSummary(row.id, ShelvingSummary),
|
||||
isPrimary: true,
|
||||
},
|
||||
],
|
||||
},
|
||||
]);
|
||||
|
||||
const onDataSaved = ({ id }) => {
|
||||
router.push({ name: 'ShelvingBasicData', params: { id } });
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -37,48 +87,75 @@ function navigate(id) {
|
|||
<ShelvingFilter data-key="ShelvingList" />
|
||||
</template>
|
||||
<template #body>
|
||||
<QPage class="column items-center q-pa-md">
|
||||
<div class="vn-card-list">
|
||||
<VnPaginate :data-key="dataKey">
|
||||
<template #body="{ rows }">
|
||||
<CardList
|
||||
v-for="row of rows"
|
||||
:key="row.id"
|
||||
:id="row.id"
|
||||
:title="row.code"
|
||||
@click="navigate(row.id)"
|
||||
>
|
||||
<template #list-items>
|
||||
<VnLv
|
||||
:label="$t('shelving.list.parking')"
|
||||
:title-label="$t('shelving.list.parking')"
|
||||
:value="row.parking?.code"
|
||||
/>
|
||||
<VnLv
|
||||
:label="$t('shelving.list.priority')"
|
||||
:value="row?.priority"
|
||||
/>
|
||||
</template>
|
||||
<template #actions>
|
||||
<QBtn
|
||||
:label="$t('components.smartCard.openSummary')"
|
||||
@click.stop="viewSummary(row.id, ShelvingSummary)"
|
||||
color="primary"
|
||||
/>
|
||||
</template>
|
||||
</CardList>
|
||||
</template>
|
||||
</VnPaginate>
|
||||
</div>
|
||||
<QPageSticky :offset="[20, 20]">
|
||||
<RouterLink :to="{ name: 'ShelvingCreate' }">
|
||||
<QBtn fab icon="add" color="primary" v-shortcut="'+'" />
|
||||
<QTooltip>
|
||||
{{ $t('shelving.list.newShelving') }}
|
||||
</QTooltip>
|
||||
</RouterLink>
|
||||
</QPageSticky>
|
||||
</QPage>
|
||||
<VnTable
|
||||
:data-key="dataKey"
|
||||
:columns="columns"
|
||||
is-editable="false"
|
||||
:right-search="false"
|
||||
:use-model="true"
|
||||
:disable-option="{ table: true }"
|
||||
redirect="shelving"
|
||||
default-mode="card"
|
||||
:create="{
|
||||
urlCreate: 'Shelvings',
|
||||
title: t('globals.pageTitles.shelvingCreate'),
|
||||
onDataSaved,
|
||||
formInitialData: {
|
||||
parkingFk: null,
|
||||
priority: null,
|
||||
code: '',
|
||||
isRecyclable: false,
|
||||
},
|
||||
}"
|
||||
>
|
||||
<template #more-create-dialog="{ data }">
|
||||
<VnSelect
|
||||
v-model="data.parkingFk"
|
||||
url="Parkings"
|
||||
option-value="id"
|
||||
option-label="code"
|
||||
:label="t('shelving.list.parking')"
|
||||
:filter-options="['id', 'code']"
|
||||
:fields="['id', 'code']"
|
||||
/>
|
||||
<VnCheckbox
|
||||
v-model="data.isRecyclable"
|
||||
:label="t('shelving.summary.recyclable')"
|
||||
/>
|
||||
</template>
|
||||
</VnTable>
|
||||
</template>
|
||||
</VnSection>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
width: 55%;
|
||||
}
|
||||
.list-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
shelving:
|
||||
list:
|
||||
parking: Estacionamiento
|
||||
priority: Prioridad
|
||||
|
||||
summary:
|
||||
recyclable: Reciclable
|
||||
en:
|
||||
shelving:
|
||||
list:
|
||||
parking: Parking
|
||||
priority: Priority
|
||||
|
||||
summary:
|
||||
recyclable: Recyclable
|
||||
</i18n>
|
||||
|
|
|
|||
|
|
@ -111,15 +111,6 @@ export default {
|
|||
shelvingCard,
|
||||
],
|
||||
},
|
||||
{
|
||||
path: 'create',
|
||||
name: 'ShelvingCreate',
|
||||
meta: {
|
||||
title: 'shelvingCreate',
|
||||
icon: 'add',
|
||||
},
|
||||
component: () => import('src/pages/Shelving/Card/ShelvingForm.vue'),
|
||||
},
|
||||
{
|
||||
path: 'parking',
|
||||
name: 'ParkingMain',
|
||||
|
|
|
|||
|
|
@ -0,0 +1,24 @@
|
|||
/// <reference types="cypress" />
|
||||
describe('ShelvingList', () => {
|
||||
const parking =
|
||||
'.q-card > :nth-child(1) > .q-select > .q-field__inner > .q-field__control > .q-field__control-container';
|
||||
beforeEach(() => {
|
||||
cy.viewport(1920, 1080);
|
||||
cy.login('developer');
|
||||
cy.visit(`/#/shelving/1/basic-data`);
|
||||
});
|
||||
|
||||
it('should give an error if the code aldready exists', () => {
|
||||
cy.dataCy('Code_input').should('exist').clear().type('AA7');
|
||||
cy.saveCard();
|
||||
cy.get('.q-notification__message').should('have.text', 'The code already exists');
|
||||
});
|
||||
it('should edit the data and save', () => {
|
||||
cy.selectOption(parking, 'P-01-1');
|
||||
cy.dataCy('Code_input').clear().type('AA1');
|
||||
cy.dataCy('Priority_input').clear().type('10');
|
||||
cy.get(':nth-child(2) > .q-checkbox > .q-checkbox__inner').click();
|
||||
cy.saveCard();
|
||||
cy.get('.q-notification__message').should('have.text', 'Data saved');
|
||||
});
|
||||
});
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
/// <reference types="cypress" />
|
||||
describe('ShelvingList', () => {
|
||||
beforeEach(() => {
|
||||
cy.viewport(1920, 1080);
|
||||
cy.login('developer');
|
||||
cy.visit(`/#/shelving/list`);
|
||||
});
|
||||
|
||||
it('should redirect on clicking a shelving', () => {
|
||||
cy.typeSearchbar('{enter}');
|
||||
cy.dataCy('cardBtn').eq(0).click();
|
||||
cy.get('.summaryHeader > .header > .q-icon').click();
|
||||
cy.url().should('include', '/shelving/1/summary');
|
||||
});
|
||||
|
||||
it('should redirect from preview to basic-data', () => {
|
||||
cy.typeSearchbar('{enter}');
|
||||
cy.dataCy('cardBtn').eq(0).click();
|
||||
cy.get('.q-card > .header').click();
|
||||
cy.url().should('include', '/shelving/1/basic-data');
|
||||
});
|
||||
|
||||
it('should filter and redirect if only one result', () => {
|
||||
cy.selectOption('[data-cy="Parking_select"]', 'P-02-2');
|
||||
cy.dataCy('Parking_select').type('{enter}');
|
||||
cy.url().should('match', /\/shelving\/\d+\/summary/);
|
||||
});
|
||||
|
||||
it('should create a new shelving', () => {
|
||||
cy.dataCy('vnTableCreateBtn').click();
|
||||
cy.dataCy('code-create-popup').type('Test');
|
||||
cy.dataCy('Priority_input').type('10');
|
||||
cy.selectOption(
|
||||
'.grid-create > .q-select > .q-field__inner > .q-field__control > .q-field__control-container',
|
||||
'100-01',
|
||||
);
|
||||
cy.dataCy('FormModelPopup_save').click();
|
||||
cy.checkNotification('Data created');
|
||||
cy.url().should('match', /\/shelving\/\d+\/basic-data/);
|
||||
});
|
||||
});
|
||||
Loading…
Reference in New Issue