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

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

Browse Source
This commit is contained in:
kur0nek-o
2024-02-21 15:07:33 +07:00
parent e2790a3686 945914a48b
commit 00d03c1b7e
71 changed files with 2133 additions and 1231 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,3 +1,4 @@
<!-- ss -->
<script setup lang="ts">
// components
import Button from '@/components/Button.vue'

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

@ -1,27 +1,23 @@
<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'
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 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 emit = defineEmits(['update:filters'])
const data = ref({
uid: uid.value,
up3: uppp.value,
@ -54,8 +50,8 @@ const setPosko = (value: any) => {
}
onMounted(() => {
emit('update:filters', data.value)
fetchUid()
emit('update:filters', data.value)
})
</script>
@ -65,12 +61,7 @@ onMounted(() => {
>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">

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

@ -29,7 +29,10 @@
<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 />
<DatePicker @update:date-value="(value) => {
data.periode = value
}
" />
</div>
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">

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

@ -29,7 +29,10 @@
<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 />
<DatePicker @update:date-value="(value) => {
data.periode = value
}
" />
</div>
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">

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

@ -30,7 +30,10 @@
<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 />
<DatePicker @update:date-value="(value) => {
data.periode = value
}
" />
</div>
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">

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

@ -30,7 +30,10 @@
<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 />
<DatePicker @update:date-value="(value) => {
data.periode = value
}
" />
</div>
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">

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

@ -29,6 +29,9 @@
<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 />
<DatePicker @update:date-value="(value) => {
data.periode = value
}
" />
</div>
</template>

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

@ -20,6 +20,9 @@
<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 />
<DatePicker @update:date-value="(value) => {
data.periode = value
}
" />
</div>
</template>

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

@ -1,6 +1,8 @@
<script setup lang="ts">
import Select from '@/components/Select.vue'
import DatePicker from '@/components/DatePicker.vue'
import { selectedUid, selectedUp3Posko, selectedPosko ,fetchData,fetchMedia, items,itemsUp3, itemsPosko,itemsMedia} from './reference';
fetchMedia();
</script>
<template>
@ -27,12 +29,15 @@
<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">Media:</label>
<Select placeholder="Semua Media" />
<Select placeholder="Semua Media" :data="itemsMedia" />
</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 />
<DatePicker @update:date-value="(value) => {
data.periode = value
}
" />
</div>
</template>

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

@ -8,7 +8,10 @@
<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 />
<DatePicker @update:date-value="(value) => {
data.periode = value
}
" />
</div>
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">

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

@ -3,7 +3,7 @@ import Select from '@/components/Select.vue'
import SelectMulti from '@/components/SelectMulti.vue'
import DatePicker from '@/components/DatePicker.vue'
import { selectedUid, selectedUppp, selectedPosko ,fetchData, items,itemsUp3, itemsPosko} from './reference';
import { selectedUid, selectedUp3Posko, selectedPosko ,fetchUid, itemsUid,itemsUp3, itemsPosko} from './reference';
fetchData();
const departments = [
@ -20,13 +20,13 @@ 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">Unit Induk Distribusi/Wilayah:</label>
<Select @update:selected="selectedUid($event)" :data="items" placeholder="Semua Unit Induk Distribusi/Wilayah" />
<Select @update:selected="selectedUid($event)" :data="itemsUid" placeholder="Semua Unit Induk Distribusi/Wilayah" />
</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>
<Select @update:selected="selectedUppp($event)" :data="itemsUp3"
<Select @update:selected="selectedUp3Posko($event)" :data="itemsUp3"
placeholder="Semua Unit Pelaksanaan Pelayanan Pelanggan" />
</div>

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

@ -1,8 +1,7 @@
<!-- <script setup lang="ts">
import Select from '@/components/Select.vue'
import { selectedUid, selectedUp3Ulp, fetchData, items, itemsUp3, itemsUlp,itemsRegional ,months, years} from './reference';
import { selectedUid, selectedUp3Ulp, fetchUid, itemsUid, itemsUp3, itemsUlp,itemsRegional ,months, years} from './reference';
import { ref } from 'vue';
fetchData();
const uidPlaceholder = 'Semua Unit Induk Distribusi/Wilayah';
const up3Placholder = 'Semua Unit Pelaksanaan Pelayanan Pelanggan';
const ulpPlaceholder = 'Semua Unit Layanan Pelanggan';
@ -19,7 +18,7 @@ const setRegional = (value: any) => {
};
const setUid = (value: any) => {
uid.value = value;
selectedUid(value);
selectedUid(value);
uppp.value = { id: 0, name: up3Placholder };
};
@ -33,6 +32,7 @@ const setUlp = (value: any) => {
ulp.value = value;
selectedUp3Ulp(value);
};
</script>
<template>
@ -45,7 +45,7 @@ const setUlp = (value: any) => {
<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 @update:selected="setUid($event)" :data="items" :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">

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

@ -1,7 +1,7 @@
<!-- <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';
import { selectedUid, selectedUp3Ulp,selectedUlp, fetchUid, itemsUid, itemsUp3, itemsUlp } from './reference';
import { ref } from 'vue';
fetchData();
const uidPlaceholder = 'Semua Unit Induk Distribusi/Wilayah';
@ -33,7 +33,7 @@ const setUlp = (value: any) => {
<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 @update:selected="setUid($event)" :data="items" :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">
@ -51,7 +51,10 @@ const setUlp = (value: any) => {
<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 />
<DatePicker @update:date-value="(value) => {
data.periode = value
}
" />
</div>
</template> -->
<template></template>

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

@ -37,6 +37,9 @@
<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 />
<DatePicker @update:date-value="(value) => {
data.periode = value
}
" />
</div>
</template>

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

@ -27,6 +27,9 @@
<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 />
<DatePicker @update:date-value="(value) => {
data.periode = value
}
" />
</div>
</template>

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

@ -2,7 +2,7 @@
import InputNumber from '@/components/Form/InputNumber.vue'
import Select from '@/components/Select.vue'
import DatePicker from '@/components/DatePicker.vue'
import { selectedUid, selectedUppp, selectedPosko ,fetchData, items,itemsUp3, itemsPosko} from './reference';
import { selectedUid, selectedUp3Posko, selectedPosko ,fetchUid, itemsUid,itemsUp3, itemsPosko} from './reference';
import { useTotalReport } from '@/stores/totalReport';
fetchData();
const changeMinReport = (value: any) => {
@ -17,7 +17,7 @@ import { useTotalReport } from '@/stores/totalReport';
<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 @update:selected="selectedUid($event)" :data="items" placeholder="Semua Unit Induk Distribusi/Wilayah"/>
<Select @update:selected="selectedUid($event)" :data="itemsUid" placeholder="Semua Unit Induk Distribusi/Wilayah"/>
</div>
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
@ -25,7 +25,7 @@ import { useTotalReport } from '@/stores/totalReport';
>Unit Pelaksanaan Pelayanan Pelanggan:</label
>
<Select @update:selected="selectedUppp($event)" :data="itemsUp3" placeholder="Semua Unit Pelaksanaan Pelayanan Pelanggan" />
<Select @update:selected="selectedUp3Posko($event)" :data="itemsUp3" placeholder="Semua Unit Pelaksanaan Pelayanan Pelanggan" />
</div>
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">
@ -37,7 +37,10 @@ import { useTotalReport } from '@/stores/totalReport';
<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 />
<DatePicker @update:date-value="(value) => {
data.periode = value
}
" />
</div>
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">

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

@ -61,7 +61,10 @@ import { ref } from 'vue';
<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 />
<DatePicker @update:date-value="(value) => {
data.periode = value
}
" />
</div>
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">

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

@ -21,6 +21,9 @@
<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 />
<DatePicker @update:date-value="(value) => {
data.periode = value
}
" />
</div>
</template>

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

@ -28,7 +28,10 @@
<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 />
<DatePicker @update:date-value="(value) => {
data.periode = value
}
" />
</div>
<div class="sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:items-center">

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

@ -1,12 +1,11 @@
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 { useUp3Store } from '@/stores/up3'
import { getUid, getUp3, getPosko, getUlp } from '@/utils/network'
import { ref } from 'vue'
interface Item {
id: number
id: any
name: any
}
const months = [
@ -29,15 +28,30 @@ const years = ref<Item[]>([])
for (let i = 0; i < 5; i++) {
years.value.push({ id: year - i, name: year - i })
}
// 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 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 {
@ -84,6 +98,31 @@ const fetchDataPosko = async (up3: number) => {
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)
@ -111,7 +150,10 @@ export {
selectedUp3Ulp,
selectedPosko,
selectedUlp,
fetchRegional,
fetchUid,
fetchMedia,
fetchStatus,
itemsUid,
itemsUp3,
itemsPosko,