mirror of
https://github.com/jxxghp/MoviePilot-Frontend.git
synced 2026-09-08 17:26:41 +08:00
fix: 修复整理历史筛选框和自动分类弹窗对齐
This commit is contained in:
@@ -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;
|
||||
}
|
||||
|
||||
@@ -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;
|
||||
|
||||
@@ -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>> = []
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
|
||||
@@ -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 () => {
|
||||
|
||||
Reference in New Issue
Block a user