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

fix(filters): change source code in filters type

Browse Source
This commit is contained in:
kur0nek-o 2024-02-09 19:05:40 +07:00
parent cb8e11b1e9
commit e2790a3686
6 changed files with 108 additions and 111 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -4,15 +4,15 @@ import {
selectedUid,
selectedUp3Posko,
selectedPosko,
fetchData,
items,
fetchUid,
itemsUid,
itemsUp3,
itemsPosko
} from './reference'
import Select from '@/components/Select.vue'
import DatePicker from '@/components/DatePicker.vue'
// fetchData();
const uidPlaceholder = 'Semua Unit Induk Distribusi/Wilayah'
const uppPlaceholder = 'Semua Unit Pelaksanaan Pelayanan Pelanggan'
const poskoPlaceholder = 'Semua Posko'
@ -55,6 +55,7 @@ const setPosko = (value: any) => {
onMounted(() => {
emit('update:filters', data.value)
fetchUid()
})
</script>
@ -65,7 +66,7 @@ onMounted(() => {
>
<Select
:data="items"
:data="itemsUid"
@update:selected="setUid($event)"
:placeholder="uidPlaceholder"
:selected="uid"

6
src/components/Form/FiltersType/Type2.vue
View File

@ -1,4 +1,4 @@
<script setup lang="ts">
<!-- <script setup lang="ts">
import Select from '@/components/Select.vue'
import { selectedUid, selectedUp3Ulp, fetchData, items, itemsUp3, itemsUlp,itemsRegional ,months, years} from './reference';
import { ref } from 'vue';
@ -68,4 +68,6 @@ const setUlp = (value: any) => {
<Select :data="years" placeholder="Pilih Tahun" />
</div>
</div>
</template>
</template> -->
<template></template>

5
src/components/Form/FiltersType/Type3.vue
View File

@ -1,4 +1,4 @@
<script setup lang="ts">
<!-- <script setup lang="ts">
import Select from '@/components/Select.vue'
import DatePicker from '@/components/DatePicker.vue'
import { selectedUid, selectedUp3Ulp,selectedUlp, fetchData, items, itemsUp3, itemsUlp } from './reference';
@ -53,4 +53,5 @@ const setUlp = (value: any) => {
<DatePicker />
</div>
</template>
</template> -->
<template></template>

128
src/components/Form/FiltersType/reference.ts
View File

@ -1,14 +1,13 @@
import { getUid, getUp3, getPosko ,getUlp} from '@/utils/network';
import { getUid, getUp3, getPosko, getUlp } from '@/utils/network'
import { ref } from 'vue'
import { usePostsStore } from '@/stores/posts';
import { useUp3Store } from '@/stores/up3';
import { useRegionStore } from '@/stores/region';
import { useUlpStore } from '@/stores/ulp';
import { usePostsStore } from '@/stores/posts'
import { useUp3Store } from '@/stores/up3'
import { useRegionStore } from '@/stores/region'
import { useUlpStore } from '@/stores/ulp'
interface Item {
id: number;
name: any;
id: number
name: any
}
const months = [
{ id: 1, name: 'Januari' },
@ -22,100 +21,103 @@ const months =[
{ id: 9, name: 'September' },
{ id: 10, name: 'Oktober' },
{ id: 11, name: 'November' },
{id:12, name: 'Desember'},
{ id: 12, name: 'Desember' }
]
// create 4 year back array
const year = new Date().getFullYear();
const years =ref<Item[]>([]);
const year = new Date().getFullYear()
const years = ref<Item[]>([])
for (let i = 0; i < 5; i++) {
years.value.push({ id: year - i, name: year - i })
}
const timeout = ref()
const items = ref<Item[]>([]);
const itemsUp3 = ref<Item[]>([]);
const itemsPosko = ref<Item[]>([]);
const itemsUlp = ref<Item[]>([]);
const itemsRegional = ref<Item[]>([]);
const itemsMedia = ref<Item[]>([]);
// Create a ref to store the items
const itemsUid = ref<Item[]>([])
const itemsUp3 = ref<Item[]>([])
const itemsPosko = ref<Item[]>([])
const itemsUlp = ref<Item[]>([])
const itemsRegional = ref<Item[]>([])
const itemsMedia = ref<Item[]>([])
// Fetch data from the API using Axios
const fetchData = async () => {
const fetchUid = async () => {
try {
const res = await getUid()
items.value = res.data.map((item: any) => (
{
itemsUid.value = res.data.map((item: any) => ({
id: item.id,
name: item.nama,
}
));
name: item.nama
}))
} catch (error) {
console.error('Error fetching data:', error);
console.error('Error fetching data:', error)
}
}
};
const fetchDataUp3 = async (uid: number) => {
try {
const res = await getUp3(uid)
itemsUp3.value = res.data.map((item: any) => (
{
itemsUp3.value = res.data.map((item: any) => ({
id: item.id,
name: item.nama,
}
));
name: item.nama
}))
} catch (error) {
console.error('Error fetching data:', error);
console.error('Error fetching data:', error)
}
}
};
const fetchDataUlp = async (up3: number) => {
try {
const res = await getUlp(up3)
itemsUlp.value = res.data.map((item: any) => (
{
itemsUlp.value = res.data.map((item: any) => ({
id: item.id,
name: item.nama,
}
));
name: item.nama
}))
} catch (error) {
console.error('Error fetching data:', error);
console.error('Error fetching data:', error)
}
}
const fetchDataPosko = async (up3: number) => {
clearTimeout(timeout.value)
timeout.value = setTimeout(async () => {
try {
const res = await getPosko(up3)
itemsPosko.value = res.data.map((item: any) => (
{
itemsPosko.value = res.data.map((item: any) => ({
id: item.id,
name: item.nama,
}
));
name: item.nama
}))
} catch (error) {
console.error('Error fetching data:', error);
console.error('Error fetching data:', error)
}
}
},300);
};
const selectedUid = (value: any) => {
useRegionStore().setData(value.id);
fetchDataUp3(value.id);
useRegionStore().setData(value.id)
fetchDataUp3(value.id)
}
const selectedUp3Posko = (value: any) => {
useUp3Store().setData(value.id);
fetchDataPosko(value.id);
if (value.id != 0) {
useUp3Store().setData(value.id)
fetchDataPosko(value.id)
}
}
const selectedUp3Ulp = (value: any) => {
useUp3Store().setData(value.id);
fetchDataUlp(value.id);
useUp3Store().setData(value.id)
fetchDataUlp(value.id)
}
const selectedPosko = (value: any) => {
usePostsStore().setData(value.id);
usePostsStore().setData(value.id)
}
const selectedUlp = (value: any) => {
useUlpStore().setData(value.id);
useUlpStore().setData(value.id)
}
export { selectedUid, selectedUp3Posko ,selectedUp3Ulp, selectedPosko,selectedUlp, fetchData, items, itemsUp3, itemsPosko,itemsRegional,itemsMedia,itemsUlp ,months ,years};
export {
selectedUid,
selectedUp3Posko,
selectedUp3Ulp,
selectedPosko,
selectedUlp,
fetchUid,
itemsUid,
itemsUp3,
itemsPosko,
itemsRegional,
itemsMedia,
itemsUlp,
months,
years
}

6
src/components/Select.vue
View File

@ -37,8 +37,6 @@ computed(() => {
if (props.selected.id === 0) {
selected.value = { id: 0, name: props.placeholder }
}
// console.log('selected', selected.value.name)
})
watch(
@ -63,10 +61,6 @@ let filteredData = computed(() =>
)
)
watch(selected, (value) => {
emit('update:selected', value)
})
const show = ref(false)
</script>

23
src/utils/network.ts
View File

@ -1,16 +1,13 @@
import axios from "axios";
import axios from 'axios'
const instance = axios.create({
baseURL: 'http://localhost:8443'
});
baseURL: 'http://10.8.0.13:8443'
})
const getUid = async () => await instance.get('/uid');
const getMedia = async() => await instance.get('/media');
const getJenisTransaksi = async() => await instance.get('/jenisTransaksi');
const getUp3 = async (
uid: number,
) => await instance.get('/up3?uid=' + uid);
const getUlp = async (up3: number) => await instance.get('/ulp?up3=' + up3);
const getPosko = async (uppp: number) => await instance.get('/posko?up3=' + uppp);
export { getUid, getUp3, getPosko,getUlp,getMedia,getJenisTransaksi };
const getUid = async () => await instance.get('/uid')
const getMedia = async () => await instance.get('/media')
const getJenisTransaksi = async () => await instance.get('/jenisTransaksi')
const getUp3 = async (uid: number) => await instance.get('/up3?uid=' + uid)
const getUlp = async (up3: number) => await instance.get('/ulp?up3=' + up3)
const getPosko = async (uppp: number) => await instance.get('/posko?up3=' + uppp)
export { getUid, getUp3, getPosko, getUlp, getMedia, getJenisTransaksi }