feat: add admin web MVP

admin-web/src/views/DeliveryDispatchView.vue

@@ -0,0 +1,134 @@
+<script setup lang="ts">
+import { onMounted, reactive, ref } from 'vue'
+import { Plus, Refresh, Van } from '@element-plus/icons-vue'
+import { ElMessage } from 'element-plus'
+import { listGoodsOrders, listExpressOrders } from '../api/orderApi'
+import {
+  assignExpressOrder,
+  assignGoodsOrder,
+  assignGroupBuyOrder,
+  createDeliveryUser,
+  listDeliveryOrders,
+  listDeliveryUsers
+} from '../api/deliveryApi'
+import type { DeliveryOrder, DeliveryUser, ExpressOrder, GoodsOrder } from '../types'
+import { statusText } from '../utils/format'
+
+const loading = ref(false)
+const riders = ref<DeliveryUser[]>([])
+const tasks = ref<DeliveryOrder[]>([])
+const goodsOrders = ref<GoodsOrder[]>([])
+const expressOrders = ref<ExpressOrder[]>([])
+const riderForm = reactive({ userId: 3, name: '', phone: '', enabled: true })
+const dispatchForm = reactive({ goodsOrderId: undefined as number | undefined, expressOrderId: undefined as number | undefined, groupBuyOrderId: undefined as number | undefined, riderId: undefined as number | undefined })
+
+async function load() {
+  loading.value = true
+  try {
+    const [riderRows, taskRows, goodsRows, expressRows] = await Promise.all([
+      listDeliveryUsers(),
+      listDeliveryOrders(),
+      listGoodsOrders({ status: 'PENDING_DELIVERY' }),
+      listExpressOrders('PENDING_PICKUP')
+    ])
+    riders.value = riderRows
+    tasks.value = taskRows
+    goodsOrders.value = goodsRows
+    expressOrders.value = expressRows
+    if (!dispatchForm.riderId && riderRows[0]) dispatchForm.riderId = riderRows[0].id
+  } catch (error) {
+    ElMessage.error(error instanceof Error ? error.message : '加载失败')
+  } finally {
+    loading.value = false
+  }
+}
+
+async function saveRider() {
+  try {
+    await createDeliveryUser(riderForm)
+    riderForm.name = ''
+    riderForm.phone = ''
+    ElMessage.success('已创建配送员')
+    await load()
+  } catch (error) {
+    ElMessage.error(error instanceof Error ? error.message : '保存失败')
+  }
+}
+
+async function dispatch(type: 'goods' | 'express' | 'group') {
+  if (!dispatchForm.riderId) {
+    ElMessage.warning('请选择配送员')
+    return
+  }
+  try {
+    if (type === 'goods' && dispatchForm.goodsOrderId) {
+      await assignGoodsOrder(dispatchForm.goodsOrderId, dispatchForm.riderId)
+    }
+    if (type === 'express' && dispatchForm.expressOrderId) {
+      await assignExpressOrder(dispatchForm.expressOrderId, dispatchForm.riderId)
+    }
+    if (type === 'group' && dispatchForm.groupBuyOrderId) {
+      await assignGroupBuyOrder(dispatchForm.groupBuyOrderId, dispatchForm.riderId)
+    }
+    ElMessage.success('派单成功')
+    await load()
+  } catch (error) {
+    ElMessage.error(error instanceof Error ? error.message : '派单失败')
+  }
+}
+
+onMounted(load)
+</script>
+
+<template>
+  <h1 class="page-title">配送派单</h1>
+  <div class="panel">
+    <div class="toolbar">
+      <strong>配送员</strong>
+      <el-input v-model="riderForm.name" placeholder="姓名" style="width: 140px" />
+      <el-input v-model="riderForm.phone" placeholder="手机号" style="width: 160px" />
+      <el-input-number v-model="riderForm.userId" :min="1" />
+      <el-button type="primary" :icon="Plus" @click="saveRider">新增</el-button>
+      <el-button :icon="Refresh" :loading="loading" @click="load">刷新</el-button>
+    </div>
+    <el-select v-model="dispatchForm.riderId" placeholder="选择配送员" style="width: 220px; margin-bottom: 12px">
+      <el-option v-for="rider in riders" :key="rider.id" :label="`${rider.name} ${rider.phone}`" :value="rider.id" />
+    </el-select>
+    <el-tabs>
+      <el-tab-pane label="商品订单">
+        <div class="toolbar">
+          <el-select v-model="dispatchForm.goodsOrderId" placeholder="待配送商品订单" style="width: 260px">
+            <el-option v-for="item in goodsOrders" :key="item.id" :label="item.orderNo" :value="item.id" />
+          </el-select>
+          <el-button type="primary" :icon="Van" @click="dispatch('goods')">派单</el-button>
+        </div>
+      </el-tab-pane>
+      <el-tab-pane label="快递代取">
+        <div class="toolbar">
+          <el-select v-model="dispatchForm.expressOrderId" placeholder="待取件订单" style="width: 260px">
+            <el-option v-for="item in expressOrders" :key="item.id" :label="`${item.orderNo} ${item.pickupCode}`" :value="item.id" />
+          </el-select>
+          <el-button type="primary" :icon="Van" @click="dispatch('express')">派单</el-button>
+        </div>
+      </el-tab-pane>
+      <el-tab-pane label="团购订单">
+        <div class="toolbar">
+          <el-input-number v-model="dispatchForm.groupBuyOrderId" :min="1" />
+          <el-button type="primary" :icon="Van" @click="dispatch('group')">派单</el-button>
+        </div>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+  <div class="panel">
+    <div class="toolbar"><strong>配送任务</strong></div>
+    <el-table :data="tasks" border>
+      <el-table-column prop="bizOrderNo" label="业务单号" min-width="150" />
+      <el-table-column prop="bizType" label="类型" width="150" />
+      <el-table-column prop="riderName" label="配送员" width="120" />
+      <el-table-column label="状态" width="120">
+        <template #default="{ row }">{{ statusText(row.status) }}</template>
+      </el-table-column>
+      <el-table-column prop="address" label="地址" min-width="180" />
+    </el-table>
+  </div>
+</template>