diff --git a/src/pages/Worker/Card/WorkerPda.vue b/src/pages/Worker/Card/WorkerPda.vue index 976469476..513edcf45 100644 --- a/src/pages/Worker/Card/WorkerPda.vue +++ b/src/pages/Worker/Card/WorkerPda.vue @@ -71,66 +71,47 @@ function reloadData() { bordered :key="row.id" v-for="row of rows" - class="card q-pt-xs q-mb-sm" + class="card q-px-md q-mb-sm container" > - <QItem> - <QItemSection side-left> - <VnRow> - <QField - :label="t('worker.pda.currentPDA')" - :model-value="row?.deviceProductionFk" - disable - > - <template #control> - <div tabindex="0" style="padding: none"> - <span>Id: </span> - <span> - {{ row?.deviceProductionFk }} - </span> - <span>{{ t('Model') }}: </span> - <span> - {{ row?.deviceProduction?.modelFk }} - </span> - <span>{{ t('SIM serial number') }}: </span> - <span> - {{ - row?.deviceProduction?.serialNumber - }} - </span> - </div> - </template> - </QField> - <QField - :label="t('Current SIM')" - :model-value="row?.simSerialNumber" - disable - > - <template #control> - <div tabindex="0">{{ row?.simSerialNumber }}</div> - </template> - </QField> - </VnRow> - </QItemSection> - <QItemSection side> - <QIcon - name="delete" - size="sm" - class="cursor-pointer" - color="primary" - @click=" - openConfirmationModal( - t(`Remove PDA`), - t('Do you want to remove this PDA?'), - () => deallocatePDA(row.deviceProductionFk) - ) - " - > - <QTooltip> - {{ t('worker.pda.removePDA') }} - </QTooltip> - </QIcon> - </QItemSection> - </QItem> + <VnRow> + <VnInput + :label="t('worker.pda.currentPDA')" + :model-value="row?.deviceProductionFk" + disable + /> + <VnInput + :label="t('Model')" + :model-value="row?.deviceProduction?.modelFk" + disable + /> + <VnInput + :label="t('Serial number')" + :model-value="row?.deviceProduction?.serialNumber" + disable + /> + <VnInput + :label="t('Current SIM')" + :model-value="row?.simSerialNumber" + disable + /> + <QBtn + flat + icon="delete" + color="primary" + class="btn-delete" + @click=" + openConfirmationModal( + t(`Remove PDA`), + t('Do you want to remove this PDA?'), + () => deallocatePDA(row.deviceProductionFk) + ) + " + > + <QTooltip> + {{ t('worker.pda.removePDA') }} + </QTooltip> + </QBtn> + </VnRow> </QCard> </template> </VnPaginate> @@ -187,26 +168,20 @@ function reloadData() { </QPage> </template> <style lang="scss" scoped> -.centerCard { - padding: 5%; - width: 100%; - max-width: 70%; - margin: 0 auto; -} -.label { - color: red; -} -.q-field { - height: 65px; +.btn-delete { + max-width: 4%; + margin-top: 30px; } </style> <i18n> es: + Model: Modelo + Serial number: Número de serie + Current SIM: SIM actual + Add new device: Añadir nuevo dispositivo + PDA deallocated: PDA desasignada Remove PDA: Eliminar PDA Do you want to remove this PDA?: ¿Desea eliminar este PDA? - PDA deallocated: PDA desasignada - SIM serial number: Número de serie de la SIM - Model: Modelo + You can only have one PDA: Solo puedes tener un PDA si no eres autonomo This PDA is already assigned to another user: Este PDA ya está asignado a otro usuario - Add new device: Añadir nuevo dispositivo </i18n> diff --git a/test/cypress/integration/worker/workerPda.spec.js b/test/cypress/integration/worker/workerPda.spec.js index 9af994a70..4184735ae 100644 --- a/test/cypress/integration/worker/workerPda.spec.js +++ b/test/cypress/integration/worker/workerPda.spec.js @@ -15,7 +15,7 @@ describe('WorkerPda', () => { }); it('delete pda', () => { - cy.get('.q-card > .q-item > .q-item__section--side > .q-icon').click(); + cy.get('.btn-delete').click(); cy.get( '.q-card__actions > .q-btn--unelevated > .q-btn__content > .block' ).click();