Refactor data assignment in onMounted hooks
This commit is contained in:
parent
99afd50f37
commit
d4ad845ac3
@ -127,6 +127,56 @@
|
||||
}}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<DxSummary>
|
||||
<DxTotalItem
|
||||
display-format="TOTAL"
|
||||
show-in-column="user_regu"
|
||||
css-class="text-white !text-left"
|
||||
/>
|
||||
<DxTotalItem
|
||||
column="jumlah_wo_gangguan_individual"
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxTotalItem
|
||||
column="avg_durasi_wo_gangguan_individual"
|
||||
summary-type="avg"
|
||||
display-format="{0}"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxTotalItem
|
||||
column="avg_rpt_wo_gangguan_individual"
|
||||
summary-type="avg"
|
||||
display-format="{0}"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxTotalItem
|
||||
column="avg_rct_wo_gangguan_individual"
|
||||
summary-type="avg"
|
||||
display-format="{0}"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxTotalItem
|
||||
column="jumlah_wo_penugasan_khusus"
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxTotalItem
|
||||
column="avg_wo_penugasan_khusus"
|
||||
summary-type="avg"
|
||||
display-format="{0}"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
</DxSummary>
|
||||
</DxDataGrid>
|
||||
</div>
|
||||
|
||||
@ -748,7 +798,9 @@ import {
|
||||
DxPaging,
|
||||
DxScrolling,
|
||||
DxSearchPanel,
|
||||
DxSelection
|
||||
DxSelection,
|
||||
DxSummary,
|
||||
DxTotalItem
|
||||
} from 'devextreme-vue/data-grid'
|
||||
import { jsPDF } from 'jspdf'
|
||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||
@ -853,17 +905,19 @@ const { onResult, onError, loading, refetch } = useQuery(queries.cico.laporanChe
|
||||
const filters = ref()
|
||||
|
||||
onMounted(() => {
|
||||
data.value = [
|
||||
{
|
||||
user_regu: '11110.REGU1',
|
||||
personil_yantek: '11110_FAUZI',
|
||||
jumlah_wo_gangguan_individual: 54,
|
||||
avg_durasi_wo_gangguan_individual: 70.67,
|
||||
avg_rpt_wo_gangguan_individual: 40.69,
|
||||
avg_rct_wo_gangguan_individual: 71.61,
|
||||
jumlah_wo_penugasan_khusus: 31,
|
||||
avg_wo_penugasan_khusus: 63.79
|
||||
}
|
||||
]
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = [
|
||||
{
|
||||
user_regu: '11110.REGU1',
|
||||
personil_yantek: '11110_FAUZI',
|
||||
jumlah_wo_gangguan_individual: 54,
|
||||
avg_durasi_wo_gangguan_individual: 70.67,
|
||||
avg_rpt_wo_gangguan_individual: 40.69,
|
||||
avg_rct_wo_gangguan_individual: 71.61,
|
||||
jumlah_wo_penugasan_khusus: 31,
|
||||
avg_wo_penugasan_khusus: 63.79
|
||||
}
|
||||
]
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -250,6 +250,8 @@ const filterData = (params: any) => {
|
||||
|
||||
const filters = ref()
|
||||
onMounted(() => {
|
||||
data.value = dummyData.gangguan.daftar.daftarGangguanBerdasarkanMedia
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.gangguan.daftar.daftarGangguanBerdasarkanMedia
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -512,6 +512,8 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
const showData = () => (showDetail.value = true)
|
||||
const filters = ref()
|
||||
onMounted(() => {
|
||||
data.value = dummyData.gangguan.daftar.dialihkanKePoskoLain
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.gangguan.daftar.dialihkanKePoskoLain
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -252,6 +252,8 @@ const filterData = (params: any) => {
|
||||
|
||||
const filters = ref()
|
||||
onMounted(() => {
|
||||
data.value = dummyData.gangguan.daftar.daftarGangguanDiselesaikanMobileAPKT
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.gangguan.daftar.daftarGangguanDiselesaikanMobileAPKT
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -385,6 +385,8 @@ const filterData = (params: any) => {
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
data.value = dummyData.gangguan.daftar.melaporLebihDariSatuKali
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.gangguan.daftar.melaporLebihDariSatuKali
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -405,6 +405,8 @@ const { onResult, onError, loading, refetch } = useQuery(queries.gangguan.daftar
|
||||
|
||||
const filters = ref()
|
||||
onMounted(() => {
|
||||
data.value = dummyData.gangguan.daftar.gangguanRecoveryTime
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.gangguan.daftar.gangguanRecoveryTime
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -380,6 +380,8 @@ const { onResult, onError, loading, refetch } = useQuery(queries.gangguan.daftar
|
||||
|
||||
const filters = ref()
|
||||
onMounted(() => {
|
||||
data.value = dummyData.gangguan.daftar.gangguanResponseTime
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.gangguan.daftar.gangguanResponseTime
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -251,6 +251,8 @@ const filterData = (params: any) => {
|
||||
|
||||
const filters = ref()
|
||||
onMounted(() => {
|
||||
data.value = dummyData.gangguan.daftar.daftarGangguanSelesaiTanpaIdPelanggan
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.gangguan.daftar.daftarGangguanSelesaiTanpaIdPelanggan
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -1164,7 +1164,9 @@ const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
|
||||
const filters = ref()
|
||||
onMounted(() => {
|
||||
data.value = dummyData.gangguan.rekap.rekapitulasiAllGangguan
|
||||
dataSub.value = dummyData.gangguan.rekap.detailGangguan
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.gangguan.rekap.rekapitulasiAllGangguan
|
||||
dataSub.value = dummyData.gangguan.rekap.detailGangguan
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -249,6 +249,8 @@ const filterData = (params: any) => {
|
||||
|
||||
const filters = ref()
|
||||
onMounted(() => {
|
||||
data.value = dummyData.gangguan.rekap.rekapitulasiGangguanAlihPosko
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.gangguan.rekap.rekapitulasiGangguanAlihPosko
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -245,6 +245,8 @@ const filterData = (params: any) => {
|
||||
|
||||
const filters = ref()
|
||||
onMounted(() => {
|
||||
data.value = dummyData.gangguan.rekap.rekapitulasiGangguanBerdasarkanMedia
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.gangguan.rekap.rekapitulasiGangguanBerdasarkanMedia
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -562,50 +562,52 @@ const filterData = (params: any) => {
|
||||
|
||||
const filters = ref()
|
||||
onMounted(() => {
|
||||
data.value = dummyData.gangguan.rekap.rekapitulasiPerJenisGangguan.map(
|
||||
(item: any, index: number) => {
|
||||
return {
|
||||
no: ++index,
|
||||
sub_kelompok: item.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
|
||||
},
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.gangguan.rekap.rekapitulasiPerJenisGangguan.map(
|
||||
(item: any, index: number) => {
|
||||
return {
|
||||
no: ++index,
|
||||
sub_kelompok: item.sub_kelompok,
|
||||
kode: item.kode,
|
||||
jenisGangguan: item.tipe_permasalahan,
|
||||
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
|
||||
total: item.total,
|
||||
sudahSelesai: {
|
||||
jml: item.total_selesai,
|
||||
persen: item.persen_selesai
|
||||
},
|
||||
belumSelesai: {
|
||||
jml: item.total_inproses,
|
||||
persen: item.persen_inproses
|
||||
}
|
||||
},
|
||||
laporan: {
|
||||
lebihSla: item.total_diatas_sla_recovery,
|
||||
kurangSla: item.total_dibawah_sla_recovery
|
||||
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
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
)
|
||||
)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -381,6 +381,8 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
|
||||
const filters = ref()
|
||||
onMounted(() => {
|
||||
data.value = dummyData.gangguan.rekap.rekapitulasiJenisGangguanSE004
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.gangguan.rekap.rekapitulasiJenisGangguanSE004
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -661,48 +661,50 @@ const filterData = (params: any) => {
|
||||
|
||||
const filters = ref()
|
||||
onMounted(() => {
|
||||
data.value = dummyData.gangguan.rekap.rekapitulasiGangguanPerPosko.map(
|
||||
(item: any, index: number) => {
|
||||
return {
|
||||
no: ++index,
|
||||
nama_posko: item.nama_posko,
|
||||
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
|
||||
},
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.gangguan.rekap.rekapitulasiGangguanPerPosko.map(
|
||||
(item: any, index: number) => {
|
||||
return {
|
||||
no: ++index,
|
||||
nama_posko: item.nama_posko,
|
||||
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
|
||||
total: item.total,
|
||||
sudahSelesai: {
|
||||
jml: item.total_selesai,
|
||||
persen: item.persen_selesai
|
||||
},
|
||||
belumSelesai: {
|
||||
jml: item.total_inproses,
|
||||
persen: item.persen_inproses
|
||||
}
|
||||
},
|
||||
laporan: {
|
||||
lebihSla: item.total_diatas_sla_recovery,
|
||||
kurangSla: item.total_dibawah_sla_recovery
|
||||
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
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
)
|
||||
)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -669,49 +669,51 @@ const filters = ref({
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
data.value = dummyData.gangguan.rekap.rekapitulasiGangguanPerRegu.map(
|
||||
(item: any, index: number) => {
|
||||
return {
|
||||
no: ++index,
|
||||
kode_regu: item.kode_regu,
|
||||
nama_regu: item.nama_regu,
|
||||
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
|
||||
},
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.gangguan.rekap.rekapitulasiGangguanPerRegu.map(
|
||||
(item: any, index: number) => {
|
||||
return {
|
||||
no: ++index,
|
||||
kode_regu: item.kode_regu,
|
||||
nama_regu: item.nama_regu,
|
||||
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
|
||||
total: item.total,
|
||||
sudahSelesai: {
|
||||
jml: item.total_selesai,
|
||||
persen: item.persen_selesai
|
||||
},
|
||||
belumSelesai: {
|
||||
jml: item.total_inproses,
|
||||
persen: item.persen_inproses
|
||||
}
|
||||
},
|
||||
laporan: {
|
||||
lebihSla: item.total_diatas_sla_recovery,
|
||||
kurangSla: item.total_dibawah_sla_recovery
|
||||
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
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
)
|
||||
)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -380,6 +380,8 @@ const filterData = (params: any) => {
|
||||
|
||||
const filters = ref({ groupBy: false })
|
||||
onMounted(() => {
|
||||
data.value = dummyData.gangguan.rekap.rekapitulasiGangguanPerTanggal
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.gangguan.rekap.rekapitulasiGangguanPerTanggal
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -408,6 +408,8 @@ const filterData = (params: any) => {
|
||||
|
||||
const filters = ref()
|
||||
onMounted(() => {
|
||||
data.value = dummyData.keluhan.daftar.daftarKeluhanBerdasarkanMedia
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.keluhan.daftar.daftarKeluhanBerdasarkanMedia
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -313,6 +313,8 @@ const filterData = (params: any) => {
|
||||
|
||||
const filters = ref()
|
||||
onMounted(() => {
|
||||
data.value = dummyData.keluhan.daftar.daftarKeluhanDialihkanKeUnitLain
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.keluhan.daftar.daftarKeluhanDialihkanKeUnitLain
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -438,6 +438,8 @@ const filterData = (params: any) => {
|
||||
|
||||
const filters = ref()
|
||||
onMounted(() => {
|
||||
data.value = dummyData.keluhan.daftar.daftarKeluhanMelaporLebihDariSatuKali
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.keluhan.daftar.daftarKeluhanMelaporLebihDariSatuKali
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -397,6 +397,8 @@ const filterData = (params: any) => {
|
||||
|
||||
const filters = ref()
|
||||
onMounted(() => {
|
||||
data.value = dummyData.keluhan.daftar.daftarKeluhanRecoveryTime
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.keluhan.daftar.daftarKeluhanRecoveryTime
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -417,6 +417,8 @@ const filterData = (params: any) => {
|
||||
|
||||
const filters = ref()
|
||||
onMounted(() => {
|
||||
data.value = dummyData.keluhan.daftar.daftarKeluhanResponseTime
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.keluhan.daftar.daftarKeluhanResponseTime
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -401,6 +401,8 @@ const filterData = (params: any) => {
|
||||
|
||||
const filters = ref()
|
||||
onMounted(() => {
|
||||
data.value = dummyData.keluhan.daftar.daftarKeluhanSelesaiTanpaIdPelanggan
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.keluhan.daftar.daftarKeluhanSelesaiTanpaIdPelanggan
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -299,6 +299,8 @@ const filterData = (params: any) => {
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
data.value = dummyData.keluhan.daftar.daftarKeluhanDiselesaikanCC123
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.keluhan.daftar.daftarKeluhanDiselesaikanCC123
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -699,6 +699,8 @@ const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
const filters = ref()
|
||||
|
||||
onMounted(() => {
|
||||
data.value = dummyData.keluhan.rekap.rekapitulasiKeluhanAll
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.keluhan.rekap.rekapitulasiKeluhanAll
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -95,7 +95,7 @@
|
||||
</DxSummary>
|
||||
|
||||
<template #formatText="{ data }">
|
||||
<p class="cursor-pointer text-left" @click="showDialogDataSelected()">
|
||||
<p class="text-left cursor-pointer" @click="showDialogDataSelected()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
@ -585,6 +585,8 @@ const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
const filters = ref()
|
||||
|
||||
onMounted(() => {
|
||||
data.value = dummyData.keluhan.rekap.rekapitulasiKeluhanBerdasarkanMedia
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.keluhan.rekap.rekapitulasiKeluhanBerdasarkanMedia
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -585,7 +585,13 @@
|
||||
|
||||
<template #formatNumber="{ data }">
|
||||
<p class="text-right cursor-pointer">
|
||||
{{ data.text }}
|
||||
{{
|
||||
isNumber(data.text)
|
||||
? data.column.caption == '%'
|
||||
? formatPercentage(data.text)
|
||||
: formatNumber(data.text)
|
||||
: data.text
|
||||
}}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
@ -867,6 +873,8 @@ const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
const filters = ref({ groupBy: false })
|
||||
|
||||
onMounted(() => {
|
||||
data.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPenyelesaianPerFungsiBidang
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPenyelesaianPerFungsiBidang
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -51,6 +51,7 @@
|
||||
data-type="number"
|
||||
data-field="no"
|
||||
caption="No"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="170"
|
||||
@ -77,6 +78,7 @@
|
||||
data-type="number"
|
||||
caption="Total"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn alignment="center" caption="Sudah Selesai" css-class="custom-table-column">
|
||||
<DxColumn
|
||||
@ -86,6 +88,7 @@
|
||||
data-type="number"
|
||||
caption="Jml"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="70"
|
||||
@ -94,7 +97,7 @@
|
||||
data-type="number"
|
||||
caption="%"
|
||||
css-class="custom-table-column"
|
||||
cell-template="percent"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Belum Selesai" css-class="custom-table-column">
|
||||
@ -105,6 +108,7 @@
|
||||
data-type="number"
|
||||
caption="Jml"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="70"
|
||||
@ -113,7 +117,7 @@
|
||||
data-type="number"
|
||||
caption="%"
|
||||
css-class="custom-table-column"
|
||||
cell-template="percent"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
@ -126,6 +130,7 @@
|
||||
data-type="number"
|
||||
caption="Total"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -134,6 +139,7 @@
|
||||
data-type="number"
|
||||
caption="Rata-Rata"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -162,6 +168,7 @@
|
||||
data-type="number"
|
||||
caption=">SLA"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -170,6 +177,7 @@
|
||||
data-type="number"
|
||||
caption="≤SLA"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
@ -182,6 +190,7 @@
|
||||
data-type="number"
|
||||
caption="Total"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -190,6 +199,7 @@
|
||||
data-type="number"
|
||||
caption="Rata-Rata"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -218,6 +228,7 @@
|
||||
data-type="number"
|
||||
caption=">SLA"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -226,6 +237,7 @@
|
||||
data-type="number"
|
||||
caption="≤SLA"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
@ -235,236 +247,272 @@
|
||||
summary-type="sum"
|
||||
display-format="Total"
|
||||
show-in-column="no"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:show-in-group-footer="true"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxGroupItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:show-in-group-footer="true"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxGroupItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_selesai"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:show-in-group-footer="true"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxGroupItem
|
||||
summary-type="sum"
|
||||
summary-type="avg"
|
||||
display-format="{0}%"
|
||||
column="persen_selesai"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:show-in-group-footer="true"
|
||||
:customize-text="(e: any) => formatPercentage(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxGroupItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_inproses"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:show-in-group-footer="true"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxGroupItem
|
||||
summary-type="sum"
|
||||
summary-type="avg"
|
||||
display-format="{0}%"
|
||||
column="persen_inproses"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:show-in-group-footer="true"
|
||||
:customize-text="(e: any) => formatPercentage(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxGroupItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_durasi_response"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:show-in-group-footer="true"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxGroupItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="avg_durasi_response"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:show-in-group-footer="true"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxGroupItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="min_durasi_response"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:show-in-group-footer="true"
|
||||
:customize-text="(e: any) => (parseInt(e.value) ? formatWaktu(e.value) : '-')"
|
||||
/>
|
||||
<DxGroupItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="max_durasi_response"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:show-in-group-footer="true"
|
||||
:customize-text="(e: any) => (parseInt(e.value) ? formatWaktu(e.value) : '-')"
|
||||
/>
|
||||
<DxGroupItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_diatas_sla_response"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:show-in-group-footer="true"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxGroupItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_dibawah_sla_response"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:show-in-group-footer="true"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxGroupItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_durasi_recovery"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:show-in-group-footer="true"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxGroupItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="avg_durasi_recovery"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:show-in-group-footer="true"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxGroupItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="min_durasi_recovery"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:show-in-group-footer="true"
|
||||
:customize-text="(e: any) => (parseInt(e.value) ? formatWaktu(e.value) : '-')"
|
||||
/>
|
||||
<DxGroupItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="max_durasi_recovery"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:show-in-group-footer="true"
|
||||
:customize-text="(e: any) => (parseInt(e.value) ? formatWaktu(e.value) : '-')"
|
||||
/>
|
||||
<DxGroupItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_diatas_sla_recovery"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:show-in-group-footer="true"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxGroupItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_dibawah_sla_recovery"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:show-in-group-footer="true"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="Total"
|
||||
show-in-column="no"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_selesai"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
summary-type="avg"
|
||||
display-format="{0}%"
|
||||
column="persen_selesai"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => formatPercentage(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_inproses"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
summary-type="avg"
|
||||
display-format="{0}%"
|
||||
column="persen_inproses"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => formatPercentage(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_durasi_response"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="avg_durasi_response"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="min_durasi_response"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => (parseInt(e.value) ? formatWaktu(e.value) : '-')"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="max_durasi_response"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => (parseInt(e.value) ? formatWaktu(e.value) : '-')"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_diatas_sla_response"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_dibawah_sla_response"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_durasi_recovery"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="avg_durasi_recovery"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="min_durasi_recovery"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => (parseInt(e.value) ? formatWaktu(e.value) : '-')"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="max_durasi_recovery"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => (parseInt(e.value) ? formatWaktu(e.value) : '-')"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_diatas_sla_recovery"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_dibawah_sla_recovery"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
:customize-text="(e: any) => formatNumber(parseFloat(e.value.toString()))"
|
||||
/>
|
||||
</DxSummary>
|
||||
|
||||
@ -474,12 +522,20 @@
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #percent="{ data }">
|
||||
<p @click="showDialogDataSelected()" class="cursor-pointer">{{ data.text }}%</p>
|
||||
<template #formatNumber="{ data }">
|
||||
<p class="text-right cursor-pointer" @click="showDialogDataSelected()">
|
||||
{{
|
||||
isNumber(data.text)
|
||||
? data.column.caption == '%'
|
||||
? formatPercentage(data.text)
|
||||
: formatNumber(data.text)
|
||||
: data.text
|
||||
}}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #formatText="{ data }">
|
||||
<p class="cursor-pointer text-left" @click="showDialogDataSelected()">
|
||||
<p class="text-left cursor-pointer" @click="showDialogDataSelected()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
@ -857,6 +913,7 @@ import { useQuery } from '@vue/apollo-composable'
|
||||
import { formatWaktu } from '@/components/Form/FiltersType/reference'
|
||||
import { queries } from '@/utils/api/api.graphql'
|
||||
import { dummyData } from '@/utils/dummy'
|
||||
import { formatNumber, isNumber, formatPercentage } from '@/utils/numbers'
|
||||
|
||||
const position = { of: '#data' }
|
||||
const showIndicator = ref(true)
|
||||
@ -969,6 +1026,8 @@ const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
const filters = ref()
|
||||
|
||||
onMounted(() => {
|
||||
data.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPerJenisKeluhan
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPerJenisKeluhan
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -353,7 +353,7 @@
|
||||
</template>
|
||||
|
||||
<template #formatText="{ data }">
|
||||
<p class="cursor-pointer text-left" @click="showDialogDataSelected()">
|
||||
<p class="text-left cursor-pointer" @click="showDialogDataSelected()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
@ -842,6 +842,8 @@ const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
const filters = ref({ groupBy: false })
|
||||
|
||||
onMounted(() => {
|
||||
data.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPerKelompokKeluhan
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPerKelompokKeluhan
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -352,7 +352,7 @@
|
||||
</template>
|
||||
|
||||
<template #formatText="{ data }">
|
||||
<p class="cursor-pointer text-left" @click="showDialogDataSelected()">
|
||||
<p class="text-left cursor-pointer" @click="showDialogDataSelected()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
@ -841,6 +841,8 @@ const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
const filters = ref({ groupBy: false })
|
||||
|
||||
onMounted(() => {
|
||||
data.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPerTanggal
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPerTanggal
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
@ -480,7 +480,7 @@
|
||||
</template>
|
||||
|
||||
<template #formatText="{ data }">
|
||||
<p class="cursor-pointer text-left" @click="showDialogDataSelected()">
|
||||
<p class="text-left cursor-pointer" @click="showDialogDataSelected()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
@ -968,6 +968,8 @@ const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
const filters = ref()
|
||||
|
||||
onMounted(() => {
|
||||
data.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPerUnit
|
||||
if (import.meta.env.DEV) {
|
||||
data.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPerUnit
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
Loading…
x
Reference in New Issue
Block a user