From e6d11030a9b33a923b746340cf1cfccaba03adc7 Mon Sep 17 00:00:00 2001
From: jxxghp <jxxghp@gmail.com>
Date: Sat, 5 Sep 2026 22:57:58 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E6=95=B4=E7=90=86?=
 =?UTF-8?q?=E5=8E=86=E5=8F=B2=E7=AD=9B=E9=80=89=E6=A1=86=E5=92=8C=E8=87=AA?=
 =?UTF-8?q?=E5=8A=A8=E5=88=86=E7=B1=BB=E5=BC=B9=E7=AA=97=E5=AF=B9=E9=BD=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ClassificationHelpDialog.vue              | 10 ++++++++-
 src/views/reorganize/TransferHistoryView.vue  | 21 +++++++++++++-----
 .../__tests__/TransferHistoryView.spec.ts     | 22 ++++++++++++++++++-
 .../setting/AccountSettingClassification.vue  | 10 +++------
 .../AccountSettingClassification.spec.ts      |  7 +++++-
 5 files changed, 54 insertions(+), 16 deletions(-)

diff --git a/src/components/classification/ClassificationHelpDialog.vue b/src/components/classification/ClassificationHelpDialog.vue
index 9d85a611..4530530f 100644
--- a/src/components/classification/ClassificationHelpDialog.vue
+++ b/src/components/classification/ClassificationHelpDialog.vue
@@ -69,7 +69,7 @@ function close(): void {
       </VCardText>
 
       <VDivider />
-      <VCardActions>
+      <VCardActions class="classification-help-dialog__actions">
         <VSpacer />
         <VBtn color="primary" variant="tonal" prepend-icon="mdi-check" @click="close">
           {{ t('setting.classification.helpClose') }}
@@ -80,6 +80,10 @@ function close(): void {
 </template>
 
 <style scoped>
+.classification-help-dialog__actions {
+  padding: 16px 24px;
+}
+
 .classification-help-dialog__content {
   display: grid;
   gap: 0;
@@ -147,6 +151,10 @@ function close(): void {
 }
 
 @media (max-width: 599px) {
+  .classification-help-dialog__actions {
+    padding-inline: 14px;
+  }
+
   .classification-help-dialog__content {
     padding-inline: 14px;
   }
diff --git a/src/views/reorganize/TransferHistoryView.vue b/src/views/reorganize/TransferHistoryView.vue
index e0f5a82d..dd3cb1d4 100644
--- a/src/views/reorganize/TransferHistoryView.vue
+++ b/src/views/reorganize/TransferHistoryView.vue
@@ -1649,7 +1649,7 @@ onUnmounted(() => {
                 :placeholder="t('transferHistory.searchPlaceholder')"
                 :aria-label="t('transferHistory.searchPlaceholder')"
                 prepend-inner-icon="mdi-magnify"
-                variant="plain"
+                variant="outlined"
                 single-line
                 hide-details
                 clearable
@@ -1661,7 +1661,7 @@ onUnmounted(() => {
                 item-value="value"
                 :prepend-inner-icon="currentStatusFilter.icon"
                 density="compact"
-                variant="plain"
+                variant="outlined"
                 hide-details
                 class="transfer-history-desktop-status"
                 :aria-label="t('transferHistory.statusFilter.label')"
@@ -2245,22 +2245,31 @@ onUnmounted(() => {
   box-shadow: 0 0 0 3px rgba(var(--v-theme-primary), 0.12);
 }
 
-.transfer-history-desktop-filter-group :deep(.v-input) {
+// 当前样式未 scoped，直接限定组合框后代，保留 outlined 控件的居中和图标留白。
+.transfer-history-desktop-filter-group .v-input {
+  grid-template-rows: 1fr;
   min-inline-size: 0;
   margin: 0;
 }
 
-.transfer-history-desktop-filter-group :deep(.v-field) {
+.transfer-history-desktop-filter-group .v-input .v-field {
   border-radius: 0;
+  -webkit-backdrop-filter: none;
+  backdrop-filter: none;
   background: transparent !important;
   box-shadow: none !important;
 }
 
-.transfer-history-desktop-filter-group :deep(.v-field__outline),
-.transfer-history-desktop-filter-group :deep(.v-field__overlay) {
+.transfer-history-desktop-filter-group .v-field__outline,
+.transfer-history-desktop-filter-group .v-field__overlay {
   display: none;
 }
 
+// 组合框随工具栏拉高时，文字行与两侧图标仍共用同一条中心线。
+.transfer-history-desktop-filter-group .v-field__field {
+  align-items: center;
+}
+
 .transfer-history-desktop-search {
   flex: 1 1 auto;
   min-inline-size: 12rem;
diff --git a/src/views/reorganize/__tests__/TransferHistoryView.spec.ts b/src/views/reorganize/__tests__/TransferHistoryView.spec.ts
index 0e828a78..eb8913cc 100644
--- a/src/views/reorganize/__tests__/TransferHistoryView.spec.ts
+++ b/src/views/reorganize/__tests__/TransferHistoryView.spec.ts
@@ -455,7 +455,6 @@ describe('TransferHistoryView', () => {
     expect(transferHistorySource).toContain('class="transfer-history-desktop-filter-group"')
     expect(transferHistorySource).toContain('class="text-disabled transfer-history-desktop-search"')
     expect(transferHistorySource).toContain('class="transfer-history-desktop-status"')
-    expect(transferHistorySource).toContain('variant="plain"')
     expect(transferHistorySource).toContain('transfer-history-desktop-filter-group:focus-within')
     expect(transferHistorySource).toContain('border-inline-start: 1px solid')
     expect(transferHistorySource).not.toContain(':label="t(\'transferHistory.statusFilter.label\')"')
@@ -467,6 +466,27 @@ describe('TransferHistoryView', () => {
     expect(mobileTitlebarSource).not.toContain('settings-icon-button')
   })
 
+  it('keeps native outlined alignment and icon insets inside the shared desktop border', () => {
+    const desktopFilterSource = transferHistorySource.slice(
+      transferHistorySource.indexOf('class="transfer-history-desktop-filter-group"'),
+      transferHistorySource.indexOf('<VCol cols="4" md="4"'),
+    )
+
+    expect(desktopFilterSource.match(/variant="outlined"/g)).toHaveLength(2)
+    expect(desktopFilterSource).not.toContain('variant="plain"')
+    expect(transferHistorySource).toContain('.transfer-history-desktop-filter-group .v-input .v-field {')
+    expect(transferHistorySource).toContain(
+      '.transfer-history-desktop-filter-group .v-input {\n  grid-template-rows: 1fr;',
+    )
+    expect(transferHistorySource).toContain(
+      '.transfer-history-desktop-filter-group .v-field__outline,\n.transfer-history-desktop-filter-group .v-field__overlay {\n  display: none;',
+    )
+    expect(transferHistorySource).not.toContain('.transfer-history-desktop-filter-group :deep(')
+    expect(transferHistorySource).toContain(
+      '.transfer-history-desktop-filter-group .v-field__field {\n  align-items: center;',
+    )
+  })
+
   it('selects a mobile status from the titlebar dropdown and refreshes with the explicit status query', async () => {
     mocks.desktop = false
     const requests: Array<Record<string, unknown>> = []
diff --git a/src/views/setting/AccountSettingClassification.vue b/src/views/setting/AccountSettingClassification.vue
index 3c29a256..813e0070 100644
--- a/src/views/setting/AccountSettingClassification.vue
+++ b/src/views/setting/AccountSettingClassification.vue
@@ -464,12 +464,8 @@ watch(analysisTab, tab => {
               {{ t('setting.classification.unsaved') }}
             </VChip>
           </div>
-          <VBtn
-            icon="mdi-help-circle-outline"
-            variant="text"
-            :aria-label="t('setting.classification.helpButton')"
-            @click="helpDialog = true"
-          >
+          <VBtn icon variant="text" :aria-label="t('setting.classification.helpButton')" @click="helpDialog = true">
+            <VIcon icon="mdi-help-circle-outline" />
             <VTooltip activator="parent" location="bottom">
               {{ t('setting.classification.helpButton') }}
             </VTooltip>
@@ -719,7 +715,7 @@ watch(analysisTab, tab => {
 
 .classification-settings__header-actions {
   display: flex;
-  align-items: flex-start;
+  align-items: center;
   gap: 0.5rem;
 }
 
diff --git a/src/views/setting/__tests__/AccountSettingClassification.spec.ts b/src/views/setting/__tests__/AccountSettingClassification.spec.ts
index 347f8522..2933f776 100644
--- a/src/views/setting/__tests__/AccountSettingClassification.spec.ts
+++ b/src/views/setting/__tests__/AccountSettingClassification.spec.ts
@@ -355,7 +355,9 @@ describe('AccountSettingClassification', () => {
     const user = userEvent.setup()
     await renderWithProviders(AccountSettingClassification)
 
-    await user.click(await screen.findByRole('button', { name: '查看自动分类帮助' }))
+    const helpButton = await screen.findByRole('button', { name: '查看自动分类帮助' })
+    expect(helpButton.querySelector('.v-icon')).toBeInTheDocument()
+    await user.click(helpButton)
 
     const dialog = await screen.findByRole('dialog')
     expect(dialog).toHaveTextContent('自动分类使用说明')
@@ -363,6 +365,9 @@ describe('AccountSettingClassification', () => {
     expect(dialog).toHaveTextContent('预览分类结果')
     expect(dialog).toHaveTextContent('查看影响范围')
     expect(dialog).toHaveTextContent('查看历史和回退')
+    expect(
+      screen.getByRole('button', { name: '知道了' }).closest('.classification-help-dialog__actions'),
+    ).not.toBeNull()
   })
 
   it('replaces category, fallback, and rule slices without losing the rest of the draft', async () => {