diff --git a/src/views/Chalani/Chalani.vue b/src/views/Chalani/Chalani.vue
index ff9ded9..d317529 100644
--- a/src/views/Chalani/Chalani.vue
+++ b/src/views/Chalani/Chalani.vue
@@ -2,7 +2,7 @@
     <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" />
+                <DateRange id="date-range" v-model="dateRange" :searchOnLoad="true" />
             </div>
             <Tabulator
                 :columns="headerDetails"
@@ -45,20 +45,12 @@ const layout = ref({
     ],
 });
 
-// const timeFormatter = (cell: any) => {
-//     const timeStr = cell.getValue();
-//     if (timeStr) {
-//         const [hours, minutes] = timeStr.split(":").map(Number);
-//         const date = new Date(0, 0, 0, hours, minutes);
-//         return date.toLocaleTimeString([], {
-//             hour: "numeric",
-//             minute: "2-digit",
-//             hour12: true,
-//         });
-//     } else {
-//         return cell.getValue();
-//     }
-// };
+const dateRange = ref({
+    startDate: "",
+    endDate: "",
+    dateType: "today",
+    isBS: true,
+});
 
 const selectedDate = ref(BStoAD(new NepaliDate().format("YYYY-MM-DD")));
 
diff --git a/src/views/Darta/Darta.vue b/src/views/Darta/Darta.vue
index 5eeb9fc..ef69255 100644
--- a/src/views/Darta/Darta.vue
+++ b/src/views/Darta/Darta.vue
@@ -2,7 +2,7 @@
     <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" />
+                <DateRange id="date-range" v-model="dateRange" :searchOnLoad="true" />
             </div>
             <Tabulator
                 :columns="headerDetails"
@@ -45,20 +45,12 @@ const layout = ref({
     ],
 });
 
-// const timeFormatter = (cell: any) => {
-//     const timeStr = cell.getValue();
-//     if (timeStr) {
-//         const [hours, minutes] = timeStr.split(":").map(Number);
-//         const date = new Date(0, 0, 0, hours, minutes);
-//         return date.toLocaleTimeString([], {
-//             hour: "numeric",
-//             minute: "2-digit",
-//             hour12: true,
-//         });
-//     } else {
-//         return cell.getValue();
-//     }
-// };
+const dateRange = ref({
+    startDate: "",
+    endDate: "",
+    dateType: "today",
+    isBS: true,
+});
 
 const selectedDate = ref(BStoAD(new NepaliDate().format("YYYY-MM-DD")));