fix kumulatif kpi ens & monalisa gangguan lapor ulang
This commit is contained in:
		| @@ -1,153 +1,65 @@ | ||||
| <template> | ||||
|   <Filters | ||||
|     @run-report="() => exportToPDF(reportMeta, data, true)" | ||||
|     @reset-form="data = []" | ||||
|     @run-search="() => filterData(filters)" | ||||
|     :report-button="true" | ||||
|     class="mb-4" | ||||
|   > | ||||
|   <Filters @run-report="() => exportToPDF(reportMeta, data, true)" @reset-form="data = []" | ||||
|     @run-search="() => filterData(filters)" :report-button="true" class="mb-4"> | ||||
|     <Type2 @update:filters="(value) => (filters = value)" /> | ||||
|   </Filters> | ||||
|  | ||||
|   <div id="data"> | ||||
|     <DxDataGrid | ||||
|       ref="dataGridRef" | ||||
|       :allow-column-reordering="true" | ||||
|       class="max-h-[calc(100vh-140px)] mb-10" | ||||
|       :data-source="data" | ||||
|       :show-column-lines="true" | ||||
|       :show-row-lines="false" | ||||
|       :show-borders="true" | ||||
|       :row-alternation-enabled="true" | ||||
|       :hover-state-enabled="true" | ||||
|       @selection-changed="onDataSelectionChanged" | ||||
|       @exporting="onExporting" | ||||
|       :allow-column-resizing="true" | ||||
|       column-resizing-mode="widget" | ||||
|       :word-wrap-enabled="true" | ||||
|     > | ||||
|     <DxDataGrid ref="dataGridRef" :allow-column-reordering="true" class="max-h-[calc(100vh-140px)] mb-10" | ||||
|       :data-source="data" :show-column-lines="true" :show-row-lines="false" :show-borders="true" | ||||
|       :row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="onDataSelectionChanged" | ||||
|       @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget" :word-wrap-enabled="true"> | ||||
|       <DxGrouping :context-menu-enabled="true" expand-mode="rowClick" :auto-expand-all="false" /> | ||||
|       <DxSelection mode="single" /> | ||||
|       <DxPaging :enabled="false" /> | ||||
|       <DxScrolling column-rendering-mode="virtual" mode="virtual" /> | ||||
|  | ||||
|       <DxSearchPanel :visible="true" :highlight-case-sensitive="true" /> | ||||
|       <DxExport | ||||
|         :enabled="true" | ||||
|         :formats="['pdf', 'xlsx', 'document']" | ||||
|         :allow-export-selected-data="false" | ||||
|       /> | ||||
|       <DxExport :enabled="true" :formats="['pdf', 'xlsx', 'document']" :allow-export-selected-data="false" /> | ||||
|       <DxColumnFixing :enabled="true" /> | ||||
|  | ||||
|       <DxColumn | ||||
|         alignment="center" | ||||
|         data-field="nama_ulp" | ||||
|         caption="Nama Unit" | ||||
|         css-class="custom-table-column" | ||||
|         cell-template="formatText" | ||||
|       /> | ||||
|       <DxColumn | ||||
|         alignment="center" | ||||
|         :min-width="170" | ||||
|         data-type="text" | ||||
|         data-field="nama_regional" | ||||
|         caption="Regional" | ||||
|         css-class="custom-table-column" | ||||
|         :group-index="0" | ||||
|         name="namaRegional" | ||||
|       /> | ||||
|       <DxColumn | ||||
|         alignment="center" | ||||
|         :min-width="170" | ||||
|         data-type="text" | ||||
|         data-field="id_uid" | ||||
|         caption="UIW" | ||||
|         css-class="custom-table-column" | ||||
|         :group-index="1" | ||||
|         name="namaUID" | ||||
|         :calculate-group-value="(rowData: any) => rowData.nama_uid" | ||||
|       /> | ||||
|       <DxColumn | ||||
|         alignment="center" | ||||
|         :min-width="170" | ||||
|         data-type="text" | ||||
|         data-field="id_up3" | ||||
|         caption="UP3" | ||||
|         css-class="custom-table-column" | ||||
|         :group-index="1" | ||||
|         name="namaUID" | ||||
|         :calculate-group-value="(rowData: any) => rowData.nama_up3" | ||||
|       /> | ||||
|       <DxColumn alignment="center" data-field="nama_ulp" caption="Nama Unit" css-class="custom-table-column" | ||||
|         cell-template="formatText" /> | ||||
|       <DxColumn alignment="center" :min-width="170" data-type="text" data-field="nama_regional" caption="Regional" | ||||
|         css-class="custom-table-column" :group-index="0" name="namaRegional" /> | ||||
|       <DxColumn alignment="center" :min-width="170" data-type="text" data-field="id_uid" caption="UIW" | ||||
|         css-class="custom-table-column" :group-index="1" name="namaUID" | ||||
|         :calculate-group-value="(rowData: any) => rowData.nama_uid" /> | ||||
|       <DxColumn alignment="center" :min-width="170" data-type="text" data-field="id_up3" caption="UP3" | ||||
|         css-class="custom-table-column" :group-index="1" name="namaUID" | ||||
|         :calculate-group-value="(rowData: any) => rowData.nama_up3" /> | ||||
|       <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="mom_bulan_kemarin" | ||||
|             data-type="number" | ||||
|             :caption="`${getMonthName(lastMonth)} ${lastYearMoM}`" | ||||
|             css-class="custom-table-column" | ||||
|             cell-template="formatNumber" | ||||
|           /> | ||||
|           <DxColumn | ||||
|             :width="150" | ||||
|             alignment="center" | ||||
|             data-field="mom_bulan_ini" | ||||
|             data-type="number" | ||||
|             :caption="`${getMonthName(currentMonth)} ${currentYear}`" | ||||
|             css-class="custom-table-column" | ||||
|             cell-template="formatNumber" | ||||
|           /> | ||||
|           <DxColumn | ||||
|             :width="70" | ||||
|             alignment="center" | ||||
|             data-field="persen_mom" | ||||
|             data-type="number" | ||||
|             caption="%" | ||||
|             css-class="custom-table-column" | ||||
|             cell-template="formatNumber" | ||||
|           /> | ||||
|           <DxColumn :width="150" alignment="center" data-field="mom_bulan_kemarin" data-type="number" | ||||
|             :caption="`${getMonthName(lastMonth)} ${lastYearMoM}`" css-class="custom-table-column" | ||||
|             cell-template="formatNumber" /> | ||||
|           <DxColumn :width="150" alignment="center" data-field="mom_bulan_ini" data-type="number" | ||||
|             :caption="`${getMonthName(currentMonth)} ${currentYear}`" css-class="custom-table-column" | ||||
|             cell-template="formatNumber" /> | ||||
|           <DxColumn :width="70" alignment="center" data-field="persen_mom" data-type="number" caption="%" | ||||
|             css-class="custom-table-column" cell-template="formatNumber" /> | ||||
|         </DxColumn> | ||||
|         <DxColumn alignment="center" caption="YoY" css-class="custom-table-column"> | ||||
|           <DxColumn | ||||
|             :width="150" | ||||
|             alignment="center" | ||||
|             data-field="yoy_tahun_kemarin" | ||||
|             data-type="number" | ||||
|             :caption="`s.d ${getMonthName(currentMonth)} ${lastYear}`" | ||||
|             css-class="custom-table-column" | ||||
|             cell-template="formatNumber" | ||||
|           /> | ||||
|           <DxColumn | ||||
|             :width="150" | ||||
|             alignment="center" | ||||
|             data-field="yoy_tahun_ini" | ||||
|             data-type="number" | ||||
|             :caption="`s.d ${getMonthName(currentMonth)} ${currentYear}`" | ||||
|             css-class="custom-table-column" | ||||
|             cell-template="formatNumber" | ||||
|           /> | ||||
|           <DxColumn | ||||
|             :width="70" | ||||
|             alignment="center" | ||||
|             data-field="persen_yoy" | ||||
|             data-type="number" | ||||
|             caption="%" | ||||
|             css-class="custom-table-column" | ||||
|             cell-template="formatNumber" | ||||
|           /> | ||||
|           <DxColumn :width="150" alignment="center" data-field="yoy_tahun_kemarin" data-type="number" | ||||
|             :caption="`s.d ${getMonthName(currentMonth)} ${lastYear}`" css-class="custom-table-column" | ||||
|             cell-template="formatNumber" /> | ||||
|           <DxColumn :width="150" alignment="center" data-field="yoy_tahun_ini" data-type="number" | ||||
|             :caption="`s.d ${getMonthName(currentMonth)} ${currentYear}`" css-class="custom-table-column" | ||||
|             cell-template="formatNumber" /> | ||||
|           <DxColumn :width="70" alignment="center" data-field="persen_yoy" data-type="number" caption="%" | ||||
|             css-class="custom-table-column" cell-template="formatNumber" /> | ||||
|         </DxColumn> | ||||
|       </DxColumn> | ||||
|  | ||||
|       <template #formatNumber="{ data }"> | ||||
|         <p class="text-right cursor-pointer"> | ||||
|           {{ | ||||
|             isNumber(data.text) | ||||
|               ? data.column.caption == '%' | ||||
|                 ? formatPercentage(data.text) | ||||
|                 : formatNumber(data.text) | ||||
|               : data.text | ||||
|           }} | ||||
|       isNumber(data.text) | ||||
|         ? data.column.caption == '%' | ||||
|           ? formatPercentage(data.text) | ||||
|           : formatNumber(data.text) | ||||
|         : data.text | ||||
|     }} | ||||
|         </p> | ||||
|       </template> | ||||
|  | ||||
| @@ -158,111 +70,40 @@ | ||||
|       </template> | ||||
|  | ||||
|       <DxSummary> | ||||
|         <DxTotalItem | ||||
|           summary-type="sum" | ||||
|           display-format="Total" | ||||
|           show-in-column="nama_ulp" | ||||
|           css-class="text-white !text-left" | ||||
|         /> | ||||
|         <DxTotalItem | ||||
|           column="mom_bulan_kemarin" | ||||
|           summary-type="sum" | ||||
|           display-format="{0}" | ||||
|           css-class="text-white !text-right" | ||||
|           :customize-text="(e: any) => formatNumber(e.value)" | ||||
|         /> | ||||
|         <DxTotalItem | ||||
|           column="mom_bulan_ini" | ||||
|           summary-type="sum" | ||||
|           display-format="{0}" | ||||
|           css-class="text-white !text-right" | ||||
|           :customize-text="(e: any) => formatNumber(e.value)" | ||||
|         /> | ||||
|         <DxTotalItem | ||||
|           column="persen_mom" | ||||
|           summary-type="avg" | ||||
|           display-format="{0}" | ||||
|           css-class="text-white !text-right" | ||||
|           :customize-text="(e: any) => formatPercentage(e.value)" | ||||
|         /> | ||||
|         <DxTotalItem | ||||
|           column="yoy_tahun_kemarin" | ||||
|           summary-type="sum" | ||||
|           display-format="{0}" | ||||
|           css-class="text-white !text-right" | ||||
|           :customize-text="(e: any) => formatNumber(e.value)" | ||||
|         /> | ||||
|         <DxTotalItem summary-type="sum" display-format="Total" show-in-column="nama_ulp" | ||||
|           css-class="text-white !text-left" /> | ||||
|         <DxTotalItem column="mom_bulan_kemarin" summary-type="sum" display-format="{0}" | ||||
|           css-class="text-white !text-right" :customize-text="(e: any) => formatNumber(e.value)" /> | ||||
|         <DxTotalItem column="mom_bulan_ini" summary-type="sum" display-format="{0}" css-class="text-white !text-right" | ||||
|           :customize-text="(e: any) => formatNumber(e.value)" /> | ||||
|         <DxTotalItem column="persen_mom" summary-type="avg" display-format="{0}" css-class="text-white !text-right" | ||||
|           :customize-text="(e: any) => formatPercentage(e.value)" /> | ||||
|         <DxTotalItem column="yoy_tahun_kemarin" summary-type="sum" display-format="{0}" | ||||
|           css-class="text-white !text-right" :customize-text="(e: any) => formatNumber(e.value)" /> | ||||
|  | ||||
|         <DxTotalItem | ||||
|           column="yoy_tahun_ini" | ||||
|           summary-type="sum" | ||||
|           display-format="{0}" | ||||
|           css-class="text-white !text-right" | ||||
|           :customize-text="(e: any) => formatNumber(e.value)" | ||||
|         /> | ||||
|         <DxTotalItem | ||||
|           column="persen_yoy" | ||||
|           summary-type="avg" | ||||
|           display-format="{0}" | ||||
|           css-class="text-white !text-right" | ||||
|           :customize-text="(e: any) => formatPercentage(e.value)" | ||||
|         /> | ||||
|         <DxTotalItem column="yoy_tahun_ini" summary-type="sum" display-format="{0}" css-class="text-white !text-right" | ||||
|           :customize-text="(e: any) => formatNumber(e.value)" /> | ||||
|         <DxTotalItem column="persen_yoy" summary-type="avg" display-format="{0}" css-class="text-white !text-right" | ||||
|           :customize-text="(e: any) => formatPercentage(e.value)" /> | ||||
|  | ||||
|         <DxGroupItem | ||||
|           :show-in-group-footer="false" | ||||
|           :align-by-column="true" | ||||
|           summary-type="sum" | ||||
|           display-format="{0}" | ||||
|           show-in-column="mom_bulan_kemarin" | ||||
|           column="mom_bulan_kemarin" | ||||
|           css-class="!text-right" | ||||
|           :customize-text="(e: any) => formatNumber(e.value)" | ||||
|         /> | ||||
|         <DxGroupItem | ||||
|           :show-in-group-footer="false" | ||||
|           :align-by-column="true" | ||||
|           summary-type="sum" | ||||
|           show-in-column="mom_bulan_ini" | ||||
|           column="mom_bulan_ini" | ||||
|           css-class="!text-right" | ||||
|           :customize-text="(e: any) => formatNumber(e.value)" | ||||
|         /> | ||||
|         <DxGroupItem | ||||
|           :show-in-group-footer="false" | ||||
|           :align-by-column="true" | ||||
|           summary-type="sum" | ||||
|           show-in-column="persen_mom" | ||||
|           column="persen_mom" | ||||
|           css-class="!text-right" | ||||
|           :customize-text="(e: any) => formatPercentage(e.value)" | ||||
|         /> | ||||
|         <DxGroupItem | ||||
|           :show-in-group-footer="false" | ||||
|           :align-by-column="true" | ||||
|           summary-type="sum" | ||||
|           show-in-column="yoy_tahun_kemarin" | ||||
|           column="yoy_tahun_kemarin" | ||||
|           css-class="!text-right" | ||||
|           :customize-text="(e: any) => formatNumber(e.value)" | ||||
|         /> | ||||
|         <DxGroupItem | ||||
|           :show-in-group-footer="false" | ||||
|           :align-by-column="true" | ||||
|           summary-type="sum" | ||||
|           show-in-column="yoy_tahun_ini" | ||||
|           column="yoy_tahun_ini" | ||||
|           css-class="!text-right" | ||||
|           :customize-text="(e: any) => formatNumber(e.value)" | ||||
|         /> | ||||
|         <DxGroupItem | ||||
|           :show-in-group-footer="false" | ||||
|           :align-by-column="true" | ||||
|           summary-type="sum" | ||||
|           show-in-column="persen_yoy" | ||||
|           column="persen_yoy" | ||||
|           css-class="!text-right" | ||||
|           :customize-text="(e: any) => formatPercentage(e.value)" | ||||
|         /> | ||||
|         <DxGroupItem :show-in-group-footer="false" :align-by-column="true" summary-type="sum" display-format="{0}" | ||||
|           show-in-column="mom_bulan_kemarin" column="mom_bulan_kemarin" css-class="!text-right" | ||||
|           :customize-text="(e: any) => formatNumber(e.value)" /> | ||||
|         <DxGroupItem :show-in-group-footer="false" :align-by-column="true" summary-type="sum" | ||||
|           show-in-column="mom_bulan_ini" column="mom_bulan_ini" css-class="!text-right" | ||||
|           :customize-text="(e: any) => formatNumber(e.value)" /> | ||||
|         <DxGroupItem :show-in-group-footer="false" :align-by-column="true" summary-type="sum" | ||||
|           show-in-column="persen_mom" column="persen_mom" css-class="!text-right" | ||||
|           :customize-text="(e: any) => formatPercentage(e.value)" /> | ||||
|         <DxGroupItem :show-in-group-footer="false" :align-by-column="true" summary-type="sum" | ||||
|           show-in-column="yoy_tahun_kemarin" column="yoy_tahun_kemarin" css-class="!text-right" | ||||
|           :customize-text="(e: any) => formatNumber(e.value)" /> | ||||
|         <DxGroupItem :show-in-group-footer="false" :align-by-column="true" summary-type="sum" | ||||
|           show-in-column="yoy_tahun_ini" column="yoy_tahun_ini" css-class="!text-right" | ||||
|           :customize-text="(e: any) => formatNumber(e.value)" /> | ||||
|         <DxGroupItem :show-in-group-footer="false" :align-by-column="true" summary-type="sum" | ||||
|           show-in-column="persen_yoy" column="persen_yoy" css-class="!text-right" | ||||
|           :customize-text="(e: any) => formatPercentage(e.value)" /> | ||||
|       </DxSummary> | ||||
|     </DxDataGrid> | ||||
|   </div> | ||||
| @@ -294,7 +135,7 @@ import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers' | ||||
| import { apolloClient } from '@/utils/api/api.graphql' | ||||
| import { provideApolloClient } from '@vue/apollo-composable' | ||||
| import BufferDialog from '@/components/Dialogs/BufferDialog.vue' | ||||
| import { exportToPDF, exportToXLSX,exportToDOCX} from '@/report/Monalisa/Gangguan/Rekap/MonalisaGR_LaporUlang' | ||||
| import { exportToPDF, exportToXLSX, exportToDOCX } from '@/report/Monalisa/Gangguan/Rekap/MonalisaGR_LaporUlang' | ||||
|  | ||||
| const client = apolloClient() | ||||
| provideApolloClient(client) | ||||
| @@ -392,6 +233,7 @@ const onExporting = (e: any) => { | ||||
|   } else if (e.format === 'xlsx') { | ||||
|     exportToXLSX(reportMeta.value, e) | ||||
|   } else { | ||||
|     exportToDOCX(reportMeta.value, data.value) | ||||
|   } | ||||
| } | ||||
| const getDetail = async () => { | ||||
|   | ||||
		Reference in New Issue
	
	Block a user