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

Update dependencies and fix code issues

Browse Source
This commit is contained in:
Eko Haryadi
2024-02-20 18:44:11 +07:00
parent 2758481259
commit a0ccf13466
65 changed files with 3454 additions and 2271 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/Form/Filters.vue
View File

@ -2,19 +2,10 @@
<script setup lang="ts">
// components
import Button from '@/components/Button.vue'
import { useSearchStore } from '@/stores/filtersAction'
// icons
import { PhArrowsCounterClockwise, PhFileText, PhMagnifyingGlass } from '@phosphor-icons/vue'
const cariButton = useSearchStore()
defineProps({
reportButton: {
type: Boolean,
default: false
}
})
const emit = defineEmits(['runSearch'])
const emit = defineEmits(['runSearch','resetForm'])
</script>
<template>
@ -26,7 +17,7 @@ const emit = defineEmits(['runSearch'])
<div class="filter-footer rounded-b-2xl px-4 py-3 bg-primary-50 flex justify-end">
<div class="filter-buttons flex gap-3 flex-wrap">
<Button
@click="() => (cariButton.isTriggerChange = !cariButton.isTriggerChange)"
@on:click="() => emit('resetForm')"
label="Ulangi"
style-type="outline"
class-name="bg-white"
@ -35,11 +26,10 @@ const emit = defineEmits(['runSearch'])
</Button>
<Button
v-if="reportButton"
label="Lihat Laporan"
style-type="outline"
class-name="bg-white"
>
>
<PhFileText size="18" class="ml-1" weight="regular" />
</Button>

37
src/components/Form/FiltersType/Type1.vue
View File

@ -10,6 +10,12 @@ import {
itemsPosko
} from './reference'
const props = defineProps({
runReset: {
type: Boolean,
required: true
}
});
import Select from '@/components/Select.vue'
import DatePicker from '@/components/DatePicker.vue'
const uidPlaceholder = 'Semua Unit Induk Distribusi/Wilayah'
@ -17,7 +23,7 @@ const up3laceholder = 'Semua Unit Pelaksanaan Pelayanan Pelanggan'
const poskoPlaceholder = 'Semua Posko'
const up3 = ref({ id: 0, name: up3laceholder })
const uid = ref({ id: 0, name: uidPlaceholder })
const posko = ref({ id: "", name: poskoPlaceholder })
const posko = ref({ id: 0, name: poskoPlaceholder })
const emit = defineEmits(['update:filters'])
const data = ref({
uid: uid.value,
@ -40,7 +46,7 @@ const setUid = (value: any) => {
const setUp3 = (value: any) => {
up3.value = value
selectedUp3Posko(value)
posko.value = { id: "", name: poskoPlaceholder }
posko.value = { id: 0, name: poskoPlaceholder }
data.value.up3 = value
}
@ -49,7 +55,20 @@ const setPosko = (value: any) => {
selectedPosko(value)
data.value.posko = value
}
watch(() => props.runReset, (value) => {
if (value) {
uid.value = { id: 0, name: uidPlaceholder }
up3.value = { id: 0, name: up3laceholder }
posko.value = { id: 0, name: poskoPlaceholder }
data.value.periode = ''
data.value = {
uid: uid.value,
up3: up3.value,
posko: posko.value,
periode: ''
}
}
})
onMounted(() => {
emit('update:filters', data.value)
fetchUid()
@ -58,17 +77,13 @@ onMounted(() => {
<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 :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="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="up3" :placeholder="up3laceholder" />
</div>
@ -82,8 +97,8 @@ 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
}
data.periode = value
}
" />
</div>
</template>

2
src/components/Form/FiltersType/Type13.vue
View File

@ -77,6 +77,6 @@ onMounted(() => {
<InlineRadioGroup @update:group-value="(value) => {
data.group = value
console.log('data.group', value)
}" :radio-items="[{ id: 1, title: 'Tidak', checked: true }, { id: 2, title: 'Ya, Grupkan' }]" />
}" :radio-items="[{ id: 1, title: 'Tidak' }, { id: 2, title: 'Ya, Grupkan' }]" />
</div>
</template>

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

@ -1,41 +1,63 @@
<script setup lang="ts">
import Select from '@/components/Select.vue'
import DatePicker from '@/components/DatePicker.vue'
import { 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 });
import { selectedUid, selectedUp3Posko, selectedPosko, fetchUid, itemsUid, itemsUp3, itemsPosko } from './reference';
import { onMounted, ref } from 'vue';
const uidPlaceholder = 'Semua Distribusi/Wilayah';
const up3Placeholder = 'Semua Area';
const poskoPlaceholder = 'Semua Unit Layanan Pelanggan';
const up3 = ref({ id: 0, name: up3Placeholder });
const uid = ref({ id: 0, name: uidPlaceholder });
const ulp = ref({ id: "", name: ulpPlaceholder });
const posko = ref({ id: 0, name: poskoPlaceholder });
const emit = defineEmits(['update:filters'])
const data = ref({
uid: uid.value,
up3: uppp.value,
posko: ulp.value,
up3: up3.value,
posko: posko.value,
periode: '',
group: 1
})
const setUid = (value: any) => {
uid.value = value;
selectedUid(value);
up3.value = { id: 0, name: up3Placeholder };
data.value.uid = value;
};
const setUp3 = (value: any) => {
up3.value = value;
selectedUp3Posko(value);
posko.value = { id: 0, name: poskoPlaceholder };
data.value.up3 = value;
};
const setPosko = (value: any) => {
posko.value = value;
selectedPosko(value);
data.value.posko = value;
};
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">Distribusi/Wilayah:</label>
<Select placeholder="Semua Distribusi/Wilayah" />
<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="text-gray-800 font-semibold mb-2 sm:mb-0 block">Area:</label>
<Select @update:selected="setUp3($event)" :data="itemsUp3" :selected="up3" :placeholder="up3Placeholder" />
<Select placeholder="Semua Area" />
</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" :selected="posko" :placeholder="poskoPlaceholder" />
<Select placeholder="Semua Posko" />
</div>
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">

4
src/components/Form/FiltersType/Type16.vue
View File

@ -19,7 +19,7 @@ const poskoPlaceholder = 'Semua Posko'
const mediaPlaceholder = 'Semua Media'
const up3 = ref({ id: 0, name: up3Placeholder })
const uid = ref({ id: 0, name: uidPlaceholder })
const posko = ref({ id: "", name: poskoPlaceholder })
const posko = ref({ id: 0, name: poskoPlaceholder })
const media = ref({ id: 0, name: mediaPlaceholder })
const emit = defineEmits(['update:filters'])
const data = ref({
@ -44,7 +44,7 @@ const setUid = (value: any) => {
const setUp3 = (value: any) => {
up3.value = value
selectedUp3Posko(value)
posko.value = { id: "", name: poskoPlaceholder }
posko.value = { id: 0, name: poskoPlaceholder }
data.value.up3 = value
}

26
src/components/Form/FiltersType/Type18.vue
View File

@ -1,17 +1,16 @@
<!-- <script setup lang="ts">
<script setup lang="ts">
import Select from '@/components/Select.vue'
import SelectMulti from '@/components/SelectMulti.vue'
import DatePicker from '@/components/DatePicker.vue'
import { selectedUid, selectedUp3Posko, selectedPosko ,fetchUid, itemsUid,itemsUp3, itemsPosko} from './reference';
fetchData();
fetchUid();
const departments = [
{ id: 1, name: 'Marketing', contact: 'Durward Reynolds' },
{ id: 2, name: 'HR', contact: 'Kenton Towne' },
{ id: 3, name: 'Sales', contact: 'Therese Wunsch' },
{ id: 4, name: 'Finance', contact: 'Benedict Kessler' },
{ id: 5, name: 'Customer service', contact: 'Katelyn Rohan' },
const jenisTransakasi = [
{ id: 1, value: 'Koreksi Transaksi Individual',label: 'Koreksi Transaksi Individual' },
{ id: 2, value: 'Cleansing Traksaksi TM',label: 'Cleansing Traksaksi TM', },
{ id: 3, value: 'Koreksi Transaksi TM',label: 'Koreksi Transaksi TM', },
{ id: 4, value: 'Koreksi Kode Gangguan dan Anev',label: 'Koreksi Kode Gangguan dan Anev' },
]
</script>
@ -38,12 +37,15 @@ const departments = [
<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">Jenis Transaksi:</label>
<SelectMulti :data="departments" placeholder="Semua Jenis Transaksi" />
<SelectMulti
:tags="jenisTransakasi"
placeholder="Semua Jenis Transaksi"
useLabel
label="Jenis Transaksi"
/>
</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 />
</div>
</template> -->
<template></template>
</template>

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

@ -38,7 +38,7 @@ const setUlp = (value: any) => {
};
onMounted(() => {
emit('update:filters', data.value)
fetchUid()
// fetchUid()
})
</script>

4
src/components/Form/FiltersType/Type5.vue
View File

@ -17,7 +17,7 @@ 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: "", name: poskoPlaceholder })
const posko = ref({ id: 0, name: poskoPlaceholder })
const emit = defineEmits(['update:filters'])
const data = ref({
uid: uid.value,
@ -40,7 +40,7 @@ const setUid = (value: any) => {
const setUp3 = (value: any) => {
uppp.value = value
selectedUp3Posko(value)
posko.value = { id: "", name: poskoPlaceholder }
posko.value = { id: 0, name: poskoPlaceholder }
data.value.up3 = value
}

4
src/components/Form/FiltersType/Type6.vue
View File

@ -10,7 +10,7 @@ const up3Placeholder = 'Semua Unit Pelaksanaan Pelayanan Pelanggan';
const poskoPlaceholder = 'Semua Unit Layanan Pelanggan';
const up3 = ref({ id: 0, name: up3Placeholder });
const uid = ref({ id: 0, name: uidPlaceholder });
const posko = ref({ id: "", name: poskoPlaceholder });
const posko = ref({ id: 0, name: poskoPlaceholder });
const data = ref({
uid: uid.value,
up3: up3.value,
@ -30,7 +30,7 @@ const setUid = (value: any) => {
const setUp3 = (value: any) => {
up3.value = value
selectedUp3Posko(value)
posko.value = { id: "", name: poskoPlaceholder }
posko.value = { id: 0, name: poskoPlaceholder }
data.value.up3 = value
}

33
src/components/Form/FiltersType/Type7.vue
View File

@ -12,14 +12,14 @@ const up3Placeholder = 'Semua Unit Pelaksanaan Pelayanan Pelanggan';
const poskoPlaceholder = 'Semua Unit Layanan Pelanggan';
const up3 = ref({ id: 0, name: up3Placeholder });
const uid = ref({ id: 0, name: uidPlaceholder });
const posko = ref({ id: "", name: poskoPlaceholder });
const posko = ref({ id: 0, name: poskoPlaceholder });
const data = ref({
uid: uid.value,
up3: up3.value,
posko: posko.value,
periode: '',
minTime: 1,
maxTime: 1
minTime: useTotalDuration().getDataMin().split(' ')[0],
maxTime: useTotalDuration().getDataMax().split(' ')[0]
})
const setUid = (value: any) => {
uid.value = value
@ -31,7 +31,7 @@ const setUid = (value: any) => {
const setUp3 = (value: any) => {
up3.value = value
selectedUp3Posko(value)
posko.value = { id: "", name: poskoPlaceholder }
posko.value = { id: 0, name: poskoPlaceholder }
data.value.up3 = value
}
@ -40,8 +40,6 @@ const setPosko = (value: any) => {
selectedPosko(value)
data.value.posko = value
}
const sla = [
{
id: 1,
@ -53,28 +51,32 @@ const sla = [
}
]
const setMin = (value: any) => {
console.log(value)
data.value.minTime = value
useTotalDuration().setDataMin(value)
}
const setMax = (value: any) => {
data.value.maxTime = value
useTotalDuration().setDataMax(value)
}
const triggerInput = ref(false)
const changeDuration = (value: any) => {
if (value.id === 0) {
setMin("1 Menit")
setMax("5 Menit")
console.log('Durasi Menit')
data.value.minTime = 0
data.value.maxTime = 5
triggerInput.value = false
} else if (value.id === 1) {
data.value.minTime = 0
data.value.maxTime = 45
setMin("1 Menit")
setMax("45 Menit")
console.log('Dibawah / Sesuai SLA (<= 45 menit)')
triggerInput.value = true
} else {
data.value.minTime = 46
data.value.maxTime = 99999 * 60 * 24
setMin("45 Menit")
setMax(99999 * 60 * 24+ ' Menit')
triggerInput.value = true
console.log('Melebihi SLA (> 45 menit)')
}
@ -123,9 +125,12 @@ onMounted(() => {
<Select @update:selected="changeDuration($event)" :data="sla" placeholder="Durasi Menit" />
<div class="grid grid-flow-col auto-cols-auto gap-x-1.5">
<InputWithSuffix @default-value="data.minTime" @update:menit-value="setMin($event)" />
<InputWithSuffix
:value="`${data.minTime} Menit`"
/>
<small class="flex items-center">s/d</small>
<InputWithSuffix @default-value="data.maxTime" @update:menit-value="setMax($event)" />
<InputWithSuffix
:value="`${data.maxTime} Menit`"/>
</div>
</div>
</div>

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

@ -16,7 +16,7 @@ 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: "", name: poskoPlaceholder })
const posko = ref({ id: 0, name: poskoPlaceholder })
const emit = defineEmits(['update:filters'])
const data = ref({
uid: uid.value,
@ -39,7 +39,7 @@ const setUid = (value: any) => {
const setUp3 = (value: any) => {
uppp.value = value
selectedUp3Posko(value)
posko.value = { id: "", name: poskoPlaceholder }
posko.value = { id: 0, name: poskoPlaceholder }
data.value.up3 = value
}

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

@ -42,7 +42,7 @@ const setUid = (value: any) => {
const setUp3 = (value: any) => {
uppp.value = value
selectedUp3Posko(value)
posko.value = { id: "", name: poskoPlaceholder }
posko.value = { id: 0, name: poskoPlaceholder }
data.value.up3 = value
}

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

@ -5,7 +5,8 @@
<div v-for="item in radioItems" :key="item.id" class="flex items-center">
<input v-model="groupValue"
type="radio" name="radio"
:checked="item.checked" @change="onChange(item)"
: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>

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

@ -14,17 +14,21 @@ const props = defineProps({
type: Boolean,
default: false
},
defaultValue: {
value: {
type: String,
default: '1 Menit'
}
})
const emit = defineEmits(['update:menitValue'])
const menitValue = ref(props.defaultValue)
watch(menitValue, (newValue) => {
emit('update:menitValue', newValue)
})
const handleInput = (e :any) => {
e.value = e.value.replace(/[^0-9.]/g, '')
}
const handleBlur = (e :any) => {
e.value = e.value ? e.value + ' Menit' : ''
}
const handleFocus = (e:any) => {
e.value = e.value.replace(/[^0-9.]/g, '')
}
</script>
<template>
@ -32,7 +36,7 @@ watch(menitValue, (newValue) => {
class="relative w-full overflow-hidden rounded-lg bg-gray-200">
<input
v-model="menitValue"
:value="props.value"
autocomplete="off"
type="text"
:placeholder="placeholder"
@ -40,12 +44,10 @@ watch(menitValue, (newValue) => {
inputmode="numeric"
pattern="[0-9.]*"
:disabled="disabled"
:defaultValue="props.defaultValue"
oninput="this.value = this.value.replace(/[^0-9.]/g, '')"
onblur="this.value = this.value ? this.value + ' Menit' : ''"
onfocus="this.value = this.value.replace(/[^0-9.]/g, '')"
class="w-full px-4 py-2 text-sm leading-6 placeholder:text-gray-400 text-gray-900 border-0 border-transparent rounded-lg outline-0 bg-gray-200 focus:outline-0 focus:border-0 focus:ring-0
"
@oninput="handleInput($event)"
@onblur="handleBlur($event)"
@onfocus="handleFocus($event)"
class="w-full px-4 py-2 text-sm leading-6 placeholder:text-gray-400 text-gray-900 border-0 border-transparent rounded-lg outline-0 bg-gray-200 focus:outline-0 focus:border-0 focus:ring-0"
/>
</div>
</template>