feat(attach): 附件可配置限额、流式落盘与分阶段上传

管理端可配类型/体积;上传改流式避免整文件进内存;发帖先选再传并拦截未上传提交;提高 Next proxy 体积上限。

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
2026-09-17 07:33:16 +08:00
parent 6cc434f103
commit 61bf9fb48c
24 changed files with 2513 additions and 307 deletions

View File

@@ -404,6 +404,242 @@ body {
border: 1px solid var(--line);
background: var(--panel);
}
.j13-compose-attach-section {
background: var(--panel);
border-color: color-mix(in srgb, var(--line) 80%, var(--accent) 20%);
}
.j13-compose-attach-title {
display: inline-flex;
align-items: center;
gap: 0.45rem;
font-size: 13px !important;
letter-spacing: 0.02em;
color: var(--ink-2) !important;
}
.j13-compose-attach-badge {
display: inline-flex;
align-items: center;
padding: 0.1rem 0.45rem;
border-radius: 999px;
font-size: 11.5px;
font-weight: 700;
font-variant-numeric: tabular-nums;
color: var(--accent);
background: var(--accent-soft);
}
.j13-compose-drop {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 0.35rem;
min-height: 7.5rem;
padding: 1.15rem 1rem;
border-radius: 14px;
border: 1.5px dashed color-mix(in srgb, var(--accent) 42%, var(--line));
background: color-mix(in srgb, var(--accent-soft) 55%, var(--panel));
cursor: pointer;
text-align: center;
transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.j13-compose-drop:hover,
.j13-compose-drop:focus-visible {
border-color: var(--accent);
outline: none;
box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent);
}
.j13-compose-drop.is-over {
border-color: var(--accent);
border-style: solid;
background: color-mix(in srgb, var(--accent-soft) 85%, var(--panel));
}
.j13-compose-drop.is-disabled {
opacity: 0.55;
pointer-events: none;
}
.j13-compose-drop-icon {
color: var(--accent);
opacity: 0.85;
}
.j13-compose-drop-lead {
margin: 0;
font-size: 14px;
font-weight: 650;
color: var(--ink);
}
.j13-compose-drop-hint {
margin: 0;
font-size: 12px;
line-height: 1.45;
color: var(--ink-3);
max-width: 36rem;
}
.j13-compose-att-list,
.j13-compose-att-queue {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 0.55rem;
}
.j13-compose-att-pending {
margin-top: 0.75rem;
padding: 12px;
border-radius: 14px;
border: 1.5px solid color-mix(in srgb, var(--accent) 40%, var(--line));
background: color-mix(in srgb, var(--accent-soft) 70%, var(--panel));
display: flex;
flex-direction: column;
gap: 0.65rem;
}
.j13-compose-att-pending-head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
flex-wrap: wrap;
}
.j13-compose-att-pending-title {
margin: 0;
font-size: 13.5px;
font-weight: 600;
color: var(--ink);
}
.j13-compose-att-upload-btn {
width: 100%;
justify-content: center;
gap: 0.45rem;
min-height: 42px;
font-size: 14.5px;
font-weight: 600;
/* 次于发布主 CTA:白底 + 实线 accent,在 soft 待传区里仍清晰 */
color: var(--accent);
background: var(--panel);
border-color: var(--accent);
border-width: 1.5px;
box-shadow: 0 1px 2px rgba(16, 24, 40, 0.06),
0 2px 8px color-mix(in srgb, var(--accent) 14%, transparent);
}
.j13-compose-att-upload-btn:hover:not(:disabled) {
color: var(--accent-on);
background: var(--accent);
border-color: var(--accent);
}
.j13-compose-att-upload-btn:active:not(:disabled) {
background: var(--accent-hi);
border-color: var(--accent-hi);
color: var(--accent-on);
}
.j13-compose-att-card {
display: flex;
align-items: center;
gap: 10px;
padding: 10px 12px;
border-radius: 12px;
border: 1px solid var(--line);
background: var(--panel);
}
.j13-compose-att-card.is-error {
border-color: color-mix(in srgb, var(--danger, #c44) 45%, var(--line));
}
.j13-compose-att-name {
font-size: 13.5px;
font-weight: 600;
color: var(--ink);
}
.j13-compose-att-bar {
margin-top: 6px;
height: 4px;
border-radius: 999px;
background: var(--panel-2);
overflow: hidden;
}
.j13-compose-att-bar > span {
display: block;
height: 100%;
border-radius: inherit;
background: var(--accent);
transition: width 0.2s ease;
}
.j13-ext-editor.is-disabled {
opacity: 0.55;
pointer-events: none;
}
.j13-ext-warn {
margin: 0 0 0.75rem;
padding: 0.55rem 0.75rem;
border-radius: 10px;
font-size: 12.5px;
line-height: 1.45;
color: color-mix(in srgb, var(--gold) 85%, var(--ink));
background: color-mix(in srgb, var(--gold) 14%, var(--panel));
border: 1px solid color-mix(in srgb, var(--gold) 28%, var(--line));
}
.j13-ext-groups {
display: flex;
flex-wrap: wrap;
gap: 0.4rem;
margin-bottom: 0.65rem;
}
.j13-ext-wall {
display: flex;
flex-wrap: wrap;
gap: 0.4rem;
align-items: center;
min-height: 2.75rem;
padding: 0.55rem 0.65rem;
border-radius: 12px;
border: 1px solid var(--line);
background: var(--panel-2);
cursor: text;
}
.j13-ext-chip {
display: inline-flex;
align-items: center;
gap: 0.2rem;
padding: 0.2rem 0.35rem 0.2rem 0.55rem;
border-radius: 999px;
font-size: 12.5px;
font-weight: 650;
font-variant-numeric: tabular-nums;
color: var(--ink);
background: var(--panel);
border: 1px solid var(--line);
}
.j13-ext-chip-x {
display: inline-flex;
align-items: center;
justify-content: center;
width: 1.15rem;
height: 1.15rem;
border: 0;
border-radius: 999px;
background: transparent;
color: var(--ink-3);
cursor: pointer;
}
.j13-ext-chip-x:hover {
color: var(--ink);
background: color-mix(in srgb, var(--ink) 8%, transparent);
}
.j13-ext-input-wrap {
display: inline-flex;
align-items: center;
gap: 0.25rem;
min-width: 9rem;
flex: 1 1 8rem;
}
.j13-ext-input {
flex: 1;
min-width: 0;
border: 0;
outline: none;
background: transparent;
font-size: 13px;
color: var(--ink);
padding: 0.2rem 0;
}
.j13-compose-att-paid {
color: var(--gold);
font-weight: 650;