内容更改

src/views/Orders.vue

@@ -78,7 +78,7 @@
           {{ formatDate(row.created_at) }}
         </template>
       </el-table-column>
-      <el-table-column label="商品信息" min-width="200">
+      <el-table-column label="商品信息">
         <template #default="{ row }">
           <div class="order-items">
             <div v-for="item in row.items" :key="item.id" class="order-item">
@@ -97,6 +97,18 @@
           </div>
         </template>
       </el-table-column>
+      <el-table-column prop="producer" label="供应商">
+        <template #default="{ row }">
+          {{ row.producer }}
+        </template>
+      </el-table-column>
+      <el-table-column prop="logistics_info" label="物流信息">
+        <template #default="{ row }">
+          快递单号：{{ row.delivery_code || '暂无' }}
+          <br>
+          物流公司：{{ row.logistics_company || '暂无' }}
+        </template>
+      </el-table-column>
       <el-table-column label="操作" width="200" fixed="right">
         <template #default="{ row }">
           <el-button type="primary" size="small" @click="viewOrder(row)">
@@ -206,7 +218,34 @@
             </template>
           </el-table-column>
         </el-table>
+        <el-button type="primary" size="small" @click="deliveryDialogVisible = true; deliveryForm.id = selectedOrder.id;" class="delivery-btn">
+          发货
+        </el-button>
       </div>
+
+      <!-- 发货对话框 -->
+      <el-dialog
+        v-model="deliveryDialogVisible"
+        title="发货"
+        width="400px"
+        :before-close="closeDialog"
+      >
+        <el-form :model="deliveryForm" :rules="deliveryRules" ref="deliveryFormRef">
+          <el-form-item label="物流公司" prop="logistics_company">
+            <el-input v-model="deliveryForm.logistics_company" placeholder="请输入物流公司名称" />
+          </el-form-item>
+          <el-form-item label="物流单号" prop="logistics_no">
+            <el-input v-model="deliveryForm.logistics_no" placeholder="请输入物流单号" />
+          </el-form-item>
+        </el-form>
+        <template #footer>
+          <el-button type="primary" @click="submitDelivery">
+            提交发货
+          </el-button>
+        </template>
+      </el-dialog>
+
+
     </el-dialog>
   </div>
 </template>
@@ -222,6 +261,7 @@ import dayjs from 'dayjs';
 const loading = ref(false);
 const orders = ref([]);
 const dialogVisible = ref(false);
+const deliveryDialogVisible = ref(false);
 const selectedOrder = ref(null);
 
 const filters = reactive({
@@ -237,6 +277,12 @@ const pagination = reactive({
   total: 0,
 });
 
+const deliveryForm = reactive({
+  logistics_company: '',
+  logistics_no: '',
+  id: '',
+});
+
 // 加载订单列表
 const loadOrders = async () => {
   loading.value = true;
@@ -259,6 +305,7 @@ const loadOrders = async () => {
     pagination.total = data.data.total;
   } catch (error) {
     ElMessage.error('加载订单列表失败');
+    console.error('加载订单列表失败:', error);
   } finally {
     loading.value = false;
   }
@@ -314,6 +361,12 @@ const updateOrderStatus = async (order, newStatus) => {
 // 关闭对话框
 const closeDialog = () => {
   dialogVisible.value = false;
+  deliveryDialogVisible.value = false;
+  deliveryForm.value = {
+    logistics_company: '',
+    logistics_no: '',
+    id: '',
+  };
   selectedOrder.value = null;
 };
 
@@ -340,6 +393,23 @@ const getStatusText = (status) => {
   return texts[status] || status;
 };
 
+const deliveryRules = reactive({
+  logistics_company: [{ required: true, message: '请输入物流公司名称', trigger: 'blur' }],
+  logistics_no: [{ required: true, message: '请输入物流单号', trigger: 'blur' }],
+});
+
+const submitDelivery = async () => {
+  try {
+    await api.products.delivery(deliveryForm);
+    ElMessage.success('发货成功');
+    closeDialog();
+    loadOrders();
+  } catch (error) {
+    ElMessage.error('发货失败');
+    console.error('发货失败:', error);
+  }
+};
+
 // 格式化日期
 const formatDate = (dateString) => {
   return dayjs(dateString).format('YYYY-MM-DD HH:mm:ss');
@@ -419,4 +489,11 @@ onMounted(() => {
   display: flex;
   justify-content: center;
 }
+
+.delivery-btn {
+  display: flex;
+  justify-content: center;
+  margin: 0 auto;
+  margin-top: 10px;
+}
 </style>