silva
/
adrema
2
1
Fork 0
Code Issues 23 Pull Requests 1 Projects 1 Releases 104 Wiki Activity

fix debounce
continuous-integration/drone/push Build is passing Details
continuous-integration/drone/tag Build is passing Details

This commit is contained in:
philipp lang 2023-10-30 23:46:41 +01:00
parent 56a5ec5885
commit fafac446c3
2 changed files with 33 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
resources/js/composables/useIndex.js vendored
View File

@ -16,7 +16,7 @@ export function useIndex(props, siteName) {
const filterString = computed(() => toFilterString(inner.meta.value.filter));
function reload(resetPage = true) {
function reload(resetPage = true, withMeta = true) {
var data = {
filter: filterString.value,
page: 1,
@ -29,7 +29,9 @@ export function useIndex(props, siteName) {
preserveState: true,
onSuccess: (page) => {
inner.data.value = page.props.data.data;
inner.meta.value = page.props.data.meta;
if (withMeta) {
inner.meta.value = page.props.data.meta;
}
},
});
}
@ -44,7 +46,7 @@ export function useIndex(props, siteName) {
function setFilter(key, value) {
inner.meta.value.filter[key] = value;
reload();
reload(true, false);
}
function requestCallback(successMessage, failureMessage) {

72
resources/js/views/contribution/VIndex.vue
View File

@ -1,49 +1,31 @@
<template>
<page-layout>
<form target="_BLANK" class="max-w-4xl w-full mx-auto gap-6 grid-cols-2 grid p-6">
<f-text id="eventName" v-model="values.eventName" name="eventName" class="col-span-2" label="Veranstaltungs-Name" required></f-text>
<f-text id="eventName" v-model="values.eventName" name="eventName" class="col-span-2"
label="Veranstaltungs-Name" required></f-text>
<f-text id="dateFrom" v-model="values.dateFrom" name="dateFrom" type="date" label="Datum von" required></f-text>
<f-text id="dateUntil" v-model="values.dateUntil" name="dateUntil" type="date" label="Datum bis" required></f-text>
<f-text id="dateUntil" v-model="values.dateUntil" name="dateUntil" type="date" label="Datum bis"
required></f-text>
<f-text id="zipLocation" v-model="values.zipLocation" name="zipLocation" label="PLZ / Ort" required></f-text>
<f-select id="country" v-model="values.country" :options="countries" name="country" label="Land" required></f-select>
<f-select id="country" v-model="values.country" :options="countries" name="country" label="Land"
required></f-select>
<div class="border-gray-200 shadow shadow-primary-700 p-3 shadow-[0_0_4px_gray] col-span-2">
<f-text
id="search_text"
ref="search_text_field"
v-model="searchText"
class="col-span-2"
name="search_text"
label="Suchen …"
size="sm"
@keypress.enter.prevent="onSubmitFirstMemberResult"
></f-text>
<f-text id="search_text" ref="search_text_field" v-model="searchText" class="col-span-2" name="search_text"
label="Suchen …" size="sm" @keypress.enter.prevent="onSubmitFirstMemberResult"></f-text>
<div class="mt-2 grid grid-cols-[repeat(auto-fill,minmax(180px,1fr))] gap-2 col-span-2">
<f-switch
v-for="member in search.results"
:id="`members-${member.id}`"
:key="member.id"
v-model="values.members"
:label="`${member.firstname} ${member.lastname}`"
name="members[]"
:value="member.id"
size="sm"
inline
@keypress.enter.prevent="onSubmitMemberResult(member)"
></f-switch>
<f-switch v-for="member in search.results" :id="`members-${member.id}`" :key="member.id"
v-model="values.members" :label="`${member.firstname} ${member.lastname}`" name="members[]"
:value="member.id" size="sm" inline
@keypress.enter.prevent="onSubmitMemberResult(member)"></f-switch>
</div>
</div>
<button
v-for="(compiler, index) in compilers"
class="btn btn-primary mt-3 inline-block"
@click.prevent="
values.type = compiler.class;
submit();
"
v-text="compiler.title"
></button>
<button v-for="(compiler, index) in compilers" class="btn btn-primary mt-3 inline-block" @click.prevent="
values.type = compiler.class;
submit();
" v-text="compiler.title"></button>
</form>
</page-layout>
</template>
@ -80,19 +62,21 @@ export default {
get() {
return this.search.s;
},
set: debounce(async function (event) {
set: function (event) {
this.search.s = event;
var response = await this.axios.post('/api/member/search', {
filter: {
search: event,
hasBirthday: true,
hasFullAddress: true,
},
});
debounce(async () => {
var response = await this.axios.post('/api/member/search', {
filter: {
search: event,
hasBirthday: true,
hasFullAddress: true,
},
});
this.search.results = response.data.data;
}, 300),
this.search.results = response.data.data;
}, 300)();
},
},
},
methods: {