diff options
Diffstat (limited to 'packages/frontend/src/pages/admin')
| -rw-r--r-- | packages/frontend/src/pages/admin/ads.vue | 32 |
1 files changed, 24 insertions, 8 deletions
diff --git a/packages/frontend/src/pages/admin/ads.vue b/packages/frontend/src/pages/admin/ads.vue index cd9d86ca45..6aa0cf0427 100644 --- a/packages/frontend/src/pages/admin/ads.vue +++ b/packages/frontend/src/pages/admin/ads.vue @@ -5,11 +5,16 @@ SPDX-License-Identifier: AGPL-3.0-only <template> <MkStickyContainer> - <template #header><XHeader :actions="headerActions" :tabs="headerTabs"/></template> + <template #header> + <XHeader :actions="headerActions" :tabs="headerTabs" /> + </template> <MkSpacer :contentMax="900"> + <MkSwitch :modelValue="publishing" @update:modelValue="onChangePublishing"> + {{ i18n.ts.publishing }} + </MkSwitch> <div> <div v-for="ad in ads" class="_panel _gaps_m" :class="$style.ad"> - <MkAd v-if="ad.url" :specify="ad"/> + <MkAd v-if="ad.url" :specify="ad" /> <MkInput v-model="ad.url" type="url"> <template #label>URL</template> </MkInput> @@ -46,7 +51,8 @@ SPDX-License-Identifier: AGPL-3.0-only <span> {{ i18n.ts._ad.timezoneinfo }} <div v-for="(day, index) in daysOfWeek" :key="index"> - <input :id="`ad${ad.id}-${index}`" type="checkbox" :checked="(ad.dayOfWeek & (1 << index)) !== 0" @change="toggleDayOfWeek(ad, index)"> + <input :id="`ad${ad.id}-${index}`" type="checkbox" :checked="(ad.dayOfWeek & (1 << index)) !== 0" + @change="toggleDayOfWeek(ad, index)"> <label :for="`ad${ad.id}-${index}`">{{ day }}</label> </div> </span> @@ -55,8 +61,10 @@ SPDX-License-Identifier: AGPL-3.0-only <template #label>{{ i18n.ts.memo }}</template> </MkTextarea> <div class="buttons"> - <MkButton class="button" inline primary style="margin-right: 12px;" @click="save(ad)"><i class="ti ti-device-floppy"></i> {{ i18n.ts.save }}</MkButton> - <MkButton class="button" inline danger @click="remove(ad)"><i class="ti ti-trash"></i> {{ i18n.ts.remove }}</MkButton> + <MkButton class="button" inline primary style="margin-right: 12px;" @click="save(ad)"><i + class="ti ti-device-floppy"></i> {{ i18n.ts.save }}</MkButton> + <MkButton class="button" inline danger @click="remove(ad)"><i class="ti ti-trash"></i> {{ i18n.ts.remove }} + </MkButton> </div> </div> <MkButton class="button" @click="more()"> @@ -75,6 +83,7 @@ import MkInput from '@/components/MkInput.vue'; import MkTextarea from '@/components/MkTextarea.vue'; import MkRadios from '@/components/MkRadios.vue'; import MkFolder from '@/components/MkFolder.vue'; +import MkSwitch from '@/components/MkSwitch.vue'; import FormSplit from '@/components/form/split.vue'; import * as os from '@/os.js'; import { i18n } from '@/i18n.js'; @@ -86,8 +95,9 @@ let ads: any[] = $ref([]); const localTime = new Date(); const localTimeDiff = localTime.getTimezoneOffset() * 60 * 1000; const daysOfWeek: string[] = [i18n.ts._weekday.sunday, i18n.ts._weekday.monday, i18n.ts._weekday.tuesday, i18n.ts._weekday.wednesday, i18n.ts._weekday.thursday, i18n.ts._weekday.friday, i18n.ts._weekday.saturday]; +let publishing = false; -os.api('admin/ad/list').then(adsResponse => { +os.api('admin/ad/list', { publishing: publishing }).then(adsResponse => { ads = adsResponse.map(r => { const exdate = new Date(r.expiresAt); const stdate = new Date(r.startsAt); @@ -101,6 +111,10 @@ os.api('admin/ad/list').then(adsResponse => { }); }); +const onChangePublishing = (v) => { + publishing = v; + refresh(); +}; // 選択された曜日(index)のビットフラグを操作する function toggleDayOfWeek(ad, index) { ad.dayOfWeek ^= 1 << index; @@ -131,6 +145,8 @@ function remove(ad) { if (ad.id == null) return; os.apiWithDialog('admin/ad/delete', { id: ad.id, + }).then(() => { + refresh(); }); }); } @@ -172,7 +188,7 @@ function save(ad) { } } function more() { - os.api('admin/ad/list', { untilId: ads.reduce((acc, ad) => ad.id != null ? ad : acc).id }).then(adsResponse => { + os.api('admin/ad/list', { untilId: ads.reduce((acc, ad) => ad.id != null ? ad : acc).id, publishing: publishing }).then(adsResponse => { ads = ads.concat(adsResponse.map(r => { const exdate = new Date(r.expiresAt); const stdate = new Date(r.startsAt); @@ -188,7 +204,7 @@ function more() { } function refresh() { - os.api('admin/ad/list').then(adsResponse => { + os.api('admin/ad/list', { publishing: publishing }).then(adsResponse => { ads = adsResponse.map(r => { const exdate = new Date(r.expiresAt); const stdate = new Date(r.startsAt); |