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

Merge branch 'dev-bagus' of https://gitea.callysta-engineering.com/APKT/eis into dev-eko-vm

Browse Source
This commit is contained in:
Eko Haryadi
2024-02-22 10:33:40 +07:00
parent 9d9e60a8b5 7464cb6d1c
commit ef73152128
8 changed files with 158 additions and 230 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,23 +1,16 @@
<script setup lang="ts">
import { onMounted, ref, watch } from 'vue'
import Select from '@/components/Select.vue'
import DatePicker from '@/components/DatePicker.vue'
import {
selectedUid,
selectedUp3Posko,
selectedPosko,
fetchUid,
itemsUid,
itemsUp3,
itemsPosko
itemsPosko,
fetchUid
} from './reference'
const props = defineProps({
runReset: {
type: Boolean,
required: true
}
});
import Select from '@/components/Select.vue'
import DatePicker from '@/components/DatePicker.vue'
import { onMounted, ref, watch } from 'vue'
const uidPlaceholder = 'Semua Unit Induk Distribusi/Wilayah'
const up3laceholder = 'Semua Unit Pelaksanaan Pelayanan Pelanggan'
const poskoPlaceholder = 'Semua Posko'
@ -55,23 +48,10 @@ 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()
emit('update:filters', data.value)
})
</script>
@ -79,7 +59,7 @@ 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">Unit Induk Distribusi/Wilayah:</label>
<Select :data="itemsUid" @update:selected="setUid($event)" :placeholder="uidPlaceholder" :selected="uid" />
<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">
@ -96,9 +76,12 @@ 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>

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

@ -1,13 +1,12 @@
import { getUid, getUp3, getPosko, getUlp,getUidRegional, getRegional } 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 { useUp3Store } from '@/stores/up3'
import { getUid, getUp3, getPosko, getUlp,getRegional } from '@/utils/network'
import { ref } from 'vue'
interface Item {
id: any;
name: any;
id: any
name: any
}
const months = [
{ id: 1, name: 'Januari' },
@ -21,24 +20,40 @@ 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();
let 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 itemsUid = ref<Item[]>([]);
const itemsUp3 = ref<Item[]>([]);
const itemsPosko = ref<Item[]>([]);
const itemsUlp = ref<Item[]>([]);
const itemsRegional = ref<Item[]>([]);
const itemsMedia = ref<Item[]>([]);
const fetchRegional =async () => {
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 fetchMedia = () => {
itemsMedia.value = [
{ id: 'Ulasan Aplikasi PLN Mobile', name: 'Ulasan Aplikasi PLN Mobile' },
{ id: 'Twitter', name: 'Twitter' },
{ id: 'PLN Mobile', name: 'PLN Mobile' },
{ id: 'Media Massa', name: 'Media Massa' },
{ id: 'Live Chat Website', name: 'Live Chat Website' },
{ id: 'Live Chat PLN Mobile', name: 'Live Chat PLN Mobile' },
{ id: 'Instagram', name: 'Instagram' },
{ id: 'Facebook', name: 'Facebook' },
{ id: 'Email', name: 'Email' },
{ id: 'EMS', name: 'EMS' },
{ id: 'Datang ke Kantor', name: 'Datang ke Kantor' },
{ id: 'Call ke Kantor Unit', name: 'Call ke Kantor Unit' },
{ id: 'Call PLN 123', name: 'Call PLN 123' }
]
}
// Fetch data from the API using Axios
const fetchUid = async () => {
try {
const res = await getRegional()
itemsRegional.value = res.data.map((item: any) => (
@ -51,67 +66,7 @@ const fetchRegional =async () => {
console.error('Error fetching data:', error);
}
}
const fetchStatus = (data : any) => {
const status = [
{"id": "8", "name": "Selesai"},
{"id": "7", "name": "Nyala"},
{"id": "6", "name": "Pengalihan"},
{"id": "5", "name": "Dialihkan"},
{"id": "4", "name": "Dalam Pengerjaan"},
{"id": "3", "name": "Dalam Perjalanan"},
{"id": "2", "name": "Penugasan Regu"},
{"id": "1", "name": "lapor"}
]
const filteredStatus = status.find(item => item.id == data);
const name = filteredStatus ? filteredStatus.name : null;
return name;
}
const fetchMedia = () => {
itemsMedia.value = [
{ id: "Ulasan Aplikasi PLN Mobile", name: "Ulasan Aplikasi PLN Mobile" },
{ id: "Twitter", name: "Twitter" },
{ id: "PLN Mobile", name: "PLN Mobile" },
{ id: "Media Massa", name: "Media Massa" },
{ id: "Live Chat Website", name: "Live Chat Website" },
{ id: "Live Chat PLN Mobile", name: "Live Chat PLN Mobile" },
{ id: "Instagram", name: "Instagram" },
{ id: "Facebook", name: "Facebook" },
{ id: "Email", name: "Email" },
{ id: "EMS", name: "EMS" },
{ id: "Datang ke Kantor", name: "Datang ke Kantor" },
{ id: "Call ke Kantor Unit", name: "Call ke Kantor Unit" },
{ id: "Call PLN 123", name: "Call PLN 123" },
]
}
// Fetch data from the API using Axios
const fetchUid = async () => {
try {
const res = await getUid()
itemsUid.value = res.data.map((item: any) => (
{
id: item.id,
name: item.nama,
}
));
} catch (error) {
console.error('Error fetching data:', error);
}
};
const fetchUidWithRegional = async (regional: number) => {
try {
const res = await getUidRegional(regional)
itemsUid.value = res.data.map((item: any) => (
{
id: item.id,
name: item.nama,
}
));
} catch (error) {
console.error('Error fetching data:', error);
}
}
const fetchDataUp3 = async (uid: number) => {
try {
const res = await getUp3(uid)
@ -126,32 +81,50 @@ const fetchDataUp3 = async (uid: number) => {
const fetchDataUlp = async (up3: number) => {
try {
const res = await getUlp(up3)
itemsUlp.value = res.data.map((item: any) => (
{
id: item.id,
name: item.nama,
}
));
itemsUlp.value = res.data.map((item: any) => ({
id: item.id,
name: item.nama
}))
} catch (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) => (
{
id: item.id,
name: item.nama,
}
));
} catch (error) {
console.error('Error fetching data:', error);
}
}, 300);
};
try {
const res = await getPosko(up3)
itemsPosko.value = res.data.map((item: any) => ({
id: item.id,
name: item.nama
}))
} catch (error) {
console.error('Error fetching data:', error)
}
}
const fetchRegional = () => {
itemsRegional.value = [
{ id: '1', name: 'Wilayah Sumatera' },
{ id: '2', name: 'Wilayah Jawa Bali' },
{ id: '3', name: 'Wilayah Kalimantan' },
{ id: '4', name: 'Wilayah Sulawesi' },
{ id: '5', name: 'Wilayah Nusa Tenggara' },
{ id: '6', name: 'Wilayah Maluku Papua' }
]
}
const fetchStatus = (data: any) => {
const status = [
{ id: '8', name: 'Selesai' },
{ id: '7', name: 'Nyala' },
{ id: '6', name: 'Pengalihan' },
{ id: '5', name: 'Dialihkan' },
{ id: '4', name: 'Dalam Pengerjaan' },
{ id: '3', name: 'Dalam Perjalanan' },
{ id: '2', name: 'Penugasan Regu' },
{ id: '1', name: 'lapor' }
]
const filteredStatus = status.find((item) => item.id == data)
const name = filteredStatus ? filteredStatus.name : null
return name
}
const selectedUid = (value: any) => {
useRegionStore().setData(value.id)
fetchDataUp3(value.id)
@ -173,4 +146,22 @@ const selectedUlp = (value: any) => {
useUlpStore().setData(value.id)
}
export { selectedUid, selectedUp3Posko, selectedUp3Ulp, selectedPosko, selectedUlp, fetchMedia,fetchStatus,fetchUidWithRegional,fetchRegional, fetchUid, itemsUid, itemsUp3, itemsPosko, itemsRegional, itemsMedia, itemsUlp, months, years };
export {
selectedUid,
selectedUp3Posko,
selectedUp3Ulp,
selectedPosko,
selectedUlp,
fetchRegional,
fetchUid,
fetchMedia,
fetchStatus,
itemsUid,
itemsUp3,
itemsPosko,
itemsRegional,
itemsMedia,
itemsUlp,
months,
years
}