diff --git a/web/src/pages/app/dialogs.css b/web/src/pages/app/dialogs.css index 3ec589a..55b5dcb 100644 --- a/web/src/pages/app/dialogs.css +++ b/web/src/pages/app/dialogs.css @@ -134,7 +134,7 @@ align-items: center; justify-content: space-between; gap: 8px; - padding: 10px; + padding: 0 10px; border-bottom: 1px solid #d8e0e8; } @@ -150,7 +150,7 @@ overscroll-behavior: contain; list-style: none; margin: 0; - padding: 8px; + padding: 5px 0; } .preview-model-meta { @@ -211,6 +211,7 @@ } .preview-process-status { + display: none; min-height: 44px; max-height: 78px; overflow: auto; diff --git a/web/src/pages/app/modules/preview.ts b/web/src/pages/app/modules/preview.ts index 955efeb..d96aaf9 100644 --- a/web/src/pages/app/modules/preview.ts +++ b/web/src/pages/app/modules/preview.ts @@ -153,18 +153,14 @@ export function openModelPreview(
- ${canWrite ? ` - +
+ - ` : ""} - - +
+
@@ -184,6 +180,13 @@ export function openModelPreview(
`, actions: { + 更新缩略图() { + if (canWrite) { + screenshotModel(model.id, onThumbnailSaved).catch((error) => { + + }) + } + }, 关闭() { disposePreview(); w2popup.close(); @@ -192,7 +195,8 @@ export function openModelPreview( }); popup.self - .on("open:after", () => { + .on("open:after", () => {popup + console.log(popup) bindProcessPlaceholder(operations); bindImportScene(model, operations, options.onImportScene); if (canWrite) bindThumbnailCapture(model.id, onThumbnailSaved); @@ -481,42 +485,48 @@ function disposeMaterial(material: unknown) { } function bindThumbnailCapture(modelId: number, onThumbnailSaved?: () => Promise | void) { - document.querySelector("#previewCaptureThumbBtn")?.addEventListener("click", async () => { - try { - if (!runtime) { - throw new Error("模型还未加载完成"); - } - const { renderer, scene, camera, controls } = runtime.context; - if (!renderer || !scene || !camera || !controls) { - throw new Error("模型还未加载完成"); - } - const transparent = document.querySelector("#previewTransparentThumb")?.checked ?? false; - controls.update(); - const oldBackground = scene.background; - const oldClearAlpha = renderer.getClearAlpha(); - if (transparent) { - scene.background = null; - renderer.setClearColor(0x000000, 0); - } - renderer.render(scene, camera); - const thumbnail = renderer.domElement.toDataURL("image/png"); - if (transparent) { - scene.background = oldBackground; - renderer.setClearAlpha(oldClearAlpha); - renderer.render(scene, camera); - } - await api(`/api/models/${modelId}/thumbnail`, { - method: "PUT", - body: JSON.stringify({ thumbnail }) - }); - await onThumbnailSaved?.(); - notify("缩略图已保存"); - } catch (error) { - notifyError(error); - } + document.querySelector("#previewCaptureThumbBtn")?.addEventListener("click", () => { + screenshotModel(modelId, onThumbnailSaved).catch((error) => { + + }) }); } +async function screenshotModel(modelId: number, onThumbnailSaved?: () => Promise | void) { + try { + if (!runtime) { + throw new Error("模型还未加载完成"); + } + const { renderer, scene, camera, controls } = runtime.context; + if (!renderer || !scene || !camera || !controls) { + throw new Error("模型还未加载完成"); + } + const transparent = true; // document.querySelector("#previewTransparentThumb")?.checked ?? false; + controls.update(); + const oldBackground = scene.background; + const oldClearAlpha = renderer.getClearAlpha(); + if (transparent) { + scene.background = null; + renderer.setClearColor(0x000000, 0); + } + renderer.render(scene, camera); + const thumbnail = renderer.domElement.toDataURL("image/png"); + if (transparent) { + scene.background = oldBackground; + renderer.setClearAlpha(oldClearAlpha); + renderer.render(scene, camera); + } + await api(`/api/models/${modelId}/thumbnail`, { + method: "PUT", + body: JSON.stringify({ thumbnail }) + }); + await onThumbnailSaved?.(); + notify("缩略图已保存"); + } catch (error) { + notifyError(error); + } +} + function getSelectedOperation(operations: PreviewOperation[]) { const selectedButton = document.querySelector(".preview-process-tree li.is-active button"); const index = Number(selectedButton?.dataset.processIndex ?? 0);