Update table cell templates in RGangguan_RatingPerPosko.vue
This commit is contained in:
parent
fe31fe33be
commit
3612a6cf66
@ -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
|
||||
|
||||
|
@ -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
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user