reworked dashboard
This commit is contained in:
Binary file not shown.
@@ -5,6 +5,18 @@ import os
|
||||
from werkzeug.utils import secure_filename
|
||||
from sqlalchemy import func, case, literal_column, text
|
||||
from datetime import datetime, timedelta
|
||||
import logging
|
||||
import sys
|
||||
|
||||
# Set up logging to show in console
|
||||
logging.basicConfig(
|
||||
level=logging.DEBUG,
|
||||
format='%(asctime)s - %(name)s - %(levelname)s - %(message)s',
|
||||
handlers=[
|
||||
logging.StreamHandler(sys.stdout)
|
||||
]
|
||||
)
|
||||
logger = logging.getLogger(__name__)
|
||||
|
||||
def init_routes(main_bp):
|
||||
@main_bp.route('/')
|
||||
@@ -16,6 +28,7 @@ def init_routes(main_bp):
|
||||
@main_bp.route('/dashboard')
|
||||
@login_required
|
||||
def dashboard():
|
||||
logger.info("Loading dashboard...")
|
||||
# Get 3 most recent users
|
||||
recent_contacts = User.query.order_by(User.created_at.desc()).limit(3).all()
|
||||
# Count active and inactive users
|
||||
@@ -24,10 +37,13 @@ def init_routes(main_bp):
|
||||
|
||||
# Room count and size logic
|
||||
if current_user.is_admin:
|
||||
logger.info("Loading admin dashboard...")
|
||||
room_count = Room.query.count()
|
||||
# Get total file and folder counts for admin
|
||||
file_count = RoomFile.query.filter_by(type='file').count()
|
||||
folder_count = RoomFile.query.filter_by(type='folder').count()
|
||||
logger.info(f"Admin stats - Files: {file_count}, Folders: {folder_count}")
|
||||
|
||||
# Get total size of all files including trash
|
||||
total_size = db.session.query(func.sum(RoomFile.size)).filter(RoomFile.type == 'file').scalar() or 0
|
||||
# Get recent activity for all files
|
||||
@@ -39,10 +55,21 @@ def init_routes(main_bp):
|
||||
Room, RoomFile.room_id == Room.id
|
||||
).join(
|
||||
User, RoomFile.uploaded_by == User.id
|
||||
).filter(
|
||||
RoomFile.deleted == False,
|
||||
RoomFile.uploaded_at.isnot(None)
|
||||
).order_by(
|
||||
RoomFile.uploaded_at.desc()
|
||||
).limit(10).all()
|
||||
|
||||
logger.info(f"Recent activity query results: {len(recent_activity)}")
|
||||
if len(recent_activity) == 0:
|
||||
# Debug query to see what files exist
|
||||
all_files = RoomFile.query.filter_by(deleted=False).all()
|
||||
logger.info(f"Total non-deleted files: {len(all_files)}")
|
||||
for file in all_files[:5]: # Log first 5 files for debugging
|
||||
logger.info(f"File: {file.name}, Uploaded: {file.uploaded_at}, Type: {file.type}")
|
||||
|
||||
# Format the activity data
|
||||
formatted_activity = []
|
||||
for file, room, user in recent_activity:
|
||||
@@ -57,7 +84,8 @@ def init_routes(main_bp):
|
||||
'can_download': True # Admin can download everything
|
||||
}
|
||||
formatted_activity.append(activity)
|
||||
recent_activity = formatted_activity
|
||||
formatted_activities = formatted_activity
|
||||
logger.info(f"Formatted activities: {len(formatted_activities)}")
|
||||
# Get storage usage by file type including trash
|
||||
storage_by_type = db.session.query(
|
||||
case(
|
||||
@@ -122,11 +150,24 @@ def init_routes(main_bp):
|
||||
).join(
|
||||
User, RoomFile.uploaded_by == User.id
|
||||
).filter(
|
||||
RoomFile.room_id.in_(room_ids)
|
||||
RoomFile.room_id.in_(room_ids),
|
||||
RoomFile.deleted == False,
|
||||
RoomFile.uploaded_at.isnot(None) # Ensure uploaded_at is not null
|
||||
).order_by(
|
||||
RoomFile.uploaded_at.desc()
|
||||
).limit(10).all()
|
||||
|
||||
logger.info(f"Recent activity query results (non-admin): {len(recent_activity)}")
|
||||
if len(recent_activity) == 0:
|
||||
# Debug query to see what files exist
|
||||
all_files = RoomFile.query.filter(
|
||||
RoomFile.room_id.in_(room_ids),
|
||||
RoomFile.deleted == False
|
||||
).all()
|
||||
logger.info(f"Total non-deleted files in accessible rooms: {len(all_files)}")
|
||||
for file in all_files[:5]: # Log first 5 files for debugging
|
||||
logger.info(f"File: {file.name}, Uploaded: {file.uploaded_at}, Type: {file.type}")
|
||||
|
||||
# Format the activity data
|
||||
formatted_activity = []
|
||||
user_perms = {p.room_id: p for p in RoomMemberPermission.query.filter(
|
||||
@@ -147,7 +188,7 @@ def init_routes(main_bp):
|
||||
'can_download': perm.can_download if perm else False
|
||||
}
|
||||
formatted_activity.append(activity)
|
||||
recent_activity = formatted_activity
|
||||
formatted_activities = formatted_activity
|
||||
# Get storage usage by file type for accessible rooms including trash
|
||||
storage_by_type = db.session.query(
|
||||
case(
|
||||
@@ -204,7 +245,6 @@ def init_routes(main_bp):
|
||||
file_count=file_count,
|
||||
folder_count=folder_count,
|
||||
total_size=total_size,
|
||||
recent_activity=recent_activity,
|
||||
storage_by_type=storage_by_type,
|
||||
trash_count=trash_count,
|
||||
starred_count=starred_count,
|
||||
|
||||
139
static/css/dashboard.css
Normal file
139
static/css/dashboard.css
Normal file
@@ -0,0 +1,139 @@
|
||||
:root {
|
||||
--primary-color: #16767b;
|
||||
--secondary-color: #741b5f;
|
||||
--primary-light: #1a8a90;
|
||||
--secondary-light: #8a2170;
|
||||
--warning-color: #ffd700;
|
||||
--danger-color: #dc3545;
|
||||
}
|
||||
|
||||
/* Masonry Layout */
|
||||
.masonry {
|
||||
column-count: 1;
|
||||
column-gap: 1.5rem;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.masonry { column-count: 2; }
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.masonry { column-count: 3; }
|
||||
}
|
||||
|
||||
.masonry-card {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
/* Card Styles */
|
||||
.card {
|
||||
border: none;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.card-title {
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.card-title i {
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
/* Button Styles */
|
||||
.btn-primary {
|
||||
background-color: var(--primary-color);
|
||||
border-color: var(--primary-color);
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
background-color: var(--primary-light);
|
||||
border-color: var(--primary-light);
|
||||
}
|
||||
|
||||
/* Icon Colors */
|
||||
.icon-primary {
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.icon-danger {
|
||||
color: var(--danger-color);
|
||||
}
|
||||
|
||||
.icon-warning {
|
||||
color: var(--warning-color);
|
||||
}
|
||||
|
||||
/* Text Colors */
|
||||
.text-primary {
|
||||
color: var(--primary-color) !important;
|
||||
}
|
||||
|
||||
.text-danger {
|
||||
color: var(--danger-color) !important;
|
||||
}
|
||||
|
||||
/* Badge Styles */
|
||||
.badge-starred {
|
||||
background-color: rgba(255, 215, 0, 0.15) !important;
|
||||
color: var(--warning-color) !important;
|
||||
}
|
||||
|
||||
.badge-trash {
|
||||
background-color: rgba(220, 53, 69, 0.15) !important;
|
||||
color: var(--danger-color) !important;
|
||||
}
|
||||
|
||||
/* Contact Link Styles */
|
||||
.contact-link {
|
||||
background-color: rgba(22, 118, 123, 0.08);
|
||||
color: var(--primary-color);
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.contact-link:hover {
|
||||
background-color: rgba(22, 118, 123, 0.12);
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
/* Chart Container */
|
||||
.chart-container {
|
||||
position: relative;
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
/* Alert Styles */
|
||||
.alert-info {
|
||||
background-color: rgba(22, 118, 123, 0.08);
|
||||
border-color: rgba(22, 118, 123, 0.2);
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
/* List Group Styles */
|
||||
.list-group-item {
|
||||
border: none;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.list-group-item:not(:last-child) {
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
/* Download Button */
|
||||
.btn-download {
|
||||
background-color: var(--primary-color);
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 1px 2px rgba(22, 118, 123, 0.08);
|
||||
color: white;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.btn-download:hover {
|
||||
background-color: var(--primary-light);
|
||||
color: white;
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 2px 4px rgba(22, 118, 123, 0.12);
|
||||
}
|
||||
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