Refactor code for improved performance and readability

This commit is contained in:
Dede Fuji Abdul 2024-03-19 14:18:17 +07:00
parent 0593841b3d
commit 071ec7510d
71 changed files with 730 additions and 400 deletions

View File

@ -3,6 +3,7 @@
<h1 class="text-xl font-medium md:text-2xl text-dark">Laporan Pengaduan PLN Mobile</h1>
</div>
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -3,6 +3,7 @@
<h1 class="text-xl font-medium md:text-2xl text-dark">Laporan Pengaduan Total</h1>
</div>
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:show-column-lines="true"
:show-row-lines="false"

View File

@ -3,6 +3,7 @@
<h1 class="text-xl font-medium md:text-2xl text-dark">Laporan Pengaduan PLN Mobile</h1>
</div>
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -3,6 +3,7 @@
<h1 class="text-xl font-medium md:text-2xl text-dark">Laporan Pengaduan Total</h1>
</div>
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -1,55 +1,112 @@
<template>
<div class="mt-4 lg:mt-6 max-w-7xl">
<h1 class="text-xl font-medium md:text-2xl text-dark">
Laporan Pengaduan PLN Mobile
</h1>
<h1 class="text-xl font-medium md:text-2xl text-dark">Laporan Pengaduan PLN Mobile</h1>
</div>
<DxDataGrid class="max-h-[calc(100vh-140px)] mb-10" :show-column-lines="true" :show-row-lines="false"
:show-borders="true" :row-alternation-enabled="true" :hover-state-enabled="true"
@selection-changed="onSelectionChanged" @exporting="onExporting" :allow-column-resizing="true"
column-resizing-mode="widget" :word-wrap-enabled="true">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:show-column-lines="true"
:show-row-lines="false"
:show-borders="true"
:row-alternation-enabled="true"
:hover-state-enabled="true"
@selection-changed="onSelectionChanged"
@exporting="onExporting"
:allow-column-resizing="true"
column-resizing-mode="widget"
:word-wrap-enabled="true"
>
<DxSelection mode="single" />
<DxPaging :enabled="false" />
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
<DxLoadPanel :position="position" :show-indicator="showIndicator" :show-pane="showPane" :shading="shading"
v-if="loading" v-model:visible="loading" :enabled="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" />
<DxExport :enabled="true" :formats="['pdf', 'xlsx', 'document']" :allow-export-selected-data="false" />
<DxExport
:enabled="true"
:formats="['pdf', 'xlsx', 'document']"
:allow-export-selected-data="false"
/>
<DxColumnFixing :enabled="true" />
<DxColumn alignment="center" data-field="" caption="Nama Unit" css-class="custom-table-column" />
<DxColumn
alignment="center"
data-field=""
caption="Nama Unit"
css-class="custom-table-column"
/>
<DxColumn alignment="center" caption="Total WO PLN Mobile" css-class="custom-table-column">
<DxColumn :width="170" alignment="center" data-field="" data-type="number" caption="a"
css-class="custom-table-column" />
<DxColumn
:width="170"
alignment="center"
data-field=""
data-type="number"
caption="a"
css-class="custom-table-column"
/>
</DxColumn>
<DxColumn alignment="center" caption="Total Pengaduan Yang Diselesaikan Secara Anomali"
css-class="custom-table-column">
<DxColumn :width="170" alignment="center" data-field="" data-type="number" caption="b"
css-class="custom-table-column" />
<DxColumn
alignment="center"
caption="Total Pengaduan Yang Diselesaikan Secara Anomali"
css-class="custom-table-column"
>
<DxColumn
:width="170"
alignment="center"
data-field=""
data-type="number"
caption="b"
css-class="custom-table-column"
/>
</DxColumn>
<DxColumn alignment="center" caption="% Pengaduan Yang Diselesaikan Secara Anomali" css-class="custom-table-column">
<DxColumn :width="170" alignment="center" data-field="" data-type="number" caption="c=b/a"
css-class="custom-table-column" />
<DxColumn
alignment="center"
caption="% Pengaduan Yang Diselesaikan Secara Anomali"
css-class="custom-table-column"
>
<DxColumn
:width="170"
alignment="center"
data-field=""
data-type="number"
caption="c=b/a"
css-class="custom-table-column"
/>
</DxColumn>
</DxDataGrid>
</template>
<script setup lang="ts">
import { DxDataGrid } from 'devextreme-vue'
import { DxColumn, DxColumnFixing, DxExport, DxLoadPanel, DxPaging, DxScrolling, DxSearchPanel, DxSelection } from 'devextreme-vue/data-grid'
import {
DxColumn,
DxColumnFixing,
DxExport,
DxLoadPanel,
DxPaging,
DxScrolling,
DxSearchPanel,
DxSelection
} from 'devextreme-vue/data-grid'
import { jsPDF } from 'jspdf'
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
import { saveAs } from 'file-saver'
import { Workbook } from 'exceljs'
import { computed, ref } from 'vue'
const position = { of: '#data' };
const showIndicator = ref(true);
const shading = ref(true);
const showPane = ref(true);
const position = { of: '#data' }
const showIndicator = ref(true)
const shading = ref(true)
const showPane = ref(true)
const props = defineProps({
data: Array as () => any[],
data: Array as () => any[]
})
const data = computed(() => props.data)
const loading = ref(false)
@ -61,7 +118,7 @@ const onExporting = (e: any) => {
exportToPdf({
jsPDFDocument: doc,
component: e.component,
indent: 5,
indent: 5
}).then(() => {
doc.save(`.pdf`)
})
@ -72,7 +129,7 @@ const onExporting = (e: any) => {
exportToExcel({
component: e.component,
worksheet,
autoFilterEnabled: true,
autoFilterEnabled: true
}).then(() => {
workbook.xlsx.writeBuffer().then((buffer: any) => {
saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'DataGrid.xlsx')
@ -87,5 +144,4 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
const data = selectedRowsData[0]
console.log(data)
}
</script>
</script>

View File

@ -1,83 +1,190 @@
<template>
<div class="mt-4 lg:mt-6 max-w-7xl">
<h1 class="text-xl font-medium md:text-2xl text-dark">
Laporan Pengaduan Total
</h1>
<h1 class="text-xl font-medium md:text-2xl text-dark">Laporan Pengaduan Total</h1>
</div>
<DxDataGrid class="max-h-[calc(100vh-140px)] mb-10" :show-column-lines="true" :show-row-lines="false"
:show-borders="true" :row-alternation-enabled="true" :hover-state-enabled="true"
@selection-changed="onSelectionChanged" :column-width="100" @exporting="onExporting" :allow-column-resizing="true"
column-resizing-mode="widget" :word-wrap-enabled="true">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:show-column-lines="true"
:show-row-lines="false"
:show-borders="true"
:row-alternation-enabled="true"
:hover-state-enabled="true"
@selection-changed="onSelectionChanged"
:column-width="100"
@exporting="onExporting"
:allow-column-resizing="true"
column-resizing-mode="widget"
:word-wrap-enabled="true"
>
<DxSelection mode="single" />
<DxPaging :enabled="false" />
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
<DxLoadPanel :position="position" :show-indicator="showIndicator" :show-pane="showPane" :shading="shading"
v-if="loading" v-model:visible="loading" :enabled="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" />
<DxExport :enabled="true" :formats="['pdf', 'xlsx', 'document']" :allow-export-selected-data="false" />
<DxExport
:enabled="true"
:formats="['pdf', 'xlsx', 'document']"
:allow-export-selected-data="false"
/>
<DxColumnFixing :enabled="true" />
<DxColumn :width="170" alignment="center" data-field="" caption="Nama Unit" css-class="custom-table-column" />
<DxColumn
:width="170"
alignment="center"
data-field=""
caption="Nama Unit"
css-class="custom-table-column"
/>
<DxColumn alignment="center" caption="Total WO" css-class="custom-table-column">
<DxColumn alignment="center" caption="CC 123" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="a"
css-class="custom-table-column" />
<DxColumn
:width="150"
alignment="center"
data-field=""
data-type="number"
caption="a"
css-class="custom-table-column"
/>
</DxColumn>
<DxColumn alignment="center" caption="PLN Mobile" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="b"
css-class="custom-table-column" />
<DxColumn
:width="150"
alignment="center"
data-field=""
data-type="number"
caption="b"
css-class="custom-table-column"
/>
</DxColumn>
<DxColumn alignment="center" caption="Loket" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="c"
css-class="custom-table-column" />
<DxColumn
:width="150"
alignment="center"
data-field=""
data-type="number"
caption="c"
css-class="custom-table-column"
/>
</DxColumn>
<DxColumn alignment="center" caption="Lainnya" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="d"
css-class="custom-table-column" />
<DxColumn
:width="150"
alignment="center"
data-field=""
data-type="number"
caption="d"
css-class="custom-table-column"
/>
</DxColumn>
<DxColumn alignment="center" caption="Total" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="e=a+b+c+d"
css-class="custom-table-column" />
<DxColumn
:width="150"
alignment="center"
data-field=""
data-type="number"
caption="e=a+b+c+d"
css-class="custom-table-column"
/>
</DxColumn>
</DxColumn>
<DxColumn alignment="center" caption="Total Pengaduan Yang Diselesaikan Secara Anomali"
css-class="custom-table-column">
<DxColumn
alignment="center"
caption="Total Pengaduan Yang Diselesaikan Secara Anomali"
css-class="custom-table-column"
>
<DxColumn alignment="center" caption="PLN Mobile" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="f"
css-class="custom-table-column" />
<DxColumn
:width="150"
alignment="center"
data-field=""
data-type="number"
caption="f"
css-class="custom-table-column"
/>
</DxColumn>
<DxColumn alignment="center" caption="CC 123" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="g"
css-class="custom-table-column" />
<DxColumn
:width="150"
alignment="center"
data-field=""
data-type="number"
caption="g"
css-class="custom-table-column"
/>
</DxColumn>
<DxColumn alignment="center" caption="Total" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="h=f+g"
css-class="custom-table-column" />
<DxColumn
:width="150"
alignment="center"
data-field=""
data-type="number"
caption="h=f+g"
css-class="custom-table-column"
/>
</DxColumn>
</DxColumn>
<DxColumn alignment="center" caption="% Pengaduan Yang Diselesaikan Secara Anomali" css-class="custom-table-column">
<DxColumn
alignment="center"
caption="% Pengaduan Yang Diselesaikan Secara Anomali"
css-class="custom-table-column"
>
<DxColumn alignment="center" caption="PLN Mobile" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="i=f/e"
css-class="custom-table-column" />
<DxColumn
:width="150"
alignment="center"
data-field=""
data-type="number"
caption="i=f/e"
css-class="custom-table-column"
/>
</DxColumn>
<DxColumn alignment="center" caption="CC 123" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="j=g/e"
css-class="custom-table-column" />
<DxColumn
:width="150"
alignment="center"
data-field=""
data-type="number"
caption="j=g/e"
css-class="custom-table-column"
/>
</DxColumn>
<DxColumn alignment="center" caption="Total" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="k=i+j"
css-class="custom-table-column" />
<DxColumn
:width="150"
alignment="center"
data-field=""
data-type="number"
caption="k=i+j"
css-class="custom-table-column"
/>
</DxColumn>
</DxColumn>
</DxDataGrid>
</template>
<script setup lang="ts">
import { computed, ref } from 'vue'
import { DxDataGrid } from 'devextreme-vue'
import { DxColumn, DxColumnFixing, DxExport, DxLoadPanel, DxPaging, DxScrolling, DxSearchPanel, DxSelection } from 'devextreme-vue/data-grid'
import {
DxColumn,
DxColumnFixing,
DxExport,
DxLoadPanel,
DxPaging,
DxScrolling,
DxSearchPanel,
DxSelection
} from 'devextreme-vue/data-grid'
import { jsPDF } from 'jspdf'
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
@ -89,7 +196,7 @@ const shading = ref(true)
const showPane = ref(true)
const loading = ref(false)
const props = defineProps({
data: Array as () => any[],
data: Array as () => any[]
})
const data = computed(() => props.data)
@ -100,7 +207,7 @@ const onExporting = (e: any) => {
exportToPdf({
jsPDFDocument: doc,
component: e.component,
indent: 5,
indent: 5
}).then(() => {
doc.save(`.pdf`)
})
@ -111,7 +218,7 @@ const onExporting = (e: any) => {
exportToExcel({
component: e.component,
worksheet,
autoFilterEnabled: true,
autoFilterEnabled: true
}).then(() => {
workbook.xlsx.writeBuffer().then((buffer: any) => {
saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'DataGrid.xlsx')
@ -126,4 +233,4 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
const data = selectedRowsData[0]
console.log(data)
}
</script>
</script>

View File

@ -5,6 +5,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -188,6 +189,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="dataSub"
:show-column-lines="true"

View File

@ -1,57 +1,135 @@
<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)] mb-10" :show-column-lines="true" :show-row-lines="false"
:show-borders="true" :row-alternation-enabled="true" :hover-state-enabled="true"
@selection-changed="onSelectionChanged" @exporting="onExporting" :allow-column-resizing="true"
column-resizing-mode="widget" :word-wrap-enabled="true">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:show-column-lines="true"
:show-row-lines="false"
:show-borders="true"
:row-alternation-enabled="true"
:hover-state-enabled="true"
@selection-changed="onSelectionChanged"
@exporting="onExporting"
:allow-column-resizing="true"
column-resizing-mode="widget"
:word-wrap-enabled="true"
>
<DxSelection mode="single" />
<DxPaging :enabled="false" />
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
<DxLoadPanel :position="position" :show-indicator="showIndicator" :show-pane="showPane" :shading="shading"
v-if="loading" v-model:visible="loading" :enabled="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" />
<DxExport :enabled="true" :formats="['pdf', 'xlsx', 'document']" :allow-export-selected-data="false" />
<DxExport
:enabled="true"
:formats="['pdf', 'xlsx', 'document']"
:allow-export-selected-data="false"
/>
<DxColumnFixing :enabled="true" />
<DxColumn alignment="center" data-field="nama_posko" caption="Nama Unit" css-class="custom-table-column" />
<DxColumn
alignment="center"
data-field="nama_posko"
caption="Nama Unit"
css-class="custom-table-column"
/>
<DxColumn alignment="center" caption="Total WO" css-class="custom-table-column">
<DxColumn alignment="center" caption="CC 123" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="total_wo_cc123" data-type="number" caption="a"
css-class="custom-table-column" />
<DxColumn
:width="150"
alignment="center"
data-field="total_wo_cc123"
data-type="number"
caption="a"
css-class="custom-table-column"
/>
</DxColumn>
<DxColumn alignment="center" caption="PLN Mobile" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="total_wo_pln_mobile" data-type="number" caption="b"
css-class="custom-table-column" />
<DxColumn
:width="150"
alignment="center"
data-field="total_wo_pln_mobile"
data-type="number"
caption="b"
css-class="custom-table-column"
/>
</DxColumn>
<DxColumn alignment="center" caption="COMCEN" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="total_wo_comcen" data-type="number" caption="c"
css-class="custom-table-column" />
<DxColumn
:width="150"
alignment="center"
data-field="total_wo_comcen"
data-type="number"
caption="c"
css-class="custom-table-column"
/>
</DxColumn>
<DxColumn alignment="center" caption="Total" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="total_wo" data-type="number" caption="d=b+c"
css-class="custom-table-column" />
<DxColumn
:width="150"
alignment="center"
data-field="total_wo"
data-type="number"
caption="d=b+c"
css-class="custom-table-column"
/>
</DxColumn>
</DxColumn>
<DxColumn alignment="center" caption="Rekomendasi sistem" css-class="custom-table-column">
<DxColumn alignment="center" caption="Mendatangkan Petugas" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="rekomendasi_sistem_mendatangkan_petugas"
data-type="number" caption="e" css-class="custom-table-column" />
<DxColumn
:width="150"
alignment="center"
data-field="rekomendasi_sistem_mendatangkan_petugas"
data-type="number"
caption="e"
css-class="custom-table-column"
/>
</DxColumn>
<DxColumn alignment="center" caption="Diberikan ke Pelanggan" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="total_wo_loket" data-type="number" caption="f"
css-class="custom-table-column" />
<DxColumn
alignment="center"
caption="Diberikan ke Pelanggan"
css-class="custom-table-column"
>
<DxColumn
:width="150"
alignment="center"
data-field="total_wo_loket"
data-type="number"
caption="f"
css-class="custom-table-column"
/>
</DxColumn>
</DxColumn>
<DxColumn alignment="center" caption="DLPD" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="dlpd" data-type="number" caption="g"
css-class="custom-table-column" />
<DxColumn
:width="150"
alignment="center"
data-field="dlpd"
data-type="number"
caption="g"
css-class="custom-table-column"
/>
</DxColumn>
<DxColumn alignment="center" caption="Histori P2TL" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="history_p2ti" data-type="number" caption="h"
css-class="custom-table-column" />
<DxColumn
:width="150"
alignment="center"
data-field="history_p2ti"
data-type="number"
caption="h"
css-class="custom-table-column"
/>
</DxColumn>
</DxDataGrid>
</div>

View File

@ -5,6 +5,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -58,7 +59,7 @@
alignment="center"
data-field="no_laporan"
caption="No Laporan"
cell-template="cellCenter"
cell-template="formatText"
/>
<DxColumn
css-class="custom-table-column"
@ -68,6 +69,14 @@
caption="Nama Pelapor"
cell-template="formatText"
/>
<DxColumn
css-class="custom-table-column"
:width="150"
alignment="center"
data-field="no_telp_pelapor"
caption="No Telp Pelapor"
cell-template="formatText"
/>
<DxColumn
css-class="custom-table-column"
:width="170"
@ -76,14 +85,6 @@
caption="Alamat Pelapor"
cell-template="formatText"
/>
<DxColumn
css-class="custom-table-column"
:width="150"
alignment="center"
data-field="no_telp_pelapor"
caption="No Telp Pelapor"
cell-template="cellCenter"
/>
<DxColumn
css-class="custom-table-column"
:width="150"
@ -98,7 +99,7 @@
alignment="center"
data-field="status_akhir"
caption="Status"
cell-template="cellCenter"
cell-template="formatText"
/>
<DxColumn
css-class="custom-table-column"
@ -106,7 +107,7 @@
alignment="center"
data-field="waktu_lapor"
caption="Tgl Lapor"
cell-template="cellCenter"
cell-template="formatText"
/>
<DxColumn
css-class="custom-table-column"
@ -114,7 +115,7 @@
alignment="center"
data-field="waktu_response"
caption="Tgl Response"
cell-template="cellCenter"
cell-template="formatText"
/>
<DxColumn
css-class="custom-table-column"
@ -122,7 +123,7 @@
alignment="center"
data-field="waktu_recovery"
caption="Tgl Recovery"
cell-template="cellCenter"
cell-template="formatText"
/>
<DxColumn
css-class="custom-table-column"
@ -146,7 +147,7 @@
alignment="center"
data-field="nama_posko"
caption="Sumber Lapor"
cell-template="cellCenter"
cell-template="formatText"
/>
<DxColumn
css-class="custom-table-column"
@ -154,7 +155,7 @@
alignment="center"
data-field="waktu_media"
caption="Tgl Media"
cell-template="cellCenter"
cell-template="formatText"
/>
<DxColumn
css-class="custom-table-column"

View File

@ -5,6 +5,7 @@
<div id="dataTable">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:remote-operations="true"
:data-source="data"

View File

@ -5,6 +5,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -5,6 +5,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -21,6 +21,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -5,6 +5,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -5,6 +5,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -517,6 +518,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="dataSub"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -147,6 +148,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="dataSub"
:show-column-lines="true"

View File

@ -9,6 +9,7 @@
</Filters>
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -141,6 +142,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="dataSub"
:show-column-lines="true"

View File

@ -4,6 +4,7 @@
</Filters>
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -4,6 +4,7 @@
</Filters>
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -421,6 +422,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="dataSub"
:show-column-lines="true"

View File

@ -12,6 +12,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -12,6 +12,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -432,6 +433,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="dataSub"
:show-column-lines="true"

View File

@ -4,6 +4,7 @@
</Filters>
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -311,6 +312,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="dataSub"
:show-column-lines="true"

View File

@ -12,6 +12,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -517,6 +518,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="dataSub"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -276,6 +277,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="dataSub"
:show-column-lines="true"

View File

@ -4,6 +4,7 @@
</Filters>
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -238,6 +239,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="dataSub"
:show-column-lines="true"

View File

@ -4,6 +4,7 @@
</Filters>
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -230,6 +231,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="dataSub"
:show-column-lines="true"

View File

@ -5,6 +5,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -5,6 +5,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -5,6 +5,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -21,6 +21,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -21,6 +21,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -5,6 +5,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -5,6 +5,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -9,6 +9,7 @@
</Filters>
<div>
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -428,6 +429,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="dataSub"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div>
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -127,6 +128,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -394,6 +395,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="data"
:show-column-lines="true"
@ -876,265 +878,265 @@ onMounted(() => {
if (import.meta.env.DEV) {
data.value = [
{
"id": 0,
"nama_regional": "REGIONAL SUMKAL",
"id_uid": 131,
"nama_uid": "WILAYAH SUMATERA BARAT",
"id_up3": 13100,
"nama_up3": "UP3 PADANG",
"id_ulp": 13105,
"nama_ulp": "ULP LUBUK ALUNG",
"fungsi_bidang": "Proses PD/TD, belum ada realisasinya ",
"total": 1,
"total_selesai": 1,
"persen_selesai": 100,
"total_inproses": 0,
"persen_inproses": 0,
"avg_durasi_response": 983,
"min_durasi_response": 983,
"max_durasi_response": 983,
"total_dibawah_sla_response": 1,
"total_diatas_sla_response": 0,
"avg_durasi_recovery": 1373,
"min_durasi_recovery": 1373,
"max_durasi_recovery": 1373,
"total_dibawah_sla_recovery": 1,
"total_diatas_sla_recovery": 0
},
{
"id": 1,
"nama_regional": "REGIONAL SUMKAL",
"id_uid": 131,
"nama_uid": "WILAYAH SUMATERA BARAT",
"id_up3": 13100,
"nama_up3": "UP3 PADANG",
"id_ulp": 13107,
"nama_ulp": "ULP PAINAN",
"fungsi_bidang": "Drop Tegangan ",
"total": 1,
"total_selesai": 1,
"persen_selesai": 100,
"total_inproses": 0,
"persen_inproses": 0,
"avg_durasi_response": 2228,
"min_durasi_response": 2228,
"max_durasi_response": 2228,
"total_dibawah_sla_response": 0,
"total_diatas_sla_response": 1,
"avg_durasi_recovery": 2347,
"min_durasi_recovery": 2347,
"max_durasi_recovery": 2347,
"total_dibawah_sla_recovery": 1,
"total_diatas_sla_recovery": 0
},
{
"id": 2,
"nama_regional": "REGIONAL SUMKAL",
"id_uid": 131,
"nama_uid": "WILAYAH SUMATERA BARAT",
"id_up3": 13100,
"nama_up3": "UP3 PADANG",
"id_ulp": 13104,
"nama_ulp": "ULP PARIAMAN",
"fungsi_bidang": "Kondisi Jaringan Listrik ",
"total": 4,
"total_selesai": 3,
"persen_selesai": 75,
"total_inproses": 1,
"persen_inproses": 25,
"avg_durasi_response": 772.6666666666666,
"min_durasi_response": 171,
"max_durasi_response": 1701,
"total_dibawah_sla_response": 2,
"total_diatas_sla_response": 1,
"avg_durasi_recovery": 3476,
"min_durasi_recovery": 2824,
"max_durasi_recovery": 3968,
"total_dibawah_sla_recovery": 4,
"total_diatas_sla_recovery": 0
},
{
"id": 3,
"nama_regional": "REGIONAL SUMKAL",
"id_uid": 131,
"nama_uid": "WILAYAH SUMATERA BARAT",
"id_up3": 13100,
"nama_up3": "UP3 PADANG",
"id_ulp": 13103,
"nama_ulp": "ULP INDARUNG",
"fungsi_bidang": "Alat Pembatas tidak berfungsi ",
"total": 25,
"total_selesai": 15,
"persen_selesai": 60,
"total_inproses": 10,
"persen_inproses": 40,
"avg_durasi_response": 1419,
"min_durasi_response": 109,
"max_durasi_response": 4384,
"total_dibawah_sla_response": 10,
"total_diatas_sla_response": 5,
"avg_durasi_recovery": 4791.6,
"min_durasi_recovery": 10,
"max_durasi_recovery": 21118,
"total_dibawah_sla_recovery": 17,
"total_diatas_sla_recovery": 8
},
{
"id": 4,
"nama_regional": "REGIONAL SUMKAL",
"id_uid": 131,
"nama_uid": "WILAYAH SUMATERA BARAT",
"id_up3": 13100,
"nama_up3": "UP3 PADANG",
"id_ulp": 13105,
"nama_ulp": "ULP LUBUK ALUNG",
"fungsi_bidang": "PD",
"total": 2,
"total_selesai": 2,
"persen_selesai": 100,
"total_inproses": 0,
"persen_inproses": 0,
"avg_durasi_response": 8920.5,
"min_durasi_response": 790,
"max_durasi_response": 17051,
"total_dibawah_sla_response": 1,
"total_diatas_sla_response": 1,
"avg_durasi_recovery": 13781.5,
"min_durasi_recovery": 6068,
"max_durasi_recovery": 21495,
"total_dibawah_sla_recovery": 0,
"total_diatas_sla_recovery": 2
},
{
"id": 5,
"nama_regional": "REGIONAL SUMKAL",
"id_uid": 131,
"nama_uid": "WILAYAH SUMATERA BARAT",
"id_up3": 13100,
"nama_up3": "UP3 PADANG",
"id_ulp": 13106,
"nama_ulp": "ULP SICINCIN",
"fungsi_bidang": "Alat Pembatas tidak berfungsi ",
"total": 11,
"total_selesai": 0,
"persen_selesai": 0,
"total_inproses": 11,
"persen_inproses": 100,
"avg_durasi_response": 828.25,
"min_durasi_response": 387,
"max_durasi_response": 1237,
"total_dibawah_sla_response": 4,
"total_diatas_sla_response": 0,
"avg_durasi_recovery": 2622.181818181818,
"min_durasi_recovery": 480,
"max_durasi_recovery": 15205,
"total_dibawah_sla_recovery": 10,
"total_diatas_sla_recovery": 1
},
{
"id": 6,
"nama_regional": "REGIONAL SUMKAL",
"id_uid": 131,
"nama_uid": "WILAYAH SUMATERA BARAT",
"id_up3": 13100,
"nama_up3": "UP3 PADANG",
"id_ulp": 13103,
"nama_ulp": "ULP INDARUNG",
"fungsi_bidang": "Tidak bisa beli Token ",
"total": 1,
"total_selesai": 1,
"persen_selesai": 100,
"total_inproses": 0,
"persen_inproses": 0,
"avg_durasi_response": 5442,
"min_durasi_response": 5442,
"max_durasi_response": 5442,
"total_dibawah_sla_response": 0,
"total_diatas_sla_response": 1,
"avg_durasi_recovery": 9759,
"min_durasi_recovery": 9759,
"max_durasi_recovery": 9759,
"total_dibawah_sla_recovery": 0,
"total_diatas_sla_recovery": 1
},
{
"id": 7,
"nama_regional": "REGIONAL SUMKAL",
"id_uid": 131,
"nama_uid": "WILAYAH SUMATERA BARAT",
"id_up3": 13100,
"nama_up3": "UP3 PADANG",
"id_ulp": 13102,
"nama_ulp": "ULP TABING",
"fungsi_bidang": "Kondisi Jaringan Listrik ",
"total": 13,
"total_selesai": 4,
"persen_selesai": 30.76923076923077,
"total_inproses": 9,
"persen_inproses": 69.23076923076923,
"avg_durasi_response": 5249.461538461538,
"min_durasi_response": 300,
"max_durasi_response": 22739,
"total_dibawah_sla_response": 5,
"total_diatas_sla_response": 8,
"avg_durasi_recovery": 7872.384615384615,
"min_durasi_recovery": 594,
"max_durasi_recovery": 32933,
"total_dibawah_sla_recovery": 7,
"total_diatas_sla_recovery": 6
},
{
"id": 8,
"nama_regional": "REGIONAL SUMKAL",
"id_uid": 131,
"nama_uid": "WILAYAH SUMATERA BARAT",
"id_up3": 13100,
"nama_up3": "UP3 PADANG",
"id_ulp": 13102,
"nama_ulp": "ULP TABING",
"fungsi_bidang": "PTL Sering Padam ",
"total": 1,
"total_selesai": 0,
"persen_selesai": 0,
"total_inproses": 1,
"persen_inproses": 100,
"avg_durasi_response": 28613,
"min_durasi_response": 28613,
"max_durasi_response": 28613,
"total_dibawah_sla_response": 0,
"total_diatas_sla_response": 1,
"avg_durasi_recovery": 37937,
"min_durasi_recovery": 37937,
"max_durasi_recovery": 37937,
"total_dibawah_sla_recovery": 0,
"total_diatas_sla_recovery": 1
},
{
"id": 9,
"nama_regional": "REGIONAL SUMKAL",
"id_uid": 131,
"nama_uid": "WILAYAH SUMATERA BARAT",
"id_up3": 13100,
"nama_up3": "UP3 PADANG",
"id_ulp": 13112,
"nama_ulp": "ULP KURANJI",
"fungsi_bidang": "Alat Ukur Paskabayar tidak berfungsi ",
"total": 1,
"total_selesai": 1,
"persen_selesai": 100,
"total_inproses": 0,
"persen_inproses": 0,
"avg_durasi_response": 2264,
"min_durasi_response": 2264,
"max_durasi_response": 2264,
"total_dibawah_sla_response": 0,
"total_diatas_sla_response": 1,
"avg_durasi_recovery": 3300,
"min_durasi_recovery": 3300,
"max_durasi_recovery": 3300,
"total_dibawah_sla_recovery": 1,
"total_diatas_sla_recovery": 0
},
id: 0,
nama_regional: 'REGIONAL SUMKAL',
id_uid: 131,
nama_uid: 'WILAYAH SUMATERA BARAT',
id_up3: 13100,
nama_up3: 'UP3 PADANG',
id_ulp: 13105,
nama_ulp: 'ULP LUBUK ALUNG',
fungsi_bidang: 'Proses PD/TD, belum ada realisasinya ',
total: 1,
total_selesai: 1,
persen_selesai: 100,
total_inproses: 0,
persen_inproses: 0,
avg_durasi_response: 983,
min_durasi_response: 983,
max_durasi_response: 983,
total_dibawah_sla_response: 1,
total_diatas_sla_response: 0,
avg_durasi_recovery: 1373,
min_durasi_recovery: 1373,
max_durasi_recovery: 1373,
total_dibawah_sla_recovery: 1,
total_diatas_sla_recovery: 0
},
{
id: 1,
nama_regional: 'REGIONAL SUMKAL',
id_uid: 131,
nama_uid: 'WILAYAH SUMATERA BARAT',
id_up3: 13100,
nama_up3: 'UP3 PADANG',
id_ulp: 13107,
nama_ulp: 'ULP PAINAN',
fungsi_bidang: 'Drop Tegangan ',
total: 1,
total_selesai: 1,
persen_selesai: 100,
total_inproses: 0,
persen_inproses: 0,
avg_durasi_response: 2228,
min_durasi_response: 2228,
max_durasi_response: 2228,
total_dibawah_sla_response: 0,
total_diatas_sla_response: 1,
avg_durasi_recovery: 2347,
min_durasi_recovery: 2347,
max_durasi_recovery: 2347,
total_dibawah_sla_recovery: 1,
total_diatas_sla_recovery: 0
},
{
id: 2,
nama_regional: 'REGIONAL SUMKAL',
id_uid: 131,
nama_uid: 'WILAYAH SUMATERA BARAT',
id_up3: 13100,
nama_up3: 'UP3 PADANG',
id_ulp: 13104,
nama_ulp: 'ULP PARIAMAN',
fungsi_bidang: 'Kondisi Jaringan Listrik ',
total: 4,
total_selesai: 3,
persen_selesai: 75,
total_inproses: 1,
persen_inproses: 25,
avg_durasi_response: 772.6666666666666,
min_durasi_response: 171,
max_durasi_response: 1701,
total_dibawah_sla_response: 2,
total_diatas_sla_response: 1,
avg_durasi_recovery: 3476,
min_durasi_recovery: 2824,
max_durasi_recovery: 3968,
total_dibawah_sla_recovery: 4,
total_diatas_sla_recovery: 0
},
{
id: 3,
nama_regional: 'REGIONAL SUMKAL',
id_uid: 131,
nama_uid: 'WILAYAH SUMATERA BARAT',
id_up3: 13100,
nama_up3: 'UP3 PADANG',
id_ulp: 13103,
nama_ulp: 'ULP INDARUNG',
fungsi_bidang: 'Alat Pembatas tidak berfungsi ',
total: 25,
total_selesai: 15,
persen_selesai: 60,
total_inproses: 10,
persen_inproses: 40,
avg_durasi_response: 1419,
min_durasi_response: 109,
max_durasi_response: 4384,
total_dibawah_sla_response: 10,
total_diatas_sla_response: 5,
avg_durasi_recovery: 4791.6,
min_durasi_recovery: 10,
max_durasi_recovery: 21118,
total_dibawah_sla_recovery: 17,
total_diatas_sla_recovery: 8
},
{
id: 4,
nama_regional: 'REGIONAL SUMKAL',
id_uid: 131,
nama_uid: 'WILAYAH SUMATERA BARAT',
id_up3: 13100,
nama_up3: 'UP3 PADANG',
id_ulp: 13105,
nama_ulp: 'ULP LUBUK ALUNG',
fungsi_bidang: 'PD',
total: 2,
total_selesai: 2,
persen_selesai: 100,
total_inproses: 0,
persen_inproses: 0,
avg_durasi_response: 8920.5,
min_durasi_response: 790,
max_durasi_response: 17051,
total_dibawah_sla_response: 1,
total_diatas_sla_response: 1,
avg_durasi_recovery: 13781.5,
min_durasi_recovery: 6068,
max_durasi_recovery: 21495,
total_dibawah_sla_recovery: 0,
total_diatas_sla_recovery: 2
},
{
id: 5,
nama_regional: 'REGIONAL SUMKAL',
id_uid: 131,
nama_uid: 'WILAYAH SUMATERA BARAT',
id_up3: 13100,
nama_up3: 'UP3 PADANG',
id_ulp: 13106,
nama_ulp: 'ULP SICINCIN',
fungsi_bidang: 'Alat Pembatas tidak berfungsi ',
total: 11,
total_selesai: 0,
persen_selesai: 0,
total_inproses: 11,
persen_inproses: 100,
avg_durasi_response: 828.25,
min_durasi_response: 387,
max_durasi_response: 1237,
total_dibawah_sla_response: 4,
total_diatas_sla_response: 0,
avg_durasi_recovery: 2622.181818181818,
min_durasi_recovery: 480,
max_durasi_recovery: 15205,
total_dibawah_sla_recovery: 10,
total_diatas_sla_recovery: 1
},
{
id: 6,
nama_regional: 'REGIONAL SUMKAL',
id_uid: 131,
nama_uid: 'WILAYAH SUMATERA BARAT',
id_up3: 13100,
nama_up3: 'UP3 PADANG',
id_ulp: 13103,
nama_ulp: 'ULP INDARUNG',
fungsi_bidang: 'Tidak bisa beli Token ',
total: 1,
total_selesai: 1,
persen_selesai: 100,
total_inproses: 0,
persen_inproses: 0,
avg_durasi_response: 5442,
min_durasi_response: 5442,
max_durasi_response: 5442,
total_dibawah_sla_response: 0,
total_diatas_sla_response: 1,
avg_durasi_recovery: 9759,
min_durasi_recovery: 9759,
max_durasi_recovery: 9759,
total_dibawah_sla_recovery: 0,
total_diatas_sla_recovery: 1
},
{
id: 7,
nama_regional: 'REGIONAL SUMKAL',
id_uid: 131,
nama_uid: 'WILAYAH SUMATERA BARAT',
id_up3: 13100,
nama_up3: 'UP3 PADANG',
id_ulp: 13102,
nama_ulp: 'ULP TABING',
fungsi_bidang: 'Kondisi Jaringan Listrik ',
total: 13,
total_selesai: 4,
persen_selesai: 30.76923076923077,
total_inproses: 9,
persen_inproses: 69.23076923076923,
avg_durasi_response: 5249.461538461538,
min_durasi_response: 300,
max_durasi_response: 22739,
total_dibawah_sla_response: 5,
total_diatas_sla_response: 8,
avg_durasi_recovery: 7872.384615384615,
min_durasi_recovery: 594,
max_durasi_recovery: 32933,
total_dibawah_sla_recovery: 7,
total_diatas_sla_recovery: 6
},
{
id: 8,
nama_regional: 'REGIONAL SUMKAL',
id_uid: 131,
nama_uid: 'WILAYAH SUMATERA BARAT',
id_up3: 13100,
nama_up3: 'UP3 PADANG',
id_ulp: 13102,
nama_ulp: 'ULP TABING',
fungsi_bidang: 'PTL Sering Padam ',
total: 1,
total_selesai: 0,
persen_selesai: 0,
total_inproses: 1,
persen_inproses: 100,
avg_durasi_response: 28613,
min_durasi_response: 28613,
max_durasi_response: 28613,
total_dibawah_sla_response: 0,
total_diatas_sla_response: 1,
avg_durasi_recovery: 37937,
min_durasi_recovery: 37937,
max_durasi_recovery: 37937,
total_dibawah_sla_recovery: 0,
total_diatas_sla_recovery: 1
},
{
id: 9,
nama_regional: 'REGIONAL SUMKAL',
id_uid: 131,
nama_uid: 'WILAYAH SUMATERA BARAT',
id_up3: 13100,
nama_up3: 'UP3 PADANG',
id_ulp: 13112,
nama_ulp: 'ULP KURANJI',
fungsi_bidang: 'Alat Ukur Paskabayar tidak berfungsi ',
total: 1,
total_selesai: 1,
persen_selesai: 100,
total_inproses: 0,
persen_inproses: 0,
avg_durasi_response: 2264,
min_durasi_response: 2264,
max_durasi_response: 2264,
total_dibawah_sla_response: 0,
total_diatas_sla_response: 1,
avg_durasi_recovery: 3300,
min_durasi_recovery: 3300,
max_durasi_recovery: 3300,
total_dibawah_sla_recovery: 1,
total_diatas_sla_recovery: 0
}
]
}
})

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -549,6 +550,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="dataSub"
:show-column-lines="true"
@ -1025,5 +1027,5 @@ onMounted(() => {
if (import.meta.env.DEV) {
data.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPerJenisKeluhan
}
})
})
</script>

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -406,6 +407,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div>
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:show-column-lines="true"
:show-row-lines="false"
@ -409,6 +410,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div>
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -548,6 +549,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="dataSub"
:show-column-lines="true"

View File

@ -4,6 +4,7 @@
</Filters>
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -1,9 +1,10 @@
<template>
<Filters @run-search="() => filterData(filters)" class="mb-4">
<Type14 @update:filters="(value) => filters = value" />
<Type14 @update:filters="(value) => (filters = value)" />
</Filters>
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:show-column-lines="true"
:show-row-lines="false"
@ -137,13 +138,13 @@
import { ref } from 'vue'
import { DxDataGrid } from 'devextreme-vue'
import {
DxColumn,
DxExport,
DxLoadPanel,
DxPager,
DxPaging,
DxSearchPanel,
DxSelection
DxColumn,
DxExport,
DxLoadPanel,
DxPager,
DxPaging,
DxSearchPanel,
DxSelection
} from 'devextreme-vue/data-grid'
import Filters from '@/components/Form/Filters.vue'
import { Type14 } from '@/components/Form/FiltersType'

View File

@ -1,9 +1,10 @@
<template>
<Filters @run-search="() => filterData(filters)" class="mb-4">
<Type14 @update:filters="(value) => filters = value" />
<Type14 @update:filters="(value) => (filters = value)" />
</Filters>
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:show-column-lines="true"
:show-row-lines="false"
@ -97,13 +98,13 @@
import { ref } from 'vue'
import { DxDataGrid } from 'devextreme-vue'
import {
DxColumn,
DxExport,
DxLoadPanel,
DxPager,
DxPaging,
DxSearchPanel,
DxSelection
DxColumn,
DxExport,
DxLoadPanel,
DxPager,
DxPaging,
DxSearchPanel,
DxSelection
} from 'devextreme-vue/data-grid'
import { Type14 } from '@/components/Form/FiltersType'
import Filters from '@/components/Form/Filters.vue'

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -9,6 +9,7 @@
</Filters>
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -137,6 +138,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="dataSub"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -9,6 +9,7 @@
</Filters>
<div>
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -355,6 +356,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="dataSub"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"
@ -683,6 +684,7 @@
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="dataSub"
:show-column-lines="true"
@ -982,7 +984,7 @@
</template>
<script setup lang="ts">
import { onMounted, ref, watch } from 'vue'
import { onMounted, ref } from 'vue'
import Filters from '@/components/Form/Filters.vue'
import Type2 from '@/components/Form/FiltersType/Type2.vue'
import { DxDataGrid } from 'devextreme-vue'

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -10,6 +10,7 @@
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:data-source="data"
:show-column-lines="true"

View File

@ -4,6 +4,7 @@
</Filters>
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:show-column-lines="true"
:show-row-lines="false"

View File

@ -1,9 +1,10 @@
<template>
<Filters @run-search="() => filterData(filters)" class="mb-4">
<Type17 @update:filters="(value) => filters = value" />
<Type17 @update:filters="(value) => (filters = value)" />
</Filters>
<div id="data">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)] mb-10"
:show-column-lines="true"
:show-row-lines="false"
@ -130,14 +131,14 @@
import { ref } from 'vue'
import { DxDataGrid } from 'devextreme-vue'
import {
DxColumn,
DxColumnFixing,
DxExport,
DxLoadPanel,
DxPaging,
DxScrolling,
DxSearchPanel,
DxSelection
DxColumn,
DxColumnFixing,
DxExport,
DxLoadPanel,
DxPaging,
DxScrolling,
DxSearchPanel,
DxSelection
} from 'devextreme-vue/data-grid'
import { jsPDF } from 'jspdf'
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'