defuj/apkt-eis
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
kur0nek-o 2023-11-03 12:41:04 +07:00
commit b914081faa
24 changed files with 120 additions and 177 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/assets/css/style.css
View File

@ -962,6 +962,10 @@ select {
z-index: 50;
}
.z-\[9999\] {
z-index: 9999;
}
.order-last {
order: 9999;
}

10
src/components/DatePicker.vue
View File

@ -4,11 +4,11 @@
import VueTailwindDatepicker from 'vue-tailwind-datepicker'
const dateValue = ref('')
const formatter = ref({
date: 'DD MMM YYYY',
month: 'MMM'
})
const dateValue = ref('')
const formatter = ref({
date: 'DD MMM YYYY',
month: 'MMM'
})
</script>
<template>

2
src/components/Form/FiltersType/index.ts
View File

@ -14,4 +14,4 @@ export { default as Type13 } from '@/components/Form/FiltersType/Type13.vue'
export { default as Type14 } from '@/components/Form/FiltersType/Type14.vue'
export { default as Type15 } from '@/components/Form/FiltersType/Type15.vue'
export { default as Type16 } from '@/components/Form/FiltersType/Type16.vue'
export { default as Type17 } from '@/components/Form/FiltersType/Type17.vue'
export { default as Type17 } from '@/components/Form/FiltersType/Type17.vue'

21
src/components/Form/InlineRadioGroup.vue
View File

@ -2,23 +2,12 @@
<div>
<fieldset>
<div class="space-y-3 sm:flex sm:items-center sm:space-y-0 sm:space-x-5">
<div
v-for="item in radioItems"
:key="item.id"
class="flex items-center"
>
<input
:id="`${item.id}`"
type="radio"
name="radio"
<div v-for="item in radioItems" :key="item.id" class="flex items-center">
<input :id="`${item.id}`" type="radio" name="radio"
:checked="item.hasOwnProperty('checked') && item.checked === true"
class="h-4 w-4 border-gray-300 text-primary-500 peer focus:ring-primary-500"
/>
<label
:for="`${item.id}`"
class="ml-3 block text-sm font-medium text-gray-700 peer-checked:text-primary-500"
>{{ item.title }}</label
>
class="w-4 h-4 border-gray-300 text-primary-500 peer focus:ring-primary-500" />
<label :for="`${item.id}`" class="block ml-3 text-sm font-medium text-gray-700 peer-checked:text-primary-500">{{
item.title }}</label>
</div>
</div>
</fieldset>

2
src/components/Pages/Gangguan/Table_1.vue
View File

@ -4,7 +4,7 @@
: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">
<DxPaging :page-size="10" :enabled="true" />
<DxPaging :page-size="5" :enabled="true" />
<DxPager :visible="true" :allowed-page-sizes="[5, 10, 20, 'all']" display-mode="full"
:show-page-size-selector="true" :show-info="true" :show-navigation-buttons="true" />
<DxSelection mode="single" />

2
src/components/Pages/Gangguan/Table_2.vue
View File

@ -4,7 +4,7 @@
:row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="" :column-width="100"
@exporting="" :allow-column-resizing="true" column-resizing-mode="widget">
<DxSelection mode="single" />
<DxPaging :page-size="10" :enabled="true" />
<DxPaging :page-size="5" :enabled="true" />
<DxPager :visible="true" :allowed-page-sizes="[5, 10, 20, 'all']" display-mode="full"
:show-page-size-selector="true" :show-info="true" :show-navigation-buttons="true" />
<DxLoadPanel :enabled="true" />

2
src/components/Pages/Gangguan/Table_3.vue
View File

@ -4,7 +4,7 @@
:row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="" :column-width="100"
@exporting="" :allow-column-resizing="true" column-resizing-mode="widget">
<DxSelection mode="single" />
<DxPaging :page-size="10" :enabled="true" />
<DxPaging :page-size="5" :enabled="true" />
<DxPager :visible="true" :allowed-page-sizes="[5, 10, 20, 'all']" display-mode="full"
:show-page-size-selector="true" :show-info="true" :show-navigation-buttons="true" />
<DxLoadPanel :enabled="true" />

2
src/components/Pages/Gangguan/Table_4.vue
View File

@ -4,7 +4,7 @@
:row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="" :column-width="100"
@exporting="" :allow-column-resizing="true" column-resizing-mode="widget">
<DxSelection mode="single" />
<DxPaging :page-size="10" :enabled="true" />
<DxPaging :page-size="5" :enabled="true" />
<DxPager :visible="true" :allowed-page-sizes="[5, 10, 20, 'all']" display-mode="full"
:show-page-size-selector="true" :show-info="true" :show-navigation-buttons="true" />
<DxLoadPanel :enabled="true" />

2
src/components/Pages/Gangguan/Table_5.vue
View File

@ -4,7 +4,7 @@
:row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="" :column-width="100"
@exporting="" :allow-column-resizing="true" column-resizing-mode="widget">
<DxSelection mode="single" />
<DxPaging :page-size="10" :enabled="true" />
<DxPaging :page-size="5" :enabled="true" />
<DxPager :visible="true" :allowed-page-sizes="[5, 10, 20, 'all']" display-mode="full"
:show-page-size-selector="true" :show-info="true" :show-navigation-buttons="true" />
<DxLoadPanel :enabled="true" />

2
src/components/Pages/Gangguan/Table_6.vue
View File

@ -4,7 +4,7 @@
:row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="" :column-width="100"
@exporting="" :allow-column-resizing="true" column-resizing-mode="widget">
<DxSelection mode="single" />
<DxPaging :page-size="10" :enabled="true" />
<DxPaging :page-size="5" :enabled="true" />
<DxPager :visible="true" :allowed-page-sizes="[5, 10, 20, 'all']" display-mode="full"
:show-page-size-selector="true" :show-info="true" :show-navigation-buttons="true" />
<DxLoadPanel :enabled="true" />

2
src/components/Pages/Gangguan/Table_7.vue
View File

@ -4,7 +4,7 @@
:row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="" :column-width="100"
@exporting="" :allow-column-resizing="true" column-resizing-mode="widget">
<DxSelection mode="single" />
<DxPaging :page-size="10" :enabled="true" />
<DxPaging :page-size="5" :enabled="true" />
<DxPager :visible="true" :allowed-page-sizes="[5, 10, 20, 'all']" display-mode="full"
:show-page-size-selector="true" :show-info="true" :show-navigation-buttons="true" />
<DxLoadPanel :enabled="true" />

2
src/components/Pages/Gangguan/Table_8.vue
View File

@ -4,7 +4,7 @@
: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 :page-size="10" :enabled="true" />
<DxPaging :page-size="5" :enabled="true" />
<DxPager :visible="true" :allowed-page-sizes="[5, 10, 20, 'all']" display-mode="full"
:show-page-size-selector="true" :show-info="true" :show-navigation-buttons="true" />
<DxLoadPanel :enabled="true" />

50
src/components/Pages/Gangguan/Table_9.vue
View File

@ -67,13 +67,18 @@
css-class="custom-table-column" />
</DxColumn>
</DxColumn>
<DxSummary>
<DxGroupItem :show-in-group-footer="true" column="" summary-type="sum" value-format="number"
display-format="Total: {0}" />
</DxSummary>
</DxDataGrid>
</div>
</template>
<script setup lang="ts">
import { DxDataGrid } from 'devextreme-vue'
import { DxColumn, DxColumnFixing, DxExport, DxLoadPanel, DxPaging, DxScrolling, DxSearchPanel, DxSelection } from 'devextreme-vue/data-grid'
import { DxColumn, DxColumnFixing, DxExport, DxGroupItem, DxLoadPanel, DxPaging, DxScrolling, DxSearchPanel, DxSelection, DxSummary } 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'
@ -114,4 +119,47 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
console.log(data)
}
const data = [
{
no: 1,
kode: 'A',
jenisGangguan: 'Gangguan A',
laporan: {
total: 10,
sudahSelesai: {
jml: 5,
persen: 50,
},
belumSelesai: {
jml: 5,
persen: 50,
},
},
responseTime: {
menit: {
total: 10,
rataRata: 10,
max: 10,
min: 10,
},
laporan: {
lebihSla: 5,
kurangSla: 5,
},
},
recoveryTime: {
menit: {
total: 10,
rataRata: 10,
max: 10,
min: 10,
},
laporan: {
lebihSla: 5,
kurangSla: 5,
},
}
},
]
</script>

2
src/components/Pages/Keluhan/Table_21.vue
View File

@ -5,7 +5,7 @@
:column-width="100" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget"
:word-wrap-enabled="true">
<DxSelection mode="single" />
<DxPaging :page-size="10" :enabled="true" />
<DxPaging :page-size="5" :enabled="true" />
<DxPager :visible="true" :allowed-page-sizes="[5, 10, 20, 'all']" display-mode="full"
:show-page-size-selector="true" :show-info="true" :show-navigation-buttons="true" />
<DxLoadPanel :enabled="true" />

2
src/components/Pages/Keluhan/Table_22.vue
View File

@ -5,7 +5,7 @@
:column-width="100" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget"
:word-wrap-enabled="true">
<DxSelection mode="single" />
<DxPaging :page-size="10" :enabled="true" />
<DxPaging :page-size="5" :enabled="true" />
<DxPager :visible="true" :allowed-page-sizes="[5, 10, 20, 'all']" display-mode="full"
:show-page-size-selector="true" :show-info="true" :show-navigation-buttons="true" />
<DxLoadPanel :enabled="true" />

2
src/components/Pages/Keluhan/Table_23.vue
View File

@ -5,7 +5,7 @@
:column-width="100" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget"
:word-wrap-enabled="true">
<DxSelection mode="single" />
<DxPaging :page-size="10" :enabled="true" />
<DxPaging :page-size="5" :enabled="true" />
<DxPager :visible="true" :allowed-page-sizes="[5, 10, 20, 'all']" display-mode="full"
:show-page-size-selector="true" :show-info="true" :show-navigation-buttons="true" />
<DxLoadPanel :enabled="true" />

2
src/components/Pages/Keluhan/Table_24.vue
View File

@ -5,7 +5,7 @@
:column-width="100" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget"
:word-wrap-enabled="true">
<DxSelection mode="single" />
<DxPaging :page-size="10" :enabled="true" />
<DxPaging :page-size="5" :enabled="true" />
<DxPager :visible="true" :allowed-page-sizes="[5, 10, 20, 'all']" display-mode="full"
:show-page-size-selector="true" :show-info="true" :show-navigation-buttons="true" />
<DxLoadPanel :enabled="true" />

2
src/components/Pages/Keluhan/Table_25.vue
View File

@ -5,7 +5,7 @@
:column-width="100" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget"
:word-wrap-enabled="true">
<DxSelection mode="single" />
<DxPaging :page-size="10" :enabled="true" />
<DxPaging :page-size="5" :enabled="true" />
<DxPager :visible="true" :allowed-page-sizes="[5, 10, 20, 'all']" display-mode="full"
:show-page-size-selector="true" :show-info="true" :show-navigation-buttons="true" />
<DxLoadPanel :enabled="true" />

2
src/components/Pages/Keluhan/Table_26.vue
View File

@ -5,7 +5,7 @@
:column-width="100" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget"
:word-wrap-enabled="true">
<DxSelection mode="single" />
<DxPaging :page-size="10" :enabled="true" />
<DxPaging :page-size="5" :enabled="true" />
<DxPager :visible="true" :allowed-page-sizes="[5, 10, 20, 'all']" display-mode="full"
:show-page-size-selector="true" :show-info="true" :show-navigation-buttons="true" />
<DxLoadPanel :enabled="true" />

2
src/components/Pages/Keluhan/Table_27.vue
View File

@ -5,7 +5,7 @@
:column-width="100" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget"
:word-wrap-enabled="true">
<DxSelection mode="single" />
<DxPaging :page-size="10" :enabled="true" />
<DxPaging :page-size="5" :enabled="true" />
<DxPager :visible="true" :allowed-page-sizes="[5, 10, 20, 'all']" display-mode="full"
:show-page-size-selector="true" :show-info="true" :show-navigation-buttons="true" />
<DxLoadPanel :enabled="true" />

2
src/components/Pages/Material/Table_68.vue
View File

@ -4,7 +4,7 @@
:row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="" :column-width="100"
@exporting="" :allow-column-resizing="true" column-resizing-mode="widget">
<DxSelection mode="single" />
<DxPaging :page-size="10" :enabled="true" />
<DxPaging :page-size="5" :enabled="true" />
<DxPager :visible="true" :allowed-page-sizes="[5, 10, 20, 'all']" display-mode="full"
:show-page-size-selector="true" :show-info="true" :show-navigation-buttons="true" />
<DxLoadPanel :enabled="true" />

2
src/components/Pages/Material/Table_69.vue
View File

@ -4,7 +4,7 @@
:row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="" :column-width="100"
@exporting="" :allow-column-resizing="true" column-resizing-mode="widget">
<DxSelection mode="single" />
<DxPaging :page-size="10" :enabled="true" />
<DxPaging :page-size="5" :enabled="true" />
<DxPager :visible="true" :allowed-page-sizes="[5, 10, 20, 'all']" display-mode="full"
:show-page-size-selector="true" :show-info="true" :show-navigation-buttons="true" />
<DxLoadPanel :enabled="true" />

116
src/components/Pages/PencarianData/Table_71.vue
View File

@ -1,62 +1,35 @@
<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">
:row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="" :column-width="100"
@exporting="" :allow-column-resizing="true" column-resizing-mode="widget">
<DxSelection mode="single" />
<DxPaging :enabled="false" />
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
<DxPaging :page-size="5" :enabled="true" />
<DxPager :visible="true" :allowed-page-sizes="[5, 10, 20, 'all']" display-mode="full"
:show-page-size-selector="true" :show-info="true" :show-navigation-buttons="true" />
<DxLoadPanel :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="50" alignment="center" data-field="" caption="NO" css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" caption="Kode Unit" css-class="custom-table-column" />
<DxColumn :width="170" alignment="center" data-field="" caption="Nama Unit" css-class="custom-table-column" />
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="Total"
css-class="custom-table-column" />
<DxColumn alignment="center" caption="Belum Selesai" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="Jml"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="%"
css-class="custom-table-column" />
</DxColumn>
<DxColumn alignment="center" caption="Sudah Selesai" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="Jml"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="%"
css-class="custom-table-column" />
</DxColumn>
</DxColumn>
<DxColumn alignment="center" caption="Rating" css-class="custom-table-column">
<DxColumn alignment="center" caption="Bintang" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="Jml"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="%"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="1"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="2"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="3"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="4"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="5"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="Indeks"
css-class="custom-table-column" />
</DxColumn>
</DxColumn>
<DxColumn alignment="center" caption="Non Rating" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="Jml"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="%"
css-class="custom-table-column" />
</DxColumn>
<DxColumn css-class="custom-table-column" :width="50" alignment="center" data-field="" data-type="number"
caption="No" />
<DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="" caption="No. Laporan" />
<DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="" caption="Tgl Lapor" />
<DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field=""
caption="IDPEL/NO METER" />
<DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field=""
caption="Nama Pelapor" />
<DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field=""
caption="Alamat Pelapor" />
<DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field=""
caption="No Tlp Pelapor" />
<DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="" caption="Status" />
<DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="" caption="UI Dist." />
<DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="" caption="UP 3" />
<DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="" caption="Posko/ULP" />
<DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="" caption="Petugas" />
<DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field=""
caption="Keterangan DLPD" />
</DxDataGrid>
</div>
@ -64,45 +37,6 @@
<script setup lang="ts">
import { DxDataGrid } from 'devextreme-vue'
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'
const onExporting = (e: any) => {
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')
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
}
}
const onSelectionChanged = ({ selectedRowsData }: any) => {
const data = selectedRowsData[0]
console.log(data)
}
import { DxColumn, DxExport, DxLoadPanel, DxPager, DxPaging, DxScrolling, DxSearchPanel, DxSelection } from 'devextreme-vue/data-grid'
</script>

60
src/components/Pages/Transaksi/Table_70.vue
View File

@ -12,52 +12,20 @@
<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 :width="150" alignment="center" data-field="" caption="Kode Unit" css-class="custom-table-column" />
<DxColumn :width="170" alignment="center" data-field="" caption="Nama Unit" css-class="custom-table-column" />
<DxColumn alignment="center" caption="Laporan" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="Total"
css-class="custom-table-column" />
<DxColumn alignment="center" caption="Belum Selesai" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="Jml"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="%"
css-class="custom-table-column" />
</DxColumn>
<DxColumn alignment="center" caption="Sudah Selesai" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="Jml"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="%"
css-class="custom-table-column" />
</DxColumn>
</DxColumn>
<DxColumn alignment="center" caption="Rating" css-class="custom-table-column">
<DxColumn alignment="center" caption="Bintang" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="Jml"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="%"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="1"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="2"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="3"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="4"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="5"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="Indeks"
css-class="custom-table-column" />
</DxColumn>
</DxColumn>
<DxColumn alignment="center" caption="Non Rating" css-class="custom-table-column">
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="Jml"
css-class="custom-table-column" />
<DxColumn :width="150" alignment="center" data-field="" data-type="number" caption="%"
css-class="custom-table-column" />
</DxColumn>
<DxColumn :width="170" alignment="center" data-field="" caption="No.Lapor" css-class="custom-table-column" />
<DxColumn :width="170" alignment="center" data-field="" caption="Tipe Isu" css-class="custom-table-column" />
<DxColumn :width="170" alignment="center" data-field="" caption="Nama" css-class="custom-table-column" />
<DxColumn :width="170" alignment="center" data-field="" caption="Unit" css-class="custom-table-column" />
<DxColumn :width="170" alignment="center" data-field="" caption="No.Telp" css-class="custom-table-column" />
<DxColumn :width="170" alignment="center" data-field="" caption="Permasalahan"
css-class="custom-table-column" />
<DxColumn :width="170" alignment="center" data-field="" caption="Deskripsi" css-class="custom-table-column" />
<DxColumn :width="170" alignment="center" data-field="" caption="Tgl Buat" css-class="custom-table-column" />
<DxColumn :width="170" alignment="center" data-field="" caption="Lap.Ulang" css-class="custom-table-column" />
<DxColumn :width="170" alignment="center" data-field="" caption="Ket.Lap.Ulang"
css-class="custom-table-column" />
<DxColumn :width="170" alignment="center" data-field="" caption="Status" css-class="custom-table-column" />
<DxColumn :width="170" alignment="center" data-field="" caption="Durasi" css-class="custom-table-column" />
</DxDataGrid>
</div>
</template>