优化

src/modules/overseas-warehouse/pages/LastMileOrdersView.vue

@@ -1,45 +1,65 @@
 <script setup lang="ts">
-import { computed, onMounted, ref } from 'vue'
+import { computed, onMounted, reactive, ref } from 'vue'
 import { Eye } from '@lucide/vue'
+import { ElMessage } from 'element-plus'
 import { useRouter } from 'vue-router'
 import { getApiErrorDetails, type ApiErrorDetails } from '@/shared/api/http'
 import AdminPage from '@/shared/components/AdminPage.vue'
+import AppDialog from '@/shared/components/AppDialog.vue'
 import ApiErrorMeta from '@/shared/components/ApiErrorMeta.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 OperationErrorToast from '@/shared/components/OperationErrorToast.vue'
 import QueryToolbar, { type QueryField, type QueryModel } from '@/shared/components/QueryToolbar.vue'
-import { listLastMileOrders } from '../api/lastMileOrders'
+import { convertLastMileOrderToInboundPlan, listLastMileOrders, transferLastMileOrders } from '../api/lastMileOrders'
+import { useAccessPreviewStore } from '@/core/access/accessPreview'
+import { overseasWarehousePermissions as permission } from '../permissions'
 import { toLastMileOrderListItem } from '../lastMilePresentation'
 import type { LastMileOrderListItem } from '../types'
 
 const rows = ref<LastMileOrderListItem[]>([])
+const access = useAccessPreviewStore()
 const loading = ref(false)
 const loadError = ref<ApiErrorDetails | null>(null)
 const router = useRouter()
 const page = ref(1)
 const pageSize = ref(20)
 const total = ref(0)
+const selectedRows = ref<LastMileOrderListItem[]>([])
+const actionLoading = ref(false)
+const actionError = ref<ApiErrorDetails | null>(null)
+const transferOpen = ref(false)
+const transferForm = reactive({ warehouseId: '', warehouseCode: '', warehouseName: '', remark: '' })
 const statusTab = ref<'全部' | '待分配'>('全部')
-const filters = ref<QueryModel>({ orderNo: '', inboundCode: '', warehouse: '', fbaWarehouse: '', orderType: '', owner: '', containerNo: '', status: '', consolidated: '', portEta: [] })
+const filters = ref<QueryModel>({ orderNo: '', orderType: '', warehouse: '', inboundCode: '', sourceOrderNo: '', containerNo: '', status: '', transferWarehouseCode: '', abnormal: '', detained: '', createdAt: [] })
 const fields = computed<QueryField[]>(() => [
   { key: 'orderNo', type: 'input', label: '尾程单号', placeholder: '请输入尾程单号' },
   { key: 'inboundCode', type: 'input', label: '入仓码', placeholder: '请输入入仓码' },
-  { key: 'warehouse', type: 'select', label: '海外仓', placeholder: '接口暂不支持', options: [], props: { disabled: true } },
-  { key: 'fbaWarehouse', type: 'select', label: 'FBA仓库', placeholder: '接口暂不支持', options: [], props: { disabled: true } },
-  { key: 'orderType', type: 'select', label: '订单类型', placeholder: '接口暂不支持', options: ['一件代发', '头程', '拒收订单', '快递订单'].map((value) => ({ label: value, value, disabled: true })), props: { disabled: true } },
-  { key: 'owner', type: 'input', label: '货主', placeholder: '请通过客户名称选择', props: { disabled: true } },
+  { key: 'orderType', type: 'select', label: '订单类型', placeholder: '全部类型', options: [
+    { label: '头程', value: 'FIRST_LEG' }, { label: '换标申请', value: 'RELABEL_APPLICATION' },
+    { label: '转仓', value: 'WAREHOUSE_TRANSFER' }, { label: '本地拆板', value: 'LOCAL_LOOSEBOARD' },
+    { label: '退货换标', value: 'RETURN_RELABEL' }, { label: '一件代发', value: 'ONE_CLICK_DROPSHIP' },
+  ] },
+  { key: 'warehouse', type: 'input', label: '海外仓', placeholder: '请输入仓库名称或编码' },
+  { key: 'sourceOrderNo', type: 'input', label: '来源订单号', placeholder: '请输入来源订单号' },
   { key: 'containerNo', type: 'input', label: '集装箱号', placeholder: '请输入集装箱号' },
+  { key: 'transferWarehouseCode', type: 'input', label: '转仓代码', placeholder: '请输入转仓代码' },
   { key: 'status', type: 'select', label: '当前状态', placeholder: '全部状态', options: [
     { label: '待分配', value: 'PENDING_ASSIGNMENT' },
-    { label: '已分配目的仓', value: 'DESTINATION_ASSIGNED' },
-    { label: '已生成入库计划', value: 'INBOUND_PLANNED' },
+    { label: '待入库', value: 'PENDING_INBOUND' },
+    { label: '入库完成', value: 'INBOUND_COMPLETED' },
+    { label: '待派送', value: 'PENDING_DELIVERY' },
+    { label: '派送中', value: 'DELIVERING' },
+    { label: '派送完成', value: 'DELIVERED' },
   ] },
-  { key: 'consolidated', type: 'select', label: '是否合托', placeholder: '接口暂不支持', options: [{ label: '是', value: 'yes', disabled: true }, { label: '否', value: 'no', disabled: true }], props: { disabled: true } },
-  { key: 'portEta', type: 'daterange', label: '预计到港时间', props: { disabled: true, startPlaceholder: '接口暂不支持', endPlaceholder: '接口暂不支持' } },
+  { key: 'abnormal', type: 'select', label: '是否异常', placeholder: '全部', options: [{ label: '是', value: 'true' }, { label: '否', value: 'false' }] },
+  { key: 'detained', type: 'select', label: '是否暂扣', placeholder: '全部', options: [{ label: '是', value: 'true' }, { label: '否', value: 'false' }] },
+  { key: 'createdAt', type: 'daterange', label: '创建时间' },
 ])
 const columns: DataTableColumn[] = [
   { key: 'actions', label: '操作', width: 110, fixed: 'left', slotName: 'actions' },
+  { key: 'selection', type: 'selection', width: 48, fixed: 'left' },
   { key: 'orderNo', prop: 'orderNo', label: '尾程单号', minWidth: 170 },
   { key: 'warning', prop: 'warning', label: '预警', width: 90 },
   { key: 'orderType', prop: 'orderType', label: '订单类型', minWidth: 110 },
@@ -77,13 +97,23 @@ async function load(model: QueryModel = filters.value) {
   loading.value = true
   loadError.value = null
   try {
+    const dateRange = Array.isArray(filters.value.createdAt) ? filters.value.createdAt.map(String) : []
+    const booleanValue = (value: unknown) => value === 'true' ? true : value === 'false' ? false : undefined
     const result = await listLastMileOrders({
       page: page.value,
       size: pageSize.value,
       orderNo: String(filters.value.orderNo || '').trim() || undefined,
+      orderType: String(filters.value.orderType || '').trim() || undefined,
+      warehouse: String(filters.value.warehouse || '').trim() || undefined,
       inboundCode: String(filters.value.inboundCode || '').trim() || undefined,
+      sourceOrderNo: String(filters.value.sourceOrderNo || '').trim() || undefined,
       containerNo: String(filters.value.containerNo || '').trim() || undefined,
-      status: statusTab.value === '待分配' ? 'PENDING_ASSIGNMENT' : String(filters.value.status || '').trim() || undefined,
+      currentStatus: statusTab.value === '待分配' ? 'PENDING_ASSIGNMENT' : String(filters.value.status || '').trim() || undefined,
+      transferWarehouseCode: String(filters.value.transferWarehouseCode || '').trim() || undefined,
+      abnormal: booleanValue(filters.value.abnormal),
+      detained: booleanValue(filters.value.detained),
+      createdFrom: dateRange[0] ? `${dateRange[0]}T00:00:00` : undefined,
+      createdTo: dateRange[1] ? `${dateRange[1]}T23:59:59` : undefined,
     })
     rows.value = result.records.map(toLastMileOrderListItem)
     total.value = result.total
@@ -101,6 +131,34 @@ async function load(model: QueryModel = filters.value) {
 function search(model: QueryModel) { page.value = 1; void load(model) }
 function reset(model: QueryModel) { page.value = 1; void load(model) }
 function changeStatusTab() { page.value = 1; void load() }
+function onSelectionChange(selection: object[]) { selectedRows.value = selection as LastMileOrderListItem[] }
+function openTransfer() {
+  if (!selectedRows.value.length) { ElMessage.warning('请至少选择 1 条尾程订单'); return }
+  Object.assign(transferForm, { warehouseId: '', warehouseCode: '', warehouseName: '', remark: '' })
+  actionError.value = null
+  transferOpen.value = true
+}
+async function submitTransfer() {
+  if (!transferForm.warehouseId.trim() || !transferForm.warehouseCode.trim() || !transferForm.warehouseName.trim()) {
+    ElMessage.warning('请填写目的仓 ID、代码和名称')
+    return
+  }
+  actionLoading.value = true; actionError.value = null
+  try {
+    await transferLastMileOrders({ orderIds: selectedRows.value.map((row) => row.id), warehouseId: transferForm.warehouseId.trim(), warehouseCode: transferForm.warehouseCode.trim(), warehouseName: transferForm.warehouseName.trim(), remark: transferForm.remark.trim() || undefined })
+    transferOpen.value = false; selectedRows.value = []; ElMessage.success('转仓成功'); await load()
+  } catch (error) { actionError.value = getApiErrorDetails(error, '转仓失败，请重试') }
+  finally { actionLoading.value = false }
+}
+async function convertInboundPlan() {
+  if (selectedRows.value.length !== 1) { ElMessage.warning('生成入库计划时请选择 1 条尾程订单'); return }
+  actionLoading.value = true; actionError.value = null
+  try {
+    await convertLastMileOrderToInboundPlan({ orderId: selectedRows.value[0].id })
+    selectedRows.value = []; ElMessage.success('入库计划生成成功'); await load()
+  } catch (error) { actionError.value = getApiErrorDetails(error, '生成入库计划失败，请重试') }
+  finally { actionLoading.value = false }
+}
 
 function openDetail(source: object) {
   const row = source as LastMileOrderListItem
@@ -111,7 +169,7 @@ onMounted(() => { void load() })
 </script>
 
 <template>
-  <AdminPage><ListPageLayout aria-label="尾程订单列表">
+  <AdminPage><OperationErrorToast :details="actionError" /><ListPageLayout aria-label="尾程订单列表">
     <template #toolbar>
       <section class="surface-panel last-mile-toolbar" aria-label="尾程订单状态与筛选">
         <el-radio-group v-model="statusTab" aria-label="尾程订单状态" @change="changeStatusTab">
@@ -126,11 +184,20 @@ onMounted(() => { void load() })
         <template #details><ApiErrorMeta :details="loadError" /></template>
       </LoadErrorState>
     </template>
-    <section v-if="!loadError" 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="overseas-last-mile-orders" row-key="id" empty-text="暂无尾程订单" @update:page="load()" @update:page-size="page = 1; load()">
+    <section v-if="!loadError" 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="overseas-last-mile-orders" row-key="id" empty-text="暂无尾程订单" @selection-change="onSelectionChange" @update:page="load()" @update:page-size="page = 1; load()">
+      <template #toolbar-actions><el-button v-if="access.can(permission.lastMileOrderTransfer)" plain :disabled="!selectedRows.length || actionLoading" @click="openTransfer">转仓</el-button><el-button v-if="access.can(permission.inboundOrderCreate)" type="primary" plain :disabled="selectedRows.length !== 1 || actionLoading" @click="convertInboundPlan">生成入库计划</el-button></template>
       <template #actions="{ row }"><el-button size="small" plain type="primary" @click="openDetail(row)"><Eye :size="15" />查看</el-button></template>
-      <template #pagination-left>共 {{ total }} 条尾程订单</template>
+      <template #pagination-left>共 {{ total }} 条尾程订单 · 已选 {{ selectedRows.length }} 条</template>
     </DataTable></section>
   </ListPageLayout></AdminPage>
+  <AppDialog v-model="transferOpen" title="转仓" confirm-text="确认转仓" :confirm-loading="actionLoading" @confirm="submitTransfer">
+    <el-form label-position="top">
+      <el-form-item label="目的仓 ID" required><el-input v-model="transferForm.warehouseId" placeholder="请输入目的仓 ID" /></el-form-item>
+      <el-form-item label="目的仓代码" required><el-input v-model="transferForm.warehouseCode" placeholder="请输入目的仓代码" /></el-form-item>
+      <el-form-item label="目的仓名称" required><el-input v-model="transferForm.warehouseName" placeholder="请输入目的仓名称" /></el-form-item>
+      <el-form-item label="备注"><el-input v-model="transferForm.remark" type="textarea" maxlength="500" /></el-form-item>
+    </el-form>
+  </AppDialog>
 </template>
 
 <style scoped>