Consolidate suite into two tools; restore Rev 0 features
- Home page: two cards (SOP Configuration / Work Package Creator); SOP card turns green + "Review" once complete (persisted to localStorage), WP card locked until SOP is done - Header: white background with dark text; remove duplicate title next to logo - Move Step Comments toggle into the header; restore Usage Logs analytics - Load Sample: project MICRON_PH1_CUP_HPM_FMCS INSTALL, PM Mariano Sanchez - Team tab: add Assistant Project Manager + repeatable "Add Team Member" - Sign-Offs: add Assistant Project Manager to additional roles - Sequencing: restore Rev 0 pre-sequenced drag-and-drop (gates, arrows) - Sources: restore Rev 0 pre-loaded list; defaults are deletable + addable - WP Creator: replace broken stub with the real creator embedded in the WP tab, auto-loading the completed SOP from localStorage - Remove duplicate standalone SOP tool (sop-config-*) Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -14,13 +14,16 @@
|
||||
<div class="header-left">
|
||||
<a href="index.html" class="logo" title="Back to Home">
|
||||
<img src="prime-controls-logo.jpg" alt="Prime Controls" style="height: 36px; width: auto;">
|
||||
<div class="logo-text">Work Package Suite</div>
|
||||
</a>
|
||||
<div class="header-title">Work Package Suite</div>
|
||||
<div class="header-subtitle" id="project-display"></div>
|
||||
<div>
|
||||
<div class="header-title">Work Package Suite</div>
|
||||
<div class="header-subtitle" id="project-display"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="header-right">
|
||||
<button id="load-sample-btn" class="header-button" onclick="loadSampleData()" title="Load example SOP data">⭐ Load Sample</button>
|
||||
<button class="header-button" onclick="toggleComments()" title="View and add comments for the current step">💬 Step Comments</button>
|
||||
<button class="header-button" onclick="showAnalytics()" title="Review usage logs for this tool">📊 Usage Logs</button>
|
||||
<span class="step-counter"><span id="current-step">1</span> / <span id="total-steps">10</span></span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -97,7 +100,11 @@
|
||||
<div class="field-grid">
|
||||
<div class="field">
|
||||
<label>Project Manager (PM)</label>
|
||||
<input type="text" id="proj_pm" placeholder="e.g., Nick Siegfried">
|
||||
<input type="text" id="proj_pm" placeholder="e.g., Mariano Sanchez">
|
||||
</div>
|
||||
<div class="field">
|
||||
<label>Assistant Project Manager (APM)</label>
|
||||
<input type="text" id="proj_apm" placeholder="e.g., Assistant PM name">
|
||||
</div>
|
||||
<div class="field">
|
||||
<label>Construction Manager (CM)</label>
|
||||
@@ -108,6 +115,11 @@
|
||||
<input type="text" id="proj_qm" placeholder="e.g., D. Nguyen">
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin-top: 2rem; border-top: 1px solid var(--border); padding-top: 1.5rem;">
|
||||
<div class="sub-heading">Additional Team Members (optional)</div>
|
||||
<div id="team-members-list" style="margin-top: 1rem;"></div>
|
||||
<button class="add-btn" onclick="addTeamMember()">+ Add Team Member</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- STEP 3: SIGN-OFF ROLES -->
|
||||
@@ -230,9 +242,13 @@
|
||||
<!-- STEP 8: SEQUENCE -->
|
||||
<div class="step" id="sop-step-8" style="display: none;">
|
||||
<h2>8. Construction Sequence</h2>
|
||||
<div class="notice">Define the major phases and logical sequence of construction work.</div>
|
||||
<div class="notice">Comes pre-sequenced with a typical install flow. Drag the ⠿ handle to reorder steps, edit labels inline, add a QC hold gate, or remove any step.</div>
|
||||
<div id="sequence-list" style="margin-top: 1rem;"></div>
|
||||
<button class="add-btn" onclick="addSequenceStep()">+ Add Sequence Step</button>
|
||||
<div style="display:flex; gap:0.5rem; margin-top:1rem; flex-wrap:wrap;">
|
||||
<input type="text" id="seq-add-input" placeholder="New step name" onkeydown="if(event.key==='Enter'){addSequenceStep();}" style="flex:1; min-width:200px; padding:0.5rem; border:1px solid var(--border); border-radius:4px;">
|
||||
<button class="add-btn" onclick="addSequenceStep()">+ Add Step</button>
|
||||
<button class="add-btn" onclick="addSequenceGate()" style="background:var(--warning);">◆ Add QC Hold</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- STEP 9: CONSTRAINTS -->
|
||||
@@ -260,24 +276,6 @@
|
||||
|
||||
</div>
|
||||
|
||||
<!-- SOP COMMENTS -->
|
||||
<div class="comments-section">
|
||||
<button class="comments-toggle" onclick="toggleComments()">💬 Step Comments</button>
|
||||
<div id="comments-panel" style="display: none; margin-top: 1rem; padding: 1rem; background: var(--bg); border-radius: 6px; border: 1px solid var(--border);">
|
||||
<div style="margin-bottom: 1rem;">
|
||||
<label style="font-weight: 600; font-size: 13px;">Your Name (optional)</label>
|
||||
<input type="text" id="commenter-name" placeholder="e.g., Bill Clarida" style="width: 100%; padding: 0.5rem; border: 1px solid var(--border); border-radius: 4px; margin-top: 0.25rem;">
|
||||
</div>
|
||||
<div style="margin-bottom: 1rem;">
|
||||
<label style="font-weight: 600; font-size: 13px;">Feedback</label>
|
||||
<textarea id="comment-text" rows="3" placeholder="Your feedback here..." style="width: 100%; padding: 0.5rem; border: 1px solid var(--border); border-radius: 4px; margin-top: 0.25rem; font-family: inherit;"></textarea>
|
||||
</div>
|
||||
<button onclick="submitComment()" style="background: var(--primary); color: white; padding: 0.5rem 1rem; border: none; border-radius: 4px; cursor: pointer; font-weight: 600;">Submit</button>
|
||||
<button onclick="toggleComments()" style="background: var(--border); color: var(--text); padding: 0.5rem 1rem; border: none; border-radius: 4px; cursor: pointer; margin-left: 0.5rem;">Close</button>
|
||||
<div id="comments-list" style="margin-top: 1rem; max-height: 200px; overflow-y: auto;"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- SOP NAVIGATION -->
|
||||
<div class="step-navigation">
|
||||
<button class="nav-btn" id="sop-prev-btn" onclick="previousStep()">← Back</button>
|
||||
@@ -291,20 +289,38 @@
|
||||
<!-- WORK PACKAGE CREATION TOOL -->
|
||||
<!-- ═════════════════════════════════════════════════════════════════════ -->
|
||||
<div id="tool-wp" class="tool">
|
||||
<div style="padding: 2rem; text-align: center;">
|
||||
<!-- Shown until the SOP is complete -->
|
||||
<div id="wp-gate" style="padding: 3rem 2rem; text-align: center;">
|
||||
<h2>📋 Work Package Creation</h2>
|
||||
<p style="color: var(--text-light); margin: 1rem 0;">Complete the SOP Configuration first to enable Work Package creation.</p>
|
||||
<div style="margin-top: 2rem; padding: 2rem; background: var(--bg); border-radius: 8px; border: 2px dashed var(--border);">
|
||||
<h3 style="color: var(--text-dim);">SOP Status: <span id="sop-status">Not started</span></h3>
|
||||
<p id="sop-progress-text" style="color: var(--text-light); margin-top: 0.5rem;"></p>
|
||||
</div>
|
||||
<p style="color: var(--text-light); margin: 1rem 0;">Complete the SOP Configuration first to enable Work Package creation. Once the SOP is finished, the full creator loads here with your project defaults pre-populated.</p>
|
||||
<button class="nav-btn primary" onclick="switchTool('sop')" style="margin-top: 1rem;">← Go to SOP Configuration</button>
|
||||
</div>
|
||||
<!-- The real Work Package Creator, embedded once the SOP is complete -->
|
||||
<iframe id="wp-frame" title="Work Package Creator" style="display:none; width:100%; border:0; min-height: calc(100vh - 200px);"></iframe>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- STEP COMMENTS DROPDOWN (toggled from header) -->
|
||||
<div id="comments-panel" class="comments-dropdown" style="display: none;">
|
||||
<div class="comments-dropdown-header">
|
||||
<strong>💬 Step Comments</strong>
|
||||
<button onclick="toggleComments()" class="comments-dropdown-close" title="Close">✕</button>
|
||||
</div>
|
||||
<div style="margin-bottom: 1rem;">
|
||||
<label style="font-weight: 600; font-size: 13px;">Your Name (optional)</label>
|
||||
<input type="text" id="commenter-name" placeholder="e.g., Bill Clarida" style="width: 100%; padding: 0.5rem; border: 1px solid var(--border); border-radius: 4px; margin-top: 0.25rem;">
|
||||
</div>
|
||||
<div style="margin-bottom: 1rem;">
|
||||
<label style="font-weight: 600; font-size: 13px;">Feedback</label>
|
||||
<textarea id="comment-text" rows="3" placeholder="Your feedback here..." style="width: 100%; padding: 0.5rem; border: 1px solid var(--border); border-radius: 4px; margin-top: 0.25rem; font-family: inherit;"></textarea>
|
||||
</div>
|
||||
<button onclick="submitComment()" style="background: var(--primary); color: white; padding: 0.5rem 1rem; border: none; border-radius: 4px; cursor: pointer; font-weight: 600;">Submit</button>
|
||||
<div id="comments-list" style="margin-top: 1rem; max-height: 240px; overflow-y: auto;"></div>
|
||||
</div>
|
||||
|
||||
<!-- CONSTRAINT LIBRARY MODAL -->
|
||||
<div id="constraint-modal" class="modal" style="display: none;">
|
||||
<div class="modal-content">
|
||||
|
||||
Reference in New Issue
Block a user