Compare commits

...

10 Commits

Author SHA1 Message Date
7062a81d33 수정 2025-12-28 23:57:22 +09:00
79a7fc1550 수정 2025-12-28 23:54:56 +09:00
bf10a1d000 수정 2025-12-28 23:49:11 +09:00
8bcb5c7ff7 수정 2025-12-28 23:44:40 +09:00
248eb6e6e0 메모리 상태 또 변경 2025-12-28 23:06:44 +09:00
474e20eb5c 소스 수정 2025-12-28 18:33:49 +09:00
bd9d2a703f 소스 수정 2025-12-28 18:26:24 +09:00
240e096bd8 소스 수정 2025-12-28 18:24:58 +09:00
e49c962cee 소스 수정 2025-12-28 18:09:10 +09:00
99db3acc20 소스 수정 2025-12-28 18:09:04 +09:00
7 changed files with 468 additions and 311 deletions

506
README.md
View File

@@ -1,284 +1,336 @@
# OSOLIT Monitor
시스템 헬스체크 & 모니터링 대시보드 (Nuxt 3 + SQLite + SSE)
시스템 헬스체크 & 모니터링 대시보드 (Nuxt 3 + PostgreSQL + WebSocket)
## 주요 기능
### 📊 실시간 대시보드 (웹소켓/SSE 기반)
- **네트워크 점검** 포틀릿 (단일, 핵심)
- Server-Sent Events (SSE)로 실시간 업데이트
- 점검 시간과 상태 즉시 반영
- 연결 상태 표시 (🟢 연결됨 / 🔴 연결 끊김)
- 향후 추가 포틀릿 확장 가능
### 📊 실시간 대시보드
- **서버 상태 모니터링**: 다중 서버 헬스체크 및 상태 표시
- **네트워크 점검**: Public(외부망) / Private(내부망) 분리 모니터링
- **위치별 통계**: 서버 위치(Location)별 현황 요약
- **WebSocket 기반 실시간 업데이트**
- **다크/라이트 테마 지원**
### 🔄 적응형 스케줄러
- **정상 시**: 5분 간격 점검
- **장애 시**: 1분 간격 점검 (빠른 복구 감지)
- 자동으로 간격 조정
- DB 시간 기준으로 로그 저장
### 🌐 네트워크 모니터링
- **Public Network (pubnet)**: 외부망 연결 상태 점검
- **Private Network (privnet)**: 내부망 연결 상태 점검
- 응답 시간 측정 및 에러 메시지 상세 표시
### 🌐 네트워크 점검
- World Time API를 통한 외부 네트워크 상태 확인
- 응답 시간 측정
- 에러 메시지 상세 표시
### 🖥️ 서버 모니터링
- 다중 서버 대상 관리
- 서버별 헬스체크 이력 조회
- 위치별 서버 현황 통계
- 스케줄러 제어 (시작/중지)
### 💾 데이터 저장
- **SQLite 파일 DB** (`database/health_logs.db`)
- 별도 DB 서버 설치 불필요
- 상태: UP(정상) / DOWN(장애)
### 📈 이상탐지 (Anomaly Detection)
- **Baseline 분석**: 정상 기준선 대비 이상 탐지
- **Z-Score 분석**: 통계적 이상치 탐지
- **Trend 분석**: 장기 추세 분석
- **Short-term 분석**: 단기 변동 탐지
- Chart.js 기반 시각화
### ⚙️ 설정 관리
- 임계값(Threshold) 설정
- 스케줄러 간격 조정
## 기술 스택
| 구분 | 기술 |
|------|------|
| **Frontend** | Nuxt 3, Vue 3, Chart.js |
| **Backend** | Nitro (Node.js) |
| **Database** | PostgreSQL |
| **Real-time** | WebSocket |
| **Container** | Docker |
| **Timezone** | Asia/Seoul |
## 프로젝트 구조
```
osolit-monitor/
├── frontend/ # 프론트엔드 (Pages & Components)
│ ├── index.vue # 📊 메인 대시보드
│ ├── components/
│ │ ├── DashboardControl.vue
│ │ ├── ServerPortlet.vue
│ │ ├── NetworkPortlet.vue
│ │ ├── LocationStatsPortlet.vue
│ │ ├── SidebarNav.vue
│ │ └── ThemeToggle.vue
│ ├── network/ # 네트워크 모니터링
│ ├── server/ # 서버 모니터링
│ │ ├── list.vue
│ │ └── history.vue
│ ├── anomaly/ # 이상탐지
│ │ ├── baseline.vue
│ │ ├── zscore.vue
│ │ ├── trend.vue
│ │ └── short-term.vue
│ ├── settings/ # 설정
│ ├── assets/css/
│ └── composables/
├── backend/ # 백엔드 (API & Plugins)
│ ├── api/
│ │ ├── network/
│ │ │ ├── pubnet/ # 외부망 API
│ │ │ └── privnet/ # 내부망 API
│ │ ├── server/ # 서버 모니터링 API
│ │ │ ├── status.get.ts
│ │ │ ├── location-stats.get.ts
│ │ │ ├── targets/
│ │ │ ├── history/
│ │ │ └── scheduler/
│ │ ├── anomaly/ # 이상탐지 API
│ │ │ ├── baseline.get.ts
│ │ │ ├── zscore.get.ts
│ │ │ ├── trend.get.ts
│ │ │ ├── short-term.get.ts
│ │ │ ├── chart.get.ts
│ │ │ └── logs.get.ts
│ │ └── settings/ # 설정 API
│ │ ├── thresholds.get.ts
│ │ └── thresholds.put.ts
│ ├── plugins/
│ │ ├── pubnet-init.ts # 외부망 스케줄러 초기화
│ │ ├── privnet-init.ts # 내부망 스케줄러 초기화
│ │ └── server-init.ts # 서버 스케줄러 초기화
│ ├── routes/ # WebSocket 라우트
│ └── utils/
│ ├── db.ts # PostgreSQL 연결
│ ├── pubnet-scheduler.ts
│ ├── privnet-scheduler.ts
│ └── server-scheduler.ts
├── database/ # DB 관련 (마이그레이션 등)
├── .env # 개발 환경변수
├── .env.prod # 운영 환경변수
├── Dockerfile # 프로덕션 Docker 이미지
├── nuxt.config.ts
└── package.json
```
## 설치 및 실행
### 환경 요구사항
- Node.js 20+
- PostgreSQL 14+
### 1. 의존성 설치
```bash
npm install
```
### 2. 개발 서버 실행
### 2. 환경변수 설정
```bash
# .env 파일 생성
cp .env.example .env
```
```env
# 환경 설정
NODE_ENV=development
# PostgreSQL 연결 정보
DB_HOST=localhost
DB_PORT=5432
DB_NAME=osolit_monitor
DB_USER=postgres
DB_PASSWORD=your_password
# 스케줄러 자동시작 (development: false 권장)
AUTO_START_SCHEDULER=false
```
### 3. 개발 서버 실행
```bash
npm run dev
```
서버 시작 시:
- DB 자동 초기화
- 즉시 첫 네트워크 점검 실행
- SSE 서버 시작
- 개발 서버: http://localhost:3000
- 개발 서버: http://localhost:4055
- WebSocket: ws://localhost:4055/_ws
### 3. 프로덕션 빌드
### 4. 프로덕션 빌드
```bash
npm run build
npm run preview
```
## Docker 배포
### 빌드 및 실행
```bash
# 이미지 빌드
docker build -t osolit-monitor .
# 컨테이너 실행
docker run -d \
--name osolit-monitor \
-p 4055:4055 \
-e DB_HOST=your-db-host \
-e DB_PORT=5432 \
-e DB_NAME=osolit_monitor \
-e DB_USER=osolit \
-e DB_PASSWORD=your_password \
osolit-monitor
```
### Docker 특징
- Multi-stage 빌드 (최적화된 이미지 크기)
- Asia/Seoul 타임존 설정
- 비root 사용자 실행 (보안)
- 환경변수 기반 설정
## 화면 구성
### 홈 (실시간 대시보드)
**http://localhost:3000**
#### 네트워크 점검 포틀릿
### 메인 대시보드 (`/`)
```
┌─────────────────────────────────┐
🌐 네트워크 점검 ← 상태 아이콘
├─────────────────────────────────┤
[ UP ] │ ← 상태 뱃지
│ │
점검 시간: 12/25 14:35:20 │ ← 마지막 점검 시간
응답 시간: 123ms ← 응답 속도
├─────────────────────────────────┤
5분 전 ⏱️ 5분 간격 │ ← 상대시간 & 점검주기
└─────────────────────────────────
┌─────────────────────────────────────────────────────────
📊 대시보드 2024-12-25 14:30:00 │
├─────────────────────────────────────────────────────────
┌─────────────────────────────────┐ ┌─────────────────┐ │
│ │ 🌐 Public ✓ │
│ 서버 현황 (90%) │ │ [UP] │ │
│ ├─────────────────┤ │
│ │ 서버 목록 & 상태 │ │ 🔒 Private ✓ │ │
│ │ [UP] │ │
│ │ │ ├─────────────────┤ │
│ │ │ │ 📍 위치별 통계 │ │
│ └─────────────────────────────────┘ └─────────────────┘ │
└─────────────────────────────────────────────────────────┘
🟢 연결됨
```
**실시간 업데이트:**
- 점검 완료 시 즉시 화면 반영
- 별도 새로고침 불필요
- SSE 연결 상태 표시
### 서버 관리 (`/server/list`, `/server/history`)
- 모니터링 대상 서버 목록 관리
- 서버별 헬스체크 이력 조회
**향후 확장:**
- 데이터베이스 점검 포틀릿
- 서버 상태 포틀릿
- 디스크 용량 포틀릿
- 기타 모니터링 항목
### 이상탐지 (`/anomaly/*`)
- Baseline / Z-Score / Trend / Short-term 분석
- 차트 기반 시각화
### 로그 & 통계
**http://localhost:3000/logs**
- 전체 점검 이력
- 통계 정보
### 시스템 헬스체크
**http://localhost:3000/health**
- 실시간 상태 조회
### 글로벌 표준시
**http://localhost:3000/time**
- Time API 직접 테스트
## 프로젝트 구조
```
osolit-monitor/
├── frontend/
│ ├── index.vue # 🏠 실시간 대시보드
│ ├── logs.vue # 📊 로그 & 통계
│ ├── health.vue # 🏥 헬스체크
│ └── time.vue # 🌍 시간 API
├── backend/
│ ├── api/
│ │ ├── dashboard.get.ts # 대시보드 초기 데이터
│ │ ├── stream.get.ts # SSE 스트림 (실시간)
│ │ ├── logs.get.ts
│ │ └── stats.get.ts
│ ├── plugins/
│ │ └── scheduler.ts # 적응형 스케줄러
│ └── utils/
│ ├── database.ts # SQLite
│ └── timecheck.ts # 네트워크 체크
├── database/
│ └── health_logs.db # SQLite (자동 생성)
└── nuxt.config.ts
```
## 실시간 업데이트 (SSE)
### Server-Sent Events
```javascript
// 프론트엔드
const eventSource = new EventSource('/api/stream')
eventSource.onmessage = (event) => {
const message = JSON.parse(event.data)
if (message.type === 'health_update') {
// 화면 즉시 업데이트
networkStatus.value = message.data
}
}
```
### 메시지 타입
- `health_update`: 헬스체크 결과
- `ping`: 연결 유지 (30초마다)
### 자동 재연결
연결 끊김 시 5초 후 자동 재연결 시도
## 적응형 스케줄링
### 동작 방식
1. **서버 시작**: 즉시 첫 점검
2. **정상(UP)**: 다음 점검 5분 후
3. **장애(DOWN)**: 다음 점검 1분 후 (빠른 복구 감지)
4. **상태 변경 시**: 자동으로 간격 조정
### 콘솔 로그
```
🚀 Initializing Health Check Scheduler...
✅ Database initialized
⏰ Running network health check...
Result: UP (123ms)
✅ Health Check Scheduler started
[5분 후]
⏰ Running network health check...
Result: DOWN (5001ms)
🔄 Interval changed: 1 minutes
[1분 후]
⏰ Running network health check...
Result: UP (125ms)
🔄 Interval changed: 5 minutes
```
### 설정 (`/settings/*`)
- 임계값 설정 관리
## API 엔드포인트
### GET /api/dashboard
초기 대시보드 데이터
### 네트워크
| Method | Endpoint | 설명 |
|--------|----------|------|
| GET | `/api/network/pubnet/status` | 외부망 상태 |
| GET | `/api/network/privnet/status` | 내부망 상태 |
**Response:**
```json
{
"networkStatus": {
"id": 123,
"service_name": "Network",
"status": "UP",
"check_time": "2024-12-25T12:34:56.000Z",
"response_time": 123,
"error_message": null
},
"lastUpdate": "2024-12-25T12:34:56.789Z"
### 서버
| Method | Endpoint | 설명 |
|--------|----------|------|
| GET | `/api/server/status` | 서버 현황 |
| GET | `/api/server/location-stats` | 위치별 통계 |
| GET | `/api/server/targets` | 모니터링 대상 목록 |
| GET | `/api/server/history` | 헬스체크 이력 |
### 이상탐지
| Method | Endpoint | 설명 |
|--------|----------|------|
| GET | `/api/anomaly/baseline` | Baseline 분석 |
| GET | `/api/anomaly/zscore` | Z-Score 분석 |
| GET | `/api/anomaly/trend` | Trend 분석 |
| GET | `/api/anomaly/short-term` | 단기 분석 |
| GET | `/api/anomaly/chart` | 차트 데이터 |
### 설정
| Method | Endpoint | 설명 |
|--------|----------|------|
| GET | `/api/settings/thresholds` | 임계값 조회 |
| PUT | `/api/settings/thresholds` | 임계값 수정 |
## WebSocket 통신
### 연결
```javascript
const ws = new WebSocket('ws://localhost:4055/_ws')
```
### 메시지 타입
**클라이언트 → 서버:**
```javascript
// 새로고침 간격 설정
{ type: 'set_interval', interval: 1 }
// 자동 새로고침 토글
{ type: 'set_auto_refresh', enabled: true }
// 즉시 새로고침
{ type: 'refresh' }
// 특정 시점 데이터 조회
{ type: 'fetch_at', datetime: '2024-12-25T14:30:00' }
```
**서버 → 클라이언트:**
```javascript
// 실시간 상태
{ type: 'status', data: { pubnet: {...}, privnet: {...} } }
// 서버 현황
{ type: 'server', data: { servers: [...], summary: {...} } }
// 과거 데이터
{ type: 'historical', data: {...} }
```
## 데이터베이스
### PostgreSQL 연결
```typescript
// backend/utils/db.ts
const config = {
host: process.env.DB_HOST,
port: parseInt(process.env.DB_PORT || '5432'),
database: process.env.DB_NAME,
user: process.env.DB_USER,
password: process.env.DB_PASSWORD,
}
```
### GET /api/stream (SSE)
실시간 업데이트 스트림
### 주요 테이블
- `health_check_log`: 헬스체크 로그
- `server_targets`: 모니터링 대상 서버
- `thresholds`: 임계값 설정
**Event Stream:**
```
data: {"type":"health_update","data":{...}}
## 스케줄러
data: {"type":"ping","timestamp":"2024-12-25T12:34:56.789Z"}
```
### 동작 방식
- **개발 환경**: 수동 시작 (`AUTO_START_SCHEDULER=false`)
- **운영 환경**: 자동 시작 (`AUTO_START_SCHEDULER=true`)
### GET /api/logs
헬스체크 로그 조회
### GET /api/stats
통계 조회
## 데이터베이스 스키마
### health_check_log 테이블
```sql
CREATE TABLE health_check_log (
id INTEGER PRIMARY KEY AUTOINCREMENT,
check_time DATETIME DEFAULT CURRENT_TIMESTAMP,
service_name TEXT NOT NULL, -- 'Network'
status TEXT NOT NULL, -- 'UP' or 'DOWN'
response_time INTEGER, -- 밀리초
error_message TEXT,
details TEXT
)
```
## 데이터 관리
### DB 백업
```bash
cp database/health_logs.db database/backup_$(date +%Y%m%d).db
```
### DB 조회
```bash
sqlite3 database/health_logs.db
# 최근 로그
SELECT * FROM health_check_log
WHERE service_name = 'Network'
ORDER BY check_time DESC LIMIT 20;
# 통계
SELECT
status,
COUNT(*) as count,
AVG(response_time) as avg_ms
FROM health_check_log
WHERE service_name = 'Network'
GROUP BY status;
```
### 스케줄러 종류
| 스케줄러 | 설명 | 간격 |
|----------|------|------|
| `pubnet-scheduler` | 외부망 점검 | 적응형 (정상 5분, 장애 1분) |
| `privnet-scheduler` | 내부망 점검 | 적응형 (정상 5분, 장애 1분) |
| `server-scheduler` | 서버 점검 | 설정 가능 |
## 브라우저 호환성
SSE 지원 브라우저:
- ✅ Chrome
- ✅ Firefox
- ✅ Safari
- ✅ Edge
- ❌ IE (미지원)
## 다음 단계
## 개발 로드맵
- [ ] 데이터베이스 점검 포틀릿 추가
- [ ] 서버 상태 점검 포틀릿 추가
- [ ] 디스크 용량 점검 포틀릿 추가
- [ ] Jenkins Job 통합
- [x] 서버 모니터링 포틀릿
- [x] 네트워크 모니터링 (Public/Private)
- [x] 이상탐지 기능
- [x] Chart.js 차트
- [x] 다크/라이트 테마
- [x] Docker 지원
- [ ] 장애 알림 (이메일/Slack)
- [ ] 차트/그래프
- [ ] 오래된 로그 자동 삭제
- [ ] Jenkins Job 통합
## 기술 스택
## 라이선스
- **Frontend**: Nuxt 3, Vue 3
- **Backend**: Nitro (Node.js)
- **Database**: SQLite (better-sqlite3)
- **Real-time**: Server-Sent Events (SSE)
- **Scheduler**: 적응형 (정상 5분, 장애 1분)
- **External API**: World Time API
## 특징
**실시간 업데이트** - SSE로 즉시 반영
**적응형 스케줄링** - 장애 시 빠른 점검
**단순한 구조** - 네트워크 점검 중심
**확장 가능** - 포틀릿 추가 용이
**파일 DB** - 별도 서버 불필요
Private - TurboSoft

View File

@@ -163,7 +163,7 @@ async function getServerDashboard() {
// 서버 목록
const servers = await query(`
SELECT target_id, server_name, is_active
SELECT target_id, server_name, server_ip, is_active
FROM server_targets
WHERE is_active = 1
ORDER BY server_name
@@ -176,16 +176,19 @@ async function getServerDashboard() {
for (const server of servers) {
// 최신 스냅샷
const snapshot = await queryOne(`
SELECT cpu_percent, memory_percent, collected_at
SELECT cpu_percent, memory_percent, memory_total, memory_free, memory_used,
cpu_temp, load_percent, uptime_str, collected_at
FROM server_snapshots
WHERE target_id = $1 AND is_online = 1
ORDER BY collected_at DESC
LIMIT 1
`, [server.target_id])
// 최신 디스크 사용률 (최대값)
// 최신 디스크 사용률 (최대값) + 용량
const diskData = await queryOne(`
SELECT MAX(disk_percent) as disk_percent
SELECT MAX(disk_percent) as disk_percent,
SUM(disk_used) as disk_used,
SUM(disk_total) as disk_total
FROM server_disks
WHERE target_id = $1
AND collected_at = (SELECT MAX(collected_at) FROM server_disks WHERE target_id = $1)
@@ -209,6 +212,7 @@ async function getServerDashboard() {
if (!isOffline && snapshot) {
cpuLevel = getLevel(Number(snapshot.cpu_percent), thresholds.server?.cpu || { warning: 70, critical: 85, danger: 95 })
// 메모리: snapshot.memory_percent 직접 사용
memLevel = getLevel(Number(snapshot.memory_percent), thresholds.server?.memory || { warning: 80, critical: 90, danger: 95 })
diskLevel = getLevel(Number(diskData?.disk_percent), thresholds.server?.disk || { warning: 80, critical: 90, danger: 95 })
serverLevel = getHighestLevel([cpuLevel, memLevel, diskLevel])
@@ -286,13 +290,22 @@ async function getServerDashboard() {
serverStatuses.push({
target_id: server.target_id,
server_name: server.server_name,
server_ip: server.server_ip,
level: serverLevel,
cpu_percent: snapshot?.cpu_percent ?? null,
cpu_level: cpuLevel,
memory_percent: snapshot?.memory_percent ?? null,
memory_percent: snapshot?.memory_percent ?? null, // snapshot의 memory_percent 직접 사용
memory_level: memLevel,
memory_total: snapshot?.memory_total ?? null,
memory_free: snapshot?.memory_free ?? null,
memory_used: snapshot?.memory_used ?? null,
disk_percent: diskData?.disk_percent ?? null,
disk_level: diskLevel,
disk_used: diskData?.disk_used ?? null,
disk_total: diskData?.disk_total ?? null,
cpu_temp: snapshot?.cpu_temp ?? null,
load_percent: snapshot?.load_percent ?? null,
uptime_str: snapshot?.uptime_str ?? null,
last_collected: lastCollected,
containers: containers,
container_summary: containerSummary

View File

@@ -1,4 +1,5 @@
import { query, queryOne, execute, getPool } from './db'
import { ofetch } from 'ofetch'
interface ServerTarget {
target_id: number
@@ -20,16 +21,20 @@ function timestamp(): string {
return new Date().toLocaleString('sv-SE', { timeZone: 'Asia/Seoul' }).replace('T', ' ')
}
// Glances API 호출 (버전 지정)
// Glances API 호출 (버전 지정) - ofetch 사용
async function fetchGlancesApi(baseUrl: string, endpoint: string, version: string): Promise<any> {
const url = `${baseUrl}/api/${version}/${endpoint}`
try {
const url = `${baseUrl}/api/${version}/${endpoint}`
const response = await fetch(url, {
signal: AbortSignal.timeout(5000)
const data = await ofetch(url, {
timeout: 5000,
retry: 0
})
if (!response.ok) return null
return await response.json()
} catch (err) {
return data
} catch (err: any) {
// 404, timeout 등 에러는 조용히 null 반환
if (err.statusCode !== 404) {
console.error(`[fetchGlancesApi] ${url} - Error: ${err.message}`)
}
return null
}
}
@@ -84,6 +89,8 @@ async function detectAnomalies(targetId: number, serverName: string) {
const currCpuAvg = currSnapshots.reduce((sum, s) => sum + (s.cpu_percent || 0), 0) / currSnapshots.length
const prevCpuAvg = prevSnapshots.reduce((sum, s) => sum + (s.cpu_percent || 0), 0) / prevSnapshots.length
// 메모리: memory_percent 직접 사용
const currMemAvg = currSnapshots.reduce((sum, s) => sum + (s.memory_percent || 0), 0) / currSnapshots.length
const prevMemAvg = prevSnapshots.reduce((sum, s) => sum + (s.memory_percent || 0), 0) / prevSnapshots.length
@@ -152,7 +159,7 @@ async function detectAnomalies(targetId: number, serverName: string) {
if (hourSnapshots.length >= 10) {
const current = hourSnapshots[0]
const currCpu = current.cpu_percent ?? 0
const currMem = current.memory_percent ?? 0
const currMem = current.memory_percent ?? 0 // memory_percent 직접 사용
const cpuValues = hourSnapshots.map(s => s.cpu_percent ?? 0)
const memValues = hourSnapshots.map(s => s.memory_percent ?? 0)
@@ -244,7 +251,7 @@ async function detectAnomalies(targetId: number, serverName: string) {
if (baselineData.length >= 5 && currentSnapshot) {
const currCpu = currentSnapshot.cpu_percent ?? 0
const currMem = currentSnapshot.memory_percent ?? 0
const currMem = currentSnapshot.memory_percent ?? 0 // memory_percent 직접 사용
const cpuValues = baselineData.map(s => s.cpu_percent ?? 0)
const memValues = baselineData.map(s => s.memory_percent ?? 0)
@@ -485,12 +492,12 @@ async function collectServerData(target: ServerTarget) {
quicklook?.cpu_name || null,
quicklook?.cpu_number || quicklook?.cpu_log_core || cpu?.cpucore || null,
cpu?.total ?? quicklook?.cpu ?? null,
mem?.total || null,
mem?.used || null,
mem?.free || null,
mem?.total ? Math.round(mem.total) : null, // bigint: 정수 변환
mem?.total && mem?.percent ? Math.round(mem.total * mem.percent / 100) : null, // bigint: 정수 변환
mem?.free ? Math.round(mem.free) : null, // bigint: 정수 변환
mem?.percent || null,
memswap?.total || null,
memswap?.used || null,
memswap?.total ? Math.round(memswap.total) : null, // bigint: 정수 변환
memswap?.used ? Math.round(memswap.used) : null, // bigint: 정수 변환
memswap?.percent || null,
isOnline ? 1 : 0,
apiVersion,
@@ -516,8 +523,8 @@ async function collectServerData(target: ServerTarget) {
disk.device_name || null,
disk.mnt_point || null,
disk.fs_type || null,
disk.size || null,
disk.used || null,
disk.size ? Math.round(disk.size) : null, // bigint: 정수 변환
disk.used ? Math.round(disk.used) : null, // bigint: 정수 변환
disk.percent || null,
now
])
@@ -528,6 +535,26 @@ async function collectServerData(target: ServerTarget) {
if (Array.isArray(docker) && docker.length > 0) {
console.log(`[${now}] 🐳 [${target.server_name}] container 저장 (${docker.length}개 컨테이너)`)
for (const container of docker) {
// CPU 값 추출 로직
const cpuPercent = container.cpu?.total ?? container.cpu_percent ?? null
const memoryUsage = container.memory?.usage || container.memory_usage || null
const memoryLimit = container.memory?.limit || container.memory_limit || null
const memoryPercent = container.memory?.usage && container.memory?.limit
? (container.memory.usage / container.memory.limit * 100)
: container.memory_percent ?? null
// 각 컨테이너별 상세 로그
console.log(`[${now}] 🐳 - ${container.name}: CPU=${cpuPercent?.toFixed(2) ?? 'null'}%, MEM=${memoryPercent?.toFixed(2) ?? 'null'}%`)
// CPU가 null인 경우 상세 디버깅
if (cpuPercent === null) {
console.warn(`[${now}] ⚠️ - ${container.name}: CPU 값 null! 원본:`, JSON.stringify({
'cpu.total': container.cpu?.total,
'cpu_percent': container.cpu_percent,
'cpu': container.cpu
}))
}
await execute(`
INSERT INTO server_containers (
target_id, docker_id, container_name, container_image,
@@ -540,12 +567,10 @@ async function collectServerData(target: ServerTarget) {
container.name || null,
Array.isArray(container.image) ? container.image.join(', ') : container.image || null,
container.status || null,
container.cpu?.total ?? container.cpu_percent ?? null,
container.memory?.usage || container.memory_usage || null,
container.memory?.limit || container.memory_limit || null,
container.memory?.usage && container.memory?.limit
? (container.memory.usage / container.memory.limit * 100)
: container.memory_percent ?? null,
cpuPercent,
memoryUsage ? Math.round(memoryUsage) : null, // bigint: 정수 변환
memoryLimit ? Math.round(memoryLimit) : null, // bigint: 정수 변환
memoryPercent,
container.uptime || null,
container.network?.rx ?? container.network_rx ?? null,
container.network?.tx ?? container.network_tx ?? null,
@@ -558,6 +583,11 @@ async function collectServerData(target: ServerTarget) {
if (Array.isArray(network) && network.length > 0) {
console.log(`[${now}] 🌐 [${target.server_name}] network 저장 (${network.length}개 인터페이스)`)
for (const iface of network) {
const bytesRecv = iface.bytes_recv || iface.cumulative_rx || null
const bytesSent = iface.bytes_sent || iface.cumulative_tx || null
const packetsRecv = iface.packets_recv || null
const packetsSent = iface.packets_sent || null
await execute(`
INSERT INTO server_networks (
target_id, interface_name, bytes_recv, bytes_sent,
@@ -567,10 +597,10 @@ async function collectServerData(target: ServerTarget) {
`, [
target.target_id,
iface.interface_name || null,
iface.bytes_recv || iface.cumulative_rx || null,
iface.bytes_sent || iface.cumulative_tx || null,
iface.packets_recv || null,
iface.packets_sent || null,
bytesRecv ? Math.round(bytesRecv) : null, // bigint: 정수 변환
bytesSent ? Math.round(bytesSent) : null, // bigint: 정수 변환
packetsRecv ? Math.round(packetsRecv) : null, // bigint: 정수 변환
packetsSent ? Math.round(packetsSent) : null, // bigint: 정수 변환
iface.bytes_recv_rate_per_sec || iface.rx || iface.bytes_recv_rate || null,
iface.bytes_sent_rate_per_sec || iface.tx || iface.bytes_sent_rate || null,
iface.is_up ? 1 : 0,

BIN
database/osolit-monitor.db Normal file

Binary file not shown.

View File

@@ -35,27 +35,36 @@
<div class="server-info" @dblclick="goToServerStatus(server.target_id)">
<div class="server-name">
<span class="level-icon">{{ levelIcon(server.level) }}</span>
<span class="name">{{ server.server_name }}</span>
<div class="name-wrap">
<span class="name">{{ server.server_name }}</span>
<span class="server-ip">{{ server.server_ip }}</span>
</div>
<span class="container-count" v-if="server.level !== 'offline'">📦{{ server.container_summary.total }}</span>
</div>
<template v-if="server.level !== 'offline'">
<!-- 업타임 -->
<div class="info-row">
<span class="info-label">UP</span>
<span class="info-value">{{ server.uptime_str || '-' }}</span>
</div>
<div class="metric-row">
<span class="metric-label">CPU</span>
<div class="progress-bar">
<div :class="['progress-fill', server.cpu_level]" :style="{ width: (server.cpu_percent || 0) + '%' }"></div>
</div>
<span :class="['metric-value', server.cpu_level, { 'value-changed': isChanged(server.target_id, 'cpu') }]">
{{ server.cpu_percent?.toFixed(0) || '-' }}
{{ server.cpu_percent?.toFixed(0) || '-' }}%
</span>
</div>
<div class="metric-row">
<span class="metric-label">MEM</span>
<div class="progress-bar">
<div :class="['progress-fill', server.memory_level]" :style="{ width: (server.memory_percent || 0) + '%' }"></div>
<div :class="['progress-fill', server.memory_level]" :style="{ width: calcMemPercent(server) + '%' }"></div>
</div>
<span :class="['metric-value', server.memory_level, { 'value-changed': isChanged(server.target_id, 'mem') }]">
{{ server.memory_percent?.toFixed(0) || '-' }}
{{ calcMemPercent(server).toFixed(0) }}%
</span>
</div>
<div class="metric-row">
@@ -64,9 +73,27 @@
<div :class="['progress-fill', server.disk_level]" :style="{ width: (server.disk_percent || 0) + '%' }"></div>
</div>
<span :class="['metric-value', server.disk_level, { 'value-changed': isChanged(server.target_id, 'disk') }]">
{{ server.disk_percent?.toFixed(0) || '-' }}
{{ server.disk_percent?.toFixed(0) || '-' }}%
</span>
</div>
<!-- 추가 정보: 온도, Load, 메모리용량, 디스크용량 -->
<div class="info-row">
<span class="info-label">TEMP</span>
<span class="info-value">{{ server.cpu_temp ? server.cpu_temp + '°C' : '-' }}</span>
</div>
<div class="info-row">
<span class="info-label">LOAD</span>
<span class="info-value">{{ server.load_percent ? server.load_percent.toFixed(1) + '%' : '-' }}</span>
</div>
<div class="info-row">
<span class="info-label">RAM</span>
<span class="info-value">{{ formatServerMem(server) }}</span>
</div>
<div class="info-row">
<span class="info-label">HDD</span>
<span class="info-value">{{ formatServerDisk(server) }}</span>
</div>
</template>
<template v-else>
@@ -99,7 +126,7 @@
<div :class="['mini-fill', getContainerCpuLevel(container)]" :style="{ width: Math.min(container.cpu_percent || 0, 100) + '%' }"></div>
</div>
<span :class="['value', { 'value-changed': isContainerChanged(server.target_id, container.name, 'cpu') }]">
{{ container.cpu_percent?.toFixed(0) || '-' }}%
{{ formatCpuPercent(container.cpu_percent) }}
</span>
</div>
<div class="card-metric">
@@ -157,13 +184,22 @@ interface ContainerStatus {
interface ServerStatus {
target_id: number
server_name: string
server_ip: string
level: string
cpu_percent: number | null
cpu_level: string
memory_percent: number | null
memory_level: string
memory_total: number | null
memory_free: number | null
memory_used: number | null
disk_percent: number | null
disk_level: string
disk_used: number | null
disk_total: number | null
cpu_temp: number | null
load_percent: number | null
uptime_str: string | null
last_collected: string | null
containers: ContainerStatus[]
container_summary: { total: number; normal: number; warning: number; critical: number; stopped: number }
@@ -265,6 +301,31 @@ function isContainerChanged(serverId: number, containerName: string, metric: str
return changedKeys.value.has(`container-${serverId}-${containerName}-${metric}`)
}
// 서버 메모리 퍼센트: memory_percent 직접 사용
function calcMemPercent(server: ServerStatus): number {
return server.memory_percent || 0
}
// 서버 메모리 용량 포맷: used/total GB (memory_used는 DB에서 계산된 값)
function formatServerMem(server: ServerStatus): string {
const used = Number(server.memory_used) || 0
const total = Number(server.memory_total) || 0
if (total === 0) return '-'
const usedGB = (used / (1024 * 1024 * 1024)).toFixed(1)
const totalGB = (total / (1024 * 1024 * 1024)).toFixed(1)
return `${usedGB}/${totalGB}G`
}
// 서버 디스크 용량 포맷: used/total GB
function formatServerDisk(server: ServerStatus): string {
const used = Number(server.disk_used) || 0
const total = Number(server.disk_total) || 0
if (total === 0) return '-'
const usedGB = (used / (1024 * 1024 * 1024)).toFixed(0)
const totalGB = (total / (1024 * 1024 * 1024)).toFixed(0)
return `${usedGB}/${totalGB}G`
}
function sortContainers(containers: ContainerStatus[]) {
return [...containers].sort((a, b) => a.name.localeCompare(b.name))
}
@@ -301,6 +362,15 @@ function getMemPercent(c: ContainerStatus): number {
return (Number(c.memory_usage) / Number(c.memory_limit)) * 100
}
function formatCpuPercent(value: number | null): string {
if (value === null || value === undefined) return '-'
// 10% 이상이면 정수로, 미만이면 소수점 1자리
if (value >= 10) return `${value.toFixed(0)}%`
if (value >= 1) return `${value.toFixed(1)}%`
if (value >= 0.1) return `${value.toFixed(1)}%`
return `${value.toFixed(2)}%`
}
function formatMemoryShort(bytes: number | null): string {
if (bytes === null || bytes === undefined) return '-'
const numBytes = Number(bytes)
@@ -353,12 +423,14 @@ function formatTimeAgo(datetime: string | null): string {
.server-unit.danger { border-left: 5px solid #ef4444; }
.server-unit.offline { border-left: 5px solid #6b7280; opacity: 0.7; }
.server-info { width: 200px; min-width: 200px; padding: 16px; border-right: 1px solid var(--border-color); cursor: pointer; }
.server-info { width: 240px; min-width: 240px; padding: 16px; border-right: 1px solid var(--border-color); cursor: pointer; }
.server-info:hover { background: var(--bg-tertiary, #f8fafc); }
.server-name { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.server-name .level-icon { font-size: 16px; flex-shrink: 0; }
.server-name .name { font-size: 19px; font-weight: 700; color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; }
.server-name .name-wrap { flex: 1; min-width: 0; overflow: hidden; }
.server-name .name { display: block; font-size: 19px; font-weight: 700; color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.server-name .server-ip { display: block; font-size: 12px; color: var(--text-muted); font-family: monospace; margin-top: 2px; }
.server-name .container-count { font-size: 15px; color: var(--text-muted); flex-shrink: 0; }
.metric-row { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
@@ -369,19 +441,23 @@ function formatTimeAgo(datetime: string | null): string {
.progress-fill.warning { background: #eab308; }
.progress-fill.critical { background: #f97316; }
.progress-fill.danger { background: #ef4444; }
.metric-value { font-size: 17px; font-weight: 700; width: 36px; text-align: right; transition: all 0.3s; padding: 2px 4px; border-radius: 4px; }
.metric-value { font-size: 17px; font-weight: 700; width: 44px; text-align: right; transition: all 0.3s; padding: 2px 4px; border-radius: 4px; }
.metric-value.normal { color: #16a34a; }
.metric-value.warning { color: #ca8a04; }
.metric-value.critical { color: #ea580c; }
.metric-value.danger { color: #dc2626; }
.info-row { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.info-label { font-size: 14px; font-weight: 600; color: var(--text-muted); width: 42px; }
.info-value { flex: 1; font-size: 14px; font-weight: 600; color: var(--text-secondary); font-family: monospace; text-align: right; }
.offline-info { text-align: center; padding: 24px 0; color: var(--text-muted); }
.offline-text { font-size: 18px; margin-bottom: 8px; }
.offline-time { font-size: 15px; opacity: 0.7; }
.container-area { display: flex; flex-wrap: wrap; gap: 12px; padding: 14px; align-content: flex-start; min-width: 140px; }
.container-area { display: flex; flex-wrap: wrap; gap: 10px; padding: 12px; align-content: flex-start; min-width: 140px; }
.container-card { width: 260px; padding: 14px; border-radius: 10px; border: 1px solid var(--border-color); background: var(--bg-secondary); cursor: pointer; transition: all 0.15s; overflow: hidden; }
.container-card { width: 208px; padding: 10px; border-radius: 8px; border: 1px solid var(--border-color); background: var(--bg-secondary); cursor: pointer; transition: all 0.15s; overflow: hidden; }
.container-card:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
.container-card.normal { background: var(--container-normal-bg, #f0fdf4); border-color: var(--container-normal-border, #86efac); }
.container-card.warning { background: var(--container-warning-bg, #fefce8); border-color: var(--container-warning-border, #fde047); }
@@ -389,22 +465,22 @@ function formatTimeAgo(datetime: string | null): string {
.container-card.danger { background: var(--container-danger-bg, #fef2f2); border-color: var(--container-danger-border, #fca5a5); }
.container-card.stopped { background: var(--container-danger-bg, #fef2f2); border-color: var(--container-danger-border, #fca5a5); }
.card-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; overflow: hidden; }
.card-name { display: flex; align-items: center; gap: 8px; flex: 1; min-width: 0; overflow: hidden; }
.card-name .card-level { font-size: 14px; flex-shrink: 0; }
.card-name .name { font-size: 17px; font-weight: 700; color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.card-uptime { font-size: 14px; color: var(--text-muted); flex-shrink: 0; margin-left: 12px; white-space: nowrap; }
.card-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; overflow: hidden; }
.card-name { display: flex; align-items: center; gap: 6px; flex: 1; min-width: 0; overflow: hidden; }
.card-name .card-level { font-size: 12px; flex-shrink: 0; }
.card-name .name { font-size: 15px; font-weight: 700; color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.card-uptime { font-size: 12px; color: var(--text-muted); flex-shrink: 0; margin-left: 8px; white-space: nowrap; }
.card-metrics { display: flex; flex-wrap: wrap; gap: 8px 12px; }
.card-metric { display: flex; align-items: center; gap: 8px; width: calc(50% - 6px); overflow: hidden; }
.card-metric .label { font-size: 13px; color: var(--text-muted); width: 28px; flex-shrink: 0; font-weight: 500; }
.mini-bar { flex: 1; height: 8px; background: rgba(0,0,0,0.1); border-radius: 4px; overflow: hidden; min-width: 28px; }
.mini-fill { height: 100%; border-radius: 4px; }
.card-metrics { display: flex; flex-wrap: wrap; gap: 5px 8px; }
.card-metric { display: flex; align-items: center; gap: 4px; width: calc(50% - 4px); overflow: visible; }
.card-metric .label { font-size: 11px; color: var(--text-muted); width: 22px; flex-shrink: 0; font-weight: 500; }
.mini-bar { flex: 1; height: 6px; background: rgba(0,0,0,0.1); border-radius: 3px; overflow: hidden; min-width: 20px; }
.mini-fill { height: 100%; border-radius: 3px; }
.mini-fill.normal { background: #22c55e; }
.mini-fill.warning { background: #eab308; }
.mini-fill.critical { background: #f97316; }
.mini-fill.danger { background: #ef4444; }
.card-metric .value { font-size: 15px; font-weight: 700; color: var(--text-secondary); width: 50px; text-align: right; flex-shrink: 0; overflow: hidden; text-overflow: ellipsis; transition: all 0.3s; padding: 2px 4px; border-radius: 4px; }
.card-metric .value { font-size: 13px; font-weight: 700; color: var(--text-secondary); min-width: 44px; text-align: right; flex-shrink: 0; transition: all 0.3s; padding: 1px 2px; border-radius: 3px; }
.card-metric .value.mem-highlight { color: #dc2626; font-weight: 800; }
.card-metric .value.net { color: var(--text-muted); font-weight: 600; }
@@ -412,24 +488,25 @@ function formatTimeAgo(datetime: string | null): string {
.no-container { font-size: 16px; color: var(--text-muted); padding: 16px; display: flex; align-items: center; justify-content: center; }
/* 값 변경 시 하이라이트 애니메이션 - 더 눈에 띄게 */
/* 값 변경 시 하이라이트 애니메이션 - 글자색 변경 */
@keyframes valueFlash {
0% {
background-color: rgba(59, 130, 246, 0.6);
transform: scale(1.1);
color: #3b82f6;
text-shadow: 0 0 8px rgba(59, 130, 246, 0.8);
transform: scale(1.15);
}
50% {
background-color: rgba(59, 130, 246, 0.3);
transform: scale(1.05);
color: #60a5fa;
text-shadow: 0 0 4px rgba(59, 130, 246, 0.5);
transform: scale(1.08);
}
100% {
background-color: transparent;
text-shadow: none;
transform: scale(1);
}
}
.value-changed {
animation: valueFlash 1.5s ease-out;
border-radius: 4px;
}
</style>

View File

@@ -405,24 +405,24 @@ async function fetchSnapshots() {
load: validLoad.length ? (validLoad.reduce((a: number, b: number) => a + b, 0) / validLoad.length).toFixed(1) : '-'
}
// Memory/Swap 라인 차트
// Memory/Swap 라인 차트 - memory_percent 직접 사용
const memData = data.map((d: any) => d.memory_percent || 0)
const swapData = data.map((d: any) => d.swap_percent || 0)
const swapData = data.map((d: any) => {
const total = Number(d.swap_total) || 0
const used = Number(d.swap_used) || 0
if (total === 0) return 0
return (used / total) * 100
})
memChart = createLineChart(memChartRef.value!, labels, [
{ label: 'Memory %', data: memData, borderColor: chartColors[1] },
{ label: 'Swap %', data: swapData, borderColor: chartColors[2] }
])
// 평균 계산 (Memory, Swap) + 사용량/전체용량 (BigInt는 문자열로 반환되므로 Number로 변환)
// 메모리 사용량 = total - free (free가 있으면 사용, 없으면 used 사용)
// 메모리 사용량 = memory_used (DB에서 계산된 값)
const validMem = memData.filter((v: number) => v > 0)
const validSwap = swapData.filter((v: number) => v >= 0)
const memUsedData = data.map((d: any) => {
const total = Number(d.memory_total) || 0
const free = Number(d.memory_free) || 0
const used = Number(d.memory_used) || 0
return free > 0 ? (total - free) : used
}).filter((v: number) => v > 0)
const memUsedData = data.map((d: any) => Number(d.memory_used) || 0).filter((v: number) => v > 0)
const avgMemUsedGB = memUsedData.length ? (memUsedData.reduce((a: number, b: number) => a + b, 0) / memUsedData.length / (1024 * 1024 * 1024)).toFixed(1) : '-'
const memTotalGB = data[0]?.memory_total ? (Number(data[0].memory_total) / (1024 * 1024 * 1024)).toFixed(1) : '-'
const swapUsedData = data.map((d: any) => Number(d.swap_used) || 0).filter((v: number) => v >= 0)

15
package-lock.json generated
View File

@@ -50,7 +50,6 @@
"resolved": "https://registry.npmjs.org/@babel/core/-/core-7.28.5.tgz",
"integrity": "sha512-e7jT4DxYvIDLk1ZHmU/m/mB19rex9sv0c2ftBtjSBv+kVM/902eh0fINUzD7UwLLNR+jU585GxUJ8/EBfAM5fw==",
"license": "MIT",
"peer": true,
"dependencies": {
"@babel/code-frame": "^7.27.1",
"@babel/generator": "^7.28.5",
@@ -3294,7 +3293,6 @@
"integrity": "sha512-1N9SBnWYOJTrNZCdh/yJE+t910Y128BoyY+zBLWhL3r0TYzlTmFdXrPwHL9DyFZmlEXNQQolTZh3KHV31QDhyA==",
"devOptional": true,
"license": "MIT",
"peer": true,
"dependencies": {
"undici-types": "~6.21.0"
}
@@ -3543,7 +3541,6 @@
"resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.5.26.tgz",
"integrity": "sha512-egp69qDTSEZcf4bGOSsprUr4xI73wfrY5oRs6GSgXFTiHrWj4Y3X5Ydtip9QMqiCMCPVwLglB9GBxXtTadJ3mA==",
"license": "MIT",
"peer": true,
"dependencies": {
"@babel/parser": "^7.28.5",
"@vue/compiler-core": "3.5.26",
@@ -3714,7 +3711,6 @@
"resolved": "https://registry.npmjs.org/acorn/-/acorn-8.15.0.tgz",
"integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
"license": "MIT",
"peer": true,
"bin": {
"acorn": "bin/acorn"
},
@@ -4059,7 +4055,6 @@
}
],
"license": "MIT",
"peer": true,
"dependencies": {
"baseline-browser-mapping": "^2.9.0",
"caniuse-lite": "^1.0.30001759",
@@ -4161,7 +4156,6 @@
"resolved": "https://registry.npmjs.org/cac/-/cac-6.7.14.tgz",
"integrity": "sha512-b6Ilus+c3RrdDk+JhLKUAQfzzgLEPy6wcXqS7f/xe1EETvsDP6GORG7SFuOs6cID5YkqchW/LXZbX5bc8j7ZcQ==",
"license": "MIT",
"peer": true,
"engines": {
"node": ">=8"
}
@@ -4239,7 +4233,6 @@
"resolved": "https://registry.npmjs.org/citty/-/citty-0.1.6.tgz",
"integrity": "sha512-tskPPKEs8D2KPafUypv2gxwJP8h/OaJmC82QQGGDQcHvXX43xF2VDACcJVmZ0EuSxkpO9Kc4MlrA3q0+FG58AQ==",
"license": "MIT",
"peer": true,
"dependencies": {
"consola": "^3.2.3"
}
@@ -7645,7 +7638,6 @@
"resolved": "https://registry.npmjs.org/oxc-parser/-/oxc-parser-0.102.0.tgz",
"integrity": "sha512-xMiyHgr2FZsphQ12ZCsXRvSYzmKXCm1ejmyG4GDZIiKOmhyt5iKtWq0klOfFsEQ6jcgbwrUdwcCVYzr1F+h5og==",
"license": "MIT",
"peer": true,
"dependencies": {
"@oxc-project/types": "^0.102.0"
},
@@ -7829,7 +7821,6 @@
"resolved": "https://registry.npmjs.org/pg/-/pg-8.16.3.tgz",
"integrity": "sha512-enxc1h0jA/aq5oSDMvqyW3q89ra6XIIDZgCX9vkMrnz5DFTw/Ny3Li2lFQ+pt3L6MCgm/5o2o8HW9hiJji+xvw==",
"license": "MIT",
"peer": true,
"dependencies": {
"pg-connection-string": "^2.9.1",
"pg-pool": "^3.10.1",
@@ -7962,7 +7953,6 @@
}
],
"license": "MIT",
"peer": true,
"dependencies": {
"nanoid": "^3.3.11",
"picocolors": "^1.1.1",
@@ -8714,7 +8704,6 @@
"resolved": "https://registry.npmjs.org/rollup/-/rollup-4.54.0.tgz",
"integrity": "sha512-3nk8Y3a9Ea8szgKhinMlGMhGMw89mqule3KWczxhIzqudyHdCIOHw8WJlj/r329fACjKLEh13ZSk7oE22kyeIw==",
"license": "MIT",
"peer": true,
"dependencies": {
"@types/estree": "1.0.8"
},
@@ -9575,7 +9564,6 @@
"integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
"devOptional": true,
"license": "Apache-2.0",
"peer": true,
"bin": {
"tsc": "bin/tsc",
"tsserver": "bin/tsserver"
@@ -10021,7 +10009,6 @@
"resolved": "https://registry.npmjs.org/vite/-/vite-7.3.0.tgz",
"integrity": "sha512-dZwN5L1VlUBewiP6H9s2+B3e3Jg96D0vzN+Ry73sOefebhYr9f94wwkMNN/9ouoU8pV1BqA1d1zGk8928cx0rg==",
"license": "MIT",
"peer": true,
"dependencies": {
"esbuild": "^0.27.0",
"fdir": "^6.5.0",
@@ -10378,7 +10365,6 @@
"resolved": "https://registry.npmjs.org/vue/-/vue-3.5.26.tgz",
"integrity": "sha512-SJ/NTccVyAoNUJmkM9KUqPcYlY+u8OVL1X5EW9RIs3ch5H2uERxyyIUI4MRxVCSOiEcupX9xNGde1tL9ZKpimA==",
"license": "MIT",
"peer": true,
"dependencies": {
"@vue/compiler-dom": "3.5.26",
"@vue/compiler-sfc": "3.5.26",
@@ -10415,7 +10401,6 @@
"resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.6.4.tgz",
"integrity": "sha512-Hz9q5sa33Yhduglwz6g9skT8OBPii+4bFn88w6J+J4MfEo4KRRpmiNG/hHHkdbRFlLBOqxN8y8gf2Fb0MTUgVg==",
"license": "MIT",
"peer": true,
"dependencies": {
"@vue/devtools-api": "^6.6.4"
},