verdnatura/salix-front
verdnatura
/
salix-front
2
2
Fork 1
Code Issues Pull Requests 99 Releases Wiki Activity

feat(ticketBoxing): fix front
gitea/salix-front/pipeline/head This commit looks good Details

This commit is contained in:
Alex Moreno 2022-08-03 14:58:58 +02:00
parent 0fb77eadc0
commit 424ff568cd
3 changed files with 81 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/i18n/en/index.js
View File

@ -56,8 +56,10 @@ export default {
basicData: 'Basic Data' basicData: 'Basic Data'
}, },
boxing: { boxing: {
expedition: 'Expedición', expedition: 'Expedition',
item: 'Artículo' item: 'Item',
created: 'Created',
worker: 'Worker'
} }
}, },
components: { components: {

6
src/i18n/es/index.js
View File

@ -54,6 +54,12 @@ export default {
list: 'Listado', list: 'Listado',
createTicket: 'Crear ticket', createTicket: 'Crear ticket',
basicData: 'Datos básicos' basicData: 'Datos básicos'
},
boxing: {
expedition: 'Expedición',
item: 'Artículo',
created: 'Creado',
worker: 'Trabajador'
} }
}, },
components: { components: {

97
src/pages/Ticket/Card/TicketBoxing.vue
View File

@ -3,6 +3,7 @@ import { useI18n } from 'vue-i18n';
import { computed, ref, onMounted } from 'vue'; import { computed, ref, onMounted } from 'vue';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import axios from 'axios'; import axios from 'axios';
import { date } from 'quasar';
const router = useRouter(); const router = useRouter();
const { t } = useI18n(); const { t } = useI18n();
@ -17,48 +18,92 @@ const entityId = computed(function () {
const expeditions = ref({}); const expeditions = ref({});
const url = ref({}); const url = ref({});
//const video = ref({});
async function fetch() { async function fetch() {
const filter = { const filter = {
where: { where: {
ticketFk: entityId.value ticketFk: entityId.value,
} },
} };
const { data } = await axios.get(`/api/Expeditions/filter`, { const { data } = await axios.get(`/api/Expeditions/filter`, {
params: { filter } params: { filter },
}); });
if (data) expeditions.value = data; if (data) expeditions.value = data;
console.log(expeditions.value) console.log(expeditions.value);
} }
async function selectVideo(expeditionId) { async function selectVideo(expeditionId) {
url.value = `http://localhost:8080/api/Boxings/getVideo?id=${expeditionId}` url.value = `${window.location.origin}/api/Boxings/getVideo?id=${expeditionId}`;
} }
/*async function getVideo(expeditionId) {
const { data } = await axios.get(`/api/Boxings/getVideo?id=${expeditionId}`);
const myUrl = window.URL.createObjectURL(new Blob([data]));
console.log(myUrl);
if (data) url.value = data;
}*/
</script> </script>
<template> <template>
<q-page class="q-pa-md"> <q-layout view="hHh Lpr lff" container class="shadow-2 rounded-borders q-gutter-md">
<q-list> <q-drawer
<div v-for="expedition in expeditions" :key="expedition.id" @click="selectVideo(expedition.id)"> v-model="drawerLeft"
<q-item class="q-pa-none"> show-if-above
<q-item-section> :width="200"
<q-item-label caption>{{ t('ticket.boxing.expedition') }}</q-item-label> :breakpoint="700"
<q-item-label>{{ expedition.id }}</q-item-label> elevated
</q-item-section> class="bg-primary text-white"
</q-item> >
<q-item class="q-pa-none"> <q-scroll-area class="fit">
<q-item-section> <q-card class="q-pa-md col">
<q-item-label caption>{{ t('ticket.boxing.item') }}</q-item-label> <q-video :title="url" :src="url" v-if="Object.keys(url).length !== 0" :ratio="16 / 9" />
<q-item-label>{{ expedition.packagingItemFk }}</q-item-label> </q-card>
</q-item-section> </q-scroll-area>
</q-item> </q-drawer>
</div> </q-layout>
</q-list> </template>
{{ url }} <!--
<q-card class="q-pa-md" v-if="Object.keys(url).length !== 0"> <template>
<q-video :src="url" /> <q-page class="q-pa-md row q-gutter-md">
<q-card class="q-pa-md col-2">
<q-scroll-area class="fit">
<q-list class="q-pa-xs q-gutter-md">
<q-card
v-for="expedition in expeditions"
:key="expedition.id"
@click="selectVideo(expedition.id)"
clickable
v-ripple
>
<q-card-section>
<q-item class="q-pa-none">
<q-item-section>
<q-item-label class="text-h6">#{{ expedition.id }}</q-item-label>
</q-item-section>
</q-item>
<q-separator spaced color="orange" />
<q-item class="q-pa-none">
<q-item-section>
<q-item-label caption>{{ t('ticket.boxing.created') }}</q-item-label>
<q-item-label>
{{ date.formatDate(expedition.created, 'YYYY-MM-DD HH:mm:ss') }}</q-item-label
>
<q-item-label caption>{{ t('ticket.boxing.item') }}</q-item-label>
<q-item-label>{{ expedition.packagingItemFk }}</q-item-label>
<q-item-label caption>{{ t('ticket.boxing.worker') }}</q-item-label>
<q-item-label>{{ expedition.userName }}</q-item-label>
</q-item-section>
</q-item>
</q-card-section>
</q-card>
</q-list>
</q-scroll-area>
</q-card>
<q-card class="q-pa-md col">
<q-video :title="url" :src="url" v-if="Object.keys(url).length !== 0" :ratio="16 / 9" />
</q-card> </q-card>
</q-page> </q-page>
</template> </template>
-->