시골약사
ca61a89739
## Features - 한국어 Flask 관리 인터페이스 with Bootstrap 5 - Headscale과 분리된 독립 데이터베이스 구조 - 약국 관리 시스템 (pharmacy management) - 머신 모니터링 및 상태 관리 - 실시간 대시보드 with 통계 및 알림 - Headscale 사용자명과 약국명 분리 관리 ## Database Architecture - 별도 FARMQ SQLite DB (farmq.sqlite) - Headscale DB와 외래키 충돌 방지 - 느슨한 결합 설계 (ID 참조만 사용) ## UI Components - 반응형 대시보드 with 실시간 통계 - 약국별 머신 상태 모니터링 - 한국어 지역화 및 사용자 친화적 인터페이스 - 머신 온라인/오프라인 상태 표시 (24시간 타임아웃) ## API Endpoints - `/api/sync/machines` - Headscale 머신 동기화 - `/api/sync/users` - Headscale 사용자 동기화 - `/api/pharmacy/<id>/update` - 약국 정보 업데이트 - 대시보드 통계 및 알림 API ## Problem Resolution - Fixed foreign key conflicts preventing Windows client connections - Resolved machine online status detection with proper timeout handling - Separated technical Headscale usernames from business pharmacy names 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
238 lines
12 KiB
HTML
238 lines
12 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}약국 관리 - 팜큐 약국 관리 시스템{% endblock %}
|
|
|
|
{% block breadcrumb %}
|
|
<nav aria-label="breadcrumb">
|
|
<ol class="breadcrumb">
|
|
<li class="breadcrumb-item"><a href="{{ url_for('dashboard') }}">대시보드</a></li>
|
|
<li class="breadcrumb-item active">약국 관리</li>
|
|
</ol>
|
|
</nav>
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="row mb-4">
|
|
<div class="col-12">
|
|
<div class="d-flex justify-content-between align-items-center">
|
|
<div>
|
|
<h1 class="h2 mb-0">
|
|
<i class="fas fa-store text-primary"></i>
|
|
약국 관리
|
|
</h1>
|
|
<p class="text-muted">등록된 약국 정보 및 연결 상태 관리</p>
|
|
</div>
|
|
<button class="btn btn-primary" onclick="showAddModal()">
|
|
<i class="fas fa-plus"></i> 새 약국 등록
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<div class="card">
|
|
<div class="card-body">
|
|
{% if pharmacies %}
|
|
<div class="table-responsive">
|
|
<table class="table table-hover">
|
|
<thead class="table-light">
|
|
<tr>
|
|
<th>약국 정보</th>
|
|
<th>담당자</th>
|
|
<th>연결된 머신</th>
|
|
<th>네트워크 상태</th>
|
|
<th>액션</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for pharmacy_data in pharmacies %}
|
|
<tr>
|
|
<td>
|
|
<div>
|
|
<strong class="d-block">{{ pharmacy_data.pharmacy_name }}</strong>
|
|
<small class="text-muted">{{ pharmacy_data.business_number }}</small>
|
|
<div class="small mt-1">
|
|
<code class="text-primary">{{ pharmacy_data.headscale_user_name }}</code>
|
|
</div>
|
|
</div>
|
|
<div class="small text-muted mt-1">
|
|
<i class="fas fa-map-marker-alt"></i> {{ pharmacy_data.address or '주소 미등록' }}
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<div>
|
|
<strong>{{ pharmacy_data.manager_name or '미등록' }}</strong>
|
|
</div>
|
|
<div class="small text-muted">
|
|
<i class="fas fa-phone"></i> {{ pharmacy_data.phone or '연락처 미등록' }}
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<div class="d-flex align-items-center">
|
|
<span class="badge bg-info me-2">{{ pharmacy_data.machine_count }}대</span>
|
|
<div class="progress" style="width: 60px; height: 8px;">
|
|
<div class="progress-bar bg-success"
|
|
style="width: {{ (pharmacy_data.online_count / pharmacy_data.machine_count * 100) if pharmacy_data.machine_count > 0 else 0 }}%"
|
|
title="{{ pharmacy_data.online_count }}/{{ pharmacy_data.machine_count }} 온라인"></div>
|
|
</div>
|
|
</div>
|
|
<div class="small text-muted">
|
|
온라인: {{ pharmacy_data.online_count }} / 오프라인: {{ pharmacy_data.offline_count }}
|
|
</div>
|
|
</td>
|
|
<td>
|
|
{% if pharmacy_data.online_count == pharmacy_data.machine_count and pharmacy_data.machine_count > 0 %}
|
|
<span class="badge bg-success">
|
|
<i class="fas fa-check-circle"></i> 모든 머신 온라인
|
|
</span>
|
|
{% elif pharmacy_data.online_count > 0 %}
|
|
<span class="badge bg-warning">
|
|
<i class="fas fa-exclamation-triangle"></i> 부분적 연결
|
|
</span>
|
|
{% elif pharmacy_data.machine_count > 0 %}
|
|
<span class="badge bg-danger">
|
|
<i class="fas fa-times-circle"></i> 전체 오프라인
|
|
</span>
|
|
{% else %}
|
|
<span class="badge bg-secondary">
|
|
<i class="fas fa-question-circle"></i> 머신 없음
|
|
</span>
|
|
{% endif %}
|
|
</td>
|
|
<td>
|
|
<div class="btn-group btn-group-sm">
|
|
<a href="{{ url_for('pharmacy_detail', pharmacy_id=pharmacy_data.id) }}"
|
|
class="btn btn-outline-primary" title="상세 정보">
|
|
<i class="fas fa-eye"></i>
|
|
</a>
|
|
<button class="btn btn-outline-warning"
|
|
onclick="showEditModal({{ pharmacy_data.id }})" title="수정">
|
|
<i class="fas fa-edit"></i>
|
|
</button>
|
|
<button class="btn btn-outline-info" title="모니터링">
|
|
<i class="fas fa-chart-line"></i>
|
|
</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
{% else %}
|
|
<div class="text-center text-muted py-5">
|
|
<i class="fas fa-store fa-4x mb-4 text-secondary"></i>
|
|
<h4>등록된 약국이 없습니다</h4>
|
|
<p class="mb-4">첫 번째 약국을 등록하여 시작해보세요.</p>
|
|
<button class="btn btn-primary btn-lg" onclick="showAddModal()">
|
|
<i class="fas fa-plus"></i> 첫 번째 약국 등록
|
|
</button>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 약국 등록/수정 모달 -->
|
|
<div class="modal fade" id="pharmacyModal" tabindex="-1">
|
|
<div class="modal-dialog modal-lg">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" id="pharmacyModalTitle">
|
|
<i class="fas fa-store"></i> 약국 정보
|
|
</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form id="pharmacyForm">
|
|
<div class="modal-body">
|
|
<div class="row">
|
|
<div class="col-md-6 mb-3">
|
|
<label for="pharmacy_name" class="form-label">약국명 <span class="text-danger">*</span></label>
|
|
<input type="text" class="form-control" id="pharmacy_name" required>
|
|
</div>
|
|
<div class="col-md-6 mb-3">
|
|
<label for="business_number" class="form-label">사업자번호</label>
|
|
<input type="text" class="form-control" id="business_number" placeholder="000-00-00000">
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-6 mb-3">
|
|
<label for="manager_name" class="form-label">담당자명</label>
|
|
<input type="text" class="form-control" id="manager_name">
|
|
</div>
|
|
<div class="col-md-6 mb-3">
|
|
<label for="phone" class="form-label">전화번호</label>
|
|
<input type="tel" class="form-control" id="phone" placeholder="000-0000-0000">
|
|
</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="address" class="form-label">주소</label>
|
|
<textarea class="form-control" id="address" rows="2"></textarea>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-6 mb-3">
|
|
<label for="proxmox_host" class="form-label">Proxmox 호스트 IP</label>
|
|
<input type="text" class="form-control" id="proxmox_host" placeholder="192.168.1.100">
|
|
</div>
|
|
<div class="col-md-6 mb-3">
|
|
<label for="user_id" class="form-label">연결된 사용자 ID</label>
|
|
<input type="text" class="form-control" id="user_id" placeholder="user1">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">취소</button>
|
|
<button type="submit" class="btn btn-primary">
|
|
<i class="fas fa-save"></i> 저장
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block extra_js %}
|
|
<script>
|
|
let pharmacyModal;
|
|
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
pharmacyModal = new bootstrap.Modal(document.getElementById('pharmacyModal'));
|
|
});
|
|
|
|
function showAddModal() {
|
|
document.getElementById('pharmacyModalTitle').innerHTML =
|
|
'<i class="fas fa-plus"></i> 새 약국 등록';
|
|
document.getElementById('pharmacyForm').reset();
|
|
pharmacyModal.show();
|
|
}
|
|
|
|
function showEditModal(pharmacyId) {
|
|
document.getElementById('pharmacyModalTitle').innerHTML =
|
|
'<i class="fas fa-edit"></i> 약국 정보 수정';
|
|
|
|
// TODO: 기존 데이터를 로드하여 폼에 채우기
|
|
// fetch(`/api/pharmacy/${pharmacyId}`)
|
|
|
|
pharmacyModal.show();
|
|
}
|
|
|
|
document.getElementById('pharmacyForm').addEventListener('submit', function(e) {
|
|
e.preventDefault();
|
|
|
|
const formData = new FormData(this);
|
|
const data = Object.fromEntries(formData);
|
|
|
|
// TODO: API를 통한 약국 정보 저장
|
|
showToast('약국 정보가 저장되었습니다.', 'success');
|
|
pharmacyModal.hide();
|
|
|
|
// 페이지 새로고침 (임시)
|
|
setTimeout(() => location.reload(), 1000);
|
|
});
|
|
|
|
// 테이블 정렬 및 검색 기능 추가 (향후)
|
|
</script>
|
|
{% endblock %} |