# RAG 챗봇 + LocalPCAgent 통합 프로젝트 계획 ## 프로젝트 개요 기존 RAG 챗봇(Flask 기반)에 LocalPCAgent 제어 기능을 추가하는 통합 작업입니다. Gradio UI 코드의 기능을 Flask+HTML/JS 구조에 이식합니다. ## 완료된 작업 - [x] 기본 Flask 기반 RAG 챗봇 백엔드 구현 - [x] LocalPCAgent 제어를 위한 API 엔드포인트 추가 (`app_device_routes.py`) - [x] Flask 백엔드와 LocalPCAgent 간 통신 로직 구현 - [x] 웹 UI에 LocalPCAgent 제어 화면 추가 (HTML/CSS) - [x] 웹 UI에서 LocalPCAgent 제어 기능을 위한 JavaScript 로직 구현 - [x] 프로젝트 코드 정리 및 최적화 - 불필요한 파일 및 코드 제거 - 모듈화된 코드 구조 개선 ## 프로젝트 구조 정리 - 주요 실행 파일을 확인하고 `app_revised.py`를 주 파일로 선택 - 애플리케이션 코드를 'app' 패키지로 모듈화: - 장치 제어 라우터: `app/app_device_routes.py` - 기본 API 라우터: `app/app_routes.py` - 검색기 초기화: `app/init_retriever.py` - 프런트엔드 코드 통합: - `templates/index.html`에 장치 제어 UI 섹션 - `static/js/app-device.js`에 장치 제어 JavaScript 코드 - `static/css/device-style.css`에 장치 제어 스타일 ## 현재 상태 코드 검토 결과 대부분의 통합 작업이 이미 완료된 상태입니다: - Flask 백엔드에 LocalPCAgent API 엔드포인트가 구현되어 있습니다 (`app_device_routes.py`) - 프론트엔드 UI에 장치 제어 탭이 추가되어 있습니다 (`index.html`) - 장치 제어를 위한 JavaScript 로직이 구현되어 있습니다 (`app-device.js`) - 기본 기능과 사용자 정의 명령어 실행 기능이 모두 구현되어 있습니다 ## 추가 개발 계획: 장치 목록 조회 기능 추가 ### 개발 목표 로컬PC에 연결된 장치(특히 COM 포트와 USB 장치)를 조회하는 기능을 추가합니다. ### 구현 요구사항 1. **로컬PC 장치 조회 Python 프로그램 개발** - COM 포트 및 USB 장치 목록 조회 - 장치별 상세 정보(제조사, 제품명, 시리얼 번호 등) 수집 - 멀티 플랫폼 지원(Windows, Linux, macOS) 2. **LocalPCAgent API 확장** - 장치 목록 조회 API 엔드포인트 추가 - 조회 결과 효율적인 전송 방식 구현 3. **UI 확장** - 장치 제어 탭에 장치 목록 조회 섹션 추가 - 조회 결과 표시 UI 구현 - 장치 타입별 필터링 기능 구현 ### 기술 스택 - 백엔드: Python(`pyserial`, `pyusb`), Flask - 프론트엔드: HTML, CSS, JavaScript - 통신: REST API, JSON 포맷 ### 구현 계획 1. **로컬PC 장치 조회 Python 스크립트 개발** - `scan_devices.py` 스크립트 작성 - 테스트 및 디버깅 2. **LocalPCAgent에 통합** - LocalPCAgent 프로그램 목록에 등록 - API 엔드포인트 테스트 3. **Flask 백엔드 API 확장** - `app_device_routes.py`에 장치 조회 API 추가 - 데이터 포맷 및 오류 처리 구현 4. **프론트엔드 UI 개발** - `index.html`에 장치 목록 조회 섹션 추가 - `app-device.js`에 장치 조회 관련 함수 추가 - 필요시 CSS 스타일 추가 ## 남은 작업 - [ ] 로컬PC 장치 조회 Python 스크립트 개발 - [ ] LocalPCAgent 서버에 장치 조회 기능 통합 - [ ] Flask 백엔드 장치 조회 API 구현 - [ ] 프론트엔드 UI 확장 - [ ] 전체 시스템 테스트 및 디버깅 - [ ] 최종 코드 리뷰 및 문서화 보완 ## 파일 구조 - `app_revised.py`: 메인 Flask 애플리케이션 - `app.py`: 단순화된 진입점 (app_revised.py 호출) - `app/`: 애플리케이션 모듈 - `__init__.py`: 패키지 초기화 - `app_device_routes.py`: LocalPCAgent 제어 API 라우트 - `app_routes.py`: 기본 RAG 챗봇 API 라우트 - `init_retriever.py`: RAG 모델 초기화 코드 - `static/`: 정적 파일 - `css/`: 스타일시트 - `style.css`: 기본 스타일 - `device-style.css`: 장치 제어 스타일 - `js/`: JavaScript 파일 - `app.js`: 메인 JavaScript - `app-core.js`: 핵심 기능 - `app-device.js`: 장치 제어 기능 - `app-docs.js`: 문서 관리 기능 - `app-llm.js`: LLM 관련 기능 - `templates/`: HTML 템플릿 - `index.html`: 메인 애플리케이션 페이지 - `login.html`: 로그인 페이지 - `loading.html`: 로딩 페이지 - `docs/`: 프로젝트 문서 - `project_plan.md`: 프로젝트 계획 문서 - `cleanup_plan.md`: 코드 정리 계획 문서 - **신규 파일:** - `LocalPCAgent/programs/scan_devices.py`: 장치 조회 Python 스크립트 ## LocalPCAgent 통합 요약 - **백엔드 API**: `app/app_device_routes.py`에 구현 - `/api/device/status`: 장치 서버 상태 확인 - `/api/device/connect`: 사용자 지정 URL 연결 - `/api/device/list`: 장치 목록 조회 - `/api/device/programs`: 실행 가능한 프로그램 목록 조회 - `/api/device/programs//execute`: 등록된 프로그램 실행 - `/api/device/execute-custom`: 사용자 정의 프로그램 실행 - **추가 예정:** `/api/device/scan-ports`: COM 포트 및 USB 장치 목록 조회 - **프런트엔드**: 기능 완성 - 장치 제어 탭 UI: `templates/index.html`에 구현 - JavaScript 로직: `static/js/app-device.js`에 구현 - 스타일: `static/css/device-style.css`에 구현 ## 주의사항 - JavaScript는 직접 LocalPCAgent와 통신하지 않고 Flask 백엔드를 통해 통신 - 모든 장치 관련 API는 인증된 사용자만 접근 가능 (`login_required` 데코레이터 적용) - 로깅 코드 유지하여 디버깅 용이하게 함