{% extends "base.html" %}
{% import 'macros/empresa.html' as empresa_ui %}

{% block title %}E-mail de saída{% endblock %}

{% block content %}
<div class="container-fluid">
    <div class="d-flex justify-content-between align-items-center flex-wrap gap-2 mb-3">
        <div>
            <h2 class="mb-1"><i class="bi bi-envelope-gear"></i> Caixas de e-mail de saída</h2>
            <p class="text-muted mb-0">Cadastre os SMTPs do próprio cliente por setor para uso no Fiscal, RH, relatórios e demais rotinas.</p>
        </div>
        <div class="d-flex gap-2 flex-wrap">
            <a href="{{ url_for('fiscal_configuracao') }}" class="btn btn-outline-secondary">
                <i class="bi bi-receipt"></i> Voltar ao Fiscal
            </a>
            <a href="{{ url_for('rh_configuracoes') }}" class="btn btn-outline-primary">
                <i class="bi bi-people"></i> Voltar ao RH
            </a>
        </div>
    </div>

    <div class="card shadow-sm mb-3">
        <div class="card-body">
            <form method="get" class="row g-3 align-items-end">
                <div class="col-md-5 col-lg-4">
                    <label class="form-label fw-semibold">Empresa</label>
                    <select name="empresa_id" class="form-select" onchange="this.form.submit()">
                        {% for emp in empresas %}
                        <option value="{{ emp.id }}" {% if empresa_atual and emp.id == empresa_atual.id %}selected{% endif %}>{{ empresa_ui.nome(emp) }}</option>
                        {% endfor %}
                    </select>
                </div>
                <div class="col-md-7 col-lg-8">
                    <div class="alert alert-info py-2 mb-0">
                        <strong>Dica:</strong> use <em>Empresa selecionada</em> quando a caixa pertencer só à loja atual e <em>Grupo / geral</em> quando o mesmo remetente puder atender todas as empresas deste ambiente.
                    </div>
                </div>
            </form>
        </div>
    </div>

    {% if empresa_atual %}
    <div class="row g-3 mb-4">
        {% for config in configs %}
        <div class="col-12">
            <div class="card border-secondary-subtle shadow-sm">
                <div class="card-header d-flex justify-content-between align-items-center flex-wrap gap-2">
                    <div>
                        <strong>{{ config.nome_caixa }}</strong>
                        <div class="small text-muted">{{ config.descricao_escopo }} • {{ config.descricao_setor }} • {{ config.email_remetente }}</div>
                    </div>
                    <div class="d-flex align-items-center gap-2 flex-wrap">
                        <span class="badge text-bg-dark">{{ config.descricao_escopo }}</span>
                        {% if config.padrao_setor %}<span class="badge text-bg-primary">padrão do setor</span>{% endif %}
                        {% if config.ativo %}<span class="badge text-bg-success">ativa</span>{% else %}<span class="badge text-bg-secondary">inativa</span>{% endif %}
                        {% if config.senha_configurada %}<span class="badge text-bg-info">senha salva</span>{% else %}<span class="badge text-bg-warning">sem senha</span>{% endif %}
                    </div>
                </div>
                <div class="card-body">
                    <form method="post" class="row g-3">
                        <input type="hidden" name="acao" value="salvar">
                        <input type="hidden" name="empresa_id" value="{{ empresa_atual.id }}">
                        <input type="hidden" name="config_id" value="{{ config.id }}">

                        <div class="col-md-4">
                            <label class="form-label">Nome da caixa</label>
                            <input type="text" name="nome_caixa" class="form-control" value="{{ config.nome_caixa }}" required>
                        </div>
                        <div class="col-md-4">
                            <label class="form-label">Setor</label>
                            <select name="setor" class="form-select">
                                {% for setor in setores_email %}
                                <option value="{{ setor.valor }}" {% if setor.valor == config.setor %}selected{% endif %}>{{ setor.descricao }}</option>
                                {% endfor %}
                            </select>
                        </div>
                        <div class="col-md-4">
                            <label class="form-label">Escopo</label>
                            <select name="escopo" class="form-select">
                                {% for escopo in escopos_email %}
                                <option value="{{ escopo.valor }}" {% if escopo.valor == config.escopo %}selected{% endif %}>{{ escopo.descricao }}</option>
                                {% endfor %}
                            </select>
                        </div>
                        <div class="col-md-4">
                            <label class="form-label">Nome do remetente</label>
                            <input type="text" name="remetente_nome" class="form-control" value="{{ config.remetente_nome or '' }}" placeholder="Ex.: Financeiro Loja Matriz">
                        </div>

                        <div class="col-md-4">
                            <label class="form-label">E-mail remetente</label>
                            <input type="email" name="email_remetente" class="form-control" value="{{ config.email_remetente }}" required>
                        </div>
                        <div class="col-md-4">
                            <label class="form-label">Responder para</label>
                            <input type="email" name="responder_para" class="form-control" value="{{ config.responder_para or '' }}">
                        </div>
                        <div class="col-md-4">
                            <label class="form-label">Servidor SMTP</label>
                            <input type="text" name="smtp_host" class="form-control" value="{{ config.smtp_host }}" placeholder="smtp.seudominio.com.br" required>
                        </div>

                        <div class="col-md-3">
                            <label class="form-label">Porta SMTP</label>
                            <input type="number" name="smtp_porta" class="form-control" value="{{ config.smtp_porta or 587 }}" min="1" max="65535">
                        </div>
                        <div class="col-md-4">
                            <label class="form-label">Usuário SMTP</label>
                            <input type="text" name="smtp_usuario" class="form-control" value="{{ config.smtp_usuario or '' }}" placeholder="usuario@dominio.com.br">
                        </div>
                        <div class="col-md-5">
                            <label class="form-label">Senha SMTP</label>
                            <input type="password" name="smtp_senha" class="form-control" placeholder="Deixe em branco para manter a atual">
                        </div>

                        <div class="col-12">
                            <label class="form-label">Observações</label>
                            <textarea name="observacoes" class="form-control" rows="2" placeholder="Use este espaço para documentar quando a caixa deve ser usada.">{{ config.observacoes or '' }}</textarea>
                        </div>

                        <div class="col-12 d-flex justify-content-between align-items-center flex-wrap gap-2">
                            <div class="d-flex gap-3 flex-wrap">
                                <label class="form-check-label"><input class="form-check-input me-1" type="checkbox" name="ativo" {% if config.ativo %}checked{% endif %}> Caixa ativa</label>
                                <label class="form-check-label"><input class="form-check-input me-1" type="checkbox" name="padrao_setor" {% if config.padrao_setor %}checked{% endif %}> Padrão do setor</label>
                                <label class="form-check-label"><input class="form-check-input me-1" type="checkbox" name="smtp_ssl" {% if config.smtp_ssl %}checked{% endif %}> SSL</label>
                                <label class="form-check-label"><input class="form-check-input me-1" type="checkbox" name="smtp_starttls" {% if config.smtp_starttls %}checked{% endif %}> STARTTLS</label>
                            </div>
                            <div class="d-flex gap-2">
                                <button type="submit" class="btn btn-primary">
                                    <i class="bi bi-save"></i> Salvar caixa
                                </button>
                            </div>
                        </div>
                    </form>

                    <form method="post" class="mt-3 text-end" onsubmit="return confirm('Excluir esta caixa de e-mail?');">
                        <input type="hidden" name="acao" value="excluir">
                        <input type="hidden" name="empresa_id" value="{{ empresa_atual.id }}">
                        <input type="hidden" name="config_id" value="{{ config.id }}">
                        <button type="submit" class="btn btn-outline-danger btn-sm">
                            <i class="bi bi-trash"></i> Excluir caixa
                        </button>
                    </form>
                </div>
            </div>
        </div>
        {% endfor %}
    </div>

    <div class="card border-primary shadow-sm">
        <div class="card-header bg-primary text-white">
            <strong><i class="bi bi-plus-circle"></i> Nova caixa de e-mail</strong>
        </div>
        <div class="card-body">
            <form method="post" class="row g-3">
                <input type="hidden" name="acao" value="salvar">
                <input type="hidden" name="empresa_id" value="{{ empresa_atual.id }}">

                <div class="col-md-4">
                    <label class="form-label">Nome da caixa</label>
                    <input type="text" name="nome_caixa" class="form-control" placeholder="Ex.: Fiscal Matriz" required>
                </div>
                <div class="col-md-4">
                    <label class="form-label">Setor</label>
                    <select name="setor" class="form-select">
                        {% for setor in setores_email %}
                        <option value="{{ setor.valor }}">{{ setor.descricao }}</option>
                        {% endfor %}
                    </select>
                </div>
                <div class="col-md-4">
                    <label class="form-label">Escopo</label>
                    <select name="escopo" class="form-select">
                        {% for escopo in escopos_email %}
                        <option value="{{ escopo.valor }}">{{ escopo.descricao }}</option>
                        {% endfor %}
                    </select>
                </div>
                <div class="col-md-4">
                    <label class="form-label">Nome do remetente</label>
                    <input type="text" name="remetente_nome" class="form-control" placeholder="Nome exibido no e-mail">
                </div>

                <div class="col-md-4">
                    <label class="form-label">E-mail remetente</label>
                    <input type="email" name="email_remetente" class="form-control" placeholder="email@dominio.com.br" required>
                </div>
                <div class="col-md-4">
                    <label class="form-label">Responder para</label>
                    <input type="email" name="responder_para" class="form-control" placeholder="atendimento@dominio.com.br">
                </div>
                <div class="col-md-4">
                    <label class="form-label">Servidor SMTP</label>
                    <input type="text" name="smtp_host" class="form-control" placeholder="smtp.seudominio.com.br" required>
                </div>

                <div class="col-md-3">
                    <label class="form-label">Porta SMTP</label>
                    <input type="number" name="smtp_porta" class="form-control" value="587" min="1" max="65535">
                </div>
                <div class="col-md-4">
                    <label class="form-label">Usuário SMTP</label>
                    <input type="text" name="smtp_usuario" class="form-control" placeholder="usuario@dominio.com.br">
                </div>
                <div class="col-md-5">
                    <label class="form-label">Senha SMTP</label>
                    <input type="password" name="smtp_senha" class="form-control" placeholder="Senha ou token do provedor">
                </div>

                <div class="col-12">
                    <label class="form-label">Observações</label>
                    <textarea name="observacoes" class="form-control" rows="2" placeholder="Ex.: usar para NF-e e XMLs automáticos."></textarea>
                </div>

                <div class="col-12 d-flex justify-content-between align-items-center flex-wrap gap-2">
                    <div class="d-flex gap-3 flex-wrap">
                        <label class="form-check-label"><input class="form-check-input me-1" type="checkbox" name="ativo" checked> Caixa ativa</label>
                        <label class="form-check-label"><input class="form-check-input me-1" type="checkbox" name="padrao_setor" checked> Padrão do setor</label>
                        <label class="form-check-label"><input class="form-check-input me-1" type="checkbox" name="smtp_ssl"> SSL</label>
                        <label class="form-check-label"><input class="form-check-input me-1" type="checkbox" name="smtp_starttls" checked> STARTTLS</label>
                    </div>
                    <button type="submit" class="btn btn-success">
                        <i class="bi bi-check-lg"></i> Cadastrar caixa
                    </button>
                </div>
            </form>
        </div>
    </div>
    {% endif %}
</div>
{% endblock %}