Rekapitulasi Gangguan ALL s/d Diselesaikan Mobile APKT 7- 17
This commit is contained in:
probdg
parent
e4a6fbb6b8
commit
949607f025
@ -157,6 +157,51 @@ 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 gql from 'graphql-tag';
|
||||
import { useQuery } from '@vue/apollo-composable'
|
||||
|
||||
const data = ref<any[]>([])
|
||||
const GET_REKAPITULASI_GANGGUAN_PER_POSKO = gql`
|
||||
query rekapitulasiGangguanPerPosko(
|
||||
$dateFrom: Date!
|
||||
$dateTo: Date!
|
||||
$posko: String!
|
||||
$idUid: Int!
|
||||
$idUp3: Int!
|
||||
) {
|
||||
rekapitulasiGangguanPerPosko(
|
||||
dateFrom: $dateFrom
|
||||
dateTo: $dateTo
|
||||
posko: $posko
|
||||
idUid: $idUid
|
||||
idUp3: $idUp3
|
||||
) {
|
||||
avg_durasi_dispatch
|
||||
avg_durasi_recovery
|
||||
avg_durasi_response
|
||||
id_uid
|
||||
id_up3
|
||||
max_durasi_dispatch
|
||||
max_durasi_recovery
|
||||
max_durasi_response
|
||||
min_durasi_dispatch
|
||||
min_durasi_recovery
|
||||
min_durasi_response
|
||||
persen_inproses
|
||||
persen_selesai
|
||||
posko
|
||||
total
|
||||
total_diatas_sla_dispatch
|
||||
total_diatas_sla_recovery
|
||||
total_diatas_sla_response
|
||||
total_dibawah_sla_dispatch
|
||||
total_dibawah_sla_recovery
|
||||
total_dibawah_sla_response
|
||||
total_inproses
|
||||
total_selesai
|
||||
}
|
||||
}`;
|
||||
const loadingVisible = ref<boolean>(true)
|
||||
|
||||
const onExporting = (e: any) => {
|
||||
if (e.format === 'pdf') {
|
||||
@ -264,15 +309,81 @@ const createDummy = () => {
|
||||
data.value = dummy;
|
||||
}
|
||||
|
||||
const data = ref<any[]>([])
|
||||
|
||||
onMounted(() => {
|
||||
const filters = useFiltersStore()
|
||||
const { onResult, onError } = useQuery(GET_REKAPITULASI_GANGGUAN_PER_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) {
|
||||
|
||||
var i = 1;
|
||||
queryResult.data.rekapitulasiGangguanPerPosko.forEach((item: any) => {
|
||||
const entry = {
|
||||
no : Number(i++),
|
||||
posko: item.posko,
|
||||
laporan: {
|
||||
total: item.total,
|
||||
sudahSelesai: {
|
||||
jml: item.total_selesai,
|
||||
persen: item.persen_selesai,
|
||||
},
|
||||
belumSelesai: {
|
||||
jml: item.total_inproses,
|
||||
persen:item.persen_inproses,
|
||||
},
|
||||
},
|
||||
responseTime: {
|
||||
menit: {
|
||||
total: 0,
|
||||
rataRata: item.avg_durasi_response,
|
||||
max: item.max_durasi_response,
|
||||
min: item.min_durasi_response,
|
||||
},
|
||||
laporan: {
|
||||
lebihSla: item.total_diatas_sla_response,
|
||||
kurangSla: item.total_dibawah_sla_response,
|
||||
},
|
||||
},
|
||||
recoveryTime: {
|
||||
menit: {
|
||||
total: 0,
|
||||
rataRata: item.avg_durasi_recovery,
|
||||
max: item.max_durasi_recovery,
|
||||
min: item.min_durasi_recovery,
|
||||
},
|
||||
laporan: {
|
||||
lebihSla: item.total_diatas_sla_recovery,
|
||||
kurangSla: item.total_dibawah_sla_recovery,
|
||||
},
|
||||
|
||||
}
|
||||
};
|
||||
data.value = [...data.value, entry];
|
||||
|
||||
|
||||
})
|
||||
|
||||
data.value = [...data.value];
|
||||
console.log(data.value)
|
||||
loadingVisible.value = false
|
||||
}
|
||||
console.log(queryResult.data)
|
||||
console.log(queryResult.loading)
|
||||
console.log(queryResult.networkStatus)
|
||||
})
|
||||
onError((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
filters.setConfig({
|
||||
type: 'type-8',
|
||||
reportButton: true
|
||||
})
|
||||
createDummy()
|
||||
// createDummy()
|
||||
})
|
||||
</script>
|
||||
@ -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"
|
||||
:column-width="100" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true">
|
||||
@ -13,57 +13,57 @@
|
||||
<DxColumnFixing :enabled="true" />
|
||||
|
||||
<DxColumn :width="50" alignment="center" data-field="" caption="NO" css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" caption="Kode" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="" caption="Nama Regu" css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="kode_regu" caption="Kode" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="nama_regu" caption="Nama Regu" css-class="custom-table-column" />
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Total"
|
||||
<DxColumn :width="120" alignment="center" data-field="total" data-type="number" caption="Total"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn alignment="center" caption="Sudah Selesai" css-class="custom-table-column">
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Jml"
|
||||
<DxColumn :width="120" alignment="center" data-field="total_selesai" data-type="number" caption="Jml"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="%"
|
||||
<DxColumn :width="120" alignment="center" data-field="persen_selesai" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Belum Selesai" css-class="custom-table-column">
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Jml"
|
||||
<DxColumn :width="120" alignment="center" data-field="total_inproses" data-type="number" caption="Jml"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="%"
|
||||
<DxColumn :width="120" alignment="center" data-field="persen_inproses" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Response Time" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Menit" css-class="custom-table-column">
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Total"
|
||||
<DxColumn :width="120" alignment="center" data-field="total_reponse" data-type="number" caption="Total"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Rata-Rata"
|
||||
<DxColumn :width="120" alignment="center" data-field="avg_durasi_response" data-type="number" caption="Rata-Rata"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Max"
|
||||
<DxColumn :width="120" alignment="center" data-field="max_durasi_response" data-type="number" caption="Max"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Min"
|
||||
<DxColumn :width="120" alignment="center" data-field="min_durasi_response" data-type="number" caption="Min"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption=">SLA"
|
||||
<DxColumn :width="120" alignment="center" data-field="total_diatas_sla_response" data-type="number" caption=">SLA"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="≤SLA"
|
||||
<DxColumn :width="120" alignment="center" data-field="total_dibawah_sla_response" data-type="number" caption="≤SLA"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Recovery Time" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Menit" css-class="custom-table-column">
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Total"
|
||||
<DxColumn :width="120" alignment="center" data-field="total_recovery" data-type="number" caption="Total"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Rata-Rata"
|
||||
<DxColumn :width="120" alignment="center" data-field="avg_durasi_recovery" data-type="number" caption="Rata-Rata"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Max"
|
||||
<DxColumn :width="120" alignment="center" data-field="max_durasi_response" data-type="number" caption="Max"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Min"
|
||||
<DxColumn :width="120" alignment="center" data-field="min_durasi_recovery" data-type="number" caption="Min"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption=">SLA"
|
||||
<DxColumn :width="120" alignment="center" data-field="total_diatas_sla_recovery" data-type="number" caption=">SLA"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="≤SLA"
|
||||
<DxColumn :width="120" alignment="center" data-field="total_dibawah_sla_recovery" data-type="number" caption="≤SLA"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
@ -72,7 +72,7 @@
|
||||
</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'
|
||||
@ -81,7 +81,51 @@ 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 data = ref<any[]>([])
|
||||
const GET_REKAPITULASI_GANGGUAN_PER_REGU = gql`
|
||||
query rekapitulasiGangguanPerRegu(
|
||||
$dateFrom: Date!
|
||||
$dateTo: Date!
|
||||
$posko: String!
|
||||
$idUid: Int!
|
||||
$idUp3: Int!
|
||||
) {
|
||||
rekapitulasiGangguanPerRegu(
|
||||
dateFrom: $dateFrom
|
||||
dateTo: $dateTo
|
||||
posko: $posko
|
||||
idUid: $idUid
|
||||
idUp3: $idUp3
|
||||
) {
|
||||
nama_regu
|
||||
avg_durasi_dispatch
|
||||
avg_durasi_recovery
|
||||
avg_durasi_response
|
||||
id_uid
|
||||
id_up3
|
||||
max_durasi_dispatch
|
||||
max_durasi_recovery
|
||||
max_durasi_response
|
||||
min_durasi_dispatch
|
||||
min_durasi_recovery
|
||||
min_durasi_response
|
||||
persen_inproses
|
||||
persen_selesai
|
||||
posko
|
||||
total
|
||||
total_diatas_sla_dispatch
|
||||
total_diatas_sla_recovery
|
||||
total_diatas_sla_response
|
||||
total_dibawah_sla_dispatch
|
||||
total_dibawah_sla_recovery
|
||||
total_dibawah_sla_response
|
||||
total_inproses
|
||||
total_selesai
|
||||
}
|
||||
}`;
|
||||
const onExporting = (e: any) => {
|
||||
if (e.format === 'pdf') {
|
||||
const doc = new jsPDF()
|
||||
@ -115,10 +159,29 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
const data = selectedRowsData[0]
|
||||
console.log(data)
|
||||
}
|
||||
const loadingVisible = ref<boolean>(true)
|
||||
|
||||
onMounted(() => {
|
||||
const filters = useFiltersStore()
|
||||
|
||||
const { onResult, onError } = useQuery(GET_REKAPITULASI_GANGGUAN_PER_REGU, {
|
||||
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.rekapitulasiGangguanPerRegu;
|
||||
loadingVisible.value = false
|
||||
}
|
||||
console.log(queryResult.data)
|
||||
console.log(queryResult.loading)
|
||||
console.log(queryResult.networkStatus)
|
||||
})
|
||||
onError((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
filters.setConfig({
|
||||
type: 'type-9'
|
||||
})
|
||||
|
||||
@ -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"
|
||||
:column-width="100" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget"
|
||||
:word-wrap-enabled="true">
|
||||
@ -13,57 +13,57 @@
|
||||
<DxColumnFixing :enabled="true" />
|
||||
|
||||
<DxColumn :width="50" alignment="center" data-field="" caption="NO" css-class="custom-table-column" />
|
||||
<DxColumn :width="170" alignment="center" data-field="" caption="Tanggal Lapor"
|
||||
<DxColumn :width="170" alignment="center" data-field="tanggal" caption="Tanggal Lapor"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Total"
|
||||
<DxColumn :width="120" alignment="center" data-field="total" data-type="number" caption="Total"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn alignment="center" caption="Sudah Selesai" css-class="custom-table-column">
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Jml"
|
||||
<DxColumn :width="120" alignment="center" data-field="total_selesai" data-type="number" caption="Jml"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="%"
|
||||
<DxColumn :width="120" alignment="center" data-field="persen_selesai" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Belum Selesai" css-class="custom-table-column">
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Jml"
|
||||
<DxColumn :width="120" alignment="center" data-field="total_inproses" data-type="number" caption="Jml"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="%"
|
||||
<DxColumn :width="120" alignment="center" data-field="persen_inproses" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Response Time" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Menit" css-class="custom-table-column">
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Total"
|
||||
<DxColumn :width="120" alignment="center" data-field="total_response" data-type="number" caption="Total"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Rata-Rata"
|
||||
<DxColumn :width="120" alignment="center" data-field="avg_durasi_response" data-type="number" caption="Rata-Rata"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Max"
|
||||
<DxColumn :width="120" alignment="center" data-field="max_durasi_response" data-type="number" caption="Max"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Min"
|
||||
<DxColumn :width="120" alignment="center" data-field="min_durasi_response" data-type="number" caption="Min"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption=">SLA"
|
||||
<DxColumn :width="120" alignment="center" data-field="total_diatas_sla_response" data-type="number" caption=">SLA"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="≤SLA"
|
||||
<DxColumn :width="120" alignment="center" data-field="total_dibawah_sla_response" data-type="number" caption="≤SLA"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Recovery Time" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Menit" css-class="custom-table-column">
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Total"
|
||||
<DxColumn :width="120" alignment="center" data-field="total_recovery" data-type="number" caption="Total"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Rata-Rata"
|
||||
<DxColumn :width="120" alignment="center" data-field="avg_durasi_recovery" data-type="number" caption="Rata-Rata"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Max"
|
||||
<DxColumn :width="120" alignment="center" data-field="max_durasi_recovery" data-type="number" caption="Max"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="Min"
|
||||
<DxColumn :width="120" alignment="center" data-field="min_durasi_recovery" data-type="number" caption="Min"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption=">SLA"
|
||||
<DxColumn :width="120" alignment="center" data-field="total_diatas_sla_recovery" data-type="number" caption=">SLA"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" data-type="number" caption="≤SLA"
|
||||
<DxColumn :width="120" alignment="center" data-field="total_dibawah_sla_recovery" data-type="number" caption="≤SLA"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
@ -72,7 +72,7 @@
|
||||
</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'
|
||||
@ -81,7 +81,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') {
|
||||
const doc = new jsPDF()
|
||||
@ -116,9 +117,70 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
console.log(data)
|
||||
}
|
||||
|
||||
|
||||
const data = ref<any[]>([])
|
||||
const GET_REKAPITULASI_GANGGUAN_PER_TANGGAL = gql`
|
||||
query rekapitulasiGangguanPerTanggal(
|
||||
$dateFrom: Date!
|
||||
$dateTo: Date!
|
||||
$posko: String!
|
||||
$idUid: Int!
|
||||
$idUp3: Int!
|
||||
) {
|
||||
rekapitulasiGangguanPerTanggal(
|
||||
dateFrom: $dateFrom
|
||||
dateTo: $dateTo
|
||||
posko: $posko
|
||||
idUid: $idUid
|
||||
idUp3: $idUp3
|
||||
) {
|
||||
avg_durasi_dispatch
|
||||
avg_durasi_recovery
|
||||
avg_durasi_response
|
||||
id_uid
|
||||
id_up3
|
||||
max_durasi_dispatch
|
||||
max_durasi_recovery
|
||||
max_durasi_response
|
||||
min_durasi_dispatch
|
||||
min_durasi_recovery
|
||||
min_durasi_response
|
||||
persen_inproses
|
||||
persen_selesai
|
||||
tanggal
|
||||
total
|
||||
total_diatas_sla_dispatch
|
||||
total_diatas_sla_recovery
|
||||
total_diatas_sla_response
|
||||
total_dibawah_sla_dispatch
|
||||
total_dibawah_sla_recovery
|
||||
total_dibawah_sla_response
|
||||
total_inproses
|
||||
total_selesai
|
||||
}
|
||||
}`;
|
||||
const loadingVisible = ref<boolean>(true)
|
||||
onMounted(() => {
|
||||
const filters = useFiltersStore()
|
||||
|
||||
const { onResult, onError } = useQuery(GET_REKAPITULASI_GANGGUAN_PER_TANGGAL, {
|
||||
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.rekapitulasiGangguanPerTanggal;
|
||||
loadingVisible.value = false
|
||||
}
|
||||
console.log(queryResult.data)
|
||||
console.log(queryResult.loading)
|
||||
console.log(queryResult.networkStatus)
|
||||
})
|
||||
onError((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
filters.setConfig({
|
||||
type: 'type-9'
|
||||
})
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
<template>
|
||||
<div>
|
||||
<DxDataGrid class="max-h-[calc(100vh-140px)]" :show-column-lines="true" :show-row-lines="false" :show-borders="true"
|
||||
:row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="onSelectionChanged"
|
||||
:column-width="100" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget"
|
||||
:word-wrap-enabled="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" :column-width="100" @exporting="onExporting"
|
||||
:allow-column-resizing="true" column-resizing-mode="widget" :word-wrap-enabled="true">
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -13,18 +13,11 @@
|
||||
<DxColumnFixing :enabled="true" />
|
||||
|
||||
<DxColumn :width="50" alignment="center" data-field="" caption="NO" css-class="custom-table-column" />
|
||||
<DxColumn :width="170" alignment="center" data-field="" caption="Nama Media" css-class="custom-table-column" />
|
||||
<DxColumn :width="170" alignment="center" data-field="media" caption="Nama Media"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn alignment="center" caption="Tanggal" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="" data-type="date" caption="1"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="" data-type="date" caption="2"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="" data-type="date" caption="3"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="" data-type="date" caption="4"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="" data-type="date" caption="5"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn v-for="i in 31" :width="150" alignment="center" :data-field="`tgl${i}`" data-type="number"
|
||||
:caption="i" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
|
||||
</DxDataGrid>
|
||||
@ -32,7 +25,7 @@
|
||||
</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'
|
||||
@ -41,7 +34,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') {
|
||||
const doc = new jsPDF()
|
||||
@ -76,9 +70,80 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
console.log(data)
|
||||
}
|
||||
|
||||
|
||||
const data = ref<any[]>([])
|
||||
const GET_REKAPITULASI_BERDASARKAN_MEDIA = gql`
|
||||
query rekapitulasiGangguanBerdasarkanMedia(
|
||||
$dateFrom: Date!
|
||||
$dateTo: Date!
|
||||
$posko: String!
|
||||
$idUid: Int!
|
||||
$idUp3: Int!
|
||||
) {
|
||||
rekapitulasiGangguanBerdasarkanMedia(
|
||||
dateFrom: $dateFrom
|
||||
dateTo: $dateTo
|
||||
posko: $posko
|
||||
idUid: $idUid
|
||||
idUp3: $idUp3
|
||||
) {
|
||||
media
|
||||
tgl1
|
||||
tgl10
|
||||
tgl11
|
||||
tgl12
|
||||
tgl13
|
||||
tgl14
|
||||
tgl15
|
||||
tgl16
|
||||
tgl17
|
||||
tgl18
|
||||
tgl19
|
||||
tgl2
|
||||
tgl20
|
||||
tgl21
|
||||
tgl22
|
||||
tgl23
|
||||
tgl24
|
||||
tgl25
|
||||
tgl26
|
||||
tgl27
|
||||
tgl28
|
||||
tgl29
|
||||
tgl3
|
||||
tgl30
|
||||
tgl31
|
||||
tgl4
|
||||
tgl5
|
||||
tgl6
|
||||
tgl7
|
||||
tgl8
|
||||
tgl9
|
||||
}
|
||||
}`;
|
||||
const loadingVisible = ref<boolean>(true)
|
||||
onMounted(() => {
|
||||
const filters = useFiltersStore()
|
||||
const { onResult, onError } = useQuery(GET_REKAPITULASI_BERDASARKAN_MEDIA, {
|
||||
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.rekapitulasiGangguanBerdasarkanMedia;
|
||||
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
|
||||
|
||||
@ -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
|
||||
|
||||
@ -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" />
|
||||
@ -15,30 +15,30 @@
|
||||
<DxColumn :width="50" alignment="center" data-field="" caption="a" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn :width="150" alignment="center" caption="Nama Regu" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="" caption="b" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="regu" caption="b" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn :width="150" alignment="center" caption="Kode Regu" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="" caption="c" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="kode_regu" caption="c" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Total" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="d=(e+g)" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="total_laporan" caption="d=(e+g)" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Sudah Selesai" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Jml" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="e" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="total_selesai" caption="e" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="%" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="f=(e/d)*100" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_selesai" caption="f=(e/d)*100" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Belum Selesai" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Jml" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="g" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="total_belum_selesai" caption="g" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="%" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="h=(g/d)*100" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_belum_selesai" caption="h=(g/d)*100" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
@ -48,20 +48,20 @@
|
||||
<DxColumn alignment="center" caption="Non Marking" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Total" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="i" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="total_laporan_mobile_nonmarking" caption="i" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="%" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="j=(i/d)*100"
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_laporan_mobile_nonmarking" caption="j=(i/d)*100"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
|
||||
<DxColumn alignment="center" caption="Waktu Rata-Rata" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Response" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="k" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="avg_waktu_response_mobile_nonmarking" caption="k" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Recovery" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="l" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="avg_waktu_recovery_mobile_nonmarking" caption="l" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
@ -69,20 +69,20 @@
|
||||
<DxColumn alignment="center" caption="Marking" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Total" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="m" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="total_laporan_mobile_marking" caption="m" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="%" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="n=(m/d)*100"
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_laporan_mobile_marking" caption="n=(m/d)*100"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
|
||||
<DxColumn alignment="center" caption="Waktu Rata-Rata" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Response" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="o" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="avg_waktu_response_mobile_marking" caption="o" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Recovery" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="p" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="avg_waktu_recovery_mobile_marking" caption="p" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
@ -92,20 +92,20 @@
|
||||
<DxColumn alignment="center" caption="Non Marking" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Total" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="q" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="total_laporan_nonmobile_nonmarking" caption="q" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="%" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="r=(q/d)*100"
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_laporan_nonmobile_nonmarking" caption="r=(q/d)*100"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
|
||||
<DxColumn alignment="center" caption="Waktu Rata-Rata" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Response" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="s" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="avg_waktu_response_nonmobile_nonmarking" caption="s" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Recovery" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="t" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="avg_waktu_recovery_nonmobile_nonmarking" caption="t" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
@ -113,20 +113,20 @@
|
||||
<DxColumn alignment="center" caption="Marking" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Total" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="u" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="total_laporan_nonmobile_marking" caption="u" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="%" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="v=(u/d)*100"
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_laporan_nonmobile_marking" caption="v=(u/d)*100"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
|
||||
<DxColumn alignment="center" caption="Waktu Rata-Rata" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Response" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="w" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="avg_waktu_response_nonmobile_nonmarking" caption="w" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Recovery" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="x" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="avg_waktu_recovery_nonmobile_nonmarking" caption="x" css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
</DxColumn>
|
||||
@ -138,7 +138,7 @@
|
||||
</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'
|
||||
@ -147,6 +147,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') {
|
||||
@ -181,10 +183,73 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
const data = selectedRowsData[0]
|
||||
console.log(data)
|
||||
}
|
||||
|
||||
const data = ref<any[]>([])
|
||||
const GET_REKAPITULASI_GANGGUAN_DISELESAIKAN_MOBILE_APKT = gql`
|
||||
query rekapitulasiGangguanDiselesaikanMobileAPKT
|
||||
(
|
||||
$dateFrom: Date!
|
||||
$dateTo: Date!
|
||||
$posko: String!
|
||||
$idUid: Int!
|
||||
$idUp3: Int!
|
||||
) {
|
||||
rekapitulasiGangguanDiselesaikanMobileAPKT
|
||||
(
|
||||
dateFrom: $dateFrom
|
||||
dateTo: $dateTo
|
||||
posko: $posko
|
||||
idUid: $idUid
|
||||
idUp3: $idUp3
|
||||
) {
|
||||
avg_waktu_recovery_mobile_marking
|
||||
avg_waktu_recovery_mobile_nonmarking
|
||||
avg_waktu_recovery_nonmobile_marking
|
||||
avg_waktu_recovery_nonmobile_nonmarking
|
||||
avg_waktu_response_mobile_marking
|
||||
avg_waktu_response_mobile_nonmarking
|
||||
avg_waktu_response_nonmobile_marking
|
||||
avg_waktu_response_nonmobile_nonmarking
|
||||
kode_regu
|
||||
persen_belum_selesai
|
||||
persen_laporan_mobile_marking
|
||||
persen_laporan_mobile_nonmarking
|
||||
persen_laporan_nonmobile_marking
|
||||
persen_laporan_nonmobile_nonmarking
|
||||
persen_selesai
|
||||
regu
|
||||
total_belum_selesai
|
||||
total_laporan
|
||||
total_laporan_mobile_marking
|
||||
total_laporan_mobile_nonmarking
|
||||
total_laporan_nonmobile_marking
|
||||
total_laporan_nonmobile_nonmarking
|
||||
total_selesai
|
||||
}
|
||||
}`;
|
||||
const loadingVisible = ref<boolean>(true)
|
||||
onMounted(() => {
|
||||
const filters = useFiltersStore()
|
||||
const { onResult, onError } = useQuery(GET_REKAPITULASI_GANGGUAN_DISELESAIKAN_MOBILE_APKT, {
|
||||
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.rekapitulasiGangguanDiselesaikanMobileAPKT
|
||||
;
|
||||
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
|
||||
|
||||
@ -1,8 +1,9 @@
|
||||
<template>
|
||||
<div>
|
||||
<DxDataGrid class="max-h-[calc(100vh-140px)]" :show-column-lines="true" :show-row-lines="false" :show-borders="true"
|
||||
:row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="onSelectionChanged"
|
||||
:column-width="100" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget">
|
||||
<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" :column-width="100" @exporting="onExporting"
|
||||
:allow-column-resizing="true" column-resizing-mode="widget">
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
@ -72,8 +73,8 @@ import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
|
||||
import type { Rekap1 } from '@/types/gangguan'
|
||||
import { saveAs } from 'file-saver'
|
||||
import { Workbook } from 'exceljs'
|
||||
|
||||
const data = ref<Rekap1[]>([])
|
||||
import { useQuery } from '@vue/apollo-composable'
|
||||
import gql from 'graphql-tag'
|
||||
|
||||
const onExporting = (e: any) => {
|
||||
if (e.format === 'pdf') {
|
||||
@ -139,10 +140,67 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
console.log(data)
|
||||
}
|
||||
|
||||
const data = ref<any[]>([])
|
||||
const GET_REKAPITULASI_GANGGUAN_RATING_PER_POSKO = gql`
|
||||
query rekapitulasiGangguanRatingPerPosko
|
||||
(
|
||||
$dateFrom: Date!
|
||||
$dateTo: Date!
|
||||
$posko: String!
|
||||
$idUid: Int!
|
||||
$idUp3: Int!
|
||||
) {
|
||||
rekapitulasiGangguanRatingPerPosko
|
||||
(
|
||||
dateFrom: $dateFrom
|
||||
dateTo: $dateTo
|
||||
posko: $posko
|
||||
idUid: $idUid
|
||||
idUp3: $idUp3
|
||||
) {
|
||||
in_process
|
||||
indeks_rating
|
||||
jumlah_non_rating
|
||||
jumlah_rating
|
||||
nama_posko
|
||||
persen_in_process
|
||||
persen_non_rating
|
||||
persen_rating
|
||||
persen_selesai
|
||||
rating_1
|
||||
rating_2
|
||||
rating_3
|
||||
rating_4
|
||||
rating_5
|
||||
regu
|
||||
selesai
|
||||
total
|
||||
}
|
||||
}`;
|
||||
const loadingVisible = ref<boolean>(true)
|
||||
onMounted(() => {
|
||||
createDummy()
|
||||
|
||||
const filters = useFiltersStore()
|
||||
const { onResult, onError } = useQuery(GET_REKAPITULASI_GANGGUAN_RATING_PER_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.rekapitulasiGangguanRatingPerPosko
|
||||
;
|
||||
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',
|
||||
|
||||
@ -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"
|
||||
:column-width="100" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget">
|
||||
<DxSelection mode="single" />
|
||||
@ -62,7 +62,7 @@
|
||||
</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'
|
||||
@ -71,6 +71,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') {
|
||||
@ -107,9 +109,67 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
console.log(data)
|
||||
}
|
||||
|
||||
const data = ref<any[]>([])
|
||||
const GET_REKAPITULASI_GANGGUAN_ALIH_POSKO = gql`
|
||||
query rekapitulasiGangguanRatingPerRegu
|
||||
(
|
||||
$dateFrom: Date!
|
||||
$dateTo: Date!
|
||||
$posko: String!
|
||||
$idUid: Int!
|
||||
$idUp3: Int!
|
||||
) {
|
||||
rekapitulasiGangguanRatingPerRegu
|
||||
(
|
||||
dateFrom: $dateFrom
|
||||
dateTo: $dateTo
|
||||
posko: $posko
|
||||
idUid: $idUid
|
||||
idUp3: $idUp3
|
||||
) {
|
||||
in_process
|
||||
indeks_rating
|
||||
jumlah_non_rating
|
||||
jumlah_rating
|
||||
nama_posko
|
||||
persen_in_process
|
||||
persen_non_rating
|
||||
persen_rating
|
||||
persen_selesai
|
||||
rating_1
|
||||
rating_2
|
||||
rating_3
|
||||
rating_4
|
||||
rating_5
|
||||
regu
|
||||
selesai
|
||||
total
|
||||
}
|
||||
}`;
|
||||
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.rekapitulasiGangguanRatingPerRegu
|
||||
;
|
||||
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
|
||||
|
||||
@ -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"
|
||||
:column-width="100" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget">
|
||||
<DxSelection mode="single" />
|
||||
@ -43,7 +43,7 @@
|
||||
</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'
|
||||
@ -52,6 +52,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') {
|
||||
@ -88,9 +90,65 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
console.log(data)
|
||||
}
|
||||
|
||||
const data = ref<any[]>([])
|
||||
const GET_REKAPITULASI_GANGGUAN_KOREKSI_TRANSAKSI_INDIVIDUAL = gql`
|
||||
query rekapitulasiGangguanKoreksiTransaksiIndividual
|
||||
(
|
||||
$dateFrom: Date!
|
||||
$dateTo: Date!
|
||||
$posko: String!
|
||||
$idUid: Int!
|
||||
$idUp3: Int!
|
||||
) {
|
||||
rekapitulasiGangguanKoreksiTransaksiIndividual
|
||||
(
|
||||
dateFrom: $dateFrom
|
||||
dateTo: $dateTo
|
||||
posko: $posko
|
||||
idUid: $idUid
|
||||
idUp3: $idUp3
|
||||
) {
|
||||
agustus
|
||||
april
|
||||
desember
|
||||
februari
|
||||
januari
|
||||
juli
|
||||
juni
|
||||
maret
|
||||
mei
|
||||
november
|
||||
oktober
|
||||
september
|
||||
uid
|
||||
ulp
|
||||
up3
|
||||
}
|
||||
}`;
|
||||
const loadingVisible = ref<boolean>(true)
|
||||
onMounted(() => {
|
||||
const filters = useFiltersStore()
|
||||
const { onResult, onError } = useQuery(GET_REKAPITULASI_GANGGUAN_KOREKSI_TRANSAKSI_INDIVIDUAL, {
|
||||
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.rekapitulasiGangguanKoreksiTransaksiIndividual
|
||||
;
|
||||
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
|
||||
|
||||
@ -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"
|
||||
:column-width="100" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget">
|
||||
<DxSelection mode="single" />
|
||||
@ -43,7 +43,7 @@
|
||||
</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'
|
||||
@ -52,6 +52,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') {
|
||||
@ -88,9 +90,65 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
console.log(data)
|
||||
}
|
||||
|
||||
const data = ref<any[]>([])
|
||||
const GET_REKAPITULASI_GANGGUAN_ALIH_POSKO = gql`
|
||||
query rekapitulasiGangguanCleansingTransaksiTM
|
||||
(
|
||||
$dateFrom: Date!
|
||||
$dateTo: Date!
|
||||
$posko: String!
|
||||
$idUid: Int!
|
||||
$idUp3: Int!
|
||||
) {
|
||||
rekapitulasiGangguanCleansingTransaksiTM
|
||||
(
|
||||
dateFrom: $dateFrom
|
||||
dateTo: $dateTo
|
||||
posko: $posko
|
||||
idUid: $idUid
|
||||
idUp3: $idUp3
|
||||
) {
|
||||
agustus
|
||||
april
|
||||
desember
|
||||
februari
|
||||
januari
|
||||
juli
|
||||
juni
|
||||
maret
|
||||
mei
|
||||
november
|
||||
oktober
|
||||
september
|
||||
uid
|
||||
ulp
|
||||
up3
|
||||
}
|
||||
}`;
|
||||
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.rekapitulasiGangguanCleansingTransaksiTM
|
||||
;
|
||||
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
|
||||
|
||||
@ -13,30 +13,30 @@
|
||||
<DxColumn css-class="custom-table-column" :width="50" alignment="center"
|
||||
:calculateCellValue="(item:any) => data.findIndex((i)=>i == item)+1" data-type="number" caption="No" />
|
||||
|
||||
<DxColumn css-class="custom-table-column" :width="150" alignment="center" data-field="" caption="No Laporan" />
|
||||
<DxColumn css-class="custom-table-column" :width="150" alignment="center" data-field="" caption="Tgl Lapor" />
|
||||
<DxColumn css-class="custom-table-column" :width="150" alignment="center" data-field=""
|
||||
<DxColumn css-class="custom-table-column" :width="150" alignment="center" data-field="no_laporan" caption="No Laporan" />
|
||||
<DxColumn css-class="custom-table-column" :width="150" alignment="center" data-field="tgl_lapor" caption="Tgl Lapor" />
|
||||
<DxColumn css-class="custom-table-column" :width="150" alignment="center" data-field="tgl_response"
|
||||
caption="Tgl Response" />
|
||||
<DxColumn css-class="custom-table-column" :width="150" alignment="center" data-field=""
|
||||
<DxColumn css-class="custom-table-column" :width="150" alignment="center" data-field="tgl_recovery"
|
||||
caption="Tgl Recovery" />
|
||||
<DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field=""
|
||||
<DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="durasi_response_time"
|
||||
caption="Durasi Response Time" />
|
||||
<DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field=""
|
||||
<DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="durasi_recovery_time"
|
||||
caption="Durasi Recovery Time" />
|
||||
<DxColumn css-class="custom-table-column" :width="150" alignment="center" data-field="" caption="Status" />
|
||||
<DxColumn css-class="custom-table-column" :width="150" alignment="center" data-field=""
|
||||
<DxColumn css-class="custom-table-column" :width="150" alignment="center" data-field="status_akhir" caption="Status" />
|
||||
<DxColumn css-class="custom-table-column" :width="150" alignment="center" data-field="idpel_nometer"
|
||||
caption="IDPEL/NO METER" />
|
||||
<DxColumn css-class="custom-table-column" :width="150" alignment="center" data-field=""
|
||||
<DxColumn css-class="custom-table-column" :width="150" alignment="center" data-field="nama_pelapor"
|
||||
caption="Nama Pelapor" />
|
||||
<DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field=""
|
||||
<DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="alamat_pelapor"
|
||||
caption="Alamat Pelapor" />
|
||||
<DxColumn css-class="custom-table-column" :width="150" alignment="center" data-field=""
|
||||
<DxColumn css-class="custom-table-column" :width="150" alignment="center" data-field="no_telp_pelapor"
|
||||
caption="No Telp Pelapor" />
|
||||
<DxColumn css-class="custom-table-column" :width="150" alignment="center" data-field=""
|
||||
<DxColumn css-class="custom-table-column" :width="150" alignment="center" data-field="keterangan_pelapor"
|
||||
caption="Keterangan Pelapor" />
|
||||
<DxColumn css-class="custom-table-column" :width="150" alignment="center" data-field=""
|
||||
<DxColumn css-class="custom-table-column" :width="150" alignment="center" data-field="media"
|
||||
caption="Sumber Lapor" />
|
||||
<DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="" caption="Posko" />
|
||||
<DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="posko" caption="Posko" />
|
||||
|
||||
</DxDataGrid>
|
||||
</div>
|
||||
|
||||
@ -18,7 +18,7 @@
|
||||
<DxColumn :width="150" alignment="center" data-field="total" data-type="number" caption="Total"
|
||||
:allow-resizing="false" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="total_selesai" caption="Selesai" :allow-resizing="false"
|
||||
css-class="custom-table-column" />
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_selesai" data-type="number" caption="%" :allow-resizing="false"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="total_inproses" data-type="number" caption="In Progress"
|
||||
@ -73,7 +73,6 @@ import { onMounted, ref } from 'vue'
|
||||
import { jsPDF } from 'jspdf'
|
||||
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
||||
import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
|
||||
import type { Rekap1 } from '@/types/gangguan'
|
||||
import { saveAs } from 'file-saver'
|
||||
import { Workbook } from 'exceljs'
|
||||
|
||||
@ -171,8 +170,9 @@ onMounted(() => {
|
||||
loadingVisible.value = true
|
||||
if (queryResult.data != undefined) {
|
||||
queryResult.data.rekapitulasiAllGangguan.forEach((item: any) => {
|
||||
data.value = [...data.value,item,{
|
||||
nama_unit:'-'
|
||||
data.value = [...data.value,{
|
||||
...item,
|
||||
nama_unit: 'UNIT'
|
||||
}];
|
||||
|
||||
})
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user