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

fix: check all gangguan menu

Browse Source
This commit is contained in:
kur0nek-o
2024-02-27 20:02:58 +07:00
parent fc66b1a794
commit 47ef46f3fb
15 changed files with 3343 additions and 1626 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
src/components/Form/FiltersType/Type8.vue
View File

@ -3,13 +3,7 @@ import Select from '@/components/Select.vue'
import DatePicker from '@/components/DatePicker.vue'
import { onMounted, ref, watch } from 'vue'
import {
selectedUid,
selectedUp3Posko,
fetchUid,
itemsUid,
itemsUp3,
} from './reference'
import { selectedUid, fetchUid, itemsUid, itemsUp3 } from './reference'
const uidPlaceholder = 'Semua Unit Induk Distribusi/Wilayah'
const uppPlaceholder = 'Semua Unit Pelaksanaan Pelayanan Pelanggan'
@ -38,8 +32,6 @@ const setUid = (value: any) => {
const setUp3 = (value: any) => {
uppp.value = value
selectedUp3Posko(value)
posko.value = { id: 0, name: poskoPlaceholder }
data.value.up3 = value
}
@ -47,26 +39,26 @@ onMounted(() => {
emit('update:filters', data.value)
fetchUid()
})
</script>
<template>
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
<label class="text-gray-800 font-semibold mb-2 sm:mb-0 block">Unit Induk Distribusi/Wilayah:</label>
<label class="text-gray-800 font-semibold mb-2 sm:mb-0 block"
>Unit Induk Distribusi/Wilayah:</label
>
<Select
@update:selected="setUid($event)"
:data="itemsUid"
:placeholder="uidPlaceholder"
/>
<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="text-gray-800 font-semibold mb-2 sm:mb-0 block">Unit Pelaksanaan Pelayanan Pelanggan:</label>
<label class="text-gray-800 font-semibold mb-2 sm:mb-0 block"
>Unit Pelaksanaan Pelayanan Pelanggan:</label
>
<Select
@update:selected="setUp3($event)"
:data="itemsUp3"
:selected="uppp"
:placeholder="uppPlaceholder"
/>
</div>
@ -74,9 +66,6 @@ onMounted(() => {
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
<label class="text-gray-800 font-semibold mb-2 sm:mb-0 block">Periode Tanggal:</label>
<DatePicker @update:date-value="(value) => {
data.periode = value
}
" />
<DatePicker @update:date-value="(value) => (data.periode = value)" />
</div>
</template>

48
src/components/Form/FiltersType/Type9.vue
View File

@ -1,7 +1,7 @@
<script setup lang="ts">
import Select from '@/components/Select.vue'
import DatePicker from '@/components/DatePicker.vue'
import InlineRadioGroup from '@/components/Form/InlineRadioGroup.vue'
import Select from '@/components/Select.vue'
import DatePicker from '@/components/DatePicker.vue'
import InlineRadioGroup from '@/components/Form/InlineRadioGroup.vue'
import { onMounted, ref, watch } from 'vue'
import {
@ -19,13 +19,14 @@ const uppPlaceholder = 'Semua Unit Pelaksanaan Pelayanan Pelanggan'
const poskoPlaceholder = 'Semua Posko'
const uppp = ref({ id: 0, name: uppPlaceholder })
const uid = ref({ id: 0, name: uidPlaceholder })
const posko = ref({ id: 0 ,name: poskoPlaceholder })
const posko = ref({ id: 0, name: poskoPlaceholder })
const emit = defineEmits(['update:filters'])
const data = ref({
uid: uid.value,
up3: uppp.value,
posko: posko.value,
periode: ''
periode: '',
groupBy: false
})
watch(data.value, (value) => {
@ -53,20 +54,18 @@ const setPosko = (value: any) => {
}
onMounted(() => {
emit('update:filters', data.value)
fetchUid()
emit('update:filters', data.value)
})
</script>
<template>
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
<label class="text-gray-800 font-semibold mb-2 sm:mb-0 block">Unit Induk Distribusi/Wilayah:</label>
<label class="text-gray-800 font-semibold mb-2 sm:mb-0 block"
>Unit Induk Distribusi/Wilayah:</label
>
<Select
@update:selected="setUid($event)"
:data="itemsUid"
:placeholder="uidPlaceholder"
/>
<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">
@ -78,31 +77,38 @@ onMounted(() => {
@update:selected="setUp3($event)"
:data="itemsUp3"
:placeholder="uppPlaceholder"
:selected="uppp"
/>
</div>
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
<label class="text-gray-800 font-semibold mb-2 sm:mb-0 block">Posko:</label>
<Select
@update:selected="setPosko($event)"
:data="itemsPosko"
<Select
@update:selected="setPosko($event)"
:data="itemsPosko"
:placeholder="poskoPlaceholder"
:selected="posko"
/>
</div>
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
<label class="text-gray-800 font-semibold mb-2 sm:mb-0 block">Periode Tanggal:</label>
<DatePicker @update:date-value="(value) => {
data.periode = value
}
" />
<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="text-gray-800 font-semibold mb-2 sm:mb-0 block">Group By Kode Unit Distribusi:</label>
<label class="text-gray-800 font-semibold mb-2 sm:mb-0 block"
>Group By Kode Unit Distribusi:</label
>
<InlineRadioGroup :radio-items="[{id: 1, title: 'Tidak', checked: true}, {id: 2, title: 'Ya, Grupkan'}]" />
<InlineRadioGroup
@update:group-value="(value) => (data.groupBy = value.id === 2)"
:radio-items="[
{ id: 1, title: 'Tidak', checked: true },
{ id: 2, title: 'Ya, Grupkan' }
]"
/>
</div>
</template>

28
src/components/Form/InlineRadioGroup.vue
View File

@ -3,13 +3,19 @@
<fieldset>
<div class="space-y-3 sm:flex sm:items-center sm:space-y-0 sm:space-x-5">
<div v-for="item in radioItems" :key="item.id" class="flex items-center">
<input v-model="groupValue"
type="radio" name="radio"
<input
v-model="groupValue"
type="radio"
name="radio"
:checked="itemSelected.id === item.id ? true : false"
@change="onChange(item)"
class="w-4 h-4 border-gray-300 text-primary-500 peer focus:ring-primary-500" />
<label :for="`${item.id}`" class="block ml-3 text-sm font-medium text-gray-700 peer-checked:text-primary-500">{{
item.title }}</label>
class="w-4 h-4 border-gray-300 text-primary-500 peer focus:ring-primary-500"
/>
<label
:for="`${item.id}`"
class="block ml-3 text-sm font-medium text-gray-700 peer-checked:text-primary-500"
>{{ item.title }}</label
>
</div>
</div>
</fieldset>
@ -17,16 +23,17 @@
</template>
<script setup lang="ts">
import { ref, watch, type PropType, onMounted } from 'vue'
import { ref, type PropType, onMounted } from 'vue'
interface Item {
id: number;
title: string;
checked?: boolean;
id: number
title: string
checked?: boolean
}
const onChange= (e:Item) => {
const onChange = (e: Item) => {
itemSelected.value = e
console.log(e)
emit('update:groupValue', e)
}
@ -44,5 +51,4 @@ const groupValue = ref(1)
onMounted(() => {
itemSelected.value = props.radioItems[0]
})
</script>