|
|
|
@ -19,7 +19,7 @@
|
|
|
|
|
column-resizing-mode="widget"
|
|
|
|
|
:word-wrap-enabled="true"
|
|
|
|
|
>
|
|
|
|
|
<DxGrouping auto-expand-all="false" expand-mode="rowClick" />
|
|
|
|
|
<DxGrouping :auto-expand-all="false" expand-mode="rowClick" />
|
|
|
|
|
<DxSelection mode="single" />
|
|
|
|
|
<DxPaging :enabled="false" />
|
|
|
|
|
<DxScrolling column-rendering-mode="virtual" mode="virtual" />
|
|
|
|
@ -31,7 +31,32 @@
|
|
|
|
|
:allow-export-selected-data="false"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumnFixing :enabled="true" />
|
|
|
|
|
|
|
|
|
|
<DxColumn
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="Semua Unit"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
:group-index="0"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field="id_uid"
|
|
|
|
|
caption="UID"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
:group-index="1"
|
|
|
|
|
:calculate-display-value="(dataRow: any) => dataRow.nama_uid"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field="id_up3"
|
|
|
|
|
caption="UP3"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
:group-index="2"
|
|
|
|
|
:calculate-display-value="(dataRow: any) => dataRow.nama_up3"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field="nama_ulp"
|
|
|
|
@ -79,7 +104,7 @@
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field="wo_total"
|
|
|
|
|
data-type="number"
|
|
|
|
|
caption="d=b+c"
|
|
|
|
|
caption="d=a+b+c"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatNumber"
|
|
|
|
|
/>
|
|
|
|
@ -153,8 +178,528 @@
|
|
|
|
|
}}
|
|
|
|
|
</p>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<DxSummary :calculate-custom-summary="calculateCustomSummary">
|
|
|
|
|
<DxGroupItem
|
|
|
|
|
column="wo_cc123"
|
|
|
|
|
name="wo_cc123"
|
|
|
|
|
summaryType="custom"
|
|
|
|
|
:customize-text="(e: any) => formatNumber(e.value)"
|
|
|
|
|
:show-in-group-footer="false"
|
|
|
|
|
:align-by-column="true"
|
|
|
|
|
css-class="!text-right"
|
|
|
|
|
/>
|
|
|
|
|
<DxGroupItem
|
|
|
|
|
column="wo_pln_mobile"
|
|
|
|
|
name="wo_pln_mobile"
|
|
|
|
|
summaryType="custom"
|
|
|
|
|
:customize-text="(e: any) => formatNumber(e.value)"
|
|
|
|
|
:show-in-group-footer="false"
|
|
|
|
|
:align-by-column="true"
|
|
|
|
|
css-class="!text-right"
|
|
|
|
|
/>
|
|
|
|
|
<DxGroupItem
|
|
|
|
|
column="wo_comcen"
|
|
|
|
|
name="wo_comcen"
|
|
|
|
|
summaryType="custom"
|
|
|
|
|
:customize-text="(e: any) => formatNumber(e.value)"
|
|
|
|
|
:show-in-group-footer="false"
|
|
|
|
|
:align-by-column="true"
|
|
|
|
|
css-class="!text-right"
|
|
|
|
|
/>
|
|
|
|
|
<DxGroupItem
|
|
|
|
|
column="wo_total"
|
|
|
|
|
name="wo_total"
|
|
|
|
|
summary-type="custom"
|
|
|
|
|
:customize-text="(e: any) => formatNumber(e.value)"
|
|
|
|
|
:show-in-group-footer="false"
|
|
|
|
|
:align-by-column="true"
|
|
|
|
|
css-class="!text-right"
|
|
|
|
|
/>
|
|
|
|
|
<DxGroupItem
|
|
|
|
|
column="rekomendasi_mendatangkan_petugas"
|
|
|
|
|
summaryType="sum"
|
|
|
|
|
:customize-text="(e: any) => formatNumber(e.value)"
|
|
|
|
|
:show-in-group-footer="false"
|
|
|
|
|
:align-by-column="true"
|
|
|
|
|
css-class="!text-right"
|
|
|
|
|
/>
|
|
|
|
|
<DxGroupItem
|
|
|
|
|
column="rekomendasi_diberikan_ke_pelanggan"
|
|
|
|
|
summaryType="sum"
|
|
|
|
|
:customize-text="(e: any) => formatNumber(e.value)"
|
|
|
|
|
:show-in-group-footer="false"
|
|
|
|
|
:align-by-column="true"
|
|
|
|
|
css-class="!text-right"
|
|
|
|
|
/>
|
|
|
|
|
<DxGroupItem
|
|
|
|
|
column="dpld"
|
|
|
|
|
summaryType="sum"
|
|
|
|
|
:customize-text="(e: any) => formatNumber(e.value)"
|
|
|
|
|
:show-in-group-footer="false"
|
|
|
|
|
:align-by-column="true"
|
|
|
|
|
css-class="!text-right"
|
|
|
|
|
/>
|
|
|
|
|
<DxGroupItem
|
|
|
|
|
column="history_p2lt"
|
|
|
|
|
summaryType="sum"
|
|
|
|
|
:customize-text="(e: any) => formatNumber(e.value)"
|
|
|
|
|
:show-in-group-footer="false"
|
|
|
|
|
:align-by-column="true"
|
|
|
|
|
css-class="!text-right"
|
|
|
|
|
/>
|
|
|
|
|
</DxSummary>
|
|
|
|
|
</DxDataGrid>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<DetailDialog
|
|
|
|
|
:open="dialogDetail"
|
|
|
|
|
title="Detail CTT & KWH Periksa"
|
|
|
|
|
@on-close="closedialogDetail"
|
|
|
|
|
:full-width="true"
|
|
|
|
|
>
|
|
|
|
|
<div class="w-full mb-4 lg:w-[70%] lg:float-left">
|
|
|
|
|
<div class="p-4 bg-white rounded-xl lg:mr-4">
|
|
|
|
|
<DxDataGrid
|
|
|
|
|
:allow-column-reordering="true"
|
|
|
|
|
class="max-h-[calc(100vh-140px)]"
|
|
|
|
|
:data-source="dataSub"
|
|
|
|
|
:show-column-lines="true"
|
|
|
|
|
:show-row-lines="false"
|
|
|
|
|
:show-borders="true"
|
|
|
|
|
:row-alternation-enabled="true"
|
|
|
|
|
:hover-state-enabled="true"
|
|
|
|
|
@selection-changed="onDataSubSelectionChanged"
|
|
|
|
|
:column-width="100"
|
|
|
|
|
@exporting="onExportingDetail"
|
|
|
|
|
:allow-column-resizing="true"
|
|
|
|
|
column-resizing-mode="widget"
|
|
|
|
|
>
|
|
|
|
|
<DxSelection mode="single" />
|
|
|
|
|
<DxPaging :page-size="20" :enabled="true" />
|
|
|
|
|
<DxPager
|
|
|
|
|
:visible="true"
|
|
|
|
|
:allowed-page-sizes="[20, 50, 100]"
|
|
|
|
|
display-mode="full"
|
|
|
|
|
:show-page-size-selector="true"
|
|
|
|
|
:show-info="true"
|
|
|
|
|
:show-navigation-buttons="true"
|
|
|
|
|
/>
|
|
|
|
|
<!-- -->
|
|
|
|
|
<DxSearchPanel :visible="true" :highlight-case-sensitive="true" />
|
|
|
|
|
<DxExport
|
|
|
|
|
:enabled="true"
|
|
|
|
|
:formats="['pdf', 'xlsx', 'document']"
|
|
|
|
|
:allow-export-selected-data="false"
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
|
|
<DxColumn
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
:width="50"
|
|
|
|
|
alignment="center"
|
|
|
|
|
:calculate-display-value="(item: any) => dataSub.findIndex((i: any) => i == item) + 1"
|
|
|
|
|
data-type="number"
|
|
|
|
|
caption="No"
|
|
|
|
|
cell-template="formatNumber"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="UIW/D"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="UP3"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="Rayon"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="IDPEL"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="NOMETER"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="No. Telpon"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="Nama"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="Alamat"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="Sumber Lapor"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="No Laporan"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption=""
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="08"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="70"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="71"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="41"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="44"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="45"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="46"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="37"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="47"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="Jenis DLPD"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="Keterangan DLPD"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="Bulan Tahun DLPD"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="No. Agenda P2TL"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="Tgl Mohon P2T"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="Tgl Sah P2TL"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field="Rekomendasi Sistem"
|
|
|
|
|
caption="Tgl/Jam Lapor"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="Petugas Regu"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
<DxColumn
|
|
|
|
|
:width="150"
|
|
|
|
|
alignment="center"
|
|
|
|
|
data-field=""
|
|
|
|
|
caption="User VCC"
|
|
|
|
|
css-class="custom-table-column"
|
|
|
|
|
cell-template="formatText"
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
|
|
<template #formatText="{ data }">
|
|
|
|
|
<p class="text-left cursor-pointer">
|
|
|
|
|
{{ data.text }}
|
|
|
|
|
</p>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<template #formatNumber="{ data }">
|
|
|
|
|
<p class="text-right cursor-pointer">
|
|
|
|
|
{{ data.text }}
|
|
|
|
|
</p>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<template #formatTime="{ data }">
|
|
|
|
|
<p>
|
|
|
|
|
{{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
|
|
|
|
|
</p>
|
|
|
|
|
</template>
|
|
|
|
|
</DxDataGrid>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="w-full mb-4 lg:w-[30%] lg:float-right">
|
|
|
|
|
<div class="p-4 space-y-2 bg-white rounded-xl">
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">UIW/D:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">UP3:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">Rayon:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">IDPEL:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">NOMETER:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">No. Telpon:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">Nama:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">Alamat:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">Sumber Lapor:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">No Laporan:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">08:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">70:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">71:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">41:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">44:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">45:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">46:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">37:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">47:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">Jenis DLPD:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">Keterangan DLPD:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">Bulan Tahun DLPD:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">No. Agenda P2TL:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">Tgl Mohon P2T:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">Tgl Sah P2TL:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">Tgl/Jam Lapor:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">Petugas Regu:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row items-center justify-between w-full">
|
|
|
|
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">User VCC:</h3>
|
|
|
|
|
<InputText :readonly="true" value="" class-name="flex-1" />
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</DetailDialog>
|
|
|
|
|
|
|
|
|
|
<BufferDialog v-if="loadingData || loadingSubData" />
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
@ -165,12 +710,15 @@ import {
|
|
|
|
|
DxColumn,
|
|
|
|
|
DxColumnFixing,
|
|
|
|
|
DxExport,
|
|
|
|
|
DxGroupItem,
|
|
|
|
|
DxGrouping,
|
|
|
|
|
DxLoadPanel,
|
|
|
|
|
DxPager,
|
|
|
|
|
DxPaging,
|
|
|
|
|
DxScrolling,
|
|
|
|
|
DxSearchPanel,
|
|
|
|
|
DxSelection
|
|
|
|
|
DxSelection,
|
|
|
|
|
DxSummary
|
|
|
|
|
} from 'devextreme-vue/data-grid'
|
|
|
|
|
import { jsPDF } from 'jspdf'
|
|
|
|
|
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
|
|
|
|
@ -185,6 +733,9 @@ import { apolloClient, queries, requestGraphQl } from '@/utils/api/api.graphql'
|
|
|
|
|
import { provideApolloClient } from '@vue/apollo-composable'
|
|
|
|
|
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
|
|
|
|
|
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
|
|
|
|
|
import DetailDialog from '@/components/Dialogs/DetailDialog.vue'
|
|
|
|
|
import { formatWaktu } from '@/components/Form/FiltersType/reference'
|
|
|
|
|
import InputText from '@/components/InputText.vue'
|
|
|
|
|
|
|
|
|
|
const client = apolloClient()
|
|
|
|
|
provideApolloClient(client)
|
|
|
|
@ -201,6 +752,46 @@ const closedialogDetail = () => (dialogDetail.value = false)
|
|
|
|
|
const loadingData = ref(false)
|
|
|
|
|
const loadingSubData = ref(false)
|
|
|
|
|
|
|
|
|
|
let cc123 = 0
|
|
|
|
|
let plnMobile = 0
|
|
|
|
|
let comcen = 0
|
|
|
|
|
const calculateCustomSummary = (options: any) => {
|
|
|
|
|
if (options.name === 'wo_cc123') {
|
|
|
|
|
if (options.summaryProcess === 'calculate') {
|
|
|
|
|
cc123 += options.value
|
|
|
|
|
} else if (options.summaryProcess === 'finalize') {
|
|
|
|
|
options.totalValue = cc123
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if (options.name === 'wo_pln_mobile') {
|
|
|
|
|
if (options.summaryProcess === 'calculate') {
|
|
|
|
|
plnMobile += options.value
|
|
|
|
|
} else if (options.summaryProcess === 'finalize') {
|
|
|
|
|
options.totalValue = plnMobile
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if (options.name === 'wo_comcen') {
|
|
|
|
|
if (options.summaryProcess === 'calculate') {
|
|
|
|
|
comcen += options.value
|
|
|
|
|
} else if (options.summaryProcess === 'finalize') {
|
|
|
|
|
options.totalValue = comcen
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if (options.name === 'wo_total') {
|
|
|
|
|
if (options.summaryProcess === 'start') {
|
|
|
|
|
plnMobile = 0
|
|
|
|
|
cc123 = 0
|
|
|
|
|
comcen = 0
|
|
|
|
|
} else if (options.summaryProcess === 'calculate') {
|
|
|
|
|
} else if (options.summaryProcess === 'finalize') {
|
|
|
|
|
options.totalValue = plnMobile + cc123 + comcen
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const onExporting = (e: any) => {
|
|
|
|
|
if (e.format === 'pdf') {
|
|
|
|
|
const doc = new jsPDF()
|
|
|
|
@ -230,6 +821,8 @@ const onExporting = (e: any) => {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const onExportingDetail = (e: any) => {}
|
|
|
|
|
|
|
|
|
|
const resetData = () => {
|
|
|
|
|
data.value = []
|
|
|
|
|
dataSub.value = []
|
|
|
|
|