Update font size and label styles
This commit is contained in:
parent
9cb4551bb9
commit
cc888d2cec
@ -63,3 +63,6 @@
|
||||
.dx-datagrid-headers .dx-datagrid-table .dx-row > td{
|
||||
font-size: 10px !important;
|
||||
}
|
||||
.dx-datagrid .dx-row > td{
|
||||
font-size: 10px !important;
|
||||
}
|
@ -927,6 +927,22 @@ body {
|
||||
color: rgb(1 36 45 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.filter-input-label {
|
||||
margin-bottom: 0.5rem;
|
||||
display: block;
|
||||
font-size: 0.875rem;
|
||||
line-height: 1.25rem;
|
||||
font-weight: 600;
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(31 41 55 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
@media (min-width: 640px) {
|
||||
.filter-input-label {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.sr-only {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
@ -1253,10 +1269,6 @@ body {
|
||||
margin-top: -1px;
|
||||
}
|
||||
|
||||
.mb-0 {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
.mb-1 {
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
@ -5861,16 +5873,6 @@ body {
|
||||
font-size: 1.5rem;
|
||||
line-height: 2rem;
|
||||
}
|
||||
|
||||
.md\:text-3xl {
|
||||
font-size: 1.875rem;
|
||||
line-height: 2.25rem;
|
||||
}
|
||||
|
||||
.md\:text-xl {
|
||||
font-size: 1.25rem;
|
||||
line-height: 1.75rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
|
@ -47,4 +47,7 @@
|
||||
.custom-table-column {
|
||||
@apply !align-middle text-sm font-medium text-primary-800;
|
||||
}
|
||||
.filter-input-label {
|
||||
@apply block mb-2 text-sm font-semibold text-gray-800 sm:mb-0;
|
||||
}
|
||||
}
|
||||
|
@ -59,7 +59,7 @@ onMounted(() => {
|
||||
|
||||
<template>
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Induk Distribusi/Wilayah:</label
|
||||
>
|
||||
|
||||
@ -67,7 +67,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Pelaksanaan Pelayanan Pelanggan:</label
|
||||
>
|
||||
|
||||
@ -80,7 +80,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Posko:</label>
|
||||
<label class="filter-input-label">Posko:</label>
|
||||
|
||||
<Select
|
||||
@update:selected="setPosko($event)"
|
||||
@ -91,7 +91,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Periode Tanggal:</label>
|
||||
<label class="filter-input-label">Periode Tanggal:</label>
|
||||
<DatePicker @update:date-value="(value) => (data.periode = value)" />
|
||||
</div>
|
||||
</template>
|
||||
|
@ -56,7 +56,7 @@ onMounted(() => {
|
||||
|
||||
<template>
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Induk Distribusi/Wilayah:</label
|
||||
>
|
||||
|
||||
@ -64,7 +64,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Pelaksanaan Pelayanan Pelanggan:</label
|
||||
>
|
||||
|
||||
@ -77,7 +77,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Unit Layanan Pelanggan:</label>
|
||||
<label class="filter-input-label">Unit Layanan Pelanggan:</label>
|
||||
|
||||
<Select
|
||||
@update:selected="setUlp($event)"
|
||||
@ -88,13 +88,13 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Periode Tanggal:</label>
|
||||
<label class="filter-input-label">Periode Tanggal:</label>
|
||||
|
||||
<DatePicker @update:date-value="(value) => (data.periode = value)" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Lapor Ulang:</label>
|
||||
<label class="filter-input-label">Lapor Ulang:</label>
|
||||
|
||||
<div class="grid grid-flow-col auto-cols-auto gap-x-1.5">
|
||||
<InputNumber @update:time-value="(value) => (data.minJmlLapor = value)" />
|
||||
|
@ -103,31 +103,31 @@ onMounted(() => {
|
||||
|
||||
<template>
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Unit Induk Distribusi/Wilayah:</label>
|
||||
<label class="filter-input-label">Unit Induk Distribusi/Wilayah:</label>
|
||||
|
||||
<Select @update:selected="setUid($event)" :data="itemsUid" :placeholder="uidPlaceholder" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Unit Pelaksanaan Pelayanan Pelanggan:</label>
|
||||
<label class="filter-input-label">Unit Pelaksanaan Pelayanan Pelanggan:</label>
|
||||
|
||||
<Select @update:selected="setUp3($event)" :data="itemsUp3" :selected="up3" :placeholder="up3Placeholder" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Unit Layanan Pelanggan:</label>
|
||||
<label class="filter-input-label">Unit Layanan Pelanggan:</label>
|
||||
|
||||
<Select @update:selected="setUlp($event)" :data="itemsUlp" :placeholder="ulpPlaceholder" :selected="ulp" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Periode Tanggal:</label>
|
||||
<label class="filter-input-label">Periode Tanggal:</label>
|
||||
|
||||
<DatePicker @update:date-value="(value) => (data.periode = value)" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Durasi:</label>
|
||||
<label class="filter-input-label">Durasi:</label>
|
||||
|
||||
<div class="flex flex-col gap-y-1">
|
||||
<Select @update:selected="changeDuration($event)" :data="sla" placeholder="Durasi Menit" />
|
||||
|
@ -80,7 +80,7 @@ onMounted(() => {
|
||||
|
||||
<template>
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Unit Induk Distribusi/Wilayah:</label>
|
||||
<label class="filter-input-label">Unit Induk Distribusi/Wilayah:</label>
|
||||
|
||||
<Select
|
||||
@update:selected="setUid($event)"
|
||||
@ -90,7 +90,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Pelaksanaan Pelayanan Pelanggan:</label
|
||||
>
|
||||
|
||||
@ -102,7 +102,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Layanan Pelanggan:</label
|
||||
>
|
||||
|
||||
@ -114,13 +114,13 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Periode Tanggal:</label>
|
||||
<label class="filter-input-label">Periode Tanggal:</label>
|
||||
|
||||
<DatePicker @update:date-value="(value) => data.periode = value" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Durasi:</label>
|
||||
<label class="filter-input-label">Durasi:</label>
|
||||
|
||||
<div class="flex flex-col gap-y-1">
|
||||
<Select
|
||||
|
@ -58,7 +58,7 @@ onMounted(() => {
|
||||
|
||||
<template>
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Induk Distribusi/Wilayah:</label
|
||||
>
|
||||
|
||||
@ -66,7 +66,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Pelaksanaan Pelayanan Pelanggan:</label
|
||||
>
|
||||
|
||||
@ -79,7 +79,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Unit Layanan Pelanggan:</label>
|
||||
<label class="filter-input-label">Unit Layanan Pelanggan:</label>
|
||||
<Select
|
||||
@update:selected="setUlp($event)"
|
||||
:data="itemsUlp"
|
||||
@ -89,12 +89,12 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Periode Tanggal:</label>
|
||||
<label class="filter-input-label">Periode Tanggal:</label>
|
||||
<DatePicker @update:date-value="(value) => (data.periode = value)" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Group By Kode Unit Distribusi:</label
|
||||
>
|
||||
|
||||
|
@ -44,24 +44,24 @@ onMounted(() => {
|
||||
|
||||
<template>
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Distribusi/Wilayah:</label>
|
||||
<label class="filter-input-label">Distribusi/Wilayah:</label>
|
||||
<Select :data="itemsUid" @update:selected="setUid($event)" :placeholder="uidPlaceholder" :selected="uid" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Area:</label>
|
||||
<label class="filter-input-label">Area:</label>
|
||||
<Select @update:selected="setUp3($event)" :data="itemsUp3" :selected="up3" :placeholder="up3Placeholder" />
|
||||
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Posko:</label>
|
||||
<label class="filter-input-label">Posko:</label>
|
||||
<Select @update:selected="setPosko($event)" :data="itemsPosko" :selected="posko" :placeholder="poskoPlaceholder" />
|
||||
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Periode Tanggal:</label>
|
||||
<label class="filter-input-label">Periode Tanggal:</label>
|
||||
|
||||
<DatePicker @update:date-value="(value) => data.periode = value" />
|
||||
</div>
|
||||
|
@ -21,19 +21,19 @@ const data = ref({
|
||||
|
||||
<template>
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Jenis Pengaduan:</label>
|
||||
<label class="filter-input-label">Jenis Pengaduan:</label>
|
||||
|
||||
<InlineRadioGroup :radio-items="[{id: 1, title: 'Gangguan', checked: true}, {id: 2, title: 'Keluhan'}]" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Cari Report Number:</label>
|
||||
<label class="filter-input-label">Cari Report Number:</label>
|
||||
|
||||
<InputWithFilter placeholder="cari report" :filters="[{id: 1, title: 'Nama Pelapor'}]" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Periode Tanggal:</label>
|
||||
<label class="filter-input-label">Periode Tanggal:</label>
|
||||
|
||||
<DatePicker @update:date-value="(value) => data.periode = value" />
|
||||
</div>
|
||||
|
@ -69,7 +69,7 @@ onMounted(() => {
|
||||
|
||||
<template>
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Induk Distribusi/Wilayah:</label
|
||||
>
|
||||
|
||||
@ -82,7 +82,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Pelaksanaan Pelayanan Pelanggan:</label
|
||||
>
|
||||
|
||||
@ -95,7 +95,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Posko:</label>
|
||||
<label class="filter-input-label">Posko:</label>
|
||||
|
||||
<Select
|
||||
:data="itemsPosko"
|
||||
@ -106,7 +106,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Media:</label>
|
||||
<label class="filter-input-label">Media:</label>
|
||||
|
||||
<Select
|
||||
:selected="media"
|
||||
@ -117,7 +117,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Periode Tanggal:</label>
|
||||
<label class="filter-input-label">Periode Tanggal:</label>
|
||||
|
||||
<DatePicker @update:date-value="(value) => (data.periode = value)" />
|
||||
</div>
|
||||
|
@ -10,13 +10,13 @@ import { ref } from 'vue';
|
||||
|
||||
<template>
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Periode Tanggal:</label>
|
||||
<label class="filter-input-label">Periode Tanggal:</label>
|
||||
|
||||
<DatePicker @update:date-value="(value) => data.periode = value" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Unit PLN:</label>
|
||||
<label class="filter-input-label">Unit PLN:</label>
|
||||
|
||||
<div class="flex flex-col gap-y-1">
|
||||
<Select placeholder="Pilih Unit" />
|
||||
@ -29,13 +29,13 @@ import { ref } from 'vue';
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Status:</label>
|
||||
<label class="filter-input-label">Status:</label>
|
||||
|
||||
<Select placeholder="Pilih Status"/>
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>SLA:</label
|
||||
>
|
||||
|
||||
@ -43,7 +43,7 @@ import { ref } from 'vue';
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Pencarian:</label>
|
||||
<label class="filter-input-label">Pencarian:</label>
|
||||
|
||||
<InputWithFilter placeholder="cari report" :filters="[{id: 1, title: 'Pilih Jenis'}]" />
|
||||
</div>
|
||||
|
@ -35,24 +35,24 @@ onMounted(() => {
|
||||
|
||||
<template>
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Unit Induk Distribusi/Wilayah:</label>
|
||||
<label class="filter-input-label">Unit Induk Distribusi/Wilayah:</label>
|
||||
|
||||
<Select @update:selected="selectedUid($event)" :data="itemsUid" placeholder="Semua Unit Induk Distribusi/Wilayah" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Unit Pelaksanaan Pelayanan Pelanggan:</label>
|
||||
<label class="filter-input-label">Unit Pelaksanaan Pelayanan Pelanggan:</label>
|
||||
|
||||
<Select @update:selected="selectedUp3Posko($event)" :data="itemsUp3" :selected="up3" placeholder="Semua Unit Pelaksanaan Pelayanan Pelanggan" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Posko:</label>
|
||||
<label class="filter-input-label">Posko:</label>
|
||||
|
||||
<Select @update:selected="selectedPosko($event)" :data="itemsPosko" :selected="posko" placeholder="Semua Posko" />
|
||||
</div>
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Jenis Transaksi:</label>
|
||||
<label class="filter-input-label">Jenis Transaksi:</label>
|
||||
|
||||
<SelectMulti
|
||||
:tags="jenisTransakasi"
|
||||
@ -62,7 +62,7 @@ onMounted(() => {
|
||||
/>
|
||||
</div>
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Periode Tanggal:</label>
|
||||
<label class="filter-input-label">Periode Tanggal:</label>
|
||||
<DatePicker @update:date-value="(value) => data.periode = value" />
|
||||
</div>
|
||||
</template>
|
||||
|
@ -100,31 +100,31 @@ onMounted(() => {
|
||||
|
||||
<template>
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Regional:</label>
|
||||
<label class="filter-input-label">Regional:</label>
|
||||
|
||||
<Select @update:selected="setRegional($event)" :data="itemsRegional" :placeholder="regionalPlaceholder" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Unit Induk Distribusi/Wilayah:</label>
|
||||
<label class="filter-input-label">Unit Induk Distribusi/Wilayah:</label>
|
||||
|
||||
<Select @update:selected="setUid($event)" :data="itemsUid" :selected="uid" :placeholder="uidPlaceholder" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Unit Pelaksanaan Pelayanan Pelanggan:</label>
|
||||
<label class="filter-input-label">Unit Pelaksanaan Pelayanan Pelanggan:</label>
|
||||
|
||||
<Select @update:selected="setUp3($event)" :selected="uppp" :data="itemsUp3" :placeholder="up3Placholder" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Unit Layanan Pelanggan:</label>
|
||||
<label class="filter-input-label">Unit Layanan Pelanggan:</label>
|
||||
|
||||
<Select @update:selected="setUlp($event)" :data="itemsUlp" :selected="ulp" :placeholder="ulpPlaceholder" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Periode</label>
|
||||
<label class="filter-input-label">Periode</label>
|
||||
|
||||
<div class="grid grid-cols-2 gap-x-2">
|
||||
<Select @update:selected="setMonth($event)" :data="months" :placeholder="bulanPlaceholder" />
|
||||
|
@ -60,7 +60,7 @@ onMounted(() => {
|
||||
|
||||
<template>
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Induk Distribusi/Wilayah:</label
|
||||
>
|
||||
|
||||
@ -68,7 +68,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Pelaksanaan Pelayanan Pelanggan:</label
|
||||
>
|
||||
|
||||
@ -81,7 +81,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Unit Layanan Pelanggan:</label>
|
||||
<label class="filter-input-label">Unit Layanan Pelanggan:</label>
|
||||
|
||||
<Select
|
||||
@update:selected="setUlp($event)"
|
||||
@ -92,7 +92,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Periode Tanggal:</label>
|
||||
<label class="filter-input-label">Periode Tanggal:</label>
|
||||
|
||||
<DatePicker @update:date-value="(value) => (data.periode = value)" />
|
||||
</div>
|
||||
|
@ -44,7 +44,7 @@ onMounted(() => {
|
||||
|
||||
<template>
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Unit Induk Distribusi/Wilayah:</label>
|
||||
<label class="filter-input-label">Unit Induk Distribusi/Wilayah:</label>
|
||||
|
||||
<Select
|
||||
@update:selected="setUid($event)"
|
||||
@ -54,7 +54,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Pelaksanaan Pelayanan Pelanggan:</label
|
||||
>
|
||||
|
||||
@ -66,7 +66,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Layanan Pelanggan:</label
|
||||
>
|
||||
|
||||
@ -78,7 +78,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Jenis Laporan:</label
|
||||
>
|
||||
|
||||
@ -94,7 +94,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Periode Tanggal:</label>
|
||||
<label class="filter-input-label">Periode Tanggal:</label>
|
||||
|
||||
<DatePicker @update:date-value="(value) => data.periode = value" />
|
||||
</div>
|
||||
|
@ -58,7 +58,7 @@ onMounted(() => {
|
||||
|
||||
<template>
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Induk Distribusi/Wilayah:</label
|
||||
>
|
||||
|
||||
@ -66,7 +66,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Pelaksanaan Pelayanan Pelanggan:</label
|
||||
>
|
||||
|
||||
@ -74,13 +74,13 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Posko:</label>
|
||||
<label class="filter-input-label">Posko:</label>
|
||||
|
||||
<Select @update:selected="setPosko($event)" :data="itemsPosko" :selected="posko" :placeholder="poskoPlaceholder" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Periode Tanggal:</label>
|
||||
<label class="filter-input-label">Periode Tanggal:</label>
|
||||
<DatePicker @update:date-value="(value) => data.periode = value" />
|
||||
</div>
|
||||
</template>
|
||||
|
@ -57,7 +57,7 @@ onMounted(() => {
|
||||
|
||||
<template>
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Induk Distribusi/Wilayah:</label
|
||||
>
|
||||
|
||||
@ -65,7 +65,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Pelaksanaan Pelayanan Pelanggan:</label
|
||||
>
|
||||
|
||||
@ -78,7 +78,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Posko:</label>
|
||||
<label class="filter-input-label">Posko:</label>
|
||||
|
||||
<Select
|
||||
@update:selected="setPosko($event)"
|
||||
@ -89,13 +89,13 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Periode Tanggal:</label>
|
||||
<label class="filter-input-label">Periode Tanggal:</label>
|
||||
|
||||
<DatePicker @update:date-value="(value) => (data.periode = value)" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Lapor Ulang:</label>
|
||||
<label class="filter-input-label">Lapor Ulang:</label>
|
||||
|
||||
<div class="grid grid-flow-col auto-cols-auto gap-x-1.5">
|
||||
<InputNumber
|
||||
|
@ -134,7 +134,7 @@ onMounted(() => {
|
||||
|
||||
<template>
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Induk Distribusi/Wilayah:</label
|
||||
>
|
||||
|
||||
@ -142,7 +142,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Pelaksanaan Pelayanan Pelanggan:</label
|
||||
>
|
||||
|
||||
@ -155,7 +155,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Posko:</label>
|
||||
<label class="filter-input-label">Posko:</label>
|
||||
|
||||
<Select
|
||||
@update:selected="setPosko($event)"
|
||||
@ -166,13 +166,13 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Periode Tanggal:</label>
|
||||
<label class="filter-input-label">Periode Tanggal:</label>
|
||||
|
||||
<DatePicker @update:date-value="(value) => (data.periode = value)" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Durasi:</label>
|
||||
<label class="filter-input-label">Durasi:</label>
|
||||
|
||||
<div class="flex flex-col gap-y-1">
|
||||
<Select @update:selected="changeDuration($event)" :data="sla" placeholder="Durasi Menit" />
|
||||
|
@ -43,7 +43,7 @@ onMounted(() => {
|
||||
|
||||
<template>
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Induk Distribusi/Wilayah:</label
|
||||
>
|
||||
|
||||
@ -51,7 +51,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Pelaksanaan Pelayanan Pelanggan:</label
|
||||
>
|
||||
|
||||
@ -64,7 +64,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Periode Tanggal:</label>
|
||||
<label class="filter-input-label">Periode Tanggal:</label>
|
||||
|
||||
<DatePicker @update:date-value="(value) => (data.periode = value)" />
|
||||
</div>
|
||||
|
@ -61,7 +61,7 @@ onMounted(() => {
|
||||
|
||||
<template>
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Induk Distribusi/Wilayah:</label
|
||||
>
|
||||
|
||||
@ -69,7 +69,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Unit Pelaksanaan Pelayanan Pelanggan:</label
|
||||
>
|
||||
|
||||
@ -82,7 +82,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Posko:</label>
|
||||
<label class="filter-input-label">Posko:</label>
|
||||
|
||||
<Select
|
||||
@update:selected="setPosko($event)"
|
||||
@ -93,13 +93,13 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0">Periode Tanggal:</label>
|
||||
<label class="filter-input-label">Periode Tanggal:</label>
|
||||
|
||||
<DatePicker @update:date-value="(value) => (data.periode = value)" />
|
||||
</div>
|
||||
|
||||
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
|
||||
<label class="block mb-2 text-sm font-semibold text-gray-800 sm:mb-0"
|
||||
<label class="filter-input-label"
|
||||
>Group By Kode Unit Distribusi:</label
|
||||
>
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user