优化

2026-08-19 16:45:51 +08:00
parent d1de19dc82
commit 65cd9ecefa
79 changed files with 3397 additions and 38 deletions
@@ -0,0 +1,71 @@
+<script setup lang="ts">
+import { computed, ref } from 'vue'
+import { useRouter } from 'vue-router'
+import { Pencil, Plus } from '@lucide/vue'
+import AdminPage from '@/shared/components/AdminPage.vue'
+import DataTable, { type DataTableColumn } from '@/shared/components/DataTable.vue'
+import ListPageLayout from '@/shared/components/ListPageLayout.vue'
+import QueryToolbar, { type QueryField, type QueryModel } from '@/shared/components/QueryToolbar.vue'
+import { useAccessPreviewStore } from '@/core/access/accessPreview'
+import ContractPendingNotice from '../components/ContractPendingNotice.vue'
+import { overseasBusinessPermissions } from '../permissions'
+import type { LocalLooseboardOrder, LocalTransportOrder, LocalTransportStatus } from '../types'
+
+const props = defineProps<{ domain: 'truck' | 'looseboard' }>()
+const router = useRouter()
+const access = useAccessPreviewStore()
+const isLooseboard = computed(() => props.domain === 'looseboard')
+const domainLabel = computed(() => isLooseboard.value ? '本土散板' : '本土卡车')
+const queryPreferenceKey = computed(() => isLooseboard.value
+  ? 'overseas-business-looseboard-query'
+  : 'overseas-business-truck-query')
+const createPermission = computed(() => isLooseboard.value ? overseasBusinessPermissions.looseboardCreate : overseasBusinessPermissions.truckCreate)
+const rows = ref<Array<LocalTransportOrder | LocalLooseboardOrder>>([])
+const page = ref(1)
+const pageSize = ref(20)
+const filters = ref<QueryModel>({ status: '', routeKeyword: '' })
+const statusOptions: Array<{ value: LocalTransportStatus; label: string }> = [
+  { value: 'PENDING_ACCEPTANCE', label: '待接单' }, { value: 'DISPATCHED', label: '已派车' }, { value: 'IN_TRANSIT', label: '运输中' }, { value: 'COMPLETED', label: '已完成' },
+]
+const fields: QueryField[] = [
+  { key: 'status', type: 'select', label: '状态', placeholder: '全部状态', width: 160, options: statusOptions },
+  { key: 'routeKeyword', type: 'input', label: '运输路线', placeholder: '起运地/目的地', width: 240 },
+]
+const baseColumns: DataTableColumn[] = [
+  { key: 'actions', label: '操作', width: 110, fixed: 'left', slotName: 'actions' },
+  { key: 'orderNo', prop: 'orderNo', label: '订单编号', minWidth: 170 },
+  { key: 'transportType', prop: 'transportType', label: '运输类型', minWidth: 120 },
+  { key: 'origin', prop: 'origin', label: '起运地', minWidth: 145 },
+  { key: 'destination', prop: 'destination', label: '目的地', minWidth: 145 },
+  { key: 'contactName', prop: 'contactName', label: '联系人', minWidth: 110 },
+  { key: 'contactPhone', prop: 'contactPhone', label: '联系方式', minWidth: 145 },
+  { key: 'containerType', prop: 'containerType', label: '柜型', width: 90 },
+  { key: 'grossWeightKg', prop: 'grossWeightKg', label: '总重量(kg)', width: 115, align: 'right' },
+  { key: 'budgetAmount', prop: 'budgetAmount', label: '预算总价', width: 115, align: 'right' },
+  { key: 'requiredDate', prop: 'requiredDate', label: '要求时间', width: 120 },
+  { key: 'status', prop: 'status', label: '状态', width: 105 },
+]
+const columns = computed<DataTableColumn[]>(() => isLooseboard.value ? [
+  baseColumns[0]!, baseColumns[1]!,
+  { key: 'transportMode', prop: 'transportMode', label: '运输方式', minWidth: 120 },
+  { key: 'palletRequired', prop: 'palletRequired', label: '是否打盘', width: 100 },
+  ...baseColumns.slice(2),
+] : baseColumns)
+function openCreate() { void router.push({ name: isLooseboard.value ? 'overseas-business-looseboard-new' : 'overseas-business-truck-new' }) }
+</script>
+
+<template>
+  <AdminPage><ListPageLayout :aria-label="`${domainLabel}订单列表`">
+    <template #toolbar><QueryToolbar v-model="filters" class="surface-panel" :fields="fields" :ariaLabel="`${domainLabel}订单筛选`" :preference-key="queryPreferenceKey" @search="page = 1" /></template>
+    <template #state><ContractPendingNotice :domain="`${domainLabel}订单`" /></template>
+    <section class="surface-panel table-panel"><DataTable v-model:page="page" v-model:page-size="pageSize" :data="rows" :columns="columns" :total="0" :preference-key="`overseas-business-${domain}`" row-key="id" :empty-text="`${domainLabel}订单查询契约待接入`">
+      <template #toolbar-actions><el-tooltip v-if="access.can(createPermission)" content="海外区域创建端点待冻结"><span><el-button type="primary" disabled @click="openCreate"><Plus :size="16" />新增订单</el-button></span></el-tooltip></template>
+      <template #actions><el-button size="small" disabled><Pencil :size="15" />编辑</el-button></template>
+      <template #pagination-left>共 0 条{{ domainLabel }}订单</template>
+    </DataTable></section>
+  </ListPageLayout></AdminPage>
+</template>
+
+<style scoped>
+.table-panel { overflow:hidden; }
+</style>