Update package.json and component files

package.json

@@ -3,7 +3,8 @@
   "version": "0.0.1",
   "private": true,
   "scripts": {
-    "dev": "vite --host",
+    "dev": "vite",
+    "host": "vite --host",
     "tailwind": "tailwindcss -i ./src/assets/css/tailwind.css -o ./src/assets/css/style.css --watch",
     "build": "run-p type-check build-only",
     "preview": "vite preview --host",

src/components/Form/FiltersType/Type7.vue

@@ -6,9 +6,9 @@ interface SlaOption {
   max: string
 }
 
-import Select from '@/components/Select.vue';
+import Select from '@/components/Select.vue'
-import DatePicker from '@/components/DatePicker.vue';
+import DatePicker from '@/components/DatePicker.vue'
-import InputWithSuffix from '../InputWithSuffix.vue';
+import InputWithSuffix from '../InputWithSuffix.vue'
 import {
   selectedUid,
   selectedUp3Posko,
@@ -17,8 +17,8 @@ import {
   itemsUid,
   itemsUp3,
   itemsPosko
-} from './reference';
+} from './reference'
-import { onMounted, ref, watch } from 'vue';
+import { onMounted, ref, watch } from 'vue'
 
 const props = defineProps({
   slaOptions: {
@@ -27,7 +27,7 @@ const props = defineProps({
       {
         id: 1,
         name: 'Dibawah  / Sesuai SLA (<= 45 menit)',
-        min: '1',
+        min: '0',
         max: '45'
       },
       {
@@ -143,14 +143,23 @@ onMounted(() => {
     <div class="flex flex-col flex-1 space-y-2">
       <label class="filter-input-label">Unit Pelaksanaan Pelayanan Pelanggan:</label>
 
-      <Select @update:selected="setUp3($event)" :data="itemsUp3" :selected="up3" :placeholder="up3Placeholder" />
+      <Select
+        @update:selected="setUp3($event)"
+        :data="itemsUp3"
+        :selected="up3"
+        :placeholder="up3Placeholder"
+      />
     </div>
 
     <div class="flex flex-col flex-1 space-y-2">
       <label class="filter-input-label">Posko:</label>
 
-      <Select @update:selected="setPosko($event)" :data="itemsPosko" :selected="posko"
+      <Select
-        :placeholder="poskoPlaceholder" />
+        @update:selected="setPosko($event)"
+        :data="itemsPosko"
+        :selected="posko"
+        :placeholder="poskoPlaceholder"
+      />
     </div>
 
     <div class="flex flex-col flex-1 space-y-2">
@@ -166,12 +175,19 @@ onMounted(() => {
         <Select @update:selected="changeDuration($event)" :data="sla" placeholder="Durasi Menit" />
 
         <div class="flex flex-1 justify-between gap-x-1.5" :class="[isHidden ? 'hidden' : '']">
-          <InputWithSuffix :value="`${data.minTime} Menit`" @update:text="setMin($event)" class="flex flex-1" />
+          <InputWithSuffix
+            :value="`${data.minTime} Menit`"
+            @update:text="setMin($event)"
+            class="flex flex-1"
+          />
           <small class="flex items-center">s/d</small>
-          <InputWithSuffix :value="`${data.maxTime} Menit`" @update:text="setMax($event)" class="flex flex-1" />
+          <InputWithSuffix
+            :value="`${data.maxTime} Menit`"
+            @update:text="setMax($event)"
+            class="flex flex-1"
+          />
         </div>
       </div>
     </div>
   </div>
-
 </template>

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

@@ -6,7 +6,7 @@
         {
           id: 1,
           name: 'Dibawah  / Sesuai SLA (<= 3 Jam)',
-          min: '1',
+          min: '0',
           max: '180'
         },
         {

src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue

@@ -6,13 +6,13 @@
         {
           id: 1,
           name: 'Dibawah  / Sesuai SLA (<= 3 hari)',
-          min: '1',
+          min: '0',
-          max: '4381'
+          max: '4320'
         },
         {
           id: 2,
           name: 'Melebihi SLA (> 3 hari)',
-          min: '4382',
+          min: '4321',
           max: `${99999 * 60 * 24}`
         }
       ]"

src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue

@@ -6,13 +6,13 @@
         {
           id: 1,
           name: 'Dibawah  / Sesuai SLA (<= 1 hari)',
-          min: '1',
+          min: '0',
-          max: '1501'
+          max: '1440'
         },
         {
           id: 2,
           name: 'Melebihi SLA (> 1 hari)',
-          min: '1502',
+          min: '1441',
           max: `${99999 * 60 * 24}`
         }
       ]"

src/utils/api/api.graphql.ts

@@ -1558,6 +1558,9 @@ export const queries = {
             max_durasi_recovery
             total_dibawah_sla_recovery
             total_diatas_sla_recovery
+            count_durasi_dispatch
+            count_durasi_response
+            count_durasi_recovery
           }
         }
       `,