Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Doc_Map_Agent - R&D Document Authoring Accelerator</title> | |
| <link rel="stylesheet" href="css/styles.css"> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"> | |
| <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet"> | |
| <script src="https://d3js.org/d3.v7.min.js"></script> | |
| </head> | |
| <body> | |
| <!-- Header --> | |
| <header> | |
| <div class="container header-container"> | |
| <div class="logo"> | |
| <img src="images/logo.png" alt="Doc_Map_Agent Logo" id="logo-placeholder"> | |
| <h1>Doc_Map_Agent</h1> | |
| </div> | |
| <div class="header-actions"> | |
| <div class="search-bar"> | |
| <input type="text" placeholder="Search documents..."> | |
| <button><i class="fas fa-search"></i></button> | |
| </div> | |
| <button class="settings-btn"><i class="fas fa-cog"></i></button> | |
| </div> | |
| </div> | |
| </header> | |
| <!-- Breadcrumb --> | |
| <div class="breadcrumb"> | |
| <div class="container"> | |
| <ul id="breadcrumb-list"> | |
| <li><a href="#" onclick="navigateTo('home')">Home</a></li> | |
| </ul> | |
| </div> | |
| </div> | |
| <!-- Main Content --> | |
| <main> | |
| <div class="container"> | |
| <!-- Home Section --> | |
| <div id="home" class="page-section"> | |
| <!-- Welcome Banner --> | |
| <div class="card mb-3"> | |
| <div class="card-body"> | |
| <h2 class="text-center">Welcome to Doc_Map_Agent</h2> | |
| <p class="text-center">A comprehensive R&D document authoring accelerator</p> | |
| </div> | |
| </div> | |
| <!-- Main Navigation Cards --> | |
| <div class="grid"> | |
| <!-- Document Catalog Card --> | |
| <div class="dashboard-card"> | |
| <i class="fas fa-book"></i> | |
| <h3>Document Catalog</h3> | |
| <p>Browse and search all document types across R&D phases</p> | |
| <a href="#" class="btn btn-primary mt-2" onclick="navigateTo('document-catalog')">Explore</a> | |
| </div> | |
| <!-- Process Visualization Card --> | |
| <div class="dashboard-card"> | |
| <i class="fas fa-project-diagram"></i> | |
| <h3>Process Visualization</h3> | |
| <p>Visualize document workflows and dependencies</p> | |
| <a href="#" class="btn btn-primary mt-2" onclick="navigateTo('process-visualization')">Explore</a> | |
| </div> | |
| <!-- Assessment Tools Card --> | |
| <div class="dashboard-card"> | |
| <i class="fas fa-clipboard-check"></i> | |
| <h3>Assessment Tools</h3> | |
| <p>Evaluate document ecosystem and identify gaps</p> | |
| <a href="#" class="btn btn-primary mt-2" onclick="navigateTo('assessment-tools')">Explore</a> | |
| </div> | |
| <!-- Document Blueprints Card --> | |
| <div class="dashboard-card"> | |
| <i class="fas fa-file-alt"></i> | |
| <h3>Document Blueprints</h3> | |
| <p>Access templates and prompt libraries for document authoring</p> | |
| <a href="#" class="btn btn-primary mt-2" onclick="navigateTo('document-blueprints')">Explore</a> | |
| </div> | |
| </div> | |
| <!-- Recent Activity --> | |
| <div class="card mt-3"> | |
| <div class="card-header"> | |
| Recent Activity | |
| </div> | |
| <div class="card-body"> | |
| <ul> | |
| <li>04/05/2025 - Assessment completed for Client XYZ Pharma</li> | |
| <li>04/02/2025 - Document blueprint updated: Clinical Study Report</li> | |
| <li>03/28/2025 - New process flow created: IND Submission</li> | |
| </ul> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Document Catalog Section --> | |
| <div id="document-catalog" class="page-section" style="display: none;"> | |
| <h2 class="page-title">Document Catalog</h2> | |
| <div class="two-column"> | |
| <!-- Filters Sidebar --> | |
| <div class="sidebar"> | |
| <h3 class="sidebar-title">Filters</h3> | |
| <div class="filter-group"> | |
| <h4>Phase</h4> | |
| <div class="filter-options"> | |
| <div class="filter-option"> | |
| <label><input type="checkbox" name="phase" value="discovery"> Discovery</label> | |
| </div> | |
| <div class="filter-option"> | |
| <label><input type="checkbox" name="phase" value="preclinical"> Preclinical</label> | |
| </div> | |
| <div class="filter-option"> | |
| <label><input type="checkbox" name="phase" value="clinical"> Clinical</label> | |
| </div> | |
| <div class="filter-option"> | |
| <label><input type="checkbox" name="phase" value="regulatory"> Regulatory</label> | |
| </div> | |
| <div class="filter-option"> | |
| <label><input type="checkbox" name="phase" value="medical"> Medical Affairs</label> | |
| </div> | |
| <div class="filter-option"> | |
| <label><input type="checkbox" name="phase" value="postmarket"> Post-Marketing</label> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="filter-group"> | |
| <h4>Document Type</h4> | |
| <div class="filter-options"> | |
| <div class="filter-option"> | |
| <label><input type="checkbox" name="type" value="protocol"> Protocol</label> | |
| </div> | |
| <div class="filter-option"> | |
| <label><input type="checkbox" name="type" value="report"> Report</label> | |
| </div> | |
| <div class="filter-option"> | |
| <label><input type="checkbox" name="type" value="application"> Application</label> | |
| </div> | |
| <div class="filter-option"> | |
| <label><input type="checkbox" name="type" value="form"> Form</label> | |
| </div> | |
| <div class="filter-option"> | |
| <label><input type="checkbox" name="type" value="template"> Template</label> | |
| </div> | |
| </div> | |
| </div> | |
| <button class="btn btn-secondary btn-block">Clear All</button> | |
| <button class="btn btn-primary btn-block mt-2">Apply Filters</button> | |
| <button class="btn btn-primary btn-block mt-2" onclick="addNewDocumentType()">Add New Document</button> | |
| </div> | |
| <!-- Results Panel --> | |
| <div class="results-panel"> | |
| <div class="results-header"> | |
| <h3>Results (125 documents)</h3> | |
| <div class="sort-options"> | |
| <label>Sort by: | |
| <select> | |
| <option>Relevance</option> | |
| <option>Name (A-Z)</option> | |
| <option>Phase</option> | |
| <option>Document Type</option> | |
| </select> | |
| </label> | |
| </div> | |
| </div> | |
| <!-- Document Cards --> | |
| <div class="document-card"> | |
| <h3>Clinical Study Protocol</h3> | |
| <div class="document-card-meta"> | |
| <span><i class="fas fa-layer-group"></i> Clinical</span> | |
| <span><i class="fas fa-user"></i> Clinical Operations</span> | |
| </div> | |
| <p>Defines the objectives, design, methodology, and statistical considerations for a clinical trial.</p> | |
| <div class="document-card-actions"> | |
| <a href="#" class="btn btn-secondary" onclick="viewDocumentDetails('clinical-protocol')">View Details</a> | |
| <a href="#" class="btn btn-primary" onclick="editDocument('clinical-protocol')">Edit</a> | |
| </div> | |
| </div> | |
| <div class="document-card"> | |
| <h3>Investigator's Brochure</h3> | |
| <div class="document-card-meta"> | |
| <span><i class="fas fa-layer-group"></i> Clinical</span> | |
| <span><i class="fas fa-user"></i> Medical Writing</span> | |
| </div> | |
| <p>Compilation of clinical and non-clinical data on the investigational product relevant to study in human subjects.</p> | |
| <div class="document-card-actions"> | |
| <a href="#" class="btn btn-secondary">View Details</a> | |
| <a href="#" class="btn btn-primary">Edit</a> | |
| </div> | |
| </div> | |
| <div class="document-card"> | |
| <h3>New Drug Application</h3> | |
| <div class="document-card-meta"> | |
| <span><i class="fas fa-layer-group"></i> Regulatory</span> | |
| <span><i class="fas fa-user"></i> Regulatory Affairs</span> | |
| </div> | |
| <p>Formal submission to FDA requesting approval to market a new drug in the United States.</p> | |
| <div class="document-card-actions"> | |
| <a href="#" class="btn btn-secondary">View Details</a> | |
| <a href="#" class="btn btn-primary">Edit</a> | |
| </div> | |
| </div> | |
| <div class="document-card"> | |
| <h3>Target ID Report</h3> | |
| <div class="document-card-meta"> | |
| <span><i class="fas fa-layer-group"></i> Discovery</span> | |
| <span><i class="fas fa-user"></i> Research</span> | |
| </div> | |
| <p>Documents identifying and validating biological targets for potential therapeutic intervention.</p> | |
| <div class="document-card-actions"> | |
| <a href="#" class="btn btn-secondary">View Details</a> | |
| <a href="#" class="btn btn-primary">Edit</a> | |
| </div> | |
| </div> | |
| <button class="btn btn-secondary btn-block mt-3">Load More Results</button> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Document Details Section --> | |
| <div id="document-details" class="page-section" style="display: none;"> | |
| <h2 class="page-title">Clinical Study Protocol</h2> | |
| <div class="two-column"> | |
| <!-- Document Summary --> | |
| <div class="sidebar"> | |
| <div class="text-center mb-2"> | |
| <i class="fas fa-file-alt" style="font-size: 4rem; color: var(--secondary-color);"></i> | |
| <p class="mt-1">Phase: Clinical</p> | |
| </div> | |
| <div class="sidebar-actions"> | |
| <button class="btn btn-secondary btn-block mb-1">View Template</button> | |
| <button class="btn btn-secondary btn-block mb-1">View Prompts</button> | |
| <button class="btn btn-primary btn-block">Export</button> | |
| <button class="btn btn-danger btn-block mt-2" onclick="deleteDocumentType('clinical-protocol')">Delete Document</button> | |
| </div> | |
| </div> | |
| <!-- Document Details --> | |
| <div> | |
| <div class="card mb-3"> | |
| <div class="card-header">Basic Information</div> | |
| <div class="card-body"> | |
| <p><strong>Owner:</strong> Clinical Operations</p> | |
| <p><strong>Purpose:</strong> Defines the objectives, design, methodology, and statistical considerations for a clinical trial.</p> | |
| <p><strong>Format:</strong> PDF, DOCX</p> | |
| <p><strong>Typical Length:</strong> 50-100 pages</p> | |
| <p><strong>Update Frequency:</strong> As needed</p> | |
| <p><strong>Retention:</strong> Life of product + 5 years</p> | |
| <p><strong>Security Classification:</strong> Confidential</p> | |
| </div> | |
| </div> | |
| <div class="card mb-3"> | |
| <div class="card-header">Document Dependencies</div> | |
| <div class="card-body"> | |
| <h4>Predecessor Documents:</h4> | |
| <ul> | |
| <li>Investigational Product Profile <a href="#" onclick="removeDocumentDependency('clinical-protocol', 'inv-product-profile', 'predecessor')" class="text-danger"><i class="fas fa-times"></i></a></li> | |
| <li>Clinical Development Plan <a href="#" onclick="removeDocumentDependency('clinical-protocol', 'clinical-dev-plan', 'predecessor')" class="text-danger"><i class="fas fa-times"></i></a></li> | |
| </ul> | |
| <button class="btn btn-secondary btn-sm" onclick="addDocumentDependency('clinical-protocol', 'predecessor')">+ Add Predecessor</button> | |
| <h4 class="mt-2">Successor Documents:</h4> | |
| <ul> | |
| <li>Informed Consent Form <a href="#" onclick="removeDocumentDependency('clinical-protocol', 'informed-consent', 'successor')" class="text-danger"><i class="fas fa-times"></i></a></li> | |
| <li>Case Report Form <a href="#" onclick="removeDocumentDependency('clinical-protocol', 'case-report-form', 'successor')" class="text-danger"><i class="fas fa-times"></i></a></li> | |
| <li>Statistical Analysis Plan <a href="#" onclick="removeDocumentDependency('clinical-protocol', 'stat-analysis-plan', 'successor')" class="text-danger"><i class="fas fa-times"></i></a></li> | |
| <li>Clinical Study Report <a href="#" onclick="removeDocumentDependency('clinical-protocol', 'clinical-study-report', 'successor')" class="text-danger"><i class="fas fa-times"></i></a></li> | |
| </ul> | |
| <button class="btn btn-secondary btn-sm" onclick="addDocumentDependency('clinical-protocol', 'successor')">+ Add Successor</button> | |
| <div class="mt-3"> | |
| <button class="btn btn-secondary" onclick="navigateTo('dependency-mapping')">View Dependency Map</button> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="card"> | |
| <div class="card-header">Process Workflow</div> | |
| <div class="card-body"> | |
| <ol> | |
| <li>Protocol Synopsis Development</li> | |
| <li>Full Protocol Drafting</li> | |
| <li>Internal Review</li> | |
| <li>Medical/Scientific Review</li> | |
| <li>Statistical Review</li> | |
| <li>Regulatory Review</li> | |
| <li>Final Approval</li> | |
| <li>Distribution</li> | |
| </ol> | |
| <button class="btn btn-secondary mt-2" onclick="navigateTo('process-visualization')">View Full Workflow</button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Dependency Mapping Section --> | |
| <div id="dependency-mapping" class="page-section" style="display: none;"> | |
| <h2 class="page-title">Document Dependency Mapping</h2> | |
| <div class="card mb-3"> | |
| <div class="card-header"> | |
| <div class="d-flex justify-content-between align-items-center"> | |
| <div> | |
| <label for="focus-document">Focus Document: </label> | |
| <select id="focus-document" class="form-control-inline"> | |
| <option selected>Clinical Study Protocol</option> | |
| <option>Investigator's Brochure</option> | |
| <option>New Drug Application</option> | |
| <option>Target ID Report</option> | |
| </select> | |
| </div> | |
| <div> | |
| <label>Dependency Depth: </label> | |
| <label class="ml-2"><input type="radio" name="depth" value="direct"> Direct Only</label> | |
| <label class="ml-2"><input type="radio" name="depth" value="level1" checked> 1 Level</label> | |
| <label class="ml-2"><input type="radio" name="depth" value="level2"> 2 Levels</label> | |
| <label class="ml-2"><input type="radio" name="depth" value="all"> All Levels</label> | |
| </div> | |
| <div> | |
| <label>View Mode: </label> | |
| <label class="ml-2"><input type="radio" name="view-mode" value="hierarchical"> Hierarchical</label> | |
| <label class="ml-2"><input type="radio" name="view-mode" value="network" checked> Network</label> | |
| <label class="ml-2"><input type="radio" name="view-mode" value="matrix"> Matrix</label> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="visualization-container" id="dependency-network"> | |
| <!-- D3.js visualization will be rendered here --> | |
| </div> | |
| <div class="card mt-3"> | |
| <div class="card-header">Dependency Analysis</div> | |
| <div class="card-body"> | |
| <h4>Critical Dependencies:</h4> | |
| <ul> | |
| <li>Investigational Product Profile → Clinical Study Protocol</li> | |
| <li>Clinical Study Protocol → Informed Consent Form</li> | |
| <li>Clinical Study Protocol → Case Report Form</li> | |
| </ul> | |
| <h4 class="mt-2">Impact Analysis:</h4> | |
| <p>Changes to Clinical Study Protocol will impact 4 downstream documents and potentially delay study start by 2-4 weeks.</p> | |
| <h4 class="mt-2">Recommendations:</h4> | |
| <ul> | |
| <li>Prioritize Protocol finalization to unblock dependent docs</li> | |
| <li>Consider parallel development of Statistical Analysis Plan</li> | |
| <li>Establish version control process for Protocol amendments</li> | |
| </ul> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Process Visualization Section --> | |
| <div id="process-visualization" class="page-section" style="display: none;"> | |
| <h2 class="page-title">Process Visualization</h2> | |
| <div class="card mb-3"> | |
| <div class="card-header"> | |
| <div class="d-flex justify-content-between align-items-center"> | |
| <div> | |
| <label for="process-select">Process: </label> | |
| <select id="process-select" class="form-control-inline"> | |
| <option selected>Clinical Trial</option> | |
| <option>IND Submission</option> | |
| <option>NDA Submission</option> | |
| <option>Protocol Development</option> | |
| </select> | |
| </div> | |
| <div> | |
| <label>Display Options: </label> | |
| <label class="ml-2"><input type="checkbox" checked> Documents</label> | |
| <label class="ml-2"><input type="checkbox" checked> Stakeholders</label> | |
| <label class="ml-2"><input type="checkbox" checked> Timelines</label> | |
| <label class="ml-2"><input type="checkbox"> Dependencies</label> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="visualization-container" id="process-flow"> | |
| <!-- D3.js visualization will be rendered here --> | |
| </div> | |
| <div class="card mt-3"> | |
| <div class="card-header">Process Details</div> | |
| <div class="card-body"> | |
| <p><strong>Selected Process:</strong> Clinical Trial Execution</p> | |
| <p><strong>Duration:</strong> Typically 1-5 years</p> | |
| <h4 class="mt-2">Key Milestones:</h4> | |
| <ul> | |
| <li>First Patient First Visit</li> | |
| <li>Last Patient First Visit</li> | |
| <li>Last Patient Last Visit</li> | |
| <li>Database Lock</li> | |
| </ul> | |
| <h4 class="mt-2">Critical Documents:</h4> | |
| <ul> | |
| <li>Clinical Trial Protocol <a href="#" onclick="viewDocumentDetails('clinical-protocol')">View</a></li> | |
| <li>Informed Consent Form <a href="#">View</a></li> | |
| <li>Case Report Form <a href="#">View</a></li> | |
| <li>Clinical Study Report <a href="#">View</a></li> | |
| </ul> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Process Simulation Section --> | |
| <div id="process-simulation" class="page-section" style="display: none;"> | |
| <h2 class="page-title">Process Simulation & Bottleneck Analysis</h2> | |
| <div class="two-column"> | |
| <!-- Simulation Settings --> | |
| <div class="sidebar"> | |
| <h3 class="sidebar-title">Simulation Settings</h3> | |
| <div class="form-group"> | |
| <label for="sim-process-select">Process:</label> | |
| <select id="sim-process-select" class="form-control"> | |
| <option selected>Clinical Trial</option> | |
| <option>IND Submission</option> | |
| <option>NDA Submission</option> | |
| <option>Protocol Development</option> | |
| </select> | |
| </div> | |
| <h4 class="mt-2">Resource Allocation:</h4> | |
| <div class="form-group"> | |
| <label>Medical Writing:</label> | |
| <select class="form-control"> | |
| <option>1</option> | |
| <option>2</option> | |
| <option selected>3</option> | |
| <option>4</option> | |
| <option>5</option> | |
| </select> | |
| </div> | |
| <div class="form-group"> | |
| <label>Regulatory:</label> | |
| <select class="form-control"> | |
| <option>1</option> | |
| <option selected>2</option> | |
| <option>3</option> | |
| <option>4</option> | |
| <option>5</option> | |
| </select> | |
| </div> | |
| <div class="form-group"> | |
| <label>Clinical Ops:</label> | |
| <select class="form-control"> | |
| <option>1</option> | |
| <option>2</option> | |
| <option>3</option> | |
| <option selected>4</option> | |
| <option>5</option> | |
| </select> | |
| </div> | |
| <div class="form-group"> | |
| <label>Statistics:</label> | |
| <select class="form-control"> | |
| <option>1</option> | |
| <option selected>2</option> | |
| <option>3</option> | |
| <option>4</option> | |
| <option>5</option> | |
| </select> | |
| </div> | |
| <h4 class="mt-2">Timeline Constraints:</h4> | |
| <div class="form-group"> | |
| <label>Start Date:</label> | |
| <input type="date" class="form-control" value="2025-04-15"> | |
| </div> | |
| <div class="form-group"> | |
| <label>End Date:</label> | |
| <input type="date" class="form-control" value="2025-10-15"> | |
| </div> | |
| <button class="btn btn-primary btn-block mt-2" onclick="runSimulation()">Run Simulation</button> | |
| </div> | |
| <!-- Simulation Results --> | |
| <div> | |
| <div class="visualization-container mb-3" id="simulation-timeline"> | |
| <!-- D3.js visualization will be rendered here --> | |
| </div> | |
| <div class="card"> | |
| <div class="card-header">Simulation Results</div> | |
| <div class="card-body"> | |
| <p><strong>Estimated Timeline:</strong> 187 days (04/15/2025 - 10/19/2025)</p> | |
| <p><strong>Status:</strong> <span style="color: var(--danger-color);">4 days behind target end date</span></p> | |
| <h4 class="mt-2">Identified Bottlenecks:</h4> | |
| <ul> | |
| <li><strong>Protocol Review (15 days)</strong> - Regulatory resources constrained</li> | |
| <li><strong>CRF Development (21 days)</strong> - Data Management resources needed</li> | |
| <li><strong>Statistical Analysis (18 days)</strong> - Statistics team overallocated</li> | |
| </ul> | |
| <h4 class="mt-2">Recommendations:</h4> | |
| <ul> | |
| <li>Increase Regulatory resources from 2 to 3 (saves 5 days)</li> | |
| <li>Start CRF development in parallel with Protocol finalization</li> | |
| <li>Consider outsourcing part of statistical analysis</li> | |
| </ul> | |
| <div class="mt-2"> | |
| <button class="btn btn-secondary">Export Results</button> | |
| <button class="btn btn-secondary">Save Scenario</button> | |
| <button class="btn btn-secondary">Compare Scenarios</button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Assessment Tools Section --> | |
| <div id="assessment-tools" class="page-section" style="display: none;"> | |
| <h2 class="page-title">Document Ecosystem Assessment</h2> | |
| <div class="two-column"> | |
| <!-- Assessment Configuration --> | |
| <div class="sidebar"> | |
| <h3 class="sidebar-title">Assessment Type</h3> | |
| <div class="form-group"> | |
| <label><input type="radio" name="assessment-type" value="quick"> Quick Scan</label> | |
| </div> | |
| <div class="form-group"> | |
| <label><input type="radio" name="assessment-type" value="comprehensive" checked> Comprehensive</label> | |
| </div> | |
| <div class="form-group"> | |
| <label><input type="radio" name="assessment-type" value="compliance"> Compliance Focus</label> | |
| </div> | |
| <h4 class="mt-3">Scope:</h4> | |
| <div class="form-group"> | |
| <label><input type="checkbox" checked> Discovery</label> | |
| </div> | |
| <div class="form-group"> | |
| <label><input type="checkbox" checked> Preclinical</label> | |
| </div> | |
| <div class="form-group"> | |
| <label><input type="checkbox" checked> Clinical</label> | |
| </div> | |
| <div class="form-group"> | |
| <label><input type="checkbox" checked> Regulatory</label> | |
| </div> | |
| <div class="form-group"> | |
| <label><input type="checkbox" checked> Medical Affairs</label> | |
| </div> | |
| <div class="form-group"> | |
| <label><input type="checkbox" checked> Post-Marketing</label> | |
| </div> | |
| <button class="btn btn-secondary btn-block mt-2">Save Settings</button> | |
| </div> | |
| <!-- Client Information --> | |
| <div> | |
| <div class="card mb-3"> | |
| <div class="card-header">Client Information</div> | |
| <div class="card-body"> | |
| <div class="form-group"> | |
| <label for="client-name">Client Name:</label> | |
| <input type="text" id="client-name" class="form-control"> | |
| </div> | |
| <div class="form-group"> | |
| <label for="industry">Industry:</label> | |
| <select id="industry" class="form-control"> | |
| <option selected>Pharmaceutical</option> | |
| <option>Biotechnology</option> | |
| <option>Medical Device</option> | |
| <option>CRO</option> | |
| </select> | |
| </div> | |
| <div class="form-group"> | |
| <label for="project">Project:</label> | |
| <input type="text" id="project" class="form-control"> | |
| </div> | |
| <div class="form-group"> | |
| <label for="assessment-date">Assessment Date:</label> | |
| <input type="date" id="assessment-date" class="form-control" value="2025-04-06"> | |
| </div> | |
| <div class="form-group"> | |
| <label for="assessor">Assessor:</label> | |
| <input type="text" id="assessor" class="form-control"> | |
| </div> | |
| <button class="btn btn-primary btn-block">Start New Assessment</button> | |
| </div> | |
| </div> | |
| <div class="card"> | |
| <div class="card-header">Assessment Tools</div> | |
| <div class="card-body"> | |
| <div class="grid"> | |
| <div class="card p-3"> | |
| <h4>Gap Analysis</h4> | |
| <p>Identify missing or outdated documents in the client's ecosystem.</p> | |
| <button class="btn btn-secondary mt-2">Start</button> | |
| </div> | |
| <div class="card p-3"> | |
| <h4>Compliance Check</h4> | |
| <p>Verify regulatory compliance of document ecosystem.</p> | |
| <button class="btn btn-secondary mt-2">Start</button> | |
| </div> | |
| <div class="card p-3"> | |
| <h4>Maturity Model</h4> | |
| <p>Assess process maturity and identify improvement areas.</p> | |
| <button class="btn btn-secondary mt-2">Start</button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Document Blueprints Section --> | |
| <div id="document-blueprints" class="page-section" style="display: none;"> | |
| <h2 class="page-title">Document Blueprint: Clinical Study Protocol</h2> | |
| <div class="two-column"> | |
| <!-- Blueprint Actions --> | |
| <div class="sidebar"> | |
| <h3 class="sidebar-title">Blueprint Actions</h3> | |
| <button class="btn btn-primary btn-block mb-2">Edit Blueprint</button> | |
| <button class="btn btn-secondary btn-block mb-2">Export Template</button> | |
| <button class="btn btn-secondary btn-block mb-2">View Prompts</button> | |
| <button class="btn btn-secondary btn-block">Clone Blueprint</button> | |
| </div> | |
| <!-- Blueprint Content --> | |
| <div> | |
| <div class="card mb-3"> | |
| <div class="card-header">Section Structure</div> | |
| <div class="card-body"> | |
| <ol> | |
| <li>Protocol Title Page</li> | |
| <li>Synopsis</li> | |
| <li>Table of Contents</li> | |
| <li>List of Abbreviations</li> | |
| <li>Protocol Introduction</li> | |
| <li>Study Objectives</li> | |
| <li><a href="#" onclick="showSectionDetails('study-design')">Study Design</a></li> | |
| <li>Subject Selection</li> | |
| <li>Study Treatments</li> | |
| <li>Study Procedures</li> | |
| <li>Adverse Events</li> | |
| <li>Statistical Methods</li> | |
| <li>Data Management</li> | |
| <li>Ethics and Regulations</li> | |
| <li>References</li> | |
| <li>Appendices</li> | |
| </ol> | |
| </div> | |
| </div> | |
| <div class="card" id="section-details"> | |
| <div class="card-header">Section Details: 7. Study Design</div> | |
| <div class="card-body"> | |
| <p><strong>Purpose:</strong> Describes the overall design of the study, including study type, randomization, blinding, and duration.</p> | |
| <h4 class="mt-3">Content Guidelines:</h4> | |
| <ul> | |
| <li>Clearly state study design type (e.g., parallel, crossover)</li> | |
| <li>Describe randomization and blinding procedures</li> | |
| <li>Define study periods and visit schedule</li> | |
| <li>Include study schematic diagram</li> | |
| <li>Specify duration of subject participation</li> | |
| </ul> | |
| <h4 class="mt-3">Prompt Library:</h4> | |
| <ul> | |
| <li><a href="#">Generate study design description based on parameters</a></li> | |
| <li><a href="#">Create study schematic diagram from design elements</a></li> | |
| <li><a href="#">Generate visit schedule based on procedures and timepoints</a></li> | |
| </ul> | |
| <button class="btn btn-primary mt-3">Edit Section</button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </main> | |
| <!-- Footer --> | |
| <footer> | |
| <div class="container footer-container"> | |
| <div class="copyright"> | |
| © 2025 Doc_Map_Agent | |
| </div> | |
| <div class="footer-links"> | |
| <a href="#">About</a> | |
| <a href="#">Contact</a> | |
| </div> | |
| </div> | |
| </footer> | |
| <!-- JavaScript --> | |
| <script src="js/main.js"></script> | |
| <script src="js/visualizations.js"></script> | |
| </body> | |
| </html> | |