defuj/apkt-eis
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Refactor filter components in Keluhan tables

Browse Source
This commit is contained in:
Dede Fuji Abdul 2024-02-27 17:11:54 +07:00
parent 9f195ac9d1
commit 80ad372c0f
15 changed files with 64 additions and 105 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/Pages/Keluhan/Table_21.vue
View File

@ -1,9 +1,6 @@
<template>
<Filters @run-search="() => filterData(filters)" class="mb-4">
<Type3 @update:filters="(value) => {
filters = value
}
" />
<Type3 @update:filters="(value) => filters = value" />
</Filters>
<div id="data">
<DxDataGrid class="max-h-[calc(100vh-140px)]" :data-source="data" :show-column-lines="true" :show-row-lines="false"

5
src/components/Pages/Keluhan/Table_22.vue
View File

@ -1,9 +1,6 @@
<template>
<Filters @run-search="() => filterData(filters)" class="mb-4">
<Type10 @update:filters="(value) => {
filters = value
}
" />
<Type10 @update:filters="(value) => filters = value" />
</Filters>
<div id="data">
<DxDataGrid class="max-h-[calc(100vh-140px)]" :data-source="data" :show-column-lines="true" :show-row-lines="false"

5
src/components/Pages/Keluhan/Table_23.vue
View File

@ -1,9 +1,6 @@
<template>
<Filters @run-search="() => filterData(filters)" class="mb-4">
<Type11 @update:filters="(value) => {
filters = value
}
" />
<Type11 @update:filters="(value) => filters = value" />
</Filters>
<div id="data">
<DxDataGrid class="max-h-[calc(100vh-140px)]" :data-source="data" :show-column-lines="true" :show-row-lines="false"

5
src/components/Pages/Keluhan/Table_24.vue
View File

@ -1,9 +1,6 @@
<template>
<Filters @run-search="() => filterData(filters)" class="mb-4">
<Type11 @update:filters="(value) => {
filters = value
}
" />
<Type11 @update:filters="(value) => filters = value" />
</Filters>
<div id="data">
<DxDataGrid class="max-h-[calc(100vh-140px)]" :data-source="data" :show-column-lines="true" :show-row-lines="false"

5
src/components/Pages/Keluhan/Table_25.vue
View File

@ -1,9 +1,6 @@
<template>
<Filters @run-search="() => filterData(filters)" class="mb-4">
<Type3 @update:filters="(value) => {
filters = value
}
" />
<Type3 @update:filters="(value) => filters = value" />
</Filters>
<div id="data">
<DxDataGrid class="max-h-[calc(100vh-140px)]" :data-source="data" :show-column-lines="true" :show-row-lines="false"

5
src/components/Pages/Keluhan/Table_26.vue
View File

@ -1,9 +1,6 @@
<template>
<Filters @run-search="() => filterData(filters)" class="mb-4">
<Type3 @update:filters="(value) => {
filters = value
}
" />
<Type3 @update:filters="(value) => filters = value" />
</Filters>
<div id="data">
<DxDataGrid class="max-h-[calc(100vh-140px)]" :data-source="data" :show-column-lines="true" :show-row-lines="false"

9
src/components/Pages/Keluhan/Table_27.vue
View File

@ -1,9 +1,6 @@
<template>
<Filters @run-search="() => filterData(filters)" class="mb-4">
<Type3 @update:filters="(value) => {
filters = value
}
" />
<Type3 @update:filters="(value) => filters = value" />
</Filters>
<div id="data">
<DxDataGrid class="max-h-[calc(100vh-140px)]" :data-source="data" :show-column-lines="true" :show-row-lines="false"
@ -12,8 +9,8 @@
:allow-column-resizing="true" column-resizing-mode="widget" :word-wrap-enabled="true">
<DxSelection mode="single" />
<DxPaging :page-size="5" :enabled="true" />
<DxPager :visible="true" :allowed-page-sizes="[5, 10, 20]" display-mode="full"
:show-page-size-selector="true" :show-info="true" :show-navigation-buttons="true" />
<DxPager :visible="true" :allowed-page-sizes="[5, 10, 20]" display-mode="full" :show-page-size-selector="true"
:show-info="true" :show-navigation-buttons="true" />
<DxLoadPanel :position="position" :show-indicator="showIndicator" :show-pane="showPane" :shading="shading"
v-if="loading" v-model:visible="loading" :enabled="true" />
<DxSearchPanel :visible="true" :highlight-case-sensitive="true" />

26
src/components/Pages/Keluhan/Table_28.vue
View File

@ -1,9 +1,6 @@
<template>
<Filters @run-search="() => filterData(filters)" class="mb-4">
<Type3 @update:filters="(value) => {
filters = value
}
" />
<Filters @run-search="() => filterData(filters)" class="mb-4">
<Type3 @update:filters="(value) => filters = value" />
</Filters>
<div>
<DxDataGrid class="max-h-[calc(100vh-140px)]" :data-source="data" :show-column-lines="true" :show-row-lines="false"
@ -37,10 +34,10 @@
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="min_durasi_response" data-type="number" caption="Min"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="total_diatas_sla_response" data-type="number" caption="> SLA"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="total_dibawah_sla_response" data-type="number" caption="≤ SLA"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="total_diatas_sla_response" data-type="number"
caption="> SLA" css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="total_dibawah_sla_response" data-type="number"
caption="≤ SLA" css-class="custom-table-column" />
</DxColumn>
<DxColumn alignment="center" caption="Penyelesaian" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="avg_durasi_recovery" data-type="number" caption="Rata-Rata"
@ -164,14 +161,14 @@ query rekapitulasiKeluhanAll
}
}`
const { onResult, onError,loading,refetch } = useQuery(GET_DATA, {
const { onResult, onError, loading, refetch } = useQuery(GET_DATA, {
dateFrom: new Date('2023-10-01').toISOString().slice(0, 10),
dateTo: new Date('2023-10-01').toISOString().slice(0, 10),
idUlp: 0,
idUid: 0,
idUp3: 0
})
const filters = ref();
})
const filters = ref();
const filterData = (params: any) => {
const dateValue = params.periode.split(' s/d ')
@ -180,8 +177,9 @@ const filterData = (params: any) => {
dateFrom: dateValue[0] ? dateValue[0].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10),
dateTo: dateValue[1] ? dateValue[1].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10),
idUlp: idUlp ? idUlp.id : 0,
idUid: uid ? uid.id :0,
idUp3: up3? up3.id:0})
idUid: uid ? uid.id : 0,
idUp3: up3 ? up3.id : 0
})
onResult((queryResult) => {
if (queryResult.data != undefined) {

10
src/components/Pages/Keluhan/Table_29.vue
View File

@ -1,9 +1,6 @@
<template>
<Filters @run-search="() => filterData(filters)" class="mb-4">
<Type13 @update:filters="(value) => {
filters = value
}
" />
<Type13 @update:filters="(value) => filters = value" />
</Filters>
<div id="data">
<DxDataGrid class="max-h-[calc(100vh-140px)]" :data-source="data" :show-column-lines="true" :show-row-lines="false"
@ -195,8 +192,9 @@ const filterData = (params: any) => {
dateFrom: dateValue[0] ? dateValue[0].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10),
dateTo: dateValue[1] ? dateValue[1].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10),
idUlp: idUlp ? idUlp.id : 0,
idUid: uid ? uid.id :0,
idUp3: up3? up3.id:0})
idUid: uid ? uid.id : 0,
idUp3: up3 ? up3.id : 0
})
onResult((queryResult) => {

12
src/components/Pages/Keluhan/Table_30.vue
View File

@ -1,9 +1,6 @@
<template>
<Filters @run-search="() => filterData(filters)" class="mb-4">
<Type3 @update:filters="(value) => {
filters = value
}
" />
<Type3 @update:filters="(value) => filters = value" />
</Filters>
<div id="data">
<DxDataGrid class="max-h-[calc(100vh-140px)]" :data-source="data" :show-column-lines="true" :show-row-lines="false"
@ -173,7 +170,7 @@ query rekapitulasiKeluhanPerJenisKeluhan
total_selesai
}
}`;
const { onResult, onError, loading,refetch } = useQuery(GET_DATA, {
const { onResult, onError, loading, refetch } = useQuery(GET_DATA, {
dateFrom: new Date("2023-10-01").toISOString().slice(0, 10),
dateTo: new Date("2023-10-01").toISOString().slice(0, 10),
idUlp: 0,
@ -189,8 +186,9 @@ const filterData = (params: any) => {
dateFrom: dateValue[0] ? dateValue[0].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10),
dateTo: dateValue[1] ? dateValue[1].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10),
idUlp: idUlp ? idUlp.id : 0,
idUid: uid ? uid.id :0,
idUp3: up3? up3.id:0})
idUid: uid ? uid.id : 0,
idUp3: up3 ? up3.id : 0
})
onResult(queryResult => {

12
src/components/Pages/Keluhan/Table_31.vue
View File

@ -1,9 +1,6 @@
<template>
<Filters @run-search="() => filterData(filters)" class="mb-4">
<Type13 @update:filters="(value) => {
filters = value
}
" />
<Type13 @update:filters="(value) => filters = value" />
</Filters>
<div id="data">
<DxDataGrid class="max-h-[calc(100vh-140px)]" :data-source="data" :show-column-lines="true" :show-row-lines="false"
@ -173,7 +170,7 @@ query rekapitulasiKeluhanPerKelompokKeluhan
total_selesai
}
}`;
const { onResult, onError ,loading,refetch} = useQuery(GET_DATA, {
const { onResult, onError, loading, refetch } = useQuery(GET_DATA, {
dateFrom: new Date("2023-10-01").toISOString().slice(0, 10),
dateTo: new Date("2023-10-01").toISOString().slice(0, 10),
idUlp: 0,
@ -189,8 +186,9 @@ const filterData = (params: any) => {
dateFrom: dateValue[0] ? dateValue[0].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10),
dateTo: dateValue[1] ? dateValue[1].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10),
idUlp: idUlp ? idUlp.id : 0,
idUid: uid ? uid.id :0,
idUp3: up3? up3.id:0})
idUid: uid ? uid.id : 0,
idUp3: up3 ? up3.id : 0
})
onResult(queryResult => {

5
src/components/Pages/Keluhan/Table_32.vue
View File

@ -1,9 +1,6 @@
<template>
<Filters @run-search="() => filterData(filters)" class="mb-4">
<Type13 @update:filters="(value) => {
filters = value
}
" />
<Type13 @update:filters="(value) => filters = value" />
</Filters>
<div>
<DxDataGrid class="max-h-[calc(100vh-140px)]" :show-column-lines="true" :show-row-lines="false" :show-borders="true"

5
src/components/Pages/Keluhan/Table_33.vue
View File

@ -1,9 +1,6 @@
<template>
<Filters @run-search="() => filterData(filters)" class="mb-4">
<Type8 @update:filters="(value) => {
filters = value
}
" />
<Type8 @update:filters="(value) => filters = value" />
</Filters>
<div>
<DxDataGrid class="max-h-[calc(100vh-140px)]" :data-source="data" :show-column-lines="true" :show-row-lines="false"

5
src/components/Pages/Keluhan/Table_34.vue
View File

@ -1,9 +1,6 @@
<template>
<Filters @run-search="() => filterData(filters)" class="mb-4">
<Type3 @update:filters="(value) => {
filters = value
}
" />
<Type3 @update:filters="(value) => filters = value" />
</Filters>
<div>
<DxDataGrid class="max-h-[calc(100vh-140px)]" :data-source="data" :show-column-lines="true" :show-row-lines="false"

5
src/components/Pages/Keluhan/Table_35.vue
View File

@ -1,9 +1,6 @@
<template>
<Filters @run-search="() => filterData(filters)" class="mb-4">
<Type8 @update:filters="(value) => {
filters = value
}
" />
<Type8 @update:filters="(value) => filters = value" />
</Filters>
<div id="data">
<DxDataGrid class="max-h-[calc(100vh-140px)]" :data-source="data" :show-column-lines="true" :show-row-lines="false"