reworked dashboard
This commit is contained in:
28
templates/components/contact_status.html
Normal file
28
templates/components/contact_status.html
Normal file
@@ -0,0 +1,28 @@
|
||||
{% macro contact_status(active_count, inactive_count) %}
|
||||
<div class="masonry-card">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<h5 class="card-title mb-0"><i class="fas fa-chart-pie me-2"></i>Contact Status</h5>
|
||||
<div>
|
||||
<a href="{{ url_for('contacts.contacts_list') }}" class="btn btn-primary btn-sm me-2">View All</a>
|
||||
<a href="{{ url_for('contacts.new_contact') }}" class="btn btn-primary btn-sm">+ Add</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="chart-container">
|
||||
<canvas id="statusChart"></canvas>
|
||||
</div>
|
||||
<div class="d-flex justify-content-center gap-4 mt-3">
|
||||
<div class="text-center">
|
||||
<div class="fw-bold text-primary" style="font-size:1.5rem;">{{ active_count }}</div>
|
||||
<div class="text-muted small">Active</div>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<div class="fw-bold" style="color:var(--secondary-color); font-size:1.5rem;">{{ inactive_count }}</div>
|
||||
<div class="text-muted small">Inactive</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
38
templates/components/contacts.html
Normal file
38
templates/components/contacts.html
Normal file
@@ -0,0 +1,38 @@
|
||||
{% macro contacts(recent_contacts) %}
|
||||
<div class="masonry-card">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<h5 class="card-title mb-0"><i class="fas fa-address-book me-2"></i>Recent Contacts</h5>
|
||||
<div>
|
||||
<a href="{{ url_for('contacts.contacts_list') }}" class="btn btn-primary btn-sm me-2">View All</a>
|
||||
<a href="{{ url_for('contacts.new_contact') }}" class="btn btn-primary btn-sm">+ Add</a>
|
||||
</div>
|
||||
</div>
|
||||
{% if recent_contacts %}
|
||||
<ul class="list-unstyled mb-3">
|
||||
{% for contact in recent_contacts %}
|
||||
<li class="mb-2">
|
||||
<div class="fw-semibold">{{ contact.first_name }} {{ contact.last_name }}</div>
|
||||
<div class="flex flex-wrap gap-2 mt-1">
|
||||
<a href="mailto:{{ contact.email }}"
|
||||
class="contact-link inline-flex items-center px-2 py-0.5 rounded text-sm font-normal">
|
||||
<i class="fas fa-envelope mr-1" style="font-size: 0.85em; opacity: 0.7;"></i>{{ contact.email }}
|
||||
</a>
|
||||
{% if contact.phone %}
|
||||
<a href="tel:{{ contact.phone }}"
|
||||
class="contact-link inline-flex items-center px-2 py-0.5 rounded text-sm font-normal">
|
||||
<i class="fas fa-phone mr-1" style="font-size: 0.85em; opacity: 0.7;"></i>{{ contact.phone }}
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<div class="text-muted small">No contacts yet.</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
59
templates/components/recent_activity.html
Normal file
59
templates/components/recent_activity.html
Normal file
@@ -0,0 +1,59 @@
|
||||
{% macro recent_activity(activities) %}
|
||||
<div class="masonry-card">
|
||||
<div class="card h-100">
|
||||
<div class="card-header bg-white border-0">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<h5 class="card-title mb-0"><i class="fas fa-history me-2"></i>Recent Activity</h5>
|
||||
<a href="{{ url_for('rooms.rooms') }}" class="btn btn-primary btn-sm">View All</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="list-group list-group-flush">
|
||||
{% for activity in activities %}
|
||||
<div class="list-group-item">
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="flex-shrink-0">
|
||||
{% if activity.type == 'folder' %}
|
||||
<i class="fas fa-folder me-2 icon-primary"></i>
|
||||
{% else %}
|
||||
<i class="fas fa-file me-2 icon-primary"></i>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="flex-grow-1 ms-3">
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<div>
|
||||
<div class="d-flex align-items-center mb-1">
|
||||
<h6 class="mb-0">{{ activity.name }}</h6>
|
||||
{% if activity.is_starred %}
|
||||
<span class="badge badge-starred ms-2">
|
||||
<i class="fas fa-star me-1"></i>Starred
|
||||
</span>
|
||||
{% endif %}
|
||||
{% if activity.is_deleted %}
|
||||
<span class="badge badge-trash ms-2">
|
||||
<i class="fas fa-trash me-1"></i>Trash
|
||||
</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
<small class="text-muted">
|
||||
{{ activity.room.name }} •
|
||||
{{ activity.uploader.username }} {{ activity.uploader.last_name }} •
|
||||
{% if activity.uploaded_at %}{{ activity.uploaded_at|timeago }}{% else %}Unknown{% endif %}
|
||||
</small>
|
||||
</div>
|
||||
{% if activity.type == 'file' and activity.can_download %}
|
||||
<a href="{{ url_for('room_files.download_room_file', room_id=activity.room.id, filename=activity.name, path=activity.path) }}"
|
||||
class="btn btn-download btn-sm ms-2" title="Download">
|
||||
<i class="fas fa-download"></i>
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
25
templates/components/starred_files.html
Normal file
25
templates/components/starred_files.html
Normal file
@@ -0,0 +1,25 @@
|
||||
{% macro starred_files(starred_count, file_count) %}
|
||||
<div class="masonry-card">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<h5 class="card-title mb-0"><i class="fas fa-star me-2"></i>Starred Files</h5>
|
||||
<a href="{{ url_for('main.starred') }}" class="btn btn-primary btn-sm">View All</a>
|
||||
</div>
|
||||
<div class="chart-container">
|
||||
<canvas id="starredChart"></canvas>
|
||||
</div>
|
||||
<div class="d-flex justify-content-center gap-4 mt-3">
|
||||
<div class="text-center">
|
||||
<div class="fw-bold icon-warning" style="font-size:1.5rem;">{{ starred_count }}</div>
|
||||
<div class="text-muted small">Starred</div>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<div class="fw-bold text-primary" style="font-size:1.5rem;">{{ file_count - starred_count }}</div>
|
||||
<div class="text-muted small">Unstarred</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
44
templates/components/storage_overview.html
Normal file
44
templates/components/storage_overview.html
Normal file
@@ -0,0 +1,44 @@
|
||||
{% from 'macros.html' import format_size %}
|
||||
|
||||
{% macro storage_overview(room_count, file_count, folder_count, total_size) %}
|
||||
<div class="masonry-card">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<h5 class="card-title mb-0"><i class="fas fa-database me-2"></i>Storage Overview</h5>
|
||||
<a href="{{ url_for('rooms.rooms') }}" class="btn btn-primary btn-sm">Browse</a>
|
||||
</div>
|
||||
<div class="d-flex flex-column">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-door-open me-2 icon-primary"></i>
|
||||
<span class="text-muted">Rooms:</span>
|
||||
</div>
|
||||
<div class="fw-bold text-primary">{{ room_count }}</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-file me-2 icon-primary"></i>
|
||||
<span class="text-muted">Files:</span>
|
||||
</div>
|
||||
<div class="fw-bold text-primary">{{ file_count }}</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-folder me-2 icon-primary"></i>
|
||||
<span class="text-muted">Folders:</span>
|
||||
</div>
|
||||
<div class="fw-bold text-primary">{{ folder_count }}</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-hdd me-2 icon-primary"></i>
|
||||
<span class="text-muted">Total Size:</span>
|
||||
</div>
|
||||
<div class="fw-bold text-primary">{{ format_size(total_size) }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
32
templates/components/storage_usage.html
Normal file
32
templates/components/storage_usage.html
Normal file
@@ -0,0 +1,32 @@
|
||||
{% from 'macros.html' import format_size %}
|
||||
|
||||
{% macro storage_usage(storage_by_type) %}
|
||||
<div class="masonry-card">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<h5 class="card-title mb-0"><i class="fas fa-chart-pie me-2"></i>Storage Usage</h5>
|
||||
<a href="{{ url_for('rooms.rooms') }}" class="btn btn-primary btn-sm">View Details</a>
|
||||
</div>
|
||||
{% if storage_by_type %}
|
||||
<div class="chart-container">
|
||||
<canvas id="storageChart"></canvas>
|
||||
</div>
|
||||
<div class="mt-3">
|
||||
{% for type in storage_by_type %}
|
||||
<div class="d-flex justify-content-between align-items-center mb-2">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-file me-2 icon-primary"></i>
|
||||
<span class="text-muted">{{ type.extension|upper }}:</span>
|
||||
</div>
|
||||
<div class="fw-bold text-primary">{{ format_size(type.total_size) }}</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="text-muted small">No storage data available</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
53
templates/components/trash.html
Normal file
53
templates/components/trash.html
Normal file
@@ -0,0 +1,53 @@
|
||||
{% from 'macros.html' import format_size %}
|
||||
|
||||
{% macro trash(trash_count, pending_deletion, oldest_trash_date, trash_size) %}
|
||||
<div class="masonry-card">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<h5 class="card-title mb-0"><i class="fas fa-trash me-2"></i>Trash</h5>
|
||||
<a href="{{ url_for('main.trash') }}" class="btn btn-primary btn-sm">View All</a>
|
||||
</div>
|
||||
<div class="d-flex flex-column">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-file me-2 icon-primary"></i>
|
||||
<span class="text-muted">Files in trash:</span>
|
||||
</div>
|
||||
<div class="fw-bold text-primary">{{ trash_count }}</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-exclamation-triangle me-2 icon-danger"></i>
|
||||
<span class="text-muted">Deleting in 7 days:</span>
|
||||
</div>
|
||||
<div class="fw-bold text-danger">{{ pending_deletion }}</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-clock me-2 icon-primary"></i>
|
||||
<span class="text-muted">Oldest deletion:</span>
|
||||
</div>
|
||||
<div class="fw-bold text-primary">{{ oldest_trash_date|default('N/A') }}</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-hdd me-2 icon-primary"></i>
|
||||
<span class="text-muted">Storage used:</span>
|
||||
</div>
|
||||
<div class="fw-bold text-primary">{{ format_size(trash_size) }}</div>
|
||||
</div>
|
||||
<div class="alert alert-info mb-0">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-info-circle me-2"></i>
|
||||
<div>
|
||||
<div class="fw-bold mb-1">Files will be permanently deleted after 30 days</div>
|
||||
<div class="small">You can restore files before they are permanently deleted</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
30
templates/components/trash_type.html
Normal file
30
templates/components/trash_type.html
Normal file
@@ -0,0 +1,30 @@
|
||||
{% macro trash_type(trash_by_type) %}
|
||||
<div class="masonry-card">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<h5 class="card-title mb-0"><i class="fas fa-file-alt me-2"></i>Trash by Type</h5>
|
||||
<a href="{{ url_for('main.trash') }}" class="btn btn-primary btn-sm">View All</a>
|
||||
</div>
|
||||
{% if trash_by_type %}
|
||||
<div class="chart-container">
|
||||
<canvas id="trashTypeChart"></canvas>
|
||||
</div>
|
||||
<div class="mt-3">
|
||||
{% for type in trash_by_type %}
|
||||
<div class="d-flex justify-content-between align-items-center mb-2">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-file me-2 icon-primary"></i>
|
||||
<span class="text-muted">{{ type.extension|upper }}:</span>
|
||||
</div>
|
||||
<div class="fw-bold text-primary">{{ type.count }}</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="text-muted small">No files in trash</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
@@ -2,6 +2,10 @@
|
||||
|
||||
{% block title %}Dashboard - DocuPulse{% endblock %}
|
||||
|
||||
{% block extra_css %}
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='css/dashboard.css') }}">
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<h2>Welcome back, {{ current_user.username }}!</h2>
|
||||
@@ -13,17 +17,13 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% macro format_size(size) %}
|
||||
{% if size < 1024 %}
|
||||
{{ size }} B
|
||||
{% elif size < 1024 * 1024 %}
|
||||
{{ (size / 1024)|round(1) }} KB
|
||||
{% elif size < 1024 * 1024 * 1024 %}
|
||||
{{ (size / (1024 * 1024))|round(1) }} MB
|
||||
{% else %}
|
||||
{{ (size / (1024 * 1024 * 1024))|round(1) }} GB
|
||||
{% endif %}
|
||||
{% endmacro %}
|
||||
{% from 'components/storage_overview.html' import storage_overview %}
|
||||
{% from 'components/storage_usage.html' import storage_usage %}
|
||||
{% from 'components/contacts.html' import contacts %}
|
||||
{% from 'components/contact_status.html' import contact_status %}
|
||||
{% from 'components/starred_files.html' import starred_files %}
|
||||
{% from 'components/trash.html' import trash %}
|
||||
{% from 'components/trash_type.html' import trash_type %}
|
||||
|
||||
<style>
|
||||
.masonry {
|
||||
@@ -44,303 +44,17 @@
|
||||
</style>
|
||||
|
||||
<div class="masonry">
|
||||
<div class="masonry-card">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<h5 class="card-title mb-0"><i class="fas fa-database me-2" style="color:#16767b;"></i>Storage Overview</h5>
|
||||
<a href="{{ url_for('rooms.rooms') }}" class="btn btn-sm text-white" style="background-color:#16767b;">Browse</a>
|
||||
</div>
|
||||
<div class="d-flex flex-column">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-door-open me-2" style="color:#16767b;"></i>
|
||||
<span class="text-muted">Rooms:</span>
|
||||
</div>
|
||||
<div class="fw-bold" style="color:#16767b;">{{ room_count }}</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-file me-2" style="color:#16767b;"></i>
|
||||
<span class="text-muted">Files:</span>
|
||||
</div>
|
||||
<div class="fw-bold" style="color:#16767b;">{{ file_count }}</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-folder me-2" style="color:#16767b;"></i>
|
||||
<span class="text-muted">Folders:</span>
|
||||
</div>
|
||||
<div class="fw-bold" style="color:#16767b;">{{ folder_count }}</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-hdd me-2" style="color:#16767b;"></i>
|
||||
<span class="text-muted">Total Size:</span>
|
||||
</div>
|
||||
<div class="fw-bold" style="color:#16767b;">{{ format_size(total_size) }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="masonry-card">
|
||||
<div class="card h-100">
|
||||
<div class="card-header bg-white border-0">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<h5 class="card-title mb-0"><i class="fas fa-history me-2" style="color:#16767b;"></i>Recent Activity</h5>
|
||||
<a href="{{ url_for('rooms.rooms') }}" class="btn btn-sm text-white" style="background-color:#16767b;">View All</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="list-group list-group-flush">
|
||||
{% for activity in recent_activity %}
|
||||
<div class="list-group-item px-0">
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="flex-shrink-0">
|
||||
{% if activity.type == 'folder' %}
|
||||
<i class="fas fa-folder me-2" style="color:#16767b;"></i>
|
||||
{% else %}
|
||||
<i class="fas fa-file me-2" style="color:#16767b;"></i>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="flex-grow-1 ms-3">
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<div>
|
||||
<div class="d-flex align-items-center mb-1">
|
||||
<h6 class="mb-0">{{ activity.name }}</h6>
|
||||
{% if activity.is_starred %}
|
||||
<span class="badge bg-warning text-dark ms-2" style="background-color: rgba(255,215,0,0.15) !important; color: #ffd700 !important;">
|
||||
<i class="fas fa-star me-1"></i>Starred
|
||||
</span>
|
||||
{% endif %}
|
||||
{% if activity.is_deleted %}
|
||||
<span class="badge bg-danger ms-2" style="background-color: rgba(220,53,69,0.15) !important; color: #dc3545 !important;">
|
||||
<i class="fas fa-trash me-1"></i>Trash
|
||||
</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
<small class="text-muted">
|
||||
{{ activity.room.name }} •
|
||||
{{ activity.uploader.username }} {{ activity.uploader.last_name }} •
|
||||
{% if activity.uploaded_at %}{{ activity.uploaded_at|timeago }}{% else %}Unknown{% endif %}
|
||||
</small>
|
||||
</div>
|
||||
{% if activity.type == 'file' and activity.can_download %}
|
||||
<a href="{{ url_for('room_files.download_room_file', room_id=activity.room.id, filename=activity.name, path=activity.path) }}"
|
||||
class="btn btn-sm text-white ms-2" style="background-color:#16767b; border-radius:6px; border:none; box-shadow:0 1px 2px rgba(22,118,123,0.08);" title="Download">
|
||||
<i class="fas fa-download"></i>
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="masonry-card">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<h5 class="card-title mb-0"><i class="fas fa-chart-pie me-2" style="color:#16767b;"></i>Storage Usage</h5>
|
||||
<a href="{{ url_for('rooms.rooms') }}" class="btn btn-sm text-white" style="background-color:#16767b;">View Details</a>
|
||||
</div>
|
||||
{% if storage_by_type %}
|
||||
<div class="position-relative" style="height: 200px;">
|
||||
<canvas id="storageChart"></canvas>
|
||||
</div>
|
||||
<div class="mt-3">
|
||||
{% for type in storage_by_type %}
|
||||
<div class="d-flex justify-content-between align-items-center mb-2">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-file me-2" style="color:#16767b;"></i>
|
||||
<span class="text-muted">{{ type.extension|upper }}:</span>
|
||||
</div>
|
||||
<div class="fw-bold" style="color:#16767b;">{{ format_size(type.total_size) }}</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="text-muted small">No storage data available</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{ storage_overview(room_count, file_count, folder_count, total_size) }}
|
||||
{{ storage_usage(storage_by_type) }}
|
||||
|
||||
{% if current_user.is_admin %}
|
||||
<div class="masonry-card">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<h5 class="card-title mb-0"><i class="fas fa-address-book me-2" style="color:#16767b;"></i>Recent Contacts</h5>
|
||||
<div>
|
||||
<a href="{{ url_for('contacts.contacts_list') }}" class="btn btn-sm text-white me-2" style="background-color:#16767b;">View All</a>
|
||||
<a href="{{ url_for('contacts.new_contact') }}" class="btn btn-sm text-white" style="background-color:#16767b;">+ Add</a>
|
||||
</div>
|
||||
</div>
|
||||
{% if recent_contacts %}
|
||||
<ul class="list-unstyled mb-3">
|
||||
{% for contact in recent_contacts %}
|
||||
<li class="mb-2">
|
||||
<div class="fw-semibold">{{ contact.first_name }} {{ contact.last_name }}</div>
|
||||
<div class="flex flex-wrap gap-2 mt-1">
|
||||
<a href="mailto:{{ contact.email }}"
|
||||
class="inline-flex items-center px-2 py-0.5 rounded text-sm font-normal transition duration-200 no-underline"
|
||||
style="background-color: rgba(22,118,123,0.08); color: #16767b;">
|
||||
<i class="fas fa-envelope mr-1" style="font-size: 0.85em; opacity: 0.7;"></i>{{ contact.email }}
|
||||
</a>
|
||||
{% if contact.phone %}
|
||||
<a href="tel:{{ contact.phone }}"
|
||||
class="inline-flex items-center px-2 py-0.5 rounded text-sm font-normal transition duration-200 no-underline"
|
||||
style="background-color: rgba(22,118,123,0.08); color: #16767b;">
|
||||
<i class="fas fa-phone mr-1" style="font-size: 0.85em; opacity: 0.7;"></i>{{ contact.phone }}
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<div class="text-muted small">No contacts yet.</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="masonry-card">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<h5 class="card-title mb-0"><i class="fas fa-chart-pie me-2" style="color:#16767b;"></i>Contact Status</h5>
|
||||
<div>
|
||||
<a href="{{ url_for('contacts.contacts_list') }}" class="btn btn-sm text-white me-2" style="background-color:#16767b;">View All</a>
|
||||
<a href="{{ url_for('contacts.new_contact') }}" class="btn btn-sm text-white" style="background-color:#16767b;">+ Add</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="position-relative" style="height: 200px;">
|
||||
<canvas id="statusChart"></canvas>
|
||||
</div>
|
||||
<div class="d-flex justify-content-center gap-4 mt-3">
|
||||
<div class="text-center">
|
||||
<div class="fw-bold" style="color:#16767b; font-size:1.5rem;">{{ active_count }}</div>
|
||||
<div class="text-muted small">Active</div>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<div class="fw-bold" style="color:#741b5f; font-size:1.5rem;">{{ inactive_count }}</div>
|
||||
<div class="text-muted small">Inactive</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{ contacts(recent_contacts) }}
|
||||
{{ contact_status(active_count, inactive_count) }}
|
||||
{% endif %}
|
||||
|
||||
<div class="masonry-card">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<h5 class="card-title mb-0"><i class="fas fa-star me-2" style="color:#16767b;"></i>Starred Files</h5>
|
||||
<a href="{{ url_for('main.starred') }}" class="btn btn-sm text-white" style="background-color:#16767b;">View All</a>
|
||||
</div>
|
||||
<div class="position-relative" style="height: 200px;">
|
||||
<canvas id="starredChart"></canvas>
|
||||
</div>
|
||||
<div class="d-flex justify-content-center gap-4 mt-3">
|
||||
<div class="text-center">
|
||||
<div class="fw-bold" style="color:#ffd700; font-size:1.5rem;">{{ starred_count }}</div>
|
||||
<div class="text-muted small">Starred</div>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<div class="fw-bold" style="color:#16767b; font-size:1.5rem;">{{ file_count - starred_count }}</div>
|
||||
<div class="text-muted small">Unstarred</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="masonry-card">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<h5 class="card-title mb-0"><i class="fas fa-trash me-2" style="color:#16767b;"></i>Trash</h5>
|
||||
<a href="{{ url_for('main.trash') }}" class="btn btn-sm text-white" style="background-color:#16767b;">View All</a>
|
||||
</div>
|
||||
<div class="d-flex flex-column">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-file me-2" style="color:#16767b;"></i>
|
||||
<span class="text-muted">Files in trash:</span>
|
||||
</div>
|
||||
<div class="fw-bold" style="color:#16767b;">{{ trash_count }}</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-exclamation-triangle me-2" style="color:#dc3545;"></i>
|
||||
<span class="text-muted">Deleting in 7 days:</span>
|
||||
</div>
|
||||
<div class="fw-bold" style="color:#dc3545;">{{ pending_deletion }}</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-clock me-2" style="color:#16767b;"></i>
|
||||
<span class="text-muted">Oldest deletion:</span>
|
||||
</div>
|
||||
<div class="fw-bold" style="color:#16767b;">{{ oldest_trash_date|default('N/A') }}</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-hdd me-2" style="color:#16767b;"></i>
|
||||
<span class="text-muted">Storage used:</span>
|
||||
</div>
|
||||
<div class="fw-bold" style="color:#16767b;">{{ format_size(trash_size) }}</div>
|
||||
</div>
|
||||
<div class="alert alert-info mb-0">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-info-circle me-2"></i>
|
||||
<div>
|
||||
<div class="fw-bold mb-1">Files will be permanently deleted after 30 days</div>
|
||||
<div class="small">You can restore files before they are permanently deleted</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="masonry-card">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<h5 class="card-title mb-0"><i class="fas fa-file-alt me-2" style="color:#16767b;"></i>Trash by Type</h5>
|
||||
<a href="{{ url_for('main.trash') }}" class="btn btn-sm text-white" style="background-color:#16767b;">View All</a>
|
||||
</div>
|
||||
{% if trash_by_type %}
|
||||
<div class="position-relative" style="height: 200px;">
|
||||
<canvas id="trashTypeChart"></canvas>
|
||||
</div>
|
||||
<div class="mt-3">
|
||||
{% for type in trash_by_type %}
|
||||
<div class="d-flex justify-content-between align-items-center mb-2">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-file me-2" style="color:#16767b;"></i>
|
||||
<span class="text-muted">{{ type.extension|upper }}:</span>
|
||||
</div>
|
||||
<div class="fw-bold" style="color:#16767b;">{{ type.count }}</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="text-muted small">No files in trash</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{ starred_files(starred_count, file_count) }}
|
||||
{{ trash(trash_count, pending_deletion, oldest_trash_date, trash_size) }}
|
||||
{{ trash_type(trash_by_type) }}
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
11
templates/macros.html
Normal file
11
templates/macros.html
Normal file
@@ -0,0 +1,11 @@
|
||||
{% macro format_size(size) %}
|
||||
{% if size < 1024 %}
|
||||
{{ size }} B
|
||||
{% elif size < 1024 * 1024 %}
|
||||
{{ (size / 1024)|round(1) }} KB
|
||||
{% elif size < 1024 * 1024 * 1024 %}
|
||||
{{ (size / (1024 * 1024))|round(1) }} MB
|
||||
{% else %}
|
||||
{{ (size / (1024 * 1024 * 1024))|round(1) }} GB
|
||||
{% endif %}
|
||||
{% endmacro %}
|
||||
Reference in New Issue
Block a user