|
|
<!DOCTYPE html> |
|
|
<html lang="fr"> |
|
|
|
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>Requirements Extractor</title> |
|
|
<link href="https://cdnjs.cloudflare.com/ajax/libs/daisyui/5.0.43/daisyui.css" rel="stylesheet" type="text/css" /> |
|
|
<script src="https://cdn.tailwindcss.com"></script> |
|
|
</head> |
|
|
|
|
|
<body class="bg-gray-100 min-h-screen"> |
|
|
|
|
|
<div id="loading-overlay" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden"> |
|
|
<div class="bg-white p-6 rounded-lg shadow-lg text-center"> |
|
|
<div id="loading-bar" class="w-64 h-4 bg-gray-200 rounded-full mb-4"> |
|
|
<div class="h-full bg-blue-500 rounded-full animate-pulse"></div> |
|
|
</div> |
|
|
<p id="progress-text" class="text-gray-700">Chargement en cours...</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="container mx-auto p-6"> |
|
|
<h1 class="text-3xl font-bold text-center mb-8">Requirements Extractor</h1> |
|
|
|
|
|
|
|
|
<div id="working-group-container" class="mb-6"> |
|
|
<label for="working-group-select" class="block text-sm font-medium text-gray-700 mb-2">Working Group</label> |
|
|
<select id="working-group-select" class="w-full p-2 border border-gray-300 rounded-md"> |
|
|
<option value="">Select a working group</option> |
|
|
<option value="SA1">SA1</option> |
|
|
<option value="SA2">SA2</option> |
|
|
<option value="SA3">SA3</option> |
|
|
<option value="SA4">SA4</option> |
|
|
<option value="SA5">SA5</option> |
|
|
<option value="SA6">SA6</option> |
|
|
<option value="CT1">CT1</option> |
|
|
<option value="CT2">CT2</option> |
|
|
<option value="CT3">CT3</option> |
|
|
<option value="CT4">CT4</option> |
|
|
<option value="CT5">CT5</option> |
|
|
<option value="CT6">CT6</option> |
|
|
</select> |
|
|
<button id="get-meetings-btn" class="mt-2 px-4 py-2 bg-blue-500 text-white rounded-md hover:bg-blue-600"> |
|
|
Get Meetings |
|
|
</button> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="meeting-container" class="mb-6 hidden"> |
|
|
<label for="meeting-select" class="block text-sm font-medium text-gray-700 mb-2">Meeting</label> |
|
|
<select id="meeting-select" class="w-full p-2 border border-gray-300 rounded-md"> |
|
|
<option value="">Select a meeting</option> |
|
|
</select> |
|
|
<button id="get-tdocs-btn" class="mt-2 px-4 py-2 bg-green-500 text-white rounded-md hover:bg-green-600"> |
|
|
Get TDocs |
|
|
</button> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="filters-container" class="mb-6 hidden"> |
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-4"> |
|
|
|
|
|
<div class="dropdown dropdown-bottom dropdown-center w-full mb-4"> |
|
|
<div tabindex="0" role="button" class="btn w-full justify-between" id="doc-type-filter-btn"> |
|
|
<span id="doc-type-filter-label">Type</span> |
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 ml-2" fill="none" viewBox="0 0 24 24" |
|
|
stroke="currentColor"> |
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" /> |
|
|
</svg> |
|
|
</div> |
|
|
<ul tabindex="0" |
|
|
class="dropdown-content z-[1] menu p-2 shadow bg-base-100 rounded-box w-full min-w-[200px] max-h-60 overflow-y-auto" |
|
|
id="doc-type-filter-menu"> |
|
|
|
|
|
</ul> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="dropdown dropdown-bottom dropdown-center w-full mb-4"> |
|
|
<div tabindex="0" role="button" class="btn w-full justify-between" id="status-dropdown-btn"> |
|
|
<span id="status-filter-label">Status (Tous)</span> |
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 ml-2" fill="none" viewBox="0 0 24 24" |
|
|
stroke="currentColor"> |
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" /> |
|
|
</svg> |
|
|
</div> |
|
|
<ul tabindex="0" |
|
|
class="dropdown-content z-[1] p-2 shadow bg-base-100 rounded-box w-full max-h-60 overflow-y-auto"> |
|
|
<li class="border-b pb-2 mb-2"> |
|
|
<label class="flex items-center gap-2 cursor-pointer"> |
|
|
<input type="checkbox" class="status-checkbox" value="all" checked> |
|
|
<span class="font-semibold">Tous</span> |
|
|
</label> |
|
|
</li> |
|
|
<div id="status-options" class="flex flex-col gap-1"></div> |
|
|
</ul> |
|
|
</div> |
|
|
|
|
|
<div class="dropdown dropdown-bottom dropdown-center w-full mb-4"> |
|
|
<div tabindex="0" role="button" class="btn w-full justify-between" id="agenda-dropdown-btn"> |
|
|
<span id="agenda-filter-label">Agenda Item (Tous)</span> |
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 ml-2" fill="none" viewBox="0 0 24 24" |
|
|
stroke="currentColor"> |
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" /> |
|
|
</svg> |
|
|
</div> |
|
|
<ul tabindex="0" |
|
|
class="dropdown-content z-[1] p-2 shadow bg-base-100 rounded-box w-full max-h-60 overflow-y-auto"> |
|
|
<li class="border-b pb-2 mb-2"> |
|
|
<label class="flex items-center gap-2 cursor-pointer"> |
|
|
<input type="checkbox" class="agenda-checkbox" value="all" checked> |
|
|
<span class="font-semibold">Tous</span> |
|
|
</label> |
|
|
</li> |
|
|
<div id="agenda-options" class="flex flex-col gap-1"></div> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="action-buttons-container" class="mb-6 hidden"> |
|
|
<div class="flex flex-wrap gap-2"> |
|
|
<button id="download-tdocs-btn" |
|
|
class="px-4 py-2 bg-purple-500 text-white rounded-md hover:bg-purple-600"> |
|
|
Download TDocs |
|
|
</button> |
|
|
<button id="extract-requirements-btn" |
|
|
class="px-4 py-2 bg-orange-500 text-white rounded-md hover:bg-orange-600"> |
|
|
Extract Requirements |
|
|
</button> |
|
|
<button id="find-requirements-btn" |
|
|
class="px-4 py-2 bg-red-500 text-white rounded-md hover:bg-red-600 hidden"> |
|
|
Find Requirements |
|
|
</button> |
|
|
<button id="categorize-requirements-btn" |
|
|
class="px-4 py-2 bg-yellow-500 text-white rounded-md hover:bg-yellow-600 hidden"> |
|
|
Categorize Requirements |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="flex justify-end mb-2 gap-2 items-center"> |
|
|
<span id="displayed-count" class="text-sm text-gray-700 bg-white rounded px-3 py-1 shadow"> |
|
|
0 document affiché |
|
|
</span> |
|
|
<span id="selected-count" class="text-sm text-blue-700 bg-blue-50 rounded px-3 py-1 shadow"> |
|
|
0 document sélectionné |
|
|
</span> |
|
|
</div> |
|
|
|
|
|
<div id="data-table-container" class="mb-6 hidden"> |
|
|
<table id="data-table" class="w-full bg-white rounded-lg shadow overflow-hidden"> |
|
|
<thead class="bg-gray-50"> |
|
|
<tr> |
|
|
<th class="px-4 py-2 text-left"> |
|
|
<input type="checkbox" id="select-all-checkbox"> |
|
|
</th> |
|
|
<th class="px-4 py-2 text-left">TDoc</th> |
|
|
<th class="px-4 py-2 text-left">Title</th> |
|
|
<th class="px-4 py-2 text-left">Type</th> |
|
|
<th class="px-4 py-2 text-left">Status</th> |
|
|
<th class="px-4 py-2 text-left">Agenda Item</th> |
|
|
<th class="px-4 py-2 text-left">URL</th> |
|
|
</tr> |
|
|
</thead> |
|
|
<tbody></tbody> |
|
|
</table> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="requirements-container" class="mb-6 hidden"> |
|
|
<h2 class="text-2xl font-bold mb-4">Requirements extracted</h2> |
|
|
<div id="requirements-list"></div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="query-requirements-container" class="mb-6 hidden"> |
|
|
<h2 class="text-2xl font-bold mb-4">Query requirements</h2> |
|
|
<div class="flex gap-2"> |
|
|
<input type="text" id="query-input" class="flex-1 p-2 border border-gray-300 rounded-md" |
|
|
placeholder="Enter your query..."> |
|
|
<button id="search-requirements-btn" |
|
|
class="px-4 py-2 bg-blue-500 text-white rounded-md hover:bg-blue-600"> |
|
|
Search |
|
|
</button> |
|
|
</div> |
|
|
<div id="query-results" class="mt-4"></div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="categorized-requirements-container" class="mb-6 hidden"> |
|
|
<h2 class="text-2xl font-bold mb-4">Requirements categories list</h2> |
|
|
<div id="categorized-requirements-list"></div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="solutions-action-buttons-container" class="mb-6 hidden"> |
|
|
<div class="flex flex-wrap gap-2 justify-center"> |
|
|
<button id="get-solutions-btn" |
|
|
class="px-4 py-2 bg-indigo-500 text-white rounded-md hover:bg-indigo-600"> |
|
|
Get Solutions |
|
|
</button> |
|
|
<button id="get-solutions-step-btn" |
|
|
class="px-4 py-2 bg-pink-500 text-white rounded-md hover:bg-pink-600"> |
|
|
Get Solutions (Step-by-step) |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="solutions-container" class="mb-6 hidden"> |
|
|
<h2 class="text-2xl font-bold mb-4">Solutions</h2> |
|
|
<div id="solutions-list"></div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<script src="/static/script.js"></script> |
|
|
</body> |
|
|
|
|
|
</html> |
