Merge branch 'dev-defuj' of github.com:defuj/eis into dev-bagus
This commit is contained in:
commit
dbc6d3265b
@ -18,6 +18,7 @@
|
||||
:word-wrap-enabled="true"
|
||||
:data-source="data"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -358,6 +359,7 @@ import {
|
||||
DxColumnFixing,
|
||||
DxExport,
|
||||
DxGroupItem,
|
||||
DxGrouping,
|
||||
DxLoadPanel,
|
||||
DxPaging,
|
||||
DxScrolling,
|
||||
|
@ -18,6 +18,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -438,6 +439,7 @@ import {
|
||||
DxColumnFixing,
|
||||
DxExport,
|
||||
DxGroupItem,
|
||||
DxGrouping,
|
||||
DxLoadPanel,
|
||||
DxPaging,
|
||||
DxScrolling,
|
||||
|
@ -111,13 +111,13 @@
|
||||
/>
|
||||
|
||||
<template #formatText="{ data }">
|
||||
<p class="text-left cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="text-left cursor-pointer" @click="showDetail()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #formatNumber="{ data }">
|
||||
<p class="text-right cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="text-right cursor-pointer" @click="showDetail()">
|
||||
{{
|
||||
isNumber(data.text)
|
||||
? data.column.caption == '%'
|
||||
@ -181,9 +181,9 @@
|
||||
</div>
|
||||
|
||||
<DetailDialog
|
||||
:open="dialogDataSelected"
|
||||
:open="dialogDetail"
|
||||
title="Daftar Detail Jumlah WO Gangguan Individu"
|
||||
@on-close="closeDialogDataSelected"
|
||||
@on-close="closedialogDetail"
|
||||
:full-width="true"
|
||||
>
|
||||
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
|
||||
@ -204,10 +204,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
@ -829,11 +829,11 @@ const dataSelected = ref<any>()
|
||||
const dataSubSelected = ref<any>()
|
||||
const data = ref<any[]>([])
|
||||
const dataSub = ref<any[]>([])
|
||||
const dialogDataSelected = ref(false)
|
||||
const dialogDetail = ref(false)
|
||||
const loadingData = ref(false)
|
||||
const loadingSubData = ref(false)
|
||||
|
||||
const closeDialogDataSelected = () => (dialogDataSelected.value = false)
|
||||
const closedialogDetail = () => (dialogDetail.value = false)
|
||||
|
||||
const getDetail = () => {
|
||||
loadingSubData.value = true
|
||||
@ -857,8 +857,6 @@ const getDetail = () => {
|
||||
query
|
||||
)
|
||||
|
||||
refetch(query)
|
||||
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
dataSub.value = queryResult.data.detailGangguan
|
||||
@ -873,11 +871,11 @@ const getDetail = () => {
|
||||
loadingSubData.value = value
|
||||
})
|
||||
}
|
||||
const showDialogDataSelected = () => {
|
||||
const showDetail = () => {
|
||||
if (dataSelected.value != null) {
|
||||
dataSub.value = []
|
||||
dataSubSelected.value = null
|
||||
dialogDataSelected.value = true
|
||||
dialogDetail.value = true
|
||||
getDetail()
|
||||
}
|
||||
}
|
||||
@ -913,7 +911,7 @@ const onExporting = (e: any) => {
|
||||
|
||||
const onDataSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
dataSelected.value = selectedRowsData[0]
|
||||
showDialogDataSelected()
|
||||
showDetail()
|
||||
}
|
||||
|
||||
const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
|
@ -20,10 +20,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
|
@ -21,10 +21,10 @@
|
||||
:allow-column-resizing="true"
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
|
@ -20,10 +20,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
|
@ -20,10 +20,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
|
@ -36,10 +36,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
|
@ -20,10 +20,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
|
@ -20,10 +20,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
|
@ -23,7 +23,7 @@
|
||||
:allow-column-resizing="true"
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxGrouping :auto-expand-all="false" />
|
||||
<DxGrouping :auto-expand-all="false" :context-menu-enabled="true" expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<!-- <DxPaging :page-size="40" :enabled="true" />
|
||||
<DxPager
|
||||
@ -320,13 +320,13 @@
|
||||
</DxColumn>
|
||||
|
||||
<template #formatText="{ data }">
|
||||
<p class="text-left cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="text-left cursor-pointer" @click="showDetail()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #formatNumber="{ data }">
|
||||
<p class="text-right cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="text-right cursor-pointer" @click="showDetail()">
|
||||
{{
|
||||
isNumber(data.text)
|
||||
? data.column.caption == '%'
|
||||
@ -338,7 +338,7 @@
|
||||
</template>
|
||||
|
||||
<template #formatTime="{ data }">
|
||||
<p @click="showDialogDataSelected()">
|
||||
<p @click="showDetail()">
|
||||
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
||||
</p>
|
||||
</template>
|
||||
@ -510,9 +510,9 @@
|
||||
</div>
|
||||
|
||||
<DetailDialog
|
||||
:open="dialogDataSelected"
|
||||
:open="dialogDetail"
|
||||
title="Detail Gangguan All"
|
||||
@on-close="closeDialogDataSelected"
|
||||
@on-close="closedialogDetail"
|
||||
:full-width="true"
|
||||
>
|
||||
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
|
||||
@ -533,10 +533,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
@ -1038,12 +1038,13 @@ const data = ref<any[]>([])
|
||||
const dataSub = ref<any[]>([])
|
||||
const dataSelected = ref<any>(null)
|
||||
const dataSubSelected = ref<any>(null)
|
||||
const dialogDataSelected = ref(false)
|
||||
const closeDialogDataSelected = () => (dialogDataSelected.value = false)
|
||||
const dialogDetail = ref(false)
|
||||
const closedialogDetail = () => (dialogDetail.value = false)
|
||||
const loadingData = ref(false)
|
||||
const loadingSubData = ref(false)
|
||||
|
||||
const filterData = (params: any) => {
|
||||
loadingData.value = true
|
||||
const { posko, uid, up3 } = params
|
||||
const dateValue = params.periode.split(' s/d ')
|
||||
|
||||
@ -1102,8 +1103,6 @@ const getDetail = () => {
|
||||
query
|
||||
)
|
||||
|
||||
refetch(query)
|
||||
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
dataSub.value = queryResult.data.detailGangguan
|
||||
@ -1118,13 +1117,15 @@ const getDetail = () => {
|
||||
loadingSubData.value = value
|
||||
})
|
||||
}
|
||||
|
||||
const showDialogDataSelected = () => {
|
||||
const currentDataSelected = ref<any>(null)
|
||||
const showDetail = () => {
|
||||
if (dataSelected.value != null) {
|
||||
dataSub.value = []
|
||||
dataSubSelected.value = null
|
||||
dialogDataSelected.value = true
|
||||
getDetail()
|
||||
if (currentDataSelected.value == dataSelected.value) {
|
||||
dataSub.value = []
|
||||
dataSubSelected.value = null
|
||||
dialogDetail.value = true
|
||||
getDetail()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1262,8 +1263,11 @@ const onExporting = (e: any) => {
|
||||
}
|
||||
|
||||
const onDataSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
dataSelected.value = selectedRowsData[0]
|
||||
showDialogDataSelected()
|
||||
if (dataSelected.value != selectedRowsData[0]) {
|
||||
dataSelected.value = selectedRowsData[0]
|
||||
currentDataSelected.value = selectedRowsData[0]
|
||||
showDetail()
|
||||
}
|
||||
}
|
||||
|
||||
const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
|
@ -24,6 +24,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -163,10 +164,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
@ -496,7 +497,8 @@ import {
|
||||
DxSelection,
|
||||
DxSummary,
|
||||
DxGroupItem,
|
||||
DxPager
|
||||
DxPager,
|
||||
DxGrouping
|
||||
} from 'devextreme-vue/data-grid'
|
||||
import { jsPDF } from 'jspdf'
|
||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||
@ -549,8 +551,6 @@ const getDetail = () => {
|
||||
query
|
||||
)
|
||||
|
||||
refetch(query)
|
||||
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
dataSub.value = queryResult.data.detailGangguan
|
||||
|
@ -157,10 +157,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
@ -538,8 +538,6 @@ const getDetail = () => {
|
||||
query
|
||||
)
|
||||
|
||||
refetch(query)
|
||||
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
dataSub.value = queryResult.data.detailGangguan
|
||||
|
@ -437,10 +437,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
@ -813,8 +813,6 @@ const getDetail = () => {
|
||||
query
|
||||
)
|
||||
|
||||
refetch(query)
|
||||
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
dataSub.value = queryResult.data.detailGangguan
|
||||
|
@ -45,7 +45,7 @@
|
||||
/>
|
||||
<DxColumnFixing :enabled="true" />
|
||||
<DxGroupPanel :visible="true" />
|
||||
<DxGrouping :auto-expand-all="true" />
|
||||
<DxGrouping :auto-expand-all="true" :context-menu-enabled="true" expand-mode="rowClick" />
|
||||
|
||||
<DxColumn
|
||||
:width="60"
|
||||
|
@ -27,6 +27,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -448,10 +449,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
@ -777,7 +778,8 @@ import {
|
||||
DxSelection,
|
||||
DxSummary,
|
||||
DxGroupItem,
|
||||
DxPager
|
||||
DxPager,
|
||||
DxGrouping
|
||||
} from 'devextreme-vue/data-grid'
|
||||
import { jsPDF } from 'jspdf'
|
||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||
@ -887,10 +889,10 @@ const getDetail = () => {
|
||||
dateTo: dateValue[1]
|
||||
? dateValue[1].split('-').reverse().join('-')
|
||||
: new Date().toISOString().slice(0, 10),
|
||||
posko: ref.id_posko,
|
||||
idUid: ref.id_uid,
|
||||
idUp3: ref.id_up3,
|
||||
idEquipment: ref?.id_equipment ? ref.id_equipment : 0
|
||||
posko: filters.value?.id_posko ? filters.value.id_posko : 0,
|
||||
idUid: filters.value?.id_uid ? filters.value.id_uid : 0,
|
||||
idUp3: filters.value?.id_up3 ? filters.value.id_up3 : 0,
|
||||
idEquipment: ref?.kode ? ref.kode : 0
|
||||
}
|
||||
|
||||
const { onResult, onError, loading, refetch } = useQuery(
|
||||
@ -898,8 +900,6 @@ const getDetail = () => {
|
||||
query
|
||||
)
|
||||
|
||||
refetch(query)
|
||||
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
dataSub.value = queryResult.data.detailGangguan
|
||||
|
@ -17,7 +17,7 @@
|
||||
:allow-column-resizing="true"
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxGrouping :auto-expand-all="false" />
|
||||
<DxGrouping :auto-expand-all="false" :context-menu-enabled="true" expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -26,8 +26,7 @@
|
||||
:show-indicator="showIndicator"
|
||||
:show-pane="showPane"
|
||||
:shading="shading"
|
||||
v-if="loading"
|
||||
v-model:visible="loading"
|
||||
v-model:visible="loadingData"
|
||||
:enabled="true"
|
||||
/>
|
||||
|
||||
@ -272,19 +271,19 @@
|
||||
</DxSummary>
|
||||
|
||||
<template #formatText="{ data }">
|
||||
<p class="text-left cursor-pointer" @click="showData()">
|
||||
<p class="text-left cursor-pointer" @click="showDetail()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #formatPercentage="{ data }">
|
||||
<p class="text-right cursor-pointer" @click="showData()">
|
||||
<p class="text-right cursor-pointer" @click="showDetail()">
|
||||
{{ isNumber(data.text) ? formatPercentage(data.text) : data.text }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #formatNumber="{ data }">
|
||||
<p class="text-right cursor-pointer" @click="showData()">
|
||||
<p class="text-right cursor-pointer" @click="showDetail()">
|
||||
{{
|
||||
isNumber(data.text)
|
||||
? data.column.caption == '%'
|
||||
@ -304,7 +303,7 @@
|
||||
</div>
|
||||
|
||||
<DetailDialog
|
||||
:open="showDetail"
|
||||
:open="dialogDetail"
|
||||
title="Detail Rekapitulasi Koreksi Transaksi Individual"
|
||||
@on-close="closeDetail"
|
||||
:full-width="true"
|
||||
@ -327,10 +326,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
@ -962,7 +961,7 @@
|
||||
<script setup lang="ts">
|
||||
import Filters from '@/components/Form/Filters.vue'
|
||||
import Type18 from '@/components/Form/FiltersType/Type18.vue'
|
||||
import { onMounted, ref } from 'vue'
|
||||
import { onMounted, ref, watch } from 'vue'
|
||||
import { DxDataGrid } from 'devextreme-vue'
|
||||
import {
|
||||
DxColumn,
|
||||
@ -989,7 +988,11 @@ import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
|
||||
import { formatWaktu } from '@/components/Form/FiltersType/reference'
|
||||
import DetailDialog from '@/components/Dialogs/DetailDialog.vue'
|
||||
import InputText from '@/components/InputText.vue'
|
||||
import { apolloClient } from '@/utils/api/api.graphql'
|
||||
import { provideApolloClient } from '@vue/apollo-composable'
|
||||
|
||||
const client = apolloClient()
|
||||
provideApolloClient(client)
|
||||
const position = { of: '#data' }
|
||||
const showIndicator = ref(true)
|
||||
const shading = ref(true)
|
||||
@ -998,15 +1001,62 @@ const data = ref<any[]>([])
|
||||
const dataSub = ref<any[]>([])
|
||||
const dataSelected = ref()
|
||||
const dataSubSelected = ref()
|
||||
const showDetail = ref(false)
|
||||
const dialogDetail = ref(false)
|
||||
const loadingData = ref(false)
|
||||
const loadingSubData = ref(false)
|
||||
|
||||
const showData = () => {
|
||||
showDetail.value = true
|
||||
const getDetail = () => {
|
||||
loadingSubData.value = true
|
||||
const dateValue = filters.value.periode.split(' s/d ')
|
||||
const ref = dataSelected.value
|
||||
|
||||
const query = {
|
||||
dateFrom: dateValue[0]
|
||||
? dateValue[0].split('-').reverse().join('-')
|
||||
: new Date().toISOString().slice(0, 10),
|
||||
dateTo: dateValue[1]
|
||||
? dateValue[1].split('-').reverse().join('-')
|
||||
: new Date().toISOString().slice(0, 10),
|
||||
posko: ref?.id_posko ? ref?.id_posko : 0,
|
||||
idUid: ref?.id_uid ? ref?.id_uid : 0,
|
||||
idUp3: ref?.id_up3 ? ref?.id_up3 : 0,
|
||||
idRegu: ref?.id_regu ? ref?.id_regu : 0,
|
||||
idUlp: ref?.id_ulp ? ref?.id_ulp : 0,
|
||||
namaRegional: ref?.nama_regional ? ref?.nama_regional : '',
|
||||
media: ref?.media ? ref?.media : ''
|
||||
}
|
||||
|
||||
const { onResult, onError, loading, refetch } = useQuery(
|
||||
queries.gangguan.rekap.gangguanAllDetail,
|
||||
query
|
||||
)
|
||||
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
dataSub.value = queryResult.data.detailGangguan
|
||||
}
|
||||
})
|
||||
|
||||
onError((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
|
||||
watch(loading, (value) => {
|
||||
loadingSubData.value = value
|
||||
})
|
||||
}
|
||||
|
||||
const showDetail = () => {
|
||||
if (dataSelected.value != null) {
|
||||
dataSub.value = []
|
||||
dataSubSelected.value = null
|
||||
dialogDetail.value = true
|
||||
getDetail()
|
||||
}
|
||||
}
|
||||
|
||||
const closeDetail = () => {
|
||||
showDetail.value = false
|
||||
dialogDetail.value = false
|
||||
}
|
||||
|
||||
const onExporting = (e: any) => {
|
||||
@ -1040,38 +1090,31 @@ const onExporting = (e: any) => {
|
||||
|
||||
const onDataSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
dataSelected.value = selectedRowsData[0]
|
||||
console.log(data)
|
||||
showDetail()
|
||||
}
|
||||
|
||||
const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
dataSubSelected.value = selectedRowsData[0]
|
||||
console.log(dataSubSelected)
|
||||
}
|
||||
|
||||
const { onResult, onError, loading, refetch } = useQuery(
|
||||
queries.gangguan.rekap.gangguanKoreksiTransaksiIndividual,
|
||||
{
|
||||
dateFrom: new Date().toISOString().slice(0, 10),
|
||||
dateTo: new Date().toISOString().slice(0, 10),
|
||||
posko: 0,
|
||||
idUid: 0,
|
||||
idUp3: 0
|
||||
}
|
||||
)
|
||||
const filterData = (params: any) => {
|
||||
const dateValue = params.periode.split(' s/d ')
|
||||
const { posko, uid, up3 } = params
|
||||
refetch({
|
||||
dateFrom: dateValue[0]
|
||||
? dateValue[0].split('-').reverse().join('-')
|
||||
: new Date().toISOString().slice(0, 10),
|
||||
dateTo: dateValue[1]
|
||||
? dateValue[1].split('-').reverse().join('-')
|
||||
: new Date().toISOString().slice(0, 10),
|
||||
posko: posko ? posko.id : 0,
|
||||
idUid: uid ? uid.id : 0,
|
||||
idUp3: up3 ? up3.id : 0
|
||||
})
|
||||
|
||||
const { onResult, onError, loading, refetch } = useQuery(
|
||||
queries.gangguan.rekap.gangguanKoreksiTransaksiIndividual,
|
||||
{
|
||||
dateFrom: dateValue[0]
|
||||
? dateValue[0].split('-').reverse().join('-')
|
||||
: new Date().toISOString().slice(0, 10),
|
||||
dateTo: dateValue[1]
|
||||
? dateValue[1].split('-').reverse().join('-')
|
||||
: new Date().toISOString().slice(0, 10),
|
||||
idPosko: posko ? posko.id : 0,
|
||||
idUid: uid ? uid.id : 0,
|
||||
idUp3: up3 ? up3.id : 0
|
||||
}
|
||||
)
|
||||
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
@ -1081,10 +1124,16 @@ const filterData = (params: any) => {
|
||||
console.log(queryResult.loading)
|
||||
console.log(queryResult.networkStatus)
|
||||
})
|
||||
|
||||
onError((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
|
||||
watch(loading, (value) => {
|
||||
loadingData.value = value
|
||||
})
|
||||
}
|
||||
|
||||
const filters = ref()
|
||||
onMounted(() => {
|
||||
if (import.meta.env.DEV) {
|
||||
|
@ -27,6 +27,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -533,10 +534,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
@ -852,6 +853,7 @@ import {
|
||||
DxColumnFixing,
|
||||
DxExport,
|
||||
DxGroupItem,
|
||||
DxGrouping,
|
||||
DxLoadPanel,
|
||||
DxPager,
|
||||
DxPaging,
|
||||
@ -914,8 +916,6 @@ const getDetail = () => {
|
||||
query
|
||||
)
|
||||
|
||||
refetch(query)
|
||||
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
dataSub.value = queryResult.data.detailGangguan
|
||||
|
@ -292,10 +292,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
@ -676,8 +676,6 @@ const getDetail = () => {
|
||||
query
|
||||
)
|
||||
|
||||
refetch(query)
|
||||
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
dataSub.value = queryResult.data.detailGangguan
|
||||
|
@ -18,6 +18,7 @@
|
||||
:allow-column-resizing="true"
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -254,10 +255,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
@ -606,6 +607,7 @@ import {
|
||||
DxColumn,
|
||||
DxColumnFixing,
|
||||
DxExport,
|
||||
DxGrouping,
|
||||
DxLoadPanel,
|
||||
DxPager,
|
||||
DxPaging,
|
||||
@ -669,8 +671,6 @@ const getDetail = () => {
|
||||
query
|
||||
)
|
||||
|
||||
refetch(query)
|
||||
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
dataSub.value = queryResult.data.detailGangguan
|
||||
|
@ -246,10 +246,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
@ -661,8 +661,6 @@ const getDetail = () => {
|
||||
query
|
||||
)
|
||||
|
||||
refetch(query)
|
||||
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
dataSub.value = queryResult.data.detailGangguan
|
||||
|
@ -21,10 +21,10 @@
|
||||
:word-wrap-enabled="false"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
|
@ -21,10 +21,10 @@
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
|
@ -21,10 +21,10 @@
|
||||
:word-wrap-enabled="false"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
|
@ -37,10 +37,10 @@
|
||||
:word-wrap-enabled="false"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
|
@ -37,10 +37,10 @@
|
||||
:word-wrap-enabled="false"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
|
@ -21,10 +21,10 @@
|
||||
:word-wrap-enabled="false"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
|
@ -21,10 +21,10 @@
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
|
@ -24,7 +24,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping :auto-expand-all="false" />
|
||||
<DxGrouping :auto-expand-all="false" :context-menu-enabled="true" expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -395,13 +395,13 @@
|
||||
</DxSummary>
|
||||
|
||||
<template #formatTime="{ data }">
|
||||
<p class="cursor-pointer !text-right" @click="showDialogDataSelected()">
|
||||
<p class="cursor-pointer !text-right" @click="showDetail()">
|
||||
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #formatNumber="{ data }">
|
||||
<p class="text-right cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="text-right cursor-pointer" @click="showDetail()">
|
||||
{{
|
||||
isNumber(data.text)
|
||||
? data.column.caption == '%'
|
||||
@ -413,7 +413,7 @@
|
||||
</template>
|
||||
|
||||
<template #formatText="{ data }">
|
||||
<p class="cursor-pointer !text-left" @click="showDialogDataSelected()">
|
||||
<p class="cursor-pointer !text-left" @click="showDetail()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
@ -421,9 +421,9 @@
|
||||
</div>
|
||||
|
||||
<DetailDialog
|
||||
:open="dialogDataSelected"
|
||||
:open="dialogDetail"
|
||||
title="Detail Rekapitulasi Keluhan All"
|
||||
@on-close="closeDialogDataSelected"
|
||||
@on-close="closedialogDetail"
|
||||
:full-width="true"
|
||||
>
|
||||
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
|
||||
@ -444,10 +444,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
@ -800,8 +800,8 @@ const data = ref<any[]>([])
|
||||
const dataSub = ref<any[]>([])
|
||||
const dataSelected = ref<any>()
|
||||
const dataSubSelected = ref<any>()
|
||||
const dialogDataSelected = ref(false)
|
||||
const closeDialogDataSelected = () => (dialogDataSelected.value = false)
|
||||
const dialogDetail = ref(false)
|
||||
const closedialogDetail = () => (dialogDetail.value = false)
|
||||
const loadingData = ref(false)
|
||||
const loadingSubData = ref(false)
|
||||
|
||||
@ -851,8 +851,8 @@ const getDetail = () => {
|
||||
dataSub.value = dummyData.keluhan.rekap.rekapitulasiKeluhanAll
|
||||
}
|
||||
|
||||
const showDialogDataSelected = () => {
|
||||
dialogDataSelected.value = true
|
||||
const showDetail = () => {
|
||||
dialogDetail.value = true
|
||||
getDetail()
|
||||
}
|
||||
|
||||
|
@ -100,7 +100,7 @@
|
||||
</DxSummary>
|
||||
|
||||
<template #formatNumber="{ data }">
|
||||
<p class="!text-right cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="!text-right cursor-pointer" @click="showDetail()">
|
||||
{{
|
||||
isNumber(data.text)
|
||||
? data.column.caption == '%'
|
||||
@ -112,7 +112,7 @@
|
||||
</template>
|
||||
|
||||
<template #formatText="{ data }">
|
||||
<p class="text-left cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="text-left cursor-pointer" @click="showDetail()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
@ -120,9 +120,9 @@
|
||||
</div>
|
||||
|
||||
<DetailDialog
|
||||
:open="dialogDataSelected"
|
||||
:open="dialogDetail"
|
||||
title="Rekapitulasi Keluhan Berdasarkan Media"
|
||||
@on-close="closeDialogDataSelected"
|
||||
@on-close="closedialogDetail"
|
||||
:full-width="true"
|
||||
>
|
||||
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
|
||||
@ -143,10 +143,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
@ -500,8 +500,8 @@ const data = ref<any[]>([])
|
||||
const dataSub = ref<any[]>([])
|
||||
const dataSelected = ref<any>()
|
||||
const dataSubSelected = ref<any>()
|
||||
const dialogDataSelected = ref(false)
|
||||
const closeDialogDataSelected = () => (dialogDataSelected.value = false)
|
||||
const dialogDetail = ref(false)
|
||||
const closedialogDetail = () => (dialogDetail.value = false)
|
||||
const loadingData = ref(false)
|
||||
const loadingSubData = ref(false)
|
||||
|
||||
@ -554,8 +554,8 @@ const filterData = (params: any) => {
|
||||
|
||||
const getDetail = () => {}
|
||||
|
||||
const showDialogDataSelected = () => {
|
||||
dialogDataSelected.value = true
|
||||
const showDetail = () => {
|
||||
dialogDetail.value = true
|
||||
console.log(dataSelected.value)
|
||||
getDetail()
|
||||
}
|
||||
|
@ -25,6 +25,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -362,12 +363,12 @@
|
||||
</DxSummary>
|
||||
|
||||
<template #formatTime="{ data }">
|
||||
<p class="cursor-pointer !text-right" @click="showDialogDataSelected()">
|
||||
<p class="cursor-pointer !text-right" @click="showDetail()">
|
||||
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
||||
</p>
|
||||
</template>
|
||||
<template #formatNumber="{ data }">
|
||||
<p class="text-right cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="text-right cursor-pointer" @click="showDetail()">
|
||||
{{
|
||||
isNumber(data.text)
|
||||
? data.column.caption == '%'
|
||||
@ -379,7 +380,7 @@
|
||||
</template>
|
||||
|
||||
<template #formatText="{ data }">
|
||||
<p class="cursor-pointer !text-left" @click="showDialogDataSelected()">
|
||||
<p class="cursor-pointer !text-left" @click="showDetail()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
@ -387,9 +388,9 @@
|
||||
</div>
|
||||
|
||||
<DetailDialog
|
||||
:open="dialogDataSelected"
|
||||
:open="dialogDetail"
|
||||
title="Rekapitulasi Keluhan Per Fungsi Bidang"
|
||||
@on-close="closeDialogDataSelected"
|
||||
@on-close="closedialogDetail"
|
||||
:full-width="true"
|
||||
>
|
||||
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
|
||||
@ -410,10 +411,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
@ -752,7 +753,8 @@ import {
|
||||
DxTotalItem,
|
||||
DxScrolling,
|
||||
DxSearchPanel,
|
||||
DxSelection
|
||||
DxSelection,
|
||||
DxGrouping
|
||||
} from 'devextreme-vue/data-grid'
|
||||
import { jsPDF } from 'jspdf'
|
||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||
@ -773,8 +775,8 @@ const data = ref<any[]>([])
|
||||
const dataSub = ref<any[]>([])
|
||||
const dataSelected = ref<any>()
|
||||
const dataSubSelected = ref<any>()
|
||||
const dialogDataSelected = ref(false)
|
||||
const closeDialogDataSelected = () => (dialogDataSelected.value = false)
|
||||
const dialogDetail = ref(false)
|
||||
const closedialogDetail = () => (dialogDetail.value = false)
|
||||
const loadingData = ref(false)
|
||||
const loadingSubData = ref(false)
|
||||
|
||||
@ -826,8 +828,8 @@ const getDetail = () => {
|
||||
dataSub.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPenyelesaianPerFungsiBidang
|
||||
}
|
||||
|
||||
const showDialogDataSelected = () => {
|
||||
dialogDataSelected.value = true
|
||||
const showDetail = () => {
|
||||
dialogDetail.value = true
|
||||
getDetail()
|
||||
}
|
||||
|
||||
|
@ -25,6 +25,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -516,13 +517,13 @@
|
||||
</DxSummary>
|
||||
|
||||
<template #formatTime="{ data }">
|
||||
<p class="cursor-pointer !text-right" @click="showDialogDataSelected()">
|
||||
<p class="cursor-pointer !text-right" @click="showDetail()">
|
||||
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #formatNumber="{ data }">
|
||||
<p class="text-right cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="text-right cursor-pointer" @click="showDetail()">
|
||||
{{
|
||||
isNumber(data.text)
|
||||
? data.column.caption == '%'
|
||||
@ -534,7 +535,7 @@
|
||||
</template>
|
||||
|
||||
<template #formatText="{ data }">
|
||||
<p class="text-left cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="text-left cursor-pointer" @click="showDetail()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
@ -542,9 +543,9 @@
|
||||
</div>
|
||||
|
||||
<DetailDialog
|
||||
:open="dialogDataSelected"
|
||||
:open="dialogDetail"
|
||||
title="Rekapitulasi Keluhan Per Jenis Keluhan"
|
||||
@on-close="closeDialogDataSelected"
|
||||
@on-close="closedialogDetail"
|
||||
:full-width="true"
|
||||
>
|
||||
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
|
||||
@ -565,10 +566,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
@ -900,7 +901,8 @@ import {
|
||||
DxScrolling,
|
||||
DxSearchPanel,
|
||||
DxSelection,
|
||||
DxGroupItem
|
||||
DxGroupItem,
|
||||
DxGrouping
|
||||
} from 'devextreme-vue/data-grid'
|
||||
import { jsPDF } from 'jspdf'
|
||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||
@ -921,8 +923,8 @@ const data = ref<any[]>([])
|
||||
const dataSub = ref<any[]>([])
|
||||
const dataSelected = ref<any>()
|
||||
const dataSubSelected = ref<any>()
|
||||
const dialogDataSelected = ref(false)
|
||||
const closeDialogDataSelected = () => (dialogDataSelected.value = false)
|
||||
const dialogDetail = ref(false)
|
||||
const closedialogDetail = () => (dialogDetail.value = false)
|
||||
const loadingData = ref(false)
|
||||
const loadingSubData = ref(false)
|
||||
|
||||
@ -975,8 +977,8 @@ const getDetail = () => {
|
||||
// dataSub.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPerJenisKeluhan
|
||||
}
|
||||
|
||||
const showDialogDataSelected = () => {
|
||||
dialogDataSelected.value = true
|
||||
const showDetail = () => {
|
||||
dialogDetail.value = true
|
||||
getDetail()
|
||||
}
|
||||
|
||||
|
@ -25,6 +25,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -373,13 +374,13 @@
|
||||
</DxSummary>
|
||||
|
||||
<template #formatTime="{ data }">
|
||||
<p class="!text-right cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="!text-right cursor-pointer" @click="showDetail()">
|
||||
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #formatNumber="{ data }">
|
||||
<p class="text-right cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="text-right cursor-pointer" @click="showDetail()">
|
||||
{{
|
||||
isNumber(data.text)
|
||||
? data.column.caption == '%'
|
||||
@ -391,7 +392,7 @@
|
||||
</template>
|
||||
|
||||
<template #formatText="{ data }">
|
||||
<p class="!text-left cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="!text-left cursor-pointer" @click="showDetail()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
@ -399,9 +400,9 @@
|
||||
</div>
|
||||
|
||||
<DetailDialog
|
||||
:open="dialogDataSelected"
|
||||
:open="dialogDetail"
|
||||
title="Detail Rekapitulasi Keluhan Per Kelompok Keluhan"
|
||||
@on-close="closeDialogDataSelected"
|
||||
@on-close="closedialogDetail"
|
||||
:full-width="true"
|
||||
>
|
||||
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
|
||||
@ -422,10 +423,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
@ -758,7 +759,8 @@ import {
|
||||
DxTotalItem,
|
||||
DxScrolling,
|
||||
DxSearchPanel,
|
||||
DxSelection
|
||||
DxSelection,
|
||||
DxGrouping
|
||||
} from 'devextreme-vue/data-grid'
|
||||
import { jsPDF } from 'jspdf'
|
||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||
@ -779,8 +781,8 @@ const data = ref<any[]>([])
|
||||
const dataSub = ref<any[]>([])
|
||||
const dataSelected = ref<any>()
|
||||
const dataSubSelected = ref<any>()
|
||||
const dialogDataSelected = ref(false)
|
||||
const closeDialogDataSelected = () => (dialogDataSelected.value = false)
|
||||
const dialogDetail = ref(false)
|
||||
const closedialogDetail = () => (dialogDetail.value = false)
|
||||
const loadingData = ref(false)
|
||||
const loadingSubData = ref(false)
|
||||
|
||||
@ -833,8 +835,8 @@ const getDetail = () => {
|
||||
dataSub.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPerKelompokKeluhan
|
||||
}
|
||||
|
||||
const showDialogDataSelected = () => {
|
||||
dialogDataSelected.value = true
|
||||
const showDetail = () => {
|
||||
dialogDetail.value = true
|
||||
getDetail()
|
||||
}
|
||||
|
||||
|
@ -25,6 +25,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -372,17 +373,17 @@
|
||||
</DxSummary>
|
||||
|
||||
<template #formatTime="{ data }">
|
||||
<p class="!text-right cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="!text-right cursor-pointer" @click="showDetail()">
|
||||
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #percent="{ data }">
|
||||
<p class="cursor-pointer" @click="showDialogDataSelected()">{{ data.text }}%</p>
|
||||
<p class="cursor-pointer" @click="showDetail()">{{ data.text }}%</p>
|
||||
</template>
|
||||
|
||||
<template #formatNumber="{ data }">
|
||||
<p class="text-right cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="text-right cursor-pointer" @click="showDetail()">
|
||||
{{
|
||||
isNumber(data.text)
|
||||
? data.column.caption == '%'
|
||||
@ -394,7 +395,7 @@
|
||||
</template>
|
||||
|
||||
<template #formatText="{ data }">
|
||||
<p class="text-left cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="text-left cursor-pointer" @click="showDetail()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
@ -402,9 +403,9 @@
|
||||
</div>
|
||||
|
||||
<DetailDialog
|
||||
:open="dialogDataSelected"
|
||||
:open="dialogDetail"
|
||||
title="Rekapitulasi Keluhan Per Tanggal"
|
||||
@on-close="closeDialogDataSelected"
|
||||
@on-close="closedialogDetail"
|
||||
:full-width="true"
|
||||
>
|
||||
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
|
||||
@ -425,10 +426,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
@ -761,7 +762,8 @@ import {
|
||||
DxTotalItem,
|
||||
DxScrolling,
|
||||
DxSearchPanel,
|
||||
DxSelection
|
||||
DxSelection,
|
||||
DxGrouping
|
||||
} from 'devextreme-vue/data-grid'
|
||||
import { jsPDF } from 'jspdf'
|
||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||
@ -782,8 +784,8 @@ const data = ref<any[]>([])
|
||||
const dataSub = ref<any[]>([])
|
||||
const dataSelected = ref<any>()
|
||||
const dataSubSelected = ref<any>()
|
||||
const dialogDataSelected = ref(false)
|
||||
const closeDialogDataSelected = () => (dialogDataSelected.value = false)
|
||||
const dialogDetail = ref(false)
|
||||
const closedialogDetail = () => (dialogDetail.value = false)
|
||||
const loadingData = ref(false)
|
||||
const loadingSubData = ref(false)
|
||||
|
||||
@ -833,8 +835,8 @@ const getDetail = () => {
|
||||
dataSub.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPerTanggal
|
||||
}
|
||||
|
||||
const showDialogDataSelected = () => {
|
||||
dialogDataSelected.value = true
|
||||
const showDetail = () => {
|
||||
dialogDetail.value = true
|
||||
getDetail()
|
||||
}
|
||||
|
||||
|
@ -24,6 +24,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -515,13 +516,13 @@
|
||||
</DxSummary>
|
||||
|
||||
<template #formatTime="{ data }">
|
||||
<p class="cursor-pointer !text-right" @click="showDialogDataSelected()">
|
||||
<p class="cursor-pointer !text-right" @click="showDetail()">
|
||||
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #formatNumber="{ data }">
|
||||
<p class="!text-right cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="!text-right cursor-pointer" @click="showDetail()">
|
||||
{{
|
||||
isNumber(data.text)
|
||||
? data.column.caption == '%'
|
||||
@ -533,7 +534,7 @@
|
||||
</template>
|
||||
|
||||
<template #formatText="{ data }">
|
||||
<p class="text-left cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="text-left cursor-pointer" @click="showDetail()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
@ -541,9 +542,9 @@
|
||||
</div>
|
||||
|
||||
<DetailDialog
|
||||
:open="dialogDataSelected"
|
||||
:open="dialogDetail"
|
||||
title="Rekapitulasi Keluhan Per Unit"
|
||||
@on-close="closeDialogDataSelected"
|
||||
@on-close="closedialogDetail"
|
||||
:full-width="true"
|
||||
>
|
||||
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
|
||||
@ -564,10 +565,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
@ -899,7 +900,8 @@ import {
|
||||
DxScrolling,
|
||||
DxSearchPanel,
|
||||
DxSelection,
|
||||
DxGroupItem
|
||||
DxGroupItem,
|
||||
DxGrouping
|
||||
} from 'devextreme-vue/data-grid'
|
||||
import { jsPDF } from 'jspdf'
|
||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||
@ -919,8 +921,8 @@ const data = ref<any[]>([])
|
||||
const dataSub = ref<any[]>([])
|
||||
const dataSelected = ref<any>()
|
||||
const dataSubSelected = ref<any>()
|
||||
const dialogDataSelected = ref(false)
|
||||
const closeDialogDataSelected = () => (dialogDataSelected.value = false)
|
||||
const dialogDetail = ref(false)
|
||||
const closedialogDetail = () => (dialogDetail.value = false)
|
||||
const loadingData = ref(false)
|
||||
const loadingSubData = ref(false)
|
||||
|
||||
@ -970,8 +972,8 @@ const getDetail = () => {
|
||||
// dataSub.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPerUnit
|
||||
}
|
||||
|
||||
const showDialogDataSelected = () => {
|
||||
dialogDataSelected.value = true
|
||||
const showDetail = () => {
|
||||
dialogDetail.value = true
|
||||
console.log(dataSelected.value)
|
||||
getDetail()
|
||||
}
|
||||
|
@ -18,10 +18,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
|
@ -18,10 +18,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
|
@ -24,6 +24,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -209,6 +210,7 @@ import {
|
||||
DxColumn,
|
||||
DxColumnFixing,
|
||||
DxExport,
|
||||
DxGrouping,
|
||||
DxLoadPanel,
|
||||
DxPaging,
|
||||
DxScrolling,
|
||||
|
@ -153,10 +153,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
|
@ -23,6 +23,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -356,6 +357,7 @@ import {
|
||||
DxColumnFixing,
|
||||
DxExport,
|
||||
DxGroupItem,
|
||||
DxGrouping,
|
||||
DxLoadPanel,
|
||||
DxPaging,
|
||||
DxScrolling,
|
||||
|
@ -24,6 +24,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -274,6 +275,7 @@ import {
|
||||
DxColumnFixing,
|
||||
DxExport,
|
||||
DxGroupItem,
|
||||
DxGrouping,
|
||||
DxLoadPanel,
|
||||
DxPaging,
|
||||
DxScrolling,
|
||||
|
@ -24,6 +24,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -209,6 +210,7 @@ import {
|
||||
DxColumn,
|
||||
DxColumnFixing,
|
||||
DxExport,
|
||||
DxGrouping,
|
||||
DxLoadPanel,
|
||||
DxPaging,
|
||||
DxScrolling,
|
||||
|
@ -24,6 +24,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -209,6 +210,7 @@ import {
|
||||
DxColumn,
|
||||
DxColumnFixing,
|
||||
DxExport,
|
||||
DxGrouping,
|
||||
DxLoadPanel,
|
||||
DxPaging,
|
||||
DxScrolling,
|
||||
|
@ -25,6 +25,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -358,6 +359,7 @@ import {
|
||||
DxColumnFixing,
|
||||
DxExport,
|
||||
DxGroupItem,
|
||||
DxGrouping,
|
||||
DxLoadPanel,
|
||||
DxPaging,
|
||||
DxScrolling,
|
||||
|
@ -24,6 +24,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -265,6 +266,7 @@ import {
|
||||
DxColumnFixing,
|
||||
DxExport,
|
||||
DxGroupItem,
|
||||
DxGrouping,
|
||||
DxLoadPanel,
|
||||
DxPaging,
|
||||
DxScrolling,
|
||||
|
@ -24,6 +24,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -155,6 +156,7 @@ import {
|
||||
DxColumn,
|
||||
DxColumnFixing,
|
||||
DxExport,
|
||||
DxGrouping,
|
||||
DxLoadPanel,
|
||||
DxPaging,
|
||||
DxScrolling,
|
||||
|
@ -24,6 +24,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -257,6 +258,7 @@ import {
|
||||
DxColumn,
|
||||
DxColumnFixing,
|
||||
DxExport,
|
||||
DxGrouping,
|
||||
DxLoadPanel,
|
||||
DxPaging,
|
||||
DxScrolling,
|
||||
|
@ -24,6 +24,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -289,7 +290,8 @@ import {
|
||||
DxSelection,
|
||||
DxSummary,
|
||||
DxGroupItem,
|
||||
DxTotalItem
|
||||
DxTotalItem,
|
||||
DxGrouping
|
||||
} from 'devextreme-vue/data-grid'
|
||||
import { jsPDF } from 'jspdf'
|
||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||
|
@ -24,6 +24,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -289,7 +290,8 @@ import {
|
||||
DxSelection,
|
||||
DxSummary,
|
||||
DxGroupItem,
|
||||
DxTotalItem
|
||||
DxTotalItem,
|
||||
DxGrouping
|
||||
} from 'devextreme-vue/data-grid'
|
||||
import { jsPDF } from 'jspdf'
|
||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||
|
@ -24,6 +24,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -348,9 +349,9 @@
|
||||
</div>
|
||||
|
||||
<DetailDialog
|
||||
:open="dialogDataSelected"
|
||||
:open="dialogDetail"
|
||||
title="Detail (Monalisa) Aging Complaint"
|
||||
@on-close="closeDialogDataSelected"
|
||||
@on-close="closedialogDetail"
|
||||
:full-width="true"
|
||||
>
|
||||
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
|
||||
@ -371,10 +372,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
@ -671,7 +672,8 @@ import {
|
||||
DxSelection,
|
||||
DxSummary,
|
||||
DxTotalItem,
|
||||
DxGroupItem
|
||||
DxGroupItem,
|
||||
DxGrouping
|
||||
} from 'devextreme-vue/data-grid'
|
||||
import { jsPDF } from 'jspdf'
|
||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||
@ -697,8 +699,8 @@ const data = ref<any[]>([])
|
||||
const dataSub = ref<any[]>([])
|
||||
const dataSelected = ref<any>(null)
|
||||
const dataSubSelected = ref<any>(null)
|
||||
const dialogDataSelected = ref(false)
|
||||
const closeDialogDataSelected = () => (dialogDataSelected.value = false)
|
||||
const dialogDetail = ref(false)
|
||||
const closedialogDetail = () => (dialogDetail.value = false)
|
||||
const loadingData = ref(false)
|
||||
const loadingSubData = ref(false)
|
||||
|
||||
@ -760,11 +762,11 @@ const getDetail = () => {
|
||||
// })
|
||||
}
|
||||
|
||||
const showDialogDataSelected = () => {
|
||||
const showDetail = () => {
|
||||
if (dataSelected.value != null) {
|
||||
dataSub.value = []
|
||||
dataSubSelected.value = null
|
||||
dialogDataSelected.value = true
|
||||
dialogDetail.value = true
|
||||
|
||||
getDetail()
|
||||
}
|
||||
@ -774,7 +776,7 @@ const onDataSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
const data = selectedRowsData[0]
|
||||
dataSelected.value = data
|
||||
|
||||
showDialogDataSelected()
|
||||
showDetail()
|
||||
}
|
||||
|
||||
const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
|
@ -24,6 +24,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -263,7 +264,8 @@ import {
|
||||
DxSelection,
|
||||
DxSummary,
|
||||
DxTotalItem,
|
||||
DxGroupItem
|
||||
DxGroupItem,
|
||||
DxGrouping
|
||||
} from 'devextreme-vue/data-grid'
|
||||
import { jsPDF } from 'jspdf'
|
||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||
|
@ -24,6 +24,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -285,7 +286,8 @@ import {
|
||||
DxSelection,
|
||||
DxSummary,
|
||||
DxTotalItem,
|
||||
DxGroupItem
|
||||
DxGroupItem,
|
||||
DxGrouping
|
||||
} from 'devextreme-vue/data-grid'
|
||||
import { jsPDF } from 'jspdf'
|
||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||
|
@ -25,6 +25,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -650,7 +651,7 @@
|
||||
</DxSummary>
|
||||
|
||||
<template #formatNumber="{ data }">
|
||||
<p class="text-right cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="text-right cursor-pointer" @click="showDetail()">
|
||||
{{
|
||||
isNumber(data.text)
|
||||
? data.column.caption == '%'
|
||||
@ -662,13 +663,13 @@
|
||||
</template>
|
||||
|
||||
<template #formatPercentage="{ data }">
|
||||
<p class="text-right cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="text-right cursor-pointer" @click="showDetail()">
|
||||
{{ parseFloat(data.text) ? formatPercentage(data.text) : '0%' }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<template #formatText="{ data }">
|
||||
<p class="text-left cursor-pointer" @click="showDialogDataSelected()">
|
||||
<p class="text-left cursor-pointer" @click="showDetail()">
|
||||
{{ data.text }}
|
||||
</p>
|
||||
</template>
|
||||
@ -676,9 +677,9 @@
|
||||
</div>
|
||||
|
||||
<DetailDialog
|
||||
:open="dialogDataSelected"
|
||||
:open="dialogDetail"
|
||||
title="Detail (Monalisa) Penurunan Jumlah Komplain"
|
||||
@on-close="closeDialogDataSelected"
|
||||
@on-close="closedialogDetail"
|
||||
:full-width="true"
|
||||
>
|
||||
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
|
||||
@ -699,10 +700,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
@ -999,7 +1000,8 @@ import {
|
||||
DxSelection,
|
||||
DxSummary,
|
||||
DxTotalItem,
|
||||
DxGroupItem
|
||||
DxGroupItem,
|
||||
DxGrouping
|
||||
} from 'devextreme-vue/data-grid'
|
||||
import { jsPDF } from 'jspdf'
|
||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||
@ -1025,8 +1027,8 @@ const data = ref<any[]>([])
|
||||
const dataSub = ref<any[]>([])
|
||||
const dataSelected = ref<any>(null)
|
||||
const dataSubSelected = ref<any>(null)
|
||||
const dialogDataSelected = ref(false)
|
||||
const closeDialogDataSelected = () => (dialogDataSelected.value = false)
|
||||
const dialogDetail = ref(false)
|
||||
const closedialogDetail = () => (dialogDetail.value = false)
|
||||
const loadingData = ref(false)
|
||||
const loadingSubData = ref(false)
|
||||
|
||||
@ -1088,11 +1090,11 @@ const getDetail = () => {
|
||||
// })
|
||||
}
|
||||
|
||||
const showDialogDataSelected = () => {
|
||||
const showDetail = () => {
|
||||
if (dataSelected.value != null) {
|
||||
dataSub.value = []
|
||||
dataSubSelected.value = null
|
||||
dialogDataSelected.value = true
|
||||
dialogDetail.value = true
|
||||
|
||||
getDetail()
|
||||
}
|
||||
@ -1102,7 +1104,7 @@ const onDataSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
const data = selectedRowsData[0]
|
||||
dataSelected.value = data
|
||||
|
||||
showDialogDataSelected()
|
||||
showDetail()
|
||||
}
|
||||
|
||||
const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
|
@ -24,6 +24,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -365,7 +366,8 @@ import {
|
||||
DxSelection,
|
||||
DxSummary,
|
||||
DxTotalItem,
|
||||
DxGroupItem
|
||||
DxGroupItem,
|
||||
DxGrouping
|
||||
} from 'devextreme-vue/data-grid'
|
||||
import { jsPDF } from 'jspdf'
|
||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||
|
@ -24,6 +24,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -263,7 +264,8 @@ import {
|
||||
DxSelection,
|
||||
DxSummary,
|
||||
DxTotalItem,
|
||||
DxGroupItem
|
||||
DxGroupItem,
|
||||
DxGrouping
|
||||
} from 'devextreme-vue/data-grid'
|
||||
import { jsPDF } from 'jspdf'
|
||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||
|
@ -24,6 +24,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -285,7 +286,8 @@ import {
|
||||
DxSelection,
|
||||
DxSummary,
|
||||
DxTotalItem,
|
||||
DxGroupItem
|
||||
DxGroupItem,
|
||||
DxGrouping
|
||||
} from 'devextreme-vue/data-grid'
|
||||
import { jsPDF } from 'jspdf'
|
||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||
|
@ -25,6 +25,7 @@
|
||||
column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true"
|
||||
>
|
||||
<DxGrouping expand-mode="rowClick" />
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -750,7 +751,8 @@ import {
|
||||
DxSelection,
|
||||
DxSummary,
|
||||
DxTotalItem,
|
||||
DxGroupItem
|
||||
DxGroupItem,
|
||||
DxGrouping
|
||||
} from 'devextreme-vue/data-grid'
|
||||
import { jsPDF } from 'jspdf'
|
||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||
|
@ -19,10 +19,10 @@
|
||||
column-resizing-mode="widget"
|
||||
>
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :page-size="5" :enabled="true" />
|
||||
<DxPaging :page-size="20" :enabled="true" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 20]"
|
||||
:allowed-page-sizes="[20, 50, 100]"
|
||||
display-mode="full"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
|
@ -909,9 +909,6 @@ export const queries = {
|
||||
idUid: $idUid
|
||||
idUp3: $idUp3
|
||||
) {
|
||||
id_posko
|
||||
id_uid
|
||||
id_up3
|
||||
id
|
||||
id_fasilitas
|
||||
sub_kelompok
|
||||
|
Loading…
x
Reference in New Issue
Block a user