killer-cf
9a5f2b294d
- Replaced instances of `authStore` with `currentUser` to streamline user authentication handling. - Updated permission checks and user-related data retrieval to utilize the new `useQuery` for better performance and clarity. - Cleaned up component structures and improved formatting for consistency and readability. - Enhanced error handling and user feedback mechanisms in various components to improve user experience.
2272 lines
76 KiB
Svelte
2272 lines
76 KiB
Svelte
<script lang="ts">
|
|
import { useQuery, useConvexClient } from "convex-svelte";
|
|
import { api } from "@sgse-app/backend/convex/_generated/api";
|
|
import { format } from "date-fns";
|
|
import { ptBR } from "date-fns/locale";
|
|
import type { Id, Doc } from "@sgse-app/backend/convex/_generated/dataModel";
|
|
|
|
// Tipos para agendamentos
|
|
type TipoAgendamento = "email" | "chat";
|
|
type StatusAgendamento = "agendado" | "enviado" | "cancelado";
|
|
|
|
interface AgendamentoEmail {
|
|
_id: Id<"notificacoesEmail">;
|
|
_creationTime: number;
|
|
destinatario: string;
|
|
destinatarioId: Id<"usuarios"> | undefined;
|
|
assunto: string;
|
|
corpo: string;
|
|
templateId: Id<"templatesMensagens"> | undefined;
|
|
status: "pendente" | "enviando" | "enviado" | "falha";
|
|
agendadaPara: number | undefined;
|
|
enviadoPor: Id<"usuarios">;
|
|
criadoEm: number;
|
|
enviadoEm: number | undefined;
|
|
destinatarioInfo: Doc<"usuarios"> | null;
|
|
templateInfo: Doc<"templatesMensagens"> | null;
|
|
}
|
|
|
|
interface AgendamentoChat {
|
|
_id: Id<"mensagens">;
|
|
_creationTime: number;
|
|
conversaId: Id<"conversas">;
|
|
remetenteId: Id<"usuarios">;
|
|
conteudo: string;
|
|
agendadaPara: number | undefined;
|
|
enviadaEm: number;
|
|
conversaInfo: Doc<"conversas"> | null;
|
|
destinatarioInfo: Doc<"usuarios"> | null;
|
|
}
|
|
|
|
type Agendamento =
|
|
| { tipo: "email"; dados: AgendamentoEmail }
|
|
| { tipo: "chat"; dados: AgendamentoChat };
|
|
|
|
const client = useConvexClient();
|
|
const currentUser = useQuery(api.auth.getCurrentUser, {});
|
|
|
|
// Queries
|
|
const templatesQuery = useQuery(api.templatesMensagens.listarTemplates, {});
|
|
const usuariosQuery = useQuery(api.usuarios.listar, {});
|
|
|
|
// Mapa de emailIds para rastrear status
|
|
let emailIdsRastreados = $state<Set<string>>(new Set());
|
|
|
|
// Query para buscar status dos emails (só executa quando há IDs)
|
|
const emailIdsArray = $derived(
|
|
Array.from(emailIdsRastreados).map((id) => id as Id<"notificacoesEmail">),
|
|
);
|
|
// Usar função para evitar execução quando array está vazio
|
|
const emailsStatusQuery = $derived.by(() => {
|
|
if (emailIdsArray.length === 0) return null;
|
|
return useQuery(api.email.buscarEmailsPorIds, { emailIds: emailIdsArray });
|
|
});
|
|
|
|
// Queries para agendamentos
|
|
const agendamentosEmailQuery = useQuery(
|
|
api.email.listarAgendamentosEmail,
|
|
{},
|
|
);
|
|
const agendamentosChatQuery = useQuery(api.chat.listarAgendamentosChat, {});
|
|
|
|
// Filtro de agendamentos
|
|
type FiltroAgendamento = "todos" | "agendados" | "enviados";
|
|
let filtroAgendamento = $state<FiltroAgendamento>("todos");
|
|
|
|
// Extrair dados das queries de forma robusta
|
|
const templates = $derived.by(() => {
|
|
if (templatesQuery === undefined || templatesQuery === null) {
|
|
return [];
|
|
}
|
|
if ("data" in templatesQuery && templatesQuery.data !== undefined) {
|
|
return Array.isArray(templatesQuery.data) ? templatesQuery.data : [];
|
|
}
|
|
if (Array.isArray(templatesQuery)) {
|
|
return templatesQuery;
|
|
}
|
|
return [];
|
|
});
|
|
|
|
const usuarios = $derived.by(() => {
|
|
if (usuariosQuery === undefined || usuariosQuery === null) {
|
|
return [];
|
|
}
|
|
if ("data" in usuariosQuery && usuariosQuery.data !== undefined) {
|
|
return Array.isArray(usuariosQuery.data) ? usuariosQuery.data : [];
|
|
}
|
|
if (Array.isArray(usuariosQuery)) {
|
|
return usuariosQuery;
|
|
}
|
|
return [];
|
|
});
|
|
|
|
// Estados de carregamento e erro
|
|
const carregandoTemplates = $derived(
|
|
templatesQuery === undefined || templatesQuery === null,
|
|
);
|
|
const carregandoUsuarios = $derived(
|
|
usuariosQuery === undefined || usuariosQuery === null,
|
|
);
|
|
|
|
// Verificar erros de forma mais robusta
|
|
const erroTemplates = $derived.by(() => {
|
|
if (templatesQuery === undefined || templatesQuery === null) return false;
|
|
// Verificar se é um objeto com propriedade error
|
|
if (typeof templatesQuery === "object" && "error" in templatesQuery) {
|
|
return (
|
|
templatesQuery.error !== undefined && templatesQuery.error !== null
|
|
);
|
|
}
|
|
return false;
|
|
});
|
|
|
|
const erroUsuarios = $derived.by(() => {
|
|
if (usuariosQuery === undefined || usuariosQuery === null) return false;
|
|
if (typeof usuariosQuery === "object" && "error" in usuariosQuery) {
|
|
return usuariosQuery.error !== undefined && usuariosQuery.error !== null;
|
|
}
|
|
return false;
|
|
});
|
|
|
|
// Log para debug (remover depois se necessário)
|
|
$effect(() => {
|
|
if (templatesQuery !== undefined && templatesQuery !== null) {
|
|
console.log("Templates Query:", templatesQuery);
|
|
console.log("Templates Extraídos:", templates);
|
|
}
|
|
});
|
|
|
|
let destinatarioId = $state("");
|
|
let enviarParaTodos = $state(false);
|
|
let canal = $state<"chat" | "email" | "ambos">("chat");
|
|
let templateId = $state("");
|
|
let mensagemPersonalizada = $state("");
|
|
let usarTemplate = $state(true);
|
|
let processando = $state(false);
|
|
let criandoTemplates = $state(false);
|
|
let progressoEnvio = $state({ total: 0, enviados: 0, falhas: 0 });
|
|
|
|
// Estrutura de dados para logs de envio
|
|
type StatusLog = "sucesso" | "erro" | "fila" | "info" | "enviando";
|
|
type TipoLog = "chat" | "email";
|
|
type LogEnvio = {
|
|
timestamp: number;
|
|
tipo: TipoLog;
|
|
destinatario: string;
|
|
status: StatusLog;
|
|
mensagem: string;
|
|
emailId?: string; // Para emails, guardar o ID para rastrear status
|
|
};
|
|
|
|
let logsEnvio = $state<LogEnvio[]>([]);
|
|
let terminalScrollRef: HTMLDivElement | null = $state(null);
|
|
|
|
// Estados para agendamento
|
|
let agendarEnvio = $state(false);
|
|
let dataAgendamento = $state("");
|
|
let horaAgendamento = $state("");
|
|
|
|
// Calcular data/hora mínimas
|
|
const now = new Date();
|
|
const minDate = format(now, "yyyy-MM-dd");
|
|
|
|
// Hora mínima recalculada baseada na data selecionada
|
|
const horaMinima = $derived.by(() => {
|
|
if (!dataAgendamento) return format(now, "HH:mm");
|
|
const hoje = format(now, "yyyy-MM-dd");
|
|
if (dataAgendamento === hoje) {
|
|
return format(now, "HH:mm");
|
|
}
|
|
return undefined; // Sem restrição se for data futura
|
|
});
|
|
|
|
function getPreviewAgendamento(): string {
|
|
if (!agendarEnvio || !dataAgendamento || !horaAgendamento) return "";
|
|
try {
|
|
const dataHora = new Date(`${dataAgendamento}T${horaAgendamento}`);
|
|
return `Será enviada em ${format(dataHora, "dd/MM/yyyy 'às' HH:mm", { locale: ptBR })}`;
|
|
} catch {
|
|
return "";
|
|
}
|
|
}
|
|
|
|
// Estados para modal de novo template
|
|
let modalNovoTemplateAberto = $state(false);
|
|
let codigoTemplate = $state("");
|
|
let nomeTemplate = $state("");
|
|
let tituloTemplate = $state("");
|
|
let corpoTemplate = $state("");
|
|
let variaveisTemplate = $state("");
|
|
let criandoNovoTemplate = $state(false);
|
|
|
|
// Estado para mensagens de feedback
|
|
let mensagem = $state<{
|
|
tipo: "success" | "error" | "info";
|
|
texto: string;
|
|
} | null>(null);
|
|
|
|
const templateSelecionado = $derived(
|
|
templates.find((t) => t._id === templateId),
|
|
);
|
|
|
|
// Função para renderizar template com variáveis (similar à função do backend)
|
|
function renderizarTemplate(
|
|
template: string,
|
|
variaveis: Record<string, string>,
|
|
): string {
|
|
let resultado = template;
|
|
|
|
for (const [chave, valor] of Object.entries(variaveis)) {
|
|
const placeholder = `{{${chave}}}`;
|
|
resultado = resultado.replace(new RegExp(placeholder, "g"), valor);
|
|
}
|
|
|
|
return resultado;
|
|
}
|
|
|
|
// Função para mostrar mensagens
|
|
function mostrarMensagem(tipo: "success" | "error" | "info", texto: string) {
|
|
mensagem = { tipo, texto };
|
|
setTimeout(() => {
|
|
mensagem = null;
|
|
}, 5000);
|
|
}
|
|
|
|
// Função para adicionar log ao terminal
|
|
function adicionarLog(
|
|
tipo: TipoLog,
|
|
destinatario: string,
|
|
status: StatusLog,
|
|
mensagem: string,
|
|
emailId?: string,
|
|
) {
|
|
logsEnvio = [
|
|
...logsEnvio,
|
|
{
|
|
timestamp: Date.now(),
|
|
tipo,
|
|
destinatario,
|
|
status,
|
|
mensagem,
|
|
emailId,
|
|
},
|
|
];
|
|
|
|
// Adicionar emailId ao rastreamento se fornecido
|
|
if (emailId) {
|
|
emailIdsRastreados = new Set([...emailIdsRastreados, emailId]);
|
|
}
|
|
|
|
// Auto-scroll para o final
|
|
setTimeout(() => {
|
|
if (terminalScrollRef) {
|
|
terminalScrollRef.scrollTop = terminalScrollRef.scrollHeight;
|
|
}
|
|
}, 10);
|
|
}
|
|
|
|
// Atualizar logs quando status dos emails mudar
|
|
$effect(() => {
|
|
if (!emailsStatusQuery || emailsStatusQuery === undefined) return;
|
|
|
|
// Extrair dados da query
|
|
const emails = Array.isArray(emailsStatusQuery)
|
|
? emailsStatusQuery
|
|
: "data" in emailsStatusQuery && Array.isArray(emailsStatusQuery.data)
|
|
? emailsStatusQuery.data
|
|
: [];
|
|
|
|
if (emails.length === 0) return;
|
|
|
|
for (const email of emails) {
|
|
if (!email) continue;
|
|
|
|
// Encontrar logs relacionados a este email
|
|
const logsRelacionados = logsEnvio.filter(
|
|
(log) => log.emailId === email._id,
|
|
);
|
|
|
|
for (const log of logsRelacionados) {
|
|
// Verificar se o status mudou
|
|
const novoStatus: StatusLog =
|
|
email.status === "enviado"
|
|
? "sucesso"
|
|
: email.status === "falha"
|
|
? "erro"
|
|
: email.status === "enviando"
|
|
? "enviando"
|
|
: email.status === "pendente"
|
|
? "fila"
|
|
: "info";
|
|
|
|
// Se o status mudou, atualizar o log
|
|
if (log.status !== novoStatus) {
|
|
const indice = logsEnvio.findIndex((l) => l === log);
|
|
if (indice !== -1) {
|
|
const novaMensagem =
|
|
email.status === "enviado"
|
|
? "Email enviado com sucesso"
|
|
: email.status === "falha"
|
|
? `Falha ao enviar: ${email.erroDetalhes || "Erro desconhecido"}`
|
|
: email.status === "enviando"
|
|
? "Enviando email..."
|
|
: email.status === "pendente"
|
|
? "Email em fila de envio"
|
|
: log.mensagem;
|
|
|
|
logsEnvio = logsEnvio.map((l, i) =>
|
|
i === indice
|
|
? { ...l, status: novoStatus, mensagem: novaMensagem }
|
|
: l,
|
|
);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
});
|
|
|
|
// Função para limpar logs
|
|
function limparLogs() {
|
|
logsEnvio = [];
|
|
emailIdsRastreados = new Set();
|
|
}
|
|
|
|
// Extrair e processar agendamentos
|
|
const agendamentosEmail = $derived.by(() => {
|
|
if (!agendamentosEmailQuery || agendamentosEmailQuery === undefined)
|
|
return [];
|
|
const dados = Array.isArray(agendamentosEmailQuery)
|
|
? agendamentosEmailQuery
|
|
: "data" in agendamentosEmailQuery &&
|
|
Array.isArray(agendamentosEmailQuery.data)
|
|
? agendamentosEmailQuery.data
|
|
: [];
|
|
return dados as AgendamentoEmail[];
|
|
});
|
|
|
|
const agendamentosChat = $derived.by(() => {
|
|
if (!agendamentosChatQuery || agendamentosChatQuery === undefined)
|
|
return [];
|
|
const dados = Array.isArray(agendamentosChatQuery)
|
|
? agendamentosChatQuery
|
|
: "data" in agendamentosChatQuery &&
|
|
Array.isArray(agendamentosChatQuery.data)
|
|
? agendamentosChatQuery.data
|
|
: [];
|
|
return dados as AgendamentoChat[];
|
|
});
|
|
|
|
// Combinar e processar agendamentos
|
|
const todosAgendamentos = $derived.by(() => {
|
|
const agendamentos: Agendamento[] = [];
|
|
|
|
for (const email of agendamentosEmail) {
|
|
if (email.agendadaPara) {
|
|
agendamentos.push({
|
|
tipo: "email",
|
|
dados: email,
|
|
});
|
|
}
|
|
}
|
|
|
|
for (const chat of agendamentosChat) {
|
|
if (chat.agendadaPara) {
|
|
agendamentos.push({
|
|
tipo: "chat",
|
|
dados: chat,
|
|
});
|
|
}
|
|
}
|
|
|
|
// Ordenar: futuros primeiro (mais próximos primeiro), depois passados (mais recentes primeiro)
|
|
return agendamentos.sort((a, b) => {
|
|
const timestampA =
|
|
a.tipo === "email"
|
|
? (a.dados.agendadaPara ?? 0)
|
|
: (a.dados.agendadaPara ?? 0);
|
|
const timestampB =
|
|
b.tipo === "email"
|
|
? (b.dados.agendadaPara ?? 0)
|
|
: (b.dados.agendadaPara ?? 0);
|
|
const agora = Date.now();
|
|
|
|
const aFuturo = timestampA > agora;
|
|
const bFuturo = timestampB > agora;
|
|
|
|
// Futuros primeiro
|
|
if (aFuturo && !bFuturo) return -1;
|
|
if (!aFuturo && bFuturo) return 1;
|
|
|
|
// Dentro do mesmo grupo, ordenar por timestamp
|
|
if (aFuturo) {
|
|
// Futuros: mais próximos primeiro
|
|
return timestampA - timestampB;
|
|
} else {
|
|
// Passados: mais recentes primeiro
|
|
return timestampB - timestampA;
|
|
}
|
|
});
|
|
});
|
|
|
|
// Filtrar agendamentos
|
|
const agendamentosFiltrados = $derived.by(() => {
|
|
if (filtroAgendamento === "todos") return todosAgendamentos;
|
|
|
|
return todosAgendamentos.filter((ag) => {
|
|
const status = obterStatusAgendamento(ag);
|
|
if (filtroAgendamento === "agendados") return status === "agendado";
|
|
if (filtroAgendamento === "enviados") return status === "enviado";
|
|
return true;
|
|
});
|
|
});
|
|
|
|
// Função para obter status do agendamento
|
|
function obterStatusAgendamento(agendamento: Agendamento): StatusAgendamento {
|
|
if (agendamento.tipo === "email") {
|
|
const email = agendamento.dados;
|
|
if (email.status === "enviado") return "enviado";
|
|
if (email.agendadaPara && email.agendadaPara <= Date.now())
|
|
return "enviado";
|
|
return "agendado";
|
|
} else {
|
|
const chat = agendamento.dados;
|
|
if (chat.agendadaPara && chat.agendadaPara <= Date.now())
|
|
return "enviado";
|
|
return "agendado";
|
|
}
|
|
}
|
|
|
|
// Função para cancelar agendamento
|
|
async function cancelarAgendamento(agendamento: Agendamento) {
|
|
if (!confirm("Tem certeza que deseja cancelar este agendamento?")) {
|
|
return;
|
|
}
|
|
|
|
try {
|
|
if (agendamento.tipo === "email") {
|
|
const resultado = await client.mutation(
|
|
api.email.cancelarAgendamentoEmail,
|
|
{
|
|
emailId: agendamento.dados._id,
|
|
},
|
|
);
|
|
if (resultado.sucesso) {
|
|
mostrarMensagem(
|
|
"success",
|
|
"Agendamento de email cancelado com sucesso!",
|
|
);
|
|
} else {
|
|
mostrarMensagem(
|
|
"error",
|
|
resultado.erro || "Erro ao cancelar agendamento",
|
|
);
|
|
}
|
|
} else {
|
|
const resultado = await client.mutation(
|
|
api.chat.cancelarMensagemAgendada,
|
|
{
|
|
mensagemId: agendamento.dados._id,
|
|
},
|
|
);
|
|
if (resultado.sucesso) {
|
|
mostrarMensagem(
|
|
"success",
|
|
"Agendamento de chat cancelado com sucesso!",
|
|
);
|
|
} else {
|
|
mostrarMensagem(
|
|
"error",
|
|
resultado.erro || "Erro ao cancelar agendamento",
|
|
);
|
|
}
|
|
}
|
|
} catch (error) {
|
|
const erro = error instanceof Error ? error.message : "Erro desconhecido";
|
|
mostrarMensagem("error", `Erro ao cancelar agendamento: ${erro}`);
|
|
}
|
|
}
|
|
|
|
// Função para obter nome do destinatário
|
|
function obterNomeDestinatario(agendamento: Agendamento): string {
|
|
if (agendamento.tipo === "email") {
|
|
return (
|
|
agendamento.dados.destinatarioInfo?.nome ||
|
|
agendamento.dados.destinatario ||
|
|
"Usuário"
|
|
);
|
|
} else {
|
|
return agendamento.dados.destinatarioInfo?.nome || "Usuário";
|
|
}
|
|
}
|
|
|
|
// Função para formatar data/hora do agendamento
|
|
function formatarDataAgendamento(agendamento: Agendamento): string {
|
|
const timestamp =
|
|
agendamento.tipo === "email"
|
|
? agendamento.dados.agendadaPara
|
|
: agendamento.dados.agendadaPara;
|
|
|
|
if (!timestamp) return "N/A";
|
|
|
|
return format(new Date(timestamp), "dd/MM/yyyy 'às' HH:mm", {
|
|
locale: ptBR,
|
|
});
|
|
}
|
|
|
|
// Função para formatar timestamp
|
|
function formatarTimestamp(timestamp: number): string {
|
|
return format(new Date(timestamp), "HH:mm:ss", { locale: ptBR });
|
|
}
|
|
|
|
// Função para obter cor do status
|
|
function obterCorStatus(status: StatusLog): string {
|
|
switch (status) {
|
|
case "sucesso":
|
|
return "text-success";
|
|
case "erro":
|
|
return "text-error";
|
|
case "fila":
|
|
return "text-warning";
|
|
case "enviando":
|
|
return "text-info";
|
|
case "info":
|
|
return "text-info";
|
|
default:
|
|
return "text-base-content";
|
|
}
|
|
}
|
|
|
|
async function criarTemplatesPadrao() {
|
|
if (criandoTemplates) return;
|
|
|
|
criandoTemplates = true;
|
|
try {
|
|
const resultado = await client.mutation(
|
|
api.templatesMensagens.criarTemplatesPadrao,
|
|
{},
|
|
);
|
|
if (resultado.sucesso) {
|
|
mostrarMensagem(
|
|
"success",
|
|
"Templates padrão criados com sucesso! A página será recarregada.",
|
|
);
|
|
setTimeout(() => {
|
|
window.location.reload();
|
|
}, 2000);
|
|
} else {
|
|
mostrarMensagem("error", "Erro ao criar templates padrão.");
|
|
}
|
|
} catch (error) {
|
|
const erro = error instanceof Error ? error.message : "Erro desconhecido";
|
|
console.error("Erro ao criar templates:", error);
|
|
mostrarMensagem("error", "Erro ao criar templates: " + erro);
|
|
} finally {
|
|
criandoTemplates = false;
|
|
}
|
|
}
|
|
|
|
function abrirModalNovoTemplate() {
|
|
modalNovoTemplateAberto = true;
|
|
// Limpar campos
|
|
codigoTemplate = "";
|
|
nomeTemplate = "";
|
|
tituloTemplate = "";
|
|
corpoTemplate = "";
|
|
variaveisTemplate = "";
|
|
}
|
|
|
|
function fecharModalNovoTemplate() {
|
|
modalNovoTemplateAberto = false;
|
|
}
|
|
|
|
async function salvarNovoTemplate() {
|
|
if (!currentUser?.data) {
|
|
mostrarMensagem(
|
|
"error",
|
|
"Você precisa estar autenticado para criar templates.",
|
|
);
|
|
return;
|
|
}
|
|
|
|
// Validações
|
|
if (!codigoTemplate.trim()) {
|
|
mostrarMensagem("error", "O código do template é obrigatório.");
|
|
return;
|
|
}
|
|
if (!nomeTemplate.trim()) {
|
|
mostrarMensagem("error", "O nome do template é obrigatório.");
|
|
return;
|
|
}
|
|
if (!tituloTemplate.trim()) {
|
|
mostrarMensagem("error", "O título do template é obrigatório.");
|
|
return;
|
|
}
|
|
if (!corpoTemplate.trim()) {
|
|
mostrarMensagem("error", "O corpo do template é obrigatório.");
|
|
return;
|
|
}
|
|
|
|
// Processar variáveis (separadas por vírgula ou espaço)
|
|
const variaveis = variaveisTemplate
|
|
.split(/[,;\s]+/)
|
|
.map((v) => v.trim())
|
|
.filter((v) => v.length > 0);
|
|
|
|
criandoNovoTemplate = true;
|
|
try {
|
|
const resultado = await client.mutation(
|
|
api.templatesMensagens.criarTemplate,
|
|
{
|
|
codigo: codigoTemplate.trim().toUpperCase().replace(/\s+/g, "_"),
|
|
nome: nomeTemplate.trim(),
|
|
titulo: tituloTemplate.trim(),
|
|
corpo: corpoTemplate.trim(),
|
|
variaveis: variaveis.length > 0 ? variaveis : undefined,
|
|
criadoPorId: currentUser.data._id as Id<"usuarios">,
|
|
},
|
|
);
|
|
|
|
if (resultado.sucesso) {
|
|
mostrarMensagem("success", "Template criado com sucesso!");
|
|
fecharModalNovoTemplate();
|
|
// Recarregar a página para atualizar a lista
|
|
setTimeout(() => {
|
|
window.location.reload();
|
|
}, 1500);
|
|
} else {
|
|
mostrarMensagem(
|
|
"error",
|
|
"Erro ao criar template: " + (resultado.erro || "Erro desconhecido"),
|
|
);
|
|
}
|
|
} catch (error) {
|
|
const erro = error instanceof Error ? error.message : "Erro desconhecido";
|
|
console.error("Erro ao criar template:", error);
|
|
mostrarMensagem("error", "Erro ao criar template: " + erro);
|
|
} finally {
|
|
criandoNovoTemplate = false;
|
|
}
|
|
}
|
|
|
|
async function enviarNotificacao() {
|
|
if (!enviarParaTodos && !destinatarioId) {
|
|
mostrarMensagem(
|
|
"error",
|
|
"Selecione um destinatário ou marque 'Enviar para todos'",
|
|
);
|
|
return;
|
|
}
|
|
|
|
if (usarTemplate && !templateId) {
|
|
mostrarMensagem("error", "Selecione um template");
|
|
return;
|
|
}
|
|
|
|
if (!usarTemplate && !mensagemPersonalizada.trim()) {
|
|
mostrarMensagem("error", "Digite uma mensagem");
|
|
return;
|
|
}
|
|
|
|
// Validar agendamento se marcado
|
|
let agendadaPara: number | undefined = undefined;
|
|
if (agendarEnvio) {
|
|
if (!dataAgendamento || !horaAgendamento) {
|
|
mostrarMensagem("error", "Preencha a data e hora para agendamento");
|
|
return;
|
|
}
|
|
|
|
try {
|
|
const dataHora = new Date(`${dataAgendamento}T${horaAgendamento}`);
|
|
if (dataHora.getTime() <= Date.now()) {
|
|
mostrarMensagem("error", "A data e hora devem ser futuras");
|
|
return;
|
|
}
|
|
agendadaPara = dataHora.getTime();
|
|
} catch (error) {
|
|
mostrarMensagem("error", "Data ou hora inválida");
|
|
return;
|
|
}
|
|
}
|
|
|
|
processando = true;
|
|
progressoEnvio = { total: 0, enviados: 0, falhas: 0 };
|
|
|
|
// Limpar logs anteriores quando iniciar novo envio
|
|
logsEnvio = [];
|
|
emailIdsRastreados = new Set();
|
|
|
|
try {
|
|
// Obter lista de destinatários
|
|
const destinatarios: typeof usuarios = enviarParaTodos
|
|
? usuarios
|
|
: usuarios.filter((u) => u._id === destinatarioId);
|
|
|
|
if (destinatarios.length === 0) {
|
|
adicionarLog(
|
|
"email",
|
|
"Sistema",
|
|
"erro",
|
|
"Nenhum destinatário encontrado",
|
|
);
|
|
mostrarMensagem("error", "Nenhum destinatário encontrado");
|
|
return;
|
|
}
|
|
|
|
progressoEnvio.total = destinatarios.length;
|
|
|
|
// Log inicial
|
|
const tipoMensagem = usarTemplate
|
|
? `Template: ${templateSelecionado?.nome || ""}`
|
|
: "Mensagem personalizada";
|
|
const destinatariosText = enviarParaTodos
|
|
? `Todos os usuários (${destinatarios.length})`
|
|
: destinatarios.map((d) => d.nome).join(", ");
|
|
adicionarLog(
|
|
"email",
|
|
"Sistema",
|
|
"info",
|
|
`Iniciando envio de notificação via ${canal} para ${destinatariosText} - ${tipoMensagem}`,
|
|
);
|
|
|
|
// Se for envio para um único usuário
|
|
if (destinatarios.length === 1) {
|
|
const destinatario = destinatarios[0];
|
|
let resultadoChat = null;
|
|
let resultadoEmail = null;
|
|
|
|
// ENVIAR PARA CHAT
|
|
if (canal === "chat" || canal === "ambos") {
|
|
try {
|
|
adicionarLog(
|
|
"chat",
|
|
destinatario.nome,
|
|
"enviando",
|
|
"Criando/buscando conversa...",
|
|
);
|
|
const conversaId = await client.mutation(
|
|
api.chat.criarOuBuscarConversaIndividual,
|
|
{ outroUsuarioId: destinatario._id as Id<"usuarios"> },
|
|
);
|
|
|
|
if (conversaId) {
|
|
const mensagem =
|
|
usarTemplate && templateSelecionado
|
|
? renderizarTemplate(templateSelecionado.corpo, {
|
|
nome: destinatario.nome,
|
|
matricula: destinatario.matricula || "",
|
|
})
|
|
: mensagemPersonalizada;
|
|
|
|
if (agendadaPara) {
|
|
// Agendar mensagem
|
|
adicionarLog(
|
|
"chat",
|
|
destinatario.nome,
|
|
"info",
|
|
"Agendando mensagem...",
|
|
);
|
|
resultadoChat = await client.mutation(
|
|
api.chat.agendarMensagem,
|
|
{
|
|
conversaId: conversaId,
|
|
conteudo: mensagem,
|
|
agendadaPara: agendadaPara,
|
|
},
|
|
);
|
|
const dataFormatada = format(
|
|
new Date(agendadaPara),
|
|
"dd/MM/yyyy 'às' HH:mm",
|
|
{ locale: ptBR },
|
|
);
|
|
adicionarLog(
|
|
"chat",
|
|
destinatario.nome,
|
|
"sucesso",
|
|
`Mensagem agendada para ${dataFormatada}`,
|
|
);
|
|
} else {
|
|
// Envio imediato
|
|
adicionarLog(
|
|
"chat",
|
|
destinatario.nome,
|
|
"enviando",
|
|
"Enviando mensagem...",
|
|
);
|
|
resultadoChat = await client.mutation(api.chat.enviarMensagem, {
|
|
conversaId: conversaId,
|
|
conteudo: mensagem,
|
|
tipo: "texto",
|
|
permitirNotificacaoParaSiMesmo: true,
|
|
});
|
|
adicionarLog(
|
|
"chat",
|
|
destinatario.nome,
|
|
"sucesso",
|
|
"Mensagem enviada com sucesso",
|
|
);
|
|
}
|
|
} else {
|
|
adicionarLog(
|
|
"chat",
|
|
destinatario.nome,
|
|
"erro",
|
|
"Falha ao criar/buscar conversa",
|
|
);
|
|
}
|
|
} catch (error) {
|
|
const erro =
|
|
error instanceof Error ? error.message : "Erro desconhecido";
|
|
console.error("Erro ao enviar chat:", error);
|
|
adicionarLog("chat", destinatario.nome, "erro", `Erro: ${erro}`);
|
|
}
|
|
}
|
|
|
|
// ENVIAR PARA EMAIL
|
|
if (canal === "email" || canal === "ambos") {
|
|
if (destinatario.email) {
|
|
try {
|
|
adicionarLog(
|
|
"email",
|
|
destinatario.nome,
|
|
"enviando",
|
|
`Enfileirando email para ${destinatario.email}...`,
|
|
);
|
|
if (usarTemplate && templateId) {
|
|
const template = templateSelecionado;
|
|
if (template) {
|
|
const emailId = await client.action(
|
|
api.email.enviarEmailComTemplate,
|
|
{
|
|
destinatario: destinatario.email,
|
|
destinatarioId: destinatario._id as Id<"usuarios">,
|
|
templateCodigo: template.codigo,
|
|
variaveis: {
|
|
nome: destinatario.nome,
|
|
matricula: destinatario.matricula,
|
|
},
|
|
enviadoPor: currentUser.data._id as Id<"usuarios">,
|
|
agendadaPara: agendadaPara,
|
|
},
|
|
);
|
|
if (emailId) {
|
|
if (agendadaPara) {
|
|
const dataFormatada = format(
|
|
new Date(agendadaPara),
|
|
"dd/MM/yyyy 'às' HH:mm",
|
|
{ locale: ptBR },
|
|
);
|
|
adicionarLog(
|
|
"email",
|
|
destinatario.nome,
|
|
"fila",
|
|
`Email agendado para ${dataFormatada}`,
|
|
emailId,
|
|
);
|
|
} else {
|
|
adicionarLog(
|
|
"email",
|
|
destinatario.nome,
|
|
"fila",
|
|
"Email enfileirado para envio",
|
|
emailId,
|
|
);
|
|
}
|
|
} else {
|
|
adicionarLog(
|
|
"email",
|
|
destinatario.nome,
|
|
"erro",
|
|
"Falha ao enfileirar email",
|
|
);
|
|
}
|
|
} else {
|
|
adicionarLog(
|
|
"email",
|
|
destinatario.nome,
|
|
"erro",
|
|
"Template não encontrado",
|
|
);
|
|
}
|
|
} else {
|
|
const emailId = await client.mutation(
|
|
api.email.enfileirarEmail,
|
|
{
|
|
destinatario: destinatario.email,
|
|
destinatarioId: destinatario._id as Id<"usuarios">,
|
|
assunto: "Notificação do Sistema",
|
|
corpo: mensagemPersonalizada,
|
|
enviadoPor: currentUser.data._id as Id<"usuarios">,
|
|
agendadaPara: agendadaPara,
|
|
},
|
|
);
|
|
if (emailId) {
|
|
resultadoEmail = { sucesso: true, emailId };
|
|
if (agendadaPara) {
|
|
const dataFormatada = format(
|
|
new Date(agendadaPara),
|
|
"dd/MM/yyyy 'às' HH:mm",
|
|
{ locale: ptBR },
|
|
);
|
|
adicionarLog(
|
|
"email",
|
|
destinatario.nome,
|
|
"fila",
|
|
`Email agendado para ${dataFormatada}`,
|
|
emailId,
|
|
);
|
|
} else {
|
|
adicionarLog(
|
|
"email",
|
|
destinatario.nome,
|
|
"fila",
|
|
"Email enfileirado para envio",
|
|
emailId,
|
|
);
|
|
}
|
|
} else {
|
|
adicionarLog(
|
|
"email",
|
|
destinatario.nome,
|
|
"erro",
|
|
"Falha ao enfileirar email",
|
|
);
|
|
}
|
|
}
|
|
} catch (error) {
|
|
const erro =
|
|
error instanceof Error ? error.message : "Erro desconhecido";
|
|
console.error("Erro ao enviar email:", error);
|
|
adicionarLog("email", destinatario.nome, "erro", `Erro: ${erro}`);
|
|
}
|
|
} else {
|
|
adicionarLog(
|
|
"email",
|
|
destinatario.nome,
|
|
"erro",
|
|
"Destinatário não possui email cadastrado",
|
|
);
|
|
}
|
|
}
|
|
|
|
// Feedback de sucesso
|
|
let mensagemSucesso = agendadaPara
|
|
? `Notificação agendada com sucesso!`
|
|
: "Notificação enviada com sucesso!";
|
|
if (agendadaPara) {
|
|
const dataFormatada = format(
|
|
new Date(agendadaPara),
|
|
"dd/MM/yyyy 'às' HH:mm",
|
|
{ locale: ptBR },
|
|
);
|
|
mensagemSucesso += ` Será enviada em: ${dataFormatada}`;
|
|
} else {
|
|
if (canal === "ambos") {
|
|
if (resultadoChat && resultadoEmail) {
|
|
mensagemSucesso = "Notificação enviada para Chat e Email!";
|
|
} else if (resultadoChat) {
|
|
mensagemSucesso = "Notificação enviada para Chat. Email falhou.";
|
|
} else if (resultadoEmail) {
|
|
mensagemSucesso = "Notificação enviada para Email. Chat falhou.";
|
|
}
|
|
} else if (canal === "chat" && resultadoChat) {
|
|
mensagemSucesso = "Mensagem enviada no Chat!";
|
|
} else if (canal === "email" && resultadoEmail) {
|
|
mensagemSucesso = "Email enfileirado para envio!";
|
|
}
|
|
}
|
|
|
|
mostrarMensagem("success", mensagemSucesso);
|
|
progressoEnvio.enviados = 1;
|
|
} else {
|
|
// ENVIO EM MASSA
|
|
let sucessosChat = 0;
|
|
let sucessosEmail = 0;
|
|
let falhasChat = 0;
|
|
let falhasEmail = 0;
|
|
|
|
adicionarLog(
|
|
"email",
|
|
"Sistema",
|
|
"info",
|
|
`Processando ${destinatarios.length} destinatários...`,
|
|
);
|
|
|
|
for (const destinatario of destinatarios) {
|
|
try {
|
|
// ENVIAR PARA CHAT
|
|
if (canal === "chat" || canal === "ambos") {
|
|
try {
|
|
adicionarLog(
|
|
"chat",
|
|
destinatario.nome,
|
|
"enviando",
|
|
"Processando...",
|
|
);
|
|
const conversaId = await client.mutation(
|
|
api.chat.criarOuBuscarConversaIndividual,
|
|
{ outroUsuarioId: destinatario._id as Id<"usuarios"> },
|
|
);
|
|
|
|
if (conversaId) {
|
|
// Renderizar template com variáveis do destinatário
|
|
const mensagem =
|
|
usarTemplate && templateSelecionado
|
|
? renderizarTemplate(templateSelecionado.corpo, {
|
|
nome: destinatario.nome,
|
|
matricula: destinatario.matricula || "",
|
|
})
|
|
: mensagemPersonalizada;
|
|
|
|
if (agendadaPara) {
|
|
await client.mutation(api.chat.agendarMensagem, {
|
|
conversaId: conversaId,
|
|
conteudo: mensagem,
|
|
agendadaPara: agendadaPara,
|
|
});
|
|
const dataFormatada = format(
|
|
new Date(agendadaPara),
|
|
"dd/MM/yyyy 'às' HH:mm",
|
|
{ locale: ptBR },
|
|
);
|
|
adicionarLog(
|
|
"chat",
|
|
destinatario.nome,
|
|
"sucesso",
|
|
`Agendado para ${dataFormatada}`,
|
|
);
|
|
} else {
|
|
await client.mutation(api.chat.enviarMensagem, {
|
|
conversaId: conversaId,
|
|
conteudo: mensagem,
|
|
tipo: "texto",
|
|
permitirNotificacaoParaSiMesmo: true,
|
|
});
|
|
adicionarLog(
|
|
"chat",
|
|
destinatario.nome,
|
|
"sucesso",
|
|
"Enviado com sucesso",
|
|
);
|
|
}
|
|
sucessosChat++;
|
|
} else {
|
|
adicionarLog(
|
|
"chat",
|
|
destinatario.nome,
|
|
"erro",
|
|
"Falha ao criar/buscar conversa",
|
|
);
|
|
falhasChat++;
|
|
}
|
|
} catch (error) {
|
|
const erro =
|
|
error instanceof Error ? error.message : "Erro desconhecido";
|
|
console.error(
|
|
`Erro ao enviar chat para ${destinatario.nome}:`,
|
|
error,
|
|
);
|
|
adicionarLog(
|
|
"chat",
|
|
destinatario.nome,
|
|
"erro",
|
|
`Erro: ${erro}`,
|
|
);
|
|
falhasChat++;
|
|
}
|
|
}
|
|
|
|
// ENVIAR PARA EMAIL
|
|
if (canal === "email" || canal === "ambos") {
|
|
if (destinatario.email) {
|
|
try {
|
|
adicionarLog(
|
|
"email",
|
|
destinatario.nome,
|
|
"enviando",
|
|
`Enfileirando email para ${destinatario.email}...`,
|
|
);
|
|
if (usarTemplate && templateId) {
|
|
const template = templateSelecionado;
|
|
if (template) {
|
|
const emailId = await client.action(
|
|
api.email.enviarEmailComTemplate,
|
|
{
|
|
destinatario: destinatario.email,
|
|
destinatarioId: destinatario._id as Id<"usuarios">,
|
|
templateCodigo: template.codigo,
|
|
variaveis: {
|
|
nome: destinatario.nome,
|
|
matricula: destinatario.matricula || "",
|
|
},
|
|
enviadoPor: currentUser.data._id as Id<"usuarios">,
|
|
agendadaPara: agendadaPara,
|
|
},
|
|
);
|
|
if (emailId) {
|
|
if (agendadaPara) {
|
|
const dataFormatada = format(
|
|
new Date(agendadaPara),
|
|
"dd/MM/yyyy 'às' HH:mm",
|
|
{ locale: ptBR },
|
|
);
|
|
adicionarLog(
|
|
"email",
|
|
destinatario.nome,
|
|
"fila",
|
|
`Agendado para ${dataFormatada}`,
|
|
emailId,
|
|
);
|
|
} else {
|
|
adicionarLog(
|
|
"email",
|
|
destinatario.nome,
|
|
"fila",
|
|
"Enfileirado para envio",
|
|
emailId,
|
|
);
|
|
}
|
|
sucessosEmail++;
|
|
} else {
|
|
adicionarLog(
|
|
"email",
|
|
destinatario.nome,
|
|
"erro",
|
|
"Falha ao enfileirar email",
|
|
);
|
|
falhasEmail++;
|
|
}
|
|
} else {
|
|
adicionarLog(
|
|
"email",
|
|
destinatario.nome,
|
|
"erro",
|
|
"Template não encontrado",
|
|
);
|
|
falhasEmail++;
|
|
}
|
|
} else {
|
|
const emailId = await client.mutation(
|
|
api.email.enfileirarEmail,
|
|
{
|
|
destinatario: destinatario.email,
|
|
destinatarioId: destinatario._id as Id<"usuarios">,
|
|
assunto: "Notificação do Sistema",
|
|
corpo: mensagemPersonalizada,
|
|
enviadoPor: currentUser.data?._id as Id<"usuarios">,
|
|
agendadaPara: agendadaPara,
|
|
},
|
|
);
|
|
if (emailId) {
|
|
resultadoEmail = { sucesso: true, emailId };
|
|
if (agendadaPara) {
|
|
const dataFormatada = format(
|
|
new Date(agendadaPara),
|
|
"dd/MM/yyyy 'às' HH:mm",
|
|
{ locale: ptBR },
|
|
);
|
|
adicionarLog(
|
|
"email",
|
|
destinatario.nome,
|
|
"fila",
|
|
`Agendado para ${dataFormatada}`,
|
|
emailId,
|
|
);
|
|
} else {
|
|
adicionarLog(
|
|
"email",
|
|
destinatario.nome,
|
|
"fila",
|
|
"Enfileirado para envio",
|
|
emailId,
|
|
);
|
|
}
|
|
sucessosEmail++;
|
|
} else {
|
|
adicionarLog(
|
|
"email",
|
|
destinatario.nome,
|
|
"erro",
|
|
"Falha ao enfileirar email",
|
|
);
|
|
falhasEmail++;
|
|
}
|
|
}
|
|
} catch (error) {
|
|
const erro =
|
|
error instanceof Error
|
|
? error.message
|
|
: "Erro desconhecido";
|
|
console.error(
|
|
`Erro ao enviar email para ${destinatario.nome}:`,
|
|
error,
|
|
);
|
|
adicionarLog(
|
|
"email",
|
|
destinatario.nome,
|
|
"erro",
|
|
`Erro: ${erro}`,
|
|
);
|
|
falhasEmail++;
|
|
}
|
|
} else {
|
|
adicionarLog(
|
|
"email",
|
|
destinatario.nome,
|
|
"erro",
|
|
"Destinatário não possui email cadastrado",
|
|
);
|
|
falhasEmail++;
|
|
}
|
|
}
|
|
|
|
progressoEnvio.enviados++;
|
|
} catch (error) {
|
|
console.error(
|
|
`Erro geral ao enviar para ${destinatario.nome}:`,
|
|
error,
|
|
);
|
|
progressoEnvio.falhas++;
|
|
}
|
|
}
|
|
|
|
// Feedback de envio em massa
|
|
let mensagemMassa = agendadaPara
|
|
? `Agendamento em massa concluído! `
|
|
: `Envio em massa concluído! `;
|
|
|
|
if (agendadaPara) {
|
|
const dataFormatada = format(
|
|
new Date(agendadaPara),
|
|
"dd/MM/yyyy 'às' HH:mm",
|
|
{ locale: ptBR },
|
|
);
|
|
mensagemMassa += `Será enviado em: ${dataFormatada}. `;
|
|
}
|
|
|
|
if (canal === "ambos") {
|
|
mensagemMassa += `Chat: ${sucessosChat} ${agendadaPara ? "agendados" : "enviados"}, ${falhasChat} falhas. `;
|
|
mensagemMassa += `Email: ${sucessosEmail} ${agendadaPara ? "agendados" : "enviados"}, ${falhasEmail} falhas.`;
|
|
} else if (canal === "chat") {
|
|
mensagemMassa += `Chat: ${sucessosChat} ${agendadaPara ? "agendados" : "enviados"}, ${falhasChat} falhas.`;
|
|
} else if (canal === "email") {
|
|
mensagemMassa += `Email: ${sucessosEmail} ${agendadaPara ? "agendados" : "enviados"}, ${falhasEmail} falhas.`;
|
|
}
|
|
|
|
// Adicionar log resumo
|
|
adicionarLog("email", "Sistema", "info", mensagemMassa);
|
|
mostrarMensagem("success", mensagemMassa);
|
|
}
|
|
|
|
// Limpar form
|
|
destinatarioId = "";
|
|
enviarParaTodos = false;
|
|
templateId = "";
|
|
mensagemPersonalizada = "";
|
|
agendarEnvio = false;
|
|
dataAgendamento = "";
|
|
horaAgendamento = "";
|
|
} catch (error) {
|
|
const erro = error instanceof Error ? error.message : "Erro desconhecido";
|
|
console.error("Erro ao enviar notificação:", error);
|
|
adicionarLog("email", "Sistema", "erro", `Erro geral: ${erro}`);
|
|
mostrarMensagem("error", "Erro ao enviar notificação: " + erro);
|
|
} finally {
|
|
processando = false;
|
|
progressoEnvio = { total: 0, enviados: 0, falhas: 0 };
|
|
adicionarLog("email", "Sistema", "info", "Processo de envio finalizado");
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<div class="container mx-auto px-4 py-6 max-w-7xl">
|
|
<!-- Header -->
|
|
<div class="flex items-center justify-between mb-6">
|
|
<div class="flex items-center gap-4">
|
|
<div class="p-3 bg-info/10 rounded-xl">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-8 w-8 text-info"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
<div>
|
|
<h1 class="text-3xl font-bold text-base-content">
|
|
Notificações e Mensagens
|
|
</h1>
|
|
<p class="text-base-content/60 mt-1">
|
|
Enviar notificações para usuários do sistema
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Mensagens de Feedback -->
|
|
{#if mensagem}
|
|
<div
|
|
class="alert mb-6 shadow-lg"
|
|
class:alert-success={mensagem.tipo === "success"}
|
|
class:alert-error={mensagem.tipo === "error"}
|
|
class:alert-info={mensagem.tipo === "info"}
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="stroke-current shrink-0 h-6 w-6"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
>
|
|
{#if mensagem.tipo === "success"}
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"
|
|
/>
|
|
{:else if mensagem.tipo === "error"}
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z"
|
|
/>
|
|
{:else}
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
|
|
/>
|
|
{/if}
|
|
</svg>
|
|
<span class="font-medium">{mensagem.texto}</span>
|
|
<button
|
|
type="button"
|
|
class="btn btn-sm btn-circle btn-ghost"
|
|
onclick={() => (mensagem = null)}
|
|
>
|
|
✕
|
|
</button>
|
|
</div>
|
|
{/if}
|
|
|
|
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
|
|
<!-- Formulário -->
|
|
<div class="card bg-base-100 shadow-xl">
|
|
<div class="card-body">
|
|
<h2 class="card-title mb-4">Enviar Notificação</h2>
|
|
|
|
<!-- Destinatário -->
|
|
<div class="form-control mb-4">
|
|
<div class="flex items-center justify-between mb-2">
|
|
<label class="label" for="destinatario-select">
|
|
<span class="label-text font-medium">Destinatário *</span>
|
|
</label>
|
|
<label class="label cursor-pointer gap-2">
|
|
<input
|
|
type="checkbox"
|
|
bind:checked={enviarParaTodos}
|
|
class="checkbox checkbox-primary checkbox-sm"
|
|
disabled={processando}
|
|
/>
|
|
<span class="label-text text-sm"
|
|
>Enviar para todos ({usuarios.length} usuários)</span
|
|
>
|
|
</label>
|
|
</div>
|
|
<select
|
|
id="destinatario-select"
|
|
bind:value={destinatarioId}
|
|
class="select select-bordered"
|
|
disabled={enviarParaTodos || processando}
|
|
>
|
|
<option value="">Selecione um usuário</option>
|
|
{#if carregandoUsuarios}
|
|
<option disabled>Carregando usuários...</option>
|
|
{:else if usuarios.length > 0}
|
|
{#each usuarios as usuario}
|
|
<option value={usuario._id}>
|
|
{usuario.nome} ({usuario.matricula})
|
|
</option>
|
|
{/each}
|
|
{:else}
|
|
<option disabled>Nenhum usuário disponível</option>
|
|
{/if}
|
|
</select>
|
|
{#if enviarParaTodos}
|
|
<label class="label">
|
|
<span class="label-text-alt text-warning">
|
|
⚠️ A notificação será enviada para todos os {usuarios.length} usuários
|
|
do sistema
|
|
</span>
|
|
</label>
|
|
{/if}
|
|
</div>
|
|
|
|
<!-- Canal -->
|
|
<div class="form-control mb-4">
|
|
<div class="label">
|
|
<span class="label-text font-medium">Canal de Envio *</span>
|
|
</div>
|
|
<div class="flex gap-4">
|
|
<label class="label cursor-pointer">
|
|
<input
|
|
type="radio"
|
|
value="chat"
|
|
bind:group={canal}
|
|
class="radio radio-primary"
|
|
/>
|
|
<span class="label-text ml-2">Chat</span>
|
|
</label>
|
|
<label class="label cursor-pointer">
|
|
<input
|
|
type="radio"
|
|
value="email"
|
|
bind:group={canal}
|
|
class="radio radio-primary"
|
|
/>
|
|
<span class="label-text ml-2">Email</span>
|
|
</label>
|
|
<label class="label cursor-pointer">
|
|
<input
|
|
type="radio"
|
|
value="ambos"
|
|
bind:group={canal}
|
|
class="radio radio-primary"
|
|
/>
|
|
<span class="label-text ml-2">Ambos</span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Tipo de Mensagem -->
|
|
<div class="form-control mb-4">
|
|
<div class="label">
|
|
<span class="label-text font-medium">Tipo de Mensagem</span>
|
|
</div>
|
|
<div class="flex gap-4">
|
|
<label class="label cursor-pointer">
|
|
<input
|
|
type="radio"
|
|
checked={usarTemplate}
|
|
onchange={() => (usarTemplate = true)}
|
|
class="radio radio-secondary"
|
|
/>
|
|
<span class="label-text ml-2">Usar Template</span>
|
|
</label>
|
|
<label class="label cursor-pointer">
|
|
<input
|
|
type="radio"
|
|
checked={!usarTemplate}
|
|
onchange={() => (usarTemplate = false)}
|
|
class="radio radio-secondary"
|
|
/>
|
|
<span class="label-text ml-2">Mensagem Personalizada</span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
{#if usarTemplate}
|
|
<!-- Template -->
|
|
<div class="form-control mb-4">
|
|
<label class="label" for="template-select">
|
|
<span class="label-text font-medium">Template *</span>
|
|
</label>
|
|
<select
|
|
id="template-select"
|
|
bind:value={templateId}
|
|
class="select select-bordered"
|
|
>
|
|
<option value="">Selecione um template</option>
|
|
{#if carregandoTemplates}
|
|
<option disabled>Carregando templates...</option>
|
|
{:else if templates.length > 0}
|
|
{#each templates as template}
|
|
<option value={template._id}>
|
|
{template.nome}
|
|
</option>
|
|
{/each}
|
|
{:else}
|
|
<option disabled>Nenhum template disponível</option>
|
|
{/if}
|
|
</select>
|
|
</div>
|
|
|
|
{#if templateSelecionado}
|
|
<div class="alert alert-info mb-4">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
class="stroke-current shrink-0 w-6 h-6"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
|
|
></path>
|
|
</svg>
|
|
<div>
|
|
<div class="font-bold">{templateSelecionado.titulo}</div>
|
|
<div class="text-sm mt-1">{templateSelecionado.corpo}</div>
|
|
</div>
|
|
</div>
|
|
{/if}
|
|
{:else}
|
|
<!-- Mensagem Personalizada -->
|
|
<div class="form-control mb-4">
|
|
<label class="label" for="mensagem-textarea">
|
|
<span class="label-text font-medium">Mensagem *</span>
|
|
</label>
|
|
<textarea
|
|
id="mensagem-textarea"
|
|
bind:value={mensagemPersonalizada}
|
|
class="textarea textarea-bordered h-32"
|
|
placeholder="Digite sua mensagem personalizada..."
|
|
></textarea>
|
|
</div>
|
|
{/if}
|
|
|
|
<!-- Agendamento -->
|
|
<div class="form-control mb-4">
|
|
<label class="label cursor-pointer">
|
|
<span class="label-text font-medium">Agendar Envio</span>
|
|
<input
|
|
type="checkbox"
|
|
bind:checked={agendarEnvio}
|
|
class="checkbox checkbox-primary"
|
|
disabled={processando}
|
|
/>
|
|
</label>
|
|
|
|
{#if agendarEnvio}
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 mt-4">
|
|
<div class="form-control">
|
|
<label class="label" for="data-agendamento">
|
|
<span class="label-text">Data</span>
|
|
</label>
|
|
<input
|
|
id="data-agendamento"
|
|
type="date"
|
|
class="input input-bordered"
|
|
bind:value={dataAgendamento}
|
|
min={minDate}
|
|
disabled={processando}
|
|
/>
|
|
</div>
|
|
|
|
<div class="form-control">
|
|
<label class="label" for="hora-agendamento">
|
|
<span class="label-text">Hora</span>
|
|
</label>
|
|
<input
|
|
id="hora-agendamento"
|
|
type="time"
|
|
class="input input-bordered"
|
|
bind:value={horaAgendamento}
|
|
min={horaMinima}
|
|
disabled={processando}
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
{#if getPreviewAgendamento()}
|
|
<div class="alert alert-info mt-4">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
class="stroke-current shrink-0 w-6 h-6"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
|
|
></path>
|
|
</svg>
|
|
<span>{getPreviewAgendamento()}</span>
|
|
</div>
|
|
{/if}
|
|
{/if}
|
|
</div>
|
|
|
|
<!-- Botão Enviar -->
|
|
<div class="card-actions justify-end mt-4">
|
|
<button
|
|
class="btn btn-primary btn-block"
|
|
onclick={() => enviarNotificacao()}
|
|
disabled={processando}
|
|
>
|
|
{#if processando}
|
|
<span class="loading loading-spinner loading-sm"></span>
|
|
{#if progressoEnvio.total > 1}
|
|
<span class="ml-2">
|
|
Enviando... ({progressoEnvio.enviados}/{progressoEnvio.total})
|
|
</span>
|
|
{:else}
|
|
<span class="ml-2">Enviando...</span>
|
|
{/if}
|
|
{:else}
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-5 w-5"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M12 19l9 2-9-18-9 18 9-2zm0 0v-8"
|
|
/>
|
|
</svg>
|
|
{/if}
|
|
{#if processando}
|
|
<!-- Texto já está no bloco acima -->
|
|
{:else if agendarEnvio && enviarParaTodos}
|
|
Agendar para Todos ({usuarios.length})
|
|
{:else if agendarEnvio}
|
|
Agendar Notificação
|
|
{:else if enviarParaTodos}
|
|
Enviar para Todos ({usuarios.length})
|
|
{:else}
|
|
Enviar Notificação
|
|
{/if}
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Terminal de Status -->
|
|
<div class="mt-4">
|
|
<div class="flex items-center justify-between mb-2">
|
|
<label class="label">
|
|
<span class="label-text font-medium">Terminal de Status</span>
|
|
</label>
|
|
{#if logsEnvio.length > 0}
|
|
<button
|
|
type="button"
|
|
class="btn btn-sm btn-ghost"
|
|
onclick={limparLogs}
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-4 w-4"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M6 18L18 6M6 6l12 12"
|
|
/>
|
|
</svg>
|
|
Limpar
|
|
</button>
|
|
{/if}
|
|
</div>
|
|
<div
|
|
bind:this={terminalScrollRef}
|
|
class="bg-neutral text-neutral-content p-4 rounded-lg font-mono text-sm max-h-64 overflow-y-auto"
|
|
style="background-color: #1a1a1a; color: #e5e5e5;"
|
|
>
|
|
{#if logsEnvio.length === 0}
|
|
<div class="text-neutral-content/60 italic">
|
|
Aguardando envio de notificação...
|
|
</div>
|
|
{:else}
|
|
{#each logsEnvio as log}
|
|
<div class="mb-1">
|
|
<span class="text-neutral-content/60"
|
|
>[{formatarTimestamp(log.timestamp)}]</span
|
|
>
|
|
<span
|
|
class="ml-2 badge badge-xs {log.tipo === 'chat'
|
|
? 'badge-info'
|
|
: 'badge-secondary'}"
|
|
>
|
|
{log.tipo.toUpperCase()}
|
|
</span>
|
|
<span class="ml-2 font-semibold">{log.destinatario}:</span>
|
|
<span class="ml-2 {obterCorStatus(log.status)}">
|
|
{log.mensagem}
|
|
</span>
|
|
</div>
|
|
{/each}
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Lista de Templates -->
|
|
<div class="card bg-base-100 shadow-xl">
|
|
<div class="card-body">
|
|
<div class="flex items-center justify-between mb-4">
|
|
<h2 class="card-title">Templates Disponíveis</h2>
|
|
<button
|
|
type="button"
|
|
class="btn btn-sm btn-outline btn-primary"
|
|
onclick={() => abrirModalNovoTemplate()}
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-4 w-4"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M12 4v16m8-8H4"
|
|
/>
|
|
</svg>
|
|
Novo Template
|
|
</button>
|
|
</div>
|
|
|
|
{#if carregandoTemplates}
|
|
<div class="flex flex-col items-center justify-center py-10 gap-4">
|
|
<span class="loading loading-spinner loading-lg"></span>
|
|
<p class="text-sm text-base-content/60">Carregando templates...</p>
|
|
</div>
|
|
{:else if templates.length > 0}
|
|
<!-- Mostrar templates se existirem -->
|
|
<div class="space-y-3 max-h-[600px] overflow-y-auto">
|
|
{#each templates as template}
|
|
<div class="card bg-base-200 compact">
|
|
<div class="card-body">
|
|
<div class="flex items-start justify-between">
|
|
<div class="flex-1">
|
|
<h3 class="font-bold text-sm">{template.nome}</h3>
|
|
<p class="text-xs opacity-70 mt-1">{template.titulo}</p>
|
|
<p class="text-xs mt-2 line-clamp-2">{template.corpo}</p>
|
|
<div class="flex gap-2 mt-2">
|
|
<span
|
|
class="badge badge-sm {template.tipo === 'sistema'
|
|
? 'badge-primary'
|
|
: 'badge-secondary'}"
|
|
>
|
|
{template.tipo}
|
|
</span>
|
|
{#if template.variaveis && template.variaveis.length > 0}
|
|
<span class="badge badge-sm badge-outline">
|
|
{template.variaveis.length} variáveis
|
|
</span>
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
{#if template.tipo !== "sistema"}
|
|
<div class="dropdown dropdown-end">
|
|
<button
|
|
type="button"
|
|
tabindex="0"
|
|
class="btn btn-ghost btn-xs"
|
|
aria-label="Opções do template"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-4 w-4"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M12 5v.01M12 12v.01M12 19v.01M12 6a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2z"
|
|
/>
|
|
</svg>
|
|
</button>
|
|
<!-- svelte-ignore a11y_no_noninteractive_tabindex -->
|
|
<ul
|
|
tabindex="0"
|
|
class="dropdown-content menu p-2 shadow bg-base-100 rounded-box w-32"
|
|
>
|
|
<li><button type="button">Editar</button></li>
|
|
<li>
|
|
<button type="button" class="text-error"
|
|
>Excluir</button
|
|
>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{/each}
|
|
</div>
|
|
{:else}
|
|
<!-- Nenhum template disponível - mostrar botão para criar -->
|
|
<div class="text-center py-10">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-12 w-12 mx-auto mb-4 opacity-50"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"
|
|
/>
|
|
</svg>
|
|
<p class="font-medium text-base-content mb-2">
|
|
Nenhum template disponível
|
|
</p>
|
|
<p class="text-sm text-base-content/60 mb-4">
|
|
Clique no botão abaixo para criar os templates padrão do sistema.
|
|
</p>
|
|
<button
|
|
class="btn btn-primary btn-sm"
|
|
onclick={criarTemplatesPadrao}
|
|
disabled={criandoTemplates}
|
|
>
|
|
{#if criandoTemplates}
|
|
<span class="loading loading-spinner loading-xs"></span>
|
|
Criando templates...
|
|
{:else}
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-4 w-4"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M12 4v16m8-8H4"
|
|
/>
|
|
</svg>
|
|
Criar Templates Padrão
|
|
{/if}
|
|
</button>
|
|
</div>
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Histórico de Agendamentos -->
|
|
<div class="card bg-base-100 shadow-xl mt-6">
|
|
<div class="card-body">
|
|
<div class="flex items-center justify-between mb-4">
|
|
<div class="flex items-center gap-3">
|
|
<div class="p-2 bg-secondary/10 rounded-lg">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-6 w-6 text-secondary"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
<h2 class="card-title">Histórico de Agendamentos</h2>
|
|
</div>
|
|
|
|
<!-- Filtros -->
|
|
<div class="flex gap-2">
|
|
<button
|
|
type="button"
|
|
class="btn btn-sm {filtroAgendamento === 'todos'
|
|
? 'btn-primary'
|
|
: 'btn-ghost'}"
|
|
onclick={() => (filtroAgendamento = "todos")}
|
|
>
|
|
Todos
|
|
</button>
|
|
<button
|
|
type="button"
|
|
class="btn btn-sm {filtroAgendamento === 'agendados'
|
|
? 'btn-primary'
|
|
: 'btn-ghost'}"
|
|
onclick={() => (filtroAgendamento = "agendados")}
|
|
>
|
|
Agendados
|
|
</button>
|
|
<button
|
|
type="button"
|
|
class="btn btn-sm {filtroAgendamento === 'enviados'
|
|
? 'btn-primary'
|
|
: 'btn-ghost'}"
|
|
onclick={() => (filtroAgendamento = "enviados")}
|
|
>
|
|
Enviados
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
{#if agendamentosFiltrados.length === 0}
|
|
<div class="text-center py-10">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-12 w-12 mx-auto mb-4 opacity-50"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"
|
|
/>
|
|
</svg>
|
|
<p class="font-medium text-base-content mb-2">
|
|
Nenhum agendamento encontrado
|
|
</p>
|
|
<p class="text-sm text-base-content/60">
|
|
Os agendamentos aparecerão aqui quando você agendar envios.
|
|
</p>
|
|
</div>
|
|
{:else}
|
|
<!-- Tabela de Agendamentos -->
|
|
<div class="overflow-x-auto">
|
|
<table class="table table-zebra">
|
|
<thead>
|
|
<tr>
|
|
<th>Tipo</th>
|
|
<th>Destinatário</th>
|
|
<th>Data/Hora</th>
|
|
<th>Status</th>
|
|
<th>Template</th>
|
|
<th>Ações</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{#each agendamentosFiltrados as agendamento}
|
|
{@const status = obterStatusAgendamento(agendamento)}
|
|
{@const nomeDestinatario = obterNomeDestinatario(agendamento)}
|
|
{@const dataFormatada = formatarDataAgendamento(agendamento)}
|
|
{@const podeCancelar = status === "agendado"}
|
|
{@const templateNome =
|
|
agendamento.tipo === "email" && agendamento.dados.templateInfo
|
|
? agendamento.dados.templateInfo.nome
|
|
: agendamento.tipo === "email" &&
|
|
agendamento.dados.templateId
|
|
? "Template removido"
|
|
: "-"}
|
|
<tr>
|
|
<td>
|
|
<div class="flex items-center gap-2">
|
|
{#if agendamento.tipo === "email"}
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-5 w-5 text-info"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"
|
|
/>
|
|
</svg>
|
|
<span class="badge badge-info badge-sm">Email</span>
|
|
{:else}
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-5 w-5 text-primary"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z"
|
|
/>
|
|
</svg>
|
|
<span class="badge badge-primary badge-sm">Chat</span>
|
|
{/if}
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<div class="font-medium">{nomeDestinatario}</div>
|
|
{#if agendamento.tipo === "email"}
|
|
<div class="text-xs text-base-content/60">
|
|
{agendamento.dados.destinatario}
|
|
</div>
|
|
{/if}
|
|
</td>
|
|
<td>
|
|
<div class="font-medium">{dataFormatada}</div>
|
|
{#if podeCancelar}
|
|
{@const tempoRestante =
|
|
agendamento.tipo === "email"
|
|
? (agendamento.dados.agendadaPara ?? 0) - Date.now()
|
|
: (agendamento.dados.agendadaPara ?? 0) - Date.now()}
|
|
{@const horasRestantes = Math.floor(
|
|
tempoRestante / (1000 * 60 * 60),
|
|
)}
|
|
{@const minutosRestantes = Math.floor(
|
|
(tempoRestante % (1000 * 60 * 60)) / (1000 * 60),
|
|
)}
|
|
{#if horasRestantes < 1 && minutosRestantes < 60}
|
|
<div class="text-xs text-warning">
|
|
Em {minutosRestantes} min
|
|
</div>
|
|
{:else if horasRestantes < 24}
|
|
<div class="text-xs text-info">
|
|
Em {horasRestantes}h {minutosRestantes}min
|
|
</div>
|
|
{/if}
|
|
{/if}
|
|
</td>
|
|
<td>
|
|
{#if status === "agendado"}
|
|
<span class="badge badge-warning badge-sm">Agendado</span>
|
|
{:else if status === "enviado"}
|
|
<span class="badge badge-success badge-sm">Enviado</span>
|
|
{:else}
|
|
<span class="badge badge-error badge-sm">Cancelado</span>
|
|
{/if}
|
|
</td>
|
|
<td>
|
|
{#if agendamento.tipo === "email"}
|
|
{#if agendamento.dados.templateInfo}
|
|
<div class="text-sm">
|
|
{agendamento.dados.templateInfo.nome}
|
|
</div>
|
|
{:else if agendamento.dados.templateId}
|
|
<div class="text-sm text-base-content/60 italic">
|
|
Template removido
|
|
</div>
|
|
{:else}
|
|
<div class="text-sm text-base-content/60">-</div>
|
|
{/if}
|
|
{:else}
|
|
<div class="text-sm text-base-content/60">-</div>
|
|
{/if}
|
|
</td>
|
|
<td>
|
|
{#if podeCancelar}
|
|
<button
|
|
type="button"
|
|
class="btn btn-sm btn-error btn-outline"
|
|
onclick={() => cancelarAgendamento(agendamento)}
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-4 w-4"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M6 18L18 6M6 6l12 12"
|
|
/>
|
|
</svg>
|
|
Cancelar
|
|
</button>
|
|
{:else}
|
|
<span class="text-sm text-base-content/60">-</span>
|
|
{/if}
|
|
</td>
|
|
</tr>
|
|
{/each}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Info -->
|
|
<div class="alert alert-warning mt-6">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
class="stroke-current shrink-0 w-6 h-6"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"
|
|
></path>
|
|
</svg>
|
|
<span
|
|
>Para enviar emails, certifique-se de configurar o SMTP em Configurações
|
|
de Email.</span
|
|
>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Modal Novo Template -->
|
|
{#if modalNovoTemplateAberto}
|
|
<div class="modal modal-open">
|
|
<div class="modal-box max-w-2xl">
|
|
<h3 class="font-bold text-lg mb-4">Criar Novo Template</h3>
|
|
|
|
<div class="space-y-4">
|
|
<!-- Código -->
|
|
<div class="form-control">
|
|
<label class="label">
|
|
<span class="label-text font-medium">Código *</span>
|
|
<span class="label-text-alt">Ex: AVISO_IMPORTANTE</span>
|
|
</label>
|
|
<input
|
|
type="text"
|
|
bind:value={codigoTemplate}
|
|
placeholder="CODIGO_TEMPLATE"
|
|
class="input input-bordered"
|
|
maxlength="50"
|
|
/>
|
|
<label class="label">
|
|
<span class="label-text-alt"
|
|
>Código único para identificar o template (será convertido para
|
|
MAIÚSCULAS)</span
|
|
>
|
|
</label>
|
|
</div>
|
|
|
|
<!-- Nome -->
|
|
<div class="form-control">
|
|
<label class="label">
|
|
<span class="label-text font-medium">Nome *</span>
|
|
</label>
|
|
<input
|
|
type="text"
|
|
bind:value={nomeTemplate}
|
|
placeholder="Nome do Template"
|
|
class="input input-bordered"
|
|
maxlength="100"
|
|
/>
|
|
<label class="label">
|
|
<span class="label-text-alt"
|
|
>Nome exibido na lista de templates</span
|
|
>
|
|
</label>
|
|
</div>
|
|
|
|
<!-- Título -->
|
|
<div class="form-control">
|
|
<label class="label">
|
|
<span class="label-text font-medium">Título *</span>
|
|
</label>
|
|
<input
|
|
type="text"
|
|
bind:value={tituloTemplate}
|
|
placeholder="Título da Mensagem"
|
|
class="input input-bordered"
|
|
maxlength="200"
|
|
/>
|
|
<label class="label">
|
|
<span class="label-text-alt"
|
|
>Título usado no assunto do email ou cabeçalho da mensagem</span
|
|
>
|
|
</label>
|
|
</div>
|
|
|
|
<!-- Corpo -->
|
|
<div class="form-control">
|
|
<label class="label">
|
|
<span class="label-text font-medium">Corpo da Mensagem *</span>
|
|
</label>
|
|
<textarea
|
|
bind:value={corpoTemplate}
|
|
placeholder="Digite o conteúdo da mensagem..."
|
|
class="textarea textarea-bordered h-32"
|
|
maxlength="2000"
|
|
></textarea>
|
|
<label class="label">
|
|
<span class="label-text-alt"
|
|
>Use {"{{"}variavel{"}}"} para variáveis dinâmicas (ex: {"{{"}nome{"}}"},
|
|
{"{{"}data{"}}"})</span
|
|
>
|
|
</label>
|
|
</div>
|
|
|
|
<!-- Variáveis -->
|
|
<div class="form-control">
|
|
<label class="label">
|
|
<span class="label-text font-medium">Variáveis (opcional)</span>
|
|
</label>
|
|
<input
|
|
type="text"
|
|
bind:value={variaveisTemplate}
|
|
placeholder="nome, data, valor (separadas por vírgula)"
|
|
class="input input-bordered"
|
|
/>
|
|
<label class="label">
|
|
<span class="label-text-alt"
|
|
>Liste as variáveis que podem ser substituídas no template
|
|
(separadas por vírgula ou espaço)</span
|
|
>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="modal-action">
|
|
<button
|
|
class="btn btn-ghost"
|
|
onclick={fecharModalNovoTemplate}
|
|
disabled={criandoNovoTemplate}
|
|
>
|
|
Cancelar
|
|
</button>
|
|
<button
|
|
class="btn btn-primary"
|
|
onclick={salvarNovoTemplate}
|
|
disabled={criandoNovoTemplate}
|
|
>
|
|
{#if criandoNovoTemplate}
|
|
<span class="loading loading-spinner loading-sm"></span>
|
|
Criando...
|
|
{:else}
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-5 w-5"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M5 13l4 4L19 7"
|
|
/>
|
|
</svg>
|
|
Criar Template
|
|
{/if}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="modal-backdrop" onclick={fecharModalNovoTemplate}></div>
|
|
</div>
|
|
{/if}
|