fix: multiple Ads' bugs.
feat: Ads widget https://codeberg.org/calckey/calckey/issues/9138 https://codeberg.org/calckey/calckey/issues/9080
This commit is contained in:
parent
6ac1e417dd
commit
fce27471ab
5 changed files with 41 additions and 41 deletions
|
@ -56,10 +56,13 @@ const choseAd = (): Ad | null => {
|
|||
}
|
||||
|
||||
const lowPriorityAds = ads.filter(ad => ad.ratio === 0);
|
||||
const widgetAds = ads.filter(ad => ad.place === 'widget');
|
||||
ads = ads.filter(ad => ad.ratio !== 0);
|
||||
|
||||
if (ads.length === 0) {
|
||||
if (lowPriorityAds.length !== 0) {
|
||||
|
||||
if (widgetAds.length !== 0) {
|
||||
return widgetAds;
|
||||
} else if (ads.length === 0) {
|
||||
if (lowPriorityAds.length !== 0) {
|
||||
return lowPriorityAds[Math.floor(Math.random() * lowPriorityAds.length)];
|
||||
} else {
|
||||
return null;
|
||||
|
@ -132,7 +135,7 @@ function reduceFrequency(): void {
|
|||
}
|
||||
}
|
||||
|
||||
&.square {
|
||||
&.widget {
|
||||
> a ,
|
||||
> a > img {
|
||||
max-width: min(300px, 100%);
|
||||
|
@ -140,7 +143,7 @@ function reduceFrequency(): void {
|
|||
}
|
||||
}
|
||||
|
||||
&.horizontal {
|
||||
&.inline {
|
||||
padding: 8px;
|
||||
|
||||
> a ,
|
||||
|
@ -150,7 +153,7 @@ function reduceFrequency(): void {
|
|||
}
|
||||
}
|
||||
|
||||
&.horizontal-big {
|
||||
&.inline-big {
|
||||
padding: 8px;
|
||||
|
||||
> a ,
|
||||
|
|
|
@ -13,20 +13,12 @@
|
|||
</MkInput>
|
||||
<FormRadios v-model="ad.place" class="_formBlock">
|
||||
<template #label>Form</template>
|
||||
<option value="square">square</option>
|
||||
<option value="horizontal">horizontal</option>
|
||||
<option value="horizontal-big">horizontal-big</option>
|
||||
<option value="widget">widget</option>
|
||||
<option value="inline">inline</option>
|
||||
<option value="inline-big">inline-big</option>
|
||||
</FormRadios>
|
||||
<!--
|
||||
<div style="margin: 32px 0;">
|
||||
{{ i18n.ts.priority }}
|
||||
<MkRadio v-model="ad.priority" value="high">{{ i18n.ts.high }}</MkRadio>
|
||||
<MkRadio v-model="ad.priority" value="middle">{{ i18n.ts.middle }}</MkRadio>
|
||||
<MkRadio v-model="ad.priority" value="low">{{ i18n.ts.low }}</MkRadio>
|
||||
</div>
|
||||
-->
|
||||
<FormSplit>
|
||||
<MkInput v-model="ad.ratio" type="number">
|
||||
<MkInput :disabled="ad.place === 'widget'" v-model="ad.ratio" type="number">
|
||||
<template #label>{{ i18n.ts.ratio }}</template>
|
||||
</MkInput>
|
||||
<MkInput v-model="ad.expiresAt" type="date">
|
||||
|
@ -56,23 +48,29 @@ import FormSplit from '@/components/form/split.vue';
|
|||
import * as os from '@/os';
|
||||
import { i18n } from '@/i18n';
|
||||
import { definePageMetadata } from '@/scripts/page-metadata';
|
||||
import { formatDateTimeString } from '@/scripts/format-time-string';
|
||||
|
||||
let ads: any[] = $ref([]);
|
||||
|
||||
os.api('admin/ad/list').then(adsResponse => {
|
||||
ads = adsResponse;
|
||||
// The date format should be changed to yyyy-MM-dd in order to be properly displayed
|
||||
for (let i in ads) {
|
||||
ads[i].expiresAt = ads[i].expiresAt.substr(0, 10);
|
||||
}
|
||||
});
|
||||
|
||||
function add() {
|
||||
const tomorrow = formatDateTimeString(new Date(new Date().setDate(new Date().getDate() + 1)), 'yyyy-MM-dd');
|
||||
ads.unshift({
|
||||
id: null,
|
||||
memo: '',
|
||||
place: 'square',
|
||||
place: 'widget',
|
||||
priority: 'middle',
|
||||
ratio: 1,
|
||||
url: '',
|
||||
imageUrl: null,
|
||||
expiresAt: null,
|
||||
expiresAt: tomorrow,
|
||||
});
|
||||
}
|
||||
|
||||
|
|
|
@ -1,11 +1,10 @@
|
|||
<template>
|
||||
<div class="ddiqwdnk">
|
||||
<XWidgets class="widgets" :edit="editMode" :widgets="$store.reactiveState.widgets.value.filter(w => w.place === place)" @add-widget="addWidget" @remove-widget="removeWidget" @update-widget="updateWidget" @update-widgets="updateWidgets" @exit="editMode = false"/>
|
||||
<MkAd class="a" :prefer="['square']"/>
|
||||
|
||||
<button v-if="editMode" class="_textButton edit" style="font-size: 0.9em;" @click="editMode = false"><i class="ph-check-bold ph-lg"></i> {{ i18n.ts.editWidgetsExit }}</button>
|
||||
<button v-else class="_textButton edit" style="font-size: 0.9em;" @click="editMode = true"><i class="ph-pencil-bold ph-lg"></i> {{ i18n.ts.editWidgets }}</button>
|
||||
</div>
|
||||
<div class="ddiqwdnk">
|
||||
<MkAd class="a" :prefer="['widget']"/>
|
||||
<XWidgets class="widgets" :edit="editMode" :widgets="$store.reactiveState.widgets.value.filter(w => w.place === place)" @add-widget="addWidget" @remove-widget="removeWidget" @update-widget="updateWidget" @update-widgets="updateWidgets" @exit="editMode = false"/>
|
||||
<button v-if="editMode" class="_textButton edit" style="font-size: 0.9em;" @click="editMode = false"><i class="ph-check-bold ph-lg"></i> {{ i18n.ts.editWidgetsExit }}</button>
|
||||
<button v-else class="_textButton edit" style="font-size: 0.9em;" @click="editMode = true"><i class="ph-pencil-bold ph-lg"></i> {{ i18n.ts.editWidgets }}</button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
|
|
|
@ -1,12 +1,12 @@
|
|||
<template>
|
||||
<XColumn :menu="menu" :naked="true" :column="column" :is-stacked="isStacked" @parent-focus="$event => emit('parent-focus', $event)">
|
||||
<template #header><i class="ph-browser-bold ph-lg" style="margin-right: 8px;"></i>{{ column.name }}</template>
|
||||
|
||||
<div class="wtdtxvec">
|
||||
<div v-if="!(column.widgets && column.widgets.length > 0) && !edit" class="intro">{{ i18n.ts._deck.widgetsIntroduction }}</div>
|
||||
<XWidgets :edit="edit" :widgets="column.widgets" @add-widget="addWidget" @remove-widget="removeWidget" @update-widget="updateWidget" @update-widgets="updateWidgets" @exit="edit = false"/>
|
||||
</div>
|
||||
</XColumn>
|
||||
<XColumn :menu="menu" :naked="true" :column="column" :is-stacked="isStacked" @parent-focus="$event => emit('parent-focus', $event)">
|
||||
<template #header><i class="ph-browser-bold ph-lg" style="margin-right: 8px;"></i>{{ column.name }}</template>
|
||||
<div class="wtdtxvec">
|
||||
<MkAd class="a" :prefer="['widget']"/>
|
||||
<div v-if="!(column.widgets && column.widgets.length > 0) && !edit" class="intro">{{ i18n.ts._deck.widgetsIntroduction }}</div>
|
||||
<XWidgets :edit="edit" :widgets="column.widgets" @add-widget="addWidget" @remove-widget="removeWidget" @update-widget="updateWidget" @update-widgets="updateWidgets" @exit="edit = false"/>
|
||||
</div>
|
||||
</XColumn>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
<template>
|
||||
<div class="efzpzdvf">
|
||||
<XWidgets :edit="editMode" :widgets="defaultStore.reactiveState.widgets.value" @add-widget="addWidget" @remove-widget="removeWidget" @update-widget="updateWidget" @update-widgets="updateWidgets" @exit="editMode = false"/>
|
||||
|
||||
<button v-if="editMode" class="_textButton" style="font-size: 0.9em;" @click="editMode = false"><i class="ph-check-bold ph-lg"></i> {{ i18n.ts.editWidgetsExit }}</button>
|
||||
<button v-else class="_textButton mk-widget-edit" style="font-size: 0.9em;" @click="editMode = true"><i class="ph-pencil-bold ph-lg"></i> {{ i18n.ts.editWidgets }}</button>
|
||||
</div>
|
||||
<div class="efzpzdvf">
|
||||
<MkAd class="a" :prefer="['widget']"/>
|
||||
<XWidgets :edit="editMode" :widgets="defaultStore.reactiveState.widgets.value" @add-widget="addWidget" @remove-widget="removeWidget" @update-widget="updateWidget" @update-widgets="updateWidgets" @exit="editMode = false"/>
|
||||
<button v-if="editMode" class="_textButton" style="font-size: 0.9em;" @click="editMode = false"><i class="ph-check-bold ph-lg"></i> {{ i18n.ts.editWidgetsExit }}</button>
|
||||
<button v-else class="_textButton mk-widget-edit" style="font-size: 0.9em;" @click="editMode = true"><i class="ph-pencil-bold ph-lg"></i> {{ i18n.ts.editWidgets }}</button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
|
|
Loading…
Reference in a new issue