style: 统一主体列表搜索与统计布局

src/features/breakdown/components/SubjectList.vue

@@ -19,16 +19,20 @@ const filtered = computed(() =>
 
 <template>
     <div class="p-5 lg:p-7">
-        <div class="mb-5 flex items-center justify-between gap-3">
-            <p class="text-sm text-muted">{{ subjects.length }} 个主体</p>
-            <div class="search-field">
-                <Search :size="14" /><NInput
-                    placeholder="搜索名称或引用"
-                    aria-label="搜索主体"
-                    :input-props="{ 'aria-label': '搜索主体' }"
-                    v-model:value="search"
-                ></NInput>
-            </div>
+        <div class="subject-list-toolbar">
+            <NInput
+                class="subject-list-search"
+                placeholder="搜索名称或引用"
+                aria-label="搜索主体"
+                :input-props="{ 'aria-label': '搜索主体' }"
+                v-model:value="search"
+                clearable
+                ><template #prefix><Search :size="14" aria-hidden="true" /></template
+            ></NInput>
+            <p class="subject-list-count" role="status">
+                <template v-if="search.trim()">匹配 {{ filtered.length }} / {{ subjects.length }} 个主体</template>
+                <template v-else>共 {{ subjects.length }} 个主体</template>
+            </p>
         </div>
         <div v-if="filtered.length" class="record-list subject-record-list">
             <article v-for="subject in filtered" :key="subject.profileId">