Update file permissions for multiple files
This commit is contained in:
Eko Haryadi
10
src/components/Pages/Monalisa/Table_36.vue
Normal file → Executable file
10
src/components/Pages/Monalisa/Table_36.vue
Normal file → Executable file
@ -150,11 +150,11 @@ const filterData = (params: any) => {
|
||||
tahunLalu.value = tahun.id - 1;
|
||||
refetch({
|
||||
regional: regional,
|
||||
posko: posko,
|
||||
idUid: idUid ? idUid : 0,
|
||||
idUp3: idUp3 ? idUp3 : 0,
|
||||
bulan: bulan ? bulan : bulanSekarang.value,
|
||||
tahun: bulan ? tahun : tahunSekarang.value
|
||||
posko: posko ? posko.id : "",
|
||||
idUid: idUid ? idUid.id : 0,
|
||||
idUp3: idUp3 ? idUp3.id : 0,
|
||||
bulan: bulan ? bulan.id : bulanSekarang.value,
|
||||
tahun: bulan ? tahun.id : tahunSekarang.value
|
||||
})
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
|
||||
31
src/components/Pages/Monalisa/Table_37.vue
Normal file → Executable file
31
src/components/Pages/Monalisa/Table_37.vue
Normal file → Executable file
@ -24,17 +24,17 @@
|
||||
<DxColumn alignment="center" caption="Jumlah Dispatching Time Gangguan" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="MoM" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan" data-type="number"
|
||||
caption="Des 2018" css-class="custom-table-column" />
|
||||
:caption="`${getMonthName(bulanSekarang)} ${tahunLalu}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan_n_1" data-type="number"
|
||||
caption="Des 2019" css-class="custom-table-column" />
|
||||
:caption="`${getMonthName(bulanSekarang)} ${tahunSekarang}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_bulan" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="YoY" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun" data-type="number"
|
||||
caption="s.d Jan 2018" css-class="custom-table-column" />
|
||||
:caption="`s.d ${ getMonthName(bulanSekarang)} ${tahunLalu}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun_n_1" data-type="number"
|
||||
caption="Jan 2019" css-class="custom-table-column" />
|
||||
:caption="`s.d ${getMonthName(bulanSekarang)} ${tahunSekarang}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_tahun" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
@ -64,12 +64,12 @@ 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 { useSearchStore } from '@/stores/filtersAction'
|
||||
import { usePostsStore } from '@/stores/posts'
|
||||
import { useRegionStore } from '@/stores/region'
|
||||
import { useUp3Store } from '@/stores/up3'
|
||||
const tahunSekarang = ref(new Date().getFullYear())
|
||||
const bulanSekarang = ref(new Date().getMonth())
|
||||
const tahunLalu = ref(tahunSekarang.value - 1)
|
||||
import { useQuery } from '@vue/apollo-composable'
|
||||
import gql from 'graphql-tag'
|
||||
import { getMonthName } from '@/utils/texts'
|
||||
const position = { of: '#data' }
|
||||
const showIndicator = ref(true)
|
||||
const shading = ref(true)
|
||||
@ -77,6 +77,7 @@ const showPane = ref(true)
|
||||
const data = ref<any[]>([])
|
||||
const dataDetail = ref<any>()
|
||||
const showDetail = ref(false)
|
||||
|
||||
const onExporting = (e: any) => {
|
||||
if (e.format === 'pdf') {
|
||||
const doc = new jsPDF()
|
||||
@ -142,14 +143,16 @@ const { onResult, onError, loading, refetch } = useQuery(monalisaDispatchingTime
|
||||
})
|
||||
const filterData = (params: any) => {
|
||||
const { regional, posko, idUid, idUp3, bulan, tahun } = params;
|
||||
|
||||
bulanSekarang.value = bulan.id;
|
||||
tahunSekarang.value = tahun.id;
|
||||
tahunLalu.value = tahun.id - 1;
|
||||
refetch({
|
||||
regional: regional,
|
||||
posko: posko,
|
||||
idUid: idUid ? idUid : 0,
|
||||
idUp3: idUp3 ? idUp3 : 0,
|
||||
bulan: bulan ? bulan : 10,
|
||||
tahun: bulan ? tahun : 2023
|
||||
posko: posko ? posko.id : "",
|
||||
idUid: idUid ? idUid.id : 0,
|
||||
idUp3: idUp3 ? idUp3.id : 0,
|
||||
bulan: bulan ? bulan.id : 10,
|
||||
tahun: bulan ? tahun.id : 2023
|
||||
})
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
|
||||
40
src/components/Pages/Monalisa/Table_38.vue
Normal file → Executable file
40
src/components/Pages/Monalisa/Table_38.vue
Normal file → Executable file
@ -24,17 +24,17 @@
|
||||
<DxColumn alignment="center" caption="Jumlah RCT Kali Gangguan" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="MoM" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan" data-type="number"
|
||||
caption="Des 2018" css-class="custom-table-column" />
|
||||
:caption="`${getMonthName(bulanSekarang)} ${tahunLalu}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan_n_1" data-type="number"
|
||||
caption="Des 2019" css-class="custom-table-column" />
|
||||
:caption="`${getMonthName(bulanSekarang)} ${tahunSekarang}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_bulan" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="YoY" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun" data-type="number"
|
||||
caption="s.d Jan 2018" css-class="custom-table-column" />
|
||||
:caption="`s.d ${getMonthName(bulanSekarang)} ${tahunLalu}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun_n_1" data-type="number"
|
||||
caption="Jan 2019" css-class="custom-table-column" />
|
||||
:caption="`s.d ${getMonthName(bulanSekarang)} ${tahunSekarang}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_tahun" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
@ -55,12 +55,12 @@ 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 { useSearchStore } from '@/stores/filtersAction'
|
||||
import { usePostsStore } from '@/stores/posts'
|
||||
import { useRegionStore } from '@/stores/region'
|
||||
import { useUp3Store } from '@/stores/up3'
|
||||
const tahunSekarang = ref(new Date().getFullYear())
|
||||
const bulanSekarang = ref(new Date().getMonth())
|
||||
const tahunLalu = ref(tahunSekarang.value - 1)
|
||||
import { useQuery } from '@vue/apollo-composable'
|
||||
import gql from 'graphql-tag'
|
||||
import { getMonthName } from '@/utils/texts'
|
||||
const position = { of: '#data' };
|
||||
const showIndicator = ref(true);
|
||||
const shading = ref(true);
|
||||
@ -69,9 +69,9 @@ const data = ref<any[]>([])
|
||||
const dataDetail = ref<any>()
|
||||
const showDetail = ref(false)
|
||||
|
||||
const monalisaRecoveryTimeKeluhan = gql`
|
||||
query DaftarmonalisaRecoveryTimeKeluhan($regional:regional, $posko: String, $idUid: Int, $idUp3: Int,$bulan: Int, $tahun: Int) {
|
||||
monalisaRecoveryTimeKeluhan(
|
||||
const monalisaRecoveryTimeGangguan = gql`
|
||||
query DaftarmonalisaRecoveryTimeGangguan($regional:regional, $posko: String, $idUid: Int, $idUp3: Int,$bulan: Int, $tahun: Int) {
|
||||
monalisaRecoveryTimeGangguan(
|
||||
regional:$regional
|
||||
posko: $posko
|
||||
idUid: $idUid
|
||||
@ -89,7 +89,7 @@ const monalisaRecoveryTimeKeluhan = gql`
|
||||
}
|
||||
}
|
||||
`;
|
||||
const { onResult, onError, loading, refetch } = useQuery(monalisaRecoveryTimeKeluhan, {
|
||||
const { onResult, onError, loading, refetch } = useQuery(monalisaRecoveryTimeGangguan, {
|
||||
regional: "",
|
||||
posko: "",
|
||||
idUid: 0,
|
||||
@ -100,18 +100,20 @@ const { onResult, onError, loading, refetch } = useQuery(monalisaRecoveryTimeKel
|
||||
const filterData = (params: any) => {
|
||||
|
||||
const { regional, posko, idUid, idUp3, bulan, tahun } = params;
|
||||
|
||||
bulanSekarang.value = bulan.id;
|
||||
tahunSekarang.value = tahun.id;
|
||||
tahunLalu.value = tahun.id - 1;
|
||||
refetch({
|
||||
regional: regional,
|
||||
posko: posko,
|
||||
idUid: idUid ? idUid : 0,
|
||||
idUp3: idUp3 ? idUp3 : 0,
|
||||
bulan: bulan ? bulan : 10,
|
||||
tahun: bulan ? tahun : 2023
|
||||
posko: posko ? posko.id : "",
|
||||
idUid: idUid ? idUid.id : 0,
|
||||
idUp3: idUp3 ? idUp3.id : 0,
|
||||
bulan: bulan ? bulan.id : 10,
|
||||
tahun: bulan ? tahun.id : 2023
|
||||
})
|
||||
onResult(queryResult => {
|
||||
if (queryResult.data != undefined) {
|
||||
queryResult.data.monalisaRecoveryTimeKeluhan.forEach((item: any) => {
|
||||
queryResult.data.monalisaRecoveryTimeGangguan.forEach((item: any) => {
|
||||
data.value = [...data.value, {
|
||||
...item,
|
||||
}];
|
||||
|
||||
30
src/components/Pages/Monalisa/Table_39.vue
Normal file → Executable file
30
src/components/Pages/Monalisa/Table_39.vue
Normal file → Executable file
@ -24,17 +24,17 @@
|
||||
<DxColumn alignment="center" caption="Jumlah RPT Kali Gangguan" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="MoM" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan" data-type="number"
|
||||
caption="Des 2018" css-class="custom-table-column" />
|
||||
:caption="`${getMonthName(bulanSekarang)} ${tahunLalu}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan_n_1" data-type="number"
|
||||
caption="Des 2019" css-class="custom-table-column" />
|
||||
:caption="`${getMonthName(bulanSekarang)} ${tahunSekarang}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_bulan" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="YoY" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun" data-type="number"
|
||||
caption="s.d Jan 2018" css-class="custom-table-column" />
|
||||
:caption="`s.d ${getMonthName(bulanSekarang)} ${tahunLalu}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun_n_1" data-type="number"
|
||||
caption="Jan 2019" css-class="custom-table-column" />
|
||||
:caption="`s.d ${getMonthName(bulanSekarang)} ${tahunSekarang}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_tahun" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
@ -65,11 +65,11 @@ import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
|
||||
import { saveAs } from 'file-saver'
|
||||
import { Workbook } from 'exceljs'
|
||||
import gql from 'graphql-tag'
|
||||
import { useSearchStore } from '@/stores/filtersAction'
|
||||
import { usePostsStore } from '@/stores/posts'
|
||||
import { useRegionStore } from '@/stores/region'
|
||||
import { useUp3Store } from '@/stores/up3'
|
||||
const tahunSekarang = ref(new Date().getFullYear())
|
||||
const bulanSekarang = ref(new Date().getMonth())
|
||||
const tahunLalu = ref(tahunSekarang.value - 1)
|
||||
import { useQuery } from '@vue/apollo-composable'
|
||||
import { getMonthName } from '@/utils/texts'
|
||||
const position = { of: '#data' }
|
||||
const showIndicator = ref(true)
|
||||
const shading = ref(true)
|
||||
@ -114,14 +114,16 @@ const { onResult, onError, loading, refetch } = useQuery(monalisaResponseTimeKel
|
||||
})
|
||||
const filterData = (params: any) => {
|
||||
const { regional, posko, idUid, idUp3, bulan, tahun } = params;
|
||||
|
||||
bulanSekarang.value = bulan.id;
|
||||
tahunSekarang.value = tahun.id;
|
||||
tahunLalu.value = tahun.id - 1;
|
||||
refetch({
|
||||
regional: regional,
|
||||
posko: posko,
|
||||
idUid: idUid ? idUid : 0,
|
||||
idUp3: idUp3 ? idUp3 : 0,
|
||||
bulan: bulan ? bulan : 10,
|
||||
tahun: bulan ? tahun : 2023
|
||||
posko: posko ? posko.id : "",
|
||||
idUid: idUid ? idUid.id : 0,
|
||||
idUp3: idUp3 ? idUp3.id : 0,
|
||||
bulan: bulan ? bulan.id : 10,
|
||||
tahun: bulan ? tahun.id : 2023
|
||||
})
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
|
||||
17
src/components/Pages/Monalisa/Table_40.vue
Normal file → Executable file
17
src/components/Pages/Monalisa/Table_40.vue
Normal file → Executable file
@ -100,10 +100,9 @@ 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 { useSearchStore } from '@/stores/filtersAction'
|
||||
import { usePostsStore } from '@/stores/posts'
|
||||
import { useRegionStore } from '@/stores/region'
|
||||
import { useUp3Store } from '@/stores/up3'
|
||||
const tahunSekarang = ref(new Date().getFullYear())
|
||||
const bulanSekarang = ref(new Date().getMonth())
|
||||
const tahunLalu = ref(tahunSekarang.value - 1)
|
||||
import { useQuery } from '@vue/apollo-composable'
|
||||
import gql from 'graphql-tag'
|
||||
const position = { of: '#data' }
|
||||
@ -159,11 +158,11 @@ const filterData = (params: any) => {
|
||||
|
||||
refetch({
|
||||
regional: regional,
|
||||
posko: posko,
|
||||
idUid: idUid ? idUid : 0,
|
||||
idUp3: idUp3 ? idUp3 : 0,
|
||||
bulan: bulan ? bulan : 10,
|
||||
tahun: bulan ? tahun : 2023
|
||||
posko: posko ? posko.id : "",
|
||||
idUid: idUid ? idUid.id : 0,
|
||||
idUp3: idUp3 ? idUp3.id : 0,
|
||||
bulan: bulan ? bulan.id : 10,
|
||||
tahun: bulan ? tahun.id : 2023
|
||||
})
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
|
||||
17
src/components/Pages/Monalisa/Table_41.vue
Normal file → Executable file
17
src/components/Pages/Monalisa/Table_41.vue
Normal file → Executable file
@ -54,10 +54,9 @@ 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 { useSearchStore } from '@/stores/filtersAction'
|
||||
import { usePostsStore } from '@/stores/posts'
|
||||
import { useRegionStore } from '@/stores/region'
|
||||
import { useUp3Store } from '@/stores/up3'
|
||||
const tahunSekarang = ref(new Date().getFullYear())
|
||||
const bulanSekarang = ref(new Date().getMonth())
|
||||
const tahunLalu = ref(tahunSekarang.value - 1)
|
||||
import { useQuery } from '@vue/apollo-composable'
|
||||
import gql from 'graphql-tag'
|
||||
const position = { of: '#data' }
|
||||
@ -104,11 +103,11 @@ const filterData = (params: any) => {
|
||||
|
||||
refetch({
|
||||
regional: regional,
|
||||
posko: posko,
|
||||
idUid: idUid ? idUid : 0,
|
||||
idUp3: idUp3 ? idUp3 : 0,
|
||||
bulan: bulan ? bulan : 10,
|
||||
tahun: bulan ? tahun : 2023
|
||||
posko: posko ? posko.id : "",
|
||||
idUid: idUid ? idUid.id : 0,
|
||||
idUp3: idUp3 ? idUp3.id : 0,
|
||||
bulan: bulan ? bulan.id : 10,
|
||||
tahun: bulan ? tahun.id : 2023
|
||||
})
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
|
||||
30
src/components/Pages/Monalisa/Table_42.vue
Normal file → Executable file
30
src/components/Pages/Monalisa/Table_42.vue
Normal file → Executable file
@ -24,17 +24,17 @@
|
||||
<DxColumn alignment="center" caption="Lapor Ulang Gangguan" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="MoM" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan" data-type="number"
|
||||
caption="Des 2018" css-class="custom-table-column" />
|
||||
:caption="`${getMonthName(bulanSekarang)} ${tahunLalu}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan_n_1" data-type="number"
|
||||
caption="Des 2019" css-class="custom-table-column" />
|
||||
:caption="`${getMonthName(bulanSekarang)} ${tahunSekarang}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_bulan" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="YoY" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun" data-type="number"
|
||||
caption="s.d Jan 2018" css-class="custom-table-column" />
|
||||
:caption="`s.d ${ getMonthName(bulanSekarang)} ${tahunLalu}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun_n_1" data-type="number"
|
||||
caption="Jan 2019" css-class="custom-table-column" />
|
||||
:caption="`s.d ${getMonthName(bulanSekarang)} ${tahunSekarang}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_tahun" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
@ -64,12 +64,12 @@ 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 { useSearchStore } from '@/stores/filtersAction'
|
||||
import { usePostsStore } from '@/stores/posts'
|
||||
import { useRegionStore } from '@/stores/region'
|
||||
import { useUp3Store } from '@/stores/up3'
|
||||
const tahunSekarang = ref(new Date().getFullYear())
|
||||
const bulanSekarang = ref(new Date().getMonth())
|
||||
const tahunLalu = ref(tahunSekarang.value - 1)
|
||||
import { useQuery } from '@vue/apollo-composable'
|
||||
import gql from 'graphql-tag'
|
||||
import { getMonthName } from '@/utils/texts'
|
||||
const position = { of: '#data' }
|
||||
const showIndicator = ref(true)
|
||||
const shading = ref(true)
|
||||
@ -114,14 +114,16 @@ const { onResult, onError, loading, refetch } = useQuery(monalisaRekapitulasiLap
|
||||
})
|
||||
const filterData = (params: any) => {
|
||||
const { regional, posko, idUid, idUp3, bulan, tahun } = params;
|
||||
|
||||
bulanSekarang.value = bulan.id;
|
||||
tahunSekarang.value = tahun.id;
|
||||
tahunLalu.value = tahun.id - 1;
|
||||
refetch({
|
||||
regional: regional,
|
||||
posko: posko,
|
||||
idUid: idUid ? idUid : 0,
|
||||
idUp3: idUp3 ? idUp3 : 0,
|
||||
bulan: bulan ? bulan : 10,
|
||||
tahun: bulan ? tahun : 2023
|
||||
posko: posko ? posko.id : "",
|
||||
idUid: idUid ? idUid.id : 0,
|
||||
idUp3: idUp3 ? idUp3.id : 0,
|
||||
bulan: bulan ? bulan.id : 10,
|
||||
tahun: bulan ? tahun.id : 2023
|
||||
})
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
|
||||
30
src/components/Pages/Monalisa/Table_43.vue
Normal file → Executable file
30
src/components/Pages/Monalisa/Table_43.vue
Normal file → Executable file
@ -24,17 +24,17 @@
|
||||
<DxColumn alignment="center" caption="ENS Gangguan" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="MoM" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan" data-type="number"
|
||||
caption="Des 2018" css-class="custom-table-column" />
|
||||
:caption="`${getMonthName(bulanSekarang)} ${tahunLalu}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan_n_1" data-type="number"
|
||||
caption="Des 2019" css-class="custom-table-column" />
|
||||
:caption="`${getMonthName(bulanSekarang)} ${tahunSekarang}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_bulan" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="YoY" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun" data-type="number"
|
||||
caption="s.d Jan 2018" css-class="custom-table-column" />
|
||||
:caption="`s.d ${ getMonthName(bulanSekarang)} ${tahunLalu}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun_n_1" data-type="number"
|
||||
caption="Jan 2019" css-class="custom-table-column" />
|
||||
:caption="`s.d ${getMonthName(bulanSekarang)} ${tahunSekarang}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_tahun" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
@ -64,12 +64,12 @@ 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 { useSearchStore } from '@/stores/filtersAction'
|
||||
import { usePostsStore } from '@/stores/posts'
|
||||
import { useRegionStore } from '@/stores/region'
|
||||
import { useUp3Store } from '@/stores/up3'
|
||||
const tahunSekarang = ref(new Date().getFullYear())
|
||||
const bulanSekarang = ref(new Date().getMonth())
|
||||
const tahunLalu = ref(tahunSekarang.value - 1)
|
||||
import { useQuery } from '@vue/apollo-composable'
|
||||
import gql from 'graphql-tag'
|
||||
import { getMonthName } from '@/utils/texts'
|
||||
const position = { of: '#data' }
|
||||
const showIndicator = ref(true)
|
||||
const shading = ref(true)
|
||||
@ -114,14 +114,16 @@ const { onResult, onError, loading, refetch } = useQuery(monalisaRekapitulasiEns
|
||||
})
|
||||
const filterData = (params: any) => {
|
||||
const {regional, posko, idUid, idUp3, bulan, tahun} = params;
|
||||
|
||||
bulanSekarang.value = bulan.id;
|
||||
tahunSekarang.value = tahun.id;
|
||||
tahunLalu.value = tahun.id - 1;
|
||||
refetch({
|
||||
regional: regional,
|
||||
posko: posko,
|
||||
idUid: idUid ? idUid : 0,
|
||||
idUp3: idUp3 ? idUp3 : 0,
|
||||
bulan: bulan ? bulan : 10,
|
||||
tahun: bulan ? tahun : 2023
|
||||
posko: posko ? posko.id : "",
|
||||
idUid: idUid ? idUid.id : 0,
|
||||
idUp3: idUp3 ? idUp3.id : 0,
|
||||
bulan: bulan ? bulan.id : 10,
|
||||
tahun: bulan ? tahun.id : 2023
|
||||
})
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
|
||||
59
src/components/Pages/Monalisa/Table_44.vue
Normal file → Executable file
59
src/components/Pages/Monalisa/Table_44.vue
Normal file → Executable file
@ -12,19 +12,19 @@
|
||||
<DxSelection mode="single" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
<DxLoadPanel :position="position" :show-indicator="showIndicator" :show-pane="showPane" :shading="shading"
|
||||
v-if="loading" v-model:visible="loading" :enabled="true" />
|
||||
<DxLoadPanel :position="position" :show-indicator="showIndicator" :show-pane="showPane" :shading="shading"
|
||||
v-if="loading" v-model:visible="loading" :enabled="true" />
|
||||
<DxSearchPanel :visible="true" :highlight-case-sensitive="true" />
|
||||
<DxExport :enabled="true" :formats="['pdf', 'xlsx', 'document']" :allow-export-selected-data="false" />
|
||||
<DxColumnFixing :enabled="true" />
|
||||
|
||||
<DxColumn alignment="center" data-field="" caption="Nama Unit" css-class="custom-table-column" />
|
||||
<DxColumn alignment="center" data-field="nama_posko" caption="Nama Unit" css-class="custom-table-column" />
|
||||
<DxColumn alignment="center" caption="Tahun" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="Gangguan"
|
||||
<DxColumn :width="150" alignment="center" data-field="gangguan" data-type="number" caption="Gangguan"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="Informasi"
|
||||
<DxColumn :width="150" alignment="center" data-field="informasi" data-type="number" caption="Informasi"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="Total"
|
||||
<DxColumn :width="150" alignment="center" data-field="total" data-type="number" caption="Total"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
</DxDataGrid>
|
||||
@ -34,8 +34,7 @@
|
||||
<script setup lang="ts">
|
||||
import Filters from '@/components/Form/Filters.vue'
|
||||
import Type2 from '@/components/Form/FiltersType/Type2.vue'
|
||||
import { computed, onMounted, ref, watch } from 'vue'
|
||||
import { useFiltersStore } from '@/stores/filters'
|
||||
import {ref} from 'vue'
|
||||
import { DxDataGrid } from 'devextreme-vue'
|
||||
import {
|
||||
DxColumn,
|
||||
@ -52,10 +51,9 @@ 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 { useSearchStore } from '@/stores/filtersAction'
|
||||
import { usePostsStore } from '@/stores/posts'
|
||||
import { useRegionStore } from '@/stores/region'
|
||||
import { useUp3Store } from '@/stores/up3'
|
||||
const tahunSekarang = ref(new Date().getFullYear())
|
||||
const bulanSekarang = ref(new Date().getMonth())
|
||||
const tahunLalu = ref(tahunSekarang.value - 1)
|
||||
import { useQuery } from '@vue/apollo-composable'
|
||||
import gql from 'graphql-tag'
|
||||
const position = { of: '#data' }
|
||||
@ -82,35 +80,34 @@ const monalisaGangguanBelumSelesai = gql`
|
||||
bulan: $bulan
|
||||
tahun: $tahun
|
||||
) {
|
||||
jumlah_bulan
|
||||
jumlah_bulan_n_1
|
||||
jumlah_tahun
|
||||
jumlah_tahun_n_1
|
||||
nama_posko
|
||||
persen_bulan
|
||||
persen_tahun
|
||||
gangguan
|
||||
informasi
|
||||
nama_posko
|
||||
total
|
||||
}
|
||||
}
|
||||
`
|
||||
const { onResult, onError, loading, refetch } = useQuery(monalisaGangguanBelumSelesai, {
|
||||
bulan: 10,
|
||||
tahun: 2023,
|
||||
|
||||
regional: '',
|
||||
posko: '',
|
||||
idUid: 0,
|
||||
idUp3: 0
|
||||
idUp3: 0,
|
||||
bulan: 10,
|
||||
tahun: 2023,
|
||||
})
|
||||
const filterData = (params: any) => {
|
||||
const posko = usePostsStore().getData() ? usePostsStore().getData() : ''
|
||||
const up3 = useUp3Store().getData() ? useUp3Store().getData() : 0
|
||||
const uid = useRegionStore().getData() ? useRegionStore().getData() : 0
|
||||
const { regional, posko, idUid, idUp3, bulan, tahun } = params;
|
||||
bulanSekarang.value = bulan.id;
|
||||
tahunSekarang.value = tahun.id;
|
||||
tahunLalu.value = tahun.id - 1;
|
||||
refetch({
|
||||
bulan: 10,
|
||||
tahun: 2023,
|
||||
regional: '',
|
||||
posko: posko,
|
||||
idUid: uid,
|
||||
idUp3: up3
|
||||
regional: regional,
|
||||
posko: posko ? posko.id : "",
|
||||
idUid: idUid ? idUid.id : 0,
|
||||
idUp3: idUp3 ? idUp3.id : 0,
|
||||
bulan: bulan ? bulan.id : 10,
|
||||
tahun: bulan ? tahun.id : 2023
|
||||
})
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
|
||||
102
src/components/Pages/Monalisa/Table_45.vue
Normal file → Executable file
102
src/components/Pages/Monalisa/Table_45.vue
Normal file → Executable file
@ -6,7 +6,7 @@
|
||||
" />
|
||||
</Filters>
|
||||
<div id="data">
|
||||
<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">
|
||||
@ -22,18 +22,18 @@
|
||||
<DxColumn :width="200" alignment="center" data-field="nama_posko" caption="Nama Unit" css-class="custom-table-column" />
|
||||
<DxColumn alignment="center" caption="Jumlah Kali Gangguan" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="MoM" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan" data-type="number" caption="Des 2018"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan_n_1" data-type="number" caption="Des 2019"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan" data-type="number"
|
||||
:caption="`${getMonthName(bulanSekarang)} ${tahunLalu}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan_n_1" data-type="number"
|
||||
:caption="`${getMonthName(bulanSekarang)} ${tahunSekarang}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_bulan" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="YoY" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun" data-type="number" caption="s.d Jan 2018"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun_n_1" data-type="number" caption="Jan 2019"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun" data-type="number"
|
||||
:caption="`s.d ${ getMonthName(bulanSekarang)} ${tahunLalu}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun_n_1" data-type="number"
|
||||
:caption="`s.d ${getMonthName(bulanSekarang)} ${tahunSekarang}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_tahun" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
@ -45,7 +45,7 @@
|
||||
<script setup lang="ts">
|
||||
import Filters from '@/components/Form/Filters.vue'
|
||||
import Type2 from '@/components/Form/FiltersType/Type2.vue'
|
||||
import { ref } 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'
|
||||
@ -54,7 +54,14 @@ 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'
|
||||
import { getMonthName } from '@/utils/texts'
|
||||
const position = { of: '#data' }
|
||||
const showIndicator = ref(true)
|
||||
const shading = ref(true)
|
||||
const showPane = ref(true)
|
||||
const data = ref<any[]>([])
|
||||
const onExporting = (e: any) => {
|
||||
if (e.format === 'pdf') {
|
||||
const doc = new jsPDF()
|
||||
@ -84,12 +91,77 @@ const onExporting = (e: any) => {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
const tahunSekarang = ref(new Date().getFullYear())
|
||||
const bulanSekarang = ref(new Date().getMonth())
|
||||
const tahunLalu = ref(tahunSekarang.value - 1)
|
||||
const MONALISAJUMLAHKALIKELUHAN = gql`
|
||||
query DaftarMonalisaJumlahKaliKeluhan(
|
||||
$regional: String
|
||||
$posko: String
|
||||
$idUid: Int
|
||||
$idUp3: Int
|
||||
$bulan: Int
|
||||
$tahun: Int
|
||||
) {
|
||||
monalisaJumlahKaliKeluhan(
|
||||
regional: $regional
|
||||
posko: $posko
|
||||
idUid: $idUid
|
||||
idUp3: $idUp3
|
||||
bulan: $bulan
|
||||
tahun: $tahun
|
||||
) {
|
||||
jumlah_bulan
|
||||
jumlah_bulan_n_1
|
||||
jumlah_tahun
|
||||
jumlah_tahun_n_1
|
||||
nama_posko
|
||||
persen_bulan
|
||||
persen_tahun
|
||||
}
|
||||
}
|
||||
`
|
||||
const { onResult, onError, loading, refetch } = useQuery(MONALISAJUMLAHKALIKELUHAN, {
|
||||
regional: '',
|
||||
posko: '',
|
||||
idUid: 0,
|
||||
idUp3: 0,
|
||||
bulan: bulanSekarang.value,
|
||||
tahun: tahunSekarang.value
|
||||
})
|
||||
|
||||
const filterData = (params: any) => {
|
||||
const {regional, posko, idUid, idUp3, bulan, tahun} = params;
|
||||
bulanSekarang.value = bulan.id;
|
||||
tahunSekarang.value = tahun.id;
|
||||
tahunLalu.value = tahun.id - 1;
|
||||
refetch({
|
||||
regional: regional,
|
||||
posko: posko ? posko.id : "",
|
||||
idUid: idUid ? idUid.id : 0,
|
||||
idUp3: idUp3 ? idUp3.id : 0,
|
||||
bulan: bulan ? bulan.id : bulanSekarang.value,
|
||||
tahun: bulan ? tahun.id : tahunSekarang.value
|
||||
})
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
data.value = queryResult.data.monalisaJumlahKaliKeluhan;
|
||||
}
|
||||
console.log(queryResult.data)
|
||||
console.log(queryResult.loading)
|
||||
console.log(queryResult.networkStatus)
|
||||
})
|
||||
onError((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
}
|
||||
const onSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
const data = selectedRowsData[0]
|
||||
console.log(data)
|
||||
}
|
||||
const filterData = (params: any) => {
|
||||
console.log(params)
|
||||
}
|
||||
const filters = ref()
|
||||
onMounted(() => {
|
||||
console.log(bulanSekarang.value)
|
||||
});
|
||||
const filters= ref();
|
||||
</script>
|
||||
112
src/components/Pages/Monalisa/Table_46.vue
Normal file → Executable file
112
src/components/Pages/Monalisa/Table_46.vue
Normal file → Executable file
@ -6,34 +6,35 @@
|
||||
" />
|
||||
</Filters>
|
||||
<div id="data">
|
||||
<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" />
|
||||
<DxLoadPanel :position="position" :show-indicator="showIndicator" :show-pane="showPane" :shading="shading"
|
||||
v-if="loading" v-model:visible="loading" :enabled="true" />
|
||||
<DxLoadPanel :position="position" :show-indicator="showIndicator" :show-pane="showPane" :shading="shading"
|
||||
v-if="loading" v-model:visible="loading" :enabled="true" />
|
||||
<DxSearchPanel :visible="true" :highlight-case-sensitive="true" />
|
||||
<DxExport :enabled="true" :formats="['pdf', 'xlsx', 'document']" :allow-export-selected-data="false" />
|
||||
<DxColumnFixing :enabled="true" />
|
||||
|
||||
<DxColumn :width="200" alignment="center" data-field="nama_posko" caption="Nama Unit" css-class="custom-table-column" />
|
||||
<DxColumn :width="200" alignment="center" data-field="nama_posko" caption="Nama Unit"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn alignment="center" caption="Jumlah RCT Kali Keluhan" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="MoM" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan" data-type="number" caption="Des 2018"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan_n_1" data-type="number" caption="Des 2019"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan" data-type="number"
|
||||
:caption="`${getMonthName(bulanSekarang)} ${tahunLalu}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan_n_1" data-type="number"
|
||||
:caption="`${getMonthName(bulanSekarang)} ${tahunSekarang}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_bulan" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="YoY" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun" data-type="number" caption="s.d Jan 2018"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun_n_1" data-type="number" caption="Jan 2019"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun" data-type="number"
|
||||
:caption="`s.d ${getMonthName(bulanSekarang)} ${tahunLalu}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun_n_1" data-type="number"
|
||||
:caption="`s.d ${getMonthName(bulanSekarang)} ${tahunSekarang}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_tahun" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
@ -46,7 +47,6 @@
|
||||
import Filters from '@/components/Form/Filters.vue'
|
||||
import Type2 from '@/components/Form/FiltersType/Type2.vue'
|
||||
import { 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'
|
||||
import { jsPDF } from 'jspdf'
|
||||
@ -54,14 +54,19 @@ 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'
|
||||
import { getMonthName } from '@/utils/texts'
|
||||
const position = { of: '#data' }
|
||||
const showIndicator = ref(true)
|
||||
const shading = ref(true)
|
||||
const showPane = ref(true)
|
||||
const data = ref<any[]>([])
|
||||
const tahunSekarang = ref(new Date().getFullYear())
|
||||
const bulanSekarang = ref(new Date().getMonth())
|
||||
const tahunLalu = ref(tahunSekarang.value - 1)
|
||||
const dataDetail = ref<any>()
|
||||
const showDetail = ref(false)
|
||||
const loading = ref(false)
|
||||
const onExporting = (e: any) => {
|
||||
if (e.format === 'pdf') {
|
||||
const doc = new jsPDF()
|
||||
@ -90,14 +95,77 @@ const onExporting = (e: any) => {
|
||||
e.cancel = true
|
||||
}
|
||||
}
|
||||
|
||||
const monalisaDispatchingTimeKeluhan = gql`
|
||||
query DaftarmonalisaDispatchingTimeKeluhan(
|
||||
$regional: String
|
||||
$posko: String
|
||||
$idUid: Int
|
||||
$idUp3: Int
|
||||
$bulan: Int
|
||||
$tahun: Int
|
||||
) {
|
||||
monalisaDispatchingTimeKeluhan(
|
||||
regional: $regional
|
||||
posko: $posko
|
||||
idUid: $idUid
|
||||
idUp3: $idUp3
|
||||
bulan: $bulan
|
||||
tahun: $tahun
|
||||
) {
|
||||
jumlah_bulan
|
||||
jumlah_bulan_n_1
|
||||
jumlah_tahun
|
||||
jumlah_tahun_n_1
|
||||
nama_posko
|
||||
persen_bulan
|
||||
persen_tahun
|
||||
}
|
||||
}
|
||||
`
|
||||
const { onResult, onError, loading, refetch } = useQuery(monalisaDispatchingTimeKeluhan, {
|
||||
regional: '',
|
||||
posko: '',
|
||||
idUid: 0,
|
||||
idUp3: 0,
|
||||
bulan: 10,
|
||||
tahun: 2023
|
||||
})
|
||||
const filterData = (params: any) => {
|
||||
const { regional, posko, idUid, idUp3, bulan, tahun } = params;
|
||||
bulanSekarang.value = bulan.id;
|
||||
tahunSekarang.value = tahun.id;
|
||||
tahunLalu.value = tahun.id - 1;
|
||||
refetch({
|
||||
regional: regional,
|
||||
posko: posko ? posko.id : "",
|
||||
idUid: idUid ? idUid.id : 0,
|
||||
idUp3: idUp3 ? idUp3.id : 0,
|
||||
bulan: bulan ? bulan.id : 10,
|
||||
tahun: bulan ? tahun.id : 2023
|
||||
})
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
queryResult.data.monalisaDispatchingTimeKeluhan.forEach((item: any) => {
|
||||
data.value = [
|
||||
...data.value,
|
||||
{
|
||||
...item
|
||||
}
|
||||
]
|
||||
})
|
||||
}
|
||||
console.log(queryResult.data)
|
||||
console.log(queryResult.loading)
|
||||
console.log(queryResult.networkStatus)
|
||||
})
|
||||
onError((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
}
|
||||
const onSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
const data = selectedRowsData[0]
|
||||
console.log(data)
|
||||
}
|
||||
const filterData = (params:any) =>
|
||||
{
|
||||
console.log(params)
|
||||
}
|
||||
|
||||
const filters = ref()
|
||||
</script>
|
||||
86
src/components/Pages/Monalisa/Table_47.vue
Normal file → Executable file
86
src/components/Pages/Monalisa/Table_47.vue
Normal file → Executable file
@ -22,18 +22,18 @@
|
||||
<DxColumn :width="200" alignment="center" data-field="nama_posko" caption="Nama Unit" css-class="custom-table-column" />
|
||||
<DxColumn alignment="center" caption="Jumlah RPT Kali Keluhan" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="MoM" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan" data-type="number" caption="Des 2018"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan_n_1" data-type="number" caption="Des 2019"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan" data-type="number"
|
||||
:caption="`${getMonthName(bulanSekarang)} ${tahunLalu}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan_n_1" data-type="number"
|
||||
:caption="`${getMonthName(bulanSekarang)} ${tahunSekarang}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_bulan" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="YoY" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun" data-type="number" caption="s.d Jan 2018"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun_n_1" data-type="number" caption="Jan 2019"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun" data-type="number"
|
||||
:caption="`s.d ${getMonthName(bulanSekarang)} ${tahunLalu}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun_n_1" data-type="number"
|
||||
:caption="`s.d ${getMonthName(bulanSekarang)} ${tahunSekarang}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_tahun" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
@ -53,6 +53,9 @@ 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'
|
||||
import { getMonthName } from '@/utils/texts'
|
||||
const position = { of: '#data' }
|
||||
const showIndicator = ref(true)
|
||||
const shading = ref(true)
|
||||
@ -60,7 +63,9 @@ const showPane = ref(true)
|
||||
const data = ref<any[]>([])
|
||||
const dataDetail = ref<any>()
|
||||
const showDetail = ref(false)
|
||||
const loading = ref(false)
|
||||
const tahunSekarang = ref(new Date().getFullYear())
|
||||
const bulanSekarang = ref(new Date().getMonth())
|
||||
const tahunLalu = ref(tahunSekarang.value - 1)
|
||||
const onExporting = (e: any) => {
|
||||
if (e.format === 'pdf') {
|
||||
const doc = new jsPDF()
|
||||
@ -89,14 +94,69 @@ const onExporting = (e: any) => {
|
||||
e.cancel = true
|
||||
}
|
||||
}
|
||||
const monalisaRecoveryTimeKeluhan = gql`
|
||||
query DaftarmonalisaRecoveryTimeKeluhan($regional:regional, $posko: String, $idUid: Int, $idUp3: Int,$bulan: Int, $tahun: Int) {
|
||||
monalisaRecoveryTimeKeluhan(
|
||||
regional:$regional
|
||||
posko: $posko
|
||||
idUid: $idUid
|
||||
idUp3: $idUp3
|
||||
bulan: $bulan
|
||||
tahun: $tahun
|
||||
) {
|
||||
jumlah_bulan
|
||||
jumlah_bulan_n_1
|
||||
jumlah_tahun
|
||||
jumlah_tahun_n_1
|
||||
nama_posko
|
||||
persen_bulan
|
||||
persen_tahun
|
||||
}
|
||||
}
|
||||
`;
|
||||
const { onResult, onError, loading, refetch } = useQuery(monalisaRecoveryTimeKeluhan, {
|
||||
regional: "",
|
||||
posko: "",
|
||||
idUid: 0,
|
||||
idUp3: 0,
|
||||
bulan: 10,
|
||||
tahun: 2023,
|
||||
})
|
||||
const filterData = (params: any) => {
|
||||
|
||||
const { regional, posko, idUid, idUp3, bulan, tahun } = params;
|
||||
bulanSekarang.value = bulan.id;
|
||||
tahunSekarang.value = tahun.id;
|
||||
tahunLalu.value = tahun.id - 1;
|
||||
refetch({
|
||||
regional: regional,
|
||||
posko: posko ? posko.id : "",
|
||||
idUid: idUid ? idUid.id : 0,
|
||||
idUp3: idUp3 ? idUp3.id : 0,
|
||||
bulan: bulan ? bulan.id : 10,
|
||||
tahun: bulan ? tahun.id : 2023
|
||||
})
|
||||
onResult(queryResult => {
|
||||
if (queryResult.data != undefined) {
|
||||
queryResult.data.monalisaRecoveryTimeKeluhan.forEach((item: any) => {
|
||||
data.value = [...data.value, {
|
||||
...item,
|
||||
}];
|
||||
});
|
||||
}
|
||||
console.log(queryResult.data)
|
||||
console.log(queryResult.loading)
|
||||
console.log(queryResult.networkStatus)
|
||||
})
|
||||
onError((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
}
|
||||
|
||||
const onSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
const data = selectedRowsData[0]
|
||||
console.log(data)
|
||||
}
|
||||
const filterData = (params:any) =>
|
||||
{
|
||||
console.log(params)
|
||||
}
|
||||
|
||||
const filters = ref()
|
||||
</script>
|
||||
96
src/components/Pages/Monalisa/Table_48.vue
Normal file → Executable file
96
src/components/Pages/Monalisa/Table_48.vue
Normal file → Executable file
@ -6,7 +6,7 @@
|
||||
" />
|
||||
</Filters>
|
||||
<div id="data">
|
||||
<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">
|
||||
@ -26,11 +26,11 @@
|
||||
<DxColumn :width="150" alignment="center" caption="a" data-type="number" data-field=""
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Jumlah Gangguan" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Jumlah Keluhan" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="b" data-type="number" data-field=""
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="RPT Gangguan" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="RPT Keluhan" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="c=a/b" data-type="number" data-field=""
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
@ -38,11 +38,11 @@
|
||||
<DxColumn :width="150" alignment="center" caption="d" data-type="number" data-field=""
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Jumlah Gangguan" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Jumlah Keluhan" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="e" data-type="number" data-field=""
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="RCT Gangguan" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="RCT Keluhan" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="f=d/e" data-type="number" data-field=""
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
@ -52,11 +52,11 @@
|
||||
<DxColumn :width="150" alignment="center" caption="a" data-type="number" data-field=""
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Jumlah Gangguan" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Jumlah Keluhan" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="b" data-type="number" data-field=""
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="RPT Gangguan" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="RPT Keluhan" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="c=a/b" data-type="number" data-field=""
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
@ -64,11 +64,11 @@
|
||||
<DxColumn :width="150" alignment="center" caption="d" data-type="number" data-field=""
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="Jumlah Gangguan" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="Jumlah Keluhan" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="e" data-type="number" data-field=""
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="RCT Gangguan" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="RCT Keluhan" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" caption="f=d/e" data-type="number" data-field=""
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
@ -89,6 +89,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 position = { of: '#data' }
|
||||
const showIndicator = ref(true)
|
||||
const shading = ref(true)
|
||||
@ -96,7 +98,7 @@ const showPane = ref(true)
|
||||
const data = ref<any[]>([])
|
||||
const dataDetail = ref<any>()
|
||||
const showDetail = ref(false)
|
||||
const loading = ref(false)
|
||||
|
||||
const onExporting = (e: any) => {
|
||||
if (e.format === 'pdf') {
|
||||
const doc = new jsPDF()
|
||||
@ -130,9 +132,77 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
const data = selectedRowsData[0]
|
||||
console.log(data)
|
||||
}
|
||||
const filterData = (params:any) =>
|
||||
{
|
||||
console.log(params)
|
||||
const monalisaJumlahDurasiRptRctKeluhan = gql`
|
||||
query DaftarmonalisaJumlahDurasiRptRctKeluhan(
|
||||
$regional: String
|
||||
$posko: String
|
||||
$idUid: Int
|
||||
$idUp3: Int
|
||||
$bulan: Int
|
||||
$tahun: Int
|
||||
) {
|
||||
monalisaJumlahDurasiRptRctKeluhan(
|
||||
regional: $regional
|
||||
posko: $posko
|
||||
idUid: $idUid
|
||||
idUp3: $idUp3
|
||||
bulan: $bulan
|
||||
tahun: $tahun
|
||||
) {
|
||||
jumlah_keluhan_rct_bulan
|
||||
jumlah_keluhan_rct_sampai_bulan
|
||||
jumlah_keluhan_rpt_bulan
|
||||
jumlah_keluhan_rpt_sampai_bulan
|
||||
nama_posko
|
||||
rct_keluhan_bulan
|
||||
rct_keluhan_sampai_bulan
|
||||
rpt_keluhan_bulan
|
||||
rpt_keluhan_sampai_bulan
|
||||
total_rct_bulan
|
||||
total_rct_sampai_bulan
|
||||
total_rpt_bulan
|
||||
total_rpt_sampai_bulan
|
||||
}
|
||||
}
|
||||
`
|
||||
const { onResult, onError, loading, refetch } = useQuery(monalisaJumlahDurasiRptRctKeluhan, {
|
||||
bulan: 10,
|
||||
tahun: 2023,
|
||||
regional: '',
|
||||
posko: '',
|
||||
idUid: 0,
|
||||
idUp3: 0
|
||||
})
|
||||
const filterData = (params: any) => {
|
||||
const { regional, posko, idUid, idUp3, bulan, tahun } = params;
|
||||
|
||||
refetch({
|
||||
regional: regional,
|
||||
posko: posko ? posko.id : "",
|
||||
idUid: idUid ? idUid.id : 0,
|
||||
idUp3: idUp3 ? idUp3.id : 0,
|
||||
bulan: bulan ? bulan.id : 10,
|
||||
tahun: bulan ? tahun.id : 2023
|
||||
})
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
queryResult.data.monalisaJumlahDurasiRptRctKeluhan.forEach((item: any) => {
|
||||
data.value = [
|
||||
...data.value,
|
||||
{
|
||||
...item
|
||||
}
|
||||
]
|
||||
})
|
||||
}
|
||||
console.log(queryResult.data)
|
||||
console.log(queryResult.loading)
|
||||
console.log(queryResult.networkStatus)
|
||||
})
|
||||
onError((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
}
|
||||
|
||||
const filters = ref()
|
||||
</script>
|
||||
80
src/components/Pages/Monalisa/Table_49.vue
Normal file → Executable file
80
src/components/Pages/Monalisa/Table_49.vue
Normal file → Executable file
@ -6,7 +6,7 @@
|
||||
" />
|
||||
</Filters>
|
||||
<div id="data">
|
||||
<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" />
|
||||
@ -18,11 +18,11 @@
|
||||
<DxExport :enabled="true" :formats="['pdf', 'xlsx', 'document']" :allow-export-selected-data="false" />
|
||||
<DxColumnFixing :enabled="true" />
|
||||
|
||||
<DxColumn :width="50" alignment="center" data-field="" caption="NO" css-class="custom-table-column" />
|
||||
<DxColumn alignment="center" data-field="" caption="ID Keluhan" css-class="custom-table-column" />
|
||||
<DxColumn alignment="center" data-field="" caption="Jenis Keluhan" css-class="custom-table-column" />
|
||||
<DxColumn :width="170" alignment="center" data-field="" caption="Jumlah" css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="" caption="%" css-class="custom-table-column" />
|
||||
<DxColumn :width="50" alignment="center" :calculateCellValue="(item: any) => data.findIndex((i) => i == item) + 1" caption="NO" css-class="custom-table-column" />
|
||||
<DxColumn alignment="center" data-field="id_keluhan" caption="ID Keluhan" css-class="custom-table-column" />
|
||||
<DxColumn alignment="center" data-field="jenis_keluhan" caption="Jenis Keluhan" css-class="custom-table-column" />
|
||||
<DxColumn :width="170" alignment="center" data-field="jumlah" caption="Jumlah" css-class="custom-table-column" />
|
||||
<DxColumn :width="120" alignment="center" data-field="persen_keluhan" caption="%" css-class="custom-table-column" />
|
||||
|
||||
</DxDataGrid>
|
||||
</div>
|
||||
@ -39,6 +39,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 position = { of: '#data' }
|
||||
const showIndicator = ref(true)
|
||||
const shading = ref(true)
|
||||
@ -46,7 +48,7 @@ const showPane = ref(true)
|
||||
const data = ref<any[]>([])
|
||||
const dataDetail = ref<any>()
|
||||
const showDetail = ref(false)
|
||||
const loading = ref(false)
|
||||
|
||||
const onExporting = (e: any) => {
|
||||
if (e.format === 'pdf') {
|
||||
const doc = new jsPDF()
|
||||
@ -80,9 +82,67 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
const data = selectedRowsData[0]
|
||||
console.log(data)
|
||||
}
|
||||
const filterData = (params:any) =>
|
||||
{
|
||||
console.log(params)
|
||||
const monalisaKeluhanPerJenisKeluhan = gql`
|
||||
query DaftarmonalisaKeluhanPerJenisKeluhan(
|
||||
$regional: String
|
||||
$posko: String
|
||||
$idUid: Int
|
||||
$idUp3: Int
|
||||
$bulan: Int
|
||||
$tahun: Int
|
||||
) {
|
||||
monalisaKeluhanPerJenisKeluhan(
|
||||
regional: $regional
|
||||
posko: $posko
|
||||
idUid: $idUid
|
||||
idUp3: $idUp3
|
||||
bulan: $bulan
|
||||
tahun: $tahun
|
||||
) {
|
||||
id_keluhan
|
||||
jumlah
|
||||
persen_keluhan
|
||||
tipe_permasalahan
|
||||
}
|
||||
}
|
||||
`
|
||||
const { onResult, onError, loading, refetch } = useQuery(monalisaKeluhanPerJenisKeluhan, {
|
||||
bulan: 10,
|
||||
tahun: 2023,
|
||||
regional: '',
|
||||
posko: '',
|
||||
idUid: 0,
|
||||
idUp3: 0
|
||||
})
|
||||
const filterData = (params: any) => {
|
||||
const { regional, posko, idUid, idUp3, bulan, tahun } = params;
|
||||
|
||||
refetch({
|
||||
regional: regional,
|
||||
posko: posko ? posko.id : "",
|
||||
idUid: idUid ? idUid.id : 0,
|
||||
idUp3: idUp3 ? idUp3.id : 0,
|
||||
bulan: bulan ? bulan.id : 10,
|
||||
tahun: bulan ? tahun.id : 2023
|
||||
})
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
queryResult.data.monalisaKeluhanPerJenisKeluhan.forEach((item: any) => {
|
||||
data.value = [
|
||||
...data.value,
|
||||
{
|
||||
...item
|
||||
}
|
||||
]
|
||||
})
|
||||
}
|
||||
console.log(queryResult.data)
|
||||
console.log(queryResult.loading)
|
||||
console.log(queryResult.networkStatus)
|
||||
})
|
||||
onError((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
}
|
||||
const filters = ref()
|
||||
</script>
|
||||
92
src/components/Pages/Monalisa/Table_50.vue
Normal file → Executable file
92
src/components/Pages/Monalisa/Table_50.vue
Normal file → Executable file
@ -22,18 +22,18 @@
|
||||
<DxColumn :width="200" alignment="center" data-field="nama_posko" caption="Nama Unit" css-class="custom-table-column" />
|
||||
<DxColumn alignment="center" caption="Lapor Ulang Keluhan" css-class="custom-table-column">
|
||||
<DxColumn alignment="center" caption="MoM" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan" data-type="number" caption="Des 2018"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan_n_1" data-type="number" caption="Des 2019"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan" data-type="number"
|
||||
:caption="`${getMonthName(bulanSekarang)} ${tahunLalu}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_bulan_n_1" data-type="number"
|
||||
:caption="`${getMonthName(bulanSekarang)} ${tahunSekarang}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_bulan" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
<DxColumn alignment="center" caption="YoY" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun" data-type="number" caption="s.d Jan 2018"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun_n_1" data-type="number" caption="Jan 2019"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun" data-type="number"
|
||||
:caption="`s.d ${getMonthName(bulanSekarang)} ${tahunLalu}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="jumlah_tahun_n_1" data-type="number"
|
||||
:caption="`s.d ${getMonthName(bulanSekarang)} ${tahunSekarang}`" css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="persen_tahun" data-type="number" caption="%"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
@ -53,6 +53,9 @@ 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'
|
||||
import { getMonthName } from '@/utils/texts'
|
||||
const position = { of: '#data' }
|
||||
const showIndicator = ref(true)
|
||||
const shading = ref(true)
|
||||
@ -60,7 +63,9 @@ const showPane = ref(true)
|
||||
const data = ref<any[]>([])
|
||||
const dataDetail = ref<any>()
|
||||
const showDetail = ref(false)
|
||||
const loading = ref(false)
|
||||
const tahunSekarang = ref(new Date().getFullYear())
|
||||
const bulanSekarang = ref(new Date().getMonth())
|
||||
const tahunLalu = ref(tahunSekarang.value - 1)
|
||||
const onExporting = (e: any) => {
|
||||
if (e.format === 'pdf') {
|
||||
const doc = new jsPDF()
|
||||
@ -94,9 +99,72 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
const data = selectedRowsData[0]
|
||||
console.log(data)
|
||||
}
|
||||
const filterData = (params:any) =>
|
||||
{
|
||||
console.log(params)
|
||||
const monalisaRekapitulasiLaporUlangKeluhan = gql`
|
||||
query DaftarmonalisaRekapitulasiLaporUlangKeluhan(
|
||||
$regional: String
|
||||
$posko: String
|
||||
$idUid: Int
|
||||
$idUp3: Int
|
||||
$bulan: Int
|
||||
$tahun: Int
|
||||
) {
|
||||
monalisaRekapitulasiLaporUlangKeluhan(
|
||||
regional: $regional
|
||||
posko: $posko
|
||||
idUid: $idUid
|
||||
idUp3: $idUp3
|
||||
bulan: $bulan
|
||||
tahun: $tahun
|
||||
) {
|
||||
jumlah_bulan
|
||||
jumlah_bulan_n_1
|
||||
jumlah_tahun
|
||||
jumlah_tahun_n_1
|
||||
nama_posko
|
||||
persen_bulan
|
||||
persen_tahun
|
||||
}
|
||||
}
|
||||
`
|
||||
const { onResult, onError, loading, refetch } = useQuery(monalisaRekapitulasiLaporUlangKeluhan, {
|
||||
bulan: 10,
|
||||
tahun: 2023,
|
||||
regional: '',
|
||||
posko: '',
|
||||
idUid: 0,
|
||||
idUp3: 0
|
||||
})
|
||||
const filterData = (params: any) => {
|
||||
const { regional, posko, idUid, idUp3, bulan, tahun } = params;
|
||||
bulanSekarang.value = bulan.id;
|
||||
tahunSekarang.value = tahun.id;
|
||||
tahunLalu.value = tahun.id - 1;
|
||||
refetch({
|
||||
regional: regional,
|
||||
posko: posko ? posko.id : "",
|
||||
idUid: idUid ? idUid.id : 0,
|
||||
idUp3: idUp3 ? idUp3.id : 0,
|
||||
bulan: bulan ? bulan.id : 10,
|
||||
tahun: bulan ? tahun.id : 2023
|
||||
})
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
queryResult.data.monalisaRekapitulasiLaporUlangKeluhan.forEach((item: any) => {
|
||||
data.value = [
|
||||
...data.value,
|
||||
{
|
||||
...item
|
||||
}
|
||||
]
|
||||
})
|
||||
}
|
||||
console.log(queryResult.data)
|
||||
console.log(queryResult.loading)
|
||||
console.log(queryResult.networkStatus)
|
||||
})
|
||||
onError((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
}
|
||||
const filters = ref()
|
||||
</script>
|
||||
234
src/components/Pages/Monalisa/Table_51.vue
Normal file → Executable file
234
src/components/Pages/Monalisa/Table_51.vue
Normal file → Executable file
@ -1,34 +1,82 @@
|
||||
<template>
|
||||
<Filters @run-search="() => filterData(filters)" class="mb-4">
|
||||
<Type2 @update:filters="(value) => {
|
||||
filters = value
|
||||
<Filters @run-search="() => filterData(filters)" class="mb-4">
|
||||
<Type2
|
||||
@update:filters="
|
||||
(value) => {
|
||||
filters = value
|
||||
}
|
||||
" />
|
||||
</Filters>
|
||||
<div id="data">
|
||||
<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"
|
||||
@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" />
|
||||
<DxLoadPanel :position="position" :show-indicator="showIndicator" :show-pane="showPane" :shading="shading"
|
||||
v-if="loading" v-model:visible="loading" :enabled="true" />
|
||||
<DxSearchPanel :visible="true" :highlight-case-sensitive="true" />
|
||||
<DxExport :enabled="true" :formats="['pdf', 'xlsx', 'document']" :allow-export-selected-data="false" />
|
||||
<DxColumnFixing :enabled="true" />
|
||||
"
|
||||
/>
|
||||
</Filters>
|
||||
<div id="data">
|
||||
<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" />
|
||||
<DxPaging :enabled="false" />
|
||||
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
||||
<DxLoadPanel
|
||||
:position="position"
|
||||
:show-indicator="showIndicator"
|
||||
:show-pane="showPane"
|
||||
:shading="shading"
|
||||
v-if="loading"
|
||||
v-model:visible="loading"
|
||||
:enabled="true"
|
||||
/>
|
||||
<DxSearchPanel :visible="true" :highlight-case-sensitive="true" />
|
||||
<DxExport
|
||||
:enabled="true"
|
||||
:formats="['pdf', 'xlsx', 'document']"
|
||||
:allow-export-selected-data="false"
|
||||
/>
|
||||
<DxColumnFixing :enabled="true" />
|
||||
|
||||
<DxColumn alignment="center" data-field="" caption="Nama Unit" css-class="custom-table-column" />
|
||||
<DxColumn alignment="center" caption="Tahun" css-class="custom-table-column">
|
||||
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="Keluhan"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="Informasi"
|
||||
css-class="custom-table-column" />
|
||||
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="Total"
|
||||
css-class="custom-table-column" />
|
||||
</DxColumn>
|
||||
</DxDataGrid>
|
||||
</div>
|
||||
<DxColumn
|
||||
alignment="center"
|
||||
data-field="nama_posko"
|
||||
caption="Nama Unit"
|
||||
css-class="custom-table-column"
|
||||
/>
|
||||
<DxColumn alignment="center" caption="Tahun" css-class="custom-table-column">
|
||||
<DxColumn
|
||||
:width="150"
|
||||
alignment="center"
|
||||
data-field="keluhan"
|
||||
data-type="number"
|
||||
caption="Keluhan"
|
||||
css-class="custom-table-column"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
alignment="center"
|
||||
data-field="informasi"
|
||||
data-type="number"
|
||||
caption="Informasi"
|
||||
css-class="custom-table-column"
|
||||
/>
|
||||
<DxColumn
|
||||
:width="150"
|
||||
alignment="center"
|
||||
data-field="total"
|
||||
data-type="number"
|
||||
caption="Total"
|
||||
css-class="custom-table-column"
|
||||
/>
|
||||
</DxColumn>
|
||||
</DxDataGrid>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
@ -36,12 +84,23 @@ import { ref } from 'vue'
|
||||
import Filters from '@/components/Form/Filters.vue'
|
||||
import Type2 from '@/components/Form/FiltersType/Type2.vue'
|
||||
import { DxDataGrid } from 'devextreme-vue'
|
||||
import { DxColumn, DxColumnFixing, DxExport, DxLoadPanel, DxPaging, DxScrolling, DxSearchPanel, DxSelection } from 'devextreme-vue/data-grid'
|
||||
import {
|
||||
DxColumn,
|
||||
DxColumnFixing,
|
||||
DxExport,
|
||||
DxLoadPanel,
|
||||
DxPaging,
|
||||
DxScrolling,
|
||||
DxSearchPanel,
|
||||
DxSelection
|
||||
} from 'devextreme-vue/data-grid'
|
||||
import { jsPDF } from 'jspdf'
|
||||
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 position = { of: '#data' }
|
||||
const showIndicator = ref(true)
|
||||
const shading = ref(true)
|
||||
@ -49,43 +108,100 @@ const showPane = ref(true)
|
||||
const data = ref<any[]>([])
|
||||
const dataDetail = ref<any>()
|
||||
const showDetail = ref(false)
|
||||
const loading = ref(false)
|
||||
const onExporting = (e: any) => {
|
||||
if (e.format === 'pdf') {
|
||||
const doc = new jsPDF()
|
||||
if (e.format === 'pdf') {
|
||||
const doc = new jsPDF()
|
||||
|
||||
exportToPdf({
|
||||
jsPDFDocument: doc,
|
||||
component: e.component,
|
||||
indent: 5,
|
||||
}).then(() => {
|
||||
doc.save(`.pdf`)
|
||||
})
|
||||
} else {
|
||||
const workbook = new Workbook()
|
||||
const worksheet = workbook.addWorksheet('Employees')
|
||||
exportToPdf({
|
||||
jsPDFDocument: doc,
|
||||
component: e.component,
|
||||
indent: 5
|
||||
}).then(() => {
|
||||
doc.save(`.pdf`)
|
||||
})
|
||||
} else {
|
||||
const workbook = new Workbook()
|
||||
const worksheet = workbook.addWorksheet('Employees')
|
||||
|
||||
exportToExcel({
|
||||
component: e.component,
|
||||
worksheet,
|
||||
autoFilterEnabled: true,
|
||||
}).then(() => {
|
||||
workbook.xlsx.writeBuffer().then((buffer: any) => {
|
||||
saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'DataGrid.xlsx')
|
||||
})
|
||||
})
|
||||
exportToExcel({
|
||||
component: e.component,
|
||||
worksheet,
|
||||
autoFilterEnabled: true
|
||||
}).then(() => {
|
||||
workbook.xlsx.writeBuffer().then((buffer: any) => {
|
||||
saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'DataGrid.xlsx')
|
||||
})
|
||||
})
|
||||
|
||||
e.cancel = true
|
||||
}
|
||||
e.cancel = true
|
||||
}
|
||||
}
|
||||
|
||||
const onSelectionChanged = ({ selectedRowsData }: any) => {
|
||||
const data = selectedRowsData[0]
|
||||
console.log(data)
|
||||
const data = selectedRowsData[0]
|
||||
console.log(data)
|
||||
}
|
||||
const filterData = (params:any) =>
|
||||
{
|
||||
console.log(params)
|
||||
const monalisaRekapitulasiKeluhanBelumSelesai = gql`
|
||||
query DaftarmonalisaRekapitulasiKeluhanBelumSelesai(
|
||||
$regional: String
|
||||
$posko: String
|
||||
$idUid: Int
|
||||
$idUp3: Int
|
||||
$bulan: Int
|
||||
$tahun: Int
|
||||
) {
|
||||
monalisaRekapitulasiKeluhanBelumSelesai(
|
||||
regional: $regional
|
||||
posko: $posko
|
||||
idUid: $idUid
|
||||
idUp3: $idUp3
|
||||
bulan: $bulan
|
||||
tahun: $tahun
|
||||
) {
|
||||
keluhan
|
||||
informasi
|
||||
nama_posko
|
||||
total
|
||||
}
|
||||
}
|
||||
`
|
||||
const { onResult, onError, loading, refetch } = useQuery(monalisaRekapitulasiKeluhanBelumSelesai, {
|
||||
regional: '',
|
||||
posko: '',
|
||||
idUid: 0,
|
||||
idUp3: 0,
|
||||
bulan: 10,
|
||||
tahun: 2023
|
||||
})
|
||||
const filterData = (params: any) => {
|
||||
const { regional, posko, idUid, idUp3, bulan, tahun } = params
|
||||
|
||||
refetch({
|
||||
regional: regional,
|
||||
posko: posko ? posko.id : "",
|
||||
idUid: idUid ? idUid.id : 0,
|
||||
idUp3: idUp3 ? idUp3.id : 0,
|
||||
bulan: bulan ? bulan.id : 10,
|
||||
tahun: bulan ? tahun.id : 2023
|
||||
})
|
||||
onResult((queryResult) => {
|
||||
if (queryResult.data != undefined) {
|
||||
queryResult.data.monalisaRekapitulasiKeluhanBelumSelesai.forEach((item: any) => {
|
||||
data.value = [
|
||||
...data.value,
|
||||
{
|
||||
...item
|
||||
}
|
||||
]
|
||||
})
|
||||
}
|
||||
console.log(queryResult.data)
|
||||
console.log(queryResult.loading)
|
||||
console.log(queryResult.networkStatus)
|
||||
})
|
||||
onError((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
}
|
||||
const filters = ref()
|
||||
</script>
|
||||
</script>
|
||||
|
||||
0
src/components/Pages/Monalisa/Table_52.vue
Normal file → Executable file
0
src/components/Pages/Monalisa/Table_52.vue
Normal file → Executable file
0
src/components/Pages/Monalisa/Table_53.vue
Normal file → Executable file
0
src/components/Pages/Monalisa/Table_53.vue
Normal file → Executable file
0
src/components/Pages/Monalisa/Table_54.vue
Normal file → Executable file
0
src/components/Pages/Monalisa/Table_54.vue
Normal file → Executable file
0
src/components/Pages/Monalisa/Table_55.vue
Normal file → Executable file
0
src/components/Pages/Monalisa/Table_55.vue
Normal file → Executable file
0
src/components/Pages/Monalisa/Table_56.vue
Normal file → Executable file
0
src/components/Pages/Monalisa/Table_56.vue
Normal file → Executable file
0
src/components/Pages/Monalisa/Table_57.vue
Normal file → Executable file
0
src/components/Pages/Monalisa/Table_57.vue
Normal file → Executable file
0
src/components/Pages/Monalisa/Table_58.vue
Normal file → Executable file
0
src/components/Pages/Monalisa/Table_58.vue
Normal file → Executable file
1
src/components/Pages/Monalisa/Table_59.vue
Normal file → Executable file
1
src/components/Pages/Monalisa/Table_59.vue
Normal file → Executable file
@ -60,6 +60,7 @@ const shading = ref(true)
|
||||
const showPane = ref(true)
|
||||
const dataDetail = ref<any>()
|
||||
const showDetail = ref(false)
|
||||
const loading = ref(false)
|
||||
const onExporting = (e: any) => {
|
||||
if (e.format === 'pdf') {
|
||||
const doc = new jsPDF()
|
||||
|
||||
0
src/components/Pages/Monalisa/index.ts
Normal file → Executable file
0
src/components/Pages/Monalisa/index.ts
Normal file → Executable file
Reference in New Issue
Block a user