refactor(F006-W10): 8 view 标准化 (PageHeader/SearchBar 替换)

批次 1-3 共 10 个 view 套标准组件:
- 批次 1 (5): feedback/help/lunbo/label/textconfig
- 批次 2 (2): region/categoryGood (保留 el-table 树形)
- 批次 3 (3): groupbuy/seckill/supplierBrand

改动: 替换硬编码 rr-page-header/rr-card rr-search 为 PageHeader/SearchBar 组件
规范: 按 F006-VIEW-TEMPLATE.md 8 条硬性约定
验证: 13 URL 200 OK, build 4.04s, dist gzip 375KB

src/modules/api/feedback/FeedbackListView.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 /**
- * F006 意见反馈 - W6 P0 完整化
+ * F006 意见反馈 - W10 A1 标准化
  *
  * 沿用老 vue api/feedback.vue 137 行:
  *   - 搜索: 用户昵称
@@ -8,11 +8,14 @@
  *   - 操作: 预览 / 删除
  *   - 预览弹窗展示完整反馈内容 (含图片列表)
  *   - /api/feedback 后端 404 → FALLBACK mock
+ *
+ * W10 A1: 套 PageHeader/SearchBar 标准化模板 (无 STATUS_MAP, 无增改弹窗)
  */
 import { ref, onMounted, reactive } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
-import { httpGet } from '@/utils/request'
 import DataTable from '@/components/DataTable/DataTable.vue'
+import PageHeader from '@/components/PageHeader/PageHeader.vue'
+import SearchBar from '@/components/SearchBar/SearchBar.vue'
 
 interface Feedback {
   id: string
@@ -27,6 +30,7 @@ interface Feedback {
   raw: any
 }
 
+// ========== 端点 404 降级 mock ==========
 const FALLBACK: Feedback[] = [
   { id: 'F001', userId: 'U10086', nickName: '张经理', phone: '13800138001', title: '订单延迟发货', content: '我们于6月28日下单采购一批钢材, 至今未发货, 影响项目进度, 请尽快处理。', orderCode: 'O20260628001', createDate: '2026-07-01 09:32:18', imgList: ['https://placehold.co/120x120/2563EB/fff?text=IMG1', 'https://placehold.co/120x120/2563EB/fff?text=IMG2'], raw: {} },
   { id: 'F002', userId: 'U10087', nickName: '李工', phone: '13900139002', title: '产品质量问题', content: '收到的商品有破损, 已拍照。附件图1是外包装破损, 图2是商品本身。', orderCode: 'O20260630002', createDate: '2026-07-02 11:15:42', imgList: ['https://placehold.co/120x120/DC2626/fff?text=BAD1'], raw: {} },
@@ -36,17 +40,20 @@ const FALLBACK: Feedback[] = [
   { id: 'F006', userId: 'U10091', nickName: '孙技术', phone: '13400134006', title: '功能建议: 自定义审批流', content: '建议在询价单模块增加自定义审批流, 当前固定流程不够灵活。', orderCode: '', createDate: '2026-07-04 09:10:00', imgList: [], raw: {} }
 ]
 
+// ========== 标准状态 ==========
 const list = ref<Feedback[]>([])
 const total = ref(0)
 const loading = ref(false)
 const error = ref<string | null>(null)
 const page = ref(1)
 const limit = ref(20)
-const filters = reactive({ nickName: '' })
+const filters = reactive<{ nickName: string }>({ nickName: '' })
 
+// ========== 弹窗状态 ==========
 const previewVisible = ref(false)
 const previewData = ref<Feedback | null>(null)
 
+// ========== 加载逻辑 ==========
 async function load() {
   loading.value = true
   error.value = null
@@ -63,6 +70,7 @@ async function load() {
   } finally { loading.value = false }
 }
 
+// ========== 事件 ==========
 function onSearch() { page.value = 1; load() }
 function onReset() { filters.nickName = ''; load() }
 function onPageChange(p: number) { page.value = p; load() }
@@ -80,24 +88,16 @@ onMounted(load)
 
 <template>
   <div class="rr-page">
-    <div class="rr-page-header">
+    <PageHeader title="意见反馈" :sub="`用户反馈信息管理 (共 ${total} 条)`" />
-      <div>
-        <h2 class="rr-page-title">意见反馈</h2>
-        <p class="rr-page-sub">用户反馈信息管理 (共 {{ total }} 条)</p>
-      </div>
-    </div>
 
-    <div class="rr-card rr-search">
+    <SearchBar
-      <el-form :inline="true" @keyup.enter="onSearch">
+      v-model:filters="filters"
-        <el-form-item label="用户昵称">
+      :fields="[
-          <el-input v-model="filters.nickName" placeholder="请输入用户昵称" clearable style="width: 240px" />
+        { key: 'nickName', label: '用户昵称', type: 'text', placeholder: '请输入用户昵称' }
-        </el-form-item>
+      ]"
-        <el-form-item>
+      @search="onSearch"
-          <el-button type="primary" @click="onSearch">查询</el-button>
+      @reset="onReset"
-          <el-button @click="onReset">重置</el-button>
+    />
-        </el-form-item>
-      </el-form>
-    </div>
 
     <div class="rr-card">
       <DataTable
@@ -164,11 +164,6 @@ onMounted(load)
 
 <style scoped lang="scss">
 .rr-page { max-width: 1400px; }
-.rr-page-header { margin-bottom: 16px; display: flex; justify-content: space-between; align-items: flex-start; }
-.rr-page-title { font-size: 22px; font-weight: 600; color: var(--ink); margin: 0 0 4px 0; }
-.rr-page-sub { color: var(--ink-3); font-size: 13px; margin: 0; }
-.rr-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; margin-bottom: 16px; }
-.rr-search { padding: 16px 20px; }
 .feedback-imgs { display: flex; gap: 8px; flex-wrap: wrap; }
 .feedback-img-item { width: 80px; height: 80px; border-radius: 6px; border: 1px solid var(--border); }
 </style>

src/modules/api/help/HelpListView.vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
 /**
- * F006 帮助中心 - W6 P0 完整化
+ * F006 帮助中心 - W10 A1 标准化
+ *
+ * W10 A1: 套 PageHeader/SearchBar 标准化模板
  *
  * 沿用老 vue api/help.vue 60 行:
  *   - 搜索: 标题
@@ -12,6 +14,8 @@ import { ref, onMounted, reactive } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { httpGet } from '@/utils/request'
 import DataTable from '@/components/DataTable/DataTable.vue'
+import PageHeader from '@/components/PageHeader/PageHeader.vue'
+import SearchBar from '@/components/SearchBar/SearchBar.vue'
 
 interface Help {
   id: string
@@ -84,27 +88,18 @@ onMounted(load)
 
 <template>
   <div class="rr-page">
-    <div class="rr-page-header">
+    <PageHeader title="帮助中心" :sub="`常见问题与帮助文档管理 (共 ${total} 条)`">
-      <div>
-        <h2 class="rr-page-title">帮助中心</h2>
-        <p class="rr-page-sub">常见问题与帮助文档管理 (共 {{ total }} 条)</p>
-      </div>
-      <div class="rr-page-actions">
       <el-button type="primary" @click="onAdd">新增文档</el-button>
-      </div>
+    </PageHeader>
-    </div>
 
-    <div class="rr-card rr-search">
+    <SearchBar
-      <el-form :inline="true" @keyup.enter="onSearch">
+      v-model:filters="filters"
-        <el-form-item label="标题">
+      :fields="[
-          <el-input v-model="filters.title" placeholder="请输入标题" clearable style="width: 280px" />
+        { key: 'title', label: '标题', type: 'text', placeholder: '请输入标题' }
-        </el-form-item>
+      ]"
-        <el-form-item>
+      @search="onSearch"
-          <el-button type="primary" @click="onSearch">查询</el-button>
+      @reset="onReset"
-          <el-button @click="onReset">重置</el-button>
+    />
-        </el-form-item>
-      </el-form>
-    </div>
 
     <div class="rr-card">
       <DataTable
@@ -158,9 +153,4 @@ onMounted(load)
 
 <style scoped lang="scss">
 .rr-page { max-width: 1400px; }
-.rr-page-header { margin-bottom: 16px; display: flex; justify-content: space-between; align-items: flex-start; }
-.rr-page-title { font-size: 22px; font-weight: 600; color: var(--ink); margin: 0 0 4px 0; }
-.rr-page-sub { color: var(--ink-3); font-size: 13px; margin: 0; }
-.rr-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; margin-bottom: 16px; }
-.rr-search { padding: 16px 20px; }
 </style>

src/modules/api/lunbo/LunboListView.vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
 /**
- * F006 轮播图管理 - W6 P0 完整化
+ * F006 轮播图管理 - W10 A1 标准化
+ *
+ * W10 A1: 套 PageHeader/SearchBar 标准化模板
  *
  * 沿用老 vue api/lunbo.vue 88 行:
  *   - 搜索: 标题 / 展示位置
@@ -12,6 +14,8 @@ import { ref, onMounted, reactive } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { httpGet } from '@/utils/request'
 import DataTable from '@/components/DataTable/DataTable.vue'
+import PageHeader from '@/components/PageHeader/PageHeader.vue'
+import SearchBar from '@/components/SearchBar/SearchBar.vue'
 
 interface Lunbo {
   id: string
@@ -100,33 +104,22 @@ onMounted(load)
 
 <template>
   <div class="rr-page">
-    <div class="rr-page-header">
+    <PageHeader title="轮播图管理" :sub="`App/小程序首页与商城轮播图配置 (共 ${total} 张)`">
-      <div>
-        <h2 class="rr-page-title">轮播图管理</h2>
-        <p class="rr-page-sub">App/小程序首页与商城轮播图配置 (共 {{ total }} 张)</p>
-      </div>
-      <div class="rr-page-actions">
       <el-button type="primary" @click="onAdd">新增轮播</el-button>
-      </div>
+    </PageHeader>
-    </div>
 
-    <div class="rr-card rr-search">
+    <SearchBar
-      <el-form :inline="true" @keyup.enter="onSearch">
+      v-model:filters="filters"
-        <el-form-item label="标题">
+      :fields="[
-          <el-input v-model="filters.title" placeholder="请输入标题" clearable style="width: 220px" />
+        { key: 'title', label: '标题', type: 'text', placeholder: '请输入标题' },
-        </el-form-item>
+        { key: 'position', label: '展示位置', type: 'select', options: [
-        <el-form-item label="展示位置">
+          { value: 1, label: '首页' },
-          <el-select v-model="filters.position" placeholder="全部" clearable style="width: 160px">
+          { value: 2, label: '在线商城' }
-            <el-option label="首页" :value="1" />
+        ] }
-            <el-option label="在线商城" :value="2" />
+      ]"
-          </el-select>
+      @search="onSearch"
-        </el-form-item>
+      @reset="onReset"
-        <el-form-item>
+    />
-          <el-button type="primary" @click="onSearch">查询</el-button>
-          <el-button @click="onReset">重置</el-button>
-        </el-form-item>
-      </el-form>
-    </div>
 
     <div class="rr-card">
       <DataTable
@@ -205,10 +198,5 @@ onMounted(load)
 
 <style scoped lang="scss">
 .rr-page { max-width: 1400px; }
-.rr-page-header { margin-bottom: 16px; display: flex; justify-content: space-between; align-items: flex-start; }
-.rr-page-title { font-size: 22px; font-weight: 600; color: var(--ink); margin: 0 0 4px 0; }
-.rr-page-sub { color: var(--ink-3); font-size: 13px; margin: 0; }
-.rr-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; margin-bottom: 16px; }
-.rr-search { padding: 16px 20px; }
 .lunbo-thumb { width: 80px; height: 60px; border-radius: 4px; border: 1px solid var(--border); }
 </style>

src/modules/other/categoryGood/CategoryGoodListView.vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
 /**
- * F006 商品分类 - W6 P0 完整化
+ * F006 商品分类 - W10 A2 标准化
+ *
+ * W10 A2: 套 PageHeader/SearchBar (保留 el-table 树形, DataTable 不支持树形)
  *
  * 沿用老 vue other/categoryGood.vue 273 行:
  *   - 搜索: 分类名
@@ -13,6 +15,8 @@
 import { ref, onMounted, reactive, computed } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { httpGet } from '@/utils/request'
+import PageHeader from '@/components/PageHeader/PageHeader.vue'
+import SearchBar from '@/components/SearchBar/SearchBar.vue'
 
 interface Category {
   id: string
@@ -138,28 +142,19 @@ onMounted(load)
 
 <template>
   <div class="rr-page">
-    <div class="rr-page-header">
+    <PageHeader title="商品分类" :sub="`商品 3 级分类管理 (含子级: ${tree.length} 个一级分类)`">
-      <div>
-        <h2 class="rr-page-title">商品分类</h2>
-        <p class="rr-page-sub">商品 3 级分类管理 (含子级: {{ tree.length }} 个一级分类)</p>
-      </div>
-      <div class="rr-page-actions">
       <el-button type="primary" @click="onAdd()">新增一级分类</el-button>
       <el-button type="danger" :disabled="selection.length === 0" @click="onBatchDelete">批量删除 ({{ selection.length }})</el-button>
-      </div>
+    </PageHeader>
-    </div>
 
-    <div class="rr-card rr-search">
+    <SearchBar
-      <el-form :inline="true" @keyup.enter="onSearch">
+      v-model:filters="filters"
-        <el-form-item label="分类名称">
+      :fields="[
-          <el-input v-model="filters.name" placeholder="请输入分类名" clearable style="width: 240px" />
+        { key: 'name', label: '分类名称', type: 'text', placeholder: '请输入分类名' }
-        </el-form-item>
+      ]"
-        <el-form-item>
+      @search="onSearch"
-          <el-button type="primary" @click="onSearch">查询</el-button>
+      @reset="onReset"
-          <el-button @click="onReset">重置</el-button>
+    />
-        </el-form-item>
-      </el-form>
-    </div>
 
     <div class="rr-card">
       <el-table
@@ -225,10 +220,5 @@ onMounted(load)
 
 <style scoped lang="scss">
 .rr-page { max-width: 1500px; }
-.rr-page-header { margin-bottom: 16px; display: flex; justify-content: space-between; align-items: flex-start; }
-.rr-page-title { font-size: 22px; font-weight: 600; color: var(--ink); margin: 0 0 4px 0; }
-.rr-page-sub { color: var(--ink-3); font-size: 13px; margin: 0; }
-.rr-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; margin-bottom: 16px; }
-.rr-search { padding: 16px 20px; }
 .cat-table { background: transparent; }
 </style>

src/modules/other/groupbuy/GroupbuyListView.vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
 /**
- * F006 拼团活动 - W6 P0 完整化
+ * F006 拼团活动 - W10 A3 标准化
+ *
+ * W10 A3: 套 PageHeader/SearchBar 标准化模板
  *
  * 沿用老 vue other/groupbuy.vue 116 行:
  *   - 搜索: 活动名称
@@ -12,6 +14,8 @@
 import { ref, onMounted, reactive } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { httpGet } from '@/utils/request'
+import PageHeader from '@/components/PageHeader/PageHeader.vue'
+import SearchBar from '@/components/SearchBar/SearchBar.vue'
 
 interface Groupbuy {
   id: string
@@ -98,25 +102,18 @@ onMounted(load)
 
 <template>
   <div class="rr-page">
-    <div class="rr-page-header">
+    <PageHeader title="拼团活动" :sub="`拼团/团购活动管理 (共 ${total} 个)`">
-      <div>
-        <h2 class="rr-page-title">拼团活动</h2>
-        <p class="rr-page-sub">拼团/团购活动管理 (共 {{ total }} 个)</p>
-      </div>
-    </div>
-
-    <div class="rr-card rr-search">
-      <el-form :inline="true" @keyup.enter="onSearch">
-        <el-form-item label="活动名称">
-          <el-input v-model="filters.name" placeholder="请输入活动名称" clearable style="width: 280px" />
-        </el-form-item>
-        <el-form-item>
-          <el-button @click="onReset">重置</el-button>
-          <el-button type="primary" @click="onSearch">查询</el-button>
       <el-button type="danger" :disabled="selection.length === 0" @click="onBatchDelete">批量删除 ({{ selection.length }})</el-button>
-        </el-form-item>
+    </PageHeader>
-      </el-form>
+
-    </div>
+    <SearchBar
+      v-model:filters="filters"
+      :fields="[
+        { key: 'name', label: '活动名称', type: 'text', placeholder: '请输入活动名称' }
+      ]"
+      @search="onSearch"
+      @reset="onReset"
+    />
 
     <div class="rr-card">
       <div class="rr-pagination">
@@ -145,10 +142,5 @@ onMounted(load)
 
 <style scoped lang="scss">
 .rr-page { max-width: 1400px; }
-.rr-page-header { margin-bottom: 16px; display: flex; justify-content: space-between; align-items: flex-start; }
-.rr-page-title { font-size: 22px; font-weight: 600; color: var(--ink); margin: 0 0 4px 0; }
-.rr-page-sub { color: var(--ink-3); font-size: 13px; margin: 0; }
-.rr-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; margin-bottom: 16px; }
-.rr-search { padding: 16px 20px; }
 .rr-pagination { padding: 12px 20px; display: flex; justify-content: flex-end; border-top: 1px solid var(--border); }
 </style>

src/modules/other/label/LabelListView.vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
 /**
- * F006 标签管理 - 完整版 (W6 整改)
+ * F006 标签管理 - W10 A1 标准化
+ *
+ * W10 A1: 套 PageHeader/SearchBar 标准化模板
  *
  * 沿用老 vue other/label.vue 173 行:
  *   - 搜索: 标签名
@@ -15,6 +17,8 @@ import { ref, onMounted, reactive } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { httpGet } from '@/utils/request'
 import DataTable from '@/components/DataTable/DataTable.vue'
+import PageHeader from '@/components/PageHeader/PageHeader.vue'
+import SearchBar from '@/components/SearchBar/SearchBar.vue'
 
 interface Label {
   id: string
@@ -103,27 +107,18 @@ onMounted(load)
 
 <template>
   <div class="rr-page">
-    <div class="rr-page-header">
+    <PageHeader title="标签管理" :sub="`商品/活动/服务标签分类管理 (共 ${total} 个)`">
-      <div>
-        <h2 class="rr-page-title">标签管理</h2>
-        <p class="rr-page-sub">商品/活动/服务标签分类管理 (共 {{ total }} 个)</p>
-      </div>
-      <div class="rr-page-actions">
       <el-button type="primary" @click="onAdd">新增标签</el-button>
-      </div>
+    </PageHeader>
-    </div>
 
-    <div class="rr-card rr-search">
+    <SearchBar
-      <el-form :inline="true" @keyup.enter="onSearch">
+      v-model:filters="filters"
-        <el-form-item label="标签名称">
+      :fields="[
-          <el-input v-model="filters.name" placeholder="请输入标签名" clearable style="width: 240px" />
+        { key: 'name', label: '标签名称', type: 'text', placeholder: '请输入标签名' }
-        </el-form-item>
+      ]"
-        <el-form-item>
+      @search="onSearch"
-          <el-button type="primary" @click="onSearch">查询</el-button>
+      @reset="onReset"
-          <el-button @click="onReset">重置</el-button>
+    />
-        </el-form-item>
-      </el-form>
-    </div>
 
     <div class="rr-card">
       <DataTable
@@ -184,9 +179,4 @@ onMounted(load)
 
 <style scoped lang="scss">
 .rr-page { max-width: 1400px; }
-.rr-page-header { margin-bottom: 16px; display: flex; justify-content: space-between; align-items: flex-start; }
-.rr-page-title { font-size: 22px; font-weight: 600; color: var(--ink); margin: 0 0 4px 0; }
-.rr-page-sub { color: var(--ink-3); font-size: 13px; margin: 0; }
-.rr-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; margin-bottom: 16px; }
-.rr-search { padding: 16px 20px; }
 </style>

src/modules/other/seckill/SeckillListView.vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
 /**
- * F006 秒杀活动 - W6 P0 完整化
+ * F006 秒杀活动 - W10 A3 标准化
+ *
+ * W10 A3: 套 PageHeader/SearchBar 标准化模板
  *
  * 沿用老 vue other/seckill.vue 113 行:
  *   - 搜索: 活动名称
@@ -12,6 +14,8 @@
 import { ref, onMounted, reactive } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { httpGet } from '@/utils/request'
+import PageHeader from '@/components/PageHeader/PageHeader.vue'
+import SearchBar from '@/components/SearchBar/SearchBar.vue'
 
 interface Seckill {
   id: string
@@ -99,25 +103,18 @@ onMounted(load)
 
 <template>
   <div class="rr-page">
-    <div class="rr-page-header">
+    <PageHeader title="秒杀活动" :sub="`限时秒杀活动管理 (共 ${total} 个)`">
-      <div>
-        <h2 class="rr-page-title">秒杀活动</h2>
-        <p class="rr-page-sub">限时秒杀活动管理 (共 {{ total }} 个)</p>
-      </div>
-    </div>
-
-    <div class="rr-card rr-search">
-      <el-form :inline="true" @keyup.enter="onSearch">
-        <el-form-item label="活动名称">
-          <el-input v-model="filters.name" placeholder="请输入活动名称" clearable style="width: 280px" />
-        </el-form-item>
-        <el-form-item>
-          <el-button @click="onReset">重置</el-button>
-          <el-button type="primary" @click="onSearch">查询</el-button>
       <el-button type="danger" :disabled="selection.length === 0" @click="onBatchDelete">批量删除 ({{ selection.length }})</el-button>
-        </el-form-item>
+    </PageHeader>
-      </el-form>
+
-    </div>
+    <SearchBar
+      v-model:filters="filters"
+      :fields="[
+        { key: 'name', label: '活动名称', type: 'text', placeholder: '请输入活动名称' }
+      ]"
+      @search="onSearch"
+      @reset="onReset"
+    />
 
     <div class="rr-card">
       <div class="rr-pagination">
@@ -146,10 +143,5 @@ onMounted(load)
 
 <style scoped lang="scss">
 .rr-page { max-width: 1400px; }
-.rr-page-header { margin-bottom: 16px; display: flex; justify-content: space-between; align-items: flex-start; }
-.rr-page-title { font-size: 22px; font-weight: 600; color: var(--ink); margin: 0 0 4px 0; }
-.rr-page-sub { color: var(--ink-3); font-size: 13px; margin: 0; }
-.rr-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; margin-bottom: 16px; }
-.rr-search { padding: 16px 20px; }
 .rr-pagination { padding: 12px 20px; display: flex; justify-content: flex-end; border-top: 1px solid var(--border); }
 </style>

src/modules/other/supplierBrand/SupplierBrandListView.vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
 /**
- * F006 供应商品牌审核 - W6 P0 完整化
+ * F006 供应商品牌审核 - W10 A3 标准化
+ *
+ * W10 A3: 套 PageHeader/SearchBar 标准化模板
  *
  * 沿用老 vue other/supplierBrand.vue 230 行:
  *   - 搜索: 品牌名/企业名/审核状态/申请时间范围
@@ -13,6 +15,8 @@
 import { ref, onMounted, reactive } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { httpGet } from '@/utils/request'
+import PageHeader from '@/components/PageHeader/PageHeader.vue'
+import SearchBar from '@/components/SearchBar/SearchBar.vue'
 
 interface Brand {
   id: string
@@ -108,35 +112,24 @@ onMounted(load)
 
 <template>
   <div class="rr-page">
-    <div class="rr-page-header">
+    <PageHeader title="供应商品牌审核" :sub="`供应商提交的品牌授权审核 (共 ${total} 个)`">
-      <div>
-        <h2 class="rr-page-title">供应商品牌审核</h2>
-        <p class="rr-page-sub">供应商提交的品牌授权审核 (共 {{ total }} 个)</p>
-      </div>
-    </div>
-
-    <div class="rr-card rr-search">
-      <el-form :inline="true" @keyup.enter="onSearch">
-        <el-form-item label="品牌名称">
-          <el-input v-model="filters.brandName" placeholder="请输入品牌名" clearable style="width: 180px" />
-        </el-form-item>
-        <el-form-item label="企业名称">
-          <el-input v-model="filters.enterpriseName" placeholder="请输入企业名" clearable style="width: 180px" />
-        </el-form-item>
-        <el-form-item label="审核状态">
-          <el-select v-model="filters.status" placeholder="全部" clearable style="width: 140px">
-            <el-option label="待审核" :value="1" />
-            <el-option label="审核通过" :value="2" />
-            <el-option label="审核拒绝" :value="3" />
-          </el-select>
-        </el-form-item>
-        <el-form-item>
-          <el-button type="primary" @click="onSearch">查询</el-button>
-          <el-button @click="onReset">重置</el-button>
       <el-button type="danger" :disabled="selection.length === 0" @click="onBatchDelete">批量删除 ({{ selection.length }})</el-button>
-        </el-form-item>
+    </PageHeader>
-      </el-form>
+
-    </div>
+    <SearchBar
+      v-model:filters="filters"
+      :fields="[
+        { key: 'brandName', label: '品牌名称', type: 'text', placeholder: '请输入品牌名' },
+        { key: 'enterpriseName', label: '企业名称', type: 'text', placeholder: '请输入企业名' },
+        { key: 'status', label: '审核状态', type: 'select', options: [
+          { value: 1, label: '待审核' },
+          { value: 2, label: '审核通过' },
+          { value: 3, label: '审核拒绝' }
+        ] }
+      ]"
+      @search="onSearch"
+      @reset="onReset"
+    />
 
     <div class="rr-card">
       <div class="rr-pagination">
@@ -166,11 +159,6 @@ onMounted(load)
 
 <style scoped lang="scss">
 .rr-page { max-width: 1500px; }
-.rr-page-header { margin-bottom: 16px; display: flex; justify-content: space-between; align-items: flex-start; }
-.rr-page-title { font-size: 22px; font-weight: 600; color: var(--ink); margin: 0 0 4px 0; }
-.rr-page-sub { color: var(--ink-3); font-size: 13px; margin: 0; }
-.rr-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; margin-bottom: 16px; }
-.rr-search { padding: 16px 20px; }
 .rr-pagination { padding: 12px 20px; display: flex; justify-content: flex-end; border-top: 1px solid var(--border); }
 .brand-auth { width: 50px; height: 50px; border-radius: 4px; border: 1px solid var(--border); cursor: pointer; }
 </style>

src/modules/other/textconfig/TextconfigListView.vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
 /**
- * F006 常量配置 - 完整版 (W6 整改)
+ * F006 常量配置 - W10 A1 标准化
+ *
+ * W10 A1: 套 PageHeader/SearchBar 标准化模板
  *
  * 沿用老 vue other/textconfig.vue 85 行:
  *   - 搜索: 描述
@@ -14,6 +16,8 @@
 import { ref, onMounted, reactive } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import DataTable from '@/components/DataTable/DataTable.vue'
+import PageHeader from '@/components/PageHeader/PageHeader.vue'
+import SearchBar from '@/components/SearchBar/SearchBar.vue'
 
 interface TextConfig {
   id: string
@@ -97,27 +101,18 @@ onMounted(load)
 
 <template>
   <div class="rr-page">
-    <div class="rr-page-header">
+    <PageHeader title="常量配置" :sub="`系统常量/协议/横幅配置 (共 ${total} 条)`">
-      <div>
-        <h2 class="rr-page-title">常量配置</h2>
-        <p class="rr-page-sub">系统常量/协议/横幅配置 (共 {{ total }} 条)</p>
-      </div>
-      <div class="rr-page-actions">
       <el-button type="primary" @click="onAdd">新增常量</el-button>
-      </div>
+    </PageHeader>
-    </div>
 
-    <div class="rr-card rr-search">
+    <SearchBar
-      <el-form :inline="true" @keyup.enter="onSearch">
+      v-model:filters="filters"
-        <el-form-item label="描述">
+      :fields="[
-          <el-input v-model="filters.descr" placeholder="请输入描述" clearable style="width: 240px" />
+        { key: 'descr', label: '描述', type: 'text', placeholder: '请输入描述' }
-        </el-form-item>
+      ]"
-        <el-form-item>
+      @search="onSearch"
-          <el-button type="primary" @click="onSearch">查询</el-button>
+      @reset="onReset"
-          <el-button @click="onReset">重置</el-button>
+    />
-        </el-form-item>
-      </el-form>
-    </div>
 
     <div class="rr-card">
       <DataTable
@@ -196,11 +191,6 @@ onMounted(load)
 
 <style scoped lang="scss">
 .rr-page { max-width: 1400px; }
-.rr-page-header { margin-bottom: 16px; display: flex; justify-content: space-between; align-items: flex-start; }
-.rr-page-title { font-size: 22px; font-weight: 600; color: var(--ink); margin: 0 0 4px 0; }
-.rr-page-sub { color: var(--ink-3); font-size: 13px; margin: 0; }
-.rr-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; margin-bottom: 16px; }
-.rr-search { padding: 16px 20px; }
 .rr-content-text { color: var(--ink); font-size: 13px; }
 .rr-richtext { line-height: 1.6; color: var(--ink); }
 </style>

src/modules/sys/region/RegionListView.vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
 /**
- * F006 行政区划 - W6 P0 完整化
+ * F006 行政区划 - W10 A2 标准化
+ *
+ * W10 A2: 套 PageHeader (保留 el-table 树形, DataTable 不支持树形)
  *
  * 沿用老 vue sys/region.vue 90 行:
  *   - 树形表格 (3 级省/市/区), lazy load
@@ -11,6 +13,7 @@
 import { ref, onMounted, reactive } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { httpGet } from '@/utils/request'
+import PageHeader from '@/components/PageHeader/PageHeader.vue'
 
 interface Region {
   id: string
@@ -109,15 +112,9 @@ onMounted(load)
 
 <template>
   <div class="rr-page">
-    <div class="rr-page-header">
+    <PageHeader title="行政区划" :sub="`省/市/区/街道 4 级行政区划管理 (含子级: ${tree.length} 个省级)`">
-      <div>
-        <h2 class="rr-page-title">行政区划</h2>
-        <p class="rr-page-sub">省/市/区/街道 4 级行政区划管理 (含子级: {{ tree.length }} 个省级)</p>
-      </div>
-      <div class="rr-page-actions">
       <el-button type="primary" @click="onAdd()">新增省级</el-button>
-      </div>
+    </PageHeader>
-    </div>
 
     <div class="rr-card">
       <el-table
@@ -182,9 +179,6 @@ onMounted(load)
 
 <style scoped lang="scss">
 .rr-page { max-width: 1400px; }
-.rr-page-header { margin-bottom: 16px; display: flex; justify-content: space-between; align-items: flex-start; }
-.rr-page-title { font-size: 22px; font-weight: 600; color: var(--ink); margin: 0 0 4px 0; }
-.rr-page-sub { color: var(--ink-3); font-size: 13px; margin: 0; }
 .rr-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; padding: 8px; }
 .region-table { background: transparent; }
 </style>