Update table cell templates in RGangguan_RatingPerPosko.vue

This commit is contained in:
Dede Fuji Abdul 2024-03-31 00:17:31 +07:00
parent fe31fe33be
commit 3612a6cf66
2 changed files with 123 additions and 23 deletions

View File

@ -98,7 +98,7 @@
data-type="number"
caption="Jml"
css-class="custom-table-column"
cell-template="formatNumberLaporanJmlSelesai"
cell-template="formatNumberLaporanJmlBelumSelesai"
/>
<DxColumn
alignment="center"
@ -116,7 +116,7 @@
data-type="number"
caption="Jml"
css-class="custom-table-column"
cell-template="formatNumberLaporanJmlBelumSelesai"
cell-template="formatNumberLaporanJmlSelesai"
/>
<DxColumn
alignment="center"
@ -209,19 +209,55 @@
</DxColumn>
<template #formatText="{ data }">
<p class="text-left cursor-pointer">
<p class="text-left cursor-pointer" @click="setAgreementDialog(false, 0)">
{{ data.text }}
</p>
</template>
<template #formatPercentage="{ data }">
<p class="text-right cursor-pointer">
<p class="text-right cursor-pointer" @click="setAgreementDialog(false, 0)">
{{ isNumber(data.text) ? formatPercentage(data.text) : data.text }}
</p>
</template>
<template #formatNumber="{ data }">
<p class="text-right cursor-pointer">
<p class="text-right cursor-pointer" @click="setAgreementDialog(false, 0)">
{{
isNumber(data.text)
? data.column.caption == '%'
? formatPercentage(data.text)
: formatNumber(data.text)
: data.text
}}
</p>
</template>
<template #formatNumberLaporanTotal="{ data }">
<p class="text-right cursor-pointer" @click="setAgreementDialog(true, 0)">
{{
isNumber(data.text)
? data.column.caption == '%'
? formatPercentage(data.text)
: formatNumber(data.text)
: data.text
}}
</p>
</template>
<template #formatNumberLaporanJmlSelesai="{ data }">
<p class="text-right cursor-pointer" @click="setAgreementDialog(true, 1)">
{{
isNumber(data.text)
? data.column.caption == '%'
? formatPercentage(data.text)
: formatNumber(data.text)
: data.text
}}
</p>
</template>
<template #formatNumberLaporanJmlBelumSelesai="{ data }">
<p class="text-right cursor-pointer" @click="setAgreementDialog(true, 2)">
{{
isNumber(data.text)
? data.column.caption == '%'
@ -233,7 +269,7 @@
</template>
<template #formatTime="{ data }">
<p class="!text-right cursor-pointer">
<p class="!text-right cursor-pointer" @click="setAgreementDialog(false, 0)">
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
</p>
</template>
@ -659,6 +695,13 @@ const reportMeta = ref({
up3: { id: 0, name: 'Semua Unit Pelaksanaan Pelayanan Pelanggan' },
periode: ''
})
const agreeToShowDialog = ref(false)
const progressSelected = ref(0)
const setAgreementDialog = (status: boolean, progress: number) => {
agreeToShowDialog.value = status
progressSelected.value = progress
}
const getDetail = async () => {
const dateValue = filters.value.periode.split(' s/d ')
@ -678,7 +721,7 @@ const getDetail = async () => {
idUlp: ref?.id_ulp ? ref?.id_ulp : 0,
namaRegional: ref?.nama_regional ? ref?.nama_regional : '',
media: ref?.media ? ref?.media : '',
isSelesai: 0,
isSelesai: progressSelected.value,
tanggal: '',
namaIssuetype: '',
namaSubissuetype: ''
@ -710,8 +753,10 @@ const showDetail = () => {
clearSelection()
dataSub.value = []
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
if (agreeToShowDialog.value) {
dialogDetail.value = true
getDetail()
}
}
const closeDialog = () => {
dialogDetail.value = false
@ -738,18 +783,23 @@ const onExportingDetail = (e: any) => {
const onSelectionChanged = ({ selectedRowsData }: any) => {
if (selectedRowsData[0] != undefined) {
dataSelected.value = selectedRowsData[0]
showDetail()
}
showDetail()
}
const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
if (selectedRowsData[0] != undefined) {
dataSubSelected.value = selectedRowsData[0]
}
console.log(dataSubSelected)
}
const resetData = () => {
data.value = []
dataSub.value = []
}
const filterData = async (params: any) => {
resetData()
const dateValue = params.periode.split(' s/d ')
const { posko, uid, up3 } = params

View File

@ -77,7 +77,7 @@
data-type="number"
caption="Total"
css-class="custom-table-column"
cell-template="formatNumber"
cell-template="formatNumberLaporanTotal"
/>
<DxColumn alignment="center" caption="Belum Selesai" css-class="custom-table-column">
<DxColumn
@ -86,7 +86,7 @@
data-type="number"
caption="Jml"
css-class="custom-table-column"
cell-template="formatNumber"
cell-template="formatNumberLaporanJmlBelumSelesai"
/>
<DxColumn
alignment="center"
@ -104,7 +104,7 @@
data-type="number"
caption="Jml"
css-class="custom-table-column"
cell-template="formatNumber"
cell-template="formatNumberLaporanJmlSelesai"
/>
<DxColumn
alignment="center"
@ -199,19 +199,55 @@
</DxColumn>
<template #formatText="{ data }">
<p class="text-left cursor-pointer">
<p class="text-left cursor-pointer" @click="setAgreementDialog(false, 0)">
{{ data.text }}
</p>
</template>
<template #formatPercentage="{ data }">
<p class="text-right cursor-pointer">
<p class="text-right cursor-pointer" @click="setAgreementDialog(false, 0)">
{{ parseFloat(data.text) ? formatPercentage(data.text) : '0%' }}
</p>
</template>
<template #formatNumber="{ data }">
<p class="text-right cursor-pointer">
<p class="text-right cursor-pointer" @click="setAgreementDialog(false, 0)">
{{
isNumber(data.text)
? data.column.caption == '%'
? formatPercentage(data.text)
: formatNumber(data.text)
: data.text
}}
</p>
</template>
<template #formatNumberLaporanTotal="{ data }">
<p class="text-right cursor-pointer" @click="setAgreementDialog(true, 0)">
{{
isNumber(data.text)
? data.column.caption == '%'
? formatPercentage(data.text)
: formatNumber(data.text)
: data.text
}}
</p>
</template>
<template #formatNumberLaporanJmlSelesai="{ data }">
<p class="text-right cursor-pointer" @click="setAgreementDialog(true, 1)">
{{
isNumber(data.text)
? data.column.caption == '%'
? formatPercentage(data.text)
: formatNumber(data.text)
: data.text
}}
</p>
</template>
<template #formatNumberLaporanJmlBelumSelesai="{ data }">
<p class="text-right cursor-pointer" @click="setAgreementDialog(true, 2)">
{{
isNumber(data.text)
? data.column.caption == '%'
@ -223,7 +259,7 @@
</template>
<template #formatTime="{ data }">
<p class="!text-right cursor-pointer">
<p class="!text-right cursor-pointer" @click="setAgreementDialog(false, 0)">
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
</p>
</template>
@ -650,6 +686,13 @@ const reportMeta = ref({
posko: { id: 0, name: 'Semua Posko' },
periode: ''
})
const agreeToShowDialog = ref(false)
const progressSelected = ref(0)
const setAgreementDialog = (status: boolean, progress: number) => {
agreeToShowDialog.value = status
progressSelected.value = progress
}
const getDetail = async () => {
const dateValue = filters.value.periode.split(' s/d ')
@ -669,7 +712,7 @@ const getDetail = async () => {
idUlp: ref?.id_ulp ? ref?.id_ulp : 0,
namaRegional: ref?.nama_regional ? ref?.nama_regional : '',
media: ref?.media ? ref?.media : '',
isSelesai: 0,
isSelesai: progressSelected.value,
tanggal: '',
namaIssuetype: '',
namaSubissuetype: ''
@ -703,8 +746,10 @@ const showDetail = () => {
clearSelection()
dataSub.value = []
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
if (agreeToShowDialog.value) {
dialogDetail.value = true
getDetail()
}
}
const closeDialog = () => {
@ -732,18 +777,23 @@ const onExportingDetail = (e: any) => {
const onDataSelectionChanged = ({ selectedRowsData }: any) => {
if (selectedRowsData[0] != undefined) {
dataSelected.value = selectedRowsData[0]
showDetail()
}
showDetail()
}
const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
if (selectedRowsData[0] != undefined) {
dataSubSelected.value = selectedRowsData[0]
}
console.log(dataSubSelected)
}
const resetData = () => {
data.value = []
dataSub.value = []
}
const filterData = async (params: any) => {
resetData()
const dateValue = params.periode.split(' s/d ')
const { posko, uid, up3 } = params