优化

2026-09-18 16:48:40 +08:00
parent e10d0534ae
commit 24fa3d1c9d
19 changed files with 286 additions and 210 deletions
@@ -374,7 +374,7 @@ describe('ContainersView', () => {
    await flushPromises()

    expect(wrapper.find('button[aria-label="查看 CB-1"]').exists()).toBe(true)
-    expect(wrapper.find('.el-table__body button[aria-label="更多货柜操作"]').exists()).toBe(true)
+    expect(wrapper.find('.el-table__body button[aria-label="更多货柜操作"]').exists()).toBe(false)
    expect(wrapper.findAll('button').some((button) => button.text().trim() === '编辑')).toBe(false)
  })

@@ -453,14 +453,16 @@ describe('ContainersView', () => {

  it('renders container business actions as buttons without changing the transport gate', () => {
    const source = readFileSync(resolve(process.cwd(), 'src/modules/container-loading/pages/ContainersView.vue'), 'utf8')
-    expect(source).toContain('size="small" type="primary" plain :aria-label="containerViewLabel')
-    expect(source).toContain("hasAction(row as ContainerWorkbenchRow, 'EDIT_CONTAINER')")
+    expect(source).toContain("import RowActions, { type RowActionItem } from '@/shared/components/RowActions.vue'")
+    expect(source).toContain("{ key: 'view', label: '查看', ariaLabel: containerViewLabel(row), priority: 500")
+    expect(source).toContain("hasAction(row, 'EDIT_CONTAINER')")
+    expect(source).toContain('<RowActions :actions="containerRowActions(row as ContainerWorkbenchRow)"')
    expect(source).not.toContain("row.containerNo ? '修改集装箱号' : '录入集装箱号'")
    expect(source).toContain('货柜基础资料不提供柜号写入')
    expect(source).toContain('containerNo: optional(detail.value?.containerNo || null)')
    expect(source).not.toContain('containerNo: optional(form.containerNo)')
    expect(source).not.toContain('updateContainerTransport')
-    expect(source).toContain("row.planStatus === 'EDITING' && canSmartLoading")
+    expect(source).toContain("row.planStatus === 'EDITING' ? canSmartLoading.value")
    expect(source).not.toContain('canSmartLoading && row.containerNo')
    expect(source).not.toContain('link type="primary" :aria-label="containerViewLabel')
    expect(source).toContain(':loading="loading" stripe preference-key="container-loading-table"')
@@ -3,7 +3,6 @@ import '@/styles/adminDensity.css'
 import { computed, onMounted, reactive, ref, watch } from 'vue'
 import ContainerSimulationCreate from '../components/ContainerSimulationCreate.vue'
 import { useRouter } from 'vue-router'
-import { MoreHorizontal } from '@lucide/vue'
 import { ElMessage, ElMessageBox, type FormInstance, type FormRules } from 'element-plus'
 import { useAccessPreviewStore } from '@/core/access/accessPreview'
 import { listPlatformTenants, type PlatformTenantResource } from '@/modules/iam'
@@ -17,6 +16,7 @@ import AppDialog from '@/shared/components/AppDialog.vue'
 import DataTable, { type DataTableColumn } from '@/shared/components/DataTable.vue'
 import ListPageLayout from '@/shared/components/ListPageLayout.vue'
 import LoadErrorState from '@/shared/components/LoadErrorState.vue'
+import RowActions, { type RowActionItem } from '@/shared/components/RowActions.vue'
 import QueryToolbar, { type QueryField, type QueryModel } from '@/shared/components/QueryToolbar.vue'
 import { CONTAINER_SPECIFICATIONS, DEFAULT_CONTAINER_TYPE, applyContainerSpecification, containerSpecification } from '@/shared/domain/containerSpecifications'
 import { getApiErrorDetails, type ApiErrorDetails } from '@/shared/api/http'
@@ -638,6 +638,30 @@ function handleMoreAction(command: string, source: object) {
  if (command.startsWith('drayage:')) { openDrayageAction(row, command.slice('drayage:'.length) as Exclude<TerminalDrayageAction, 'SELECT_FLEET' | 'SEND_PICKUP_EMAIL'>); return }
  if (command === 'documents' && isOverseas.value && hasAction(row as ContainerWorkbenchRow, 'MANAGE_DESTINATION_DOCUMENTS')) void router.push({ name: 'overseas-container-detail', params: { containerId: row.id }, query: { action: command } })
 }
+function containerRowActions(row: ContainerWorkbenchRow): RowActionItem[] {
+  const processLabel = row.planStatus === 'EDITING' ? '装柜' : row.planStatus === 'LOADING' ? '预装清单' : row.planStatus === 'COMPLETED' ? '装柜清单' : ''
+  const canOpenProcess = row.planStatus === 'EDITING' ? canSmartLoading.value : row.planStatus === 'LOADING' ? canViewPreload.value : row.planStatus === 'COMPLETED' ? canViewLoadingList.value : false
+  return [
+    { key: 'view', label: '查看', ariaLabel: containerViewLabel(row), priority: 500, visible: canView.value },
+    { key: 'edit', label: '编辑', priority: 450, visible: isDomestic.value && canEdit.value && hasAction(row, 'EDIT_CONTAINER') },
+    { key: 'process', label: processLabel, priority: 400, tone: 'primary', visible: isDomestic.value && Boolean(processLabel) && canOpenProcess },
+    { key: 'empty-return', label: '确认还柜', priority: 350, tone: 'primary', visible: canDrayage(row, 'RECORD_EMPTY_RETURN') },
+    { key: 'send-email', label: '发送邮件', priority: 300, tone: 'primary', visible: canDrayage(row, 'SEND_PICKUP_EMAIL'), loading: drayageSavingIds.value.includes(row.id) },
+    { key: 'overview', label: '轨迹与日志', priority: 200, visible: canView.value },
+    { key: 'email-history', label: '邮件记录', priority: 150, visible: canView.value && isOverseas.value },
+    { key: 'drayage-history', label: '码头拖车记录', priority: 140, visible: canView.value && isOverseas.value },
+    { key: 'documents', label: '清关 / DO / PU', priority: 130, visible: canView.value && isOverseas.value && canOverseasDocumentEdit.value && hasAction(row, 'MANAGE_DESTINATION_DOCUMENTS') },
+    { key: 'link', label: '关联已放舱订舱', priority: 120, visible: canView.value && isDomestic.value && canEdit.value && hasAction(row, 'EDIT_CONTAINER') && row.sourceType === 'SIMULATION' && !row.oceanBookingId },
+  ]
+}
+function handleContainerRowAction(command: string, row: ContainerWorkbenchRow) {
+  if (command === 'view') openDetail(row)
+  else if (command === 'edit') void openEdit(row)
+  else if (command === 'process') goContainerProcess(row)
+  else if (command === 'empty-return') openDrayageAction(row, 'RECORD_EMPTY_RETURN')
+  else if (command === 'send-email') void sendPickupEmail(row)
+  else handleMoreAction(command, row)
+}
 async function openEdit(source: object) {
  const row = source as ContainerBookingResource
  editorError.value = null
@@ -721,7 +745,7 @@ onMounted(async () => { await Promise.all([loadCustomers(), loadRows()]) })
        <section v-if="!loadError" id="container-workbench-results" class="surface-panel table-panel">
          <DataTable v-model:page="page" v-model:page-size="pageSize" :data="rows" :columns="columns" :total="total" :loading="loading" stripe preference-key="container-loading-table" empty-text="暂无货柜">
            <template #toolbar-actions><ContainerSimulationCreate dense v-if="isDomestic && canCreate" :load-warehouse-options="loadSimulationWarehouses" @created="loadRows" /></template>
-            <template #actions="{ row }"><div class="row-actions density-actions"><el-button class="density-action" v-if="canView" size="small" type="primary" plain :aria-label="containerViewLabel(row as ContainerBookingResource)" @click="openDetail(row)">查看</el-button><template v-if="isDomestic"><el-button class="density-action" v-if="canEdit && hasAction(row as ContainerWorkbenchRow, 'EDIT_CONTAINER')" size="small" @click="openEdit(row)">编辑</el-button><el-button data-tone="primary" class="density-action" v-if="row.planStatus === 'EDITING' && canSmartLoading" size="small" type="primary" @click="goContainerProcess(row)">装柜</el-button><el-button class="density-action" v-else-if="row.planStatus === 'LOADING' && canViewPreload" size="small" type="primary" plain @click="goContainerProcess(row)">预装清单</el-button><el-button class="density-action" v-else-if="row.planStatus === 'COMPLETED' && canViewLoadingList" size="small" type="primary" plain @click="goContainerProcess(row)">装柜清单</el-button></template><el-button data-tone="primary" class="density-action" v-if="canDrayage(row as ContainerWorkbenchRow, 'RECORD_EMPTY_RETURN')" size="small" type="primary" @click="openDrayageAction(row as ContainerBookingResource, 'RECORD_EMPTY_RETURN')">确认还柜</el-button><el-button data-tone="primary" class="density-action" v-if="canDrayage(row as ContainerWorkbenchRow, 'SEND_PICKUP_EMAIL')" size="small" type="primary" :loading="drayageSavingIds.includes(row.id)" @click="sendPickupEmail(row as ContainerWorkbenchRow)">发送邮件</el-button><el-dropdown v-if="canView" trigger="click" @command="handleMoreAction($event, row)"><el-button class="density-action" size="small" plain aria-label="更多货柜操作" title="更多货柜操作"><MoreHorizontal :size="16" /></el-button><template #dropdown><el-dropdown-menu><el-dropdown-item command="overview">轨迹与日志</el-dropdown-item><template v-if="isOverseas"><el-dropdown-item command="email-history">邮件记录</el-dropdown-item><el-dropdown-item command="drayage-history">码头拖车记录</el-dropdown-item><el-dropdown-item v-if="canOverseasDocumentEdit && hasAction(row as ContainerWorkbenchRow, 'MANAGE_DESTINATION_DOCUMENTS')" command="documents">清关 / DO / PU</el-dropdown-item></template><el-dropdown-item v-if="isDomestic && canEdit && hasAction(row as ContainerWorkbenchRow, 'EDIT_CONTAINER') && row.sourceType === 'SIMULATION' && !row.oceanBookingId" command="link">关联已放舱订舱</el-dropdown-item></el-dropdown-menu></template></el-dropdown></div></template>
+            <template #actions="{ row }"><RowActions :actions="containerRowActions(row as ContainerWorkbenchRow)" more-label="更多货柜操作" @action="handleContainerRowAction($event, row as ContainerWorkbenchRow)" /></template>
            <template #emptyReturnWarning="{ row }"><el-tag :type="drayageWarningType(row as ContainerBookingResource)" effect="light" :title="drayageWarningTitle(row as ContainerBookingResource)">{{ drayageWarningText(row as ContainerBookingResource) }}</el-tag></template>
            <template #cabinet="{ row }"><strong>{{ row.cabinetNo }}</strong><small>系统生成</small></template>
            <template #oceanBooking="{ row }"><span v-if="row.oceanBookingId"><strong>{{ row.billOfLadingNo || '已关联订舱' }}</strong><small>{{ row.containerNo ? `集装箱号：${row.containerNo}` : '集装箱号：待补录' }}</small></span><span v-else>未关联</span></template>