feat: 手动实名和套餐列表退款

src/views/finance/refund/index.vue

@@ -46,66 +46,7 @@
         </ArtTable>
 
         <!-- 创建退款申请对话框 -->
-        <ElDialog
-          v-model="createDialogVisible"
-          title="创建退款申请"
-          width="30%"
-          @closed="handleCreateDialogClosed"
-        >
-          <ElForm ref="createFormRef" :model="createForm" :rules="createRules" label-width="120px">
-            <ElFormItem label="订单号" prop="order_id">
-              <ElSelect
-                v-model="createForm.order_id"
-                filterable
-                remote
-                clearable
-                :remote-method="searchOrders"
-                :loading="orderSearchLoading"
-                placeholder="请输入订单号搜索"
-                style="width: 100%"
-                @change="handleOrderSelectChange"
-              >
-                <ElOption
-                  v-for="order in orderSearchOptions"
-                  :key="order.id"
-                  :label="order.order_no"
-                  :value="order.id"
-                />
-              </ElSelect>
-            </ElFormItem>
-            <ElFormItem label="申请退款金额" prop="requested_refund_amount">
-              <ElInputNumber
-                v-model="createForm.requested_refund_amount"
-                :min="0"
-                :precision="2"
-                :step="1"
-                style="width: 100%"
-                placeholder="请输入申请退款金额（元）"
-              />
-            </ElFormItem>
-            <ElFormItem label="实收金额">
-              <ElInput :model-value="selectedOrderActualPaid" disabled style="width: 100%" />
-            </ElFormItem>
-            <ElFormItem label="退款原因">
-              <ElInput
-                v-model="createForm.refund_reason"
-                type="textarea"
-                :rows="3"
-                maxlength="1000"
-                show-word-limit
-                placeholder="请输入退款原因"
-              />
-            </ElFormItem>
-          </ElForm>
-          <template #footer>
-            <div class="dialog-footer">
-              <ElButton @click="createDialogVisible = false">取消</ElButton>
-              <ElButton type="primary" @click="handleCreateRefund" :loading="createLoading">
-                确认创建
-              </ElButton>
-            </div>
-          </template>
-        </ElDialog>
+        <CreateRefundDialog v-model="createDialogVisible" @success="handleCreateSuccess" />
 
         <!-- 审批通过对话框 -->
         <ElDialog
@@ -295,7 +236,6 @@
     Refund,
     RefundQueryParams,
     RefundStatus,
-    CreateRefundRequest,
     ApproveRefundRequest,
     RejectRefundRequest,
     ReturnRefundRequest,
@@ -305,20 +245,20 @@
   import { useCheckedColumns } from '@/composables/useCheckedColumns'
   import { formatDateTime } from '@/utils/business/format'
   import { RoutesAlias } from '@/router/routesAlias'
+
   import { useAuth } from '@/composables/useAuth'
 
+  import CreateRefundDialog from '@/components/business/CreateRefundDialog.vue'
   defineOptions({ name: 'RefundList' })
 
   const router = useRouter()
   const { hasAuth } = useAuth()
 
   const loading = ref(false)
-  const createLoading = ref(false)
   const approveLoading = ref(false)
   const rejectLoading = ref(false)
   const returnLoading = ref(false)
   const resubmitLoading = ref(false)
-  const orderSearchLoading = ref(false)
   const tableRef = ref()
   const createDialogVisible = ref(false)
   const approveDialogVisible = ref(false)
@@ -341,9 +281,6 @@
   const shopOptions = ref<any[]>([])
   // 订单选项
   const orderOptions = ref<any[]>([])
-  // 订单搜索选项（用于创建弹窗）
-  const orderSearchOptions = ref<any[]>([])
-
   // 搜索表单配置
   const searchFormItems: SearchFormItem[] = [
     {
@@ -430,11 +367,6 @@
   const returnFormRef = ref<FormInstance>()
   const resubmitFormRef = ref<FormInstance>()
 
-  const createRules = reactive<FormRules>({
-    order_id: [{ required: true, message: '请输入订单ID', trigger: 'blur' }],
-    requested_refund_amount: [{ required: true, message: '请输入申请退款金额', trigger: 'blur' }]
-  })
-
   const approveRules = reactive<FormRules>({})
 
   const rejectRules = reactive<FormRules>({
@@ -445,18 +377,6 @@
 
   const resubmitRules = reactive<FormRules>({})
 
-  const createForm = reactive<{
-    order_id: number | null
-    requested_refund_amount: number
-    actual_received_amount: number
-    refund_reason: string
-  }>({
-    order_id: null,
-    requested_refund_amount: 0,
-    actual_received_amount: 0,
-    refund_reason: ''
-  })
-
   const approveForm = reactive<ApproveRefundRequest>({
     approved_refund_amount: undefined,
     remark: ''
@@ -482,15 +402,6 @@
 
   const refundList = ref<Refund[]>([])
 
-  // 选中的订单实收金额
-  const selectedOrderActualPaid = computed(() => {
-    if (!createForm.order_id) return 0
-    const selectedOrder = orderSearchOptions.value.find((o) => o.id === createForm.order_id)
-    if (!selectedOrder?.actual_paid_amount) return 0
-    const amount = selectedOrder.actual_paid_amount / 100
-    return isNaN(amount) ? 0 : amount
-  })
-
   // 格式化货币 - 将分转换为元
   const formatCurrency = (amount: number): string => {
     return `¥${(amount / 100).toFixed(2)}`
@@ -687,43 +598,6 @@
     }
   }
 
-  // 搜索订单（用于创建弹窗）
-  const searchOrders = async (query: string) => {
-    orderSearchLoading.value = true
-    try {
-      const params: any = {
-        page: 1,
-        page_size: 20
-      }
-
-      // 如果有搜索关键词，则按订单号搜索
-      if (query) {
-        params.order_no = query
-      }
-
-      const res = await OrderService.getOrders(params)
-      if (res.code === 0) {
-        orderSearchOptions.value = res.data.items || []
-      }
-    } catch (error) {
-      console.error('Search orders failed:', error)
-    } finally {
-      orderSearchLoading.value = false
-    }
-  }
-
-  // 订单选择变化 - 自动填充实收金额
-  const handleOrderSelectChange = (orderId: number | null) => {
-    if (!orderId) {
-      createForm.actual_received_amount = 0
-      return
-    }
-    const selectedOrder = orderSearchOptions.value.find((o) => o.id === orderId)
-    if (selectedOrder) {
-      createForm.actual_received_amount = selectedOrder.actual_paid_amount / 100
-    }
-  }
-
   // 获取退款申请列表
   const getTableData = async () => {
     loading.value = true
@@ -782,42 +656,9 @@
     createDialogVisible.value = true
   }
 
-  // 对话框关闭后的清理
-  const handleCreateDialogClosed = () => {
-    createFormRef.value?.resetFields()
-    createForm.order_id = null
-    createForm.requested_refund_amount = 0
-    createForm.actual_received_amount = 0
-    createForm.refund_reason = ''
-    orderSearchOptions.value = []
-  }
-
-  // 创建退款申请
-  const handleCreateRefund = async () => {
-    if (!createFormRef.value) return
-
-    await createFormRef.value.validate(async (valid) => {
-      if (valid) {
-        createLoading.value = true
-        try {
-          const data: CreateRefundRequest = {
-            order_id: createForm.order_id!,
-            requested_refund_amount: createForm.requested_refund_amount * 100, // 元转分
-            actual_received_amount: createForm.actual_received_amount * 100, // 元转分
-            refund_reason: createForm.refund_reason || undefined
-          }
-
-          await RefundService.createRefund(data)
-          ElMessage.success('退款申请创建成功')
-          createDialogVisible.value = false
-          await getTableData()
-        } catch (error) {
-          console.error(error)
-        } finally {
-          createLoading.value = false
-        }
-      }
-    })
+  // 创建退款申请成功
+  const handleCreateSuccess = () => {
+    getTableData()
   }
 
   // 显示审批通过对话框