feat: improve client order and member workflows

src/views/FirstLegOrdersView.vue

@@ -75,6 +75,8 @@ function emptyDraft(): FirstLegOrderDraft {
 }
 
 const form = reactive<FirstLegOrderDraft>(emptyDraft())
+const serializedDraft = computed(() => JSON.stringify(form))
+const editorDirty = computed(() => editorOpen.value && serializedDraft.value !== editorBaseline.value)
 
 const filteredOrders = computed(() => store.orders.filter((order) => {
   const keyword = filters.keyword.trim().toLowerCase()
@@ -90,8 +92,10 @@ const filteredOrders = computed(() => store.orders.filter((order) => {
 const detailOrder = computed(() => detailId.value ? store.getById(detailId.value) : undefined)
 const detailSummary = computed(() => detailOrder.value ? summarizeFirstLegCargo(detailOrder.value.items) : null)
 const selectedWarehouse = computed(() => availableWarehouses.value.find((item) => item.id === form.receivingWarehouseId))
+const hasActiveFilters = computed(() => Boolean(filters.keyword.trim() || filters.status || filters.transportMode || dateRange.value.length))
+const emptyDescription = computed(() => hasActiveFilters.value ? '没有符合筛选条件的头程订单' : '还没有头程订单')
 
-onMounted(async () => {
+async function loadPageData() {
   try {
     await Promise.all([store.load(), firstLegPartySource.load()])
     availableShippers.value = firstLegPartySource.listAvailable('SHIPPER')
@@ -99,10 +103,33 @@ onMounted(async () => {
   } catch (error) {
     ElMessage.error(error instanceof Error ? error.message : '订单与往来单位数据加载失败')
   }
+}
+
+function handleBeforeUnload(event: BeforeUnloadEvent) {
+  if (!editorDirty.value) return
+  event.preventDefault()
+  event.returnValue = ''
+}
+
+onMounted(() => {
+  window.addEventListener('beforeunload', handleBeforeUnload)
+  void loadPageData()
 })
 
+onBeforeUnmount(() => window.removeEventListener('beforeunload', handleBeforeUnload))
+
+onBeforeRouteLeave(async () => {
+  if (!editorDirty.value) return true
+  return confirmDiscardChanges()
+})
+
+function markEditorClean() {
+  editorBaseline.value = serializedDraft.value
+}
+
 function replaceForm(draft: FirstLegOrderDraft) {
   Object.assign(form, structuredClone(draft))
+  markEditorClean()
 }
 
 function draftFromOrder(order: FirstLegOrder): FirstLegOrderDraft {
@@ -180,6 +207,15 @@ function clearConsignee() {
   clearParty('CONSIGNEE')
 }
 
+async function loadSelectedWarehouse(id: string) {
+  if (!id) return
+  try {
+    await store.loadWarehouseDetail(id)
+  } catch (error) {
+    ElMessage.error(error instanceof Error ? error.message : '仓库地址与收货时间加载失败')
+  }
+}
+
 function openCreate() {
   if (availableWarehouses.value.length === 0) {
     ElMessage.warning('当前没有可用的平台收货仓，请联系平台维护仓库后再创建订单')
@@ -202,15 +238,47 @@ async function openDetail(order: FirstLegOrder) {
   detailId.value = order.id
   detailOpen.value = true
   detailLoading.value = true
+  detailError.value = ''
   try {
     await store.loadDetail(order.id)
   } catch (error) {
-    ElMessage.error(error instanceof Error ? error.message : '订单详情加载失败')
+    detailError.value = error instanceof Error ? error.message : '订单详情加载失败'
+    ElMessage.error(detailError.value)
   } finally {
     detailLoading.value = false
   }
 }
 
+async function retryDetail() {
+  const order = detailId.value ? store.getById(detailId.value) : undefined
+  if (order) await openDetail(order)
+}
+
+async function confirmDiscardChanges() {
+  try {
+    await ElMessageBox.confirm('当前订单还有未保存的修改。离开后这些内容将丢失。', '放弃未保存的修改？', {
+      type: 'warning',
+      confirmButtonText: '放弃修改',
+      cancelButtonText: '继续编辑',
+    })
+    return true
+  } catch (error) {
+    if (error === 'cancel' || error === 'close') return false
+    throw error
+  }
+}
+
+async function requestCloseEditor(done: () => void) {
+  if (saving.value) return
+  if (!editorDirty.value || await confirmDiscardChanges()) done()
+}
+
+function closeEditor() {
+  void requestCloseEditor(() => {
+    editorOpen.value = false
+  })
+}
+
 function addCargoItem() {
   form.items.push(createEmptyCargoItem(`new-cargo-${++cargoSequence}`))
 }