fix(web-admin): stick category header tools with MpBusinessHeader.

Move expand-all and add into a header actions slot so they remain visible while scrolling.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
wuzilongandCursor committed 2026-10-18 16:40:35 +08:00
1 parent efe7f77a66
commit ef71e842ee
4 files changed
+184 -26

No files matched your search

@@ -0,0 +1,61 @@
<template>
<header class="mp-wv-header">
<div class="mp-wv-header__row">
<button
class="mp-wv-header__back mp-wv-touch-target"
type="button"
:aria-label="backLabel"
@click="emit('back')"
>
←
</button>
<h1 class="mp-wv-header__title">{{ title }}</h1>
<div v-if="$slots.actions" class="mp-wv-header__actions">
<slot name="actions" />
</div>
</div>
<slot name="before-search" />
<input
v-if="searchable"
class="mp-wv-search mp-wv-touch-target"
type="search"
:value="keyword"
:aria-label="searchLabel"
:placeholder="searchPlaceholder"
autocomplete="off"
@input="updateKeyword"
@keyup.enter="emit('search')"
/>
<slot name="after-search" />
</header>
</template>
<script setup lang="ts">
withDefaults(
defineProps<{
title: string
backLabel?: string
searchable?: boolean
keyword?: string
searchPlaceholder?: string
searchLabel?: string
}>(),
{
backLabel: '返回',
searchable: false,
keyword: '',
searchPlaceholder: '搜索',
searchLabel: '搜索'
}
)
const emit = defineEmits<{
back: []
search: []
'update:keyword': [value: string]
}>()
function updateKeyword(event: Event) {
emit('update:keyword', (event.target as HTMLInputElement).value)
}
</script>