diff --git a/src/components/Pages/Gangguan/Rekap/RGangguan_ALL.vue b/src/components/Pages/Gangguan/Rekap/RGangguan_ALL.vue index 61d97ac..c47cb7f 100755 --- a/src/components/Pages/Gangguan/Rekap/RGangguan_ALL.vue +++ b/src/components/Pages/Gangguan/Rekap/RGangguan_ALL.vue @@ -11,6 +11,7 @@
(null) const reportMeta = ref({ uid: { id: 0, name: 'Semua Unit Induk Distribusi/Wilayah' }, up3: { id: 0, name: 'Semua Unit Pelaksanaan Pelayanan Pelanggan' }, @@ -1108,9 +1112,36 @@ const reportMeta = ref({ periode: '' }) -const setAgreementDialog = (column: string) => { - console.log('column', column) +const onCellClicked = (e: any) => { + // console.log('cell clicked', e) + // console.log('group cell clicked', e.column.caption) + // console.log('value', e.values[e.row.groupIndex]) + if (e.rowType == 'group') { + groupDialog.value = true + groupIndex.value = e.row.groupIndex + setAgreementDialog(e.column.caption) + if (e.row.groupIndex == 0) { + // + } else if (e.row.groupIndex == 1) { + const data = e.data.collapsedItems[0].items[0].items[0] + groupData.value = data + console.table(data) + } else if (e.row.groupIndex == 2) { + const data = e.data.collapsedItems[0].items[0] + groupData.value = data + console.table(data) + } else if (e.row.groupIndex == 3) { + const data = e.data.collapsedItems[0] + groupData.value = data + console.table(data) + } + showDetail() + } else { + groupDialog.value = false + } +} +const setAgreementDialog = (column: string) => { if (column == 'Total' || column == 'Selesai' || column == 'In Progress') { agreeToShowDialog.value = true if (column == 'Total') { @@ -1151,13 +1182,12 @@ const resetData = () => { dataSubSelected.value = null } -const filterData = (params: any) => { +const filterData = async (params: any) => { resetData() - loadingData.value = true const { posko, uid, up3 } = params const dateValue = params.periode.split(' s/d ') - const { onResult, onError, loading, refetch } = useQuery(queries.gangguan.rekap.gangguanAll, { + const query = { dateFrom: dateValue[0] ? dateValue[0].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10), @@ -1167,23 +1197,20 @@ const filterData = (params: any) => { posko: posko ? posko.id : 0, idUid: uid ? uid.id : 0, idUp3: up3 ? up3.id : 0 - }) + } - onResult((queryResult) => { - if (queryResult.data != undefined) { - data.value = queryResult.data.rekapitulasiAllGangguan - } - - reportMeta.value = filters.value - }) - - onError((error) => { - console.log(error) - }) - - watch(loading, (value) => { - loadingData.value = value - }) + loadingData.value = true + await requestGraphQl(queries.gangguan.rekap.gangguanAll, query) + .then((result) => { + dataSub.value = result.data.data.rekapitulasiAllGangguan + reportMeta.value = filters.value + }) + .catch((err) => { + console.error(err) + }) + .finally(() => { + loadingData.value = false + }) } const getDetail = async () => { @@ -1191,56 +1218,79 @@ const getDetail = async () => { const dateValue = filters.value.periode.split(' s/d ') const selected = dataSelected.value - const query = { + var 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: selected?.id_posko ? selected?.id_posko : 0, - idUid: selected?.id_uid ? selected?.id_uid : 0, - idUp3: selected?.id_up3 ? selected?.id_up3 : 0, - idRegu: selected?.id_regu ? selected?.id_regu : 0, - idUlp: selected?.id_ulp ? selected?.id_ulp : 0, - namaRegional: selected?.nama_regional ? selected?.nama_regional : '', - media: selected?.media ? selected?.media : '', + posko: 0, + idUid: 0, + idUp3: 0, + idRegu: 0, + idUlp: 0, + namaRegional: '', + media: '', isSelesai: progressSelected.value, tanggal: '' } + if (groupDialog.value) { + if (groupIndex.value == 0) { + query = { + ...query, + isSelesai: progressSelected.value + } + } else if (groupIndex.value == 1) { + query = { + ...query, + namaRegional: groupData.value?.nama_regional ? groupData.value?.nama_regional : '' + } + } else if (groupIndex.value == 2) { + query = { + ...query, + idUid: groupData.value?.id_uid ? groupData.value?.id_uid : 0, + namaRegional: groupData.value?.nama_regional ? groupData.value?.nama_regional : '' + } + } else if (groupIndex.value == 3) { + query = { + ...query, + idUid: groupData.value?.id_uid ? groupData.value?.id_uid : 0, + idUp3: groupData.value?.id_up3 ? groupData.value?.id_up3 : 0, + namaRegional: groupData.value?.nama_regional ? groupData.value?.nama_regional : '' + } + } + } else { + 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: selected?.id_posko ? selected?.id_posko : 0, + idUid: selected?.id_uid ? selected?.id_uid : 0, + idUp3: selected?.id_up3 ? selected?.id_up3 : 0, + idRegu: selected?.id_regu ? selected?.id_regu : 0, + idUlp: selected?.id_ulp ? selected?.id_ulp : 0, + namaRegional: selected?.nama_regional ? selected?.nama_regional : '', + media: selected?.media ? selected?.media : '', + isSelesai: progressSelected.value, + tanggal: '' + } + } + console.table(query) - await requestGraphQl(queries.gangguan.rekap.gangguanAllDetail.loc?.source.body!, query) + await requestGraphQl(queries.gangguan.rekap.gangguanAllDetail, query) .then((result) => { dataSub.value = result.data.data.detailGangguan }) .catch((err) => { - console.log(err) + console.error(err) }) .finally(() => { loadingSubData.value = false }) - - // const { onResult, onError, refetch, loading } = useQuery( - // queries.gangguan.rekap.gangguanAllDetail, - // query, - // { - // fetchPolicy: 'network-only' - // } - // ) - - // onResult((queryResult) => { - // if (queryResult.data != undefined) { - // dataSub.value = queryResult.data.detailGangguan - // } - // }) - - // onError((error) => { - // console.log(error) - // }) - - // watch(loading, (value) => { - // loadingSubData.value = value - // }) } const dataGridRef = ref(null) const clearSelection = () => { diff --git a/src/utils/api/api.graphql.ts b/src/utils/api/api.graphql.ts index 5e254fb..54c7e38 100755 --- a/src/utils/api/api.graphql.ts +++ b/src/utils/api/api.graphql.ts @@ -1,5 +1,11 @@ //deploy vm -import { ApolloClient, createHttpLink, gql, InMemoryCache } from '@apollo/client/core' +import { + ApolloClient, + createHttpLink, + gql, + InMemoryCache, + type DocumentNode +} from '@apollo/client/core' import axios from 'axios' const controller = new AbortController() const url = import.meta.env.VITE_APP_GRAPHQL_ENDPOINT @@ -13,9 +19,11 @@ const instance = axios.create({ signal: controller.signal }) -export const requestGraphQl = async (query: string, data: any) => { +export const getQueryString = (query: DocumentNode) => query.loc?.source.body! + +export const requestGraphQl = async (query: DocumentNode, data: any) => { return await instance.post('', { - query: query, + query: getQueryString(query), variables: data }) }