natty
/
calckey
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

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:
yawhn 2023-02-24 13:58:45 +02:00
parent 6ac1e417dd
commit fce27471ab
5 changed files with 41 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
packages/client/src/components/global/MkAd.vue
View File

@ -56,10 +56,13 @@ const choseAd = (): Ad | null => {
} }
const lowPriorityAds = ads.filter(ad => ad.ratio === 0); const lowPriorityAds = ads.filter(ad => ad.ratio === 0);
const widgetAds = ads.filter(ad => ad.place === 'widget');
ads = ads.filter(ad => ad.ratio !== 0); ads = ads.filter(ad => ad.ratio !== 0);
if (ads.length === 0) { if (widgetAds.length !== 0) {
if (lowPriorityAds.length !== 0) { return widgetAds;
} else if (ads.length === 0) {
if (lowPriorityAds.length !== 0) {
return lowPriorityAds[Math.floor(Math.random() * lowPriorityAds.length)]; return lowPriorityAds[Math.floor(Math.random() * lowPriorityAds.length)];
} else { } else {
return null; return null;
@ -132,7 +135,7 @@ function reduceFrequency(): void {
} }
} }
&.square { &.widget {
> a , > a ,
> a > img { > a > img {
max-width: min(300px, 100%); max-width: min(300px, 100%);
@ -140,7 +143,7 @@ function reduceFrequency(): void {
} }
} }
&.horizontal { &.inline {
padding: 8px; padding: 8px;
> a , > a ,
@ -150,7 +153,7 @@ function reduceFrequency(): void {
} }
} }
&.horizontal-big { &.inline-big {
padding: 8px; padding: 8px;
> a , > a ,

26
packages/client/src/pages/admin/promotions.vue
View File

@ -13,20 +13,12 @@
</MkInput> </MkInput>
<FormRadios v-model="ad.place" class="_formBlock"> <FormRadios v-model="ad.place" class="_formBlock">
<template #label>Form</template> <template #label>Form</template>
<option value="square">square</option> <option value="widget">widget</option>
<option value="horizontal">horizontal</option> <option value="inline">inline</option>
<option value="horizontal-big">horizontal-big</option> <option value="inline-big">inline-big</option>
</FormRadios> </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> <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> <template #label>{{ i18n.ts.ratio }}</template>
</MkInput> </MkInput>
<MkInput v-model="ad.expiresAt" type="date"> <MkInput v-model="ad.expiresAt" type="date">
@ -56,23 +48,29 @@ import FormSplit from '@/components/form/split.vue';
import * as os from '@/os'; import * as os from '@/os';
import { i18n } from '@/i18n'; import { i18n } from '@/i18n';
import { definePageMetadata } from '@/scripts/page-metadata'; import { definePageMetadata } from '@/scripts/page-metadata';
import { formatDateTimeString } from '@/scripts/format-time-string';
let ads: any[] = $ref([]); let ads: any[] = $ref([]);
os.api('admin/ad/list').then(adsResponse => { os.api('admin/ad/list').then(adsResponse => {
ads = 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() { function add() {
const tomorrow = formatDateTimeString(new Date(new Date().setDate(new Date().getDate() + 1)), 'yyyy-MM-dd');
ads.unshift({ ads.unshift({
id: null, id: null,
memo: '', memo: '',
place: 'square', place: 'widget',
priority: 'middle', priority: 'middle',
ratio: 1, ratio: 1,
url: '', url: '',
imageUrl: null, imageUrl: null,
expiresAt: null, expiresAt: tomorrow,
}); });
} }

13
packages/client/src/ui/classic.widgets.vue
View File

@ -1,11 +1,10 @@
<template> <template>
<div class="ddiqwdnk"> <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="['widget']"/>
<MkAd class="a" :prefer="['square']"/> <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-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>
<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>
</template> </template>
<script lang="ts"> <script lang="ts">

16
packages/client/src/ui/deck/widgets-column.vue
View File

@ -1,12 +1,12 @@
<template> <template>
<XColumn :menu="menu" :naked="true" :column="column" :is-stacked="isStacked" @parent-focus="$event => emit('parent-focus', $event)"> <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> <template #header><i class="ph-browser-bold ph-lg" style="margin-right: 8px;"></i>{{ column.name }}</template>
<div class="wtdtxvec">
<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> <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"/> <XWidgets :edit="edit" :widgets="column.widgets" @add-widget="addWidget" @remove-widget="removeWidget" @update-widget="updateWidget" @update-widgets="updateWidgets" @exit="edit = false"/>
</div> </div>
</XColumn> </XColumn>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>

12
packages/client/src/ui/universal.widgets.vue
View File

@ -1,10 +1,10 @@
<template> <template>
<div class="efzpzdvf"> <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"/> <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-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> <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>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>