feat: xavis ai_platform 기능 이전 및 ncue 환경 전환
xavis 소스·DB 스키마·활용사례/F-Scan/프롬프트 라이브러리 등 기능 반영. @xavis.co.kr → @ncue.net, 관리자 토큰 ncue-admin, 런타임 data/ Git 추적 제외. Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dsyoon
386
public/resources/fscan/fscan-selector-v1.html
Normal file
386
public/resources/fscan/fscan-selector-v1.html
Normal file
@@ -0,0 +1,386 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>FSCAN 시리즈 제품 선정 도우미</title>
|
||||
<style>
|
||||
* { box-sizing: border-box; margin: 0; padding: 0; }
|
||||
body { font-family: 'Malgun Gothic', 'Apple SD Gothic Neo', sans-serif; background: #f0f4f8; min-height: 100vh; padding: 20px 12px; }
|
||||
.container { max-width: 680px; margin: 0 auto; }
|
||||
|
||||
.header { background: #1a237e; color: white; padding: 18px 24px; border-radius: 12px; margin-bottom: 20px; display: flex; align-items: center; gap: 16px; }
|
||||
.header-logo { height: 36px; width: auto; flex-shrink: 0; background: white; border-radius: 6px; padding: 4px 8px; margin-left: auto; order: 1; }
|
||||
.header-text h1 { font-size: 1.25rem; font-weight: 700; letter-spacing: -0.3px; }
|
||||
.header-text p { font-size: 0.8rem; opacity: 0.75; margin-top: 4px; }
|
||||
|
||||
.card { background: white; border-radius: 12px; padding: 22px; margin-bottom: 16px; box-shadow: 0 1px 6px rgba(0,0,0,0.08); }
|
||||
|
||||
.diagram-wrap { text-align: center; margin-bottom: 20px; }
|
||||
.diagram-wrap svg { max-width: 260px; }
|
||||
|
||||
.input-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 16px; }
|
||||
.field label { display: block; font-size: 0.82rem; font-weight: 700; color: #374151; margin-bottom: 5px; }
|
||||
.field .sub { font-size: 0.72rem; color: #9ca3af; margin-bottom: 5px; }
|
||||
.input-wrap { position: relative; }
|
||||
.input-wrap input {
|
||||
width: 100%; padding: 11px 40px 11px 14px;
|
||||
border: 2px solid #e5e7eb; border-radius: 8px;
|
||||
font-size: 1.05rem; font-family: inherit; outline: none;
|
||||
transition: border-color 0.15s;
|
||||
}
|
||||
.input-wrap input:focus { border-color: #3b82f6; }
|
||||
.input-wrap .unit { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); font-size: 0.8rem; color: #9ca3af; pointer-events: none; }
|
||||
|
||||
.btn {
|
||||
width: 100%; padding: 13px;
|
||||
background: #1a237e; color: white;
|
||||
border: none; border-radius: 8px;
|
||||
font-size: 0.95rem; font-weight: 700; font-family: inherit;
|
||||
cursor: pointer; transition: background 0.15s;
|
||||
letter-spacing: 0.3px;
|
||||
}
|
||||
.btn:hover { background: #283593; }
|
||||
.btn:active { background: #0d1757; }
|
||||
|
||||
.result-header { font-size: 0.95rem; font-weight: 700; color: #111827; margin-bottom: 12px; }
|
||||
.result-sub { font-size: 0.78rem; color: #6b7280; font-weight: 400; margin-left: 6px; }
|
||||
.model-list { display: grid; gap: 9px; }
|
||||
|
||||
.model-item {
|
||||
display: flex; align-items: center; gap: 12px;
|
||||
padding: 12px 14px; border-radius: 8px;
|
||||
border: 2px solid #e5e7eb;
|
||||
}
|
||||
.model-item.rank1 { border-color: #16a34a; background: #f0fdf4; }
|
||||
.model-item.rank2 { border-color: #2563eb; background: #eff6ff; }
|
||||
.model-item.rank3 { border-color: #9ca3af; background: #f9fafb; }
|
||||
|
||||
.badge {
|
||||
min-width: 42px; height: 42px; border-radius: 7px;
|
||||
display: flex; flex-direction: column; align-items: center; justify-content: center;
|
||||
font-size: 0.68rem; font-weight: 700; flex-shrink: 0;
|
||||
line-height: 1.2;
|
||||
}
|
||||
.rank1 .badge { background: #16a34a; color: white; }
|
||||
.rank2 .badge { background: #2563eb; color: white; }
|
||||
.rank3 .badge { background: #6b7280; color: white; }
|
||||
|
||||
.model-name { font-size: 0.95rem; font-weight: 700; color: #111827; }
|
||||
.model-detail { font-size: 0.76rem; color: #6b7280; margin-top: 2px; }
|
||||
|
||||
.no-result { text-align: center; padding: 36px 20px; color: #6b7280; }
|
||||
.no-result .icon { font-size: 2.5rem; margin-bottom: 10px; }
|
||||
.no-result p { font-size: 0.88rem; }
|
||||
|
||||
.note { font-size: 0.7rem; color: #9ca3af; text-align: center; margin-top: 12px; padding: 0 8px; line-height: 1.5; }
|
||||
|
||||
.tab-wrap { display: flex; gap: 8px; margin-bottom: 16px; }
|
||||
.tab-btn {
|
||||
flex: 1; padding: 9px 6px; border-radius: 7px; border: 2px solid #e5e7eb;
|
||||
background: white; font-family: inherit; font-size: 0.82rem; font-weight: 700;
|
||||
color: #6b7280; cursor: pointer; transition: all 0.15s;
|
||||
line-height: 1.35; white-space: normal; word-break: keep-all;
|
||||
}
|
||||
.tab-btn.active { background: #1a237e; border-color: #1a237e; color: white; }
|
||||
.tab-content { display: none; }
|
||||
.tab-content.active { display: block; }
|
||||
|
||||
.model-select-wrap { margin-bottom: 14px; }
|
||||
.model-select-wrap label { display: block; font-size: 0.82rem; font-weight: 700; color: #374151; margin-bottom: 6px; }
|
||||
.model-select-wrap select {
|
||||
width: 100%; padding: 10px 14px; border: 2px solid #e5e7eb; border-radius: 8px;
|
||||
font-size: 0.95rem; font-family: inherit; outline: none; background: white;
|
||||
cursor: pointer; transition: border-color 0.15s;
|
||||
}
|
||||
.model-select-wrap select:focus { border-color: #3b82f6; }
|
||||
|
||||
.chart-table { width: 100%; border-collapse: collapse; font-size: 0.82rem; }
|
||||
.chart-table th { background: #1a237e; color: white; padding: 8px 12px; text-align: center; font-weight: 700; position: sticky; top: 0; }
|
||||
.chart-table td { padding: 6px 12px; text-align: center; border-bottom: 1px solid #f3f4f6; }
|
||||
.chart-table tr:hover td { background: #f0f4ff; }
|
||||
.chart-table tr.hl td { background: #fef9c3; font-weight: 700; }
|
||||
.chart-table td.h-col { color: #374151; font-weight: 600; }
|
||||
.chart-table td.w-val { color: #1a237e; font-weight: 700; }
|
||||
.table-scroll { max-height: 360px; overflow-y: auto; border: 1px solid #e5e7eb; border-radius: 8px; }
|
||||
|
||||
.chart-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 14px; }
|
||||
.chart-field label { display: block; font-size: 0.82rem; font-weight: 700; color: #374151; margin-bottom: 5px; }
|
||||
|
||||
.chart-summary { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 8px; margin-bottom: 12px; font-size: 0.85rem; }
|
||||
.chart-summary.ok { background: #f0fdf4; border: 1.5px solid #86efac; }
|
||||
.chart-summary.ng { background: #fff1f2; border: 1.5px solid #fca5a5; }
|
||||
.chart-summary.na { background: #f9fafb; border: 1.5px solid #e5e7eb; color: #6b7280; }
|
||||
.sum-icon { font-size: 1.2rem; flex-shrink: 0; }
|
||||
.sum-icon.ok { color: #16a34a; }
|
||||
.sum-icon.ng { color: #dc2626; }
|
||||
|
||||
.fit-ok { color: #16a34a; font-weight: 700; font-size: 0.8rem; }
|
||||
.fit-ng { color: #dc2626; font-weight: 700; font-size: 0.8rem; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<div class="header">
|
||||
<img class="header-logo" src="/public/images/xavis-logo.png" alt="Xavis">
|
||||
<div class="header-text">
|
||||
<h1>FSCAN 시리즈 제품 선정 도우미</h1>
|
||||
<p>검사 대상물의 H · W 치수를 입력하여 적합한 모델을 선정합니다</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<div class="tab-wrap">
|
||||
<button class="tab-btn active" onclick="switchTab('search')">검사 대상물 치수로 모델 찾기</button>
|
||||
<button class="tab-btn" onclick="switchTab('chart')">모델별 치수 조회 · 적합 확인</button>
|
||||
</div>
|
||||
|
||||
<div id="tab-search" class="tab-content active">
|
||||
<div class="diagram-wrap">
|
||||
<svg viewBox="0 0 280 180" xmlns="http://www.w3.org/2000/svg">
|
||||
<polygon points="60,125 220,125 200,30 80,30" fill="#e8f0fe" stroke="#1a237e" stroke-width="2.5" stroke-linejoin="round"/>
|
||||
<line x1="240" y1="30" x2="240" y2="125" stroke="#dc2626" stroke-width="2"/>
|
||||
<polygon points="240,26 237,36 243,36" fill="#dc2626"/>
|
||||
<polygon points="240,129 237,119 243,119" fill="#dc2626"/>
|
||||
<text x="252" y="82" fill="#dc2626" font-size="16" font-weight="bold" font-family="Arial">H</text>
|
||||
<line x1="60" y1="152" x2="220" y2="152" stroke="#dc2626" stroke-width="2"/>
|
||||
<polygon points="56,152 66,149 66,155" fill="#dc2626"/>
|
||||
<polygon points="224,152 214,149 214,155" fill="#dc2626"/>
|
||||
<text x="134" y="175" fill="#dc2626" font-size="16" font-weight="bold" font-family="Arial" text-anchor="middle">W</text>
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<div class="input-row">
|
||||
<div class="field">
|
||||
<label>H (높이)</label>
|
||||
<div class="sub">검사 대상물 높이</div>
|
||||
<div class="input-wrap">
|
||||
<input type="number" id="iH" placeholder="예: 120" min="0" max="500" step="1">
|
||||
<span class="unit">mm</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label>W (폭)</label>
|
||||
<div class="sub">검사 대상물 폭</div>
|
||||
<div class="input-wrap">
|
||||
<input type="number" id="iW" placeholder="예: 280" min="0" step="1">
|
||||
<span class="unit">mm</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button class="btn" onclick="run()">모델 찾기</button>
|
||||
</div>
|
||||
|
||||
<div id="tab-chart" class="tab-content">
|
||||
<div class="model-select-wrap">
|
||||
<label>모델 선택</label>
|
||||
<select id="modelSelect" onchange="showModelChart()">
|
||||
<option value="">-- 모델을 선택하세요 --</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="chart-inputs">
|
||||
<div class="chart-field">
|
||||
<label>H (높이) <span style="font-weight:400;color:#9ca3af">선택</span></label>
|
||||
<div class="input-wrap">
|
||||
<input type="number" id="chartH" placeholder="예: 120" min="0" max="500" step="1" oninput="showModelChart()">
|
||||
<span class="unit">mm</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="chart-field">
|
||||
<label>W (폭) <span style="font-weight:400;color:#9ca3af">선택</span></label>
|
||||
<div class="input-wrap">
|
||||
<input type="number" id="chartW" placeholder="예: 280" min="0" step="1" oninput="showModelChart()">
|
||||
<span class="unit">mm</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="modelChartResult"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="result"></div>
|
||||
<div class="note">※ 이미지 기준표에서 추출한 데이터입니다. 최종 확인은 원본 FSCAN-D 기준표를 참조하세요.</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const MODELS = [
|
||||
'1880','3280D','4280D','4280K','4280DH','4350G',
|
||||
'4500L','4500D','4500DH','6280D',
|
||||
'6350G(350w)','6350G(500w)',
|
||||
'6500D','6500DH','6500D(H2)','7500D','9500D'
|
||||
];
|
||||
const T = [
|
||||
{h:0, w:[217,231,369,369,384,394,377,389,392,573,603,618,583,587,589,694,954]},
|
||||
{h:10, w:[205,224,357,357,377,386,366,381,386,561,595,606,574,579,583,681,939]},
|
||||
{h:20, w:[192,216,346,346,369,378,356,374,379,549,587,595,565,571,577,668,924]},
|
||||
{h:30, w:[180,209,334,334,362,370,345,367,372,537,580,583,556,563,571,605,909]},
|
||||
{h:40, w:[168,202,323,323,354,362,334,359,365,525,572,572,546,555,565,642,894]},
|
||||
{h:50, w:[155,195,311,311,347,354,323,352,361,513,564,560,537,547,559,629,879]},
|
||||
{h:60, w:[143,187,299,299,340,346,313,345,355,501,556,549,528,539,553,617,864]},
|
||||
{h:70, w:[null,180,288,288,332,338,302,338,349,489,549,537,519,531,547,604,849]},
|
||||
{h:80, w:[null,173,276,276,325,330,291,330,343,477,541,525,510,523,541,591,834]},
|
||||
{h:90, w:[null,165,265,265,317,322,280,323,337,466,533,514,501,515,535,578,819]},
|
||||
{h:100, w:[null,158,253,253,310,314,270,316,330,454,525,502,491,507,529,565,804]},
|
||||
{h:110, w:[null,151,241,241,302,306,259,308,324,442,517,491,482,499,523,552,789]},
|
||||
{h:120, w:[null,144,230,230,295,298,248,301,318,430,510,479,473,491,517,540,774]},
|
||||
{h:130, w:[null,136,218,218,288,290,237,294,312,418,502,468,464,483,511,527,760]},
|
||||
{h:140, w:[null,129,207,207,280,282,227,287,306,406,494,456,455,475,505,514,745]},
|
||||
{h:145, w:[null,125,200,200,276,278,221,282,302,399,490,450,450,470,502,508,737]},
|
||||
{h:150, w:[null,122,195,195,273,274,216,279,299,394,486,444,446,467,499,501,730]},
|
||||
{h:155, w:[null,118,189,189,269,270,210,275,296,387,482,439,440,462,496,495,722]},
|
||||
{h:160, w:[null,115,183,183,265,266,205,272,293,382,478,433,436,459,493,488,715]},
|
||||
{h:165, w:[null,111,177,177,261,262,199,268,290,376,475,427,431,454,490,482,707]},
|
||||
{h:170, w:[null,107,172,172,258,258,194,265,287,370,471,421,427,451,487,475,700]},
|
||||
{h:175, w:[null,103,166,null,254,254,188,261,283,364,467,415,422,446,484,469,692]},
|
||||
{h:180, w:[null,100,160,null,251,250,184,257,281,358,463,410,418,443,481,463,685]},
|
||||
{h:185, w:[null,null,154,null,246,246,178,253,277,352,459,404,413,438,479,457,677]},
|
||||
{h:190, w:[null,null,148,null,243,242,173,250,274,346,455,398,409,435,476,450,669]},
|
||||
{h:195, w:[null,null,null,null,239,238,167,246,271,340,451,392,404,430,473,444,662]},
|
||||
{h:200, w:[null,null,null,null,236,234,162,243,268,334,447,386,400,427,470,437,655]},
|
||||
{h:205, w:[null,null,null,null,232,null,null,null,265,328,443,381,395,422,467,431,647]},
|
||||
{h:210, w:[null,null,null,null,228,null,null,null,262,322,440,375,391,419,464,424,640]},
|
||||
{h:215, w:[null,null,null,null,224,null,null,null,259,316,436,369,385,414,461,418,632]},
|
||||
{h:220, w:[null,null,null,null,221,null,null,null,256,311,432,363,381,411,458,411,625]},
|
||||
{h:225, w:[null,null,null,null,217,null,null,null,252,304,428,358,376,406,455,null,617]},
|
||||
{h:230, w:[null,null,null,null,213,null,null,null,250,299,424,352,372,403,452,null,610]},
|
||||
{h:235, w:[null,null,null,null,209,null,null,null,246,292,420,346,367,398,449,null,602]},
|
||||
{h:240, w:[null,null,null,null,206,null,null,null,244,287,416,340,363,395,446,null,595]},
|
||||
{h:245, w:[null,null,null,null,202,null,null,null,240,280,412,334,358,390,443,null,587]},
|
||||
{h:250, w:[null,null,null,null,199,null,null,null,237,275,408,329,354,387,440,null,580]},
|
||||
{h:255, w:[null,null,null,null,null,null,null,null,234,268,404,323,349,382,437,null,null]},
|
||||
{h:260, w:[null,null,null,null,null,null,null,null,228,256,401,317,340,374,434,null,null]},
|
||||
{h:270, w:[null,null,null,null,null,null,null,null,221,244,393,305,330,366,428,null,null]},
|
||||
{h:280, w:[null,null,null,null,null,null,null,null,215,232,null,null,321,358,422,null,null]},
|
||||
{h:290, w:[null,null,null,null,null,null,null,null,209,220,null,null,312,350,416,null,null]},
|
||||
{h:300, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,342,410,null,null]},
|
||||
{h:310, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,334,404,null,null]},
|
||||
{h:320, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,326,398,null,null]},
|
||||
{h:330, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,318,392,null,null]},
|
||||
{h:340, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,310,386,null,null]},
|
||||
{h:350, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,302,380,null,null]},
|
||||
{h:360, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,294,374,null,null]},
|
||||
{h:370, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,286,368,null,null]},
|
||||
{h:380, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,278,362,null,null]},
|
||||
{h:390, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,270,356,null,null]},
|
||||
{h:400, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,267,350,null,null]},
|
||||
{h:410, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,null,344,null,null]},
|
||||
{h:420, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,null,338,null,null]},
|
||||
{h:430, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,null,332,null,null]},
|
||||
{h:440, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,null,326,null,null]},
|
||||
{h:450, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,null,320,null,null]},
|
||||
{h:460, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,null,314,null,null]},
|
||||
{h:470, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,null,308,null,null]},
|
||||
{h:480, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,null,302,null,null]},
|
||||
{h:490, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,null,296,null,null]},
|
||||
{h:500, w:[null,null,null,null,null,null,null,null,null,null,null,null,null,null,291,null,null]}
|
||||
];
|
||||
|
||||
function getMaxW(modelIdx, h) {
|
||||
let lo = null, hi = null;
|
||||
for (const row of T) {
|
||||
if (row.h <= h) lo = row;
|
||||
if (row.h >= h && hi === null) hi = row;
|
||||
}
|
||||
if (!lo && !hi) return null;
|
||||
lo = lo || hi;
|
||||
hi = hi || lo;
|
||||
const lv = lo.w[modelIdx];
|
||||
const hv = hi.w[modelIdx];
|
||||
if (lv === null && hv === null) return null;
|
||||
if (lv === null) return hv;
|
||||
if (hv === null) return lv;
|
||||
if (lo.h === hi.h) return lv;
|
||||
const t = (h - lo.h) / (hi.h - lo.h);
|
||||
return lv + t * (hv - lv);
|
||||
}
|
||||
|
||||
function run() {
|
||||
const h = parseFloat(document.getElementById('iH').value);
|
||||
const w = parseFloat(document.getElementById('iW').value);
|
||||
const el = document.getElementById('result');
|
||||
if (isNaN(h) || isNaN(w) || h < 0 || w <= 0) {
|
||||
el.innerHTML = '<div class="card"><p style="color:#dc2626;font-size:.85rem;text-align:center">H와 W를 올바르게 입력해주세요 (H: 0~500mm)</p></div>';
|
||||
return;
|
||||
}
|
||||
if (h > 500) {
|
||||
el.innerHTML = '<div class="card"><p style="color:#dc2626;font-size:.85rem;text-align:center">H는 최대 500mm까지 지원합니다.</p></div>';
|
||||
return;
|
||||
}
|
||||
|
||||
const hits = [];
|
||||
for (let i = 0; i < MODELS.length; i++) {
|
||||
const maxW = getMaxW(i, h);
|
||||
if (maxW !== null && maxW >= w) hits.push({ name: MODELS[i], maxW: Math.round(maxW), margin: Math.round(maxW - w) });
|
||||
}
|
||||
hits.sort((a, b) => a.margin - b.margin);
|
||||
|
||||
if (!hits.length) {
|
||||
el.innerHTML = '<div class="card"><div class="no-result"><div class="icon">⚠️</div><p><b>적합한 모델이 없습니다.</b></p><p style="margin-top:6px;font-size:.78rem;color:#9ca3af">치수를 다시 확인하거나 영업팀에 문의하세요.</p></div></div>';
|
||||
return;
|
||||
}
|
||||
|
||||
const rankClass = (i) => (i === 0 ? 'rank1' : i === 1 ? 'rank2' : 'rank3');
|
||||
const rankLabel = (i) => (i === 0 ? ['최적','모델'] : i === 1 ? ['차선','모델'] : ['적합','모델']);
|
||||
const rows = hits.map((r, i) => {
|
||||
const lab = rankLabel(i);
|
||||
return '<div class="model-item ' + rankClass(i) + '"><div class="badge"><span>' + lab[0] + '</span><span>' + lab[1] + '</span></div><div><div class="model-name">FSCAN-' + r.name + '</div><div class="model-detail">최대 W: ' + r.maxW + 'mm | 여유: +' + r.margin + 'mm</div></div></div>';
|
||||
}).join('');
|
||||
|
||||
el.innerHTML = '<div class="card"><div class="result-header">적합 모델 ' + hits.length + '종<span class="result-sub">H=' + h + 'mm · W=' + w + 'mm 기준</span></div><div class="model-list">' + rows + '</div></div>';
|
||||
}
|
||||
|
||||
function switchTab(tab) {
|
||||
document.querySelectorAll('.tab-btn').forEach((b, i) => b.classList.toggle('active', (i === 0) === (tab === 'search')));
|
||||
document.getElementById('tab-search').classList.toggle('active', tab === 'search');
|
||||
document.getElementById('tab-chart').classList.toggle('active', tab === 'chart');
|
||||
document.getElementById('result').style.display = tab === 'search' ? '' : 'none';
|
||||
}
|
||||
|
||||
(function initSelect() {
|
||||
const sel = document.getElementById('modelSelect');
|
||||
MODELS.forEach(m => {
|
||||
const opt = document.createElement('option');
|
||||
opt.value = m;
|
||||
opt.textContent = 'FSCAN-' + m;
|
||||
sel.appendChild(opt);
|
||||
});
|
||||
})();
|
||||
|
||||
function showModelChart() {
|
||||
const modelName = document.getElementById('modelSelect').value;
|
||||
const el = document.getElementById('modelChartResult');
|
||||
if (!modelName) { el.innerHTML = ''; return; }
|
||||
const idx = MODELS.indexOf(modelName);
|
||||
const rows = T.filter(row => row.w[idx] !== null);
|
||||
const inputH = parseFloat(document.getElementById('chartH').value);
|
||||
const inputW = parseFloat(document.getElementById('chartW').value);
|
||||
const hasH = !isNaN(inputH) && inputH >= 0;
|
||||
const hasW = !isNaN(inputW) && inputW > 0;
|
||||
|
||||
let summaryHtml = '';
|
||||
if (hasH && hasW) {
|
||||
const maxW = getMaxW(idx, inputH);
|
||||
if (maxW === null) {
|
||||
summaryHtml = '<div class="chart-summary na"><span class="sum-icon">—</span><span>H=' + inputH + 'mm 구간은 <b>FSCAN-' + modelName + '</b>이 지원하지 않습니다.</span></div>';
|
||||
} else {
|
||||
const fit = inputW <= maxW;
|
||||
const diff = Math.round(Math.abs(maxW - inputW));
|
||||
summaryHtml = '<div class="chart-summary ' + (fit ? 'ok' : 'ng') + '"><span class="sum-icon ' + (fit ? 'ok' : 'ng') + '">' + (fit ? '✓' : '✗') + '</span><span>H=' + inputH + 'mm 기준 최대 W <b>' + Math.round(maxW) + 'mm</b> → W=' + inputW + 'mm 입력 → <b>' + (fit ? '적합' : '부적합') + '</b> <span style="font-size:0.78rem;color:' + (fit ? '#16a34a' : '#dc2626') + '">(' + (fit ? '여유 +' + diff : diff + 'mm 초과') + ')</span></span></div>';
|
||||
}
|
||||
}
|
||||
|
||||
const tbody = rows.map(row => {
|
||||
const wVal = row.w[idx];
|
||||
const isHL = hasH && row.h === inputH;
|
||||
const fitCell = hasW ? '<td><span class="' + (inputW <= wVal ? 'fit-ok' : 'fit-ng') + '">' + (inputW <= wVal ? '✓ 적합' : '✗ 부적합') + '</span></td>' : '';
|
||||
return '<tr class="' + (isHL ? 'hl' : '') + '"><td class="h-col">' + row.h + '</td><td class="w-val">' + wVal + '</td>' + fitCell + '</tr>';
|
||||
}).join('');
|
||||
|
||||
el.innerHTML = summaryHtml + '<div class="table-scroll"><table class="chart-table"><thead><tr><th>H (mm)</th><th>최대 W (mm)</th>' + (hasW ? '<th>적합 여부</th>' : '') + '</tr></thead><tbody>' + tbody + '</tbody></table></div>';
|
||||
}
|
||||
|
||||
document.addEventListener('keydown', function(e) { if (e.key === 'Enter') run(); });
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
1938
public/styles.css
1938
public/styles.css
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user