优化

2026-09-30 14:01:58 +08:00
parent f14e1a2ea3
commit 8c51e9c1cf
109 changed files with 1525 additions and 651 deletions
@@ -69,7 +69,7 @@ describe('FeeItemsView public master data and access', () => {
    expect(wrapper.find('.data-table').exists()).toBe(true)
    expect(wrapper.find('.query-toolbar__actions').text()).not.toContain('新增费用项目')
    expect(wrapper.find('.data-table__business-actions').text()).toContain('新增费用项目')
-    expect(wrapper.find('.data-table__toolbar-start').exists()).toBe(false)
+    expect(wrapper.get('.data-table__toolbar-start h1').text()).toBe('费用项目')
    expect(wrapper.find('.data-table__pagination-left').text()).toContain('平台公共主数据 · 共 0 项')
    expect(wrapper.find('.list-page-layout__state').exists()).toBe(false)
    expect(wrapper.text()).toContain('平台公共主数据')
@@ -86,8 +86,8 @@ describe('FeeItemsView public master data and access', () => {
    vi.mocked(listPlatformFeeItems).mockRejectedValueOnce(new Error('Gateway unavailable'))
    const wrapper = await mountView(['firstleg:fee-item:view'])

-    expect(wrapper.find('.list-page-layout__state').exists()).toBe(true)
-    expect(wrapper.find('.table-panel').exists()).toBe(false)
+    expect(wrapper.find('.data-table__notices').exists()).toBe(true)
+    expect(wrapper.find('.el-table').exists()).toBe(false)
    expect(wrapper.text()).toContain('费用项目加载失败')
    expect(wrapper.text()).not.toContain('Gateway unavailable')
  })
@@ -109,7 +109,8 @@ describe('FeeItemsView public master data and access', () => {
    expect(actions).not.toMatch(/<(?:el-dropdown|Pencil|Power|Eye|Trash2|Download|CircleX)\b/)
  })
  it('keeps the prototype table treatment and mobile form fallback without inventing a pricing mode', () => {
-    expect(source).toContain(':page-sizes="[20, 50, 100]"\n          border\n          stripe')
+    expect(source).toContain('appearance="integrated" :stripe="false"')
+    expect(source).toContain(':page-sizes="[20, 50, 100]"')
    expect(source).toContain('@media (max-width: 720px)')
    expect(source).toContain('.direction-grid, .form-grid.two-cols { grid-template-columns: 1fr; }')
    expect(source).not.toContain('pricingMode')
@@ -340,31 +340,11 @@ onMounted(() => {
    <el-result v-if="!canView" icon="warning" title="无权查看费用项目" sub-title="请联系管理员开通费用项目查看权限" />

    <ListPageLayout v-else aria-label="费用项目管理">
-      <template #toolbar>
-        <QueryToolbar
-          v-model="filters"
-          class="surface-panel"
-          ariaLabel="费用项目筛选"
-          :fields="queryFields"
-          :loading="loading"
-          preference-key="fee-items-query"
-          @search="applyFilters"
-        />
-      </template>

-      <template v-if="loadError" #state>
-        <LoadErrorState
-          title="费用项目加载失败"
-          :message="loadError.message"
-          :loading="loading"
-          @retry="loadFeeItems"
-        >
-          <template #details><ApiErrorMeta :details="loadError" /></template>
-        </LoadErrorState>
-      </template>

-      <section v-if="!loadError" class="surface-panel table-panel">
-        <DataTable
+
+
+      <section><DataTable appearance="integrated" :stripe="false" column-settings-mode="show" :results-visible="!loadError"
          v-model:page="page"
          v-model:page-size="pageSize"
          :data="rows"
@@ -373,12 +353,34 @@ onMounted(() => {
          :total="total"
          :page-sizes="[20, 50, 100]"
          border
-          stripe
          preference-key="fee-items-table"
          aria-label="费用项目列表"
          row-key="id"
          empty-text="暂无符合条件的费用项目"
        >
+        <template #toolbar-start><h1>费用项目</h1></template>
+        <template #filters>
+        <QueryToolbar
+          v-model="filters"
+          ariaLabel="费用项目筛选"
+          :fields="queryFields"
+          :loading="loading"
+          preference-key="fee-items-query"
+          @search="applyFilters"
+        />
+      </template>
+        <template #notices><template v-if="loadError">
+        <LoadErrorState
+          title="费用项目加载失败"
+          :message="loadError.message"
+          :loading="loading"
+          @retry="loadFeeItems"
+        >
+          <template #details><ApiErrorMeta :details="loadError" /></template>
+        </LoadErrorState>
+      </template></template>
+
+
          <template #toolbar-actions>
            <el-button
              v-if="access.can('firstleg:fee-item:create')"
@@ -387,7 +389,7 @@ onMounted(() => {
              @click="openCreate"
            ><Plus :size="16" />新增费用项目</el-button>
          </template>
-          <template #actions="{ row }">
+          <template #actions="{ row }"><div class="row-actions density-actions admin-text-actions">
            <div v-if="access.can('firstleg:fee-item:edit') || access.can('firstleg:fee-item:delete')" class="table-actions density-actions">
              <el-button data-tone="neutral" class="density-action" v-if="access.can('firstleg:fee-item:edit')" size="small" :disabled="loading || editorLoading" @click="openEdit(row as PlatformFeeItemResource)">编辑</el-button>
              <el-button class="density-action"
@@ -402,7 +404,7 @@ onMounted(() => {
              <el-button data-tone="danger" class="density-action" v-if="access.can('firstleg:fee-item:delete')" size="small" :disabled="loading" @click="requestDelete(row as PlatformFeeItemResource)">删除</el-button>
            </div>
            <span v-else class="muted-value">仅查看</span>
-          </template>
+          </div></template>
          <template #feeItem="{ row }"><div class="fee-item-name"><strong>{{ (row as PlatformFeeItemResource).feeTypeName }}</strong>
            <!-- <small>{{ (row as PlatformFeeItemResource).feeCode || '未分配编码' }}</small> -->
          </div></template>
@@ -419,8 +421,7 @@ onMounted(() => {
            </el-empty>
          </template>
          <template #pagination-left>平台公共主数据 · 共 {{ total }} 项</template>
-        </DataTable>
-      </section>
+        </DataTable></section>
    </ListPageLayout>

    <AppDrawer class="admin-density admin-density-drawer"
@@ -5,7 +5,7 @@ export const feeItemRoutes = [
    path: 'master-data/fee-items',
    name: 'fee-items',
    component: () => import('@/modules/fee-items/pages/FeeItemsView.vue'),
-    meta: {
+    meta: { showPageHeading: false,
      title: '费用项目',
      description: '统一维护平台公共费用项目及其适用范围',
      permission: 'firstleg:fee-item:view',