fregat/web-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Simplify message template page layout

Browse Source
This commit is contained in:
Ruslan Bakiev
2026-04-06 16:01:01 +07:00
parent 372626e2ed
commit 0380c54d60
1 changed files with 20 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
app/pages/messages.vue
View File

@@ -29,13 +29,7 @@ function channelLabel(channel: TemplateChannel['channel']) {
<template>
<section class="space-y-6">
<div class="manager-hero">
<p class="manager-eyebrow">Настройки</p>
<h1 class="manager-title">Сообщения</h1>
<p class="manager-copy">
Здесь менеджер видит реальные шаблоны из backend-кода и может быстро проверить, что именно получает клиент в каждом канале.
</p>
</div>
<h1 class="text-3xl font-extrabold text-[#0f2f20]">Сообщения</h1>
<div v-if="templatesQuery.loading.value" class="manager-empty-state">
Загружаем шаблоны...
@@ -45,13 +39,12 @@ function channelLabel(channel: TemplateChannel['channel']) {
Шаблонов пока нет.
</div>
<div v-else class="space-y-4">
<article
<div v-else class="space-y-6">
<section
v-for="template in templates"
:key="template.id"
class="surface-card rounded-3xl p-5"
>
<h2 class="text-2xl font-black tracking-[-0.03em] text-[#123824]">
<h2 class="text-xl font-bold text-[#123824]">
{{ template.title }}
</h2>
@@ -59,13 +52,13 @@ function channelLabel(channel: TemplateChannel['channel']) {
<section
v-for="channel in template.channels"
:key="`${template.id}-${channel.channel}`"
class="rounded-[24px] border border-[#deebe4] bg-[#fbfdfb] p-4"
class="surface-card rounded-[24px] bg-white p-4"
>
<h3 class="text-sm font-extrabold uppercase tracking-[0.14em] text-[#355947]">
{{ channelLabel(channel.channel) }}
</h3>
<div class="mt-3 rounded-[20px] bg-white p-4">
<div class="mt-3 rounded-[20px] bg-[#f8fbf9] p-4">
<p
v-if="channel.subject"
class="text-xs font-semibold uppercase tracking-[0.12em] text-[#5c7b69]"
@@ -83,18 +76,25 @@ function channelLabel(channel: TemplateChannel['channel']) {
</p>
</div>
<div v-if="channel.buttonText" class="mt-4 space-y-1 text-sm leading-6 text-[#355947]">
<p class="font-semibold text-[#123824]">
<div v-if="channel.buttonText" class="mt-4">
<a
v-if="channel.buttonUrl"
:href="channel.buttonUrl"
class="btn h-11 rounded-full border-0 bg-[#123824] px-5 text-white hover:bg-[#0f2f20]"
>
{{ channel.buttonText }}
</p>
<p v-if="channel.buttonUrl" class="break-all text-xs text-[#5c7b69]">
{{ channel.buttonUrl }}
</p>
</a>
<span
v-else
class="inline-flex h-11 items-center rounded-full bg-[#123824] px-5 text-sm font-semibold text-white"
>
{{ channel.buttonText }}
</span>
</div>
</div>
</section>
</div>
</article>
</section>
</div>
</section>
</template>