150 lines
4.8 KiB
Vue
150 lines
4.8 KiB
Vue
<script setup>
|
|
import Master from "../../../layouts/master.vue";
|
|
import { ref, onMounted } from 'vue';
|
|
import TableGeneric from "../../../components/TableGeneric.vue";
|
|
import { useConfirm } from 'primevue/useconfirm';
|
|
import { useToast } from 'primevue/usetoast';
|
|
import { useSessionStore } from "../../../store/Session.js";
|
|
|
|
const toast = useToast();
|
|
const confirm = useConfirm();
|
|
|
|
const props = defineProps({
|
|
sessions: {
|
|
type: Object,
|
|
default: () => ({ data: [], meta: {} })
|
|
}
|
|
});
|
|
|
|
const sessionStore = useSessionStore();
|
|
const selectedItems = ref([]);
|
|
|
|
const columns = ref(sessionStore.columns);
|
|
|
|
onMounted(() => {
|
|
sessionStore.setSessions(props.sessions || []);
|
|
});
|
|
|
|
const onSelectionChange = (selection) => {
|
|
selectedItems.value = selection;
|
|
sessionStore.setSelectedSessions(selection);
|
|
};
|
|
|
|
const showDeleteConfirm = (data) => {
|
|
confirm.require({
|
|
group: 'deleteTemplate',
|
|
header: 'مطمعن هستید؟',
|
|
message: 'اگر به عملیات اطمینان دارید، تأیید کنید.',
|
|
icon: 'fi fi-rr-info',
|
|
rejectProps: {
|
|
label: 'انصراف',
|
|
icon: 'fi fi-rr-ban',
|
|
outlined: true,
|
|
size: 'small',
|
|
class: '!text-xs !flex pt-1 !item-center',
|
|
iconClass: '!flex !text-xs',
|
|
},
|
|
acceptProps: {
|
|
label: 'حذف',
|
|
icon: 'fi fi-rr-check',
|
|
size: 'small',
|
|
class: '!text-xs !flex pt-1 !item-center',
|
|
iconClass: '!flex !text-xs',
|
|
},
|
|
accept: () => {
|
|
sessionStore.deleteSession(data.id)
|
|
.then((response) => {
|
|
toast.add({ severity: 'success', summary: response.data.message });
|
|
})
|
|
.catch((error) => {
|
|
toast.add({ severity: 'error', summary: error.response.data.message });
|
|
});
|
|
},
|
|
reject: () => {
|
|
|
|
}
|
|
});
|
|
};
|
|
|
|
const confirmDeleteSelected = (ids) => {
|
|
confirm.require({
|
|
group: 'deleteTemplate',
|
|
header: 'مطمعن هستید؟',
|
|
message: 'اگر به عملیات اطمینان دارید، تأیید کنید.',
|
|
icon: 'fi fi-rr-info',
|
|
rejectProps: {
|
|
label: 'انصراف',
|
|
icon: 'fi fi-rr-ban',
|
|
outlined: true,
|
|
size: 'small',
|
|
class: '!text-xs !flex pt-1 !item-center',
|
|
iconClass: '!flex !text-xs',
|
|
},
|
|
acceptProps: {
|
|
label: 'حذف',
|
|
icon: 'fi fi-rr-check',
|
|
size: 'small',
|
|
class: '!text-xs !flex pt-1 !item-center',
|
|
iconClass: '!flex !text-xs',
|
|
},
|
|
accept: () => {
|
|
sessionStore.bulkDeleteSessions(ids);
|
|
},
|
|
reject: () => {
|
|
|
|
}
|
|
});
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<master>
|
|
<div class="mb-4 grid grid-cols-2a justify-between items-center bg-white border-[1px] border-client-gray/20 py-4 px-4 rounded-2xl">
|
|
<h2 class="font-bold text-client-Fontcolor">{{ sessionStore.indexPageTitle }}</h2>
|
|
</div>
|
|
<div class="card border-[1px] border-client-gray/20 bg-white rounded-2xl">
|
|
<TableGeneric
|
|
:data="sessionStore.sessions"
|
|
:columns="columns"
|
|
:selectable="true"
|
|
:pagination="false"
|
|
:searchable="true"
|
|
v-model="selectedItems"
|
|
@selection-change="onSelectionChange"
|
|
>
|
|
<template #bulk-action="{ selection }">
|
|
<Button
|
|
label="حذف همه نشست ها"
|
|
size="small"
|
|
:pt="{icon : 'flex'}"
|
|
icon="fi fi-rr-trash"
|
|
severity="danger"
|
|
class="!text-xs !flex"
|
|
outlined
|
|
:loading="sessionStore.bulkLoader"
|
|
@click="() => confirmDeleteSelected(selection.map(item => item.id))"
|
|
/>
|
|
</template>
|
|
|
|
<template #column-actions="{ data }">
|
|
<div class="grid grid-cols-1a">
|
|
<Button
|
|
type="button"
|
|
class="!w-8 !h-8"
|
|
variant="outlined"
|
|
severity="danger"
|
|
icon="fi fi-rr-trash"
|
|
:pt="{icon : '!mt-2 !text-xs'}"
|
|
:loading="sessionStore.loader"
|
|
@click="showDeleteConfirm(data)"
|
|
/>
|
|
</div>
|
|
</template>
|
|
</TableGeneric>
|
|
</div>
|
|
</master>
|
|
</template>
|
|
|
|
<style scoped>
|
|
</style>
|