YG-Soft/X-Financial
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(workbench): stretch profile tag card

Browse Source
This commit is contained in:
caoxiaozhu
2026-06-03 15:53:30 +08:00
parent 34457f9c3e
commit 8887cf5a27
2 changed files with 22 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
web/src/components/business/ExpenseProfileTagPager.vue
View File

@@ -136,18 +136,19 @@ watch([() => props.visible, tagIdentity], ([visible]) => {
<style scoped> <style scoped>
.profile-tag-pager { .profile-tag-pager {
height: 100%;
min-height: 308px; min-height: 308px;
display: grid; display: grid;
grid-template-rows: 272px 26px; grid-template-rows: minmax(0, 1fr) 26px;
gap: 10px; gap: 10px;
} }
.profile-tag-list { .profile-tag-list {
display: grid; display: grid;
grid-template-rows: repeat(5, 48px); grid-template-rows: repeat(5, minmax(48px, 1fr));
align-content: start; align-content: stretch;
gap: 8px; gap: 8px;
min-height: 272px; min-height: 0;
animation: profileTagPageIn 180ms cubic-bezier(0.2, 0, 0, 1) both; animation: profileTagPageIn 180ms cubic-bezier(0.2, 0, 0, 1) both;
} }
@@ -159,7 +160,7 @@ watch([() => props.visible, tagIdentity], ([visible]) => {
grid-template-columns: minmax(0, 1fr) auto; grid-template-columns: minmax(0, 1fr) auto;
align-items: center; align-items: center;
gap: 10px; gap: 10px;
min-height: 48px; min-height: 0;
padding: 7px 10px; padding: 7px 10px;
border: 1px solid rgba(var(--tag-accent-rgb), 0.2); border: 1px solid rgba(var(--tag-accent-rgb), 0.2);
border-left: 3px solid rgb(var(--tag-accent-rgb)); border-left: 3px solid rgb(var(--tag-accent-rgb));

16
web/tests/expense-profile-tag-pager.test.mjs Normal file
View File

@@ -0,0 +1,16 @@
import assert from 'node:assert/strict'
import { readFileSync } from 'node:fs'
import test from 'node:test'
import { fileURLToPath } from 'node:url'
const pager = readFileSync(
fileURLToPath(new URL('../src/components/business/ExpenseProfileTagPager.vue', import.meta.url)),
'utf8'
)
test('profile tag pager stretches tag rows to the bottom of the card', () => {
assert.match(pager, /\.profile-tag-pager\s*\{[\s\S]*height:\s*100%;/)
assert.match(pager, /\.profile-tag-pager\s*\{[\s\S]*grid-template-rows:\s*minmax\(0,\s*1fr\) 26px;/)
assert.match(pager, /\.profile-tag-list\s*\{[\s\S]*grid-template-rows:\s*repeat\(5,\s*minmax\(48px,\s*1fr\)\);/)
assert.match(pager, /\.profile-tag-list\s*\{[\s\S]*align-content:\s*stretch;/)
})