57 lines
1.9 KiB
Vue
57 lines
1.9 KiB
Vue
<script setup>
|
|
import { ref } from 'vue';
|
|
import ClientLayout from '../../../layouts/ClientLayout.vue';
|
|
import TableGeneric from '../../../components/ui/TableGeneric.vue';
|
|
import UiCard from '../../../components/ui/UiCard.vue';
|
|
import UiButton from '../../../components/ui/UiButton.vue';
|
|
import InvoiceModal from '../../../components/dashboard/fastRequest/InvoiceModal.vue';
|
|
import { invoiceColumns } from '../../../data/invoicesTableColumns';
|
|
|
|
defineProps({
|
|
invoices: {
|
|
type: Object,
|
|
required: true
|
|
}
|
|
});
|
|
|
|
const selectedInvoice = ref(null);
|
|
const invoiceModalVisible = ref(false);
|
|
|
|
const openInvoice = (invoice) => {
|
|
selectedInvoice.value = invoice;
|
|
invoiceModalVisible.value = true;
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<ClientLayout>
|
|
<UiCard title="لیست فاکتورها" variant="default">
|
|
<TableGeneric
|
|
class="bg-white !rounded-2xl"
|
|
:data="invoices.data"
|
|
customStyle="!text-[11px] !font-normal"
|
|
:searchable="false"
|
|
:columns="invoiceColumns"
|
|
:selectable="false"
|
|
:pagination="invoices.meta"
|
|
:model-value="[]"
|
|
>
|
|
<template #column-actions="{ data }">
|
|
<div class="flex items-center justify-end">
|
|
<UiButton
|
|
v-if="data.status === 'در انتظار پرداخت'"
|
|
label="پرداخت"
|
|
icon="fi fi-rr-credit-card"
|
|
severity="success"
|
|
size="small"
|
|
@click="openInvoice(data)"
|
|
/>
|
|
</div>
|
|
</template>
|
|
</TableGeneric>
|
|
</UiCard>
|
|
|
|
<InvoiceModal v-model:visible="invoiceModalVisible" :invoice="selectedInvoice" />
|
|
</ClientLayout>
|
|
</template>
|