Add Monalisa dispatching time gangguan queries

This commit is contained in:
Dede Fuji Abdul 2024-04-03 11:21:43 +07:00
parent 6a7621b435
commit b88e38fbb7
3 changed files with 286 additions and 101 deletions

View File

@ -69,9 +69,9 @@
"
/>
<DxColumn
:width="150"
:width="250"
alignment="center"
data-field="jenisGangguan"
data-field="tipe_permasalahan"
caption="Jenis Gangguan"
css-class="custom-table-column"
cell-template="formatText"
@ -80,7 +80,7 @@
<DxColumn
:width="120"
alignment="center"
data-field="laporan.total"
data-field="total"
data-type="number"
caption="Total"
css-class="custom-table-column"
@ -90,7 +90,7 @@
<DxColumn
:width="120"
alignment="center"
data-field="laporan.sudahSelesai.jml"
data-field="total_selesai"
data-type="number"
caption="Jml"
css-class="custom-table-column"
@ -99,7 +99,7 @@
<DxColumn
:width="70"
alignment="center"
data-field="laporan.sudahSelesai.persen"
data-field="persen_selesai"
data-type="number"
caption="%"
css-class="custom-table-column"
@ -110,7 +110,7 @@
<DxColumn
:width="120"
alignment="center"
data-field="laporan.belumSelesai.jml"
data-field="total_inproses"
data-type="number"
caption="Jml"
css-class="custom-table-column"
@ -119,7 +119,7 @@
<DxColumn
:width="70"
alignment="center"
data-field="laporan.belumSelesai.persen"
data-field="persen_inproses"
data-type="number"
caption="%"
css-class="custom-table-column"
@ -132,7 +132,7 @@
<DxColumn
:width="120"
alignment="center"
data-field="responseTime.menit.total"
data-field="total_durasi_response"
data-type="number"
caption="Total"
css-class="custom-table-column"
@ -141,7 +141,7 @@
<DxColumn
:width="120"
alignment="center"
data-field="responseTime.menit.rataRata"
data-field="avg_durasi_response"
data-type="number"
caption="Rata-Rata"
css-class="custom-table-column"
@ -150,7 +150,7 @@
<DxColumn
:width="120"
alignment="center"
data-field="responseTime.menit.max"
data-field="max_durasi_response"
data-type="number"
caption="Max"
css-class="custom-table-column"
@ -159,7 +159,7 @@
<DxColumn
:width="120"
alignment="center"
data-field="responseTime.menit.min"
data-field="min_durasi_response"
data-type="number"
caption="Min"
css-class="custom-table-column"
@ -170,7 +170,7 @@
<DxColumn
:width="120"
alignment="center"
data-field="responseTime.laporan.lebihSla"
data-field="total_diatas_sla_response"
data-type="number"
caption=">SLA"
css-class="custom-table-column"
@ -179,7 +179,7 @@
<DxColumn
:width="120"
alignment="center"
data-field="responseTime.laporan.kurangSla"
data-field="total_dibawah_sla_response"
data-type="number"
caption="≤SLA"
css-class="custom-table-column"
@ -192,7 +192,7 @@
<DxColumn
:width="120"
alignment="center"
data-field="recoveryTime.menit.total"
data-field="total_durasi_recovery"
data-type="number"
caption="Total"
css-class="custom-table-column"
@ -201,7 +201,7 @@
<DxColumn
:width="120"
alignment="center"
data-field="recoveryTime.menit.rataRata"
data-field="avg_durasi_recovery"
data-type="number"
caption="Rata-Rata"
css-class="custom-table-column"
@ -210,7 +210,7 @@
<DxColumn
:width="120"
alignment="center"
data-field="recoveryTime.menit.max"
data-field="max_durasi_recovery"
data-type="number"
caption="Max"
css-class="custom-table-column"
@ -219,7 +219,7 @@
<DxColumn
:width="120"
alignment="center"
data-field="recoveryTime.menit.min"
data-field="min_durasi_recovery"
data-type="number"
caption="Min"
css-class="custom-table-column"
@ -230,7 +230,7 @@
<DxColumn
:width="120"
alignment="center"
data-field="recoveryTime.laporan.lebihSla"
data-field="total_diatas_sla_recovery"
data-type="number"
caption=">SLA"
css-class="custom-table-column"
@ -239,7 +239,7 @@
<DxColumn
:width="120"
alignment="center"
data-field="recoveryTime.laporan.kurangSla"
data-field="total_dibawah_sla_recovery"
data-type="number"
caption="≤SLA"
css-class="custom-table-column"
@ -248,7 +248,7 @@
</DxColumn>
</DxColumn>
<DxSummary>
<DxSummary :calculate-custom-summary="calculateCustomSummary">
<DxGroupItem
:show-in-group-footer="true"
column="no"
@ -257,7 +257,7 @@
/>
<DxGroupItem
:show-in-group-footer="true"
column="laporan.total"
column="total"
summary-type="sum"
display-format="{0}"
css-class="!text-right"
@ -265,7 +265,7 @@
/>
<DxGroupItem
:show-in-group-footer="true"
column="laporan.sudahSelesai.jml"
column="total_selesai"
summary-type="sum"
display-format="{0}"
css-class="!text-right"
@ -273,7 +273,7 @@
/>
<DxGroupItem
:show-in-group-footer="true"
column="laporan.sudahSelesai.persen"
column="persen_selesai"
summary-type="avg"
display-format="{0}"
css-class="!text-right"
@ -281,7 +281,7 @@
/>
<DxGroupItem
:show-in-group-footer="true"
column="laporan.belumSelesai.jml"
column="total_inproses"
summary-type="sum"
display-format="{0}"
css-class="!text-right"
@ -289,7 +289,7 @@
/>
<DxGroupItem
:show-in-group-footer="true"
column="laporan.belumSelesai.persen"
column="persen_inproses"
summary-type="avg"
display-format="{0}"
css-class="!text-right"
@ -297,7 +297,7 @@
/>
<DxGroupItem
:show-in-group-footer="true"
column="responseTime.menit.total"
column="total_durasi_response"
summary-type="sum"
display-format="{0}"
css-class="!text-right"
@ -305,7 +305,7 @@
/>
<DxGroupItem
:show-in-group-footer="true"
column="responseTime.menit.rataRata"
column="avg_durasi_response"
summary-type="avg"
display-format="{0}"
css-class="!text-right"
@ -313,7 +313,7 @@
/>
<DxGroupItem
:show-in-group-footer="true"
column="responseTime.menit.max"
column="max_durasi_response"
summary-type="max"
display-format="{0}"
css-class="!text-right"
@ -321,7 +321,7 @@
/>
<DxGroupItem
:show-in-group-footer="true"
column="responseTime.menit.min"
column="min_durasi_response"
summary-type="min"
display-format="{0}"
css-class="!text-right"
@ -329,7 +329,7 @@
/>
<DxGroupItem
:show-in-group-footer="true"
column="responseTime.laporan.lebihSla"
column="total_diatas_sla_response"
summary-type="sum"
display-format="{0}"
css-class="!text-right"
@ -337,7 +337,7 @@
/>
<DxGroupItem
:show-in-group-footer="true"
column="responseTime.laporan.kurangSla"
column="total_dibawah_sla_response"
summary-type="sum"
display-format="{0}"
css-class="!text-right"
@ -345,7 +345,7 @@
/>
<DxGroupItem
:show-in-group-footer="true"
column="recoveryTime.menit.total"
column="total_durasi_recovery"
summary-type="sum"
display-format="{0}"
css-class="!text-right"
@ -353,7 +353,7 @@
/>
<DxGroupItem
:show-in-group-footer="true"
column="recoveryTime.menit.rataRata"
column="avg_durasi_recovery"
summary-type="avg"
display-format="{0}"
css-class="!text-right"
@ -361,7 +361,7 @@
/>
<DxGroupItem
:show-in-group-footer="true"
column="recoveryTime.menit.max"
column="max_durasi_recovery"
summary-type="max"
display-format="{0}"
css-class="!text-right"
@ -369,7 +369,7 @@
/>
<DxGroupItem
:show-in-group-footer="true"
column="recoveryTime.menit.min"
column="min_durasi_recovery"
summary-type="min"
display-format="{0}"
css-class="!text-right"
@ -377,7 +377,7 @@
/>
<DxGroupItem
:show-in-group-footer="true"
column="recoveryTime.laporan.lebihSla"
column="total_diatas_sla_recovery"
summary-type="sum"
display-format="{0}"
css-class="!text-right"
@ -385,7 +385,7 @@
/>
<DxGroupItem
:show-in-group-footer="true"
column="recoveryTime.laporan.kurangSla"
column="total_dibawah_sla_recovery"
summary-type="sum"
display-format="{0}"
css-class="!text-right"
@ -563,46 +563,8 @@ const filterData = async (params: any) => {
data.value = [...result.data.data.rekapitulasiPerJenisGangguan].map(
(item: any, index: number) => {
return {
no: ++index,
sub_kelompok: item.sub_kelompok,
nama_sub_kelompok: item.nama_sub_kelompok,
kode: item.kode,
jenisGangguan: item.tipe_permasalahan,
laporan: {
total: item.total,
sudahSelesai: {
jml: item.total_selesai,
persen: item.persen_selesai
},
belumSelesai: {
jml: item.total_inproses,
persen: item.persen_inproses
}
},
responseTime: {
menit: {
total: item.total_durasi_response,
rataRata: item.avg_durasi_response,
max: item.max_durasi_response,
min: item.min_durasi_response
},
laporan: {
lebihSla: item.total_diatas_sla_response,
kurangSla: item.total_dibawah_sla_response
}
},
recoveryTime: {
menit: {
total: item.total_durasi_recovery,
rataRata: item.avg_durasi_recovery,
max: item.max_durasi_recovery,
min: item.min_durasi_recovery
},
laporan: {
lebihSla: item.total_diatas_sla_recovery,
kurangSla: item.total_dibawah_sla_recovery
}
}
...item,
no: ++index
}
}
)
@ -619,6 +581,50 @@ const filterData = async (params: any) => {
})
}
let total = 0
let total_selesai = 0
let total_inproses = 0
let count_durasi_dispatch = 0
let total_durasi_dispatch = 0
let count_durasi_response = 0
let total_durasi_response = 0
let count_durasi_recovery = 0
let total_durasi_recovery = 0
const calculateCustomSummary = (options: any) => {
if (options.name === 'total') {
if (options.summaryProcess === 'calculate') {
total += options.value
} else if (options.summaryProcess === 'finalize') {
options.totalValue = total
}
}
if (options.name === 'total_selesai') {
if (options.summaryProcess === 'calculate') {
total_selesai += options.value
} else if (options.summaryProcess === 'finalize') {
options.totalValue = total_selesai
}
}
if (options.name === 'total_inproses') {
if (options.summaryProcess === 'calculate') {
total_inproses += options.value
} else if (options.summaryProcess === 'finalize') {
options.totalValue = total_inproses
}
}
if (options.name === 'persen_selesai') {
if (options.summaryProcess === 'start') {
total = 0
total_selesai = 0
} else if (options.summaryProcess === 'finalize') {
options.totalValue = (total_selesai / total) * 100
}
}
}
const filters = ref()
onMounted(() => {
if (import.meta.env.DEV) {

View File

@ -93,7 +93,7 @@
data-type="number"
:caption="`${getMonthName(lastMonth)} ${lastYearMoM}`"
css-class="custom-table-column"
cell-template="formatNumber"
cell-template="formatNumberMomLastMonthLastYear"
/>
<DxColumn
:width="150"
@ -102,7 +102,7 @@
data-type="number"
:caption="`${getMonthName(currentMonth)} ${currentYear}`"
css-class="custom-table-column"
cell-template="formatNumber"
cell-template="formatNumberMomCurrentMonthCurrentYear"
/>
<DxColumn
:width="70"
@ -122,7 +122,7 @@
data-type="number"
:caption="`s.d ${getMonthName(currentMonth)} ${lastYear}`"
css-class="custom-table-column"
cell-template="formatNumber"
cell-template="formatNumberYoyCurrentMonthLastYear"
/>
<DxColumn
:width="150"
@ -131,7 +131,7 @@
data-type="number"
:caption="`s.d ${getMonthName(currentMonth)} ${currentYear}`"
css-class="custom-table-column"
cell-template="formatNumber"
cell-template="formatNumberYoyCurrentMonthCurrentYear"
/>
<DxColumn
:width="70"
@ -253,7 +253,67 @@
</DxSummary>
<template #formatNumber="{ data }">
<p class="text-right cursor-pointer">
<p class="text-right cursor-pointer" @click="setRequirements('', 0, 0)">
{{
isNumber(data.text)
? data.column.caption == '%'
? formatPercentage(data.text)
: formatNumber(data.text)
: data.text
}}
</p>
</template>
<template #formatNumberMomLastMonthLastYear="{ data }">
<p
class="text-right cursor-pointer"
@click="setRequirements('mom', lastMonth, lastYearMoM)"
>
{{
isNumber(data.text)
? data.column.caption == '%'
? formatPercentage(data.text)
: formatNumber(data.text)
: data.text
}}
</p>
</template>
<template #formatNumberMomCurrentMonthCurrentYear="{ data }">
<p
class="text-right cursor-pointer"
@click="setRequirements('mom', currentMonth, currentYear)"
>
{{
isNumber(data.text)
? data.column.caption == '%'
? formatPercentage(data.text)
: formatNumber(data.text)
: data.text
}}
</p>
</template>
<template #formatNumberYoyCurrentMonthLastYear="{ data }">
<p
class="text-right cursor-pointer"
@click="setRequirements('yoy', currentMonth, lastYear)"
>
{{
isNumber(data.text)
? data.column.caption == '%'
? formatPercentage(data.text)
: formatNumber(data.text)
: data.text
}}
</p>
</template>
<template #formatNumberYoyCurrentMonthCurrentYear="{ data }">
<p
class="text-right cursor-pointer"
@click="setRequirements('yoy', currentMonth, currentYear)"
>
{{
isNumber(data.text)
? data.column.caption == '%'
@ -265,7 +325,7 @@
</template>
<template #formatText="{ data }">
<p class="!text-left cursor-pointer">
<p class="!text-left cursor-pointer" @click="setRequirements('', 0, 0)">
{{ data.text }}
</p>
</template>
@ -748,6 +808,9 @@ const dialogDetail = ref(false)
const closedialogDetail = () => (dialogDetail.value = false)
const loadingData = ref(false)
const loadingSubData = ref(false)
const dataType = ref('')
const dataYear = ref(new Date().getFullYear())
const dataMonth = ref(new Date().getMonth())
const reportMeta = ref({
regional: { id: 0, name: 'Semua Regional' },
uid: { id: 0, name: 'Semua Unit Induk Distribusi/Wilayah' },
@ -763,6 +826,12 @@ const reportMeta = ref({
lastYear: new Date().getFullYear() - 1
})
const setRequirements = (type: string, month: number, year: number) => {
dataType.value = type
dataYear.value = year
dataMonth.value = month
}
const onExporting = (e: any) => {
if (e.format === 'pdf') {
exportToPDF(reportMeta.value, data.value)
@ -835,32 +904,30 @@ const filterData = async (params: any) => {
}
const getDetail = async () => {
const dateValue = filters.value.periode.split(' s/d ')
const selected = dataSelected.value
const query = {
dateFrom: dateValue[0]
? dateValue[0].split('-').reverse().join('-')
: new Date().toISOString().slice(0, 10),
dateTo: dateValue[1]
? dateValue[1].split('-').reverse().join('-')
: new Date().toISOString().slice(0, 10),
posko: selected?.id_ulp ? selected?.id_ulp : 0,
idUid: selected?.id_uid ? selected?.id_uid : 0,
idUp3: selected?.id_up3 ? selected?.id_up3 : 0,
idRegu: selected?.id_regu ? selected?.id_regu : 0,
bulan: dataMonth.value,
tahun: dataYear.value,
idUlp: selected?.id_ulp ? selected?.id_ulp : 0,
namaRegional: selected?.nama_regional ? selected?.nama_regional : '',
media: selected?.media ? selected?.media : '',
isSelesai: 0,
tanggal: ''
idUid: selected?.id_uid ? selected?.id_uid : 0,
idUp3: selected?.id_up3 ? selected?.id_up3 : 0
}
loadingSubData.value = true
await requestGraphQl(queries.gangguan.rekap.gangguanAllDetail, query)
await requestGraphQl(
dataType.value == 'yoy'
? queries.monalisa.gangguan.rekap.dispatchingTimeGangguanDetailYoy
: queries.monalisa.gangguan.rekap.dispatchingTimeGangguanDetailMom,
query
)
.then((result) => {
if (result.data.data != undefined) {
dataSub.value = result.data.data.detailGangguan
if (dataType.value == 'yoy') {
dataSub.value = result.data.data.detailMonalisaDispatchingTimeGangguanYoy
} else {
dataSub.value = result.data.data.detailMonalisaDispatchingTimeGangguanMoM
}
} else {
dataSub.value = []
}
@ -882,7 +949,9 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
getDetail()
if (dataType.value == 'yoy' || dataType.value == 'mom') {
getDetail()
}
}
const onDataSelectionChanged = ({ selectedRowsData }: any) => {
if (selectedRowsData[0] != undefined) {

View File

@ -1972,6 +1972,116 @@ export const queries = {
monalisa: {
gangguan: {
rekap: {
dispatchingTimeGangguanDetailYoy: gql`
query detailMonalisaDispatchingTimeGangguanYoY(
$bulan: Int!
$tahun: Int!
$idUlp: Int!
$idUid: Int!
$idUp3: Int!
) {
detailMonalisaDispatchingTimeGangguanYoY(
bulan: $bulan
tahun: $tahun
idUlp: $idUlp
idUid: $idUid
idUp3: $idUp3
) {
id
id
nama_regional
id_uid
nama_uid
id_up3
nama_up3
id_ulp
nama_ulp
id_posko
nama_posko
no_laporan
pembuat_laporan
waktu_lapor
waktu_dispatch
waktu_response
waktu_recovery
durasi_dispatch_time
durasi_response_time
durasi_recovery_time
status_akhir
is_marking
referensi_marking
idpel_nometer
nama_pelapor
alamat_pelapor
no_telp_pelapor
keterangan_pelapor
media
jarak_closing
dispatch_oleh
diselesaikan_oleh
penyebab
tindakan
kode_gangguan
jenis_gangguan
nilai_rating
}
}
`,
dispatchingTimeGangguanDetailMom: gql`
query detailMonalisaDispatchingTimeGangguanMoM(
$bulan: Int!
$tahun: Int!
$idUlp: Int!
$idUid: Int!
$idUp3: Int!
) {
detailMonalisaDispatchingTimeGangguanMoM(
bulan: $bulan
tahun: $tahun
idUlp: $idUlp
idUid: $idUid
idUp3: $idUp3
) {
id
id
nama_regional
id_uid
nama_uid
id_up3
nama_up3
id_ulp
nama_ulp
id_posko
nama_posko
no_laporan
pembuat_laporan
waktu_lapor
waktu_dispatch
waktu_response
waktu_recovery
durasi_dispatch_time
durasi_response_time
durasi_recovery_time
status_akhir
is_marking
referensi_marking
idpel_nometer
nama_pelapor
alamat_pelapor
no_telp_pelapor
keterangan_pelapor
media
jarak_closing
dispatch_oleh
diselesaikan_oleh
penyebab
tindakan
kode_gangguan
jenis_gangguan
nilai_rating
}
}
`,
dispatchingTimeGangguan: gql`
query monalisaDispatchingTimeGangguan(
$namaRegional: String