Создание web-клиента почтового сервиса.
ТЗ на клиентскую часть почты:
Дано:
- только десктоп;
- общение с бэком через websocket;
- можно использовать любые библиотеки / фреймворки, если есть аргументация.
Необходимо реализовать:
- пагинацию для отображения списка писем;
- динамическое обновление списка писем (только входящих, сервер оповестит);
- просмотр писем, в т.ч. html-версий (? блокировка скриптов);
- возможность ответа на письма + написание новых;
- переключения между ящиками + суперпользователь, который может смотреть почту на всех ящиках;
- отдельный вид сообщений - обращения в службу поддержки (с тикетами, после ответа - закрытие тикета).
- возможность шаблонов внешнего вида + возможность просмотра конечного варианта.
-
16 дней10 613 UAH
818 26 0 1 16 дней10 613 UAHЗдравствуйте. Заинтересовал ваш проект
Необходимо обсудить для формирования плана работ, окончательного бюджета и сроков.
Портфолио тут в профиле : -
Freelancehunt
-
5 дней4245 UAH
184 13 1 5 дней4245 UAH
Здравствуйте Вячислав, сделаю всё быстро и качественно.
Имею опыт разработки на Angular TS/JS cli более года в продакшене.
Пишите, консультаций бесплатные)
-
А почему web-клиент в названии, а в дано нужно только десктоп? Так веб или десктоп?
-
Протокол общения с беком есть?
я про описание объектов которые гоняются между ними
-
Сокеты
Запрос:
{
requestId: number,
payload: { [key: string]: any }
}
Ответ:
{
requestId: number,
success: boolean,
error?: string,
payload?: { [key: string]: any }
}
Для удобства можно реализовать ожидание ответа через промисы по requestId с таймаутом.
Отправка сообщения бэком клиенту (напр., при новом сообщении):
{
event: string,
payload: { [key: string]: any }
}
Тут для удобства можно реализовать подписку на события
-
Значение requestId генерирует клиент при запросе
Сервер отвечает на этот запрос с таким же значением requestId
-
понял. спасибо.
-
как выглядит тикет и как он должен обрабатываться? чем отличается от обычного письма?
какой почтовый сервер (серверы) используете? внешний или собственный? -
Почтовый сервер собственный.
Структура письма:
{
id: number, // messageId
from: string,
to: string,
date: number, // unix
subject?: string,
text: string,
html?: string,
checked: boolean
}
Отличия тикета в том, что он приходит не в виде сообщения на почту, а через обращение на платформе:
{
id: number, // ticketId
startDate: number,
endDate?: number,
from: string,
subject: string,
question: string,
answer?: string
}
Отображаться должны в отдельном месте (как будто папка в обычной почте).
При отправке ответа среди прочего должен передаваться id тикета.
Ещё:
есть два варианта тикетов: для зарегистрированных пользователей и для остальных
(возможно, в дальнейшем, для зарегистрированных пользователей будет больше полей).
То есть, должны быть следующие папки сообщений:
- почта (входящие / исходящие);
- тикеты для пользователей платформы;
- тикеты для всех остальных.
Поскольку тикеты подразумевают закрытие после ответа, то для них нужно в одном месте показывать и вопрос, и ответ (при наличии).
Если было открыто входящее сообщение впервые, нужно отправить данные об этом на сервер
(checked изменится на true).
С тикетами такого нет, они считаются прочитанными только после ответа
(endDate и answer перестанут быть null).
Также напоминаю, что нужна возможность использовать шаблон для всех видов исходящих сообщений.
Сам шаблон на сервер передавать не нужно, только текст и название шаблона
(возможно, в дальнейшем, нужна будет возможность простенького конструктора html, но сейчас текст просто подставляется в указанное место).
файлы с шаблонами вида
exports = / export function(body) {
return `<html>...${body}...</html>`;
}
будут.
И напоследок - примеры payload'ов для общения с сервером:
interface OutgoingMailData {
from: string;
to: string;
subject?: string;
text: string;
template?: string;
}
Отправить письмо:
{
type: "sendMessage",
params: OutgoingMailData
}
Ответить на тикет:
{
type: "answerInnerTicket" | "answerOuterTicket",
params: OutgoingMailData & {
ticketId: number
}
}
Письмо прочитано:
{
type: "messageChecked",
params: {
messageId: number
}
}
Загрузить входящие письма:
{
type: "getInboxMessages",
params: {
page?: number = 0,
checked?: boolean = null,
from?: string,
to?: string, // для входящих может быть изменён только для суперпользователя
subject?: string,
text?: string
}
}
Payload бэка на последнее:
{
amount: number, // количество подошедших
list: MailData[]
}
Логика понимания того, какой это пользователь будет позже
-
Актуальные фриланс-проекты в категории Веб-программирование
Мобильная версия сайтаВсем привет. Нужно переделать существующую мобильную версию сайта согласно ТЗ: https://docs.google.com/document/d/1BVV0UGDTEDyZ-EUvFg0RAmEasGKcl6cnK_cBB4Urbko/edit?usp=sharing HTML и CSS верстка, Веб-программирование ∙ 43 минуты назад ∙ 14 ставок |
Новый сайт для sto-vag.com.uaХотим обновить сайт нашего небольшого СТО Сейчас это 1 страница, хотим сделать на много страниц CMS выбирает исполнитель. Для нас главное: - быстрая работа (загрузка) сайта - кроссбраузерность - хорошая мобильная версия СТО останется как есть, для VAG группы (AUDI,… CMS, Веб-программирование ∙ 2 часа 49 минут назад ∙ 33 ставки |
Ищу человека, который поможет наполнить сайт на ВордпрессеИщу ответственного и внимательного человека, чтобы доработать сайт. Создал в коде страницы, которые мне нравятся, и он мне в большинстве случаев выдал статические страницы. В большинстве информация будет статической, поэтому особо менять не буду. Меня больше интересует… AI обработка текстов, Веб-программирование ∙ 4 часа 43 минуты назад ∙ 20 ставок |
Webflow Developer: Адаптация готового шаблона и настройка сайта под запускУ нас есть купленный шаблон на Webflow и финальный дизайн в Figma. Ищем опытного разработчика, который адаптирует шаблон под наши макеты, настроит систему и подготовит сайт к полноценному запуску. Что именно нужно сделать: Адаптировать блоки, верстку и стили шаблона в… Веб-программирование ∙ 7 часов 6 минут назад ∙ 22 ставки |
Интеграция Blade-шаблона статьи | Laravel | Frontend
4493 UAH
Интеграция Blade-шаблона статьи | Laravel | Frontend Суть задачи Сайт на Laravel Готов HTML/CSS макет страницы премиум-статьи блога. Нужно интегрировать его в существующую Blade-структуру сайта. Дизайн готов. Вы ничего не проектируете — только интегрируете. Вы получите: готовый… PHP, Веб-программирование ∙ 11 часов 23 минуты назад ∙ 54 ставки |