xsl/hair
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

接口5：新增 hairline_level 档位(middle/high/low)贴图 + 集成接口2生发能力

Browse Source 
- hairline_level: 可选 middle(默认)/high/low，选用不同高度档位发际线贴图；
  新增 hairline_texture_high/low 两套贴图，get_texture_map 改为按档位缓存
- hair_style: 可选逗号分隔序号，对选中发际线类型同步生发(ComfyUI)，
  结果合并进 hairline_images[].grown_image_base64(未选中为 null)；
  生发黑模板固定取 middle(hairline_texture_black/)，与档位无关
- 新增 use_mask/prompt 生发控制参数(同接口2)
- 测试页/接口文档同步更新

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
xsl
2026-07-09 23:30:21 +08:00
co-authored by Claude Opus 4.8
parent 0ddfa83743
commit 9675e147a0
22 changed files with 127 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/test_interface5.html
+18 -4
View File
@@ -21,6 +21,7 @@
.form-group { display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.form-group label { font-size: 13px; font-weight: 600; color: #374151; }
.form-group select { padding: 8px 12px; border: 1px solid #d1d5db; border-radius: 6px; font-size: 14px; }
.form-group input[type=text] { padding: 8px 12px; border: 1px solid #d1d5db; border-radius: 6px; font-size: 14px; width: 150px; }
.btn { padding: 10px 28px; border: none; border-radius: 8px; font-size: 15px; cursor: pointer; font-weight: 600; transition: .2s; }
.btn-primary { background: #2563eb; color: #fff; }
.btn-primary:hover { background: #1d4ed8; }
@@ -72,7 +73,7 @@
<body>
<div class="container">
<h1>💈 接口5 — 发际线 PNG 生成 测试</h1>
<p class="subtitle">POST /api/v1/hairline/generate &nbsp;|&nbsp; 上传正面照 + 性别 → N 张发际线叠加图 + 最佳中心点坐标</p>
<p class="subtitle">POST /api/v1/hairline/generate &nbsp;|&nbsp; 上传正面照 + 性别（+档位/生发序号）→ N 张发际线叠加图（含生发图）+ 最佳中心点坐标</p>
<div class="card">
<div class="card-body">
@@ -82,6 +83,14 @@
<label>性别</label>
<select id="gender"><option value="female" selected>👩 Female（5种）</option><option value="male">👨 Male（4种）</option></select>
</div>
<div class="form-group">
<label>发际线档位</label>
<select id="hairlineLevel"><option value="middle" selected>middle（默认）</option><option value="high">high</option><option value="low">low</option></select>
</div>
<div class="form-group">
<label title="逗号分隔如 1,2,3；留空则只出发际线不生发">生发序号</label>
<input type="text" id="hairStyle" placeholder="如 1,2 留空不生发">
</div>
<button class="btn btn-primary" id="submitBtn" onclick="submitTest()">🚀 提交</button>
<button class="btn btn-outline btn-sm" onclick="clearResults()">清除</button>
</div>
@@ -140,7 +149,8 @@ async function submitTest() {
$('submitBtn').disabled = true; $('submitBtn').textContent = '⏳ ...';
setStatus('请求中...', 'info'); $('resultsArea').classList.add('hidden');
const fd = new FormData(); fd.append('image_file', f); fd.append('gender', $('gender').value);
const fd = new FormData(); fd.append('image_file', f); fd.append('gender', $('gender').value); fd.append('hairline_level', $('hairlineLevel').value);
const _hs = $('hairStyle').value.trim(); if (_hs) fd.append('hair_style', _hs);
const _reqStart = performance.now();
try {
const r = await fetch(API_BASE + '/api/v1/hairline/generate', { method:'POST', body:fd });
@@ -169,7 +179,9 @@ function renderGrid() {
_images.forEach((img, i) => {
h += '<div class="result-card'+(i===0?' selected':'')+'" onclick="selectCard('+i+',this)">'+
'<div class="img-wrap"><img src="'+img.image_url+'" alt="#'+img.order+'" loading="lazy"></div>'+
'<div class="info"><span class="badge">#'+(img.order||'—')+'</span>'+(i===0?'<span style="font-size:11px;color:#059669">⭐ 最佳</span>':'')+'</div></div>';
'<div class="info"><span class="badge">#'+(img.order||'—')+'</span>'+
(img.grown_image_url?'<span style="font-size:11px;color:#7c3aed">🌱 生发</span>':'')+
(i===0?'<span style="font-size:11px;color:#059669">⭐ 最佳</span>':'')+'</div></div>';
});
$('resultsGrid').innerHTML = h;
}
@@ -177,11 +189,13 @@ function renderGrid() {
function selectCard(idx, el) {
document.querySelectorAll('.result-card').forEach(c => c.classList.remove('selected'));
if (el) el.classList.add('selected');
const g = _images[idx].grown_image_url;
$('previewArea').innerHTML =
'<div class="preview-stack">'+
'<img class="layer-base5" src="'+_origUrl+'" alt="原图">'+
'<img class="layer-over5" src="'+_images[idx].image_url+'" alt="#'+_images[idx].order+'">'+
'</div>';
'</div>'+
(g?'<div style="margin-top:10px"><div style="font-size:12px;color:#7c3aed;margin-bottom:4px">🌱 生发图</div><img src="'+g+'" alt="生发 #'+_images[idx].order+'" style="max-width:100%;border-radius:8px"></div>':'');
syncOverlay();
}