dartachalani-frontend/src/views/Darta/Darta.vue
2025-12-10 17:13:11 +05:45

51 lines
1.7 KiB
Vue

<template>
<ContentLayout :title="layout.title" :actions="layout.action" @onCreate="onCreate">
<template #body>
<div class="content-search">
<DateSelector id="report-date" v-model="selectedDate" :classValue="`w-full`" :isBS="true" />
</div>
<Tabulator
:columns="headerDetails"
:data="itemList"
:heightOffset="250"
:action="true"
placeholder="No Darta Found"
/>
</template>
</ContentLayout>
<Create />
</template>
<script setup lang="ts">
import { ref } from "vue";
import { BStoAD, NepaliDate } from "nepali-date-library";
import { storeToRefs } from "pinia";
import Create from "@/views/Darta/Create.vue";
import { createGenericStore } from "@/stores/GenericStore";
import { createOverlayStore } from "@/stores/OverlayStore";
const DartaStore = createGenericStore("darta")();
const DartaTowserStore = createOverlayStore("darta-towser")();
const { itemList } = storeToRefs(DartaStore);
const layout = ref({
title: [{ name: "Darta" }],
action: [{ title: "Create", emit: "onCreate" }]
});
const selectedDate = ref(BStoAD(new NepaliDate().format("YYYY-MM-DD")));
const headerDetails = [
{ field: "document_no", title: "Document Number", headerFilter: true, headerFilterPlaceholder: "Search" },
{ field: "sender_name", title: "Sender", headerFilter: true, headerFilterPlaceholder: "Search" },
{ field: "receiver_name", title: "Receiver", headerFilter: true, headerFilterPlaceholder: "Search" },
{ field: "received_date", title: "Received Date" },
{ field: "is_active", title: "Status", width: "250" },
];
const onCreate = () => {
DartaTowserStore.open();
};
</script>