salix-front/src/pages/Ticket/Negative/TicketLackDialogProxy.vue

66 lines
1.8 KiB
Vue

<script setup>
import { toRefs, ref } from 'vue';
import TicketLackDetail from './TicketLackDetail.vue';
import { useSession } from 'src/composables/useSession';
import { useI18n } from 'vue-i18n';
const { t } = useI18n();
const $props = defineProps({
ticket: {
type: Object,
required: false,
default: () => {},
},
id: {
type: Number,
default: 0,
},
});
const { ticket } = toRefs($props);
const session = useSession();
const token = session.getTokenMultimedia();
const ticketRef = ref(null);
const hasRowsSelected = ref(false);
async function splitSelected() {
ticketRef.value.split({ all: true });
}
</script>
<template>
<QCard class="q-pa-sm">
<QCardSection class="row items-center q-pb-none">
<QImg
:src="`/api/Images/catalog/50x50/${ticket.itemFk}/download?access_token=${token}`"
spinner-color="primary"
:ratio="1"
height="50px"
width="50px"
class="image remove-bg"
/>
<span class="text-h6 text-grey">{{ ticket.longName }}</span>
<QSpace />
<QBtn
round
color="primary"
@click="splitSelected()"
:disabled="!hasRowsSelected"
>
<QIcon name="call_split"></QIcon>
<QTooltip>
{{ t('global.split') }}
</QTooltip>
</QBtn>
<QBtn icon="close" flat round dense v-close-popup />
</QCardSection>
<QCardSection class="row items-center">
<TicketLackDetail
ref="ticketRef"
:id="ticket.itemFk"
@selection="(rows) => (hasRowsSelected = rows.length > 0)"
/> </QCardSection
></QCard>
</template>
<i18n> </i18n>