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

Refactor Type4.vue component

Browse Source
This commit is contained in:
Dede Fuji Abdul
2024-03-12 20:40:33 +07:00
parent 7c284a4fea
commit c7e5be0426
7 changed files with 5185 additions and 5002 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
src/components/Form/FiltersType/Type4.vue
View File

@ -1,15 +1,27 @@
<script setup lang="ts">
import Select from '@/components/Select.vue';
import DatePicker from '@/components/DatePicker.vue';
import { selectedUid, selectedUp3Ulp, selectedUlp, itemsUid, itemsUp3, itemsUlp } from './reference';
import { onMounted, ref } from 'vue';
const uidPlaceholder = 'Semua Unit Induk Distribusi/Wilayah';
const up3Placeholder = 'Semua Unit Pelaksanaan Pelayanan Pelanggan';
const ulpPlaceholder = 'Semua Unit Layanan Pelanggan';
const uppp = ref({ id: 0, name: up3Placeholder });
const uid = ref({ id: 0, name: uidPlaceholder });
const ulp = ref({ id: 0, name: ulpPlaceholder });
import Select from '@/components/Select.vue'
import DatePicker from '@/components/DatePicker.vue'
import { selectedUid, selectedUp3Ulp, selectedUlp, itemsUid, itemsUp3, itemsUlp } from './reference'
import { computed, onMounted, ref } from 'vue'
const uidPlaceholder = 'Semua Unit Induk Distribusi/Wilayah'
const up3Placeholder = 'Semua Unit Pelaksanaan Pelayanan Pelanggan'
const ulpPlaceholder = 'Semua Unit Layanan Pelanggan'
const uppp = ref({ id: 0, name: up3Placeholder })
const uid = ref({ id: 0, name: uidPlaceholder })
const ulp = ref({ id: 0, name: ulpPlaceholder })
const emit = defineEmits(['update:filters'])
const props = defineProps({
jenisLaporan: {
type: Array as () => any[],
default: () => [
{ id: 1, name: 'Laporan Berulang Unit' },
{ id: 2, name: 'Laporan Berulang Pelanggan' },
{ id: 3, name: 'Laporan Berulang Pelanggan dan Unit' }
]
}
})
const jenisLaporan = ref(computed(() => props.jenisLaporan))
const data = ref({
uid: uid.value,
up3: uppp.value,
@ -18,24 +30,25 @@ const data = ref({
jenisLaporan: ''
})
const setUid = (value: any) => {
uid.value = value;
selectedUid(value);
uppp.value = { id: 0, name: up3Placeholder };
data.value.uid = value;
};
uid.value = value
selectedUid(value)
uppp.value = { id: 0, name: up3Placeholder }
data.value.uid = value
}
const setUp3 = (value: any) => {
uppp.value = value;
selectedUp3Ulp(value);
ulp.value = { id: 0, name: ulpPlaceholder };
data.value.up3 = value;
};
uppp.value = value
selectedUp3Ulp(value)
ulp.value = { id: 0, name: ulpPlaceholder }
data.value.up3 = value
}
const setUlp = (value: any) => {
ulp.value = value;
selectedUlp(value);
data.value.ulp = value;
};
ulp.value = value
selectedUlp(value)
data.value.ulp = value
}
onMounted(() => {
emit('update:filters', data.value)
// fetchUid()
@ -65,17 +78,17 @@ onMounted(() => {
<div class="flex flex-col flex-1 space-y-2">
<label class="filter-input-label">Jenis Laporan:</label>
<Select @update:selected="(value) => data.jenisLaporan = value" :data="[
{ id: 1, name: 'Laporan Berulang Unit' },
{ id: 2, name: 'Laporan Berulang Pelanggan' },
{ id: 3, name: 'Laporan Berulang Pelanggan dan Unit' },
]" :placeholder="'Semua Jenis Laporan'" />
<Select
@update:selected="(value) => (data.jenisLaporan = value)"
:data="jenisLaporan"
:placeholder="'Semua Jenis Laporan'"
/>
</div>
<div class="flex flex-col flex-1 space-y-2">
<label class="filter-input-label">Periode Tanggal:</label>
<DatePicker @update:date-value="(value) => data.periode = value" />
<DatePicker @update:date-value="(value) => (data.periode = value)" />
</div>
</div>
</template>