From 078e4f07d05bf6efec4d009a35cc2bbec005ee2c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BC=A0=E6=BD=98?= <925116093@qq.com>
Date: Wed, 13 Aug 2025 01:30:44 +0800
Subject: [PATCH] 202507251746

---
 .../system/GoodsOrder/UnifiedRefundDialog.vue | 380 +++++++++---------
 1 file changed, 188 insertions(+), 192 deletions(-)

diff --git a/ruoyi-ui/src/views/system/GoodsOrder/UnifiedRefundDialog.vue b/ruoyi-ui/src/views/system/GoodsOrder/UnifiedRefundDialog.vue
index 3a1643a..19fdda2 100644
--- a/ruoyi-ui/src/views/system/GoodsOrder/UnifiedRefundDialog.vue
+++ b/ruoyi-ui/src/views/system/GoodsOrder/UnifiedRefundDialog.vue
@@ -1,204 +1,200 @@
 <template>
   <el-dialog title="统一退款" :visible.sync="visible" width="900px" @close="handleClose">
-    <div class="refund-container">
-      <!-- 支付信息展示 -->
-      <div class="payment-info" v-if="paymentData">
-        <h4>支付信息</h4>
-        <el-row :gutter="20">
-          <el-col :span="8">
-            <div class="info-item">
-              <label>微信支付：</label>
-              <span class="amount">￥{{ paymentData.wechatAmount || '0.00' }}</span>
-            </div>
-          </el-col>
-          <el-col :span="8">
-            <div class="info-item">
-              <label>余额支付：</label>
-              <span class="amount">￥{{ paymentData.balanceAmount || '0.00' }}</span>
-            </div>
-          </el-col>
-          <el-col :span="8">
-            <div class="info-item">
-              <label>购物金：</label>
-              <span class="amount">￥{{ paymentData.shoppingGoldAmount || '0.00' }}</span>
-            </div>
-          </el-col>
-        </el-row>
-        <el-row :gutter="20">
-          <el-col :span="8">
-            <div class="info-item">
-              <label>服务金：</label>
-              <span class="amount">￥{{ paymentData.serviceGoldAmount || '0.00' }}</span>
-            </div>
-          </el-col>
-          <el-col :span="8">
-            <div class="info-item">
-              <label>会员优惠：</label>
-              <span class="amount">￥{{ paymentData.memberDiscountAmount || '0.00' }}</span>
-            </div>
-          </el-col>
-          <el-col :span="8">
-            <div class="info-item">
-              <label>优惠券抵扣：</label>
-              <span class="amount">￥{{ paymentData.couponAmount || '0.00' }}</span>
-            </div>
-          </el-col>
-        </el-row>
-        <div class="total-amount">
-          <label>总支付金额：</label>
-          <span class="amount total">￥{{ totalPaymentAmount }}</span>
-        </div>
-        
-        <!-- 退款历史信息 -->
-        <div class="refund-history" v-if="refundHistory && refundHistory.length > 0">
-          <h5>退款历史</h5>
-          <div class="history-item" v-for="(item, index) in refundHistory" :key="index">
-            <span class="history-time">{{ formatTime(item.refundTime) }}</span>
-            <span class="history-amount">￥{{ item.totalRefund }}</span>
-            <span class="history-desc">{{ item.name }}</span>
+    <el-form ref="refundForm" :model="refundForm" label-width="100px">
+      <div class="refund-container">
+        <!-- 支付信息展示 -->
+        <div class="payment-info" v-if="paymentData">
+          <h4>支付信息</h4>
+          <el-row :gutter="20">
+            <el-col :span="8">
+              <div class="info-item">
+                <label>微信支付：</label>
+                <span class="amount">￥{{ paymentData.wechatAmount || '0.00' }}</span>
+              </div>
+            </el-col>
+            <el-col :span="8">
+              <div class="info-item">
+                <label>余额支付：</label>
+                <span class="amount">￥{{ paymentData.balanceAmount || '0.00' }}</span>
+              </div>
+            </el-col>
+            <el-col :span="8">
+              <div class="info-item">
+                <label>购物金：</label>
+                <span class="amount">￥{{ paymentData.shoppingGoldAmount || '0.00' }}</span>
+              </div>
+            </el-col>
+          </el-row>
+          <el-row :gutter="20">
+            <el-col :span="8">
+              <div class="info-item">
+                <label>服务金：</label>
+                <span class="amount">￥{{ paymentData.serviceGoldAmount || '0.00' }}</span>
+              </div>
+            </el-col>
+            <el-col :span="8">
+              <div class="info-item">
+                <label>会员优惠：</label>
+                <span class="amount">￥{{ paymentData.memberDiscountAmount || '0.00' }}</span>
+              </div>
+            </el-col>
+            <el-col :span="8">
+              <div class="info-item">
+                <label>优惠券抵扣：</label>
+                <span class="amount">￥{{ paymentData.couponAmount || '0.00' }}</span>
+              </div>
+            </el-col>
+          </el-row>
+          <div class="total-amount">
+            <label>总支付金额：</label>
+            <span class="amount total">￥{{ totalPaymentAmount }}</span>
           </div>
-          <div class="history-summary">
-            <span>累计已退款：￥{{ totalRefundedAmount }}</span>
-            <span class="remaining">剩余可退款：￥{{ remainingRefundableAmount }}</span>
+          
+          <!-- 退款历史信息 -->
+          <div class="refund-history" v-if="refundHistory && refundHistory.length > 0">
+            <h5>退款历史</h5>
+            <div class="history-item" v-for="(item, index) in refundHistory" :key="index">
+              <span class="history-time">{{ formatTime(item.refundTime) }}</span>
+              <span class="history-amount">￥{{ item.totalRefund }}</span>
+              <span class="history-desc">{{ item.name }}</span>
+            </div>
+            <div class="history-summary">
+              <span>累计已退款：￥{{ totalRefundedAmount }}</span>
+              <span class="remaining">剩余可退款：￥{{ remainingRefundableAmount }}</span>
+            </div>
           </div>
         </div>
-      </div>
 
-      <!-- 退款金额输入 -->
-      <div class="refund-input">
-        <h4>本次退款金额</h4>
-        <el-row :gutter="20">
-          <el-col :span="8">
-            <el-form-item label="微信退款：">
-              <el-input 
-                v-model="refundForm.wechatRefund" 
-                type="number" 
-                placeholder="0.00" 
-                min="0" 
-                step="0.01" 
-                @input="calculateTotalRefund"
-                :max="paymentData.wechatAmount || 0"
-              >
-                <template slot="prepend">￥</template>
-              </el-input>
-              <div class="input-tip">最大可退：￥{{ paymentData.wechatAmount || '0.00' }}</div>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="余额退款：">
-              <el-input 
-                v-model="refundForm.balanceRefund" 
-                type="number" 
-                placeholder="0.00" 
-                min="0" 
-                step="0.01" 
-                @input="calculateTotalRefund"
-                :max="paymentData.balanceAmount || 0"
-              >
-                <template slot="prepend">￥</template>
-              </el-input>
-              <div class="input-tip">最大可退：￥{{ paymentData.balanceAmount || '0.00' }}</div>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="购物金退款：">
-              <el-input 
-                v-model="refundForm.shoppingGoldRefund" 
-                type="number" 
-                placeholder="0.00" 
-                min="0" 
-                step="0.01" 
-                @input="calculateTotalRefund"
-                :max="paymentData.shoppingGoldAmount || 0"
-              >
-                <template slot="prepend">￥</template>
-              </el-input>
-              <div class="input-tip">最大可退：￥{{ paymentData.shoppingGoldAmount || '0.00' }}</div>
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row :gutter="20">
-          <el-col :span="8">
-            <el-form-item label="服务金退款：">
-              <el-input 
-                v-model="refundForm.serviceGoldRefund" 
-                type="number" 
-                placeholder="0.00" 
-                min="0" 
-                step="0.01" 
-                @input="calculateTotalRefund"
-                :max="paymentData.serviceGoldAmount || 0"
-              >
-                <template slot="prepend">￥</template>
-              </el-input>
-              <div class="input-tip">最大可退：￥{{ paymentData.serviceGoldAmount || '0.00' }}</div>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="会员优惠退款：">
-              <el-input 
-                v-model="refundForm.memberDiscountRefund" 
-                type="number" 
-                placeholder="0.00" 
-                min="0" 
-                step="0.01" 
-                @input="calculateTotalRefund"
-                :max="paymentData.memberDiscountAmount || 0"
-              >
-                <template slot="prepend">￥</template>
-              </el-input>
-              <div class="input-tip">最大可退：￥{{ paymentData.memberDiscountAmount || '0.00' }}</div>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="优惠券退款：">
-              <el-input 
-                v-model="refundForm.couponRefund" 
-                type="number" 
-                placeholder="0.00" 
-                min="0" 
-                step="0.01" 
-                @input="calculateTotalRefund"
-                :max="paymentData.couponAmount || 0"
-              >
-                <template slot="prepend">￥</template>
-              </el-input>
-              <div class="input-tip">最大可退：￥{{ paymentData.couponAmount || '0.00' }}</div>
-            </el-form-item>
-          </el-col>
-        </el-row>
-        
-        <!-- 总退款金额显示 -->
-        <div class="total-refund">
-          <label>本次退款金额：</label>
-          <span class="amount refund">￥{{ totalRefundAmount }}</span>
+        <!-- 退款金额输入 -->
+        <div class="refund-input">
+          <h4>本次退款金额</h4>
+          <el-row :gutter="20">
+            <el-col :span="8">
+              <el-form-item label="微信退款：">
+                <el-input 
+                  v-model="refundForm.wechatRefund" 
+                  type="number" 
+                  placeholder="0.00" 
+                  min="0" 
+                  step="0.01" 
+                  @input="calculateTotalRefund"
+                >
+                  <template slot="prepend">￥</template>
+                </el-input>
+                <div class="input-tip">最大可退：￥{{ paymentData.wechatAmount || '0.00' }}</div>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="余额退款：">
+                <el-input 
+                  v-model="refundForm.balanceRefund" 
+                  type="number" 
+                  placeholder="0.00" 
+                  min="0" 
+                  step="0.01" 
+                  @input="calculateTotalRefund"
+                >
+                  <template slot="prepend">￥</template>
+                </el-input>
+                <div class="input-tip">最大可退：￥{{ paymentData.balanceAmount || '0.00' }}</div>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="购物金退款：">
+                <el-input 
+                  v-model="refundForm.shoppingGoldRefund" 
+                  type="number" 
+                  placeholder="0.00" 
+                  min="0" 
+                  step="0.01" 
+                  @input="calculateTotalRefund"
+                >
+                  <template slot="prepend">￥</template>
+                </el-input>
+                <div class="input-tip">最大可退：￥{{ paymentData.shoppingGoldAmount || '0.00' }}</div>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row :gutter="20">
+            <el-col :span="8">
+              <el-form-item label="服务金退款：">
+                <el-input 
+                  v-model="refundForm.serviceGoldRefund" 
+                  type="number" 
+                  placeholder="0.00" 
+                  min="0" 
+                  step="0.01" 
+                  @input="calculateTotalRefund"
+                >
+                  <template slot="prepend">￥</template>
+                </el-input>
+                <div class="input-tip">最大可退：￥{{ paymentData.serviceGoldAmount || '0.00' }}</div>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="会员优惠退款：">
+                <el-input 
+                  v-model="refundForm.memberDiscountRefund" 
+                  type="number" 
+                  placeholder="0.00" 
+                  min="0" 
+                  step="0.01" 
+                  @input="calculateTotalRefund"
+                >
+                  <template slot="prepend">￥</template>
+                </el-input>
+                <div class="input-tip">最大可退：￥{{ paymentData.memberDiscountAmount || '0.00' }}</div>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="优惠券退款：">
+                <el-input 
+                  v-model="refundForm.couponRefund" 
+                  type="number" 
+                  placeholder="0.00" 
+                  min="0" 
+                  step="0.01" 
+                  @input="calculateTotalRefund"
+                >
+                  <template slot="prepend">￥</template>
+                </el-input>
+                <div class="input-tip">最大可退：￥{{ paymentData.couponAmount || '0.00' }}</div>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          
+          <!-- 总退款金额显示 -->
+          <div class="total-refund">
+            <label>本次退款金额：</label>
+            <span class="amount refund">￥{{ totalRefundAmount }}</span>
+          </div>
+          
+          <!-- 退款验证提示 -->
+          <div class="refund-validation" v-if="totalRefundAmount > 0">
+            <el-alert
+              :title="validationMessage"
+              :type="validationType"
+              show-icon
+              :closable="false"
+            />
+          </div>
         </div>
-        
-        <!-- 退款验证提示 -->
-        <div class="refund-validation" v-if="totalRefundAmount > 0">
-          <el-alert
-            :title="validationMessage"
-            :type="validationType"
-            show-icon
-            :closable="false"
-          />
+
+        <!-- 退款备注 -->
+        <div class="refund-remark">
+          <el-form-item label="退款备注：">
+            <el-input
+              v-model="refundForm.refundRemark"
+              type="textarea"
+              :rows="3"
+              placeholder="请输入退款备注信息"
+              maxlength="200"
+              show-word-limit
+            />
+          </el-form-item>
         </div>
       </div>
-
-      <!-- 退款备注 -->
-      <div class="refund-remark">
-        <el-form-item label="退款备注：">
-          <el-input
-            v-model="refundForm.refundRemark"
-            type="textarea"
-            :rows="3"
-            placeholder="请输入退款备注信息"
-            maxlength="200"
-            show-word-limit
-          />
-        </el-form-item>
-      </div>
-    </div>
+    </el-form>
 
     <div slot="footer" class="dialog-footer">
       <el-button @click="handleClose">取消</el-button>