src/modules/finance/pages/FinanceCustomerAccountsView.test.ts

@@ -105,12 +105,14 @@ describe('FinanceCustomerAccountsView delivery', () => {
     expect(page).not.toContain('max-width: 520px')
   })
 
-  it('renders every account row operation as a small plain primary button with an icon', () => {
-    expect(page).toContain("{ key: 'actions', label: '操作', width: 390, fixed: 'left', slotName: 'actions' }")
+  it('keeps high-frequency account actions visible and groups the remaining actions', () => {
+    expect(page).toContain("{ key: 'actions', label: '操作', width: 290, fixed: 'left', slotName: 'actions' }")
     expect(page).toContain('<el-button size="small" plain type="primary" @click="openAccount(row, false)"><Eye :size="15" />详情</el-button>')
     expect(page).toContain("openAdjustment(row as FinanceAccountSummary, 'RECHARGE')")
     expect(page).toContain("openAdjustment(row as FinanceAccountSummary, 'DEDUCTION')")
-    expect(page).toContain('<el-button v-if="canUpdateTerms" size="small" plain type="primary" @click="openAccount(row, true)"><Pencil :size="15" />账期</el-button>')
+    expect(page).toContain('aria-label="更多客户账户操作"')
+    expect(page).toContain('<el-dropdown-item v-if="canAdjust" command="credit"><CreditCard :size="15" />授信</el-dropdown-item>')
+    expect(page).toContain('<el-dropdown-item v-if="canUpdateTerms" command="terms" :divided="canAdjust"><Pencil :size="15" />账期</el-dropdown-item>')
     expect(page).not.toContain('<el-button link type="primary" @click="openAccount(row, false)">')
     expect(page).toContain('.row-actions {')
     expect(page).toContain('white-space: nowrap')

src/modules/finance/pages/FinanceCustomerAccountsView.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { computed, onBeforeUnmount, onMounted, reactive, ref } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
-import { ArrowLeft, CreditCard, Download, Eye, MinusCircle, Pencil, PlusCircle, Save } from '@lucide/vue'
+import { ArrowLeft, CreditCard, Download, Eye, MinusCircle, MoreHorizontal, Pencil, PlusCircle, Save } from '@lucide/vue'
 import { ElMessage } from 'element-plus'
 import { useAccessPreviewStore } from '@/core/access/accessPreview'
 import { createPlatformExportTask } from '@/modules/downloads'
@@ -81,7 +81,7 @@ const queryFields = computed<QueryField[]>(() => [
   { key: 'status', type: 'select', label: '状态', width: 150, placeholder: '全部状态', options: [{ label: '正常', value: 'ACTIVE' }, { label: '停用', value: 'DISABLED' }] },
 ])
 const columns: DataTableColumn[] = [
-  { key: 'actions', label: '操作', width: 390, fixed: 'left', slotName: 'actions' },
+  { key: 'actions', label: '操作', width: 290, fixed: 'left', slotName: 'actions' },
   { key: 'customerName', label: '客户', minWidth: 180, slotName: 'customerName' },
   { key: 'customerCode', label: '客户编号', width: 150, slotName: 'customerCode' },
   { key: 'contactName', label: '联系人', width: 130, slotName: 'contactName' },
@@ -250,6 +250,10 @@ function openCreditLimit(account: FinanceAccountSummary) {
   Object.assign(creditLimitForm, { amount: Number(account.creditLimit || 0).toFixed(2), remark: '' })
   creditLimitOpen.value = true
 }
+function handleAccountMore(command: string, account: FinanceAccountSummary) {
+  if (command === 'credit') openCreditLimit(account)
+  if (command === 'terms') void openAccount(account as unknown as Record<string, unknown>, true)
+}
 async function submitCreditLimit() {
   if (!adjustmentAccount.value) return
   const raw = creditLimitForm.amount.trim()
@@ -400,7 +404,7 @@ onBeforeUnmount(clearVoucherPreview)
       <section v-if="!stateError" class="surface-panel table-panel">
         <DataTable v-model:page="page" v-model:page-size="pageSize" :data="rows" :columns="columns" :loading="loading" :total="total" preference-key="finance-customer-accounts-table" aria-label="客户账户列表" row-key="customerId" empty-text="暂无客户账户" @update:page="load()" @update:page-size="page = 1; load()">
           <template #toolbar-actions><el-button v-if="canExport" :loading="accountExportBusy" :disabled="loading || accountExportBusy" @click="exportAccounts"><Download :size="16" />导出Excel</el-button></template>
-          <template #actions="{ row }"><div class="row-actions"><el-button size="small" plain type="primary" @click="openAccount(row, false)"><Eye :size="15" />详情</el-button><el-button v-if="canAdjust" size="small" plain type="primary" @click="openAdjustment(row as FinanceAccountSummary, 'RECHARGE')"><PlusCircle :size="15" />充值</el-button><el-button v-if="canAdjust" size="small" plain type="danger" @click="openAdjustment(row as FinanceAccountSummary, 'DEDUCTION')"><MinusCircle :size="15" />扣款</el-button><el-button v-if="canAdjust" size="small" plain @click="openCreditLimit(row as FinanceAccountSummary)"><CreditCard :size="15" />授信</el-button><el-button v-if="canUpdateTerms" size="small" plain type="primary" @click="openAccount(row, true)"><Pencil :size="15" />账期</el-button></div></template>
+          <template #actions="{ row }"><div class="row-actions"><el-button size="small" plain type="primary" @click="openAccount(row, false)"><Eye :size="15" />详情</el-button><el-button v-if="canAdjust" size="small" plain type="primary" @click="openAdjustment(row as FinanceAccountSummary, 'RECHARGE')"><PlusCircle :size="15" />充值</el-button><el-button v-if="canAdjust" size="small" plain type="danger" @click="openAdjustment(row as FinanceAccountSummary, 'DEDUCTION')"><MinusCircle :size="15" />扣款</el-button><el-dropdown v-if="canAdjust || canUpdateTerms" trigger="click" @command="handleAccountMore(String($event), row as FinanceAccountSummary)"><el-button size="small" plain aria-label="更多客户账户操作" title="更多客户账户操作"><MoreHorizontal :size="15" />更多</el-button><template #dropdown><el-dropdown-menu><el-dropdown-item v-if="canAdjust" command="credit"><CreditCard :size="15" />授信</el-dropdown-item><el-dropdown-item v-if="canUpdateTerms" command="terms" :divided="canAdjust"><Pencil :size="15" />账期</el-dropdown-item></el-dropdown-menu></template></el-dropdown></div></template>
           <template #customerName="{ row }">{{ customerName(row.customerId, row.customerName) }}</template>
           <template #customerCode="{ row }">{{ customerField(row.customerCode) }}</template><template #contactName="{ row }">{{ customerField(row.contactName) }}</template><template #contactPhone="{ row }">{{ customerField(row.contactPhone) }}</template>
           <template #lastChangedAt="{ row }">{{ formatLastChangedAt(row.lastChangedAt) }}</template>