refs #6321 updates

src/pages/Ticket/Negative/TicketLackDialog.vue

@@ -318,8 +318,22 @@ const columns = computed(() => [
     },
 ]);
 
-defineEmits([...useDialogPluginComponent.emits]);
+const emit = defineEmits([...useDialogPluginComponent.emits, 'selection']);
+function rowsHasSelected({ keys }) {
+    emit('selection', keys);
+}
+const split = async (options) => {
+    let body = [];
+    // if (options.simple) {
+    body = selectedRows.value;
+    // }
+    // if (options.all) {
+    // body = $props.rows;
+    // }
 
+    await axios.post(`Tickets/split`, body);
+};
+defineExpose({ split });
 // const { dialogRef, onDialogHide } = useDialogPluginComponent();
 
 // async function changeState(value) {
@@ -354,6 +368,7 @@ defineEmits([...useDialogPluginComponent.emits]);
                 row-key="ticketFk"
                 selection="multiple"
                 v-model:selected="selectedRows"
+                @selection="rowsHasSelected"
                 :grid="$q.screen.lt.md"
                 hide-bottom
             >
@@ -364,7 +379,12 @@ defineEmits([...useDialogPluginComponent.emits]);
                         </QTd>
                         <QTd v-for="col in props.cols" :key="col.name">
                             <template v-if="col.name == 'actions'">
-                                <QBtn icon="close" flat round dense v-close-popup />
+                                <QBtn round v-close-popup color="primary">
+                                    <QIcon name="call_split"></QIcon>
+                                    <QTooltip>
+                                        {{ t('components.leftMenu.removeFromPinned') }}
+                                    </QTooltip>
+                                </QBtn>
                             </template>
                             <template
                                 v-if="

src/pages/Ticket/Negative/TicketLackDialogProxy.vue

@@ -1,13 +1,73 @@
 <script setup>
+import { toRefs, ref } from 'vue';
 import TicketLackDialog from './TicketLackDialog.vue';
+import { useSession } from 'src/composables/useSession';
+import { useVnConfirm } from 'composables/useVnConfirm';
+import { useI18n } from 'vue-i18n';
 
+const { t } = useI18n();
 const $props = defineProps({
-    id: {
-        type: Number,
+    ticket: {
+        type: Object,
         required: true,
     },
+    id: {
+        type: Number,
+        default: 0,
+    },
 });
+const { ticket } = toRefs($props);
+const session = useSession();
+
+const token = session.getTokenMultimedia();
+const { openConfirmationModal } = useVnConfirm();
+const ticketRef = ref(null);
+const hasRowsSelected = ref(false);
+async function splitAll() {
+    ticketRef.value.split({ all: true });
+    // openConfirmationModal(
+    //     t('Confirm splitAll'),
+    //     t('Are you sure you want to split all tickets?'),
+    //     null,
+    //     () =>
+    // );
+}
 </script>
 <template>
-    <TicketLackDialog v-if="$props.id" :id="$props.id" />
+    <QDialog ref="dialogRef" full-width>
+        <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"
+                />
+
+                <span class="text-h6 text-grey">{{ ticket.longName }}</span>
+                <QSpace />
+                <QBtn
+                    round
+                    v-close-popup
+                    color="primary"
+                    @click="splitAll()"
+                    :disabled="!hasRowsSelected"
+                >
+                    <QIcon name="call_split"></QIcon>
+                    <QTooltip>
+                        {{ t('components.leftMenu.removeFromPinned') }}
+                    </QTooltip>
+                </QBtn>
+                <QBtn icon="close" flat round dense v-close-popup />
+            </QCardSection>
+            <QCardSection class="row items-center">
+                {{ hasRowsSelected }}
+                <TicketLackDialog
+                    ref="ticketRef"
+                    :id="ticket.itemFk"
+                    @selection="(rows) => (hasRowsSelected = rows.length > 0)"
+                /> </QCardSection></QCard
+    ></QDialog>
 </template>

src/pages/Ticket/Negative/TicketLackList.vue

@@ -3,7 +3,6 @@ import { computed, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useStateStore } from 'stores/useStateStore';
 import VnPaginate from 'components/ui/VnPaginate.vue';
-import { useSession } from 'src/composables/useSession';
 import TicketLackFilter from 'pages/Ticket/Negative/TicketLackFilter.vue';
 import TicketLackDialogProxy from 'src/pages/Ticket/Negative/TicketLackDialogProxy.vue';
 import NegativeOriginDialog from 'pages/Ticket/Negative/NegativeOriginDialog.vue';
@@ -13,10 +12,6 @@ import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
 import axios from 'axios';
 import { useDialogPluginComponent } from 'quasar';
 
-const session = useSession();
-
-const token = session.getTokenMultimedia();
-
 const stateStore = useStateStore();
 const { t } = useI18n();
 const selectedRows = ref([]);
@@ -268,29 +263,12 @@ const updateNegativeOrigin = async () => {
                 </template>
             </VnPaginate>
         </div>
-        <QDialog ref="dialogRef" v-model="showTicketDialog">
-            <QCard class="q-pa-sm">
-                <QCardSection class="row items-center q-pb-none">
-                    <QImg
-                        :src="`/api/Images/catalog/50x50/${currentRow.itemFk}/download?access_token=${token}`"
-                        spinner-color="primary"
-                        :ratio="1"
-                        height="50px"
-                        width="50px"
-                        class="image"
-                    />
 
-                    <span class="text-h6 text-grey">{{ currentRow.longName }}</span>
-                    <QSpace />
-                    <QBtn icon="close" flat round dense v-close-popup />
-                </QCardSection>
-                <QCardSection class="row items-center">
-                    <TicketLackDialogProxy
-                        :id="currentRow.itemFk"
-                    ></TicketLackDialogProxy>
-                </QCardSection>
-            </QCard>
-        </QDialog>
+        <TicketLackDialogProxy
+            ref="dialogRef"
+            v-model="showTicketDialog"
+            :ticket="currentRow"
+        ></TicketLackDialogProxy>
         <TotalNegativeOriginDialog
             ref="totalNegativeDialogRef"
             v-model="showTotalNegativeOriginDialog"