VC-HB3-Accelerator/DLE
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

ваше сообщение коммита

Browse Source
This commit is contained in:
Alex
2025-06-19 20:19:09 +03:00
parent 90a088e021
commit f728c5f5da
24 changed files with 512 additions and 183 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
frontend/src/views/ContactsView.vue
View File

@@ -1,19 +1,11 @@
<template>
<BaseLayout>
<div class="contacts-tabs">
<button :class="{active: tab==='all'}" @click="tab='all'">Все контакты</button>
<button :class="{active: tab==='newContacts'}" @click="tab='newContacts'; markContactsAsRead()">
Новые контакты
<span v-if="newContacts.length" class="badge">{{ newContacts.length }}</span>
</button>
<button :class="{active: tab==='newMessages'}" @click="tab='newMessages'; markMessagesAsRead()">
Новые сообщения
<span v-if="newMessages.length" class="badge">{{ newMessages.length }}</span>
</button>
<div class="contacts-header">
<span>Контакты</span>
<span v-if="newContacts.length" class="badge">+{{ newContacts.length }}</span>
</div>
<ContactTable v-if="tab==='all'" :contacts="contacts" />
<ContactTable v-if="tab==='newContacts'" :contacts="newContacts" />
<MessagesTable v-if="tab==='newMessages'" :messages="newMessages" />
<ContactTable :contacts="contacts" :new-contacts="newContacts" :new-messages="newMessages" @markNewAsRead="markContactsAsRead"
:markMessagesAsReadForUser="markMessagesAsReadForUser" :markContactAsRead="markContactAsRead" />
</BaseLayout>
</template>
@@ -22,13 +14,11 @@ import { ref } from 'vue';
import { useRouter } from 'vue-router';
import BaseLayout from '../components/BaseLayout.vue';
import ContactTable from '../components/ContactTable.vue';
import MessagesTable from '../components/MessagesTable.vue';
import { useContactsAndMessagesWebSocket } from '../composables/useContactsWebSocket';
const tab = ref('all');
const {
contacts, newContacts, newMessages,
markContactsAsRead, markMessagesAsRead
markContactsAsRead, markMessagesAsReadForUser, markContactAsRead
} = useContactsAndMessagesWebSocket();
const router = useRouter();
@@ -42,26 +32,13 @@ function goBack() {
</script>
<style scoped>
.contacts-tabs {
.contacts-header {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 24px;
}
.contacts-tabs button {
background: #f5f7fa;
border: none;
border-radius: 8px 8px 0 0;
padding: 10px 22px;
font-size: 1.08rem;
cursor: pointer;
position: relative;
transition: background 0.18s, color 0.18s;
}
.contacts-tabs button.active {
background: #fff;
color: #17a2b8;
font-size: 1.2rem;
font-weight: 600;
box-shadow: 0 -2px 8px rgba(0,0,0,0.04);
margin-bottom: 24px;
}
.badge {
background: #dc3545;

1
frontend/src/views/CrmView.vue
View File

@@ -95,7 +95,6 @@ function connectWebSocket() {
// Функция для перехода на домашнюю страницу и открытия боковой панели
const goToHomeAndShowSidebar = () => {
setToStorage('showWalletSidebar', true);
router.push({ name: 'home' });
};

1
frontend/src/views/SettingsView.vue
View File

@@ -59,7 +59,6 @@ const handleAuthEvent = (eventData) => {
};
const goToHomeAndShowSidebar = () => {
setToStorage('showWalletSidebar', true);
router.push({ name: 'home' });
};

190
frontend/src/views/contacts/ContactDetailsView.vue
View File

@@ -1,103 +1,103 @@
<template>
<BaseLayout>
<div class="contact-details-page">
<div v-if="isLoading">Загрузка...</div>
<div v-else-if="!contact">Контакт не найден</div>
<div v-else class="contact-details-content">
<div class="contact-details-header">
<h2>Детали контакта</h2>
<div class="contact-details-page">
<div v-if="isLoading">Загрузка...</div>
<div v-else-if="!contact">Контакт не найден</div>
<div v-else class="contact-details-content">
<div class="contact-details-header">
<h2>Детали контакта</h2>
<button class="close-btn" @click="goBack">×</button>
</div>
<div class="contact-info-block">
<div>
<strong>Имя:</strong>
<input v-model="editableName" class="edit-input" @blur="saveName" @keyup.enter="saveName" />
<span v-if="isSavingName" class="saving">Сохранение...</span>
</div>
<div><strong>Email:</strong> {{ contact.email || '-' }}</div>
<div><strong>Telegram:</strong> {{ contact.telegram || '-' }}</div>
<div><strong>Кошелек:</strong> {{ contact.wallet || '-' }}</div>
<div>
<strong>Язык:</strong>
<div class="multi-select">
<div class="selected-langs">
<span v-for="lang in selectedLanguages" :key="lang" class="lang-tag">
{{ getLanguageLabel(lang) }}
<span class="remove-tag" @click="removeLanguage(lang)">×</span>
</span>
<input
v-model="langInput"
@focus="showLangDropdown = true"
@input="showLangDropdown = true"
@keydown.enter.prevent="addLanguageFromInput"
class="lang-input"
placeholder="Добавить язык..."
/>
</div>
<ul v-if="showLangDropdown" class="lang-dropdown">
<li
v-for="lang in filteredLanguages"
:key="lang.value"
@mousedown.prevent="addLanguage(lang.value)"
:class="{ selected: selectedLanguages.includes(lang.value) }"
>
{{ lang.label }}
</li>
</ul>
</div>
<span v-if="isSavingLangs" class="saving">Сохранение...</span>
</div>
<div><strong>Дата создания:</strong> {{ formatDate(contact.created_at) }}</div>
<div><strong>Дата последнего сообщения:</strong> {{ formatDate(lastMessageDate) }}</div>
<div class="user-tags-block">
<strong>Теги пользователя:</strong>
<span v-for="tag in userTags" :key="tag.id" class="user-tag">
{{ tag.name }}
<span class="remove-tag" @click="removeUserTag(tag.id)">×</span>
</span>
<button class="add-tag-btn" @click="openTagModal">Добавить тег</button>
</div>
<button class="delete-btn" @click="deleteContact">Удалить контакт</button>
</div>
<div class="messages-block">
<h3>История сообщений</h3>
<div v-if="isLoadingMessages" class="loading">Загрузка...</div>
<div v-else-if="messages.length === 0" class="empty">Нет сообщений</div>
<div v-else class="messages-list">
<Message v-for="msg in messages" :key="msg.id" :message="msg" />
</div>
</div>
<el-dialog v-model="showTagModal" title="Добавить тег пользователю">
<div v-if="allTags.length">
<el-select
v-model="selectedTags"
multiple
filterable
placeholder="Выберите теги"
@change="addTagsToUser"
>
<el-option
v-for="tag in allTags"
:key="tag.id"
:label="tag.name"
:value="tag.id"
/>
</el-select>
<div style="margin-top: 1em; color: #888; font-size: 0.95em;">
<strong>Существующие теги:</strong>
<span v-for="tag in allTags" :key="'list-' + tag.id" style="margin-right: 0.7em;">
{{ tag.name }}<span v-if="tag.description"> ({{ tag.description }})</span>
</span>
</div>
</div>
<div style="margin-top: 1em;">
<el-input v-model="newTagName" placeholder="Новый тег" />
<el-input v-model="newTagDescription" placeholder="Описание" />
<el-button type="primary" @click="createTag">Создать тег</el-button>
</div>
</el-dialog>
</div>
<div class="contact-info-block">
<div>
<strong>Имя:</strong>
<input v-model="editableName" class="edit-input" @blur="saveName" @keyup.enter="saveName" />
<span v-if="isSavingName" class="saving">Сохранение...</span>
</div>
<div><strong>Email:</strong> {{ contact.email || '-' }}</div>
<div><strong>Telegram:</strong> {{ contact.telegram || '-' }}</div>
<div><strong>Кошелек:</strong> {{ contact.wallet || '-' }}</div>
<div>
<strong>Язык:</strong>
<div class="multi-select">
<div class="selected-langs">
<span v-for="lang in selectedLanguages" :key="lang" class="lang-tag">
{{ getLanguageLabel(lang) }}
<span class="remove-tag" @click="removeLanguage(lang)">×</span>
</span>
<input
v-model="langInput"
@focus="showLangDropdown = true"
@input="showLangDropdown = true"
@keydown.enter.prevent="addLanguageFromInput"
class="lang-input"
placeholder="Добавить язык..."
/>
</div>
<ul v-if="showLangDropdown" class="lang-dropdown">
<li
v-for="lang in filteredLanguages"
:key="lang.value"
@mousedown.prevent="addLanguage(lang.value)"
:class="{ selected: selectedLanguages.includes(lang.value) }"
>
{{ lang.label }}
</li>
</ul>
</div>
<span v-if="isSavingLangs" class="saving">Сохранение...</span>
</div>
<div><strong>Дата создания:</strong> {{ formatDate(contact.created_at) }}</div>
<div><strong>Дата последнего сообщения:</strong> {{ formatDate(lastMessageDate) }}</div>
<div class="user-tags-block">
<strong>Теги пользователя:</strong>
<span v-for="tag in userTags" :key="tag.id" class="user-tag">
{{ tag.name }}
<span class="remove-tag" @click="removeUserTag(tag.id)">×</span>
</span>
<button class="add-tag-btn" @click="openTagModal">Добавить тег</button>
</div>
<button class="delete-btn" @click="deleteContact">Удалить контакт</button>
</div>
<div class="messages-block">
<h3>История сообщений</h3>
<div v-if="isLoadingMessages" class="loading">Загрузка...</div>
<div v-else-if="messages.length === 0" class="empty">Нет сообщений</div>
<div v-else class="messages-list">
<Message v-for="msg in messages" :key="msg.id" :message="msg" />
</div>
</div>
<el-dialog v-model="showTagModal" title="Добавить тег пользователю">
<div v-if="allTags.length">
<el-select
v-model="selectedTags"
multiple
filterable
placeholder="Выберите теги"
@change="addTagsToUser"
>
<el-option
v-for="tag in allTags"
:key="tag.id"
:label="tag.name"
:value="tag.id"
/>
</el-select>
<div style="margin-top: 1em; color: #888; font-size: 0.95em;">
<strong>Существующие теги:</strong>
<span v-for="tag in allTags" :key="'list-' + tag.id" style="margin-right: 0.7em;">
{{ tag.name }}<span v-if="tag.description"> ({{ tag.description }})</span>
</span>
</div>
</div>
<div style="margin-top: 1em;">
<el-input v-model="newTagName" placeholder="Новый тег" />
<el-input v-model="newTagDescription" placeholder="Описание" />
<el-button type="primary" @click="createTag">Создать тег</el-button>
</div>
</el-dialog>
</div>
</div>
</BaseLayout>
</template>

16
frontend/src/views/tables/TableView.vue
View File

@@ -1,14 +1,14 @@
<template>
<BaseLayout>
<div class="table-block-wrapper">
<div class="tableview-header-row">
<button class="nav-btn" @click="goToTables">Таблицы</button>
<button class="nav-btn" @click="goToCreate">Создать таблицу</button>
<button class="close-btn" @click="closeTable">Закрыть</button>
<button class="action-btn" @click="goToEdit">Редактировать</button>
<button class="danger-btn" @click="goToDelete">Удалить</button>
</div>
<UserTableView :table-id="Number($route.params.id)" />
<div class="tableview-header-row">
<button class="nav-btn" @click="goToTables">Таблицы</button>
<button class="nav-btn" @click="goToCreate">Создать таблицу</button>
<button class="close-btn" @click="closeTable">Закрыть</button>
<button class="action-btn" @click="goToEdit">Редактировать</button>
<button class="danger-btn" @click="goToDelete">Удалить</button>
</div>
<UserTableView :table-id="Number($route.params.id)" />
</div>
</BaseLayout>
</template>

6
frontend/src/views/tables/TablesListView.vue
View File

@@ -2,8 +2,8 @@
<BaseLayout>
<div class="tables-list-block">
<button class="close-btn" @click="goBack">×</button>
<h2>Список таблиц</h2>
<UserTablesList />
<h2>Список таблиц</h2>
<UserTablesList />
</div>
</BaseLayout>
</template>
@@ -21,7 +21,7 @@ function goBack() {
router.push({ name: 'crm' });
}
}
</script>
</script>
<style scoped>
.tables-list-block {

2
frontend/src/views/tables/TagsTableViewPage.vue
View File

@@ -3,7 +3,7 @@
<TagsTableView />
</BaseLayout>
</template>
<script setup>
import BaseLayout from '../../components/BaseLayout.vue';
import TagsTableView from '../../components/tables/TagsTableView.vue';