style(web): AI 工作台附件卡片样式与交互适配

- personal-workbench-ai-mode.css 新增 workbench-ai-file-card 系列样式,file-strip 改为 flex-wrap 左对齐排布卡片,移除按钮样式随卡片重构
- workbench-ai-mode-switch 测试补充附件卡片相关断言
This commit is contained in:
caoxiaozhu
2026-06-21 23:24:36 +08:00
parent d660a961fb
commit 08a4fa3577
2 changed files with 113 additions and 12 deletions

View File

@@ -163,6 +163,8 @@ const orbRule = readRuleBody(aiModeStyles, '.workbench-ai-orb')
const orbImageRule = readRuleBody(aiModeStyles, '.workbench-ai-orb__image')
const composerRule = readRuleBody(aiModeStyles, '.workbench-ai-composer')
const composerTextareaRule = readRuleBody(aiModeStyles, '.workbench-ai-composer textarea')
const fileStripRule = readRuleBody(aiModeStyles, '.workbench-ai-file-strip')
const fileCardRule = readRuleBody(aiModeStyles, '.workbench-ai-file-card')
const orbIconAsset = fileURLToPath(
new URL('../src/assets/workbench-ai-mode-orb-icon.gif', import.meta.url)
)
@@ -218,6 +220,13 @@ test('AI mode screen follows the approved reference structure', () => {
assert.match(aiMode, /费用测算中,请稍等/)
assert.match(aiMode, /rows="3"/)
assert.match(aiMode, /workbench-ai-composer-toolbar/)
assert.match(aiMode, /<article v-for="file in selectedFileCards"[\s\S]*class="workbench-ai-file-card"/)
assert.match(aiMode, /:aria-label="`移除附件 \$\{file\.name\}`"/)
assert.match(aiMode, /function removeAiModeFile\(fileKey\)/)
assert.match(aiMode, /const selectedFileCards = computed/)
assert.match(aiMode, /resolveAiComposerFileType\(file\)/)
assert.match(aiMode, /AI_COMPOSER_FILE_TYPE_META = \{[\s\S]*pdf:\s*\{ label:\s*'PDF'/)
assert.doesNotMatch(aiMode, /已选择 \{\{ selectedFiles\.length \}\} 份附件/)
assert.match(aiMode, /Axiom Ultra 3\.1/)
assert.match(aiMode, /mdi mdi-calendar-range/)
assert.match(aiMode, /workbench-ai-date-popover/)
@@ -324,6 +333,12 @@ test('AI mode screen follows the approved reference structure', () => {
assert.match(aiModeStyles, /\.workbench-ai-mode\s*\{[\s\S]*min-height:\s*100%;[\s\S]*background:/)
assert.match(aiModeStyles, /\.workbench-ai-mode\.has-conversation\s*\{[\s\S]*place-items:\s*stretch;[\s\S]*padding:\s*0;/)
assert.match(aiModeStyles, /\.workbench-ai-composer\s*\{[\s\S]*border-radius:\s*20px;[\s\S]*box-shadow:/)
assert.match(fileStripRule, /flex-wrap:\s*wrap;/)
assert.match(fileStripRule, /justify-content:\s*flex-start;/)
assert.match(fileCardRule, /grid-template-columns:\s*48px minmax\(0,\s*1fr\) 30px;/)
assert.match(fileCardRule, /border-radius:\s*16px;/)
assert.match(aiModeStyles, /\.workbench-ai-file-card__body strong,[\s\S]*\.workbench-ai-file-card__body small\s*\{[\s\S]*text-overflow:\s*ellipsis;/)
assert.match(aiModeStyles, /\.workbench-ai-file-card__remove\s*\{[\s\S]*border-radius:\s*999px;/)
assert.match(composerRule, /min-height:\s*154px;/)
assert.match(composerRule, /grid-template-rows:\s*minmax\(80px,\s*1fr\) auto;/)
assert.match(composerTextareaRule, /min-height:\s*80px;/)