修复已知问题

src/views/shop/order/components/delivery.vue

@@ -0,0 +1,173 @@
+<!-- 用户编辑弹窗 -->
+<template>
+  <ele-modal
+    :width="600"
+    :visible="visible"
+    :maskClosable="false"
+    :title="isUpdate ? '发货' : '发货'"
+    :body-style="{ paddingBottom: '28px' }"
+    @update:visible="updateVisible"
+    @ok="save"
+  >
+    <a-form
+      ref="formRef"
+      :model="form"
+      :rules="rules"
+      :label-col="styleResponsive ? { md: 4, sm: 5, xs: 24 } : { flex: '90px' }"
+      :wrapper-col="
+        styleResponsive ? { md: 19, sm: 19, xs: 24 } : { flex: '1' }
+      "
+    >
+      <a-form-item label="物流公司" name="expressName">
+        <SelectExpress
+          :placeholder="`选择物流公司`"
+          v-model:value="form.expressName"
+          @done="chooseExpressId"
+        />
+      </a-form-item>
+      <a-form-item label="快递单号" name="expressNo">
+        <a-input
+          allow-clear
+          placeholder="快递单号"
+          v-model:value="form.expressNo"
+        />
+      </a-form-item>
+    </a-form>
+  </ele-modal>
+</template>
+
+<script lang="ts" setup>
+  import { ref, reactive, watch } from 'vue';
+  import { Form, message } from 'ant-design-vue';
+  import { assignObject } from 'ele-admin-pro';
+  import { Order } from '@/api/shop/order/model';
+  import { useThemeStore } from '@/store/modules/theme';
+  import { storeToRefs } from 'pinia';
+  import { OrderDelivery } from '@/api/shop/orderDelivery/model';
+  import { Express } from '@/api/shop/express/model';
+  import {
+    addOrderDelivery,
+    updateOrderDelivery
+  } from '@/api/shop/orderDelivery';
+  import { FormInstance } from 'ant-design-vue/es/form';
+
+  const useForm = Form.useForm;
+
+  const props = defineProps<{
+    // 弹窗是否打开
+    visible: boolean;
+    // 修改回显的数据
+    data?: Order | null;
+  }>();
+
+  export interface step {
+    title?: String | undefined;
+    subTitle?: String | undefined;
+    description?: String | undefined;
+  }
+
+  // 是否是修改
+  const isUpdate = ref(false);
+  // 是否开启响应式布局
+  const themeStore = useThemeStore();
+  const { styleResponsive } = storeToRefs(themeStore);
+
+  // 表单验证规则
+  const rules = reactive({
+    expressName: [
+      {
+        required: true,
+        type: 'string',
+        message: '请选择物流公司',
+        trigger: 'blur'
+      }
+    ],
+    expressNo: [
+      {
+        required: true,
+        type: 'string',
+        message: '请填写快递单号',
+        trigger: 'blur'
+      }
+    ]
+  });
+
+  const emit = defineEmits<{
+    (e: 'done'): void;
+    (e: 'update:visible', visible: boolean): void;
+  }>();
+
+  // 订单信息
+  const form = reactive<OrderDelivery>({
+    deliveryId: undefined,
+    orderId: undefined,
+    deliveryMethod: undefined,
+    packMethod: undefined,
+    expressId: undefined,
+    expressName: undefined,
+    expressNo: undefined,
+    eorderHtml: undefined,
+    sortNumber: undefined,
+    tenantId: undefined
+  });
+
+  // 请求状态
+  const loading = ref(true);
+  // 表格选中数据
+  const formRef = ref<FormInstance | null>(null);
+  const { resetFields } = useForm(form, rules);
+
+  /* 更新visible */
+  const updateVisible = (value: boolean) => {
+    emit('update:visible', value);
+  };
+
+  const chooseExpressId = (data: Express) => {
+    form.expressName = data.expressName;
+    form.expressId = data.expressId;
+  };
+
+  /* 保存编辑 */
+  const save = () => {
+    if (!formRef.value) {
+      return;
+    }
+    formRef.value
+      .validate()
+      .then(() => {
+        loading.value = true;
+        const formData = {
+          ...form
+        };
+        const saveOrUpdate = isUpdate.value
+          ? updateOrderDelivery
+          : addOrderDelivery;
+        saveOrUpdate(formData)
+          .then((msg) => {
+            loading.value = false;
+            message.success(msg);
+            updateVisible(false);
+            emit('done');
+          })
+          .catch((e) => {
+            loading.value = false;
+            message.error(e.message);
+          });
+      })
+      .catch(() => {});
+  };
+
+  watch(
+    () => props.visible,
+    (visible) => {
+      if (visible) {
+        if (props.data) {
+          loading.value = true;
+          assignObject(form, props.data);
+        }
+      } else {
+        resetFields();
+      }
+    }
+  );
+</script>

src/views/shop/order/index.vue

@@ -187,6 +187,30 @@
             <template v-if="column.key === 'action'">
               <a-space>
                 <a @click="openEdit(record)">详情</a>
+                <template v-if="record.deliveryStatus === 10">
+                  <a-divider type="vertical" />
+                  <a @click="openDelivery(record)">发货</a>
+                </template>
+                <a-divider type="vertical" />
+                <a-dropdown>
+                  <a class="ant-dropdown-link" @click.prevent>
+                    更多
+                    <DownOutlined />
+                  </a>
+                  <template #overlay>
+                    <a-menu>
+                      <a-menu-item>
+                        <a href="javascript:;">打印小票</a>
+                      </a-menu-item>
+                      <a-menu-item>
+                        <a href="javascript:;">直接退款</a>
+                      </a-menu-item>
+                      <a-menu-item>
+                        <a href="javascript:;">订单备注</a>
+                      </a-menu-item>
+                    </a-menu>
+                  </template>
+                </a-dropdown>
               </a-space>
             </template>
           </template>
@@ -194,6 +218,8 @@
       </a-card>
       <!-- 编辑弹窗 -->
       <OrderInfo v-model:visible="showEdit" :data="current" @done="reload" />
+      <!-- 发货弹窗 -->
+      <Delivery v-model:visible="showDelivery" :data="current" @done="reload" />
     </div>
   </div>
 </template>
@@ -205,8 +231,11 @@
     ExclamationCircleOutlined,
     CheckOutlined,
     CloseOutlined,
-    AlipayCircleOutlined
+    AlipayCircleOutlined,
+    EllipsisOutlined,
+    DownOutlined
   } from '@ant-design/icons-vue';
+
   import { EleProTable, toDateString } from 'ele-admin-pro';
   import type {
     DatasourceFunction,
@@ -214,10 +243,11 @@
   } from 'ele-admin-pro/es/ele-pro-table/types';
   import Search from './components/search.vue';
   import OrderInfo from './components/orderInfo.vue';
+  import Delivery from './components/delivery.vue';
   import { pageOrder, removeOrder, removeBatchOrder } from '@/api/shop/order';
   import type { Order, OrderParam } from '@/api/shop/order/model';
   import { formatNumber } from 'ele-admin-pro/es';
-  import { getMerchantId } from "@/utils/merchant";
+  import { getMerchantId } from '@/utils/merchant';
 
   // 表格实例
   const tableRef = ref<InstanceType<typeof EleProTable> | null>(null);
@@ -228,6 +258,8 @@
   const current = ref<Order | null>(null);
   // 是否显示编辑弹窗
   const showEdit = ref(false);
+  // 是否显示发货弹窗
+  const showDelivery = ref(false);
   // 是否显示批量移动弹窗
   const showMove = ref(false);
   // 加载状态
@@ -359,7 +391,7 @@
     {
       title: '操作',
       key: 'action',
-      width: 120,
+      width: 180,
       fixed: 'right',
       align: 'center',
       hideInSetting: true
@@ -378,6 +410,11 @@
     showEdit.value = true;
   };
 
+  const openDelivery = (row?: Order) => {
+    current.value = row ?? null;
+    showDelivery.value = true;
+  };
+
   /* 打开批量移动弹窗 */
   const openMove = () => {
     showMove.value = true;