From 05d096b08f58d699817e3ff57272c65e40e51316 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EA=B9=80=EB=B3=B4=EA=B3=A4?=
 <lightone2017@codebridge-x.com>
Date: Thu, 12 Mar 2026 11:17:19 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20[juil]=20=EA=B1=B4=EC=84=A4PMIS=20?=
 =?UTF-8?q?=EC=A2=8C=EC=B8=A1=20=EC=82=AC=EC=9D=B4=EB=93=9C=EB=B0=94=20?=
 =?UTF-8?q?=EB=B0=8F=20=EA=B0=9C=EC=9D=B8=EC=A0=95=EB=B3=B4=20=EA=B4=80?=
 =?UTF-8?q?=EB=A6=AC=20=EB=AA=A8=EB=8B=AC=20=EA=B5=AC=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- PMIS 전용 좌측 사이드바 (사용자 프로필 + 네비게이션 메뉴)
- 개인정보 관리 모달 (보기/수정 모드 전환)
- 연락처, 이메일, 성별 편집 및 서버 저장 기능
- 프로필 조회/수정 JSON API 엔드포인트 추가
- 3컬럼 레이아웃 (좌측 사이드바 + 대시보드 + 우측 퀵메뉴)
---
 .../Controllers/Juil/PlanningController.php   |  48 +++
 .../views/juil/construction-pmis.blade.php    | 354 +++++++++++++++---
 routes/web.php                                |   2 +
 3 files changed, 362 insertions(+), 42 deletions(-)

diff --git a/app/Http/Controllers/Juil/PlanningController.php b/app/Http/Controllers/Juil/PlanningController.php
index cba356ba..980ef2df 100644
--- a/app/Http/Controllers/Juil/PlanningController.php
+++ b/app/Http/Controllers/Juil/PlanningController.php
@@ -53,4 +53,52 @@ public function pmisWeather(WeatherService $weatherService): JsonResponse
 
         return response()->json(['forecasts' => array_slice($forecasts, 0, 2)]);
     }
+
+    public function pmisProfile(): JsonResponse
+    {
+        $user = auth()->user();
+        $tenantId = session('current_tenant_id', 1);
+
+        $departments = $user->getDepartmentsForTenant($tenantId);
+        $roles = $user->getRolesForTenant($tenantId);
+
+        return response()->json([
+            'user' => [
+                'name' => $user->name,
+                'user_id' => $user->user_id,
+                'email' => $user->email,
+                'phone' => $user->phone,
+                'role' => $user->role,
+                'profile_photo_path' => $user->profile_photo_path,
+                'department' => $departments->first()?->name ?? '-',
+                'position' => $user->getOption('position') ?? '-',
+                'gender' => data_get($user->options, 'gender', ''),
+                'role_names' => $roles->pluck('name')->join(', ') ?: '-',
+                'created_at' => $user->created_at?->format('Y-m-d'),
+                'last_login_at' => $user->last_login_at?->format('Y-m-d H:i'),
+            ],
+        ]);
+    }
+
+    public function pmisProfileUpdate(Request $request): JsonResponse
+    {
+        $request->validate([
+            'phone' => ['nullable', 'string', 'max:20'],
+            'email' => ['nullable', 'email', 'max:255'],
+            'gender' => ['nullable', 'string', 'in:남,여'],
+        ]);
+
+        $user = auth()->user();
+        $user->phone = $request->input('phone');
+        $user->email = $request->input('email');
+
+        $options = $user->options ?? [];
+        $options['gender'] = $request->input('gender');
+        $user->options = $options;
+
+        $user->updated_by = $user->id;
+        $user->save();
+
+        return response()->json(['success' => true, 'message' => '개인정보가 저장되었습니다.']);
+    }
 }
diff --git a/resources/views/juil/construction-pmis.blade.php b/resources/views/juil/construction-pmis.blade.php
index ae3d5057..bb4dc11d 100644
--- a/resources/views/juil/construction-pmis.blade.php
+++ b/resources/views/juil/construction-pmis.blade.php
@@ -11,7 +11,282 @@
 @include('partials.react-cdn')
 <script type="text/babel">
 @verbatim
-const { useState } = React;
+const { useState, useEffect, useCallback } = React;
+
+const CSRF_TOKEN = document.querySelector('meta[name="csrf-token"]')?.content || '';
+
+/* ════════════════════════════════════════════════
+   PMIS 좌측 사이드바 + 개인정보 모달
+   ════════════════════════════════════════════════ */
+
+const PMIS_MENUS = [
+    { icon: 'ri-building-2-line', label: 'BIM 관리', id: 'bim' },
+    { icon: 'ri-line-chart-line', label: '시공관리', id: 'construction' },
+    { icon: 'ri-file-list-3-line', label: '품질관리', id: 'quality' },
+    { icon: 'ri-shield-check-line', label: '안전관리', id: 'safety' },
+    { icon: 'ri-folder-line', label: '자료실', id: 'archive' },
+];
+
+function PmisSidebar({ onOpenProfile }) {
+    const [profile, setProfile] = useState(null);
+
+    useEffect(() => {
+        fetch('/juil/construction-pmis/profile', { headers: { 'Accept': 'application/json' } })
+            .then(r => r.json())
+            .then(data => setProfile(data.user))
+            .catch(() => {});
+    }, []);
+
+    return (
+        <div className="bg-white rounded-xl border border-gray-200 shadow-sm flex flex-col shrink-0" style={{ width: 220 }}>
+            {/* 사용자 프로필 영역 */}
+            <div className="p-4 border-b border-gray-100 text-center relative">
+                {/* 설정 아이콘 */}
+                <button
+                    onClick={onOpenProfile}
+                    className="absolute top-3 right-3 p-1 rounded-lg text-gray-400 hover:text-gray-600 hover:bg-gray-100 transition"
+                    title="개인정보 관리"
+                >
+                    <i className="ri-settings-3-line text-lg"></i>
+                </button>
+
+                {/* 아바타 */}
+                <div className="w-16 h-16 rounded-full bg-gray-200 mx-auto mb-2 flex items-center justify-center overflow-hidden">
+                    {profile?.profile_photo_path ? (
+                        <img src={profile.profile_photo_path} className="w-full h-full object-cover" />
+                    ) : (
+                        <svg className="w-10 h-10 text-gray-400" fill="currentColor" viewBox="0 0 24 24">
+                            <path d="M12 12c2.7 0 4.8-2.1 4.8-4.8S14.7 2.4 12 2.4 7.2 4.5 7.2 7.2 9.3 12 12 12zm0 2.4c-3.2 0-9.6 1.6-9.6 4.8v2.4h19.2v-2.4c0-3.2-6.4-4.8-9.6-4.8z"/>
+                        </svg>
+                    )}
+                </div>
+
+                {/* 이름 */}
+                <div className="text-sm font-bold text-gray-800 mb-1">{profile?.name || '...'}</div>
+
+                {/* 현장 정보 */}
+                <div className="text-[11px] text-gray-400 bg-gray-50 rounded-lg px-2 py-1.5 leading-relaxed">
+                    {profile?.department || '-'}
+                </div>
+            </div>
+
+            {/* 네비게이션 메뉴 */}
+            <div className="p-2 flex-1">
+                {PMIS_MENUS.map(menu => (
+                    <button
+                        key={menu.id}
+                        className="w-full flex items-center justify-between px-3 py-2.5 rounded-lg text-left hover:bg-gray-50 transition text-sm text-gray-700 group"
+                    >
+                        <div className="flex items-center gap-2.5">
+                            <i className={`${menu.icon} text-base text-gray-400 group-hover:text-blue-500`}></i>
+                            <span className="font-medium">{menu.label}</span>
+                        </div>
+                        <i className="ri-arrow-right-s-line text-gray-300"></i>
+                    </button>
+                ))}
+            </div>
+        </div>
+    );
+}
+
+/* ─── 개인정보 관리 모달 ─── */
+function ProfileModal({ isOpen, onClose }) {
+    const [profile, setProfile] = useState(null);
+    const [loading, setLoading] = useState(true);
+    const [editMode, setEditMode] = useState(false);
+    const [form, setForm] = useState({ phone: '', email: '', gender: '' });
+    const [saving, setSaving] = useState(false);
+
+    const loadProfile = useCallback(() => {
+        setLoading(true);
+        fetch('/juil/construction-pmis/profile', { headers: { 'Accept': 'application/json' } })
+            .then(r => r.json())
+            .then(data => {
+                setProfile(data.user);
+                setForm({ phone: data.user.phone || '', email: data.user.email || '', gender: data.user.gender || '' });
+                setLoading(false);
+            })
+            .catch(() => setLoading(false));
+    }, []);
+
+    useEffect(() => {
+        if (isOpen) { loadProfile(); setEditMode(false); }
+    }, [isOpen]);
+
+    const handleSave = async () => {
+        setSaving(true);
+        try {
+            const res = await fetch('/juil/construction-pmis/profile', {
+                method: 'PUT',
+                headers: { 'Content-Type': 'application/json', 'X-CSRF-TOKEN': CSRF_TOKEN, 'Accept': 'application/json' },
+                body: JSON.stringify(form),
+            });
+            const data = await res.json();
+            if (data.success) {
+                setEditMode(false);
+                loadProfile();
+            } else {
+                alert(data.message || '저장에 실패했습니다.');
+            }
+        } catch { alert('저장 중 오류가 발생했습니다.'); }
+        setSaving(false);
+    };
+
+    if (!isOpen) return null;
+
+    return (
+        <div className="fixed inset-0 z-[60] flex items-center justify-center" onClick={onClose}>
+            <div className="absolute inset-0 bg-black/50 backdrop-blur-sm"></div>
+            <div
+                className="relative bg-white rounded-xl shadow-2xl flex flex-col"
+                style={{ width: '90vw', maxWidth: '900px', maxHeight: '90vh' }}
+                onClick={e => e.stopPropagation()}
+            >
+                {/* 헤더 */}
+                <div className="flex items-center justify-between px-6 py-4 border-b border-gray-200 shrink-0">
+                    <h2 className="text-lg font-bold text-gray-800">개인정보 관리</h2>
+                    <button onClick={onClose} className="p-2 rounded-lg hover:bg-gray-100 text-gray-400 hover:text-gray-600 transition">
+                        <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
+                        </svg>
+                    </button>
+                </div>
+
+                {/* 콘텐츠 */}
+                <div className="flex-1 overflow-auto p-6">
+                    {loading ? (
+                        <div className="flex items-center justify-center py-12 text-gray-400">불러오는 중...</div>
+                    ) : profile && (
+                        <div className="flex gap-6" style={{ alignItems: 'flex-start' }}>
+                            {/* 좌측: 아바타 + 비밀번호 변경 */}
+                            <div className="flex flex-col items-center gap-3 shrink-0" style={{ width: 120 }}>
+                                <div className="w-24 h-24 rounded-lg border-2 border-gray-200 bg-gray-100 flex items-center justify-center overflow-hidden">
+                                    {profile.profile_photo_path ? (
+                                        <img src={profile.profile_photo_path} className="w-full h-full object-cover" />
+                                    ) : (
+                                        <svg className="w-14 h-14 text-gray-300" fill="currentColor" viewBox="0 0 24 24">
+                                            <path d="M12 12c2.7 0 4.8-2.1 4.8-4.8S14.7 2.4 12 2.4 7.2 4.5 7.2 7.2 9.3 12 12 12zm0 2.4c-3.2 0-9.6 1.6-9.6 4.8v2.4h19.2v-2.4c0-3.2-6.4-4.8-9.6-4.8z"/>
+                                        </svg>
+                                    )}
+                                </div>
+                                <button className="text-xs text-gray-500 border border-gray-300 rounded px-3 py-1 hover:bg-gray-50 transition">
+                                    비밀번호 변경
+                                </button>
+                            </div>
+
+                            {/* 우측: 정보 테이블 */}
+                            <div className="flex-1" style={{ minWidth: 0 }}>
+                                <table className="w-full text-sm border-collapse">
+                                    <tbody>
+                                        <tr className="border-t border-gray-200">
+                                            <td className="bg-gray-50 px-4 py-3 font-semibold text-gray-600 whitespace-nowrap" style={{ width: 80 }}>이름</td>
+                                            <td className="px-4 py-3 text-gray-800">{profile.name}</td>
+                                            <td className="bg-gray-50 px-4 py-3 font-semibold text-gray-600 whitespace-nowrap" style={{ width: 80 }}>연락처</td>
+                                            <td className="px-4 py-3">
+                                                {editMode ? (
+                                                    <input type="text" value={form.phone} onChange={e => setForm(f => ({...f, phone: e.target.value}))}
+                                                        className="w-full px-2 py-1 border border-gray-300 rounded text-sm" />
+                                                ) : (
+                                                    <span className="text-gray-800">{profile.phone || '-'}</span>
+                                                )}
+                                            </td>
+                                        </tr>
+                                        <tr className="border-t border-gray-200">
+                                            <td className="bg-gray-50 px-4 py-3 font-semibold text-gray-600">부서</td>
+                                            <td className="px-4 py-3 text-gray-800">{profile.department}</td>
+                                            <td className="bg-gray-50 px-4 py-3 font-semibold text-gray-600">아이디</td>
+                                            <td className="px-4 py-3 text-gray-800">{profile.user_id}</td>
+                                        </tr>
+                                        <tr className="border-t border-gray-200">
+                                            <td className="bg-gray-50 px-4 py-3 font-semibold text-gray-600">직책</td>
+                                            <td className="px-4 py-3 text-gray-800">{profile.position}</td>
+                                            <td className="bg-gray-50 px-4 py-3 font-semibold text-gray-600">이메일</td>
+                                            <td className="px-4 py-3">
+                                                {editMode ? (
+                                                    <input type="email" value={form.email} onChange={e => setForm(f => ({...f, email: e.target.value}))}
+                                                        className="w-full px-2 py-1 border border-gray-300 rounded text-sm" />
+                                                ) : (
+                                                    <span className="text-gray-800">{profile.email || '-'}</span>
+                                                )}
+                                            </td>
+                                        </tr>
+                                        <tr className="border-t border-b border-gray-200">
+                                            <td className="bg-gray-50 px-4 py-3 font-semibold text-gray-600">권한</td>
+                                            <td className="px-4 py-3 text-gray-800">{profile.role_names}</td>
+                                            <td className="bg-gray-50 px-4 py-3 font-semibold text-gray-600">성별</td>
+                                            <td className="px-4 py-3">
+                                                {editMode ? (
+                                                    <select value={form.gender} onChange={e => setForm(f => ({...f, gender: e.target.value}))}
+                                                        className="px-2 py-1 border border-gray-300 rounded text-sm">
+                                                        <option value="">선택</option>
+                                                        <option value="남">남</option>
+                                                        <option value="여">여</option>
+                                                    </select>
+                                                ) : (
+                                                    <span className="text-gray-800">{profile.gender || '-'}</span>
+                                                )}
+                                            </td>
+                                        </tr>
+                                    </tbody>
+                                </table>
+
+                                {/* 로그인 정보 */}
+                                <div className="mt-5">
+                                    <h4 className="text-xs font-bold text-gray-500 mb-2">로그인 정보</h4>
+                                    <table className="w-full text-xs border-collapse">
+                                        <thead>
+                                            <tr className="bg-gray-50 border-y border-gray-200">
+                                                <th className="px-3 py-2 text-center text-gray-500">최근 로그인</th>
+                                                <th className="px-3 py-2 text-center text-gray-500">가입일</th>
+                                            </tr>
+                                        </thead>
+                                        <tbody>
+                                            <tr className="border-b border-gray-100">
+                                                <td className="px-3 py-2 text-center text-gray-700">{profile.last_login_at || '-'}</td>
+                                                <td className="px-3 py-2 text-center text-gray-700">{profile.created_at || '-'}</td>
+                                            </tr>
+                                        </tbody>
+                                    </table>
+                                </div>
+                            </div>
+                        </div>
+                    )}
+                </div>
+
+                {/* 푸터 버튼 */}
+                <div className="flex items-center justify-end gap-2 px-6 py-4 border-t border-gray-200 shrink-0">
+                    {editMode ? (
+                        <>
+                            <button
+                                onClick={handleSave}
+                                disabled={saving}
+                                className="px-5 py-2 bg-red-600 text-white rounded-lg hover:bg-red-700 transition text-sm font-semibold disabled:opacity-50"
+                            >
+                                {saving ? '저장 중...' : '저장'}
+                            </button>
+                            <button onClick={() => setEditMode(false)} className="px-5 py-2 bg-white border border-gray-300 text-gray-600 rounded-lg hover:bg-gray-50 transition text-sm">
+                                취소
+                            </button>
+                        </>
+                    ) : (
+                        <>
+                            <button
+                                onClick={() => setEditMode(true)}
+                                className="px-5 py-2 bg-red-600 text-white rounded-lg hover:bg-red-700 transition text-sm font-semibold"
+                            >
+                                수정
+                            </button>
+                            <button onClick={onClose} className="px-5 py-2 bg-white border border-gray-300 text-gray-600 rounded-lg hover:bg-gray-50 transition text-sm">
+                                닫기
+                            </button>
+                        </>
+                    )}
+                </div>
+            </div>
+        </div>
+    );
+}
+
 
 /* ─── 색상 팔레트 ─── */
 const C = {
@@ -851,56 +1126,51 @@ className={`flex-1 px-4 py-3 text-sm font-medium transition-all ${
 function ConstructionPmis() {
     const [showFlowModal, setShowFlowModal] = useState(false);
     const [showKccModal, setShowKccModal] = useState(false);
+    const [showProfileModal, setShowProfileModal] = useState(false);
 
     return (
-        <div className="p-6">
-            {/* 페이지 헤더 */}
-            <div className="flex items-center justify-between mb-5">
-                <div>
-                    <h1 className="text-2xl font-bold text-gray-800">건설PMIS</h1>
-                    <p className="text-sm text-gray-500 mt-1">SAM 건설 프로젝트 관리 시스템</p>
+        <div className="flex gap-5 p-5" style={{ alignItems: 'flex-start' }}>
+            {/* 좌측 PMIS 사이드바 */}
+            <PmisSidebar onOpenProfile={() => setShowProfileModal(true)} />
+
+            {/* 메인 콘텐츠 */}
+            <div className="flex-1 flex flex-col gap-5" style={{ minWidth: 0 }}>
+                {/* 상단 2컬럼: 날씨 + 금일 출역 현황 */}
+                <div className="flex gap-5" style={{ alignItems: 'stretch' }}>
+                    <WeatherWidget />
+                    <AttendanceWidget />
                 </div>
+                {/* 하단: 업무 진행 현황 */}
+                <WorkProgressWidget />
             </div>
 
-            {/* 대시보드 */}
-            <div className="flex gap-5" style={{ alignItems: 'flex-start' }}>
-                {/* 메인 영역 */}
-                <div className="flex-1 flex flex-col gap-5" style={{ minWidth: 0 }}>
-                    {/* 상단 2컬럼: 날씨 + 금일 출역 현황 */}
-                    <div className="flex gap-5" style={{ alignItems: 'stretch' }}>
-                        <WeatherWidget />
-                        <AttendanceWidget />
-                    </div>
-                    {/* 하단: 업무 진행 현황 */}
-                    <WorkProgressWidget />
-                </div>
-
-                {/* 우측 사이드 */}
-                <div className="flex flex-col gap-4 shrink-0" style={{ width: 220 }}>
-                    <QuickMenuWidget />
-                    <button
-                        onClick={() => setShowFlowModal(true)}
-                        className="w-full flex items-center justify-center gap-2 px-4 py-3 bg-blue-600 text-white rounded-xl hover:bg-blue-700 transition shadow-sm font-semibold text-sm"
-                    >
-                        업무 FLOW 보기
-                        <svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2.5} d="M9 5l7 7-7 7" />
-                        </svg>
-                    </button>
-                    <button
-                        onClick={() => setShowKccModal(true)}
-                        className="w-full flex items-center justify-center gap-2 px-4 py-2.5 bg-white text-gray-500 border border-gray-200 rounded-xl hover:bg-gray-50 transition text-xs"
-                    >
-                        <svg className="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z" />
-                        </svg>
-                        KCC 자료 참고
-                    </button>
-                </div>
+            {/* 우측 사이드 */}
+            <div className="flex flex-col gap-4 shrink-0" style={{ width: 220 }}>
+                <QuickMenuWidget />
+                <button
+                    onClick={() => setShowFlowModal(true)}
+                    className="w-full flex items-center justify-center gap-2 px-4 py-3 bg-blue-600 text-white rounded-xl hover:bg-blue-700 transition shadow-sm font-semibold text-sm"
+                >
+                    업무 FLOW 보기
+                    <svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2.5} d="M9 5l7 7-7 7" />
+                    </svg>
+                </button>
+                <button
+                    onClick={() => setShowKccModal(true)}
+                    className="w-full flex items-center justify-center gap-2 px-4 py-2.5 bg-white text-gray-500 border border-gray-200 rounded-xl hover:bg-gray-50 transition text-xs"
+                >
+                    <svg className="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z" />
+                    </svg>
+                    KCC 자료 참고
+                </button>
             </div>
 
+            {/* 모달들 */}
             <FlowModal isOpen={showFlowModal} onClose={() => setShowFlowModal(false)} />
             <KccRefModal isOpen={showKccModal} onClose={() => setShowKccModal(false)} />
+            <ProfileModal isOpen={showProfileModal} onClose={() => setShowProfileModal(false)} />
         </div>
     );
 }
diff --git a/routes/web.php b/routes/web.php
index f181b424..ff8a2947 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -1726,6 +1726,8 @@
     Route::get('/workflow', [PlanningController::class, 'workflow'])->name('workflow');
     Route::get('/construction-pmis', [PlanningController::class, 'constructionPmis'])->name('construction-pmis');
     Route::get('/construction-pmis/weather', [PlanningController::class, 'pmisWeather'])->name('construction-pmis.weather');
+    Route::get('/construction-pmis/profile', [PlanningController::class, 'pmisProfile'])->name('construction-pmis.profile');
+    Route::put('/construction-pmis/profile', [PlanningController::class, 'pmisProfileUpdate'])->name('construction-pmis.profile.update');
 
     // 공사현장 사진대지
     Route::prefix('construction-photos')->name('construction-photos.')->group(function () {