Merge branch 'dev-defuj' of github.com:defuj/eis into dev-bagus

This commit is contained in:
kur0nek-o 2024-04-02 09:49:49 +07:00
commit f8a06f9524
63 changed files with 755 additions and 164 deletions

View File

@ -2252,10 +2252,6 @@ body {
overflow-y: auto;
}
.overflow-y-hidden {
overflow-y: hidden;
}
.overflow-y-scroll {
overflow-y: scroll;
}
@ -5549,6 +5545,10 @@ body {
grid-column-start: 2;
}
.sm\:m-8 {
margin: 2rem;
}
.sm\:mx-0 {
margin-left: 0px;
margin-right: 0px;
@ -5926,6 +5926,15 @@ body {
}
@media (min-width: 768px) {
.md\:m-8 {
margin: 2rem;
}
.md\:my-8 {
margin-top: 2rem;
margin-bottom: 2rem;
}
.md\:ml-6 {
margin-left: 1.5rem;
}

View File

@ -3,7 +3,9 @@ import { PhCalendarBlank } from '@phosphor-icons/vue'
import { ref, watch } from 'vue'
import VueTailwindDatepicker from 'vue-tailwind-datepicker'
const dateValue = ref('')
const dateValue = ref(
`${new Date().getDay().toString().length == 1 ? `0${new Date().getDay()}` : new Date().getDay()}-${new Date().getMonth().toString().length == 1 ? `0${new Date().getMonth()}` : new Date().getMonth()}-${new Date().getFullYear()} s/d ${new Date().getDay().toString().length == 1 ? `0${new Date().getDay()}` : new Date().getDay()}-${new Date().getMonth().toString().length == 1 ? `0${new Date().getMonth()}` : new Date().getMonth()}-${new Date().getFullYear()}`
)
const formatter = ref({
date: 'DD-MM-YYYY',
month: 'MMMM'
@ -36,12 +38,22 @@ watch(dateValue, (newValue) => {
<template>
<div class="flex">
<vue-tailwind-datepicker v-model="dateValue" :formatter="formatter" separator=" s/d " :shortcuts="customShortcuts"
:auto-apply="true" as-single use-range v-slot="{ value, placeholder }">
<vue-tailwind-datepicker
v-model="dateValue"
:formatter="formatter"
separator=" s/d "
:shortcuts="customShortcuts"
:auto-apply="true"
as-single
use-range
v-slot="{ value, placeholder }"
>
<div class="flex">
<div class="flex-1">
<button type="button"
class="flex items-center justify-between w-full px-4 py-2 text-sm leading-6 text-gray-900 bg-gray-200 border-0 border-transparent rounded-lg placeholder:text-gray-400 outline-0 focus:outline-0 focus:border-0 focus:ring-0">
<button
type="button"
class="flex items-center justify-between w-full px-4 py-2 text-sm leading-6 text-gray-900 bg-gray-200 border-0 border-transparent rounded-lg placeholder:text-gray-400 outline-0 focus:outline-0 focus:border-0 focus:ring-0"
>
<span class="text-gray-900">
{{ value || placeholder }}
</span>

View File

@ -1,24 +1,18 @@
<script setup lang="ts">
import {
Dialog,
DialogPanel,
DialogTitle,
TransitionChild,
TransitionRoot
} from '@headlessui/vue';
import { Dialog, DialogPanel, DialogTitle, TransitionChild, TransitionRoot } from '@headlessui/vue'
defineProps({
open: {
type: Boolean,
required: true,
required: true
},
title: {
type: String,
required: true,
required: true
},
fullWidth: {
type: Boolean,
default: false,
},
default: false
}
})
const emit = defineEmits(['onClose'])
const handleOnClose = () => {
@ -29,40 +23,67 @@ const handleOnClose = () => {
<template>
<TransitionRoot as="template" :show="open">
<Dialog as="div" class="relative z-20" @close="handleOnClose">
<TransitionChild as="template" enter="ease-out duration-300" enter-from="opacity-0" enter-to="opacity-100"
leave="ease-in duration-200" leave-from="opacity-100" leave-to="opacity-0">
<TransitionChild
as="template"
enter="ease-out duration-300"
enter-from="opacity-0"
enter-to="opacity-100"
leave="ease-in duration-200"
leave-from="opacity-100"
leave-to="opacity-0"
>
<div class="fixed inset-0 transition-opacity bg-gray-500 bg-opacity-75" />
</TransitionChild>
<div class="fixed inset-0 z-10 overflow-y-auto">
<div class="flex items-center justify-center min-h-full p-4 text-center sm:p-0">
<TransitionChild as="template" enter="ease-out duration-300"
<div
class="flex justify-center min-h-full p-4 text-center sm:p-0"
:class="[fullWidth ? 'items-start' : 'items-center']"
>
<TransitionChild
as="template"
enter="ease-out duration-300"
enter-from="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
enter-to="opacity-100 translate-y-0 sm:scale-100" leave="ease-in duration-200"
enter-to="opacity-100 translate-y-0 sm:scale-100"
leave="ease-in duration-200"
leave-from="opacity-100 translate-y-0 sm:scale-100"
leave-to="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95">
leave-to="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
>
<DialogPanel
:class="[fullWidth ? 'sm:max-w-full' : 'sm:max-w-lg sm:my-8', 'relative overflow-hidden text-left transition-all transform bg-gray-50 rounded-2xl sm:w-full']">
:class="[
fullWidth ? 'sm:max-w-full md:m-8' : 'sm:max-w-lg md:my-8',
'relative overflow-hidden text-left transition-all transform bg-gray-50 rounded-2xl sm:w-full'
]"
>
<!-- Body Section -->
<div class="px-4 py-4 bg-gray-50">
<div class="items-start">
<div class="flex items-start justify-between w-full">
<DialogTitle as="h3"
class="flex-1 text-2xl font-semibold leading-6 text-gray-900">
<DialogTitle
as="h3"
class="flex-1 text-2xl font-semibold leading-6 text-gray-900"
>
{{ title }}
</DialogTitle>
<div class="flex items-center ml-3 h-7">
<button type="button"
<button
type="button"
class="rounded-full focus:outline-none focus:ring-0 focus:ring-offset-0"
@click="handleOnClose">
@click="handleOnClose"
>
<span class="sr-only">Close panel</span>
<svg width="24" height="25" viewBox="0 0 24 25" fill="none"
xmlns="http://www.w3.org/2000/svg">
<svg
width="24"
height="25"
viewBox="0 0 24 25"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12 2.75C10.0716 2.75 8.18657 3.32183 6.58319 4.39317C4.97982 5.46451 3.73013 6.98726 2.99218 8.76884C2.25422 10.5504 2.06114 12.5108 2.43735 14.4021C2.81355 16.2934 3.74215 18.0307 5.10571 19.3943C6.46928 20.7579 8.20656 21.6865 10.0979 22.0627C11.9892 22.4389 13.9496 22.2458 15.7312 21.5078C17.5127 20.7699 19.0355 19.5202 20.1068 17.9168C21.1782 16.3134 21.75 14.4284 21.75 12.5C21.7473 9.91498 20.7192 7.43661 18.8913 5.60872C17.0634 3.78084 14.585 2.75273 12 2.75ZM15.5306 14.9694C15.6003 15.0391 15.6556 15.1218 15.6933 15.2128C15.731 15.3039 15.7504 15.4015 15.7504 15.5C15.7504 15.5985 15.731 15.6961 15.6933 15.7872C15.6556 15.8782 15.6003 15.9609 15.5306 16.0306C15.4609 16.1003 15.3782 16.1556 15.2872 16.1933C15.1961 16.231 15.0986 16.2504 15 16.2504C14.9015 16.2504 14.8039 16.231 14.7128 16.1933C14.6218 16.1556 14.5391 16.1003 14.4694 16.0306L12 13.5603L9.53063 16.0306C9.46095 16.1003 9.37822 16.1556 9.28718 16.1933C9.19613 16.231 9.09855 16.2504 9 16.2504C8.90146 16.2504 8.80388 16.231 8.71283 16.1933C8.62179 16.1556 8.53906 16.1003 8.46938 16.0306C8.3997 15.9609 8.34442 15.8782 8.30671 15.7872C8.269 15.6961 8.24959 15.5985 8.24959 15.5C8.24959 15.4015 8.269 15.3039 8.30671 15.2128C8.34442 15.1218 8.3997 15.0391 8.46938 14.9694L10.9397 12.5L8.46938 10.0306C8.32865 9.88989 8.24959 9.69902 8.24959 9.5C8.24959 9.30098 8.32865 9.11011 8.46938 8.96937C8.61011 8.82864 8.80098 8.74958 9 8.74958C9.19903 8.74958 9.3899 8.82864 9.53063 8.96937L12 11.4397L14.4694 8.96937C14.5391 8.89969 14.6218 8.84442 14.7128 8.8067C14.8039 8.76899 14.9015 8.74958 15 8.74958C15.0986 8.74958 15.1961 8.76899 15.2872 8.8067C15.3782 8.84442 15.4609 8.89969 15.5306 8.96937C15.6003 9.03906 15.6556 9.12178 15.6933 9.21283C15.731 9.30387 15.7504 9.40145 15.7504 9.5C15.7504 9.59855 15.731 9.69613 15.6933 9.78717C15.6556 9.87822 15.6003 9.96094 15.5306 10.0306L13.0603 12.5L15.5306 14.9694Z"
fill="#343330" />
fill="#343330"
/>
</svg>
</button>
</div>
</div>

View File

@ -566,6 +566,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
emit('update:loadingSubData', loadingSubData.value)
})
}
@ -581,7 +582,6 @@ const showDetail = () => {
dataSub.value = []
dataSubSelected.value = null
if (agreeToShowDialog.value) {
dialogDetail.value = true
getDetail()
}
}

View File

@ -1160,6 +1160,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -1177,7 +1178,6 @@ const showDetail = () => {
dataSub.value = []
dataSubSelected.value = null
if (agreeToShowDialog.value) {
dialogDetail.value = true
getDetail()
}
}

View File

@ -864,6 +864,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -910,7 +911,6 @@ const showDetail = () => {
dataSub.value = []
dataSubSelected.value = null
if (agreeToShowDialog.value) {
dialogDetail.value = true
getDetail()
}
}

View File

@ -865,6 +865,7 @@
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -898,6 +899,7 @@ import InputText from '@/components/InputText.vue'
import { formatWaktu } from '@/components/Form/FiltersType/reference'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -947,6 +949,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -959,7 +962,6 @@ const showDetail = () => {
clearSelection()
dataSub.value = []
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -163,6 +163,7 @@
</template>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -191,6 +192,7 @@ import gql from 'graphql-tag'
import { apolloClient, queries, requestGraphQl } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)

View File

@ -1341,8 +1341,7 @@ const showDetail = () => {
if (agreeToShowDialog.value) {
dataSub.value = []
dataSubSelected.value = null
// dialogDetail.value = true
getDetail()
// getDetail()
}
}

View File

@ -551,9 +551,10 @@ const getDetail = async () => {
dateTo: dateValue[1]
? dateValue[1].split('-').reverse().join('-')
: new Date().toISOString().slice(0, 10),
posko: ref.id_posko_lama != ref.id_posko_baru ? ref.id_posko_baru : ref.id_posko_lama,
idUid: ref.id_uid,
idUp3: ref.id_up3
idUp3: ref.id_up3,
idPoskoLama: ref.id_posko_lama,
idPoskoBaru: ref.id_posko_baru
}
await requestGraphQl(queries.gangguan.rekap.gangguanAlihPoskoDetail, query)

View File

@ -578,8 +578,7 @@ const showDetail = () => {
dataSub.value = []
dataSubSelected.value = null
if (date.value != '') {
// dialogDetail.value = true
getDetail()
// getDetail()
}
}

View File

@ -560,8 +560,7 @@ const showDetail = () => {
clearSelection()
dataSubSelected.value = null
if (monthSelected.value != null) {
// dialogDetail.value = true
getDetail()
// getDetail()
}
}

View File

@ -973,7 +973,6 @@ const showDetail = () => {
dataSub.value = []
dataSubSelected.value = null
if (agreeToShowDialog.value) {
// dialogDetail.value = true
getDetail()
}
}

View File

@ -1237,7 +1237,6 @@ const showDetail = () => {
dataSub.value = []
dataSubSelected.value = null
if (monthSelected.value != null) {
// dialogDetail.value = true
getDetail()
}
}

View File

@ -995,7 +995,6 @@ const showDetail = () => {
dataSub.value = []
dataSubSelected.value = null
if (agreeToShowDialog.value) {
// dialogDetail.value = true
getDetail()
}
}

View File

@ -1006,7 +1006,6 @@ const showDetail = () => {
dataSub.value = []
dataSubSelected.value = null
if (agreeToShowDialog.value) {
// dialogDetail.value = true
getDetail()
}
}

View File

@ -757,7 +757,6 @@ const showDetail = () => {
dataSub.value = []
dataSubSelected.value = null
if (agreeToShowDialog.value) {
// dialogDetail.value = true
getDetail()
}
}

View File

@ -758,7 +758,6 @@ const showDetail = () => {
dataSub.value = []
dataSubSelected.value = null
if (agreeToShowDialog.value) {
// dialogDetail.value = true
getDetail()
}
}

View File

@ -752,7 +752,6 @@ const showDetail = () => {
dataSub.value = []
dataSubSelected.value = null
if (agreeToShowDialog.value) {
// dialogDetail.value = true
getDetail()
}
}

View File

@ -290,6 +290,7 @@
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loading" />
</template>
<script setup lang="ts">
@ -316,6 +317,7 @@ import {
exportToXLSX,
exportToDOCX
} from '@/report/Keluhan/Daftar/DKeluhan_BerdasarMedia'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const position = { of: '#data' }
const showIndicator = ref(true)

View File

@ -325,6 +325,7 @@
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loading" />
</template>
<script setup lang="ts">
@ -348,6 +349,7 @@ import {
import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { exportToPDF, exportToXLSX, exportToDOCX } from '@/report/Keluhan/Daftar/DKeluhan_DKUL'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const position = { of: '#data' }
const showIndicator = ref(true)

View File

@ -430,6 +430,7 @@
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -453,6 +454,7 @@ import {
import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { formatNumber, isNumber } from '@/utils/numbers'
import { exportToPDF, exportToXLSX, exportToDOCX } from '@/report/Keluhan/Daftar/DKeluhan_PLD1K'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const position = { of: '#data' }
const showIndicator = ref(true)
@ -508,6 +510,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -519,7 +522,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
if (detailType.value == 'table') {
getDetail()
}

View File

@ -292,6 +292,7 @@
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loading" />
</template>
<script setup lang="ts">
@ -318,6 +319,7 @@ import {
exportToDOCX,
exportToXLSX
} from '@/report/Keluhan/Daftar/DKeluhan_RecoveryTime'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const position = { of: '#data' }
const showIndicator = ref(true)

View File

@ -310,6 +310,7 @@
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loading" />
</template>
<script setup lang="ts">

View File

@ -283,6 +283,7 @@
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loading" />
</template>
<script setup lang="ts">
@ -305,6 +306,7 @@ import {
} from 'devextreme-vue/data-grid'
import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { exportToPDF, exportToXLSX, exportToDOCX } from '@/report/Keluhan/Daftar/DKeluhan_STIDP'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const position = { of: '#data' }
const showIndicator = ref(true)

View File

@ -303,6 +303,7 @@
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loading" />
</template>
<script setup lang="ts">
@ -325,6 +326,7 @@ import {
import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { exportToPDF, exportToXLSX, exportToDOCX } from '@/report/Keluhan/Daftar/DKeluhan_SelesaiCC'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const position = { of: '#data' }
const showIndicator = ref(true)

View File

@ -739,6 +739,7 @@
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -768,6 +769,7 @@ import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import { exportToPDF, exportDetailToPDF } from '@/report/Keluhan/Rekap/RKeluhan_ALL'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -975,6 +977,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -991,7 +994,6 @@ const showDetail = () => {
if (agreeToShowDialog.value) {
dataSub.value = []
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}
}

View File

@ -460,6 +460,7 @@
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -493,6 +494,7 @@ import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -597,6 +599,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -609,7 +612,6 @@ const showDetail = () => {
clearSelection()
dataSubSelected.value = null
if (date.value != '') {
dialogDetail.value = true
getDetail()
}
}

View File

@ -779,6 +779,7 @@
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -813,6 +814,7 @@ import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { formatNumber, isNumber, formatPercentage } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -925,6 +927,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -937,7 +940,6 @@ const showDetail = () => {
clearSelection()
dataSubSelected.value = null
if (agreeToShowDialog.value) {
dialogDetail.value = true
getDetail()
}
}

View File

@ -922,6 +922,7 @@
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -957,6 +958,7 @@ import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { formatNumber, isNumber, formatPercentage } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -1062,6 +1064,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -1074,7 +1077,6 @@ const showDetail = () => {
clearSelection()
dataSubSelected.value = null
if (agreeToShowDialog.value) {
dialogDetail.value = true
getDetail()
}
}

View File

@ -785,6 +785,8 @@
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -819,6 +821,7 @@ import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -926,6 +929,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -938,7 +942,6 @@ const showDetail = () => {
clearSelection()
dataSubSelected.value = null
if (agreeToShowDialog.value) {
dialogDetail.value = true
getDetail()
}
}

View File

@ -787,6 +787,8 @@
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -822,6 +824,7 @@ import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import { reformatDate } from '@/utils/texts'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -924,6 +927,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -936,7 +940,6 @@ const showDetail = () => {
clearSelection()
dataSubSelected.value = null
if (agreeToShowDialog.value) {
dialogDetail.value = true
getDetail()
}
}

View File

@ -918,6 +918,7 @@
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -953,6 +954,7 @@ import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -1057,6 +1059,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -1069,7 +1072,6 @@ const showDetail = () => {
clearSelection()
dataSubSelected.value = null
if (agreeToShowDialog.value) {
dialogDetail.value = true
getDetail()
}
}

View File

@ -196,6 +196,7 @@
</DxColumn>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -222,6 +223,7 @@ import { useQuery } from '@vue/apollo-composable'
import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -307,6 +309,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -318,7 +321,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -134,6 +134,7 @@
</DxColumn>
</DxDataGrid>
</div>
<BufferDialog v-if="loading" />
</template>
<script setup lang="ts">
@ -153,6 +154,7 @@ import { Type14 } from '@/components/Form/FiltersType'
import { useQuery } from '@vue/apollo-composable'
import gql from 'graphql-tag'
import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const position = { of: '#data' }
const showIndicator = ref(true)
const shading = ref(true)

View File

@ -94,6 +94,7 @@
</DxColumn>
</DxDataGrid>
</div>
<BufferDialog v-if="loading" />
</template>
<script setup lang="ts">
@ -113,6 +114,7 @@ import Filters from '@/components/Form/Filters.vue'
import { useQuery } from '@vue/apollo-composable'
import gql from 'graphql-tag'
import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const position = { of: '#data' }
const showIndicator = ref(true)
const shading = ref(true)

View File

@ -278,6 +278,432 @@
</template>
</DxDataGrid>
</div>
<DetailDialog
:open="dialogDetail"
title="Detail Dispatching Time Gangguan"
@on-close="closedialogDetail"
:full-width="true"
>
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
<div class="p-4 bg-white rounded-xl lg:mr-4">
<DxDataGrid
:allow-column-reordering="true"
class="max-h-[calc(100vh-140px)]"
:data-source="dataSub"
:show-column-lines="true"
:show-row-lines="false"
:show-borders="true"
:row-alternation-enabled="true"
:hover-state-enabled="true"
@selection-changed="onDataSubSelectionChanged"
:column-width="100"
@exporting="onExportingDetail"
:allow-column-resizing="true"
column-resizing-mode="widget"
>
<DxSelection mode="single" />
<DxPaging :page-size="20" :enabled="true" />
<DxPager
:visible="true"
:allowed-page-sizes="[20, 50, 100]"
display-mode="full"
:show-page-size-selector="true"
:show-info="true"
:show-navigation-buttons="true"
/>
<DxLoadPanel
shading-color="rgba(0,0,0,0.4)"
:position="position"
:show-indicator="showIndicator"
:show-pane="showPane"
:shading="shading"
v-model:visible="loadingSubData"
:enabled="true"
/>
<DxSearchPanel :visible="true" :highlight-case-sensitive="true" />
<DxExport
:enabled="true"
:formats="['pdf', 'xlsx', 'document']"
:allow-export-selected-data="false"
/>
<DxColumn
css-class="custom-table-column"
:width="50"
alignment="center"
:calculate-display-value="(item: any) => dataSub.findIndex((i) => i == item) + 1"
data-type="number"
caption="No"
cell-template="formatNumber"
/>
<DxColumn
:width="150"
alignment="center"
data-field="nama_ulp"
caption="ULP"
css-class="custom-table-column"
cell-template="formatText"
/>
<DxColumn
:width="150"
alignment="center"
data-field="no_laporan"
caption="No Laporan"
css-class="custom-table-column"
cell-template="formatText"
/>
<DxColumn
:width="150"
alignment="center"
data-field="waktu_lapor"
caption="Tgl/Jam Lapor"
css-class="custom-table-column"
cell-template="formatText"
/>
<DxColumn
:width="150"
alignment="center"
data-field="waktu_response"
caption="Tgl/Jam Datang"
css-class="custom-table-column"
cell-template="formatText"
/>
<DxColumn
:width="150"
alignment="center"
data-field="waktu_recovery"
caption="Tgl/Jam Nyala"
css-class="custom-table-column"
cell-template="formatText"
/>
<DxColumn
:width="150"
alignment="center"
data-field="durasi_response_time"
caption="Durasi Response Time"
:allow-resizing="false"
css-class="custom-table-column"
cell-template="formatTime"
/>
<DxColumn
:width="150"
alignment="center"
data-field="durasi_recovery_time"
caption="Durasi Recovery Time"
:allow-resizing="false"
css-class="custom-table-column"
cell-template="formatTime"
/>
<DxColumn
:width="150"
alignment="center"
data-field=""
caption="Durasi Penugasan Regu"
:allow-resizing="false"
css-class="custom-table-column"
cell-template="formatTime"
/>
<DxColumn
:width="150"
alignment="center"
data-field=""
caption="Durasi Perjalanan Regu"
:allow-resizing="false"
css-class="custom-table-column"
cell-template="formatTime"
/>
<DxColumn
:width="150"
alignment="center"
data-field=""
caption="Dispatch Oleh"
:allow-resizing="false"
css-class="custom-table-column"
cell-template="formatTime"
/>
<DxColumn
:width="150"
alignment="center"
data-field="idpel_nometer"
caption="IDPEL/NO METER"
:allow-resizing="false"
css-class="custom-table-column"
cell-template="formatTime"
/>
<DxColumn
:width="150"
alignment="center"
data-field="nama_pelapor"
caption="Nama Pelapor"
:allow-resizing="false"
css-class="custom-table-column"
cell-template="formatText"
/>
<DxColumn
:width="200"
alignment="center"
data-field="alamat_pelapor"
caption="Alamat Pelapor"
:allow-resizing="false"
css-class="custom-table-column"
cell-template="formatText"
/>
<DxColumn
:width="150"
alignment="center"
data-field="no_telp_pelapor"
caption="No Tlp Pelapor"
:allow-resizing="false"
css-class="custom-table-column"
cell-template="formatText"
/>
<DxColumn
:width="200"
alignment="center"
data-field="keterangan_pelapor"
caption="Keterangan Pelapor"
:allow-resizing="false"
css-class="custom-table-column"
cell-template="formatText"
/>
<DxColumn
:width="200"
alignment="center"
data-field=""
caption="Sumber Lapor"
:allow-resizing="false"
css-class="custom-table-column"
cell-template="formatText"
/>
<DxColumn
:width="200"
alignment="center"
data-field=""
caption="Diselesaikan Oleh"
:allow-resizing="false"
css-class="custom-table-column"
cell-template="formatText"
/>
<DxColumn
:width="150"
alignment="center"
data-field="status_akhir"
caption="Status"
:allow-resizing="false"
css-class="custom-table-column"
cell-template="formatTime"
/>
<DxColumn
:width="200"
alignment="center"
data-field=""
caption="Referensi Marking"
:allow-resizing="false"
css-class="custom-table-column"
cell-template="formatText"
/>
<DxColumn
:width="200"
alignment="center"
data-field=""
caption="Kode Gangguan"
:allow-resizing="false"
css-class="custom-table-column"
cell-template="formatText"
/>
<DxColumn
:width="200"
alignment="center"
data-field=""
caption="Janis Gangguan"
:allow-resizing="false"
css-class="custom-table-column"
cell-template="formatText"
/>
<DxColumn
:width="200"
alignment="center"
data-field=""
caption="Tindakan"
:allow-resizing="false"
css-class="custom-table-column"
cell-template="formatText"
/>
<template #formatText="{ data }">
<p class="text-left cursor-pointer">
{{ data.text }}
</p>
</template>
<template #formatNumber="{ data }">
<p class="text-right cursor-pointer">
{{ data.text }}
</p>
</template>
<template #formatTime="{ data }">
<p class="text-right cursor-pointer">
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
</p>
</template>
</DxDataGrid>
</div>
</div>
<div class="w-full mb-4 lg:w-[30%] lg:float-right">
<div class="p-4 space-y-2 bg-white rounded-xl">
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">ULP:</h3>
<InputText :readonly="true" :value="dataSubSelected?.nama_ulp" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">No Laporan:</h3>
<InputText :readonly="true" :value="dataSubSelected?.no_laporan" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Tgl/Jam Lapor:</h3>
<InputText :readonly="true" :value="dataSubSelected?.waktu_lapor" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Tgl/Jam Datang:</h3>
<InputText
:readonly="true"
:value="dataSubSelected?.waktu_response"
class-name="flex-1"
/>
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Tgl/Jam Nyala:</h3>
<InputText
:readonly="true"
:value="dataSubSelected?.waktu_recovery"
class-name="flex-1"
/>
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Durasi Response Time:</h3>
<InputText
:readonly="true"
:value="
parseInt(dataSubSelected?.durasi_response_time)
? formatWaktu(dataSubSelected?.durasi_response_time)
: '-'
"
class-name="flex-1"
/>
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Durasi Recovery Time:</h3>
<InputText
:readonly="true"
:value="
parseInt(dataSubSelected?.durasi_recovery_time)
? formatWaktu(dataSubSelected?.durasi_recovery_time)
: '-'
"
class-name="flex-1"
/>
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Durasi Penugasan Regu:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Durasi Perjalanan Regu:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Dispatch Oleh:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">IDPEL/NO METER:</h3>
<InputText :readonly="true" :value="dataSubSelected?.idpel_nometer" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Nama Pelapor:</h3>
<InputText :readonly="true" :value="dataSubSelected?.nama_pelapor" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Alamat Pelapor:</h3>
<InputText
:readonly="true"
type="textarea"
:value="dataSubSelected?.alamat_pelapor"
class-name="flex-1"
/>
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">No Telp Pelapor:</h3>
<InputText
:readonly="true"
:value="dataSubSelected?.no_telp_pelapor"
class-name="flex-1"
/>
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Keterangan Pelapor:</h3>
<InputText
:readonly="true"
:value="dataSubSelected?.keterangan_pelapor"
class-name="flex-1"
/>
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Sumber Lapor:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Diselesaikan Oleh:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Status:</h3>
<InputText :readonly="true" :value="dataSubSelected?.status_akhir" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Referensi Marking:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Kode Gangguan:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Janis Gangguan:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Tindakan:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
</div>
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -292,6 +718,7 @@ import {
DxGroupItem,
DxGrouping,
DxLoadPanel,
DxPager,
DxPaging,
DxScrolling,
DxSearchPanel,
@ -310,6 +737,10 @@ import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import DetailDialog from '@/components/Dialogs/DetailDialog.vue'
import { formatWaktu } from '@/components/Form/FiltersType/reference'
import InputText from '@/components/InputText.vue'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -413,7 +844,13 @@ const getDetail = async () => {
: new Date().toISOString().slice(0, 10),
idUlp: selected?.id_ulp ? selected?.id_ulp : 0,
idUid: selected?.id_uid ? selected?.id_uid : 0,
idUp3: selected?.id_up3 ? selected?.id_up3 : 0
idUp3: selected?.id_up3 ? selected?.id_up3 : 0,
namaRegional: selected?.nama_regional ? selected?.nama_regional : '',
media: selected?.media ? selected?.media : '',
isSelesai: 0,
tanggal: '',
namaIssuetype: '',
namaSubissuetype: ''
}
loadingSubData.value = true
@ -430,6 +867,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -441,7 +879,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}
const onDataSelectionChanged = ({ selectedRowsData }: any) => {
@ -456,6 +893,8 @@ const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
dataSubSelected.value = data
}
const onExportingDetail = (e: any) => {}
const filters = ref()
onMounted(() => {
if (import.meta.env.DEV) {

View File

@ -271,6 +271,7 @@
</DxSummary>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -303,6 +304,7 @@ import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -425,6 +427,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -436,7 +439,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -261,7 +261,7 @@
<DxColumn
:width="150"
alignment="center"
data-field=""
data-field="nama_uid"
caption="UID/UIW"
css-class="custom-table-column"
cell-template="formatText"
@ -269,7 +269,7 @@
<DxColumn
:width="150"
alignment="center"
data-field=""
data-field="nama_up3"
caption="UP3"
:allow-resizing="false"
css-class="custom-table-column"
@ -278,7 +278,7 @@
<DxColumn
:width="150"
alignment="center"
data-field=""
data-field="nama_ulp"
caption="ULP"
:allow-resizing="false"
css-class="custom-table-column"
@ -287,7 +287,7 @@
<DxColumn
:width="150"
alignment="center"
data-field=""
data-field="id_pelanggan"
caption="ID Pelanggan"
:allow-resizing="false"
css-class="custom-table-column"
@ -296,7 +296,7 @@
<DxColumn
:width="200"
alignment="center"
data-field=""
data-field="nama_pelapor"
caption="Nama Pelapor"
:allow-resizing="false"
css-class="custom-table-column"
@ -305,7 +305,7 @@
<DxColumn
:width="200"
alignment="center"
data-field=""
data-field="alamat_pelapor"
caption="Alamat Pelapor"
:allow-resizing="false"
css-class="custom-table-column"
@ -314,7 +314,7 @@
<DxColumn
:width="150"
alignment="center"
data-field=""
data-field="no_telp_pelapor"
caption="No Telp Pelapor"
:allow-resizing="false"
css-class="custom-table-column"
@ -323,7 +323,7 @@
<DxColumn
:width="200"
alignment="center"
data-field=""
data-field="keterangan_pelapor"
caption="Keterangan Pelapor"
:allow-resizing="false"
css-class="custom-table-column"
@ -332,7 +332,7 @@
<DxColumn
:width="200"
alignment="center"
data-field=""
data-field="penyebab"
caption="Penyebab"
:allow-resizing="false"
css-class="custom-table-column"
@ -341,7 +341,7 @@
<DxColumn
:width="150"
alignment="center"
data-field=""
data-field="kode_gangguan"
caption="Kode Gangguan"
:allow-resizing="false"
css-class="custom-table-column"
@ -359,7 +359,7 @@
<DxColumn
:width="150"
alignment="center"
data-field=""
data-field="durasi_response_time"
caption="Durasi Response Time"
:allow-resizing="false"
css-class="custom-table-column"
@ -368,8 +368,8 @@
<DxColumn
:width="150"
alignment="center"
data-field=""
caption="Durasi Recoery Time:"
data-field="durasi_recovery_time"
caption="Durasi Recovery Time:"
:allow-resizing="false"
css-class="custom-table-column"
cell-template="formatTime"
@ -414,81 +414,109 @@
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">UID/UIW:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
<InputText :readonly="true" :value="dataSubSelected?.nama_uid" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">UP3:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
<InputText :readonly="true" :value="dataSubSelected?.nama_up3" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">ULP:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
<InputText :readonly="true" :value="dataSubSelected?.nama_ulp" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">ID Pelanggan:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
<InputText :readonly="true" :value="dataSubSelected?.id_pengguna" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Nama Pelapor:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
<InputText :readonly="true" :value="dataSubSelected?.nama_pelapor" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Alamat Pelapor:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
<InputText
:readonly="true"
:value="dataSubSelected?.alamat_pelapor"
class-name="flex-1"
/>
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">No Telp Pelapor:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
<InputText
:readonly="true"
:value="dataSubSelected?.no_telp_pelapor"
class-name="flex-1"
/>
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Keterangan Pelapor:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
<InputText
:readonly="true"
:value="dataSubSelected?.keterangan_pelapor"
class-name="flex-1"
/>
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Penyebab:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
<InputText :readonly="true" :value="dataSubSelected?.penyebab" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Kode Gangguan:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
<InputText :readonly="true" :value="dataSubSelected?.kode_gangguan" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Jenis Gangguan:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
<InputText
:readonly="true"
:value="dataSubSelected?.nama_jenis_gangguan"
class-name="flex-1"
/>
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Durasi Response Time:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
<InputText
:readonly="true"
:value="
parseInt(dataSubSelected?.durasi_response_time)
? formatWaktu(dataSubSelected?.durasi_response_time)
: '-'
"
class-name="flex-1"
/>
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Durasi Recoery Time:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
<InputText
:readonly="true"
:value="
parseInt(dataSubSelected?.durasi_recovery_time)
? formatWaktu(dataSubSelected?.durasi_recovery_time)
: '-'
"
class-name="flex-1"
/>
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Tgl Lapor:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[135px] text-gray-800">Tgl Selesai:</h3>
<InputText :readonly="true" value="" class-name="flex-1" />
</div>
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -524,6 +552,7 @@ import InputText from '@/components/InputText.vue'
import { formatWaktu } from '@/components/Form/FiltersType/reference'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -643,6 +672,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -654,7 +684,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -140,6 +140,7 @@
</template>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -169,6 +170,7 @@ import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -280,6 +282,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -291,7 +294,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -366,6 +366,7 @@
</template>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -397,6 +398,7 @@ import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -509,6 +511,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -520,7 +523,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -272,6 +272,7 @@
</template>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -304,6 +305,7 @@ import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -426,6 +428,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -437,7 +440,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -273,6 +273,7 @@
</DxSummary>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -305,6 +306,7 @@ import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -431,6 +433,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -442,7 +445,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -278,6 +278,7 @@
</template>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -310,6 +311,7 @@ import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -431,6 +433,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -442,7 +445,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -278,6 +278,7 @@
</template>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -310,6 +311,7 @@ import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -431,6 +433,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -442,7 +445,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -126,6 +126,7 @@
</template>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -155,6 +156,7 @@ import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -234,6 +236,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -245,7 +248,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -368,6 +368,7 @@
</template>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -399,6 +400,7 @@ import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -476,6 +478,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -487,7 +490,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -268,6 +268,7 @@
</template>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -300,6 +301,7 @@ import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -422,6 +424,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -433,7 +436,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -201,6 +201,7 @@
</template>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -231,6 +232,7 @@ import { Workbook } from 'exceljs'
import { useQuery } from '@vue/apollo-composable'
import { apolloClient, queries, requestGraphQl } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -309,6 +311,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -320,7 +323,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -273,6 +273,7 @@
</template>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -305,6 +306,7 @@ import { getMonthName } from '@/utils/texts'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient, queries, requestGraphQl } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -387,6 +389,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -398,7 +401,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -278,6 +278,7 @@
</template>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -310,6 +311,7 @@ import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -432,6 +434,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -443,7 +446,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -278,6 +278,7 @@
</template>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -308,6 +309,7 @@ import { useQuery } from '@vue/apollo-composable'
import { getMonthName } from '@/utils/texts'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const position = { of: '#data' }
const showIndicator = ref(true)
@ -429,6 +431,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -440,7 +443,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -642,6 +642,7 @@
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -676,6 +677,7 @@ 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'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -755,6 +757,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -766,7 +769,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -256,6 +256,7 @@
</template>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -288,6 +289,7 @@ import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { getMonthName } from '@/utils/texts'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -366,6 +368,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -377,7 +380,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -268,6 +268,7 @@
</template>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -300,6 +301,7 @@ import { getMonthNameShort } from '@/utils/texts'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)

View File

@ -966,6 +966,7 @@
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -985,7 +986,8 @@ import {
DxSummary,
DxTotalItem,
DxGroupItem,
DxGrouping
DxGrouping,
DxPager
} from 'devextreme-vue/data-grid'
import { jsPDF } from 'jspdf'
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
@ -1000,6 +1002,7 @@ 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'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -1079,6 +1082,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -1090,7 +1094,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -340,6 +340,7 @@
</template>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -370,6 +371,7 @@ import { useQuery } from '@vue/apollo-composable'
import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { getMonthName, getMonthNameShort } from '@/utils/texts'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const position = { of: '#data' }
const showIndicator = ref(true)
@ -444,6 +446,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -455,7 +458,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -256,6 +256,7 @@
</template>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -288,6 +289,7 @@ import { getMonthName } from '@/utils/texts'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -366,6 +368,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -377,7 +380,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -268,6 +268,7 @@
</template>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -300,6 +301,7 @@ import { getMonthNameShort } from '@/utils/texts'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -378,6 +380,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -389,7 +392,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -715,6 +715,7 @@
</template>
</DxDataGrid>
</div>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -747,6 +748,7 @@ import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)
@ -825,6 +827,7 @@ const getDetail = async () => {
})
.finally(() => {
loadingSubData.value = false
dialogDetail.value = true
})
}
@ -836,7 +839,6 @@ const clearSelection = () => {
const showDetail = () => {
clearSelection()
dataSubSelected.value = null
dialogDetail.value = true
getDetail()
}

View File

@ -234,6 +234,7 @@
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loadingData || loadingSubData" />
</template>
<script setup lang="ts">
@ -258,6 +259,7 @@ import { formatWaktu } from '@/components/Form/FiltersType/reference'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const client = apolloClient()
provideApolloClient(client)

View File

@ -127,6 +127,7 @@
/>
</DxDataGrid>
</div>
<BufferDialog v-if="loading" />
</template>
<script setup lang="ts">
@ -149,6 +150,7 @@ import { saveAs } from 'file-saver'
import { Workbook } from 'exceljs'
import { Type17 } from '@/components/Form/FiltersType'
import Filters from '@/components/Form/Filters.vue'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const position = { of: '#data' }
const showIndicator = ref(true)
const shading = ref(true)

View File

@ -1651,16 +1651,18 @@ export const queries = {
query detailGangguanAlihPosko(
$dateFrom: Date!
$dateTo: Date!
$posko: Int!
$idUid: Int!
$idUp3: Int!
$idPoskoLama: Int!
$idPoskoBaru: Int!
) {
detailGangguanAlihPosko(
dateFrom: $dateFrom
dateTo: $dateTo
posko: $posko
idUid: $idUid
idUp3: $idUp3
idPoskoLama: $idPoskoLama
idPoskoBaru: $idPoskoBaru
) {
id
nama_regional