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

Refactor detail dialog in Gangguan pages

Browse Source
This commit is contained in:
Dede Fuji Abdul 2024-03-30 13:37:06 +07:00
parent bd137bcc9b
commit f671f423dc
3 changed files with 119 additions and 142 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
src/components/Pages/Gangguan/Daftar/DGangguan_BM.vue
View File

@ -182,17 +182,38 @@
</DxDataGrid>
</div>
<DetailDialog
:open="dialogDetail"
title="Daftar Gangguan Berdasarkan Media"
@on-close="closeDialog"
>
<DetailDialog :open="dialogDetail" title="Detail Gangguan" @on-close="closeDialog">
<div class="w-full 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-[170px] text-gray-800">No Laporan:</h3>
<InputText :readonly="true" :value="dataSelected.no_laporan" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[170px] text-gray-800">Nama Pelapor:</h3>
<InputText :readonly="true" :value="dataSelected?.nama_pelapor" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[170px] text-gray-800">No Telp Pelapor:</h3>
<InputText :readonly="true" :value="dataSelected?.no_telp_pelapor" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[170px] text-gray-800">Alamat Pelapor:</h3>
<InputText :readonly="true" :value="dataSelected?.alamat_pelapor" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[170px] text-gray-800">Keterangan Pelapor:</h3>
<InputText :readonly="true" :value="dataSelected?.keterangan_pelapor" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[170px] text-gray-800">Status :</h3>
<InputText :readonly="true" :value="dataSelected?.status_akhir" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[170px] text-gray-800">Tgl Lapor:</h3>
<InputText :readonly="true" :value="dataSelected?.waktu_lapor" class-name="flex-1" />
@ -234,36 +255,6 @@
/>
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[170px] text-gray-800">Status :</h3>
<InputText :readonly="true" :value="dataSelected?.status_akhir" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[170px] text-gray-800">IDPEL/NOMETER:</h3>
<InputText :readonly="true" :value="dataSelected?.idpel_nometer" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[170px] text-gray-800">Nama Pelapor:</h3>
<InputText :readonly="true" :value="dataSelected?.nama_pelapor" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[170px] text-gray-800">Alamat Pelapor:</h3>
<InputText :readonly="true" :value="dataSelected?.alamat_pelapor" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[170px] text-gray-800">No Telp Pelapor:</h3>
<InputText :readonly="true" :value="dataSelected?.no_telp_pelapor" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[170px] text-gray-800">Keterangan Pelapor:</h3>
<InputText :readonly="true" :value="dataSelected?.keterangan_pelapor" class-name="flex-1" />
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[170px] text-gray-800">Sumper Lapor:</h3>
<InputText :readonly="true" :value="dataSelected?.media" class-name="flex-1" />

26
src/components/Pages/Gangguan/Daftar/DGangguan_DMAPKT.vue
View File

@ -182,11 +182,7 @@
</DxDataGrid>
</div>
<DetailDialog
:open="dialogDetail"
title="Daftar Gangguan Diselesaikan Mobile APKT"
@on-close="closeDialog"
>
<DetailDialog :open="dialogDetail" title="Detail Gangguan" @on-close="closeDialog">
<div class="w-full 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-[170px] text-gray-800">No Laporan:</h3>
@ -278,26 +274,6 @@
class-name="flex-1"
/>
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[170px] text-gray-800">Penyebab:</h3>
<InputText
:readonly="true"
type="textarea"
:value="dataSelected?.penyebab"
class-name="flex-1"
/>
</div>
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[170px] text-gray-800">Tindakan:</h3>
<InputText
:readonly="true"
type="textarea"
:value="dataSelected?.tindakan"
class-name="flex-1"
/>
</div>
</div>
</DetailDialog>
</template>

174
src/components/Pages/Gangguan/Rekap/RGangguan_JenisGangguan.vue
View File

@ -69,10 +69,13 @@
:width="120"
alignment="center"
data-field="sub_kelompok"
caption="Kelompok"
css-class="custom-table-column"
group-index="0"
:group-index="0"
caption=""
cell-template="formatText"
:calculate-group-value="
(rowData: any) => `${rowData.sub_kelompok} (${rowData.nama_sub_kelompok})`
"
/>
<DxColumn
:width="150"
@ -562,6 +565,7 @@ const filterData = async (params: any) => {
return {
no: ++index,
sub_kelompok: item.sub_kelompok,
nama_sub_kelompok: item.nama_sub_kelompok,
kode: item.kode,
jenisGangguan: item.tipe_permasalahan,
laporan: {
@ -620,119 +624,125 @@ onMounted(() => {
if (import.meta.env.DEV) {
data.value = [
{
id: 0,
kode: '01a',
nama_sub_kelompok: 'Kelompok sambungan tenaga listrik dan APP ',
sub_kelompok: '00',
avg_durasi_recovery: 0.0,
avg_durasi_response: 0.0,
max_durasi_recovery: 0,
max_durasi_response: 0,
min_durasi_recovery: 0,
min_durasi_response: 0,
persen_inproses: 0.0,
persen_selesai: 0.0,
tipe_permasalahan: 'Pelebur pembatas putus/rusak',
total: 0,
total_selesai: 0,
persen_selesai: 0,
total_inproses: 0,
persen_inproses: 0,
total_durasi_response: 0,
avg_durasi_response: 0,
min_durasi_response: 0,
max_durasi_response: 0,
total_dibawah_sla_response: 0,
total_diatas_sla_response: 0,
kode: '01a',
total_durasi_recovery: 0,
avg_durasi_recovery: 0,
min_durasi_recovery: 0,
max_durasi_recovery: 0,
total_durasi_response: 0,
total_diatas_sla_recovery: 0,
total_diatas_sla_response: 0,
total_dibawah_sla_recovery: 0,
total_diatas_sla_recovery: 0
total_dibawah_sla_response: 0,
total_inproses: 0,
total_selesai: 0
},
{
id: 1,
kode: '01b',
nama_sub_kelompok: 'Kelompok sambungan tenaga listrik dan APP ',
sub_kelompok: '00',
avg_durasi_recovery: 0.0,
avg_durasi_response: 0.0,
max_durasi_recovery: 0,
max_durasi_response: 0,
min_durasi_recovery: 0,
min_durasi_response: 0,
persen_inproses: 0.0,
persen_selesai: 0.0,
tipe_permasalahan: 'MCB pembatas rusak',
total: 0,
total_selesai: 0,
persen_selesai: 0,
total_inproses: 0,
persen_inproses: 0,
total_durasi_response: 0,
avg_durasi_response: 0,
min_durasi_response: 0,
max_durasi_response: 0,
total_dibawah_sla_response: 0,
total_diatas_sla_response: 0,
kode: '01b',
total_durasi_recovery: 0,
avg_durasi_recovery: 0,
min_durasi_recovery: 0,
max_durasi_recovery: 0,
total_durasi_response: 0,
total_diatas_sla_recovery: 0,
total_diatas_sla_response: 0,
total_dibawah_sla_recovery: 0,
total_diatas_sla_recovery: 0
total_dibawah_sla_response: 0,
total_inproses: 0,
total_selesai: 0
},
{
id: 2,
kode: '01c',
nama_sub_kelompok: 'Kelompok sambungan tenaga listrik dan APP ',
sub_kelompok: '00',
avg_durasi_recovery: 0.0,
avg_durasi_response: 0.0,
max_durasi_recovery: 0,
max_durasi_response: 0,
min_durasi_recovery: 0,
min_durasi_response: 0,
persen_inproses: 0.0,
persen_selesai: 0.0,
tipe_permasalahan: 'RELAY dan / atau CB rusak',
total: 0,
total_selesai: 0,
persen_selesai: 0,
total_inproses: 0,
persen_inproses: 0,
total_durasi_response: 0,
avg_durasi_response: 0,
min_durasi_response: 0,
max_durasi_response: 0,
total_dibawah_sla_response: 0,
total_diatas_sla_response: 0,
kode: '01c',
total_durasi_recovery: 0,
avg_durasi_recovery: 0,
min_durasi_recovery: 0,
max_durasi_recovery: 0,
total_durasi_response: 0,
total_diatas_sla_recovery: 0,
total_diatas_sla_response: 0,
total_dibawah_sla_recovery: 0,
total_diatas_sla_recovery: 0
total_dibawah_sla_response: 0,
total_inproses: 0,
total_selesai: 0
},
{
id: 3,
kode: '01d',
nama_sub_kelompok: 'Kelompok sambungan tenaga listrik dan APP ',
sub_kelompok: '00',
avg_durasi_recovery: 0.0,
avg_durasi_response: 0.0,
max_durasi_recovery: 0,
max_durasi_response: 0,
min_durasi_recovery: 0,
min_durasi_response: 0,
persen_inproses: 0.0,
persen_selesai: 0.0,
tipe_permasalahan: 'Pelebur putus dan LBS jatuh atau rusak',
total: 0,
total_selesai: 0,
persen_selesai: 0,
total_inproses: 0,
persen_inproses: 0,
total_durasi_response: 0,
avg_durasi_response: 0,
min_durasi_response: 0,
max_durasi_response: 0,
total_dibawah_sla_response: 0,
total_diatas_sla_response: 0,
kode: '01d',
total_durasi_recovery: 0,
avg_durasi_recovery: 0,
min_durasi_recovery: 0,
max_durasi_recovery: 0,
total_durasi_response: 0,
total_diatas_sla_recovery: 0,
total_diatas_sla_response: 0,
total_dibawah_sla_recovery: 0,
total_diatas_sla_recovery: 0
total_dibawah_sla_response: 0,
total_inproses: 0,
total_selesai: 0
},
{
id: 4,
kode: '06a',
nama_sub_kelompok: 'Kelompok sambungan tenaga listrik dan APP ',
sub_kelompok: '00',
avg_durasi_recovery: 0.0,
avg_durasi_response: 0.0,
max_durasi_recovery: 0,
max_durasi_response: 0,
min_durasi_recovery: 0,
min_durasi_response: 0,
persen_inproses: 0.0,
persen_selesai: 0.0,
tipe_permasalahan: 'Kubikel APP/komponennya rusak atau gagal bekerja',
total: 0,
total_selesai: 0,
persen_selesai: 0,
total_inproses: 0,
persen_inproses: 0,
total_durasi_response: 0,
avg_durasi_response: 0,
min_durasi_response: 0,
max_durasi_response: 0,
total_dibawah_sla_response: 0,
total_diatas_sla_response: 0,
kode: '06a',
total_durasi_recovery: 0,
avg_durasi_recovery: 0,
min_durasi_recovery: 0,
max_durasi_recovery: 0,
total_durasi_response: 0,
total_diatas_sla_recovery: 0,
total_diatas_sla_response: 0,
total_dibawah_sla_recovery: 0,
total_diatas_sla_recovery: 0
total_dibawah_sla_response: 0,
total_inproses: 0,
total_selesai: 0
}
].map((item: any, index: number) => {
return {
no: ++index,
sub_kelompok: item.sub_kelompok,
nama_sub_kelompok: item.nama_sub_kelompok,
kode: item.kode,
jenisGangguan: item.tipe_permasalahan,
laporan: {