|
|
<!DOCTYPE html> |
|
|
<html lang="fr" data-theme="light"> |
|
|
|
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>Requirements Extractor</title> |
|
|
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/full.css" rel="stylesheet"> |
|
|
<script src="https://cdn.tailwindcss.com"></script> |
|
|
</head> |
|
|
|
|
|
<body class="p-8 bg-base-100"> |
|
|
<div class="container mx-auto"> |
|
|
<h1 class="text-4xl font-bold text-center mb-8">Requirements Extractor</h1> |
|
|
<div class="" id="dataFrameForm"> |
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6"> |
|
|
<select class="select select-bordered" id="workingGroupSelect"> |
|
|
<option disabled="" selected="" value="">Working Group</option> |
|
|
<option>SA1</option> |
|
|
<option>SA2</option> |
|
|
<option>SA3</option> |
|
|
<option>SA4</option> |
|
|
<option>SA5</option> |
|
|
<option>SA6</option> |
|
|
<option>CT1</option> |
|
|
<option>CT2</option> |
|
|
<option>CT3</option> |
|
|
<option>CT4</option> |
|
|
<option>CT5</option> |
|
|
<option>CT6</option> |
|
|
</select> |
|
|
<select class="select select-bordered" id="meetingSelect" disabled=""> |
|
|
<option disabled="" selected="" value="">Select a working group</option> |
|
|
</select> |
|
|
<button class="btn" id="getTDocs">Get TDocs</button> |
|
|
</div> |
|
|
</div> |
|
|
<div class="hidden" id="filters"> |
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6"> |
|
|
<select class="select select-bordered" id="docType"> |
|
|
<option disabled="" selected="" value="">Type</option> |
|
|
<option>Tous</option> |
|
|
</select> |
|
|
|
|
|
<select class="select select-bordered" id="docStatus"> |
|
|
<option disabled="" selected="" value="">Status</option> |
|
|
<option>Tous</option> |
|
|
</select> |
|
|
|
|
|
<select class="select select-bordered" id="agendaItem"> |
|
|
<option disabled="" selected="" value="">Agenda Item</option> |
|
|
<option>Tous</option> |
|
|
</select> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="flex justify-center mt-12 min-h-[10vh] hidden" id="queryReqForm"> |
|
|
<div class="w-full max-w-md"> |
|
|
<div class="grid grid-cols-1 gap-4"> |
|
|
<textarea placeholder="Enter your problem description here ..." |
|
|
class="w-full mx-auto px-4 py-2 border rounded" id="problemDescription"></textarea> |
|
|
<button class="w-1/2 mx-auto px-4 py-2 bg-blue-600 text-white rounded hover:bg-blue-700" |
|
|
id="queryReq"> |
|
|
Find requirements |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<center> |
|
|
<span class="loading loading-bars loading-xl hidden" id="loadingBar"></span> |
|
|
<p class="hidden" id="progressText"></p> |
|
|
</center> |
|
|
|
|
|
|
|
|
<div class="max-h-[65vh] overflow-y-auto mt-12" id="dataFrameDiv"> |
|
|
<table class="table table-zebra w-full" id="dataFrame"> |
|
|
<thead class="sticky top-0 bg-base-200 z-10"> |
|
|
<tr class="bg-base-200"> |
|
|
<th>TDoc</th> |
|
|
<th>Title</th> |
|
|
<th>Type</th> |
|
|
<th>Status</th> |
|
|
<th>Agenda Item</th> |
|
|
<th>URL</th> |
|
|
</tr> |
|
|
</thead> |
|
|
<tbody> |
|
|
</tbody> |
|
|
</table> |
|
|
</div> |
|
|
|
|
|
<div id="categorizeReqContainer" class="hidden"> |
|
|
<div class="w-full max-w-[100%] mx-auto p-6" id="carousels"> |
|
|
<h1 class="text-xl font-bold mb-8 text-center">Requirements categories list</h1> |
|
|
|
|
|
</div> |
|
|
<div class="w-full max-w-[100%] mx-auto px-6 pb-6" id="catReqActions"> |
|
|
<div class="flex items-center justify-center gap-4 flex-wrap"> |
|
|
|
|
|
<div class="flex items-center gap-2"> |
|
|
<input |
|
|
type="number" |
|
|
id="limitInput" |
|
|
placeholder="10" |
|
|
min="1" |
|
|
max="9999" |
|
|
class="w-20 px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent" |
|
|
> |
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<button |
|
|
id="getSolutions" |
|
|
class="px-4 py-2 bg-blue-600 text-white text-sm font-medium rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-colors duration-200" |
|
|
> |
|
|
Get solutions |
|
|
</button> |
|
|
|
|
|
<button |
|
|
id="getSolutionsStepByStep" |
|
|
class="px-4 py-2 bg-green-600 text-white text-sm font-medium rounded-md hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-green-500 focus:ring-offset-2 transition-colors duration-200" |
|
|
> |
|
|
Get solutions (Step-by-step) |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div id="criticizeSoluceContainer" class="hidden"> |
|
|
|
|
|
</div> |
|
|
|
|
|
<center> |
|
|
<div id="buttons"> |
|
|
<p id="reqStatus" class="mt-6 hidden">Requirements extracted</p> |
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6"> |
|
|
<button class="btn mt-6 hidden" id="getReqs">Extract Requirements</button> |
|
|
<button class="btn mt-6 hidden" id="downloadZip">Download TDocs</button> |
|
|
<button class="btn mt-6 hidden" id="searchReq">Query requirements</button> |
|
|
<button class="btn mt-6 hidden" id="categorizeReq">Categorize requirements</button> |
|
|
</div> |
|
|
</div> |
|
|
</center> |
|
|
</div> |
|
|
|
|
|
<script src="/static/script.js"></script> |
|
|
</body> |
|
|
</html> |
|
|
|
