뭐야 이게? 구도는 다 망가지고 드래그앤드랍도안되고.

deployment.html

@@ -76,23 +76,13 @@
                 배포 시작하기
             </button>
         </div>
-
         <!-- 칸반 보드 -->
         <div class="grid grid-cols-1 md:grid-cols-4 gap-6">
             <!-- 대기 문서 -->
             <div class="bg-gray-50 rounded-xl p-4">
                 <h3 class="font-semibold text-gray-800 mb-4 text-center">대기 문서 📥</h3>
             <div id="waitingColumn" class="space-y-4 min-h-96">
-                <div class="document-card bg-white rounded-lg p-4 shadow-md border border-gray-200 cursor-move" draggable="true" data-document-id="1">
-                    <div class="flex justify-between items-start mb-2">
-                    <span class="text-sm font-medium text-gray-700">건축 도면 #2456</span>
-                    <span class="priority-badge bg-red-100 text-red-800 px-2 py-1 rounded-full text-xs">높음</span>
-                </div>
-                <div class="text-xs text-gray-500 mb-2">도면</div>
-                <div class="flex justify-between items-center">
-                    <span class="text-xs text-gray-400">마감: 2024-03-15</span>
-                    <button class="worker-select-btn text-xs bg-primary-500 text-white px-2 py-1 rounded">작업자 선택</button>
-                </div>
+                <!-- 동적으로 생성될 문서 카드들 -->
             </div>
 </div>
 
@@ -100,16 +90,7 @@
             <div class="bg-blue-50 rounded-xl p-4">
                 <h3 class="font-semibold text-blue-800 mb-4 text-center">배포 중 🚀</h3>
             <div id="deployingColumn" class="space-y-4 min-h-96">
-                <div class="document-card bg-white rounded-lg p-4 shadow-md border border-gray-200 cursor-move" draggable="true" data-document-id="2">
-                    <div class="flex justify-between items-start mb-2">
-                    <span class="text-sm font-medium text-gray-700">시공 계획서 #1890</span>
-                    <span class="priority-badge bg-yellow-100 text-yellow-800 px-2 py-1 rounded-full text-xs">보통</span>
-                </div>
-                <div class="text-xs text-gray-500 mb-2">계획서</div>
-                <div class="flex justify-between items-center">
-                    <span class="text-xs text-gray-400">마감: 2024-03-20</span>
-                    <button class="worker-select-btn text-xs bg-primary-500 text-white px-2 py-1 rounded">재배포</button>
-                </div>
+                <!-- 동적으로 생성될 문서 카드들 -->
             </div>
 </div>
 
@@ -117,16 +98,7 @@
             <div class="bg-yellow-50 rounded-xl p-4">
                 <h3 class="font-semibold text-yellow-800 mb-4 text-center">진행 중 ⚡</h3>
             <div id="progressColumn" class="space-y-4 min-h-96">
-                <div class="document-card bg-white rounded-lg p-4 shadow-md border border-gray-200 cursor-move" draggable="true" data-document-id="3">
-                    <div class="flex justify-between items-start mb-2">
-                    <span class="text-sm font-medium text-gray-700">공사 명세서 #3124</span>
-                    <span class="priority-badge bg-green-100 text-green-800 px-2 py-1 rounded-full text-xs">낮음</span>
-                </div>
-                <div class="text-xs text-gray-500 mb-2">명세서</div>
-                <div class="flex justify-between items-center">
-                    <span class="text-xs text-gray-400">마감: 2024-03-25</span>
-                    <button class="worker-select-btn text-xs bg-primary-500 text-white px-2 py-1 rounded">작업자 변경</button>
-                </div>
+                <!-- 동적으로 생성될 문서 카드들 -->
             </div>
 </div>
 
@@ -134,20 +106,24 @@
             <div class="bg-green-50 rounded-xl p-4">
                 <h3 class="font-semibold text-green-800 mb-4 text-center">완료 ✅</h3>
             <div id="completedColumn" class="space-y-4 min-h-96">
-                <div class="document-card bg-white rounded-lg p-4 shadow-md border border-gray-200 cursor-move" draggable="true" data-document-id="4">
-                    <div class="flex justify-between items-start mb-2">
-                    <span class="text-sm font-medium text-gray-700">안전 계획서 #4567</span>
-                    <span class="priority-badge bg-red-100 text-red-800 px-2 py-1 rounded-full text-xs">높음</span>
-                </div>
-                <div class="text-xs text-gray-500 mb-2">계획서</div>
-                <div class="flex justify-between items-center">
-                    <span class="text-xs text-gray-400">마감: 2024-03-12</span>
-                    <button class="worker-select-btn text-xs bg-primary-500 text-white px-2 py-1 rounded">검수 대기</button>
-                </div>
+                <!-- 동적으로 생성될 문서 카드들 -->
             </div>
 </div>
         </div>
-    </main>
+
+        <!-- 작업자 선택 모달 -->
+        <div id="workerModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden">
+            <div class="bg-white rounded-xl p-6 max-w-md w-full mx-4">
+                <h3 class="text-lg font-semibold mb-4">작업자 선택</h3>
+                <div id="workerList" class="worker-list max-h-64 overflow-y-auto">
+                    <!-- 동적으로 생성될 작업자 목록 -->
+                </div>
+                <button class="w-full bg-gray-500 hover:bg-gray-600 text-white px-4 py-2 rounded-lg font-medium transition-all duration-300 mt-4" onclick="hideWorkerModal()">
+                    닫기
+                </button>
+            </div>
+        </div>
+</main>
 
     <custom-footer></custom-footer>
 

deployment.js

@@ -1,3 +1,4 @@
+
 // 작업 배포 관리 스크립트
 document.addEventListener('DOMContentLoaded', function() {
     // 샘플 문서 데이터
@@ -18,7 +19,6 @@ document.addEventListener('DOMContentLoaded', function() {
         { id: 4, name: '최교정', group: 'C팀', status: 'available', currentTasks: 1 },
         { id: 5, name: '정정밀', group: 'B팀', status: 'available', currentTasks: 4 }
     ];
-
     // 문서 카드 생성 함수
     function createDocumentCard(document) {
         const priorityColors = {
@@ -40,7 +40,6 @@ document.addEventListener('DOMContentLoaded', function() {
         <div class="text-xs text-gray-500 mb-2">${document.type}</div>
         <div class="flex justify-between items-center">
             <span class="text-xs text-gray-400">마감: ${document.deadline}</span>
-        <div class="flex space-x-1">
             <button class="worker-select-btn text-xs bg-primary-500 text-white px-2 py-1 rounded">
                 작업자 선택
             </button>
@@ -48,8 +47,7 @@ document.addEventListener('DOMContentLoaded', function() {
     </div>
         `;
     }
-
-    // 작업자 목록 표시 함수
+// 작업자 목록 표시 함수
     function showWorkerList(workers) {
         const workerList = workers.map(worker => `
             <div class="worker-item bg-gray-50 rounded-lg p-3 mb-2 cursor-pointer hover:bg-gray-100 transition-colors" data-worker-id="${worker.id}">
@@ -79,7 +77,6 @@ document.addEventListener('DOMContentLoaded', function() {
 
     document.body.appendChild(workerModal);
 }
-
 // 드래그 앤 드롭 기능
 function initializeDragAndDrop() {
     const documentCards = document.querySelectorAll('.document-card');
@@ -123,7 +120,6 @@ function initializeDragAndDrop() {
         });
     });
 }
-
 // 문서 상태 업데이트
 function updateDocumentStatus(documentId, columnId) {
     console.log(`문서 ${documentId}가 ${columnId}로 이동되었습니다.');

style.css

@@ -80,7 +80,6 @@ body {
     background: linear-gradient(135deg, #0ea5e9 0%, #0369a1 100%);
     transition: width 0.3s ease;
 }
-
 /* 배포 관리 스타일 */
 .document-card {
     transition: all 0.3s ease;
@@ -117,3 +116,28 @@ body {
     font-size: 0.75rem;
     font-weight: 600;
 }
+
+/* 드래그 앤 드롭 개선 스타일 */
+.document-card {
+    user-select: none;
+    -webkit-user-select: none;
+}
+
+.worker-list {
+    scrollbar-width: thin;
+    scrollbar-color: #cbd5e1 #f1f5f9;
+}
+
+.worker-list::-webkit-scrollbar {
+    width: 6px;
+}
+
+.worker-list::-webkit-scrollbar-track {
+    background: #f1f5f9;
+    border-radius: 3px;
+}
+
+.worker-list::-webkit-scrollbar-thumb {
+    background-color: #cbd5e1;
+    border-radius: 3px;
+}