Move SLM control center groundwork onto dev

This commit is contained in:
serversdwn
2026-01-12 18:07:26 +00:00
parent 893cb96e8d
commit 8a5fadb5df
22 changed files with 3960 additions and 29 deletions

View File

@@ -0,0 +1,108 @@
<!-- Project Dashboard -->
<div class="bg-white dark:bg-slate-800 rounded-xl shadow-lg p-6 mb-6">
<div class="flex flex-col md:flex-row md:items-start md:justify-between gap-4">
<div>
<h2 class="text-2xl font-semibold text-gray-900 dark:text-white">{{ project.name }}</h2>
<p class="text-sm text-gray-500 dark:text-gray-400 mt-1">
{% if project_type %}
{{ project_type.name }}
{% else %}
Project
{% endif %}
</p>
</div>
{% if project.status == 'active' %}
<span class="px-3 py-1 text-xs font-medium bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-300 rounded-full">Active</span>
{% elif project.status == 'completed' %}
<span class="px-3 py-1 text-xs font-medium bg-blue-100 text-blue-800 dark:bg-blue-900/30 dark:text-blue-300 rounded-full">Completed</span>
{% elif project.status == 'archived' %}
<span class="px-3 py-1 text-xs font-medium bg-gray-200 text-gray-700 dark:bg-gray-700 dark:text-gray-300 rounded-full">Archived</span>
{% endif %}
</div>
{% if project.description %}
<p class="text-gray-600 dark:text-gray-400 mt-4 max-w-3xl">{{ project.description }}</p>
{% endif %}
<div class="grid grid-cols-2 md:grid-cols-4 gap-4 mt-6">
<div class="bg-gray-50 dark:bg-gray-900 rounded-lg p-4">
<p class="text-xs text-gray-500 dark:text-gray-400">Locations</p>
<p class="text-2xl font-semibold text-gray-900 dark:text-white">{{ locations | length }}</p>
</div>
<div class="bg-gray-50 dark:bg-gray-900 rounded-lg p-4">
<p class="text-xs text-gray-500 dark:text-gray-400">Assigned Units</p>
<p class="text-2xl font-semibold text-gray-900 dark:text-white">{{ assigned_units | length }}</p>
</div>
<div class="bg-gray-50 dark:bg-gray-900 rounded-lg p-4">
<p class="text-xs text-gray-500 dark:text-gray-400">Active Sessions</p>
<p class="text-2xl font-semibold text-gray-900 dark:text-white">{{ active_sessions | length }}</p>
</div>
<div class="bg-gray-50 dark:bg-gray-900 rounded-lg p-4">
<p class="text-xs text-gray-500 dark:text-gray-400">Completed Sessions</p>
<p class="text-2xl font-semibold text-gray-900 dark:text-white">{{ completed_sessions_count }}</p>
</div>
</div>
</div>
<div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
<div class="bg-white dark:bg-slate-800 rounded-xl shadow-lg p-6">
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">Locations</h3>
{% if locations %}
<div class="space-y-3">
{% for location in locations %}
<div class="border border-gray-200 dark:border-gray-700 rounded-lg p-3">
<p class="font-medium text-gray-900 dark:text-white">{{ location.name }}</p>
{% if location.address %}
<p class="text-xs text-gray-500 dark:text-gray-400 mt-1">{{ location.address }}</p>
{% endif %}
{% if location.coordinates %}
<p class="text-xs text-gray-500 dark:text-gray-400 mt-1">{{ location.coordinates }}</p>
{% endif %}
</div>
{% endfor %}
</div>
{% else %}
<p class="text-sm text-gray-500 dark:text-gray-400">No locations added yet.</p>
{% endif %}
</div>
<div class="bg-white dark:bg-slate-800 rounded-xl shadow-lg p-6">
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">Assigned Units</h3>
{% if assigned_units %}
<div class="space-y-3">
{% for item in assigned_units %}
<a href="/slm/{{ item.unit.id }}" class="block border border-gray-200 dark:border-gray-700 rounded-lg p-3 hover:border-seismo-orange transition-colors">
<p class="font-medium text-gray-900 dark:text-white">{{ item.unit.id }}</p>
{% if item.unit.slm_model %}
<p class="text-xs text-gray-500 dark:text-gray-400 mt-1">{{ item.unit.slm_model }}</p>
{% endif %}
{% if item.unit.address %}
<p class="text-xs text-gray-500 dark:text-gray-400 mt-1">{{ item.unit.address }}</p>
{% endif %}
</a>
{% endfor %}
</div>
{% else %}
<p class="text-sm text-gray-500 dark:text-gray-400">No units assigned yet.</p>
{% endif %}
</div>
<div class="bg-white dark:bg-slate-800 rounded-xl shadow-lg p-6">
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">Upcoming Actions</h3>
{% if upcoming_actions %}
<div class="space-y-3">
{% for action in upcoming_actions %}
<div class="border border-gray-200 dark:border-gray-700 rounded-lg p-3">
<p class="font-medium text-gray-900 dark:text-white">{{ action.action_type }}</p>
<p class="text-xs text-gray-500 dark:text-gray-400 mt-1">{{ action.scheduled_time.strftime('%Y-%m-%d %H:%M') }}</p>
{% if action.description %}
<p class="text-xs text-gray-500 dark:text-gray-400 mt-1">{{ action.description }}</p>
{% endif %}
</div>
{% endfor %}
</div>
{% else %}
<p class="text-sm text-gray-500 dark:text-gray-400">No scheduled actions.</p>
{% endif %}
</div>
</div>

View File

@@ -0,0 +1,97 @@
<!-- Project List Grid -->
{% if projects %}
{% for item in projects %}
<div class="bg-white dark:bg-slate-800 rounded-xl shadow-lg hover:shadow-xl transition-shadow">
<a href="/projects/{{ item.project.id }}" class="block p-6">
<!-- Project Header -->
<div class="flex items-start justify-between mb-4">
<div class="flex-1">
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-1">
{{ item.project.name }}
</h3>
<p class="text-sm text-gray-500 dark:text-gray-400 flex items-center">
{% if item.project_type %}
{% if item.project_type.id == 'sound_monitoring' %}
<svg class="w-4 h-4 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.536 8.464a5 5 0 010 7.072m2.828-9.9a9 9 0 010 12.728M5.586 15H4a1 1 0 01-1-1v-4a1 1 0 011-1h1.586l4.707-4.707C10.923 3.663 12 4.109 12 5v14c0 .891-1.077 1.337-1.707.707L5.586 15z"></path>
</svg>
{% elif item.project_type.id == 'vibration_monitoring' %}
<svg class="w-4 h-4 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"></path>
</svg>
{% else %}
<svg class="w-4 h-4 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4 13a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6zM16 13a1 1 0 011-1h2a1 1 0 011 1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-6z"></path>
</svg>
{% endif %}
{{ item.project_type.name }}
{% endif %}
</p>
</div>
<!-- Status Badge -->
{% if item.project.status == 'active' %}
<span class="px-2 py-1 text-xs font-medium bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-400 rounded-full">
Active
</span>
{% elif item.project.status == 'completed' %}
<span class="px-2 py-1 text-xs font-medium bg-blue-100 text-blue-800 dark:bg-blue-900/30 dark:text-blue-400 rounded-full">
Completed
</span>
{% elif item.project.status == 'archived' %}
<span class="px-2 py-1 text-xs font-medium bg-gray-100 text-gray-800 dark:bg-gray-700 dark:text-gray-400 rounded-full">
Archived
</span>
{% endif %}
</div>
<!-- Project Description -->
{% if item.project.description %}
<p class="text-sm text-gray-600 dark:text-gray-400 mb-4 line-clamp-2">
{{ item.project.description }}
</p>
{% endif %}
<!-- Project Stats -->
<div class="grid grid-cols-3 gap-4 pt-4 border-t border-gray-200 dark:border-gray-700">
<div>
<p class="text-xs text-gray-500 dark:text-gray-400">Locations</p>
<p class="text-lg font-semibold text-gray-900 dark:text-white">{{ item.location_count }}</p>
</div>
<div>
<p class="text-xs text-gray-500 dark:text-gray-400">Units</p>
<p class="text-lg font-semibold text-gray-900 dark:text-white">{{ item.unit_count }}</p>
</div>
<div>
<p class="text-xs text-gray-500 dark:text-gray-400">Active</p>
<p class="text-lg font-semibold text-gray-900 dark:text-white">
{% if item.active_session_count > 0 %}
<span class="text-green-600 dark:text-green-400">{{ item.active_session_count }}</span>
{% else %}
{{ item.active_session_count }}
{% endif %}
</p>
</div>
</div>
<!-- Client Info -->
{% if item.project.client_name %}
<div class="mt-3 pt-3 border-t border-gray-200 dark:border-gray-700">
<p class="text-xs text-gray-500 dark:text-gray-400">
Client: <span class="font-medium text-gray-700 dark:text-gray-300">{{ item.project.client_name }}</span>
</p>
</div>
{% endif %}
</a>
</div>
{% endfor %}
{% else %}
<!-- Empty State -->
<div class="col-span-full flex flex-col items-center justify-center py-12 text-gray-400 dark:text-gray-500">
<svg class="w-16 h-16 mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2-2v-5m16 0h-2.586a1 1 0 00-.707.293l-2.414 2.414a1 1 0 01-.707.293h-3.172a1 1 0 01-.707-.293l-2.414-2.414A1 1 0 006.586 13H4"></path>
</svg>
<p class="text-lg font-medium">No projects found</p>
<p class="text-sm mt-1">Create your first project to get started</p>
</div>
{% endif %}

View File

@@ -0,0 +1,41 @@
<!-- Compact Project List -->
{% if projects %}
{% for item in projects %}
<a href="/projects/{{ item.project.id }}" class="block bg-gray-50 dark:bg-gray-800 rounded-lg p-4 border border-transparent hover:border-seismo-orange transition-colors">
<div class="flex items-start justify-between gap-4">
<div class="min-w-0">
<h3 class="text-base font-semibold text-gray-900 dark:text-white truncate">
{{ item.project.name }}
</h3>
{% if item.project.client_name %}
<p class="text-xs text-gray-500 dark:text-gray-400 mt-1">
Client: {{ item.project.client_name }}
</p>
{% endif %}
</div>
{% if item.project.status == 'active' %}
<span class="shrink-0 px-2 py-1 text-xs font-medium bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-300 rounded-full">Active</span>
{% elif item.project.status == 'completed' %}
<span class="shrink-0 px-2 py-1 text-xs font-medium bg-blue-100 text-blue-800 dark:bg-blue-900/30 dark:text-blue-300 rounded-full">Completed</span>
{% elif item.project.status == 'archived' %}
<span class="shrink-0 px-2 py-1 text-xs font-medium bg-gray-200 text-gray-700 dark:bg-gray-700 dark:text-gray-300 rounded-full">Archived</span>
{% endif %}
</div>
<div class="mt-3 flex flex-wrap gap-3 text-xs text-gray-600 dark:text-gray-400">
<span>{{ item.location_count }} locations</span>
<span>{{ item.unit_count }} units</span>
<span>{{ item.active_session_count }} active</span>
</div>
</a>
{% endfor %}
{% else %}
<div class="text-center py-8 text-gray-500 dark:text-gray-400">
<svg class="w-12 h-12 mx-auto mb-3 opacity-50" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2-2v-5m16 0h-2.586a1 1 0 00-.707.293l-2.414 2.414a1 1 0 01-.707.293h-3.172a1 1 0 01-.707-.293l-2.414-2.414A1 1 0 006.586 13H4"></path>
</svg>
<p>No active sound monitoring projects</p>
<p class="text-sm mt-1">Create a project to get started</p>
</div>
{% endif %}

View File

@@ -0,0 +1,58 @@
<!-- Project Statistics Cards -->
<div class="bg-white dark:bg-slate-800 rounded-xl shadow-lg p-6">
<div class="flex items-center justify-between">
<div>
<p class="text-sm text-gray-500 dark:text-gray-400">Total Projects</p>
<p class="text-3xl font-bold text-gray-900 dark:text-white">{{ total_projects }}</p>
</div>
<div class="p-3 bg-seismo-orange/10 rounded-lg">
<svg class="w-8 h-8 text-seismo-orange" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10"></path>
</svg>
</div>
</div>
</div>
<div class="bg-white dark:bg-slate-800 rounded-xl shadow-lg p-6">
<div class="flex items-center justify-between">
<div>
<p class="text-sm text-gray-500 dark:text-gray-400">Active Projects</p>
<p class="text-3xl font-bold text-green-600 dark:text-green-400">{{ active_projects }}</p>
</div>
<div class="p-3 bg-green-100 dark:bg-green-900/30 rounded-lg">
<svg class="w-8 h-8 text-green-600 dark:text-green-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
</div>
</div>
</div>
<div class="bg-white dark:bg-slate-800 rounded-xl shadow-lg p-6">
<div class="flex items-center justify-between">
<div>
<p class="text-sm text-gray-500 dark:text-gray-400">Total Locations</p>
<p class="text-3xl font-bold text-gray-900 dark:text-white">{{ total_locations }}</p>
</div>
<div class="p-3 bg-blue-100 dark:bg-blue-900/30 rounded-lg">
<svg class="w-8 h-8 text-blue-600 dark:text-blue-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z"></path>
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 11a3 3 0 11-6 0 3 3 0 016 0z"></path>
</svg>
</div>
</div>
</div>
<div class="bg-white dark:bg-slate-800 rounded-xl shadow-lg p-6">
<div class="flex items-center justify-between">
<div>
<p class="text-sm text-gray-500 dark:text-gray-400">Active Sessions</p>
<p class="text-3xl font-bold text-gray-900 dark:text-white">{{ active_sessions }}</p>
</div>
<div class="p-3 bg-purple-100 dark:bg-purple-900/30 rounded-lg">
<svg class="w-8 h-8 text-purple-600 dark:text-purple-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"></path>
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z"></path>
</svg>
</div>
</div>
</div>

View File

@@ -0,0 +1,58 @@
<!-- Project Type Selection Cards -->
{% for pt in project_types %}
<button onclick="selectProjectType('{{ pt.id }}', '{{ pt.name }}')"
class="bg-white dark:bg-slate-700 hover:bg-gray-50 dark:hover:bg-slate-600 border-2 border-gray-200 dark:border-gray-600 hover:border-seismo-orange rounded-lg p-6 text-left transition-all">
<!-- Icon -->
<div class="mb-4">
{% if pt.id == 'sound_monitoring' %}
<div class="w-12 h-12 bg-seismo-orange/10 rounded-lg flex items-center justify-center">
<svg class="w-6 h-6 text-seismo-orange" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.536 8.464a5 5 0 010 7.072m2.828-9.9a9 9 0 010 12.728M5.586 15H4a1 1 0 01-1-1v-4a1 1 0 011-1h1.586l4.707-4.707C10.923 3.663 12 4.109 12 5v14c0 .891-1.077 1.337-1.707.707L5.586 15z"></path>
</svg>
</div>
{% elif pt.id == 'vibration_monitoring' %}
<div class="w-12 h-12 bg-blue-100 dark:bg-blue-900/30 rounded-lg flex items-center justify-center">
<svg class="w-6 h-6 text-blue-600 dark:text-blue-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"></path>
</svg>
</div>
{% elif pt.id == 'combined' %}
<div class="w-12 h-12 bg-purple-100 dark:bg-purple-900/30 rounded-lg flex items-center justify-center">
<svg class="w-6 h-6 text-purple-600 dark:text-purple-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4 13a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6zM16 13a1 1 0 011-1h2a1 1 0 011 1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-6z"></path>
</svg>
</div>
{% endif %}
</div>
<!-- Title -->
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-2">
{{ pt.name }}
</h3>
<!-- Description -->
<p class="text-sm text-gray-600 dark:text-gray-400 mb-4">
{{ pt.description }}
</p>
<!-- Features -->
<div class="space-y-1">
{% if pt.supports_sound %}
<div class="flex items-center text-xs text-gray-500 dark:text-gray-400">
<svg class="w-4 h-4 mr-2 text-green-500" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
Sound Level Meters
</div>
{% endif %}
{% if pt.supports_vibration %}
<div class="flex items-center text-xs text-gray-500 dark:text-gray-400">
<svg class="w-4 h-4 mr-2 text-green-500" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
Seismographs
</div>
{% endif %}
</div>
</button>
{% endfor %}