394 lines
20 KiB
HTML
394 lines
20 KiB
HTML
{% extends 'core/base.html' %}
|
||
|
||
{% block content %}
|
||
{% if user.is_authenticated %}
|
||
<!-- 欢迎区域 -->
|
||
<div class="row mb-4">
|
||
<div class="col-12">
|
||
<div class="card" style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white;">
|
||
<div class="card-body d-flex align-items-center justify-content-between py-4">
|
||
<div>
|
||
<h3 class="mb-1"><i class="bi bi-sun-fill me-2"></i>早上好,{{ user.username }}!</h3>
|
||
<p class="mb-0 opacity-75"><i class="bi bi-calendar3 me-2"></i>今天是 {{ today }},祝您有美好的一天!</p>
|
||
</div>
|
||
<div class="text-end d-none d-md-block">
|
||
<i class="bi bi-house-heart" style="font-size: 4rem; opacity: 0.3;"></i>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="row">
|
||
<!-- 今日概览 -->
|
||
<div class="col-lg-8">
|
||
<div class="card h-100">
|
||
<div class="card-header bg-primary text-white d-flex justify-content-between align-items-center">
|
||
<h5 class="card-title mb-0"><i class="bi bi-speedometer2 me-2"></i>今日概览</h5>
|
||
<span class="badge bg-light text-primary">{{ today }}</span>
|
||
</div>
|
||
<div class="card-body">
|
||
<div class="mt-2">
|
||
<h6 class="mb-3"><i class="bi bi-calendar-check me-2 text-primary"></i>今日计划</h6>
|
||
{% if today_plan %}
|
||
<div class="list-group">
|
||
{% for plan in today_plan %}
|
||
<div class="list-group-item d-flex justify-content-between align-items-center">
|
||
<div class="d-flex align-items-center">
|
||
<div class="me-3">
|
||
{% if plan.status == 'completed' %}
|
||
<i class="bi bi-check-circle-fill text-success" style="font-size: 1.2rem;"></i>
|
||
{% else %}
|
||
<i class="bi bi-circle text-warning" style="font-size: 1.2rem;"></i>
|
||
{% endif %}
|
||
</div>
|
||
<div>
|
||
<strong>{{ plan.content }}</strong>
|
||
<div class="small text-muted">
|
||
<i class="bi bi-tag me-1"></i>{{ plan.get_type_display }}
|
||
<span class="mx-1">|</span>
|
||
<i class="bi bi-flag me-1"></i>{{ plan.get_priority_display }}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<span class="badge {% if plan.status == 'completed' %}bg-success{% else %}bg-warning{% endif %} status-badge">
|
||
{{ plan.get_status_display }}
|
||
</span>
|
||
</div>
|
||
{% endfor %}
|
||
</div>
|
||
{% else %}
|
||
<div class="text-center py-4">
|
||
<i class="bi bi-inbox text-muted" style="font-size: 3rem;"></i>
|
||
<p class="text-muted mt-2">今天还没有计划,快去添加吧!</p>
|
||
<a href="{% url 'today_plan' %}" class="btn btn-primary btn-sm">
|
||
<i class="bi bi-plus-lg me-1"></i>添加计划
|
||
</a>
|
||
</div>
|
||
{% endif %}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 待处理事项 -->
|
||
<div class="col-lg-4">
|
||
<div class="card h-100">
|
||
<div class="card-header bg-warning text-white d-flex justify-content-between align-items-center">
|
||
<h5 class="card-title mb-0"><i class="bi bi-exclamation-triangle me-2"></i>待处理事项</h5>
|
||
<span class="badge bg-light text-warning">{{ pending_family_tasks|length }}</span>
|
||
</div>
|
||
<div class="card-body">
|
||
{% if pending_family_tasks %}
|
||
<div class="list-group">
|
||
{% for task in pending_family_tasks %}
|
||
<div class="list-group-item">
|
||
<div class="d-flex justify-content-between align-items-start">
|
||
<div>
|
||
<strong>{{ task.content }}</strong>
|
||
<div class="small text-muted mt-1">
|
||
<i class="bi bi-folder me-1"></i>{{ task.get_type_display }}
|
||
</div>
|
||
</div>
|
||
<span class="badge {% if task.priority == 'high' %}bg-danger{% elif task.priority == 'medium' %}bg-warning{% else %}bg-info{% endif %}">
|
||
{{ task.get_priority_display }}
|
||
</span>
|
||
</div>
|
||
{% if task.deadline %}
|
||
<div class="mt-2 small">
|
||
<i class="bi bi-clock me-1 text-muted"></i>
|
||
<span class="{% if task.is_overdue %}text-danger{% else %}text-muted{% endif %}">
|
||
截止:{{ task.deadline }}
|
||
</span>
|
||
</div>
|
||
{% endif %}
|
||
</div>
|
||
{% endfor %}
|
||
</div>
|
||
{% else %}
|
||
<div class="text-center py-4">
|
||
<i class="bi bi-check-all text-success" style="font-size: 3rem;"></i>
|
||
<p class="text-muted mt-2">没有待处理的家庭事项</p>
|
||
</div>
|
||
{% endif %}
|
||
<a href="{% url 'family_tasks' %}" class="btn btn-outline-warning w-100 mt-3">
|
||
<i class="bi bi-list-check me-1"></i>查看所有家庭事项
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 快捷操作 -->
|
||
<div class="row mt-4">
|
||
<div class="col-12">
|
||
<div class="card">
|
||
<div class="card-header bg-info text-dark">
|
||
<h5 class="card-title mb-0"><i class="bi bi-lightning-charge me-2"></i>快捷操作</h5>
|
||
</div>
|
||
<div class="card-body">
|
||
<div class="row g-3">
|
||
<div class="col-6 col-md-4 col-lg">
|
||
<a href="{% url 'today_records' %}" class="btn btn-outline-primary w-100 py-3">
|
||
<i class="bi bi-plus-circle" style="font-size: 1.5rem;"></i>
|
||
<div class="mt-2 small">添加今日信息</div>
|
||
</a>
|
||
</div>
|
||
<div class="col-6 col-md-4 col-lg">
|
||
<a href="{% url 'yesterday_records' %}" class="btn btn-outline-success w-100 py-3">
|
||
<i class="bi bi-journal-plus" style="font-size: 1.5rem;"></i>
|
||
<div class="mt-2 small">追加昨日信息</div>
|
||
</a>
|
||
</div>
|
||
<div class="col-6 col-md-4 col-lg">
|
||
<a href="{% url 'today_plan' %}" class="btn btn-outline-info w-100 py-3">
|
||
<i class="bi bi-calendar-plus" style="font-size: 1.5rem;"></i>
|
||
<div class="mt-2 small">管理今日计划</div>
|
||
</a>
|
||
</div>
|
||
<div class="col-6 col-md-4 col-lg">
|
||
<a href="{% url 'generate_report' %}" class="btn btn-outline-warning w-100 py-3">
|
||
<i class="bi bi-file-earmark-pdf" style="font-size: 1.5rem;"></i>
|
||
<div class="mt-2 small">预览日报PDF</div>
|
||
</a>
|
||
</div>
|
||
<div class="col-6 col-md-4 col-lg">
|
||
<a href="{% url 'send_email' %}" class="btn btn-outline-success w-100 py-3">
|
||
<i class="bi bi-envelope-check" style="font-size: 1.5rem;"></i>
|
||
<div class="mt-2 small">发送今日邮件</div>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 昨日记录 -->
|
||
<div class="row mt-4">
|
||
<div class="col-12">
|
||
<div class="card">
|
||
<div class="card-header bg-secondary text-white d-flex justify-content-between align-items-center">
|
||
<h5 class="card-title mb-0"><i class="bi bi-clock-history me-2"></i>昨日记录</h5>
|
||
<span class="badge bg-light text-secondary">{{ yesterday }}</span>
|
||
</div>
|
||
<div class="card-body">
|
||
<div class="row">
|
||
<!-- 昨日阅读 -->
|
||
<div class="col-md-4">
|
||
<h6 class="mb-3"><i class="bi bi-book me-2 text-primary"></i>阅读记录</h6>
|
||
{% if yesterday_reading %}
|
||
<div class="list-group">
|
||
{% for reading in yesterday_reading %}
|
||
<div class="list-group-item">
|
||
<div class="d-flex align-items-start">
|
||
<i class="bi bi-bookmark-fill text-primary me-2 mt-1"></i>
|
||
<div>
|
||
<strong>{{ reading.title }}</strong>
|
||
<div class="small text-muted">
|
||
<span class="badge bg-secondary">{{ reading.get_type_display }}</span>
|
||
</div>
|
||
{% if reading.source %}
|
||
<div class="small text-muted mt-1">
|
||
<i class="bi bi-link-45deg me-1"></i>{{ reading.source }}
|
||
</div>
|
||
{% endif %}
|
||
{% if reading.progress %}
|
||
<div class="mt-2">
|
||
<div class="progress" style="height: 6px;">
|
||
<div class="progress-bar bg-primary" role="progressbar" style="width: {{ reading.progress }}%"></div>
|
||
</div>
|
||
<small class="text-muted">进度:{{ reading.progress }}%</small>
|
||
</div>
|
||
{% endif %}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
{% endfor %}
|
||
</div>
|
||
{% else %}
|
||
<div class="text-center py-3">
|
||
<i class="bi bi-inbox text-muted" style="font-size: 2rem;"></i>
|
||
<p class="text-muted small mt-2">昨日没有阅读记录</p>
|
||
</div>
|
||
{% endif %}
|
||
</div>
|
||
|
||
<!-- 昨日感悟 -->
|
||
<div class="col-md-4">
|
||
<h6 class="mb-3"><i class="bi bi-lightbulb me-2 text-success"></i>感悟记录</h6>
|
||
{% if yesterday_insight %}
|
||
<div class="list-group">
|
||
{% for insight in yesterday_insight %}
|
||
<div class="list-group-item">
|
||
<div class="d-flex align-items-start">
|
||
<i class="bi bi-chat-quote-fill text-success me-2 mt-1"></i>
|
||
<div>
|
||
<p class="mb-1">{{ insight.content|truncatechars:100 }}</p>
|
||
{% if insight.file %}
|
||
<a href="{{ insight.file.url }}" class="file-link small" target="_blank">
|
||
<i class="bi bi-paperclip me-1"></i>查看附件
|
||
</a>
|
||
{% endif %}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
{% endfor %}
|
||
</div>
|
||
{% else %}
|
||
<div class="text-center py-3">
|
||
<i class="bi bi-inbox text-muted" style="font-size: 2rem;"></i>
|
||
<p class="text-muted small mt-2">昨日没有感悟记录</p>
|
||
</div>
|
||
{% endif %}
|
||
</div>
|
||
|
||
<!-- 昨日汇总记录 -->
|
||
<div class="col-md-4">
|
||
<h6 class="mb-3"><i class="bi bi-collection me-2 text-info"></i>汇总记录</h6>
|
||
{% if yesterday_summary %}
|
||
<div class="list-group">
|
||
{% for summary in yesterday_summary %}
|
||
<div class="list-group-item">
|
||
<div class="d-flex align-items-start">
|
||
<i class="bi bi-journal-text text-info me-2 mt-1"></i>
|
||
<div>
|
||
<div class="d-flex align-items-center mb-1">
|
||
<span class="badge bg-primary me-2">{{ summary.category.name }}</span>
|
||
<small class="text-muted">{{ summary.speaker.name }}</small>
|
||
</div>
|
||
<p class="mb-1 small">{{ summary.content|truncatechars:80 }}</p>
|
||
{% if summary.source %}
|
||
<small class="text-muted">
|
||
<i class="bi bi-link-45deg me-1"></i>{{ summary.source }}
|
||
</small>
|
||
{% endif %}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
{% endfor %}
|
||
</div>
|
||
{% else %}
|
||
<div class="text-center py-3">
|
||
<i class="bi bi-inbox text-muted" style="font-size: 2rem;"></i>
|
||
<p class="text-muted small mt-2">昨日没有汇总记录</p>
|
||
</div>
|
||
{% endif %}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 历史记录查询 -->
|
||
<div class="row mt-4">
|
||
<div class="col-12">
|
||
<div class="card">
|
||
<div class="card-header bg-dark text-white d-flex justify-content-between align-items-center">
|
||
<h5 class="card-title mb-0"><i class="bi bi-clock-history me-2"></i>历史记录查询</h5>
|
||
<span class="badge bg-light text-dark">导出PDF</span>
|
||
</div>
|
||
<div class="card-body">
|
||
<form id="historyForm" method="GET" action="{% url 'history_records' %}">
|
||
<div class="row align-items-end">
|
||
<div class="col-md-3">
|
||
<label class="form-label"><i class="bi bi-calendar-minus me-1"></i>开始时间</label>
|
||
<input type="date" class="form-control" id="start_date" name="start_date" required>
|
||
</div>
|
||
<div class="col-md-3">
|
||
<label class="form-label"><i class="bi bi-calendar-plus me-1"></i>结束时间</label>
|
||
<input type="date" class="form-control" id="end_date" name="end_date" required>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="d-flex gap-2 flex-wrap">
|
||
<button type="button" class="btn btn-outline-secondary btn-sm" onclick="setCurrentQuarter()">
|
||
<i class="bi bi-calendar3 me-1"></i>当季
|
||
</button>
|
||
<button type="button" class="btn btn-outline-secondary btn-sm" onclick="setCurrentYear()">
|
||
<i class="bi bi-calendar-year me-1"></i>本年度
|
||
</button>
|
||
<button type="submit" class="btn btn-primary">
|
||
<i class="bi bi-search me-1"></i>查询记录
|
||
</button>
|
||
<button type="button" class="btn btn-success" onclick="exportHistoryPDF()">
|
||
<i class="bi bi-file-earmark-pdf me-1"></i>导出PDF
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script>
|
||
// 设置当季时间范围(最近3个月)
|
||
function setCurrentQuarter() {
|
||
const today = new Date();
|
||
const threeMonthsAgo = new Date(today.getFullYear(), today.getMonth() - 2, 1);
|
||
|
||
document.getElementById('start_date').value = formatDate(threeMonthsAgo);
|
||
document.getElementById('end_date').value = formatDate(today);
|
||
}
|
||
|
||
// 设置本年度时间范围
|
||
function setCurrentYear() {
|
||
const today = new Date();
|
||
const yearStart = new Date(today.getFullYear(), 0, 1);
|
||
|
||
document.getElementById('start_date').value = formatDate(yearStart);
|
||
document.getElementById('end_date').value = formatDate(today);
|
||
}
|
||
|
||
// 格式化日期为 YYYY-MM-DD
|
||
function formatDate(date) {
|
||
const year = date.getFullYear();
|
||
const month = String(date.getMonth() + 1).padStart(2, '0');
|
||
const day = String(date.getDate()).padStart(2, '0');
|
||
return `${year}-${month}-${day}`;
|
||
}
|
||
|
||
// 导出历史记录PDF
|
||
function exportHistoryPDF() {
|
||
const startDate = document.getElementById('start_date').value;
|
||
const endDate = document.getElementById('end_date').value;
|
||
|
||
if (!startDate || !endDate) {
|
||
alert('请先选择开始时间和结束时间');
|
||
return;
|
||
}
|
||
|
||
if (new Date(startDate) > new Date(endDate)) {
|
||
alert('开始时间不能晚于结束时间');
|
||
return;
|
||
}
|
||
|
||
window.location.href = `{% url 'history_pdf' %}?start_date=${startDate}&end_date=${endDate}`;
|
||
}
|
||
|
||
// 页面加载时默认设置为本年度
|
||
document.addEventListener('DOMContentLoaded', function() {
|
||
setCurrentYear();
|
||
});
|
||
</script>
|
||
{% else %}
|
||
<!-- 未登录欢迎区域 -->
|
||
<div class="row">
|
||
<div class="col-12">
|
||
<div class="card" style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white;">
|
||
<div class="card-body text-center py-5">
|
||
<i class="bi bi-house-heart" style="font-size: 5rem; opacity: 0.8;"></i>
|
||
<h2 class="mt-4 mb-3">欢迎使用家庭日报系统</h2>
|
||
<p class="mb-4 opacity-90">请先登录以使用系统功能</p>
|
||
<a href="{% url 'login' %}" class="btn btn-light btn-lg px-5">
|
||
<i class="bi bi-box-arrow-in-right me-2"></i>登录系统
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
{% endif %}
|
||
{% endblock %}
|