97 lines
4.4 KiB
Vue
97 lines
4.4 KiB
Vue
<script setup>
|
||
import { Head } from '@inertiajs/vue3';
|
||
import AdminLayout from '../../Layouts/AdminLayout.vue';
|
||
import NewsForm from './Components/NewsForm.vue';
|
||
import StatCards from './Components/StatCards.vue';
|
||
|
||
const props = defineProps({
|
||
site: { type: Object, required: true },
|
||
auth: { type: Object, required: true },
|
||
urls: { type: Object, required: true },
|
||
flash: { type: Object, default: () => ({}) },
|
||
newsItems: { type: Array, default: () => [] },
|
||
newsStats: { type: Object, required: true },
|
||
storeUrl: { type: String, required: true },
|
||
old: { type: Object, default: () => ({}) },
|
||
});
|
||
|
||
const stats = [
|
||
{ label: 'Всего', value: props.newsStats.total },
|
||
{ label: 'Опубликовано', value: props.newsStats.published },
|
||
{ label: 'Черновики', value: props.newsStats.draft },
|
||
];
|
||
|
||
const createLabels = {
|
||
title: 'Заголовок',
|
||
published: 'Сразу опубликовать',
|
||
body: 'Текст новости',
|
||
submit: 'Добавить новость',
|
||
delete: 'Удалить',
|
||
deleteConfirm: 'Удалить эту новость?',
|
||
};
|
||
|
||
const editLabels = {
|
||
...createLabels,
|
||
published: 'Опубликовано',
|
||
submit: 'Сохранить новость',
|
||
};
|
||
</script>
|
||
|
||
<template>
|
||
<Head><title>Новости — {{ site.name }}</title></Head>
|
||
|
||
<AdminLayout :site="site" :auth="auth" :urls="urls" :flash="flash" current="news">
|
||
<section class="admin-hero wrap">
|
||
<div>
|
||
<span class="eyebrow">Контент</span>
|
||
<h1 class="h-display">Новости</h1>
|
||
<p class="lead">Публикации для лендинга и лаунчера с изображениями из S3-хранилища.</p>
|
||
</div>
|
||
<div class="admin-hero__badge"><small>Опубликовано</small><strong>{{ newsStats.published }}</strong></div>
|
||
</section>
|
||
|
||
<div class="admin-page wrap">
|
||
<section class="admin-section">
|
||
<StatCards :items="stats" />
|
||
<article class="portal-card admin-panel corners admin-create-panel">
|
||
<span class="admin-kicker">Новая запись</span>
|
||
<h2 class="h-serif">Добавить новость</h2>
|
||
<NewsForm :action="storeUrl" :allow-image="true" :labels="createLabels" :initial="old" />
|
||
</article>
|
||
</section>
|
||
|
||
<section class="admin-section">
|
||
<div class="admin-section__head">
|
||
<div><span class="eyebrow">Текущие записи</span><h2 class="h-serif">Редактирование</h2></div>
|
||
<p>Записи отсортированы по полю порядка вывода.</p>
|
||
</div>
|
||
|
||
<div v-if="newsItems.length" class="admin-editor-list">
|
||
<details v-for="item in newsItems" :key="item.id" class="portal-card admin-editor">
|
||
<summary>
|
||
<span>
|
||
<strong>{{ item.title }}</strong>
|
||
<small>Порядок: {{ item.sort_order }} · {{ item.created_by }}<template v-if="item.updated_at"> · {{ item.updated_at }}</template></small>
|
||
</span>
|
||
<span :class="['admin-pill', { muted: !item.is_published }]">{{ item.is_published ? 'Опубликовано' : 'Черновик' }}</span>
|
||
</summary>
|
||
<div class="admin-editor__body">
|
||
<img v-if="item.image_url" class="admin-news-image" :src="item.image_url" :alt="item.title" />
|
||
<NewsForm
|
||
:item="item"
|
||
:action="item.update_url"
|
||
:destroy-url="item.destroy_url"
|
||
:allow-image="true"
|
||
:labels="editLabels"
|
||
/>
|
||
</div>
|
||
</details>
|
||
</div>
|
||
<article v-else class="portal-card admin-empty">
|
||
<span>☾</span><h3 class="h-serif">Новостей пока нет</h3><p>Добавь первую публикацию.</p>
|
||
</article>
|
||
</section>
|
||
</div>
|
||
</AdminLayout>
|
||
</template>
|