Refactor CSS styles and fix formatting issues in MonalisaLK_EnergyNotSales.vue
This commit is contained in:
Dede Fuji Abdul
@ -63,7 +63,7 @@
|
||||
data-type="number"
|
||||
caption="Total"
|
||||
css-class="custom-table-column"
|
||||
cell-template="defaults"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -72,7 +72,7 @@
|
||||
data-type="number"
|
||||
caption="Selesai"
|
||||
css-class="custom-table-column"
|
||||
cell-template="defaults"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="70"
|
||||
@ -81,7 +81,7 @@
|
||||
data-type="number"
|
||||
caption="%"
|
||||
css-class="custom-table-column"
|
||||
cell-template="percent"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -90,7 +90,7 @@
|
||||
data-type="number"
|
||||
caption="InProgress"
|
||||
css-class="custom-table-column"
|
||||
cell-template="defaults"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="70"
|
||||
@ -99,7 +99,7 @@
|
||||
data-type="number"
|
||||
caption="%"
|
||||
css-class="custom-table-column"
|
||||
cell-template="percent"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -108,7 +108,7 @@
|
||||
data-type="number"
|
||||
caption="Rata-Rata"
|
||||
css-class="custom-table-column"
|
||||
cell-template="defaults"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -135,7 +135,7 @@
|
||||
data-type="number"
|
||||
caption="> SLA"
|
||||
css-class="custom-table-column"
|
||||
cell-template="defaults"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -144,7 +144,7 @@
|
||||
data-type="number"
|
||||
caption="≤ SLA"
|
||||
css-class="custom-table-column"
|
||||
cell-template="defaults"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Penyelesaian" css-class="custom-table-column">
|
||||
@ -155,7 +155,7 @@
|
||||
data-type="number"
|
||||
caption="Rata-Rata"
|
||||
css-class="custom-table-column"
|
||||
cell-template="defaults"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -182,7 +182,7 @@
|
||||
data-type="number"
|
||||
caption="> SLA"
|
||||
css-class="custom-table-column"
|
||||
cell-template="defaults"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -191,22 +191,30 @@
|
||||
data-type="number"
|
||||
caption="≤ SLA"
|
||||
css-class="custom-table-column"
|
||||
cell-template="defaults"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
</DxColumn>
|
||||
|
||||
<template #formatTime="{ data }">
|
||||
<p class="cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="cursor-pointer !text-right" @click="showDialogDataSelected()">
|
||||
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #percent="{ data }">
|
||||
<p class="cursor-pointer" @click="showDialogDataSelected()">{{ 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 #defaults="{ data }">
|
||||
<p class="cursor-pointer" @click="showDialogDataSelected()">
|
||||
<template #formatText="{ data }">
|
||||
<p class="cursor-pointer !text-left" @click="showDialogDataSelected()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
@ -269,7 +277,7 @@
|
||||
"
|
||||
data-type="number"
|
||||
caption="No"
|
||||
cell-template="cellRight"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -277,7 +285,7 @@
|
||||
data-field="no_laporan"
|
||||
caption="No Laporan"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -285,7 +293,7 @@
|
||||
data-field="waktu_lapor"
|
||||
caption="Tgl Lapor"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -294,7 +302,7 @@
|
||||
caption="Dalam Proses Bidang"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -303,7 +311,7 @@
|
||||
caption="Selesai Bidang Unit"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -312,7 +320,7 @@
|
||||
caption="Durasi Response Time"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -321,7 +329,7 @@
|
||||
caption="Durasi Recovery Time"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -330,7 +338,7 @@
|
||||
caption="Status"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -339,7 +347,7 @@
|
||||
caption="IDPEL/NO METER"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -348,7 +356,7 @@
|
||||
caption="Nama Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="200"
|
||||
@ -357,7 +365,7 @@
|
||||
caption="Alamat Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -366,7 +374,7 @@
|
||||
caption="No Tlp Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="200"
|
||||
@ -375,7 +383,7 @@
|
||||
caption="Keterangan Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -384,7 +392,7 @@
|
||||
caption="Rayon"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -393,7 +401,7 @@
|
||||
caption="Uraian"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -402,22 +410,22 @@
|
||||
caption="Respon Pelanggan"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
|
||||
<template #cellLeft="{ data }">
|
||||
<template #formatText="{ data }">
|
||||
<p class="text-left cursor-pointer">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #cellRight="{ data }">
|
||||
<template #formatNumber="{ data }">
|
||||
<p class="text-right cursor-pointer">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #data-waktu="{ data }">
|
||||
<template #formatTime="{ data }">
|
||||
<p>
|
||||
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
||||
</p>
|
||||
@ -581,6 +589,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, formatPercentage, isNumber } from '@/utils/numbers'
|
||||
|
||||
const position = { of: '#data' }
|
||||
const showIndicator = ref(true)
|
||||
|
||||
@ -58,7 +58,7 @@
|
||||
data-field="media"
|
||||
caption="Nama Media"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cell-left"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn alignment="center" caption="Tanggal" css-class="custom-table-column">
|
||||
<DxColumn
|
||||
@ -94,7 +94,7 @@
|
||||
/>
|
||||
</DxSummary>
|
||||
|
||||
<template #cell-left="{ data }">
|
||||
<template #formatText="{ data }">
|
||||
<p class="cursor-pointer text-left" @click="showDialogDataSelected()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
@ -158,7 +158,7 @@
|
||||
"
|
||||
data-type="number"
|
||||
caption="No"
|
||||
cell-template="cellRight"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -166,7 +166,7 @@
|
||||
data-field="no_laporan"
|
||||
caption="No Laporan"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -174,7 +174,7 @@
|
||||
data-field="waktu_lapor"
|
||||
caption="Tgl Lapor"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -183,7 +183,7 @@
|
||||
caption="Dalam Proses Bidang"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -192,7 +192,7 @@
|
||||
caption="Selesai Bidang Unit"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -201,7 +201,7 @@
|
||||
caption="Durasi Response Time"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -210,7 +210,7 @@
|
||||
caption="Durasi Recovery Time"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -219,7 +219,7 @@
|
||||
caption="Status"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -228,7 +228,7 @@
|
||||
caption="IDPEL/NO METER"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -237,7 +237,7 @@
|
||||
caption="Nama Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="200"
|
||||
@ -246,7 +246,7 @@
|
||||
caption="Alamat Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -255,7 +255,7 @@
|
||||
caption="No Tlp Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="200"
|
||||
@ -264,7 +264,7 @@
|
||||
caption="Keterangan Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -273,7 +273,7 @@
|
||||
caption="Rayon"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -282,7 +282,7 @@
|
||||
caption="Uraian"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -291,22 +291,22 @@
|
||||
caption="Respon Pelanggan"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
|
||||
<template #cellLeft="{ data }">
|
||||
<template #formatText="{ data }">
|
||||
<p class="text-left cursor-pointer">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #cellRight="{ data }">
|
||||
<template #formatNumber="{ data }">
|
||||
<p class="text-right cursor-pointer">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #data-waktu="{ data }">
|
||||
<template #formatTime="{ data }">
|
||||
<p>
|
||||
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
||||
</p>
|
||||
|
||||
@ -51,6 +51,7 @@
|
||||
data-type="number"
|
||||
data-field="no"
|
||||
caption="No"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<!-- <DxColumn
|
||||
:width="120"
|
||||
@ -68,7 +69,7 @@
|
||||
data-field="fungsi_bidang"
|
||||
caption="Fungsi Bidang"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cell-left"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
<DxColumn
|
||||
@ -78,6 +79,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
|
||||
@ -87,6 +89,7 @@
|
||||
data-type="number"
|
||||
caption="Jml"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="70"
|
||||
@ -95,7 +98,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">
|
||||
@ -106,6 +109,7 @@
|
||||
data-type="number"
|
||||
caption="Jml"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="70"
|
||||
@ -114,7 +118,7 @@
|
||||
data-type="number"
|
||||
caption="%"
|
||||
css-class="custom-table-column"
|
||||
cell-template="percent"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
@ -127,6 +131,7 @@
|
||||
data-type="number"
|
||||
caption="Total"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -135,6 +140,7 @@
|
||||
data-type="number"
|
||||
caption="Rata-Rata"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -143,7 +149,7 @@
|
||||
data-type="number"
|
||||
caption="Max"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -152,7 +158,7 @@
|
||||
data-type="number"
|
||||
caption="Min"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
@ -163,6 +169,7 @@
|
||||
data-type="number"
|
||||
caption=">SLA"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -171,6 +178,7 @@
|
||||
data-type="number"
|
||||
caption="≤SLA"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
@ -183,6 +191,7 @@
|
||||
data-type="number"
|
||||
caption="Total"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -191,6 +200,7 @@
|
||||
data-type="number"
|
||||
caption="Rata-Rata"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -199,7 +209,7 @@
|
||||
data-type="number"
|
||||
caption="Max"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -208,7 +218,7 @@
|
||||
data-type="number"
|
||||
caption="Min"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
@ -219,6 +229,7 @@
|
||||
data-type="number"
|
||||
caption=">SLA"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -227,6 +238,7 @@
|
||||
data-type="number"
|
||||
caption="≤SLA"
|
||||
css-class="custom-table-column"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
@ -236,122 +248,137 @@
|
||||
summary-type="sum"
|
||||
display-format="Total"
|
||||
show-in-column="no"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_selesai"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
summary-type="avg"
|
||||
display-format="{0}%"
|
||||
column="persen_selesai"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_inproses"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
summary-type="avg"
|
||||
display-format="{0}%"
|
||||
column="persen_inproses"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_durasi_response"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
/>
|
||||
<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"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_dibawah_sla_response"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_durasi_recovery"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
/>
|
||||
<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"
|
||||
/>
|
||||
<DxTotalItem
|
||||
summary-type="sum"
|
||||
display-format="{0}"
|
||||
column="total_dibawah_sla_recovery"
|
||||
css-class="text-white"
|
||||
css-class="text-white !text-right"
|
||||
/>
|
||||
</DxSummary>
|
||||
|
||||
<template #data-waktu="{ data }">
|
||||
<p class="cursor-pointer" @click="showDialogDataSelected()">
|
||||
<template #formatTime="{ data }">
|
||||
<p class="cursor-pointer !text-right" @click="showDialogDataSelected()">
|
||||
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
||||
</p>
|
||||
</template>
|
||||
<template #percent="{ data }">
|
||||
<p class="cursor-pointer" @click="showDialogDataSelected()">{{ 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 #cell-left="{ data }">
|
||||
<p class="cursor-pointer text-left" @click="showDialogDataSelected()">
|
||||
|
||||
<template #formatText="{ data }">
|
||||
<p class="cursor-pointer !text-left" @click="showDialogDataSelected()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
@ -414,7 +441,7 @@
|
||||
"
|
||||
data-type="number"
|
||||
caption="No"
|
||||
cell-template="cellRight"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -422,7 +449,7 @@
|
||||
data-field="no_laporan"
|
||||
caption="No Laporan"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -430,7 +457,7 @@
|
||||
data-field="waktu_lapor"
|
||||
caption="Tgl Lapor"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -439,7 +466,7 @@
|
||||
caption="Dalam Proses Bidang"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -448,7 +475,7 @@
|
||||
caption="Selesai Bidang Unit"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -457,7 +484,7 @@
|
||||
caption="Durasi Response Time"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -466,7 +493,7 @@
|
||||
caption="Durasi Recovery Time"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -475,7 +502,7 @@
|
||||
caption="Status"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -484,7 +511,7 @@
|
||||
caption="IDPEL/NO METER"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -493,7 +520,7 @@
|
||||
caption="Nama Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="200"
|
||||
@ -502,7 +529,7 @@
|
||||
caption="Alamat Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -511,7 +538,7 @@
|
||||
caption="No Tlp Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="200"
|
||||
@ -520,7 +547,7 @@
|
||||
caption="Keterangan Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -529,7 +556,7 @@
|
||||
caption="Rayon"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -538,7 +565,7 @@
|
||||
caption="Uraian"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -547,22 +574,22 @@
|
||||
caption="Respon Pelanggan"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
|
||||
<template #cellLeft="{ data }">
|
||||
<template #formatText="{ data }">
|
||||
<p class="text-left cursor-pointer">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #cellRight="{ data }">
|
||||
<template #formatNumber="{ data }">
|
||||
<p class="text-right cursor-pointer">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #data-waktu="{ data }">
|
||||
<template #formatTime="{ data }">
|
||||
<p>
|
||||
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
||||
</p>
|
||||
@ -728,6 +755,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)
|
||||
|
||||
@ -58,7 +58,7 @@
|
||||
data-field="tipe_keluhan"
|
||||
caption="Jenis Keluhan"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cell-left"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<!-- <DxColumn
|
||||
:width="170"
|
||||
@ -142,7 +142,7 @@
|
||||
data-type="number"
|
||||
caption="Max"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -151,7 +151,7 @@
|
||||
data-type="number"
|
||||
caption="Min"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
@ -198,7 +198,7 @@
|
||||
data-type="number"
|
||||
caption="Max"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -207,7 +207,7 @@
|
||||
data-type="number"
|
||||
caption="Min"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
@ -468,8 +468,8 @@
|
||||
/>
|
||||
</DxSummary>
|
||||
|
||||
<template #data-waktu="{ data }">
|
||||
<p class="cursor-pointer" @click="showDialogDataSelected()">
|
||||
<template #formatTime="{ data }">
|
||||
<p class="cursor-pointer !text-right" @click="showDialogDataSelected()">
|
||||
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
||||
</p>
|
||||
</template>
|
||||
@ -478,7 +478,7 @@
|
||||
<p @click="showDialogDataSelected()" class="cursor-pointer">{{ data.text }}%</p>
|
||||
</template>
|
||||
|
||||
<template #cell-left="{ data }">
|
||||
<template #formatText="{ data }">
|
||||
<p class="cursor-pointer text-left" @click="showDialogDataSelected()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
@ -542,7 +542,7 @@
|
||||
"
|
||||
data-type="number"
|
||||
caption="No"
|
||||
cell-template="cellRight"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -550,7 +550,7 @@
|
||||
data-field="no_laporan"
|
||||
caption="No Laporan"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -558,7 +558,7 @@
|
||||
data-field="waktu_lapor"
|
||||
caption="Tgl Lapor"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -567,7 +567,7 @@
|
||||
caption="Dalam Proses Bidang"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -576,7 +576,7 @@
|
||||
caption="Selesai Bidang Unit"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -585,7 +585,7 @@
|
||||
caption="Durasi Response Time"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -594,7 +594,7 @@
|
||||
caption="Durasi Recovery Time"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -603,7 +603,7 @@
|
||||
caption="Status"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -612,7 +612,7 @@
|
||||
caption="IDPEL/NO METER"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -621,7 +621,7 @@
|
||||
caption="Nama Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="200"
|
||||
@ -630,7 +630,7 @@
|
||||
caption="Alamat Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -639,7 +639,7 @@
|
||||
caption="No Tlp Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="200"
|
||||
@ -648,7 +648,7 @@
|
||||
caption="Keterangan Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -657,7 +657,7 @@
|
||||
caption="Rayon"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -666,7 +666,7 @@
|
||||
caption="Uraian"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -675,22 +675,22 @@
|
||||
caption="Respon Pelanggan"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
|
||||
<template #cellLeft="{ data }">
|
||||
<template #formatText="{ data }">
|
||||
<p class="text-left cursor-pointer">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #cellRight="{ data }">
|
||||
<template #formatNumber="{ data }">
|
||||
<p class="text-right cursor-pointer">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #data-waktu="{ data }">
|
||||
<template #formatTime="{ data }">
|
||||
<p>
|
||||
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
||||
</p>
|
||||
|
||||
@ -68,7 +68,7 @@
|
||||
data-field="kelompok"
|
||||
caption="Kelompok Keluhan"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cell-left"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
<DxColumn
|
||||
@ -143,7 +143,7 @@
|
||||
data-type="number"
|
||||
caption="Max"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -152,7 +152,7 @@
|
||||
data-type="number"
|
||||
caption="Min"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
@ -199,7 +199,7 @@
|
||||
data-type="number"
|
||||
caption="Max"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -208,7 +208,7 @@
|
||||
data-type="number"
|
||||
caption="Min"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
@ -342,8 +342,8 @@
|
||||
/>
|
||||
</DxSummary>
|
||||
|
||||
<template #data-waktu="{ data }">
|
||||
<p class="cursor-pointer" @click="showDialogDataSelected()">
|
||||
<template #formatTime="{ data }">
|
||||
<p class="cursor-pointer !text-right" @click="showDialogDataSelected()">
|
||||
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
||||
</p>
|
||||
</template>
|
||||
@ -352,7 +352,7 @@
|
||||
<p class="cursor-pointer" @click="showDialogDataSelected()">{{ data.text }}%</p>
|
||||
</template>
|
||||
|
||||
<template #cell-left="{ data }">
|
||||
<template #formatText="{ data }">
|
||||
<p class="cursor-pointer text-left" @click="showDialogDataSelected()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
@ -416,7 +416,7 @@
|
||||
"
|
||||
data-type="number"
|
||||
caption="No"
|
||||
cell-template="cellRight"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -424,7 +424,7 @@
|
||||
data-field="no_laporan"
|
||||
caption="No Laporan"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -432,7 +432,7 @@
|
||||
data-field="waktu_lapor"
|
||||
caption="Tgl Lapor"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -441,7 +441,7 @@
|
||||
caption="Dalam Proses Bidang"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -450,7 +450,7 @@
|
||||
caption="Selesai Bidang Unit"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -459,7 +459,7 @@
|
||||
caption="Durasi Response Time"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -468,7 +468,7 @@
|
||||
caption="Durasi Recovery Time"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -477,7 +477,7 @@
|
||||
caption="Status"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -486,7 +486,7 @@
|
||||
caption="IDPEL/NO METER"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -495,7 +495,7 @@
|
||||
caption="Nama Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="200"
|
||||
@ -504,7 +504,7 @@
|
||||
caption="Alamat Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -513,7 +513,7 @@
|
||||
caption="No Tlp Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="200"
|
||||
@ -522,7 +522,7 @@
|
||||
caption="Keterangan Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -531,7 +531,7 @@
|
||||
caption="Rayon"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -540,7 +540,7 @@
|
||||
caption="Uraian"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -549,22 +549,22 @@
|
||||
caption="Respon Pelanggan"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
|
||||
<template #cellLeft="{ data }">
|
||||
<template #formatText="{ data }">
|
||||
<p class="text-left cursor-pointer">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #cellRight="{ data }">
|
||||
<template #formatNumber="{ data }">
|
||||
<p class="text-right cursor-pointer">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #data-waktu="{ data }">
|
||||
<template #formatTime="{ data }">
|
||||
<p>
|
||||
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
||||
</p>
|
||||
|
||||
@ -58,7 +58,7 @@
|
||||
data-field="tanggal_lapor"
|
||||
caption="Tanggal Lapor"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cell-left"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="170"
|
||||
@ -142,7 +142,7 @@
|
||||
data-type="number"
|
||||
caption="Max"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -151,7 +151,7 @@
|
||||
data-type="number"
|
||||
caption="Min"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
@ -198,7 +198,7 @@
|
||||
data-type="number"
|
||||
caption="Max"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -207,7 +207,7 @@
|
||||
data-type="number"
|
||||
caption="Min"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
@ -341,8 +341,8 @@
|
||||
/>
|
||||
</DxSummary>
|
||||
|
||||
<template #data-waktu="{ data }">
|
||||
<p class="cursor-pointer" @click="showDialogDataSelected()">
|
||||
<template #formatTime="{ data }">
|
||||
<p class="cursor-pointer !text-right" @click="showDialogDataSelected()">
|
||||
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
||||
</p>
|
||||
</template>
|
||||
@ -351,7 +351,7 @@
|
||||
<p class="cursor-pointer" @click="showDialogDataSelected()">{{ data.text }}%</p>
|
||||
</template>
|
||||
|
||||
<template #cell-left="{ data }">
|
||||
<template #formatText="{ data }">
|
||||
<p class="cursor-pointer text-left" @click="showDialogDataSelected()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
@ -415,7 +415,7 @@
|
||||
"
|
||||
data-type="number"
|
||||
caption="No"
|
||||
cell-template="cellRight"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -423,7 +423,7 @@
|
||||
data-field="no_laporan"
|
||||
caption="No Laporan"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -431,7 +431,7 @@
|
||||
data-field="waktu_lapor"
|
||||
caption="Tgl Lapor"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -440,7 +440,7 @@
|
||||
caption="Dalam Proses Bidang"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -449,7 +449,7 @@
|
||||
caption="Selesai Bidang Unit"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -458,7 +458,7 @@
|
||||
caption="Durasi Response Time"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -467,7 +467,7 @@
|
||||
caption="Durasi Recovery Time"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -476,7 +476,7 @@
|
||||
caption="Status"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -485,7 +485,7 @@
|
||||
caption="IDPEL/NO METER"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -494,7 +494,7 @@
|
||||
caption="Nama Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="200"
|
||||
@ -503,7 +503,7 @@
|
||||
caption="Alamat Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -512,7 +512,7 @@
|
||||
caption="No Tlp Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="200"
|
||||
@ -521,7 +521,7 @@
|
||||
caption="Keterangan Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -530,7 +530,7 @@
|
||||
caption="Rayon"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -539,7 +539,7 @@
|
||||
caption="Uraian"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -548,22 +548,22 @@
|
||||
caption="Respon Pelanggan"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
|
||||
<template #cellLeft="{ data }">
|
||||
<template #formatText="{ data }">
|
||||
<p class="text-left cursor-pointer">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #cellRight="{ data }">
|
||||
<template #formatNumber="{ data }">
|
||||
<p class="text-right cursor-pointer">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #data-waktu="{ data }">
|
||||
<template #formatTime="{ data }">
|
||||
<p>
|
||||
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
||||
</p>
|
||||
|
||||
@ -68,7 +68,7 @@
|
||||
data-field="nama_ulp"
|
||||
caption="Unit"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cell-left"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
<DxColumn
|
||||
@ -469,8 +469,8 @@
|
||||
/>
|
||||
</DxSummary>
|
||||
|
||||
<template #data-waktu="{ data }">
|
||||
<p class="cursor-pointer" @click="showDialogDataSelected()">
|
||||
<template #formatTime="{ data }">
|
||||
<p class="cursor-pointer !text-right" @click="showDialogDataSelected()">
|
||||
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
||||
</p>
|
||||
</template>
|
||||
@ -479,7 +479,7 @@
|
||||
<p class="cursor-pointer" @click="showDialogDataSelected()">{{ data.text }}%</p>
|
||||
</template>
|
||||
|
||||
<template #cell-left="{ data }">
|
||||
<template #formatText="{ data }">
|
||||
<p class="cursor-pointer text-left" @click="showDialogDataSelected()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
@ -543,7 +543,7 @@
|
||||
"
|
||||
data-type="number"
|
||||
caption="No"
|
||||
cell-template="cellRight"
|
||||
cell-template="formatNumber"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -551,7 +551,7 @@
|
||||
data-field="no_laporan"
|
||||
caption="No Laporan"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -559,7 +559,7 @@
|
||||
data-field="waktu_lapor"
|
||||
caption="Tgl Lapor"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -568,7 +568,7 @@
|
||||
caption="Dalam Proses Bidang"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -577,7 +577,7 @@
|
||||
caption="Selesai Bidang Unit"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -586,7 +586,7 @@
|
||||
caption="Durasi Response Time"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -595,7 +595,7 @@
|
||||
caption="Durasi Recovery Time"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -604,7 +604,7 @@
|
||||
caption="Status"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -613,7 +613,7 @@
|
||||
caption="IDPEL/NO METER"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="data-waktu"
|
||||
cell-template="formatTime"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -622,7 +622,7 @@
|
||||
caption="Nama Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="200"
|
||||
@ -631,7 +631,7 @@
|
||||
caption="Alamat Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -640,7 +640,7 @@
|
||||
caption="No Tlp Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="200"
|
||||
@ -649,7 +649,7 @@
|
||||
caption="Keterangan Pelapor"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -658,7 +658,7 @@
|
||||
caption="Rayon"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -667,7 +667,7 @@
|
||||
caption="Uraian"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
@ -676,22 +676,22 @@
|
||||
caption="Respon Pelanggan"
|
||||
:allow-resizing="false"
|
||||
css-class="custom-table-column"
|
||||
cell-template="cellLeft"
|
||||
cell-template="formatText"
|
||||
/>
|
||||
|
||||
<template #cellLeft="{ data }">
|
||||
<template #formatText="{ data }">
|
||||
<p class="text-left cursor-pointer">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #cellRight="{ data }">
|
||||
<template #formatNumber="{ data }">
|
||||
<p class="text-right cursor-pointer">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #data-waktu="{ data }">
|
||||
<template #formatTime="{ data }">
|
||||
<p>
|
||||
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
||||
</p>
|
||||
|
||||
Reference in New Issue
Block a user