feat: 电商工作台进度与生成记录健壮性优化

This commit is contained in:
2026-06-15 10:24:31 +08:00
parent e1fdbe5f9b
commit 0b2d6b901f
10 changed files with 533 additions and 102 deletions
+147
View File
@@ -69,6 +69,17 @@
padding-top: 64px;
}
/* 工作台与个人中心常驻同层 hidden 切换以保活生成任务状态
wrapper 需要撑满内容区让内部 .product-clone-page/.local-profile-page height:100% 生效 */
.ecommerce-standalone__page {
height: 100%;
min-height: 0;
}
.ecommerce-standalone__page[hidden] {
display: none !important;
}
.ecommerce-standalone__content > .error-boundary,
.ecommerce-standalone__content .product-clone-page {
height: 100%;
@@ -1346,6 +1357,34 @@
font-weight: 500;
}
.local-profile-work-grid--empty {
display: block;
}
.local-profile-empty {
display: grid;
min-height: 220px;
place-items: center;
gap: 8px;
padding: 36px 20px;
border: 1px dashed rgba(30, 189, 219, 0.22);
border-radius: 18px;
color: #6c7d88;
text-align: center;
background: #f8fbfc;
}
.local-profile-empty strong {
color: #10202c;
font-size: 15px;
}
.local-profile-empty span {
max-width: 360px;
font-size: 13px;
line-height: 1.6;
}
@media (max-width: 980px) {
.local-profile-page__body {
grid-template-columns: minmax(0, 1fr);
@@ -12354,6 +12393,40 @@ body .ecom-inspiration-preview__close {
display: none !important;
}
/* 灵感预览:右下角"使用此提示词"动作条,避开视频底部控制条。 */
body .ecom-inspiration-preview__actions {
position: absolute !important;
right: 16px !important;
bottom: 16px !important;
z-index: 2 !important;
display: flex !important;
gap: 10px !important;
}
body .ecom-inspiration-preview__use-prompt {
display: inline-flex !important;
align-items: center !important;
gap: 8px !important;
padding: 10px 20px !important;
border: 1px solid rgba(255, 255, 255, 0.28) !important;
border-radius: 999px !important;
background: rgba(16, 32, 44, 0.72) !important;
backdrop-filter: blur(8px) !important;
-webkit-backdrop-filter: blur(8px) !important;
color: #ffffff !important;
font-size: 14px !important;
font-weight: 600 !important;
cursor: pointer !important;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28) !important;
transition: background 160ms ease, transform 160ms ease, border-color 160ms ease !important;
}
body .ecom-inspiration-preview__use-prompt:hover {
border-color: rgba(30, 189, 219, 0.6) !important;
background: rgba(30, 189, 219, 0.92) !important;
transform: translateY(-1px) !important;
}
@media (max-width: 760px) {
body .ecom-inspiration-preview {
padding: 14px !important;
@@ -13934,3 +14007,77 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
min-height: 36px !important;
max-height: 36px !important;
}
/* Composer menu anchors: place option popovers under the clicked control, not under the whole composer. */
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover {
position: absolute !important;
inset: var(--composer-popover-top, 48px) auto auto var(--composer-popover-left, 0px) !important;
right: auto !important;
bottom: auto !important;
margin: 0 !important;
transform: none !important;
translate: none !important;
z-index: 160 !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--platform {
width: min(360px, calc(100% - var(--composer-popover-left, 0px))) !important;
max-width: min(360px, calc(100% - var(--composer-popover-left, 0px))) !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--languages,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--ratio-picker {
width: min(420px, calc(100% - var(--composer-popover-left, 0px))) !important;
max-width: min(420px, calc(100% - var(--composer-popover-left, 0px))) !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings {
width: min(520px, calc(100% - var(--composer-popover-left, 0px))) !important;
max-width: min(520px, calc(100% - var(--composer-popover-left, 0px))) !important;
}
/* Uploaded assets stay as compact attachments inside the composer hierarchy. */
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) {
min-height: clamp(224px, 18vh, 250px) !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-popover,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-popover {
position: static !important;
grid-column: 1 !important;
display: inline-flex !important;
align-items: center !important;
justify-content: flex-start !important;
justify-self: start !important;
gap: 8px !important;
width: auto !important;
max-width: min(100%, 420px) !important;
min-height: 48px !important;
max-height: 52px !important;
padding: 0 !important;
overflow-x: auto !important;
overflow-y: visible !important;
border: 0 !important;
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
transform: none !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-thumb {
flex: 0 0 48px !important;
width: 48px !important;
height: 48px !important;
border-radius: 12px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-add,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-add {
flex: 0 0 34px !important;
width: 34px !important;
height: 34px !important;
min-height: 34px !important;
margin: 0 !important;
font-size: 22px !important;
}
+107
View File
@@ -12093,3 +12093,110 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
grid-row: auto !important;
}
}
/* Composer menu anchors: place option popovers under the clicked control, not under the whole composer. */
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover {
position: absolute !important;
inset: var(--composer-popover-top, 48px) auto auto var(--composer-popover-left, 0px) !important;
right: auto !important;
bottom: auto !important;
margin: 0 !important;
transform: none !important;
translate: none !important;
z-index: 160 !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--platform {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
/* 平台弹窗宽度仅桌面/平板固定;≤640px 由移动端断点的全宽规则接管。 */
@media (min-width: 641px) {
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--platform {
width: min(460px, calc(100% - 24px)) !important;
max-width: min(460px, calc(100% - 24px)) !important;
}
}
/* 平台选项:logo + 名称横排,名称过长省略,避免在窄网格里溢出弹窗。 */
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--platform button {
display: flex !important;
align-items: center !important;
justify-content: flex-start !important;
gap: 8px !important;
min-width: 0 !important;
text-align: left !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--platform button .ecom-platform-name {
min-width: 0 !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
}
@media (min-width: 641px) {
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--languages,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--ratio-picker {
width: max-content !important;
min-width: 200px !important;
max-width: min(420px, calc(100% - var(--composer-popover-left, 0px))) !important;
}
}
/* 宽设置面板固定宽度并靠右对齐 composer避免从靠右的"设置"按钮左对齐展开时顶出右边缘被裁
仅桌面/平板生效640px 由移动端断点的全宽规则接管 */
@media (min-width: 641px) {
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings {
width: min(520px, calc(100% - 24px)) !important;
max-width: min(520px, calc(100% - 24px)) !important;
left: auto !important;
inset: var(--composer-popover-top, 48px) 12px auto auto !important;
}
}
/* Uploaded assets stay as compact attachments inside the composer hierarchy. */
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) {
min-height: 0 !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-popover,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-popover {
position: static !important;
grid-column: 1 !important;
display: flex !important;
flex-wrap: wrap !important;
align-items: center !important;
justify-content: flex-start !important;
justify-self: start !important;
gap: 10px !important;
width: auto !important;
max-width: 100% !important;
min-height: 0 !important;
max-height: none !important;
padding: 2px 2px 0 !important;
overflow: visible !important;
border: 0 !important;
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
transform: none !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-thumb {
flex: 0 0 64px !important;
width: 64px !important;
height: 64px !important;
border-radius: 14px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-add,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-add {
flex: 0 0 44px !important;
width: 44px !important;
height: 64px !important;
min-height: 44px !important;
margin: 0 !important;
font-size: 24px !important;
}