Rekapitulasi Gangguan ALL s/d Diselesaikan Mobile APKT 7- 17
This commit is contained in:
		| @@ -1,6 +1,6 @@ | ||||
| <template> | ||||
|     <div> | ||||
|         <DxDataGrid class="max-h-[calc(100vh-140px)]" :show-column-lines="true" :show-row-lines="false" :show-borders="true" | ||||
|         <DxDataGrid class="max-h-[calc(100vh-140px)]" :data-source="data" :show-column-lines="true" :show-row-lines="false" :show-borders="true" | ||||
|             :row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="onSelectionChanged" | ||||
|             @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget" :word-wrap-enabled="true"> | ||||
|             <DxSelection mode="single" /> | ||||
| @@ -12,17 +12,17 @@ | ||||
|             <DxColumnFixing :enabled="true" /> | ||||
|  | ||||
|             <DxColumn :width="50" alignment="center" data-field="" caption="NO" css-class="custom-table-column" /> | ||||
|             <DxColumn alignment="center" data-field="" caption="Nama UP3" css-class="custom-table-column" /> | ||||
|             <DxColumn alignment="center" data-field="" caption="Nama Posko" css-class="custom-table-column" /> | ||||
|             <DxColumn :width="100" alignment="center" data-field="" caption="Posko IN" css-class="custom-table-column" /> | ||||
|             <DxColumn :width="100" alignment="center" data-field="" caption="Posko OUT" css-class="custom-table-column" /> | ||||
|             <DxColumn alignment="center" data-field="id_uid" caption="Nama UP3" css-class="custom-table-column" /> | ||||
|             <DxColumn alignment="center" data-field="id_up3" caption="Nama Posko" css-class="custom-table-column" /> | ||||
|             <DxColumn :width="100" alignment="center" data-field="posko_in" caption="Posko IN" css-class="custom-table-column" /> | ||||
|             <DxColumn :width="100" alignment="center" data-field="posko_out" caption="Posko OUT" css-class="custom-table-column" /> | ||||
|  | ||||
|         </DxDataGrid> | ||||
|     </div> | ||||
| </template> | ||||
|  | ||||
| <script setup lang="ts"> | ||||
| import { onMounted } from 'vue' | ||||
| import { onMounted, ref } from 'vue' | ||||
| import { useFiltersStore } from '@/stores/filters' | ||||
| import { DxDataGrid } from 'devextreme-vue' | ||||
| import { DxColumn, DxColumnFixing, DxExport, DxLoadPanel, DxPaging, DxScrolling, DxSearchPanel, DxSelection } from 'devextreme-vue/data-grid' | ||||
| @@ -31,6 +31,8 @@ import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter' | ||||
| import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter' | ||||
| import { saveAs } from 'file-saver' | ||||
| import { Workbook } from 'exceljs' | ||||
| import { useQuery } from '@vue/apollo-composable' | ||||
| import gql from 'graphql-tag' | ||||
|  | ||||
| const onExporting = (e: any) => { | ||||
|     if (e.format === 'pdf') { | ||||
| @@ -65,10 +67,55 @@ const onSelectionChanged = ({ selectedRowsData }: any) => { | ||||
|     const data = selectedRowsData[0] | ||||
|     console.log(data) | ||||
| } | ||||
|  | ||||
| const data = ref<any[]>([]) | ||||
| const GET_REKAPITULASI_GANGGUAN_ALIH_POSKO = gql` | ||||
| query rekapitulasiGangguanAlihPosko | ||||
| ( | ||||
|     $dateFrom: Date! | ||||
|     $dateTo: Date! | ||||
|     $posko: String! | ||||
|     $idUid: Int! | ||||
|     $idUp3: Int! | ||||
| ) { | ||||
|     rekapitulasiGangguanAlihPosko | ||||
| ( | ||||
|         dateFrom: $dateFrom | ||||
|         dateTo: $dateTo | ||||
|         posko: $posko | ||||
|         idUid: $idUid | ||||
|         idUp3: $idUp3 | ||||
|     ) { | ||||
|         id_uid | ||||
|         id_up3 | ||||
|         posko | ||||
|         posko_in | ||||
|         posko_out | ||||
|         } | ||||
| }`; | ||||
| const loadingVisible = ref<boolean>(true) | ||||
| onMounted(() => { | ||||
|     const filters = useFiltersStore() | ||||
|     const { onResult, onError } = useQuery(GET_REKAPITULASI_GANGGUAN_ALIH_POSKO, { | ||||
|         dateFrom: new Date("2023-10-01").toISOString().slice(0, 10), | ||||
|         dateTo: new Date("2023-10-01").toISOString().slice(0, 10), | ||||
|         posko: "", | ||||
|         idUid: 0, | ||||
|         idUp3: 0, | ||||
|     }) | ||||
|  | ||||
|     onResult(queryResult => { | ||||
|         if (queryResult.data != undefined) { | ||||
|             data.value = queryResult.data.rekapitulasiGangguanAlihPosko | ||||
|                 ; | ||||
|             loadingVisible.value = false | ||||
|         } | ||||
|         console.log(queryResult.data) | ||||
|         console.log(queryResult.loading) | ||||
|         console.log(queryResult.networkStatus) | ||||
|     }) | ||||
|     onError((error) => { | ||||
|         console.log(error) | ||||
|     }) | ||||
|     filters.setConfig({ | ||||
|         type: 'type-1', | ||||
|         reportButton: true | ||||
|   | ||||
		Reference in New Issue
	
	Block a user