{{define "sent"}}
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
    <title>已发送 - MailGo</title>
    {{template "styles" .}}
</head>
<body class="page-list">
    {{template "navbar" .}}
    <div class="app-body">
        {{template "sidebar" .}}
        <main class="mail-main">
            <div class="list-toolbar">
                <label class="check-all" title="全选/取消全选">
                    <input type="checkbox" id="select-all">
                    全选
                </label>
                <button type="button" class="tb-btn" id="btn-refresh" title="刷新">
                    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="23 4 23 10 17 10"/><path d="M20.49 15a9 9 0 1 1-2.12-9.36L23 10"/></svg>
                    刷新
                </button>
                <button type="button" class="tb-btn danger" id="btn-delete" disabled>
                    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="3 6 5 6 21 6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg>
                    删除
                </button>
                <div class="toolbar-spacer"></div>
                <span class="page-info">共 {{.total}} 封</span>
            </div>

            {{if not .messages}}
            <div class="mail-list">
                <div class="empty-tip"><span class="empty-icon">📤</span>已发送暂无邮件</div>
            </div>
            {{else}}
            <ul class="mail-list">
                {{range .messages}}
                <li class="mail-row" data-id="{{.ID}}">
                    <label class="cell-check" onclick="event.stopPropagation()">
                        <input type="checkbox" class="row-check" data-id="{{.ID}}">
                    </label>
                    <span class="cell-avatar">
                        <span class="avatar" style="{{avatarStyle .ToAddr}}">{{initial (mailName .ToAddr)}}</span>
                    </span>
                    <span class="cell-from" title="收件人：{{.ToAddr}}">{{mailName .ToAddr}}</span>
                    <span class="cell-subject-wrap">
                        <a class="cell-subject" href="/sent/{{.ID}}">
                            {{if .Subject}}{{.Subject}}{{else}}(无主题){{end}}
                        </a>
                    </span>
                    <span class="cell-snippet">
                        {{if .TextBody}}{{truncate .TextBody 80}}{{else if .HtmlBody}}[HTML 邮件]{{end}}
                    </span>
                    <span class="cell-date">{{shortDate .Date}}</span>
                    <form method="POST" action="/mail/delete/{{.ID}}" class="row-del"
                          onsubmit="return confirm('确定要删除这封邮件吗？');">
                        <button type="submit" class="icon-btn" title="删除">
                            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="3 6 5 6 21 6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg>
                        </button>
                    </form>
                </li>
                {{end}}
            </ul>
            {{end}}

            <div class="list-footer">
                <span class="page-num">第 {{.page}} / {{if .totalPages}}{{.totalPages}}{{else}}1{{end}} 页</span>
                <div class="pager">
                    {{if gt .page 1}}
                    <a class="page-btn" href="/sent?page={{sub .page 1}}">
                        <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="15 18 9 12 15 6"/></svg>
                        上一页
                    </a>
                    {{else}}
                    <span class="page-btn disabled">上一页</span>
                    {{end}}
                    {{if lt .page .totalPages}}
                    <a class="page-btn" href="/sent?page={{add .page 1}}">
                        下一页
                        <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="9 18 15 12 9 6"/></svg>
                    </a>
                    {{else}}
                    <span class="page-btn disabled">下一页</span>
                    {{end}}
                </div>
            </div>
        </main>
    </div>
    {{template "listjs" .}}
</body>
</html>
{{end}}
