Update DatePicker and DGangguan_DKPL components

src/components/DatePicker.vue

@@ -15,14 +15,56 @@ const emit = defineEmits(['update:dateValue'])
 const customShortcuts = () => {
   return [
     {
-      label: 'Last 15 Days',
+      label: 'Hari Ini',
+      atClick: () => {
+        const date = new Date()
+        return [new Date(date.setHours(0, 0, 0, 0)), new Date()]
+      }
+    },
+    {
+      label: 'Kemarin',
+      atClick: () => {
+        const date = new Date()
+        return [new Date(date.setDate(date.getDate() - 1)), new Date(date.setHours(0, 0, 0, 0))]
+      }
+    },
+    {
+      label: '7 Hari Terakhir',
+      atClick: () => {
+        const date = new Date()
+        return [new Date(date.setDate(date.getDate() - 7)), new Date()]
+      }
+    },
+    {
+      label: '15 Hari Terakhir',
       atClick: () => {
         const date = new Date()
         return [new Date(date.setDate(date.getDate() - 15)), new Date()]
       }
     },
     {
-      label: 'Last Years',
+      label: '30 Hari Terakhir',
+      atClick: () => {
+        const date = new Date()
+        return [new Date(date.setDate(date.getDate() - 30)), new Date()]
+      }
+    },
+    {
+      label: '3 Bulan Terakhir',
+      atClick: () => {
+        const date = new Date()
+        return [new Date(date.setMonth(date.getMonth() - 3)), new Date()]
+      }
+    },
+    {
+      label: '6 Bulan Terakhir',
+      atClick: () => {
+        const date = new Date()
+        return [new Date(date.setMonth(date.getMonth() - 6)), new Date()]
+      }
+    },
+    {
+      label: '1 Tahun Terakhir',
       atClick: () => {
         const date = new Date()
         return [new Date(date.setFullYear(date.getFullYear() - 1)), new Date()]

src/components/Pages/Gangguan/Daftar/DGangguan_DKPL.vue

@@ -122,7 +122,7 @@
       />
       <DxColumn
         css-class="custom-table-column"
-        :width="170"
+        :width="250"
         alignment="center"
         data-field="nama_posko_lama"
         caption="Posko Asal"
@@ -130,7 +130,7 @@
       />
       <DxColumn
         css-class="custom-table-column"
-        :width="170"
+        :width="250"
         alignment="center"
         data-field="nama_posko_baru"
         caption="Posko Tujuan"
@@ -138,7 +138,7 @@
       />
       <DxColumn
         css-class="custom-table-column"
-        :width="150"
+        :width="250"
         alignment="center"
         data-field="status_akhir"
         caption="Status"
@@ -154,7 +154,7 @@
       />
       <DxColumn
         css-class="custom-table-column"
-        :width="150"
+        :width="250"
         alignment="center"
         data-field="nama_pelapor"
         caption="Nama Pelapor"
@@ -162,7 +162,7 @@
       />
       <DxColumn
         css-class="custom-table-column"
-        :width="170"
+        :width="250"
         alignment="center"
         data-field="alamat_pelapor"
         caption="Alamat Pelapor"
@@ -174,7 +174,7 @@
         alignment="center"
         data-field="no_telp_pelapor"
         caption="No Telp Pelapor"
-        cell-template="cellCenter"
+        cell-template="formatText"
       />
       <DxColumn
         css-class="custom-table-column"
@@ -194,7 +194,7 @@
       />
       <DxColumn
         css-class="custom-table-column"
-        :width="170"
+        :width="250"
         alignment="center"
         data-field="nama_posko_lama"
         caption="Posko"