n.siegfried
61d1cf4bff
Site comments (8/3) - BIM card: LOD removed, IFF # added next to the coordination status, and required once that status is "Signed off (IFF)" — an unnumbered sign-off isn't traceable. A LOD already stored on a package is preserved and shown as legacy, not blanked. - The blue "from SOP types" subtext under a field is now a SOP chip on the label with the detail in a tooltip. The chip stays visible rather than hover-only: field tablets have no hover, and "this came from the SOP" is the part that matters. The hint elements stay in the DOM (hidden) so the code writing to them keeps working; an observer mirrors their text into the tooltip. - Specification Section is no longer typed per package. Each WP type carries a spec section on the SOP; the field is read-only in the Creator and follows the type, with the SOP's spec folder linked underneath. This reads both spec comments as one intent — stop typing it, derive it. - Assignees and Distribution are multi-selects over the SOP project team, showing each person's job function, with the CM pre-added to Distribution (removable per package) and a free-text option for people with no account. The stored display strings are unchanged so print/export/dashboard keep working; account ids ride alongside for the notification work in wave 3. Localization + time - Per-user locale/timezone (Language & time in the user menu), an app-wide default in the admin console, then the browser. Timezones are validated against the server's zoneinfo and the picker is fed from it. Calendar dates are formatted from their parts so a due date never reads a day early in another zone. - Every displayed timestamp now goes through the shared helpers. Top-bar chrome - Project switcher beside the logo and a centered global search, injected into either generation of top bar; skipped in an iframe so the embedded Creator doesn't get a second one. Ctrl/Cmd-K focuses search. - GET /api/search covers work packages, projects and SOPs, scoped to the caller's projects, hiding archived packages, with LIKE wildcards escaped. Fixed along the way: showForm() cleared every card's inline display, which undid applyKind() — so the Package Type and BIM cards reappeared on an install-only project. Split out applyKindVisibility() and re-apply it there. Verified: 100 API checks on a fresh database (44 permissions + 22 password reset + 34 search/localization), 24 driven UI checks against the real Creator page in headless Chrome (SOP chips, both people pickers, spec auto-fill, critical tags, BIM suppression), and the chrome harness on both bar styles. Screenshots reviewed. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
90 lines
6.2 KiB
HTML
90 lines
6.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Field View — Work Package Suite</title>
|
|
<script src="auth-guard.js"></script>
|
|
<link rel="icon" href="favicon.ico" sizes="any">
|
|
<link rel="manifest" href="manifest.webmanifest">
|
|
<meta name="theme-color" content="#161616">
|
|
<link rel="stylesheet" href="theme-light.css">
|
|
<link rel="stylesheet" href="wp-chrome.css">
|
|
<style>
|
|
* { box-sizing: border-box; }
|
|
body { -webkit-text-size-adjust: 100%; }
|
|
.field-wrap { max-width: 760px; margin: 0 auto; padding: 16px 16px 40px; }
|
|
.fld-ctx { font-size: 13px; color: var(--cds-text-secondary); margin-bottom: 12px; }
|
|
.fld-ctx b { color: var(--cds-text-primary); }
|
|
.fld-search { width: 100%; padding: 14px; font-size: 16px; border: 1px solid var(--cds-border-strong); background: #fff; margin-bottom: 14px; }
|
|
.fld-search:focus { outline: 2px solid var(--cds-focus); outline-offset: -2px; }
|
|
.wp-card { display: block; width: 100%; text-align: left; background: var(--cds-layer); border: 1px solid var(--cds-border-subtle); border-left: 4px solid var(--cds-border-strong); padding: 14px 16px; margin-bottom: 10px; cursor: pointer; font-family: inherit; }
|
|
.wp-card:active { background: var(--cds-layer-hover); }
|
|
.wp-card.ready { border-left-color: var(--cds-support-success); }
|
|
.wp-card.hold { border-left-color: var(--cds-support-error); }
|
|
.wp-card .num { font-weight: 600; font-size: 16px; color: var(--cds-text-primary); }
|
|
.wp-card .subj { color: var(--cds-text-secondary); font-size: 13px; margin-top: 2px; }
|
|
.wp-card .meta { margin-top: 10px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
|
|
.pill { display: inline-block; font-size: 12px; font-weight: 600; padding: 3px 10px; border-radius: 14px; }
|
|
.pill.st { background: var(--cds-layer-accent); color: var(--cds-text-secondary); }
|
|
.pill.ok { background: #defbe6; color: #0e6027; }
|
|
.pill.warn { background: #fdf6dd; color: #8a6d00; }
|
|
.pill.bad { background: #fff1f1; color: #da1e28; }
|
|
.fld-empty { padding: 32px; text-align: center; color: var(--cds-text-helper); border: 1px dashed var(--cds-border-strong); background: #fff; }
|
|
.fld-empty a { color: var(--cds-link-primary); }
|
|
.fld-back { background: none; border: none; color: var(--cds-link-primary); font-size: 15px; padding: 8px 0; cursor: pointer; font-family: inherit; }
|
|
.fld-h1 { font-size: 20px; font-weight: 600; margin: 4px 0 2px; }
|
|
.fld-sub { color: var(--cds-text-secondary); font-size: 14px; margin-bottom: 16px; }
|
|
.fld-sec { background: var(--cds-layer); border: 1px solid var(--cds-border-subtle); padding: 14px 16px; margin-bottom: 14px; }
|
|
.fld-sec h3 { font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--cds-text-helper); margin-bottom: 10px; }
|
|
.st-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 8px; }
|
|
.st-btn { padding: 14px 10px; font-size: 15px; font-weight: 600; border: 1px solid var(--cds-border-strong); background: #fff; color: var(--cds-text-secondary); cursor: pointer; font-family: inherit; }
|
|
.st-btn.on { background: var(--cds-interactive-01); border-color: var(--cds-interactive-01); color: #fff; }
|
|
.st-btn.hold.on { background: var(--cds-support-error); border-color: var(--cds-support-error); }
|
|
.cx-row { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--cds-border-subtle); }
|
|
.cx-row:last-child { border-bottom: none; }
|
|
.cx-name { flex: 1; font-size: 15px; }
|
|
.cx-state { min-width: 96px; padding: 10px 12px; font-size: 14px; font-weight: 600; border: 1px solid var(--cds-border-strong); background: #fff; cursor: pointer; text-align: center; font-family: inherit; }
|
|
.cx-state.cleared { background: #defbe6; color: #0e6027; border-color: #a7f0ba; }
|
|
.cx-state.na { background: var(--cds-layer-accent); color: var(--cds-text-secondary); }
|
|
.cx-state.open { background: #fff1f1; color: #da1e28; border-color: #ffd7d9; }
|
|
.fld-note { width: 100%; padding: 12px; font-size: 16px; border: 1px solid var(--cds-border-strong); min-height: 84px; font-family: inherit; resize: vertical; }
|
|
.fld-photo-row { display: flex; gap: 10px; align-items: center; margin-top: 10px; flex-wrap: wrap; }
|
|
.fld-btn { padding: 12px 18px; font-size: 15px; font-weight: 600; border: 1px solid var(--cds-border-strong); background: #fff; cursor: pointer; font-family: inherit; }
|
|
.fld-btn.primary { background: var(--cds-interactive-01); border-color: var(--cds-interactive-01); color: #fff; }
|
|
.log-item { border: 1px solid var(--cds-border-subtle); padding: 10px 12px; margin-bottom: 8px; font-size: 14px; color: var(--cds-text-primary); white-space: pre-wrap; }
|
|
.log-item .lm { color: var(--cds-text-helper); font-size: 11px; margin-bottom: 4px; }
|
|
.log-item img { max-width: 160px; max-height: 120px; margin-top: 6px; display: block; border: 1px solid var(--cds-border-subtle); }
|
|
.fld-toast { position: fixed; bottom: 76px; left: 50%; transform: translateX(-50%); background: #161616; color: #fff; padding: 12px 20px; font-size: 14px; opacity: 0; pointer-events: none; transition: opacity .2s; z-index: 50; }
|
|
.fld-toast.show { opacity: 1; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<header class="wp-appbar">
|
|
<a href="index.html" class="wp-appbar-brand" title="Home">
|
|
<span class="wp-logo-chip"><img src="prime-controls-logo.jpg" alt="Prime Controls"></span>
|
|
<span class="wp-appbar-title">Field View</span>
|
|
</a>
|
|
<div class="wp-appbar-spacer"></div>
|
|
<a class="wp-appbar-link" href="index.html">Home</a>
|
|
</header>
|
|
|
|
<div class="field-wrap">
|
|
<div class="fld-ctx" id="fld-ctx"></div>
|
|
<section id="screen-list">
|
|
<input class="fld-search" id="fld-search" type="search" placeholder="Search work packages…" oninput="renderList()" aria-label="Search work packages">
|
|
<div id="wp-list"></div>
|
|
</section>
|
|
<section id="screen-detail" style="display:none"></section>
|
|
</div>
|
|
|
|
<div id="toast" class="fld-toast"></div>
|
|
|
|
<script src="project-data.js"></script>
|
|
<script src="help.js"></script>
|
|
<script src="field.js"></script>
|
|
<script src="wp-format.js"></script>
|
|
<script src="wp-chrome.js"></script>
|
|
</body>
|
|
</html>
|