Refactor code to improve performance and readability
This commit is contained in:
Dede Fuji Abdul
parent
7189b2bfbe
commit
f4be1d584d
@ -1,44 +1,200 @@
|
|||||||
<template>
|
<template>
|
||||||
<Filters @reset-form="data = []" :report-button="true" @run-search="() => filterData(filters)" class="mb-4">
|
<Filters
|
||||||
<Type2 @update:filters="(value) => filters = value" />
|
@reset-form="data = []"
|
||||||
|
:report-button="true"
|
||||||
|
@run-search="() => filterData(filters)"
|
||||||
|
class="mb-4"
|
||||||
|
>
|
||||||
|
<Type2 @update:filters="(value) => (filters = value)" />
|
||||||
</Filters>
|
</Filters>
|
||||||
|
|
||||||
<div id="data">
|
<div id="data">
|
||||||
<DxDataGrid class="max-h-[calc(100vh-140px)] mb-10" :data-source="data" :show-column-lines="true"
|
<DxDataGrid
|
||||||
:show-row-lines="false" :show-borders="true" :row-alternation-enabled="true" :hover-state-enabled="true"
|
class="max-h-[calc(100vh-140px)] mb-10"
|
||||||
@selection-changed="onSelectionChanged" @exporting="onExporting" :allow-column-resizing="true"
|
:data-source="data"
|
||||||
column-resizing-mode="widget" :word-wrap-enabled="true">
|
: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" />
|
<DxSelection mode="single" />
|
||||||
<DxPaging :enabled="false" />
|
<DxPaging :enabled="false" />
|
||||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||||
<DxLoadPanel :position="position" :show-indicator="showIndicator" :show-pane="showPane" :shading="shading"
|
<DxLoadPanel
|
||||||
v-if="loading" v-model:visible="loading" :enabled="true" />
|
: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" />
|
<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" />
|
<DxColumnFixing :enabled="true" />
|
||||||
|
|
||||||
<DxColumn alignment="center" :min-width="170" data-type="text" data-field="nama_ulp" caption="Nama Unit"
|
<!-- <DxColumn
|
||||||
css-class="custom-table-column" :group-index="0" name="namaUlp" />
|
alignment="center"
|
||||||
<DxColumn alignment="center" :min-width="170" data-type="text" data-field="nama_ulp" caption="Nama Unit"
|
:min-width="170"
|
||||||
css-class="custom-table-column" />
|
data-type="text"
|
||||||
<DxColumn alignment="center" caption="Jumlah Dispatching Time Gangguan" css-class="custom-table-column">
|
data-field="nama_ulp"
|
||||||
|
caption="Nama Unit"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
:group-index="0"
|
||||||
|
name="namaUlp"
|
||||||
|
/> -->
|
||||||
|
<DxColumn
|
||||||
|
alignment="center"
|
||||||
|
:min-width="170"
|
||||||
|
data-type="text"
|
||||||
|
data-field="nama_ulp"
|
||||||
|
caption="Nama Unit"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatText"
|
||||||
|
/>
|
||||||
|
<DxColumn
|
||||||
|
alignment="center"
|
||||||
|
caption="Jumlah Dispatching Time Gangguan"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
>
|
||||||
<DxColumn alignment="center" caption="MoM" css-class="custom-table-column">
|
<DxColumn alignment="center" caption="MoM" css-class="custom-table-column">
|
||||||
<DxColumn :width="150" alignment="center" data-field="mom_bulan_kemarin" data-type="number"
|
<DxColumn
|
||||||
:caption="`${getMonthName(currentMonth)} ${lastYear}`" css-class="custom-table-column" />
|
:width="150"
|
||||||
<DxColumn :width="150" alignment="center" data-field="mom_bulan_ini" data-type="number"
|
alignment="center"
|
||||||
:caption="`${getMonthName(currentMonth)} ${currentYear}`" css-class="custom-table-column" />
|
data-field="mom_bulan_kemarin"
|
||||||
<DxColumn :width="70" alignment="center" data-field="persen_mom" data-type="number" caption="%"
|
data-type="number"
|
||||||
css-class="custom-table-column" />
|
:caption="`${getMonthName(currentMonth)} ${lastYear}`"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
|
<DxColumn
|
||||||
|
:width="150"
|
||||||
|
alignment="center"
|
||||||
|
data-field="mom_bulan_ini"
|
||||||
|
data-type="number"
|
||||||
|
:caption="`${getMonthName(currentMonth)} ${currentYear}`"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
|
<DxColumn
|
||||||
|
:width="70"
|
||||||
|
alignment="center"
|
||||||
|
data-field="persen_mom"
|
||||||
|
data-type="number"
|
||||||
|
caption="%"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
<DxColumn alignment="center" caption="YoY" css-class="custom-table-column">
|
<DxColumn alignment="center" caption="YoY" css-class="custom-table-column">
|
||||||
<DxColumn :width="150" alignment="center" data-field="yoy_tahun_kemarin" data-type="number"
|
<DxColumn
|
||||||
:caption="`s.d ${getMonthName(currentMonth)} ${lastYear}`" css-class="custom-table-column" />
|
:width="150"
|
||||||
<DxColumn :width="150" alignment="center" data-field="yoy_tahun_ini" data-type="number"
|
alignment="center"
|
||||||
:caption="`s.d ${getMonthName(currentMonth)} ${currentYear}`" css-class="custom-table-column" />
|
data-field="yoy_tahun_kemarin"
|
||||||
<DxColumn :width="70" alignment="center" data-field="persen_yoy" data-type="number" caption="%"
|
data-type="number"
|
||||||
css-class="custom-table-column" />
|
:caption="`s.d ${getMonthName(currentMonth)} ${lastYear}`"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
|
<DxColumn
|
||||||
|
:width="150"
|
||||||
|
alignment="center"
|
||||||
|
data-field="yoy_tahun_ini"
|
||||||
|
data-type="number"
|
||||||
|
:caption="`s.d ${getMonthName(currentMonth)} ${currentYear}`"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
|
<DxColumn
|
||||||
|
:width="70"
|
||||||
|
alignment="center"
|
||||||
|
data-field="persen_yoy"
|
||||||
|
data-type="number"
|
||||||
|
caption="%"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
|
|
||||||
|
<DxSummary>
|
||||||
|
<DxTotalItem
|
||||||
|
summary-type="sum"
|
||||||
|
display-format="Total"
|
||||||
|
show-in-column="nama_ulp"
|
||||||
|
css-class="text-white !text-left"
|
||||||
|
/>
|
||||||
|
<DxTotalItem
|
||||||
|
column="mom_bulan_kemarin"
|
||||||
|
summary-type="sum"
|
||||||
|
display-format="{0}"
|
||||||
|
css-class="text-white !text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxTotalItem
|
||||||
|
column="mom_bulan_ini"
|
||||||
|
summary-type="sum"
|
||||||
|
display-format="{0}"
|
||||||
|
css-class="text-white !text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxTotalItem
|
||||||
|
column="persen_mom"
|
||||||
|
summary-type="avg"
|
||||||
|
display-format="{0}"
|
||||||
|
css-class="text-white !text-right"
|
||||||
|
:customize-text="(e: any) => formatPercentage(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxTotalItem
|
||||||
|
column="yoy_tahun_kemarin"
|
||||||
|
summary-type="sum"
|
||||||
|
display-format="{0}"
|
||||||
|
css-class="text-white !text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxTotalItem
|
||||||
|
column="yoy_tahun_ini"
|
||||||
|
summary-type="sum"
|
||||||
|
display-format="{0}"
|
||||||
|
css-class="text-white !text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxTotalItem
|
||||||
|
column="persen_yoy"
|
||||||
|
summary-type="avg"
|
||||||
|
display-format="{0}"
|
||||||
|
css-class="text-white !text-right"
|
||||||
|
:customize-text="(e: any) => formatPercentage(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
</DxSummary>
|
||||||
|
|
||||||
|
<template #formatNumber="{ data }">
|
||||||
|
<p class="text-right">
|
||||||
|
{{
|
||||||
|
isNumber(data.text)
|
||||||
|
? data.column.caption == '%'
|
||||||
|
? formatPercentage(data.text)
|
||||||
|
: formatNumber(data.text)
|
||||||
|
: data.text
|
||||||
|
}}
|
||||||
|
</p>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<template #formatText="{ data }">
|
||||||
|
<p class="!text-left">
|
||||||
|
{{ data.text }}
|
||||||
|
</p>
|
||||||
|
</template>
|
||||||
</DxDataGrid>
|
</DxDataGrid>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@ -46,7 +202,7 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import Filters from '@/components/Form/Filters.vue'
|
import Filters from '@/components/Form/Filters.vue'
|
||||||
import Type2 from '@/components/Form/FiltersType/Type2.vue'
|
import Type2 from '@/components/Form/FiltersType/Type2.vue'
|
||||||
import { ref } from 'vue'
|
import { onMounted, ref } from 'vue'
|
||||||
import { DxDataGrid } from 'devextreme-vue'
|
import { DxDataGrid } from 'devextreme-vue'
|
||||||
import {
|
import {
|
||||||
DxColumn,
|
DxColumn,
|
||||||
@ -56,7 +212,9 @@ import {
|
|||||||
DxPaging,
|
DxPaging,
|
||||||
DxScrolling,
|
DxScrolling,
|
||||||
DxSearchPanel,
|
DxSearchPanel,
|
||||||
DxSelection
|
DxSelection,
|
||||||
|
DxSummary,
|
||||||
|
DxTotalItem
|
||||||
} from 'devextreme-vue/data-grid'
|
} from 'devextreme-vue/data-grid'
|
||||||
import { jsPDF } from 'jspdf'
|
import { jsPDF } from 'jspdf'
|
||||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||||
@ -66,6 +224,7 @@ import { Workbook } from 'exceljs'
|
|||||||
import { useQuery } from '@vue/apollo-composable'
|
import { useQuery } from '@vue/apollo-composable'
|
||||||
import { getMonthName } from '@/utils/texts'
|
import { getMonthName } from '@/utils/texts'
|
||||||
import { queries } from '@/utils/api/api.graphql'
|
import { queries } from '@/utils/api/api.graphql'
|
||||||
|
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
|
||||||
|
|
||||||
const currentYear = ref(new Date().getFullYear())
|
const currentYear = ref(new Date().getFullYear())
|
||||||
const currentMonth = ref(new Date().getMonth())
|
const currentMonth = ref(new Date().getMonth())
|
||||||
@ -105,14 +264,17 @@ const onExporting = (e: any) => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const { onResult, onError, loading, refetch } = useQuery(queries.monalisa.gangguan.rekap.dispatchingTimeGangguan, {
|
const { onResult, onError, loading, refetch } = useQuery(
|
||||||
|
queries.monalisa.gangguan.rekap.dispatchingTimeGangguan,
|
||||||
|
{
|
||||||
// regional: 0,
|
// regional: 0,
|
||||||
idUp3: 0,
|
idUp3: 0,
|
||||||
idUid: 0,
|
idUid: 0,
|
||||||
idUlp: 0,
|
idUlp: 0,
|
||||||
bulan: currentMonth.value,
|
bulan: currentMonth.value,
|
||||||
tahun: currentYear.value
|
tahun: currentYear.value
|
||||||
})
|
}
|
||||||
|
)
|
||||||
|
|
||||||
const filterData = (params: any) => {
|
const filterData = (params: any) => {
|
||||||
const { regional, ulp, uid, up3, bulan, tahun } = params
|
const { regional, ulp, uid, up3, bulan, tahun } = params
|
||||||
@ -145,4 +307,266 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const filters = ref()
|
const filters = ref()
|
||||||
|
onMounted(() => {
|
||||||
|
if (import.meta.env.DEV) {
|
||||||
|
data.value = [
|
||||||
|
{
|
||||||
|
id: 0,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 230,
|
||||||
|
nama_uid: 'WILAYAH KALIMANTAN TIMUR',
|
||||||
|
id_up3: 231,
|
||||||
|
nama_up3: 'UP3 SAMARINDA',
|
||||||
|
id_ulp: 23156,
|
||||||
|
nama_ulp: 'ULP SAMARINDA ULU',
|
||||||
|
mom_bulan_ini: -213179,
|
||||||
|
mom_bulan_kemarin: 673,
|
||||||
|
persen_mom: 31775.994473750405,
|
||||||
|
yoy_tahun_ini: 2069,
|
||||||
|
yoy_tahun_kemarin: 1841,
|
||||||
|
persen_yoy: -12.38457360130364
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 180,
|
||||||
|
nama_uid: 'WILAYAH RIAU DAN KEPULAUAN RIAU',
|
||||||
|
id_up3: 183,
|
||||||
|
nama_up3: 'UP3 TANJUNGPINANG',
|
||||||
|
id_ulp: 18302,
|
||||||
|
nama_ulp: 'ULP KIJANG',
|
||||||
|
mom_bulan_ini: -114,
|
||||||
|
mom_bulan_kemarin: 373,
|
||||||
|
persen_mom: 130.77740603697222,
|
||||||
|
yoy_tahun_ini: 1324,
|
||||||
|
yoy_tahun_kemarin: 1931,
|
||||||
|
persen_yoy: 31.434489901605385
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 2,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 180,
|
||||||
|
nama_uid: 'WILAYAH RIAU DAN KEPULAUAN RIAU',
|
||||||
|
id_up3: 182,
|
||||||
|
nama_up3: 'UP3 DUMAI',
|
||||||
|
id_ulp: 18240,
|
||||||
|
nama_ulp: 'ULP SELATPANJANG',
|
||||||
|
mom_bulan_ini: -869,
|
||||||
|
mom_bulan_kemarin: 493,
|
||||||
|
persen_mom: 276.27086351782094,
|
||||||
|
yoy_tahun_ini: 1454,
|
||||||
|
yoy_tahun_kemarin: 702,
|
||||||
|
persen_yoy: -107.12250712250713
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 3,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 120,
|
||||||
|
nama_uid: 'WILAYAH SUMATERA UTARA',
|
||||||
|
id_up3: 12400,
|
||||||
|
nama_up3: 'UP3 PADANG SIDIMPUAN',
|
||||||
|
id_ulp: 12415,
|
||||||
|
nama_ulp: 'ULP NATAL',
|
||||||
|
mom_bulan_ini: -16,
|
||||||
|
mom_bulan_kemarin: 184,
|
||||||
|
persen_mom: 108.95582431788799,
|
||||||
|
yoy_tahun_ini: 426,
|
||||||
|
yoy_tahun_kemarin: 536,
|
||||||
|
persen_yoy: 20.522388059701495
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 4,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 230,
|
||||||
|
nama_uid: 'WILAYAH KALIMANTAN TIMUR',
|
||||||
|
id_up3: 231,
|
||||||
|
nama_up3: 'UP3 SAMARINDA',
|
||||||
|
id_ulp: 23102,
|
||||||
|
nama_ulp: 'ULP SAMARINDA SEBERANG',
|
||||||
|
mom_bulan_ini: -295198,
|
||||||
|
mom_bulan_kemarin: 1025,
|
||||||
|
persen_mom: 28899.899321562316,
|
||||||
|
yoy_tahun_ini: 3193,
|
||||||
|
yoy_tahun_kemarin: 2649,
|
||||||
|
persen_yoy: -20.53605134012835
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 5,
|
||||||
|
nama_regional: 'REGIONAL SULMAPANA',
|
||||||
|
id_uid: 32,
|
||||||
|
nama_uid: 'WILAYAH SULAWESI SELATAN, TENGGARA DAN BARAT',
|
||||||
|
id_up3: 32200,
|
||||||
|
nama_up3: 'UP3 WATAMPONE',
|
||||||
|
id_ulp: 32240,
|
||||||
|
nama_ulp: 'ULP SENGKANG',
|
||||||
|
mom_bulan_ini: -107,
|
||||||
|
mom_bulan_kemarin: 606,
|
||||||
|
persen_mom: 117.772648051322,
|
||||||
|
yoy_tahun_ini: 2082,
|
||||||
|
yoy_tahun_kemarin: 1190,
|
||||||
|
persen_yoy: -74.95798319327731
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 6,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 180,
|
||||||
|
nama_uid: 'WILAYAH RIAU DAN KEPULAUAN RIAU',
|
||||||
|
id_up3: 181,
|
||||||
|
nama_up3: 'UP3 PEKANBARU',
|
||||||
|
id_ulp: 18150,
|
||||||
|
nama_ulp: 'ULP PERAWANG',
|
||||||
|
mom_bulan_ini: -407,
|
||||||
|
mom_bulan_kemarin: 916,
|
||||||
|
persen_mom: 144.4547767778033,
|
||||||
|
yoy_tahun_ini: 2897,
|
||||||
|
yoy_tahun_kemarin: 2706,
|
||||||
|
persen_yoy: -7.058388765705839
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 7,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 180,
|
||||||
|
nama_uid: 'WILAYAH RIAU DAN KEPULAUAN RIAU',
|
||||||
|
id_up3: 183,
|
||||||
|
nama_up3: 'UP3 TANJUNGPINANG',
|
||||||
|
id_ulp: 18306,
|
||||||
|
nama_ulp: 'ULP TANJUNG BATU',
|
||||||
|
mom_bulan_ini: -539,
|
||||||
|
mom_bulan_kemarin: 69,
|
||||||
|
persen_mom: 882.5544353427151,
|
||||||
|
yoy_tahun_ini: 252,
|
||||||
|
yoy_tahun_kemarin: 322,
|
||||||
|
persen_yoy: 21.73913043478261
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 8,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 180,
|
||||||
|
nama_uid: 'WILAYAH RIAU DAN KEPULAUAN RIAU',
|
||||||
|
id_up3: 184,
|
||||||
|
nama_up3: 'UP3 RENGAT',
|
||||||
|
id_ulp: 18430,
|
||||||
|
nama_ulp: 'ULP KUALA ENOK',
|
||||||
|
mom_bulan_ini: -169,
|
||||||
|
mom_bulan_kemarin: 188,
|
||||||
|
persen_mom: 190.35948625202792,
|
||||||
|
yoy_tahun_ini: 591,
|
||||||
|
yoy_tahun_kemarin: 2752,
|
||||||
|
persen_yoy: 78.52470930232558
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 9,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 180,
|
||||||
|
nama_uid: 'WILAYAH RIAU DAN KEPULAUAN RIAU',
|
||||||
|
id_up3: 181,
|
||||||
|
nama_up3: 'UP3 PEKANBARU',
|
||||||
|
id_ulp: 18170,
|
||||||
|
nama_ulp: 'ULP SIAK SRI INDRAPURA',
|
||||||
|
mom_bulan_ini: -11,
|
||||||
|
mom_bulan_kemarin: 391,
|
||||||
|
persen_mom: 102.89304140589162,
|
||||||
|
yoy_tahun_ini: 1163,
|
||||||
|
yoy_tahun_kemarin: 2109,
|
||||||
|
persen_yoy: 44.85538169748696
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 10,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 180,
|
||||||
|
nama_uid: 'WILAYAH RIAU DAN KEPULAUAN RIAU',
|
||||||
|
id_up3: 182,
|
||||||
|
nama_up3: 'UP3 DUMAI',
|
||||||
|
id_ulp: 18260,
|
||||||
|
nama_ulp: 'ULP BAGAN BATU',
|
||||||
|
mom_bulan_ini: -600,
|
||||||
|
mom_bulan_kemarin: 964,
|
||||||
|
persen_mom: 162.33329138602699,
|
||||||
|
yoy_tahun_ini: 3581,
|
||||||
|
yoy_tahun_kemarin: 2965,
|
||||||
|
persen_yoy: -20.775716694772346
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 11,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 230,
|
||||||
|
nama_uid: 'WILAYAH KALIMANTAN TIMUR',
|
||||||
|
id_up3: 231,
|
||||||
|
nama_up3: 'UP3 SAMARINDA',
|
||||||
|
id_ulp: 23112,
|
||||||
|
nama_ulp: 'ULP TENGGARONG',
|
||||||
|
mom_bulan_ini: -4524,
|
||||||
|
mom_bulan_kemarin: 981,
|
||||||
|
persen_mom: 561.2414600051343,
|
||||||
|
yoy_tahun_ini: 3234,
|
||||||
|
yoy_tahun_kemarin: 3514,
|
||||||
|
persen_yoy: 7.968127490039841
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 12,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 180,
|
||||||
|
nama_uid: 'WILAYAH RIAU DAN KEPULAUAN RIAU',
|
||||||
|
id_up3: 183,
|
||||||
|
nama_up3: 'UP3 TANJUNGPINANG',
|
||||||
|
id_ulp: 18303,
|
||||||
|
nama_ulp: 'ULP TANJUNG UBAN',
|
||||||
|
mom_bulan_ini: -186,
|
||||||
|
mom_bulan_kemarin: 191,
|
||||||
|
persen_mom: 197.5691701222732,
|
||||||
|
yoy_tahun_ini: 615,
|
||||||
|
yoy_tahun_kemarin: 1058,
|
||||||
|
persen_yoy: 41.87145557655955
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 13,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 180,
|
||||||
|
nama_uid: 'WILAYAH RIAU DAN KEPULAUAN RIAU',
|
||||||
|
id_up3: 184,
|
||||||
|
nama_up3: 'UP3 RENGAT',
|
||||||
|
id_ulp: 18410,
|
||||||
|
nama_ulp: 'ULP RENGAT KOTA',
|
||||||
|
mom_bulan_ini: -476,
|
||||||
|
mom_bulan_kemarin: 955,
|
||||||
|
persen_mom: 149.94027462127963,
|
||||||
|
yoy_tahun_ini: 2931,
|
||||||
|
yoy_tahun_kemarin: 4545,
|
||||||
|
persen_yoy: 35.51155115511551
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 14,
|
||||||
|
nama_regional: 'REGIONAL JMB',
|
||||||
|
id_uid: 101,
|
||||||
|
nama_uid: 'DISTRIBUSI JAWA TENGAH & DIY',
|
||||||
|
id_up3: 52200,
|
||||||
|
nama_up3: 'UP3 PURWOKERTO',
|
||||||
|
id_ulp: 52201,
|
||||||
|
nama_ulp: 'ULP PURWOKERTO KOTA',
|
||||||
|
mom_bulan_ini: -63,
|
||||||
|
mom_bulan_kemarin: 3642,
|
||||||
|
persen_mom: 101.7401502360751,
|
||||||
|
yoy_tahun_ini: 11511,
|
||||||
|
yoy_tahun_kemarin: 14451,
|
||||||
|
persen_yoy: 20.344612829561967
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 15,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 180,
|
||||||
|
nama_uid: 'WILAYAH RIAU DAN KEPULAUAN RIAU',
|
||||||
|
id_up3: 181,
|
||||||
|
nama_up3: 'UP3 PEKANBARU',
|
||||||
|
id_ulp: 18111,
|
||||||
|
nama_ulp: 'ULP PEKANBARU KOTA BARAT',
|
||||||
|
mom_bulan_ini: -1097,
|
||||||
|
mom_bulan_kemarin: 1964,
|
||||||
|
persen_mom: 155.88116671737166,
|
||||||
|
yoy_tahun_ini: 6506,
|
||||||
|
yoy_tahun_kemarin: 5316,
|
||||||
|
persen_yoy: -22.385252069224983
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
@ -1,78 +1,341 @@
|
|||||||
<template>
|
<template>
|
||||||
<Filters @run-search="() => filterData(filters)" :report-button="true" class="mb-4">
|
<Filters @run-search="() => filterData(filters)" :report-button="true" class="mb-4">
|
||||||
<Type2 @update:filters="(value) => filters = value" />
|
<Type2 @update:filters="(value) => (filters = value)" />
|
||||||
</Filters>
|
</Filters>
|
||||||
<div>
|
<div>
|
||||||
<DxDataGrid class="max-h-[calc(100vh-140px)] mb-10" :data-source="data" :show-column-lines="true"
|
<DxDataGrid
|
||||||
:show-row-lines="false" :show-borders="true" :row-alternation-enabled="true" :hover-state-enabled="true"
|
class="max-h-[calc(100vh-140px)] mb-10"
|
||||||
@selection-changed="onSelectionChanged" :column-width="100" @exporting="onExporting" :allow-column-resizing="true"
|
:data-source="data"
|
||||||
column-resizing-mode="widget" :word-wrap-enabled="true">
|
: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" />
|
<DxSelection mode="single" />
|
||||||
<DxPaging :enabled="false" />
|
<DxPaging :enabled="false" />
|
||||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||||
<DxLoadPanel :position="position" :show-indicator="showIndicator" :show-pane="showPane" :shading="shading"
|
<DxLoadPanel
|
||||||
v-if="loading" v-model:visible="loading" :enabled="true" />
|
: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" />
|
<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" />
|
<DxColumnFixing :enabled="true" />
|
||||||
|
|
||||||
<DxColumn alignment="center" data-field="nama_ulp" caption="Nama Unit" css-class="custom-table-column" />
|
<DxColumn
|
||||||
<DxColumn alignment="center" caption="Jumlah dan Durasi RPT & RCT Gangguan" css-class="custom-table-column">
|
:width="200"
|
||||||
<DxColumn alignment="center" :caption="`${getMonthName(currentMonth)} ${currentYear}`"
|
alignment="center"
|
||||||
css-class="custom-table-column">
|
data-field="nama_ulp"
|
||||||
|
caption="Nama Unit"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatText"
|
||||||
|
/>
|
||||||
|
<DxColumn
|
||||||
|
alignment="center"
|
||||||
|
data-field="nama_regional"
|
||||||
|
caption="Regional"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatText"
|
||||||
|
:group-index="0"
|
||||||
|
/>
|
||||||
|
<DxColumn
|
||||||
|
alignment="center"
|
||||||
|
data-field="nama_uid"
|
||||||
|
caption="UID"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatText"
|
||||||
|
:group-index="1"
|
||||||
|
/>
|
||||||
|
<DxColumn
|
||||||
|
alignment="center"
|
||||||
|
data-field="nama_up3"
|
||||||
|
caption="UP3"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatText"
|
||||||
|
:group-index="2"
|
||||||
|
/>
|
||||||
|
<DxColumn
|
||||||
|
alignment="center"
|
||||||
|
caption="Jumlah dan Durasi RPT & RCT Gangguan"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
>
|
||||||
|
<DxColumn
|
||||||
|
alignment="center"
|
||||||
|
:caption="`${getMonthName(currentMonth)} ${currentYear}`"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
>
|
||||||
<DxColumn alignment="center" caption="Total RPT" css-class="custom-table-column">
|
<DxColumn alignment="center" caption="Total RPT" css-class="custom-table-column">
|
||||||
<DxColumn :width="150" alignment="center" caption="a" data-type="number"
|
<DxColumn
|
||||||
data-field="total_durasi_response_time_bulan_ini" css-class="custom-table-column" />
|
:width="150"
|
||||||
|
alignment="center"
|
||||||
|
caption="a"
|
||||||
|
data-type="number"
|
||||||
|
data-field="total_durasi_response_time_bulan_ini"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
<DxColumn alignment="center" caption="Jumlah Gangguan" css-class="custom-table-column">
|
<DxColumn alignment="center" caption="Jumlah Gangguan" css-class="custom-table-column">
|
||||||
<DxColumn :width="150" alignment="center" caption="b" data-type="number"
|
<DxColumn
|
||||||
data-field="jumlah_gangguan_rpt_bulan" css-class="custom-table-column" />
|
:width="150"
|
||||||
|
alignment="center"
|
||||||
|
caption="b"
|
||||||
|
data-type="number"
|
||||||
|
data-field="jumlah_gangguan_rpt_bulan"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
<DxColumn alignment="center" caption="RPT Gangguan" css-class="custom-table-column">
|
<DxColumn alignment="center" caption="RPT Gangguan" css-class="custom-table-column">
|
||||||
<DxColumn :width="150" alignment="center" caption="c=a/b" data-type="number" data-field="rpt_gangguan_bulan"
|
<DxColumn
|
||||||
css-class="custom-table-column" />
|
:width="150"
|
||||||
|
alignment="center"
|
||||||
|
caption="c=a/b"
|
||||||
|
data-type="number"
|
||||||
|
data-field="rpt_gangguan_bulan"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
<DxColumn alignment="center" caption="Total RCT" css-class="custom-table-column">
|
<DxColumn alignment="center" caption="Total RCT" css-class="custom-table-column">
|
||||||
<DxColumn :width="150" alignment="center" caption="d" data-type="number" data-field="total_rct_bulan"
|
<DxColumn
|
||||||
css-class="custom-table-column" />
|
:width="150"
|
||||||
|
alignment="center"
|
||||||
|
caption="d"
|
||||||
|
data-type="number"
|
||||||
|
data-field="total_rct_bulan"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
<DxColumn alignment="center" caption="Jumlah Gangguan" css-class="custom-table-column">
|
<DxColumn alignment="center" caption="Jumlah Gangguan" css-class="custom-table-column">
|
||||||
<DxColumn :width="150" alignment="center" caption="e" data-type="number"
|
<DxColumn
|
||||||
data-field="jumlah_gangguan_rct_bulan" css-class="custom-table-column" />
|
:width="150"
|
||||||
|
alignment="center"
|
||||||
|
caption="e"
|
||||||
|
data-type="number"
|
||||||
|
data-field="jumlah_gangguan_rct_bulan"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
<DxColumn alignment="center" caption="RCT Gangguan" css-class="custom-table-column">
|
<DxColumn alignment="center" caption="RCT Gangguan" css-class="custom-table-column">
|
||||||
<DxColumn :width="150" alignment="center" caption="f=d/e" data-type="number" data-field="rct_gangguan_bulan"
|
<DxColumn
|
||||||
css-class="custom-table-column" />
|
:width="150"
|
||||||
|
alignment="center"
|
||||||
|
caption="f=d/e"
|
||||||
|
data-type="number"
|
||||||
|
data-field="rct_gangguan_bulan"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
<DxColumn alignment="center" :caption="`s.d ${getMonthName(currentMonth)} ${currentYear} `"
|
<DxColumn
|
||||||
css-class="custom-table-column">
|
alignment="center"
|
||||||
|
:caption="`s.d ${getMonthName(currentMonth)} ${currentYear} `"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
>
|
||||||
<DxColumn alignment="center" caption="Total RPT" css-class="custom-table-column">
|
<DxColumn alignment="center" caption="Total RPT" css-class="custom-table-column">
|
||||||
<DxColumn :width="150" alignment="center" caption="a" data-type="number"
|
<DxColumn
|
||||||
data-field="total_durasi_response_time_tahun_ini" css-class="custom-table-column" />
|
:width="150"
|
||||||
|
alignment="center"
|
||||||
|
caption="a"
|
||||||
|
data-type="number"
|
||||||
|
data-field="total_durasi_response_time_tahun_ini"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
<DxColumn alignment="center" caption="Jumlah Gangguan" css-class="custom-table-column">
|
<DxColumn alignment="center" caption="Jumlah Gangguan" css-class="custom-table-column">
|
||||||
<DxColumn :width="150" alignment="center" caption="b" data-type="number"
|
<DxColumn
|
||||||
data-field="jumlah_gangguan_rpt_sampai_bulan" css-class="custom-table-column" />
|
:width="150"
|
||||||
|
alignment="center"
|
||||||
|
caption="b"
|
||||||
|
data-type="number"
|
||||||
|
data-field="jumlah_gangguan_rpt_sampai_bulan"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
<DxColumn alignment="center" caption="RPT Gangguan" css-class="custom-table-column">
|
<DxColumn alignment="center" caption="RPT Gangguan" css-class="custom-table-column">
|
||||||
<DxColumn :width="150" alignment="center" caption="c=a/b" data-type="number"
|
<DxColumn
|
||||||
data-field="rpt_gangguan_sampai_bulan" css-class="custom-table-column" />
|
:width="150"
|
||||||
|
alignment="center"
|
||||||
|
caption="c=a/b"
|
||||||
|
data-type="number"
|
||||||
|
data-field="rpt_gangguan_sampai_bulan"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
<DxColumn alignment="center" caption="Total RCT" css-class="custom-table-column">
|
<DxColumn alignment="center" caption="Total RCT" css-class="custom-table-column">
|
||||||
<DxColumn :width="150" alignment="center" caption="d" data-type="number"
|
<DxColumn
|
||||||
data-field="total_durasi_recovery_time_tahun_ini" css-class="custom-table-column" />
|
:width="150"
|
||||||
|
alignment="center"
|
||||||
|
caption="d"
|
||||||
|
data-type="number"
|
||||||
|
data-field="total_durasi_recovery_time_tahun_ini"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
<DxColumn alignment="center" caption="Jumlah Gangguan" css-class="custom-table-column">
|
<DxColumn alignment="center" caption="Jumlah Gangguan" css-class="custom-table-column">
|
||||||
<DxColumn :width="150" alignment="center" caption="e" data-type="number"
|
<DxColumn
|
||||||
data-field="jumlah_gangguan_rct_sampai_bulan" css-class="custom-table-column" />
|
:width="150"
|
||||||
|
alignment="center"
|
||||||
|
caption="e"
|
||||||
|
data-type="number"
|
||||||
|
data-field="jumlah_gangguan_rct_sampai_bulan"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
<DxColumn alignment="center" caption="RCT Gangguan" css-class="custom-table-column">
|
<DxColumn alignment="center" caption="RCT Gangguan" css-class="custom-table-column">
|
||||||
<DxColumn :width="150" alignment="center" caption="f=d/e" data-type="number"
|
<DxColumn
|
||||||
data-field="rch_gangguan_sampai_bulan" css-class="custom-table-column" />
|
:width="150"
|
||||||
|
alignment="center"
|
||||||
|
caption="f=d/e"
|
||||||
|
data-type="number"
|
||||||
|
data-field="rch_gangguan_sampai_bulan"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
|
|
||||||
|
<DxSummary>
|
||||||
|
<DxGroupItem
|
||||||
|
:show-in-group-footer="false"
|
||||||
|
:align-by-column="true"
|
||||||
|
summary-type="sum"
|
||||||
|
show-in-column="total_durasi_response_time_bulan_ini"
|
||||||
|
css-class="!text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxGroupItem
|
||||||
|
:show-in-group-footer="false"
|
||||||
|
:align-by-column="true"
|
||||||
|
summary-type="sum"
|
||||||
|
show-in-column="jumlah_gangguan_rpt_bulan"
|
||||||
|
css-class="!text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxGroupItem
|
||||||
|
:show-in-group-footer="false"
|
||||||
|
:align-by-column="true"
|
||||||
|
summary-type="sum"
|
||||||
|
show-in-column="rpt_gangguan_bulan"
|
||||||
|
css-class="!text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxGroupItem
|
||||||
|
:show-in-group-footer="false"
|
||||||
|
:align-by-column="true"
|
||||||
|
summary-type="sum"
|
||||||
|
show-in-column="total_rct_bulan"
|
||||||
|
css-class="!text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxGroupItem
|
||||||
|
:show-in-group-footer="false"
|
||||||
|
:align-by-column="true"
|
||||||
|
summary-type="sum"
|
||||||
|
show-in-column="jumlah_gangguan_rct_bulan"
|
||||||
|
css-class="!text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxGroupItem
|
||||||
|
:show-in-group-footer="false"
|
||||||
|
:align-by-column="true"
|
||||||
|
summary-type="sum"
|
||||||
|
show-in-column="rct_gangguan_bulan"
|
||||||
|
css-class="!text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxGroupItem
|
||||||
|
:show-in-group-footer="false"
|
||||||
|
:align-by-column="true"
|
||||||
|
summary-type="sum"
|
||||||
|
show-in-column="total_durasi_response_time_tahun_ini"
|
||||||
|
css-class="!text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxGroupItem
|
||||||
|
:show-in-group-footer="false"
|
||||||
|
:align-by-column="true"
|
||||||
|
summary-type="sum"
|
||||||
|
show-in-column="jumlah_gangguan_rpt_sampai_bulan"
|
||||||
|
css-class="!text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxGroupItem
|
||||||
|
:show-in-group-footer="false"
|
||||||
|
:align-by-column="true"
|
||||||
|
summary-type="sum"
|
||||||
|
show-in-column="rpt_gangguan_sampai_bulan"
|
||||||
|
css-class="!text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxGroupItem
|
||||||
|
:show-in-group-footer="false"
|
||||||
|
:align-by-column="true"
|
||||||
|
summary-type="sum"
|
||||||
|
show-in-column="total_durasi_recovery_time_tahun_ini"
|
||||||
|
css-class="!text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxGroupItem
|
||||||
|
:show-in-group-footer="false"
|
||||||
|
:align-by-column="true"
|
||||||
|
summary-type="sum"
|
||||||
|
show-in-column="jumlah_gangguan_rct_sampai_bulan"
|
||||||
|
css-class="!text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxGroupItem
|
||||||
|
:show-in-group-footer="false"
|
||||||
|
:align-by-column="true"
|
||||||
|
summary-type="sum"
|
||||||
|
show-in-column="rch_gangguan_sampai_bulan"
|
||||||
|
css-class="!text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
</DxSummary>
|
||||||
|
|
||||||
|
<template #formatNumber="{ data }">
|
||||||
|
<p class="text-right">
|
||||||
|
{{
|
||||||
|
isNumber(data.text)
|
||||||
|
? data.column.caption == '%'
|
||||||
|
? formatPercentage(data.text)
|
||||||
|
: formatNumber(data.text)
|
||||||
|
: data.text
|
||||||
|
}}
|
||||||
|
</p>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<template #formatText="{ data }">
|
||||||
|
<p class="!text-left">
|
||||||
|
{{ data.text }}
|
||||||
|
</p>
|
||||||
|
</template>
|
||||||
</DxDataGrid>
|
</DxDataGrid>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@ -86,11 +349,13 @@ import {
|
|||||||
DxColumn,
|
DxColumn,
|
||||||
DxColumnFixing,
|
DxColumnFixing,
|
||||||
DxExport,
|
DxExport,
|
||||||
|
DxGroupItem,
|
||||||
DxLoadPanel,
|
DxLoadPanel,
|
||||||
DxPaging,
|
DxPaging,
|
||||||
DxScrolling,
|
DxScrolling,
|
||||||
DxSearchPanel,
|
DxSearchPanel,
|
||||||
DxSelection
|
DxSelection,
|
||||||
|
DxSummary
|
||||||
} from 'devextreme-vue/data-grid'
|
} from 'devextreme-vue/data-grid'
|
||||||
import { jsPDF } from 'jspdf'
|
import { jsPDF } from 'jspdf'
|
||||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||||
@ -100,6 +365,7 @@ import { Workbook } from 'exceljs'
|
|||||||
import { useQuery } from '@vue/apollo-composable'
|
import { useQuery } from '@vue/apollo-composable'
|
||||||
import { getMonthName } from '@/utils/texts'
|
import { getMonthName } from '@/utils/texts'
|
||||||
import { queries } from '@/utils/api/api.graphql'
|
import { queries } from '@/utils/api/api.graphql'
|
||||||
|
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
|
||||||
|
|
||||||
const currentYear = ref(new Date().getFullYear())
|
const currentYear = ref(new Date().getFullYear())
|
||||||
const currentMonth = ref(new Date().getMonth())
|
const currentMonth = ref(new Date().getMonth())
|
||||||
@ -110,14 +376,17 @@ const showPane = ref(true)
|
|||||||
const data = ref<any[]>([])
|
const data = ref<any[]>([])
|
||||||
const dataDetail = ref<any>()
|
const dataDetail = ref<any>()
|
||||||
const showDetail = ref(false)
|
const showDetail = ref(false)
|
||||||
const { onResult, onError, loading, refetch } = useQuery(queries.monalisa.gangguan.rekap.jumlahDurasiRptRctGangguan, {
|
const { onResult, onError, loading, refetch } = useQuery(
|
||||||
|
queries.monalisa.gangguan.rekap.jumlahDurasiRptRctGangguan,
|
||||||
|
{
|
||||||
bulan: 10,
|
bulan: 10,
|
||||||
tahun: 2023,
|
tahun: 2023,
|
||||||
// regional: '',
|
// regional: '',
|
||||||
idUlp: 0,
|
idUlp: 0,
|
||||||
idUid: 0,
|
idUid: 0,
|
||||||
idUp3: 0
|
idUp3: 0
|
||||||
})
|
}
|
||||||
|
)
|
||||||
const filterData = (params: any) => {
|
const filterData = (params: any) => {
|
||||||
const {
|
const {
|
||||||
// regional,
|
// regional,
|
||||||
@ -194,8 +463,339 @@ const filters = ref<any>({
|
|||||||
tahun: 2024
|
tahun: 2024
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
getMonthName(filters.value.bulan.id)
|
getMonthName(filters.value.bulan.id)
|
||||||
|
data.value = [
|
||||||
|
{
|
||||||
|
id: 0,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 120,
|
||||||
|
nama_uid: 'WILAYAH SUMATERA UTARA',
|
||||||
|
id_up3: 12100,
|
||||||
|
nama_up3: 'UP3 PEMATANG SIANTAR',
|
||||||
|
id_ulp: 12102,
|
||||||
|
nama_ulp: 'ULP LIMA PULUH',
|
||||||
|
total_durasi_response_time_bulan_ini: 15239,
|
||||||
|
count_durasi_response_time_bulan_ini: 26,
|
||||||
|
avg_durasi_response_time_bulan_ini: 586.1153846153846,
|
||||||
|
total_durasi_recovery_time_bulan_ini: 31425,
|
||||||
|
count_durasi_recovery_time_bulan_ini: 26,
|
||||||
|
avg_durasi_recovery_time_bulan_ini: 1208.6538461538462,
|
||||||
|
total_durasi_response_time_tahun_ini: 353812,
|
||||||
|
count_durasi_response_time_tahun_ini: 746,
|
||||||
|
avg_durasi_response_time_tahun_ini: 474.2788203753351,
|
||||||
|
total_durasi_recovery_time_tahun_ini: 708488,
|
||||||
|
count_durasi_recovery_time_tahun_ini: 746,
|
||||||
|
avg_durasi_recovery_time_tahun_ini: 474.2788203753351
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
nama_regional: 'REGIONAL SULMAPANA',
|
||||||
|
id_uid: 41,
|
||||||
|
nama_uid: 'WILAYAH MALUKU DAN MALUKU UTARA',
|
||||||
|
id_up3: 412,
|
||||||
|
nama_up3: 'UP3 TERNATE',
|
||||||
|
id_ulp: 41230,
|
||||||
|
nama_ulp: 'ULP BACAN',
|
||||||
|
total_durasi_response_time_bulan_ini: 475280,
|
||||||
|
count_durasi_response_time_bulan_ini: 378,
|
||||||
|
avg_durasi_response_time_bulan_ini: 1257.3544973544974,
|
||||||
|
total_durasi_recovery_time_bulan_ini: 834379,
|
||||||
|
count_durasi_recovery_time_bulan_ini: 378,
|
||||||
|
avg_durasi_recovery_time_bulan_ini: 2207.3518518518517,
|
||||||
|
total_durasi_response_time_tahun_ini: 2353207,
|
||||||
|
count_durasi_response_time_tahun_ini: 2185,
|
||||||
|
avg_durasi_response_time_tahun_ini: 1076.982608695652,
|
||||||
|
total_durasi_recovery_time_tahun_ini: 3773486,
|
||||||
|
count_durasi_recovery_time_tahun_ini: 2034,
|
||||||
|
avg_durasi_recovery_time_tahun_ini: 1076.982608695652
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 2,
|
||||||
|
nama_regional: 'REGIONAL JMB',
|
||||||
|
id_uid: 101,
|
||||||
|
nama_uid: 'DISTRIBUSI JAWA TENGAH & DIY',
|
||||||
|
id_up3: 52150,
|
||||||
|
nama_up3: 'UP3 MAGELANG',
|
||||||
|
id_ulp: 52156,
|
||||||
|
nama_ulp: 'ULP PARAKAN',
|
||||||
|
total_durasi_response_time_bulan_ini: 1149446,
|
||||||
|
count_durasi_response_time_bulan_ini: 991,
|
||||||
|
avg_durasi_response_time_bulan_ini: 1159.8849646821393,
|
||||||
|
total_durasi_recovery_time_bulan_ini: 2064288,
|
||||||
|
count_durasi_recovery_time_bulan_ini: 991,
|
||||||
|
avg_durasi_recovery_time_bulan_ini: 2083.0353178607465,
|
||||||
|
total_durasi_response_time_tahun_ini: 11820004,
|
||||||
|
count_durasi_response_time_tahun_ini: 10220,
|
||||||
|
avg_durasi_response_time_tahun_ini: 1156.5561643835617,
|
||||||
|
total_durasi_recovery_time_tahun_ini: 19879614,
|
||||||
|
count_durasi_recovery_time_tahun_ini: 10215,
|
||||||
|
avg_durasi_recovery_time_tahun_ini: 1156.5561643835617
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 3,
|
||||||
|
nama_regional: 'REGIONAL SULMAPANA',
|
||||||
|
id_uid: 31,
|
||||||
|
nama_uid: 'WILAYAH SULAWESI UTARA,TENGAH DAN GORONTALO',
|
||||||
|
id_up3: 31500,
|
||||||
|
nama_up3: 'UP3 TOLITOLI',
|
||||||
|
id_ulp: 31530,
|
||||||
|
nama_ulp: 'ULP BANGKIR',
|
||||||
|
total_durasi_response_time_bulan_ini: 52509,
|
||||||
|
count_durasi_response_time_bulan_ini: 52,
|
||||||
|
avg_durasi_response_time_bulan_ini: 1009.7884615384615,
|
||||||
|
total_durasi_recovery_time_bulan_ini: 96349,
|
||||||
|
count_durasi_recovery_time_bulan_ini: 52,
|
||||||
|
avg_durasi_recovery_time_bulan_ini: 1852.8653846153845,
|
||||||
|
total_durasi_response_time_tahun_ini: 13888593,
|
||||||
|
count_durasi_response_time_tahun_ini: 2300,
|
||||||
|
avg_durasi_response_time_tahun_ini: 6038.518695652174,
|
||||||
|
total_durasi_recovery_time_tahun_ini: 2188450,
|
||||||
|
count_durasi_recovery_time_tahun_ini: 2291,
|
||||||
|
avg_durasi_recovery_time_tahun_ini: 6038.518695652174
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 4,
|
||||||
|
nama_regional: 'REGIONAL JMB',
|
||||||
|
id_uid: 103,
|
||||||
|
nama_uid: 'DISTRIBUSI JAWA TIMUR',
|
||||||
|
id_up3: 154,
|
||||||
|
nama_up3: 'UP3 SITUBONDO',
|
||||||
|
id_ulp: 51654,
|
||||||
|
nama_ulp: 'ULP WONOSARI',
|
||||||
|
total_durasi_response_time_bulan_ini: 1408665,
|
||||||
|
count_durasi_response_time_bulan_ini: 843,
|
||||||
|
avg_durasi_response_time_bulan_ini: 1671.0142348754448,
|
||||||
|
total_durasi_recovery_time_bulan_ini: 2183667,
|
||||||
|
count_durasi_recovery_time_bulan_ini: 843,
|
||||||
|
avg_durasi_recovery_time_bulan_ini: 2590.3523131672596,
|
||||||
|
total_durasi_response_time_tahun_ini: 11091744,
|
||||||
|
count_durasi_response_time_tahun_ini: 8376,
|
||||||
|
avg_durasi_response_time_tahun_ini: 1324.2292263610316,
|
||||||
|
total_durasi_recovery_time_tahun_ini: 17694880,
|
||||||
|
count_durasi_recovery_time_tahun_ini: 8237,
|
||||||
|
avg_durasi_recovery_time_tahun_ini: 1324.2292263610316
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 5,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 110,
|
||||||
|
nama_uid: 'WILAYAH ACEH',
|
||||||
|
id_up3: 116,
|
||||||
|
nama_up3: 'UP3 SIGLI',
|
||||||
|
id_ulp: 11662,
|
||||||
|
nama_ulp: 'ULP MEUREUDU',
|
||||||
|
total_durasi_response_time_bulan_ini: 762987,
|
||||||
|
count_durasi_response_time_bulan_ini: 735,
|
||||||
|
avg_durasi_response_time_bulan_ini: 1038.0775510204082,
|
||||||
|
total_durasi_recovery_time_bulan_ini: 1550302,
|
||||||
|
count_durasi_recovery_time_bulan_ini: 735,
|
||||||
|
avg_durasi_recovery_time_bulan_ini: 2109.2544217687073,
|
||||||
|
total_durasi_response_time_tahun_ini: 8107328,
|
||||||
|
count_durasi_response_time_tahun_ini: 8068,
|
||||||
|
avg_durasi_response_time_tahun_ini: 1004.874566187407,
|
||||||
|
total_durasi_recovery_time_tahun_ini: 15846250,
|
||||||
|
count_durasi_recovery_time_tahun_ini: 8064,
|
||||||
|
avg_durasi_recovery_time_tahun_ini: 1004.874566187407
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 6,
|
||||||
|
nama_regional: 'REGIONAL JMB',
|
||||||
|
id_uid: 287,
|
||||||
|
nama_uid: 'DISTRIBUSI BALI',
|
||||||
|
id_up3: 329,
|
||||||
|
nama_up3: 'UP3 BALI UTARA',
|
||||||
|
id_ulp: 55340,
|
||||||
|
nama_ulp: 'ULP GILIMANUK',
|
||||||
|
total_durasi_response_time_bulan_ini: 809159,
|
||||||
|
count_durasi_response_time_bulan_ini: 656,
|
||||||
|
avg_durasi_response_time_bulan_ini: 1233.4740853658536,
|
||||||
|
total_durasi_recovery_time_bulan_ini: 1309097,
|
||||||
|
count_durasi_recovery_time_bulan_ini: 656,
|
||||||
|
avg_durasi_recovery_time_bulan_ini: 1995.5746951219512,
|
||||||
|
total_durasi_response_time_tahun_ini: 12308918,
|
||||||
|
count_durasi_response_time_tahun_ini: 8660,
|
||||||
|
avg_durasi_response_time_tahun_ini: 1421.35311778291,
|
||||||
|
total_durasi_recovery_time_tahun_ini: 19393316,
|
||||||
|
count_durasi_recovery_time_tahun_ini: 8626,
|
||||||
|
avg_durasi_recovery_time_tahun_ini: 1421.35311778291
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 7,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 131,
|
||||||
|
nama_uid: 'WILAYAH SUMATERA BARAT',
|
||||||
|
id_up3: 13300,
|
||||||
|
nama_up3: 'UP3 SOLOK',
|
||||||
|
id_ulp: 13334,
|
||||||
|
nama_ulp: 'ULP SILUNGKANG',
|
||||||
|
total_durasi_response_time_bulan_ini: 138385,
|
||||||
|
count_durasi_response_time_bulan_ini: 187,
|
||||||
|
avg_durasi_response_time_bulan_ini: 740.0267379679144,
|
||||||
|
total_durasi_recovery_time_bulan_ini: 292325,
|
||||||
|
count_durasi_recovery_time_bulan_ini: 187,
|
||||||
|
avg_durasi_recovery_time_bulan_ini: 1563.235294117647,
|
||||||
|
total_durasi_response_time_tahun_ini: 1356526,
|
||||||
|
count_durasi_response_time_tahun_ini: 1575,
|
||||||
|
avg_durasi_response_time_tahun_ini: 861.2863492063492,
|
||||||
|
total_durasi_recovery_time_tahun_ini: 2834067,
|
||||||
|
count_durasi_recovery_time_tahun_ini: 1553,
|
||||||
|
avg_durasi_recovery_time_tahun_ini: 861.2863492063492
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 8,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 221,
|
||||||
|
nama_uid: 'WILAYAH KALIMANTAN SELATAN DAN TENGAH',
|
||||||
|
id_up3: 2220,
|
||||||
|
nama_up3: 'UP3 BARABAI',
|
||||||
|
id_ulp: 22230,
|
||||||
|
nama_ulp: 'ULP AMUNTAI',
|
||||||
|
total_durasi_response_time_bulan_ini: 208716,
|
||||||
|
count_durasi_response_time_bulan_ini: 329,
|
||||||
|
avg_durasi_response_time_bulan_ini: 634.3951367781156,
|
||||||
|
total_durasi_recovery_time_bulan_ini: 382846,
|
||||||
|
count_durasi_recovery_time_bulan_ini: 329,
|
||||||
|
avg_durasi_recovery_time_bulan_ini: 1163.6656534954407,
|
||||||
|
total_durasi_response_time_tahun_ini: 2571552,
|
||||||
|
count_durasi_response_time_tahun_ini: 3294,
|
||||||
|
avg_durasi_response_time_tahun_ini: 780.6775956284152,
|
||||||
|
total_durasi_recovery_time_tahun_ini: 4579466,
|
||||||
|
count_durasi_recovery_time_tahun_ini: 3269,
|
||||||
|
avg_durasi_recovery_time_tahun_ini: 780.6775956284152
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 9,
|
||||||
|
nama_regional: 'REGIONAL SULMAPANA',
|
||||||
|
id_uid: 31,
|
||||||
|
nama_uid: 'WILAYAH SULAWESI UTARA,TENGAH DAN GORONTALO',
|
||||||
|
id_up3: 31700,
|
||||||
|
nama_up3: 'UP3 KOTAMOBAGU',
|
||||||
|
id_ulp: 31730,
|
||||||
|
nama_ulp: 'ULP MODAYAG',
|
||||||
|
total_durasi_response_time_bulan_ini: 172545,
|
||||||
|
count_durasi_response_time_bulan_ini: 106,
|
||||||
|
avg_durasi_response_time_bulan_ini: 1627.7830188679245,
|
||||||
|
total_durasi_recovery_time_bulan_ini: 241479,
|
||||||
|
count_durasi_recovery_time_bulan_ini: 106,
|
||||||
|
avg_durasi_recovery_time_bulan_ini: 2278.103773584906,
|
||||||
|
total_durasi_response_time_tahun_ini: 1863546,
|
||||||
|
count_durasi_response_time_tahun_ini: 1801,
|
||||||
|
avg_durasi_response_time_tahun_ini: 1034.728484175458,
|
||||||
|
total_durasi_recovery_time_tahun_ini: 2899034,
|
||||||
|
count_durasi_recovery_time_tahun_ini: 1759,
|
||||||
|
avg_durasi_recovery_time_tahun_ini: 1034.728484175458
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 10,
|
||||||
|
nama_regional: 'REGIONAL JMB',
|
||||||
|
id_uid: 427,
|
||||||
|
nama_uid: 'DISTRIBUSI JAWA BARAT',
|
||||||
|
id_up3: 546,
|
||||||
|
nama_up3: 'UP3 TASIKMALAYA',
|
||||||
|
id_ulp: 53231,
|
||||||
|
nama_ulp: 'ULP CIAMIS',
|
||||||
|
total_durasi_response_time_bulan_ini: 1077336,
|
||||||
|
count_durasi_response_time_bulan_ini: 1604,
|
||||||
|
avg_durasi_response_time_bulan_ini: 671.6558603491272,
|
||||||
|
total_durasi_recovery_time_bulan_ini: 1901265,
|
||||||
|
count_durasi_recovery_time_bulan_ini: 1604,
|
||||||
|
avg_durasi_recovery_time_bulan_ini: 1185.327306733167,
|
||||||
|
total_durasi_response_time_tahun_ini: 12491127,
|
||||||
|
count_durasi_response_time_tahun_ini: 20694,
|
||||||
|
avg_durasi_response_time_tahun_ini: 603.6110466801972,
|
||||||
|
total_durasi_recovery_time_tahun_ini: 19887846,
|
||||||
|
count_durasi_recovery_time_tahun_ini: 20343,
|
||||||
|
avg_durasi_recovery_time_tahun_ini: 603.6110466801972
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 11,
|
||||||
|
nama_regional: 'REGIONAL JMB',
|
||||||
|
id_uid: 103,
|
||||||
|
nama_uid: 'DISTRIBUSI JAWA TIMUR',
|
||||||
|
id_up3: 157,
|
||||||
|
nama_up3: 'UP3 SURABAYA UTARA',
|
||||||
|
id_ulp: 51101,
|
||||||
|
nama_ulp: 'ULP INDRAPURA',
|
||||||
|
total_durasi_response_time_bulan_ini: 468551,
|
||||||
|
count_durasi_response_time_bulan_ini: 438,
|
||||||
|
avg_durasi_response_time_bulan_ini: 1069.7511415525114,
|
||||||
|
total_durasi_recovery_time_bulan_ini: 857038,
|
||||||
|
count_durasi_recovery_time_bulan_ini: 438,
|
||||||
|
avg_durasi_recovery_time_bulan_ini: 1956.7077625570776,
|
||||||
|
total_durasi_response_time_tahun_ini: 6115468,
|
||||||
|
count_durasi_response_time_tahun_ini: 5889,
|
||||||
|
avg_durasi_response_time_tahun_ini: 1038.4561046018,
|
||||||
|
total_durasi_recovery_time_tahun_ini: 10632184,
|
||||||
|
count_durasi_recovery_time_tahun_ini: 5658,
|
||||||
|
avg_durasi_recovery_time_tahun_ini: 1038.4561046018
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 12,
|
||||||
|
nama_regional: 'REGIONAL SULMAPANA',
|
||||||
|
id_uid: 41,
|
||||||
|
nama_uid: 'WILAYAH MALUKU DAN MALUKU UTARA',
|
||||||
|
id_up3: 414,
|
||||||
|
nama_up3: 'UP3 MASOHI',
|
||||||
|
id_ulp: 41430,
|
||||||
|
nama_ulp: 'ULP MASOHI',
|
||||||
|
total_durasi_response_time_bulan_ini: 113695,
|
||||||
|
count_durasi_response_time_bulan_ini: 145,
|
||||||
|
avg_durasi_response_time_bulan_ini: 784.1034482758621,
|
||||||
|
total_durasi_recovery_time_bulan_ini: 211422,
|
||||||
|
count_durasi_recovery_time_bulan_ini: 145,
|
||||||
|
avg_durasi_recovery_time_bulan_ini: 1458.0827586206897,
|
||||||
|
total_durasi_response_time_tahun_ini: 2363191,
|
||||||
|
count_durasi_response_time_tahun_ini: 2822,
|
||||||
|
avg_durasi_response_time_tahun_ini: 837.4170800850461,
|
||||||
|
total_durasi_recovery_time_tahun_ini: 4201912,
|
||||||
|
count_durasi_recovery_time_tahun_ini: 2818,
|
||||||
|
avg_durasi_recovery_time_tahun_ini: 837.4170800850461
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 13,
|
||||||
|
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',
|
||||||
|
total_durasi_response_time_bulan_ini: 504207,
|
||||||
|
count_durasi_response_time_bulan_ini: 516,
|
||||||
|
avg_durasi_response_time_bulan_ini: 977.1453488372093,
|
||||||
|
total_durasi_recovery_time_bulan_ini: 974512,
|
||||||
|
count_durasi_recovery_time_bulan_ini: 516,
|
||||||
|
avg_durasi_recovery_time_bulan_ini: 1888.5891472868218,
|
||||||
|
total_durasi_response_time_tahun_ini: 5776799,
|
||||||
|
count_durasi_response_time_tahun_ini: 5202,
|
||||||
|
avg_durasi_response_time_tahun_ini: 1110.4957708573625,
|
||||||
|
total_durasi_recovery_time_tahun_ini: 10668074,
|
||||||
|
count_durasi_recovery_time_tahun_ini: 5035,
|
||||||
|
avg_durasi_recovery_time_tahun_ini: 1110.4957708573625
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 14,
|
||||||
|
nama_regional: 'REGIONAL JMB',
|
||||||
|
id_uid: 103,
|
||||||
|
nama_uid: 'DISTRIBUSI JAWA TIMUR',
|
||||||
|
id_up3: 153,
|
||||||
|
nama_up3: 'UP3 SIDOARJO',
|
||||||
|
id_ulp: 51182,
|
||||||
|
nama_ulp: 'ULP PORONG',
|
||||||
|
total_durasi_response_time_bulan_ini: 2711446,
|
||||||
|
count_durasi_response_time_bulan_ini: 2407,
|
||||||
|
avg_durasi_response_time_bulan_ini: 1126.483589530536,
|
||||||
|
total_durasi_recovery_time_bulan_ini: 4361855,
|
||||||
|
count_durasi_recovery_time_bulan_ini: 2407,
|
||||||
|
avg_durasi_recovery_time_bulan_ini: 1812.1541337764852,
|
||||||
|
total_durasi_response_time_tahun_ini: 27345376,
|
||||||
|
count_durasi_response_time_tahun_ini: 21982,
|
||||||
|
avg_durasi_response_time_tahun_ini: 1243.9894459102902,
|
||||||
|
total_durasi_recovery_time_tahun_ini: 43993555,
|
||||||
|
count_durasi_recovery_time_tahun_ini: 21919,
|
||||||
|
avg_durasi_recovery_time_tahun_ini: 1243.9894459102902
|
||||||
|
}
|
||||||
|
]
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
@ -1,44 +1,200 @@
|
|||||||
<template>
|
<template>
|
||||||
<Filters :report-button="true" @reset-form="data = []" @run-search="() => filterData(filters)" class="mb-4">
|
<Filters
|
||||||
<Type2 @update:filters="(value) => filters = value" />
|
:report-button="true"
|
||||||
|
@reset-form="data = []"
|
||||||
|
@run-search="() => filterData(filters)"
|
||||||
|
class="mb-4"
|
||||||
|
>
|
||||||
|
<Type2 @update:filters="(value) => (filters = value)" />
|
||||||
</Filters>
|
</Filters>
|
||||||
|
|
||||||
<div id="data">
|
<div id="data">
|
||||||
<DxDataGrid class="max-h-[calc(100vh-140px)] mb-10" :data-source="data" :show-column-lines="true"
|
<DxDataGrid
|
||||||
:show-row-lines="false" :show-borders="true" :row-alternation-enabled="true" :hover-state-enabled="true"
|
class="max-h-[calc(100vh-140px)] mb-10"
|
||||||
@selection-changed="onSelectionChanged" @exporting="onExporting" :allow-column-resizing="true"
|
:data-source="data"
|
||||||
column-resizing-mode="widget" :word-wrap-enabled="true">
|
: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" />
|
<DxSelection mode="single" />
|
||||||
<DxPaging :enabled="false" />
|
<DxPaging :enabled="false" />
|
||||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||||
<DxLoadPanel :position="position" :show-indicator="showIndicator" :show-pane="showPane" :shading="shading"
|
<DxLoadPanel
|
||||||
v-if="loading" v-model:visible="loading" :enabled="true" />
|
: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" />
|
<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" />
|
<DxColumnFixing :enabled="true" />
|
||||||
|
|
||||||
<DxColumn alignment="center" :min-width="170" data-type="text" data-field="nama_ulp" caption="Nama Unit"
|
<!-- <DxColumn
|
||||||
css-class="custom-table-column" :group-index="0" name="namaUlp" />
|
alignment="center"
|
||||||
<DxColumn alignment="center" :min-width="170" data-type="text" data-field="nama_ulp" caption="Nama Unit"
|
:min-width="170"
|
||||||
css-class="custom-table-column" />
|
data-type="text"
|
||||||
<DxColumn alignment="center" caption="Jumlah RCT Kali Gangguan" css-class="custom-table-column">
|
data-field="nama_ulp"
|
||||||
|
caption="Nama Unit"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
:group-index="0"
|
||||||
|
name="namaUlp"
|
||||||
|
/> -->
|
||||||
|
<DxColumn
|
||||||
|
alignment="center"
|
||||||
|
:min-width="170"
|
||||||
|
data-type="text"
|
||||||
|
data-field="nama_ulp"
|
||||||
|
caption="Nama Unit"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatText"
|
||||||
|
/>
|
||||||
|
<DxColumn
|
||||||
|
alignment="center"
|
||||||
|
caption="Jumlah RCT Kali Gangguan"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
>
|
||||||
<DxColumn alignment="center" caption="MoM" css-class="custom-table-column">
|
<DxColumn alignment="center" caption="MoM" css-class="custom-table-column">
|
||||||
<DxColumn :width="150" alignment="center" data-field="mom_bulan_kemarin" data-type="number"
|
<DxColumn
|
||||||
:caption="`${getMonthName(currentMonth)} ${lastYear}`" css-class="custom-table-column" />
|
:width="150"
|
||||||
<DxColumn :width="150" alignment="center" data-field="mom_bulan_ini" data-type="number"
|
alignment="center"
|
||||||
:caption="`${getMonthName(currentMonth)} ${currentYear}`" css-class="custom-table-column" />
|
data-field="mom_bulan_kemarin"
|
||||||
<DxColumn :width="70" alignment="center" data-field="persen_mom" data-type="number" caption="%"
|
data-type="number"
|
||||||
css-class="custom-table-column" />
|
:caption="`${getMonthName(currentMonth)} ${lastYear}`"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
|
<DxColumn
|
||||||
|
:width="150"
|
||||||
|
alignment="center"
|
||||||
|
data-field="mom_bulan_ini"
|
||||||
|
data-type="number"
|
||||||
|
:caption="`${getMonthName(currentMonth)} ${currentYear}`"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
|
<DxColumn
|
||||||
|
:width="70"
|
||||||
|
alignment="center"
|
||||||
|
data-field="persen_mom"
|
||||||
|
data-type="number"
|
||||||
|
caption="%"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
<DxColumn alignment="center" caption="YoY" css-class="custom-table-column">
|
<DxColumn alignment="center" caption="YoY" css-class="custom-table-column">
|
||||||
<DxColumn :width="150" alignment="center" data-field="yoy_tahun_kemarin" data-type="number"
|
<DxColumn
|
||||||
:caption="`s.d ${getMonthName(currentMonth)} ${lastYear}`" css-class="custom-table-column" />
|
:width="150"
|
||||||
<DxColumn :width="150" alignment="center" data-field="yoy_tahun_ini" data-type="number"
|
alignment="center"
|
||||||
:caption="`s.d ${getMonthName(currentMonth)} ${currentYear}`" css-class="custom-table-column" />
|
data-field="yoy_tahun_kemarin"
|
||||||
<DxColumn :width="70" alignment="center" data-field="persen_yoy" data-type="number" caption="%"
|
data-type="number"
|
||||||
css-class="custom-table-column" />
|
:caption="`s.d ${getMonthName(currentMonth)} ${lastYear}`"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
|
<DxColumn
|
||||||
|
:width="150"
|
||||||
|
alignment="center"
|
||||||
|
data-field="yoy_tahun_ini"
|
||||||
|
data-type="number"
|
||||||
|
:caption="`s.d ${getMonthName(currentMonth)} ${currentYear}`"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
|
<DxColumn
|
||||||
|
:width="70"
|
||||||
|
alignment="center"
|
||||||
|
data-field="persen_yoy"
|
||||||
|
data-type="number"
|
||||||
|
caption="%"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
|
|
||||||
|
<DxSummary>
|
||||||
|
<DxTotalItem
|
||||||
|
summary-type="sum"
|
||||||
|
display-format="Total"
|
||||||
|
show-in-column="nama_ulp"
|
||||||
|
css-class="text-white !text-left"
|
||||||
|
/>
|
||||||
|
<DxTotalItem
|
||||||
|
column="mom_bulan_kemarin"
|
||||||
|
summary-type="sum"
|
||||||
|
display-format="{0}"
|
||||||
|
css-class="text-white !text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxTotalItem
|
||||||
|
column="mom_bulan_ini"
|
||||||
|
summary-type="sum"
|
||||||
|
display-format="{0}"
|
||||||
|
css-class="text-white !text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxTotalItem
|
||||||
|
column="persen_mom"
|
||||||
|
summary-type="avg"
|
||||||
|
display-format="{0}"
|
||||||
|
css-class="text-white !text-right"
|
||||||
|
:customize-text="(e: any) => formatPercentage(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxTotalItem
|
||||||
|
column="yoy_tahun_kemarin"
|
||||||
|
summary-type="sum"
|
||||||
|
display-format="{0}"
|
||||||
|
css-class="text-white !text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxTotalItem
|
||||||
|
column="yoy_tahun_ini"
|
||||||
|
summary-type="sum"
|
||||||
|
display-format="{0}"
|
||||||
|
css-class="text-white !text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxTotalItem
|
||||||
|
column="persen_yoy"
|
||||||
|
summary-type="avg"
|
||||||
|
display-format="{0}"
|
||||||
|
css-class="text-white !text-right"
|
||||||
|
:customize-text="(e: any) => formatPercentage(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
</DxSummary>
|
||||||
|
|
||||||
|
<template #formatNumber="{ data }">
|
||||||
|
<p class="text-right">
|
||||||
|
{{
|
||||||
|
isNumber(data.text)
|
||||||
|
? data.column.caption == '%'
|
||||||
|
? formatPercentage(data.text)
|
||||||
|
: formatNumber(data.text)
|
||||||
|
: data.text
|
||||||
|
}}
|
||||||
|
</p>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<template #formatText="{ data }">
|
||||||
|
<p class="!text-left">
|
||||||
|
{{ data.text }}
|
||||||
|
</p>
|
||||||
|
</template>
|
||||||
</DxDataGrid>
|
</DxDataGrid>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@ -46,7 +202,7 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import Filters from '@/components/Form/Filters.vue'
|
import Filters from '@/components/Form/Filters.vue'
|
||||||
import Type2 from '@/components/Form/FiltersType/Type2.vue'
|
import Type2 from '@/components/Form/FiltersType/Type2.vue'
|
||||||
import { ref } from 'vue'
|
import { onMounted, ref } from 'vue'
|
||||||
import { DxDataGrid } from 'devextreme-vue'
|
import { DxDataGrid } from 'devextreme-vue'
|
||||||
import {
|
import {
|
||||||
DxColumn,
|
DxColumn,
|
||||||
@ -56,7 +212,9 @@ import {
|
|||||||
DxPaging,
|
DxPaging,
|
||||||
DxScrolling,
|
DxScrolling,
|
||||||
DxSearchPanel,
|
DxSearchPanel,
|
||||||
DxSelection
|
DxSelection,
|
||||||
|
DxSummary,
|
||||||
|
DxTotalItem
|
||||||
} from 'devextreme-vue/data-grid'
|
} from 'devextreme-vue/data-grid'
|
||||||
import { jsPDF } from 'jspdf'
|
import { jsPDF } from 'jspdf'
|
||||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||||
@ -66,6 +224,7 @@ import { Workbook } from 'exceljs'
|
|||||||
import { useQuery } from '@vue/apollo-composable'
|
import { useQuery } from '@vue/apollo-composable'
|
||||||
import { getMonthName } from '@/utils/texts'
|
import { getMonthName } from '@/utils/texts'
|
||||||
import { queries } from '@/utils/api/api.graphql'
|
import { queries } from '@/utils/api/api.graphql'
|
||||||
|
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
|
||||||
|
|
||||||
const currentYear = ref(new Date().getFullYear())
|
const currentYear = ref(new Date().getFullYear())
|
||||||
const currentMonth = ref(new Date().getMonth())
|
const currentMonth = ref(new Date().getMonth())
|
||||||
@ -76,14 +235,17 @@ const shading = ref(true)
|
|||||||
const showPane = ref(true)
|
const showPane = ref(true)
|
||||||
const data = ref<any[]>([])
|
const data = ref<any[]>([])
|
||||||
|
|
||||||
const { onResult, onError, loading, refetch } = useQuery(queries.monalisa.gangguan.rekap.recoveryTimeGangguan, {
|
const { onResult, onError, loading, refetch } = useQuery(
|
||||||
|
queries.monalisa.gangguan.rekap.recoveryTimeGangguan,
|
||||||
|
{
|
||||||
// regional: 0,
|
// regional: 0,
|
||||||
idUp3: 0,
|
idUp3: 0,
|
||||||
idUid: 0,
|
idUid: 0,
|
||||||
idUlp: 0,
|
idUlp: 0,
|
||||||
bulan: currentMonth.value,
|
bulan: currentMonth.value,
|
||||||
tahun: currentYear.value
|
tahun: currentYear.value
|
||||||
})
|
}
|
||||||
|
)
|
||||||
|
|
||||||
const filterData = (params: any) => {
|
const filterData = (params: any) => {
|
||||||
const { regional, ulp, uid, up3, bulan, tahun } = params
|
const { regional, ulp, uid, up3, bulan, tahun } = params
|
||||||
@ -146,4 +308,266 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const filters = ref()
|
const filters = ref()
|
||||||
|
onMounted(() => {
|
||||||
|
if (import.meta.env.DEV) {
|
||||||
|
data.value = [
|
||||||
|
{
|
||||||
|
id: 0,
|
||||||
|
nama_regional: null,
|
||||||
|
id_uid: 0,
|
||||||
|
nama_uid: '',
|
||||||
|
id_up3: 0,
|
||||||
|
nama_up3: '',
|
||||||
|
id_ulp: 0,
|
||||||
|
nama_ulp: '',
|
||||||
|
mom_bulan_ini: 12443791,
|
||||||
|
mom_bulan_kemarin: 9182428,
|
||||||
|
persen_mom: -35.517436129093525,
|
||||||
|
yoy_tahun_ini: 139773892,
|
||||||
|
yoy_tahun_kemarin: 168209007,
|
||||||
|
persen_yoy: 16.904632817908496
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 120,
|
||||||
|
nama_uid: 'WILAYAH SUMATERA UTARA',
|
||||||
|
id_up3: 12100,
|
||||||
|
nama_up3: 'UP3 PEMATANG SIANTAR',
|
||||||
|
id_ulp: 12102,
|
||||||
|
nama_ulp: 'ULP LIMA PULUH',
|
||||||
|
mom_bulan_ini: 16186,
|
||||||
|
mom_bulan_kemarin: 112331,
|
||||||
|
persen_mom: 85.59079862192984,
|
||||||
|
yoy_tahun_ini: 354676,
|
||||||
|
yoy_tahun_kemarin: 624303,
|
||||||
|
persen_yoy: 43.18848379713056
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 2,
|
||||||
|
nama_regional: 'REGIONAL SULMAPANA',
|
||||||
|
id_uid: 41,
|
||||||
|
nama_uid: 'WILAYAH MALUKU DAN MALUKU UTARA',
|
||||||
|
id_up3: 412,
|
||||||
|
nama_up3: 'UP3 TERNATE',
|
||||||
|
id_ulp: 41230,
|
||||||
|
nama_ulp: 'ULP BACAN',
|
||||||
|
mom_bulan_ini: 384375,
|
||||||
|
mom_bulan_kemarin: 22976,
|
||||||
|
persen_mom: -1572.9413300835654,
|
||||||
|
yoy_tahun_ini: 1643180,
|
||||||
|
yoy_tahun_kemarin: 492691,
|
||||||
|
persen_yoy: -233.51126771140534
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 3,
|
||||||
|
nama_regional: 'REGIONAL JMB',
|
||||||
|
id_uid: 101,
|
||||||
|
nama_uid: 'DISTRIBUSI JAWA TENGAH & DIY',
|
||||||
|
id_up3: 52150,
|
||||||
|
nama_up3: 'UP3 MAGELANG',
|
||||||
|
id_ulp: 52156,
|
||||||
|
nama_ulp: 'ULP PARAKAN',
|
||||||
|
mom_bulan_ini: 914842,
|
||||||
|
mom_bulan_kemarin: 585884,
|
||||||
|
persen_mom: -56.14729195540414,
|
||||||
|
yoy_tahun_ini: 8072389,
|
||||||
|
yoy_tahun_kemarin: 11055796,
|
||||||
|
persen_yoy: 26.985004064836215
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 4,
|
||||||
|
nama_regional: 'REGIONAL SULMAPANA',
|
||||||
|
id_uid: 31,
|
||||||
|
nama_uid: 'WILAYAH SULAWESI UTARA,TENGAH DAN GORONTALO',
|
||||||
|
id_up3: 31500,
|
||||||
|
nama_up3: 'UP3 TOLITOLI',
|
||||||
|
id_ulp: 31530,
|
||||||
|
nama_ulp: 'ULP BANGKIR',
|
||||||
|
mom_bulan_ini: 43840,
|
||||||
|
mom_bulan_kemarin: 59012,
|
||||||
|
persen_mom: 25.710025079644815,
|
||||||
|
yoy_tahun_ini: 1098120,
|
||||||
|
yoy_tahun_kemarin: 2481724,
|
||||||
|
persen_yoy: 55.751727428191046
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 5,
|
||||||
|
nama_regional: 'REGIONAL JMB',
|
||||||
|
id_uid: 103,
|
||||||
|
nama_uid: 'DISTRIBUSI JAWA TIMUR',
|
||||||
|
id_up3: 154,
|
||||||
|
nama_up3: 'UP3 SITUBONDO',
|
||||||
|
id_ulp: 51654,
|
||||||
|
nama_ulp: 'ULP WONOSARI',
|
||||||
|
mom_bulan_ini: 796862,
|
||||||
|
mom_bulan_kemarin: 673478,
|
||||||
|
persen_mom: -18.32042026614084,
|
||||||
|
yoy_tahun_ini: 6845897,
|
||||||
|
yoy_tahun_kemarin: 7566389,
|
||||||
|
persen_yoy: 9.522270134406254
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 6,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 110,
|
||||||
|
nama_uid: 'WILAYAH ACEH',
|
||||||
|
id_up3: 116,
|
||||||
|
nama_up3: 'UP3 SIGLI',
|
||||||
|
id_ulp: 11662,
|
||||||
|
nama_ulp: 'ULP MEUREUDU',
|
||||||
|
mom_bulan_ini: 787315,
|
||||||
|
mom_bulan_kemarin: 264692,
|
||||||
|
persen_mom: -197.44571048614995,
|
||||||
|
yoy_tahun_ini: 7747710,
|
||||||
|
yoy_tahun_kemarin: 7916066,
|
||||||
|
persen_yoy: 2.12676347064312
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 7,
|
||||||
|
nama_regional: 'REGIONAL JMB',
|
||||||
|
id_uid: 287,
|
||||||
|
nama_uid: 'DISTRIBUSI BALI',
|
||||||
|
id_up3: 329,
|
||||||
|
nama_up3: 'UP3 BALI UTARA',
|
||||||
|
id_ulp: 55340,
|
||||||
|
nama_ulp: 'ULP GILIMANUK',
|
||||||
|
mom_bulan_ini: 505036,
|
||||||
|
mom_bulan_kemarin: 413603,
|
||||||
|
persen_mom: -22.10646441152506,
|
||||||
|
yoy_tahun_ini: 7155021,
|
||||||
|
yoy_tahun_kemarin: 5869321,
|
||||||
|
persen_yoy: -21.905429946666743
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 8,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 131,
|
||||||
|
nama_uid: 'WILAYAH SUMATERA BARAT',
|
||||||
|
id_up3: 13300,
|
||||||
|
nama_up3: 'UP3 SOLOK',
|
||||||
|
id_ulp: 13334,
|
||||||
|
nama_ulp: 'ULP SILUNGKANG',
|
||||||
|
mom_bulan_ini: 160505,
|
||||||
|
mom_bulan_kemarin: 379378,
|
||||||
|
persen_mom: 57.69259155776033,
|
||||||
|
yoy_tahun_ini: 1509396,
|
||||||
|
yoy_tahun_kemarin: 3844624,
|
||||||
|
persen_yoy: 60.740087977393884
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 9,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 221,
|
||||||
|
nama_uid: 'WILAYAH KALIMANTAN SELATAN DAN TENGAH',
|
||||||
|
id_up3: 2220,
|
||||||
|
nama_up3: 'UP3 BARABAI',
|
||||||
|
id_ulp: 22230,
|
||||||
|
nama_ulp: 'ULP AMUNTAI',
|
||||||
|
mom_bulan_ini: 181058,
|
||||||
|
mom_bulan_kemarin: 395103,
|
||||||
|
persen_mom: 54.17448108467918,
|
||||||
|
yoy_tahun_ini: 2039104,
|
||||||
|
yoy_tahun_kemarin: 5170462,
|
||||||
|
persen_yoy: 60.56244103524985
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 10,
|
||||||
|
nama_regional: 'REGIONAL SULMAPANA',
|
||||||
|
id_uid: 31,
|
||||||
|
nama_uid: 'WILAYAH SULAWESI UTARA,TENGAH DAN GORONTALO',
|
||||||
|
id_up3: 31700,
|
||||||
|
nama_up3: 'UP3 KOTAMOBAGU',
|
||||||
|
id_ulp: 31730,
|
||||||
|
nama_ulp: 'ULP MODAYAG',
|
||||||
|
mom_bulan_ini: 83184,
|
||||||
|
mom_bulan_kemarin: 144261,
|
||||||
|
persen_mom: 42.337845987481025,
|
||||||
|
yoy_tahun_ini: 1111887,
|
||||||
|
yoy_tahun_kemarin: 2440181,
|
||||||
|
persen_yoy: 54.4342407386993
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 11,
|
||||||
|
nama_regional: 'REGIONAL JMB',
|
||||||
|
id_uid: 427,
|
||||||
|
nama_uid: 'DISTRIBUSI JAWA BARAT',
|
||||||
|
id_up3: 546,
|
||||||
|
nama_up3: 'UP3 TASIKMALAYA',
|
||||||
|
id_ulp: 53231,
|
||||||
|
nama_ulp: 'ULP CIAMIS',
|
||||||
|
mom_bulan_ini: 843557,
|
||||||
|
mom_bulan_kemarin: 1369703,
|
||||||
|
persen_mom: 38.41314503947206,
|
||||||
|
yoy_tahun_ini: 8579030,
|
||||||
|
yoy_tahun_kemarin: 16227325,
|
||||||
|
persen_yoy: 47.13219831364689
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 12,
|
||||||
|
nama_regional: 'REGIONAL JMB',
|
||||||
|
id_uid: 103,
|
||||||
|
nama_uid: 'DISTRIBUSI JAWA TIMUR',
|
||||||
|
id_up3: 157,
|
||||||
|
nama_up3: 'UP3 SURABAYA UTARA',
|
||||||
|
id_ulp: 51101,
|
||||||
|
nama_ulp: 'ULP INDRAPURA',
|
||||||
|
mom_bulan_ini: 433495,
|
||||||
|
mom_bulan_kemarin: 404500,
|
||||||
|
persen_mom: -7.168108776266996,
|
||||||
|
yoy_tahun_ini: 4905051,
|
||||||
|
yoy_tahun_kemarin: 4976204,
|
||||||
|
persen_yoy: 1.4298650135725948
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 13,
|
||||||
|
nama_regional: 'REGIONAL SULMAPANA',
|
||||||
|
id_uid: 41,
|
||||||
|
nama_uid: 'WILAYAH MALUKU DAN MALUKU UTARA',
|
||||||
|
id_up3: 414,
|
||||||
|
nama_up3: 'UP3 MASOHI',
|
||||||
|
id_ulp: 41430,
|
||||||
|
nama_ulp: 'ULP MASOHI',
|
||||||
|
mom_bulan_ini: 97727,
|
||||||
|
mom_bulan_kemarin: 75563,
|
||||||
|
persen_mom: -29.331815835792654,
|
||||||
|
yoy_tahun_ini: 1842074,
|
||||||
|
yoy_tahun_kemarin: 686794,
|
||||||
|
persen_yoy: -168.21346721142
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 14,
|
||||||
|
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',
|
||||||
|
mom_bulan_ini: 483861,
|
||||||
|
mom_bulan_kemarin: 1000406,
|
||||||
|
persen_mom: 51.63353678406567,
|
||||||
|
yoy_tahun_ini: 5168384,
|
||||||
|
yoy_tahun_kemarin: 8611936,
|
||||||
|
persen_yoy: 39.98580574681465
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 15,
|
||||||
|
nama_regional: 'REGIONAL JMB',
|
||||||
|
id_uid: 103,
|
||||||
|
nama_uid: 'DISTRIBUSI JAWA TIMUR',
|
||||||
|
id_up3: 153,
|
||||||
|
nama_up3: 'UP3 SIDOARJO',
|
||||||
|
id_ulp: 51182,
|
||||||
|
nama_ulp: 'ULP PORONG',
|
||||||
|
mom_bulan_ini: 1657675,
|
||||||
|
mom_bulan_kemarin: 973693,
|
||||||
|
persen_mom: -70.246165885962,
|
||||||
|
yoy_tahun_ini: 16774614,
|
||||||
|
yoy_tahun_kemarin: 12737494,
|
||||||
|
persen_yoy: -31.694774498029204
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
@ -1,44 +1,200 @@
|
|||||||
<template>
|
<template>
|
||||||
<Filters @reset-form="data = []" :report-button="true" @run-search="() => filterData(filters)" class="mb-4">
|
<Filters
|
||||||
<Type2 @update:filters="(value) => filters = value" />
|
@reset-form="data = []"
|
||||||
|
:report-button="true"
|
||||||
|
@run-search="() => filterData(filters)"
|
||||||
|
class="mb-4"
|
||||||
|
>
|
||||||
|
<Type2 @update:filters="(value) => (filters = value)" />
|
||||||
</Filters>
|
</Filters>
|
||||||
|
|
||||||
<div id="data">
|
<div id="data">
|
||||||
<DxDataGrid class="max-h-[calc(100vh-140px)] mb-10" :data-source="data" :show-column-lines="true"
|
<DxDataGrid
|
||||||
:show-row-lines="false" :show-borders="true" :row-alternation-enabled="true" :hover-state-enabled="true"
|
class="max-h-[calc(100vh-140px)] mb-10"
|
||||||
@selection-changed="onSelectionChanged" @exporting="onExporting" :allow-column-resizing="true"
|
:data-source="data"
|
||||||
column-resizing-mode="widget" :word-wrap-enabled="true">
|
: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" />
|
<DxSelection mode="single" />
|
||||||
<DxPaging :enabled="false" />
|
<DxPaging :enabled="false" />
|
||||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||||
<DxLoadPanel :position="position" :show-indicator="showIndicator" :show-pane="showPane" :shading="shading"
|
<DxLoadPanel
|
||||||
v-if="loading" v-model:visible="loading" :enabled="true" />
|
: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" />
|
<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" />
|
<DxColumnFixing :enabled="true" />
|
||||||
|
|
||||||
<DxColumn alignment="center" :min-width="170" data-type="text" data-field="nama_ulp" caption="Nama Unit"
|
<!-- <DxColumn
|
||||||
css-class="custom-table-column" :group-index="0" name="namaUlp" />
|
alignment="center"
|
||||||
<DxColumn alignment="center" :min-width="170" data-type="text" data-field="nama_ulp" caption="Nama Unit"
|
:min-width="170"
|
||||||
css-class="custom-table-column" />
|
data-type="text"
|
||||||
<DxColumn alignment="center" caption="Jumlah RPT Kali Gangguan" css-class="custom-table-column">
|
data-field="nama_ulp"
|
||||||
|
caption="Nama Unit"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
:group-index="0"
|
||||||
|
name="namaUlp"
|
||||||
|
/> -->
|
||||||
|
<DxColumn
|
||||||
|
alignment="center"
|
||||||
|
:min-width="170"
|
||||||
|
data-type="text"
|
||||||
|
data-field="nama_ulp"
|
||||||
|
caption="Nama Unit"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatText"
|
||||||
|
/>
|
||||||
|
<DxColumn
|
||||||
|
alignment="center"
|
||||||
|
caption="Jumlah RPT Kali Gangguan"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
>
|
||||||
<DxColumn alignment="center" caption="MoM" css-class="custom-table-column">
|
<DxColumn alignment="center" caption="MoM" css-class="custom-table-column">
|
||||||
<DxColumn :width="150" alignment="center" data-field="mom_bulan_kemarin" data-type="number"
|
<DxColumn
|
||||||
:caption="`${getMonthName(currentMonth)} ${lastYear}`" css-class="custom-table-column" />
|
:width="150"
|
||||||
<DxColumn :width="150" alignment="center" data-field="mom_bulan_ini" data-type="number"
|
alignment="center"
|
||||||
:caption="`${getMonthName(currentMonth)} ${currentYear}`" css-class="custom-table-column" />
|
data-field="mom_bulan_kemarin"
|
||||||
<DxColumn :width="70" alignment="center" data-field="persen_mom" data-type="number" caption="%"
|
data-type="number"
|
||||||
css-class="custom-table-column" />
|
:caption="`${getMonthName(currentMonth)} ${lastYear}`"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
|
<DxColumn
|
||||||
|
:width="150"
|
||||||
|
alignment="center"
|
||||||
|
data-field="mom_bulan_ini"
|
||||||
|
data-type="number"
|
||||||
|
:caption="`${getMonthName(currentMonth)} ${currentYear}`"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
|
<DxColumn
|
||||||
|
:width="70"
|
||||||
|
alignment="center"
|
||||||
|
data-field="persen_mom"
|
||||||
|
data-type="number"
|
||||||
|
caption="%"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
<DxColumn alignment="center" caption="YoY" css-class="custom-table-column">
|
<DxColumn alignment="center" caption="YoY" css-class="custom-table-column">
|
||||||
<DxColumn :width="150" alignment="center" data-field="yoy_tahun_kemarin" data-type="number"
|
<DxColumn
|
||||||
:caption="`s.d ${getMonthName(currentMonth)} ${lastYear}`" css-class="custom-table-column" />
|
:width="150"
|
||||||
<DxColumn :width="150" alignment="center" data-field="yoy_tahun_ini" data-type="number"
|
alignment="center"
|
||||||
:caption="`s.d ${getMonthName(currentMonth)} ${currentYear}`" css-class="custom-table-column" />
|
data-field="yoy_tahun_kemarin"
|
||||||
<DxColumn :width="70" alignment="center" data-field="persen_yoy" data-type="number" caption="%"
|
data-type="number"
|
||||||
css-class="custom-table-column" />
|
:caption="`s.d ${getMonthName(currentMonth)} ${lastYear}`"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
|
<DxColumn
|
||||||
|
:width="150"
|
||||||
|
alignment="center"
|
||||||
|
data-field="yoy_tahun_ini"
|
||||||
|
data-type="number"
|
||||||
|
:caption="`s.d ${getMonthName(currentMonth)} ${currentYear}`"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
|
<DxColumn
|
||||||
|
:width="70"
|
||||||
|
alignment="center"
|
||||||
|
data-field="persen_yoy"
|
||||||
|
data-type="number"
|
||||||
|
caption="%"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatNumber"
|
||||||
|
/>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
</DxColumn>
|
</DxColumn>
|
||||||
|
|
||||||
|
<DxSummary>
|
||||||
|
<DxTotalItem
|
||||||
|
summary-type="sum"
|
||||||
|
display-format="Total"
|
||||||
|
show-in-column="nama_ulp"
|
||||||
|
css-class="text-white !text-left"
|
||||||
|
/>
|
||||||
|
<DxTotalItem
|
||||||
|
column="mom_bulan_kemarin"
|
||||||
|
summary-type="sum"
|
||||||
|
display-format="{0}"
|
||||||
|
css-class="text-white !text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxTotalItem
|
||||||
|
column="mom_bulan_ini"
|
||||||
|
summary-type="sum"
|
||||||
|
display-format="{0}"
|
||||||
|
css-class="text-white !text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxTotalItem
|
||||||
|
column="persen_mom"
|
||||||
|
summary-type="avg"
|
||||||
|
display-format="{0}"
|
||||||
|
css-class="text-white !text-right"
|
||||||
|
:customize-text="(e: any) => formatPercentage(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxTotalItem
|
||||||
|
column="yoy_tahun_kemarin"
|
||||||
|
summary-type="sum"
|
||||||
|
display-format="{0}"
|
||||||
|
css-class="text-white !text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxTotalItem
|
||||||
|
column="yoy_tahun_ini"
|
||||||
|
summary-type="sum"
|
||||||
|
display-format="{0}"
|
||||||
|
css-class="text-white !text-right"
|
||||||
|
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
<DxTotalItem
|
||||||
|
column="persen_yoy"
|
||||||
|
summary-type="avg"
|
||||||
|
display-format="{0}"
|
||||||
|
css-class="text-white !text-right"
|
||||||
|
:customize-text="(e: any) => formatPercentage(parseFloat(e.value.toString()))"
|
||||||
|
/>
|
||||||
|
</DxSummary>
|
||||||
|
|
||||||
|
<template #formatNumber="{ data }">
|
||||||
|
<p class="text-right">
|
||||||
|
{{
|
||||||
|
isNumber(data.text)
|
||||||
|
? data.column.caption == '%'
|
||||||
|
? formatPercentage(data.text)
|
||||||
|
: formatNumber(data.text)
|
||||||
|
: data.text
|
||||||
|
}}
|
||||||
|
</p>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<template #formatText="{ data }">
|
||||||
|
<p class="!text-left">
|
||||||
|
{{ data.text }}
|
||||||
|
</p>
|
||||||
|
</template>
|
||||||
</DxDataGrid>
|
</DxDataGrid>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@ -46,7 +202,7 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import Filters from '@/components/Form/Filters.vue'
|
import Filters from '@/components/Form/Filters.vue'
|
||||||
import Type2 from '@/components/Form/FiltersType/Type2.vue'
|
import Type2 from '@/components/Form/FiltersType/Type2.vue'
|
||||||
import { ref } from 'vue'
|
import { onMounted, ref } from 'vue'
|
||||||
import { DxDataGrid } from 'devextreme-vue'
|
import { DxDataGrid } from 'devextreme-vue'
|
||||||
import {
|
import {
|
||||||
DxColumn,
|
DxColumn,
|
||||||
@ -56,7 +212,9 @@ import {
|
|||||||
DxPaging,
|
DxPaging,
|
||||||
DxScrolling,
|
DxScrolling,
|
||||||
DxSearchPanel,
|
DxSearchPanel,
|
||||||
DxSelection
|
DxSelection,
|
||||||
|
DxSummary,
|
||||||
|
DxTotalItem
|
||||||
} from 'devextreme-vue/data-grid'
|
} from 'devextreme-vue/data-grid'
|
||||||
import { jsPDF } from 'jspdf'
|
import { jsPDF } from 'jspdf'
|
||||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||||
@ -66,6 +224,7 @@ import { Workbook } from 'exceljs'
|
|||||||
import { useQuery } from '@vue/apollo-composable'
|
import { useQuery } from '@vue/apollo-composable'
|
||||||
import { getMonthName } from '@/utils/texts'
|
import { getMonthName } from '@/utils/texts'
|
||||||
import { queries } from '@/utils/api/api.graphql'
|
import { queries } from '@/utils/api/api.graphql'
|
||||||
|
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
|
||||||
|
|
||||||
const currentYear = ref(new Date().getFullYear())
|
const currentYear = ref(new Date().getFullYear())
|
||||||
const currentMonth = ref(new Date().getMonth())
|
const currentMonth = ref(new Date().getMonth())
|
||||||
@ -76,14 +235,17 @@ const shading = ref(true)
|
|||||||
const showPane = ref(true)
|
const showPane = ref(true)
|
||||||
const data = ref<any[]>([])
|
const data = ref<any[]>([])
|
||||||
|
|
||||||
const { onResult, onError, loading, refetch } = useQuery(queries.monalisa.gangguan.rekap.responseTimeGangguan, {
|
const { onResult, onError, loading, refetch } = useQuery(
|
||||||
|
queries.monalisa.gangguan.rekap.responseTimeGangguan,
|
||||||
|
{
|
||||||
// regional: 0,
|
// regional: 0,
|
||||||
idUp3: 0,
|
idUp3: 0,
|
||||||
idUid: 0,
|
idUid: 0,
|
||||||
idUlp: 0,
|
idUlp: 0,
|
||||||
bulan: currentMonth.value,
|
bulan: currentMonth.value,
|
||||||
tahun: currentYear.value
|
tahun: currentYear.value
|
||||||
})
|
}
|
||||||
|
)
|
||||||
|
|
||||||
const filterData = (params: any) => {
|
const filterData = (params: any) => {
|
||||||
const { regional, ulp, uid, up3, bulan, tahun } = params
|
const { regional, ulp, uid, up3, bulan, tahun } = params
|
||||||
@ -146,4 +308,282 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const filters = ref()
|
const filters = ref()
|
||||||
|
onMounted(() => {
|
||||||
|
if (import.meta.env.DEV) {
|
||||||
|
data.value = [
|
||||||
|
{
|
||||||
|
id: 0,
|
||||||
|
nama_regional: null,
|
||||||
|
id_uid: 0,
|
||||||
|
nama_uid: '',
|
||||||
|
id_up3: 0,
|
||||||
|
nama_up3: '',
|
||||||
|
id_ulp: 0,
|
||||||
|
nama_ulp: '',
|
||||||
|
mom_bulan_ini: 12443791,
|
||||||
|
mom_bulan_kemarin: 9182428,
|
||||||
|
persen_mom: -35.517436129093525,
|
||||||
|
yoy_tahun_ini: 139773892,
|
||||||
|
yoy_tahun_kemarin: 168209007,
|
||||||
|
persen_yoy: 16.904632817908496
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 120,
|
||||||
|
nama_uid: 'WILAYAH SUMATERA UTARA',
|
||||||
|
id_up3: 12100,
|
||||||
|
nama_up3: 'UP3 PEMATANG SIANTAR',
|
||||||
|
id_ulp: 12102,
|
||||||
|
nama_ulp: 'ULP LIMA PULUH',
|
||||||
|
mom_bulan_ini: 16186,
|
||||||
|
mom_bulan_kemarin: 112331,
|
||||||
|
persen_mom: 85.59079862192984,
|
||||||
|
yoy_tahun_ini: 354676,
|
||||||
|
yoy_tahun_kemarin: 624303,
|
||||||
|
persen_yoy: 43.18848379713056
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 2,
|
||||||
|
nama_regional: 'REGIONAL SULMAPANA',
|
||||||
|
id_uid: 41,
|
||||||
|
nama_uid: 'WILAYAH MALUKU DAN MALUKU UTARA',
|
||||||
|
id_up3: 412,
|
||||||
|
nama_up3: 'UP3 TERNATE',
|
||||||
|
id_ulp: 41230,
|
||||||
|
nama_ulp: 'ULP BACAN',
|
||||||
|
mom_bulan_ini: 384375,
|
||||||
|
mom_bulan_kemarin: 22976,
|
||||||
|
persen_mom: -1572.9413300835654,
|
||||||
|
yoy_tahun_ini: 1643180,
|
||||||
|
yoy_tahun_kemarin: 492691,
|
||||||
|
persen_yoy: -233.51126771140534
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 3,
|
||||||
|
nama_regional: 'REGIONAL JMB',
|
||||||
|
id_uid: 101,
|
||||||
|
nama_uid: 'DISTRIBUSI JAWA TENGAH & DIY',
|
||||||
|
id_up3: 52150,
|
||||||
|
nama_up3: 'UP3 MAGELANG',
|
||||||
|
id_ulp: 52156,
|
||||||
|
nama_ulp: 'ULP PARAKAN',
|
||||||
|
mom_bulan_ini: 914842,
|
||||||
|
mom_bulan_kemarin: 585884,
|
||||||
|
persen_mom: -56.14729195540414,
|
||||||
|
yoy_tahun_ini: 8072389,
|
||||||
|
yoy_tahun_kemarin: 11055796,
|
||||||
|
persen_yoy: 26.985004064836215
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 4,
|
||||||
|
nama_regional: 'REGIONAL SULMAPANA',
|
||||||
|
id_uid: 31,
|
||||||
|
nama_uid: 'WILAYAH SULAWESI UTARA,TENGAH DAN GORONTALO',
|
||||||
|
id_up3: 31500,
|
||||||
|
nama_up3: 'UP3 TOLITOLI',
|
||||||
|
id_ulp: 31530,
|
||||||
|
nama_ulp: 'ULP BANGKIR',
|
||||||
|
mom_bulan_ini: 43840,
|
||||||
|
mom_bulan_kemarin: 59012,
|
||||||
|
persen_mom: 25.710025079644815,
|
||||||
|
yoy_tahun_ini: 1098120,
|
||||||
|
yoy_tahun_kemarin: 2481724,
|
||||||
|
persen_yoy: 55.751727428191046
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 5,
|
||||||
|
nama_regional: 'REGIONAL JMB',
|
||||||
|
id_uid: 103,
|
||||||
|
nama_uid: 'DISTRIBUSI JAWA TIMUR',
|
||||||
|
id_up3: 154,
|
||||||
|
nama_up3: 'UP3 SITUBONDO',
|
||||||
|
id_ulp: 51654,
|
||||||
|
nama_ulp: 'ULP WONOSARI',
|
||||||
|
mom_bulan_ini: 796862,
|
||||||
|
mom_bulan_kemarin: 673478,
|
||||||
|
persen_mom: -18.32042026614084,
|
||||||
|
yoy_tahun_ini: 6845897,
|
||||||
|
yoy_tahun_kemarin: 7566389,
|
||||||
|
persen_yoy: 9.522270134406254
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 6,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 110,
|
||||||
|
nama_uid: 'WILAYAH ACEH',
|
||||||
|
id_up3: 116,
|
||||||
|
nama_up3: 'UP3 SIGLI',
|
||||||
|
id_ulp: 11662,
|
||||||
|
nama_ulp: 'ULP MEUREUDU',
|
||||||
|
mom_bulan_ini: 787315,
|
||||||
|
mom_bulan_kemarin: 264692,
|
||||||
|
persen_mom: -197.44571048614995,
|
||||||
|
yoy_tahun_ini: 7747710,
|
||||||
|
yoy_tahun_kemarin: 7916066,
|
||||||
|
persen_yoy: 2.12676347064312
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 7,
|
||||||
|
nama_regional: 'REGIONAL JMB',
|
||||||
|
id_uid: 287,
|
||||||
|
nama_uid: 'DISTRIBUSI BALI',
|
||||||
|
id_up3: 329,
|
||||||
|
nama_up3: 'UP3 BALI UTARA',
|
||||||
|
id_ulp: 55340,
|
||||||
|
nama_ulp: 'ULP GILIMANUK',
|
||||||
|
mom_bulan_ini: 505036,
|
||||||
|
mom_bulan_kemarin: 413603,
|
||||||
|
persen_mom: -22.10646441152506,
|
||||||
|
yoy_tahun_ini: 7155021,
|
||||||
|
yoy_tahun_kemarin: 5869321,
|
||||||
|
persen_yoy: -21.905429946666743
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 8,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 131,
|
||||||
|
nama_uid: 'WILAYAH SUMATERA BARAT',
|
||||||
|
id_up3: 13300,
|
||||||
|
nama_up3: 'UP3 SOLOK',
|
||||||
|
id_ulp: 13334,
|
||||||
|
nama_ulp: 'ULP SILUNGKANG',
|
||||||
|
mom_bulan_ini: 160505,
|
||||||
|
mom_bulan_kemarin: 379378,
|
||||||
|
persen_mom: 57.69259155776033,
|
||||||
|
yoy_tahun_ini: 1509396,
|
||||||
|
yoy_tahun_kemarin: 3844624,
|
||||||
|
persen_yoy: 60.740087977393884
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 9,
|
||||||
|
nama_regional: 'REGIONAL SUMKAL',
|
||||||
|
id_uid: 221,
|
||||||
|
nama_uid: 'WILAYAH KALIMANTAN SELATAN DAN TENGAH',
|
||||||
|
id_up3: 2220,
|
||||||
|
nama_up3: 'UP3 BARABAI',
|
||||||
|
id_ulp: 22230,
|
||||||
|
nama_ulp: 'ULP AMUNTAI',
|
||||||
|
mom_bulan_ini: 181058,
|
||||||
|
mom_bulan_kemarin: 395103,
|
||||||
|
persen_mom: 54.17448108467918,
|
||||||
|
yoy_tahun_ini: 2039104,
|
||||||
|
yoy_tahun_kemarin: 5170462,
|
||||||
|
persen_yoy: 60.56244103524985
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 10,
|
||||||
|
nama_regional: 'REGIONAL SULMAPANA',
|
||||||
|
id_uid: 31,
|
||||||
|
nama_uid: 'WILAYAH SULAWESI UTARA,TENGAH DAN GORONTALO',
|
||||||
|
id_up3: 31700,
|
||||||
|
nama_up3: 'UP3 KOTAMOBAGU',
|
||||||
|
id_ulp: 31730,
|
||||||
|
nama_ulp: 'ULP MODAYAG',
|
||||||
|
mom_bulan_ini: 83184,
|
||||||
|
mom_bulan_kemarin: 144261,
|
||||||
|
persen_mom: 42.337845987481025,
|
||||||
|
yoy_tahun_ini: 1111887,
|
||||||
|
yoy_tahun_kemarin: 2440181,
|
||||||
|
persen_yoy: 54.4342407386993
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 11,
|
||||||
|
nama_regional: 'REGIONAL JMB',
|
||||||
|
id_uid: 427,
|
||||||
|
nama_uid: 'DISTRIBUSI JAWA BARAT',
|
||||||
|
id_up3: 546,
|
||||||
|
nama_up3: 'UP3 TASIKMALAYA',
|
||||||
|
id_ulp: 53231,
|
||||||
|
nama_ulp: 'ULP CIAMIS',
|
||||||
|
mom_bulan_ini: 843557,
|
||||||
|
mom_bulan_kemarin: 1369703,
|
||||||
|
persen_mom: 38.41314503947206,
|
||||||
|
yoy_tahun_ini: 8579030,
|
||||||
|
yoy_tahun_kemarin: 16227325,
|
||||||
|
persen_yoy: 47.13219831364689
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 12,
|
||||||
|
nama_regional: 'REGIONAL JMB',
|
||||||
|
id_uid: 103,
|
||||||
|
nama_uid: 'DISTRIBUSI JAWA TIMUR',
|
||||||
|
id_up3: 157,
|
||||||
|
nama_up3: 'UP3 SURABAYA UTARA',
|
||||||
|
id_ulp: 51101,
|
||||||
|
nama_ulp: 'ULP INDRAPURA',
|
||||||
|
mom_bulan_ini: 433495,
|
||||||
|
mom_bulan_kemarin: 404500,
|
||||||
|
persen_mom: -7.168108776266996,
|
||||||
|
yoy_tahun_ini: 4905051,
|
||||||
|
yoy_tahun_kemarin: 4976204,
|
||||||
|
persen_yoy: 1.4298650135725948
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 13,
|
||||||
|
nama_regional: 'REGIONAL SULMAPANA',
|
||||||
|
id_uid: 41,
|
||||||
|
nama_uid: 'WILAYAH MALUKU DAN MALUKU UTARA',
|
||||||
|
id_up3: 414,
|
||||||
|
nama_up3: 'UP3 MASOHI',
|
||||||
|
id_ulp: 41430,
|
||||||
|
nama_ulp: 'ULP MASOHI',
|
||||||
|
mom_bulan_ini: 97727,
|
||||||
|
mom_bulan_kemarin: 75563,
|
||||||
|
persen_mom: -29.331815835792654,
|
||||||
|
yoy_tahun_ini: 1842074,
|
||||||
|
yoy_tahun_kemarin: 686794,
|
||||||
|
persen_yoy: -168.21346721142
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 14,
|
||||||
|
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',
|
||||||
|
mom_bulan_ini: 483861,
|
||||||
|
mom_bulan_kemarin: 1000406,
|
||||||
|
persen_mom: 51.63353678406567,
|
||||||
|
yoy_tahun_ini: 5168384,
|
||||||
|
yoy_tahun_kemarin: 8611936,
|
||||||
|
persen_yoy: 39.98580574681465
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 15,
|
||||||
|
nama_regional: 'REGIONAL JMB',
|
||||||
|
id_uid: 103,
|
||||||
|
nama_uid: 'DISTRIBUSI JAWA TIMUR',
|
||||||
|
id_up3: 153,
|
||||||
|
nama_up3: 'UP3 SIDOARJO',
|
||||||
|
id_ulp: 51182,
|
||||||
|
nama_ulp: 'ULP PORONG',
|
||||||
|
mom_bulan_ini: 1657675,
|
||||||
|
mom_bulan_kemarin: 973693,
|
||||||
|
persen_mom: -70.246165885962,
|
||||||
|
yoy_tahun_ini: 16774614,
|
||||||
|
yoy_tahun_kemarin: 12737494,
|
||||||
|
persen_yoy: -31.694774498029204
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 16,
|
||||||
|
nama_regional: 'REGIONAL SULMAPANA',
|
||||||
|
id_uid: 31,
|
||||||
|
nama_uid: 'WILAYAH SULAWESI UTARA,TENGAH DAN GORONTALO',
|
||||||
|
id_up3: 31900,
|
||||||
|
nama_up3: 'UP3 LUWUK',
|
||||||
|
id_ulp: 31910,
|
||||||
|
nama_ulp: 'ULP TOILI',
|
||||||
|
mom_bulan_ini: 163754,
|
||||||
|
mom_bulan_kemarin: 84028,
|
||||||
|
persen_mom: -94.88027800257058,
|
||||||
|
yoy_tahun_ini: 2165678,
|
||||||
|
yoy_tahun_kemarin: 1939057,
|
||||||
|
persen_yoy: -11.687175776679076
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
Loading…
x
Reference in New Issue
Block a user