Quellcode durchsuchen

线下退款二次确认窗口优化

skyline vor 2 Monaten
Ursprung
Commit
f5ebd03f11
2 geänderte Dateien mit 28 neuen und 11 gelöschten Zeilen
  1. 4 3
      admin-web/src/utils/message.ts
  2. 24 8
      admin-web/src/views/admin/refund/index.vue

+ 4 - 3
admin-web/src/utils/message.ts

@@ -22,10 +22,11 @@ export const Msg = {
             title,
             {
                 distinguishCancelAndClose: true,
-                confirmButtonText: options?.ok || '确认',
-                cancelButtonText: options?.cancel || '取消',
+                confirmButtonText: options?.confirmButtonText || options?.ok || '确认',
+                cancelButtonText: options?.cancelButtonText || options?.cancel || '取消',
                 type: type,
-                buttonSize:'default'
+                buttonSize:'default',
+                dangerouslyUseHTMLString: true
             }
         ).then((v) => {
             console.log(v)

+ 24 - 8
admin-web/src/views/admin/refund/index.vue

@@ -285,7 +285,17 @@ const onRefundClick = ( row: any) => {
   // if(row.status){
   //   return;
   // }
-  Msg.confirm("请确认是否执行退款操作?").then(()=>{
+  Msg.confirm(
+    `<div style="line-height: 2; font-size: 14px;">` +
+    `<div style="font-weight: bold; color: #409EFF; font-size: 15px; margin-bottom: 10px;">【退款确认】</div>` +
+    `<div style="margin: 8px 0;"><span style="color: #606266;">用户手机:</span><span style="font-weight: 500;">${row.mobilePhone}</span></div>` +
+    `<div style="margin: 8px 0;"><span style="color: #606266;">退款金额:</span><span style="font-weight: 500; color: #F56C6C;">${u.fmt.fmtMoney(row.refund)}</span></div>` +
+    `<div style="margin: 8px 0;"><span style="color: #606266;">申请时间:</span><span style="font-weight: 500;">${row.createTime ? row.createTime.replace('T', ' ') : '无'}</span></div>` +
+    `<div style="margin: 15px 0; padding: 10px; background-color: #ECF5FF; border-radius: 4px; border-left: 3px solid #409EFF;">` +
+    `<div style="color: #409EFF;">请确认是否执行微信退款操作?</div>` +
+    `</div>` +
+    `</div>`
+  ).then(()=>{
     $get(`/finance/customWxRefund/${row.refundLogId}`).then((res: any) => {
       Msg.message(`操作已提交`)
       loadData(true)
@@ -298,13 +308,19 @@ const onRefundClick = ( row: any) => {
 // 手动确认退款(线下退款)
 const onManualRefundClick = (row: any) => {
   Msg.confirm(
-    `请确认是否执行线下退款操作?\n` +
-    `用户手机:${row.mobilePhone}\n` +
-    `退款金额:${u.fmt.fmtMoney(row.refund)}\n` +
-    `该订单已超过365天退款时限,请确保已通过线下方式完成实际退款后再确认!`, 
-    '重要提醒',
+    `<div style="line-height: 2; font-size: 14px;">` +
+    `<div style="font-weight: bold; color: #E6A23C; font-size: 15px; margin-bottom: 10px;">【重要提醒】请确认已完成线下退款操作!</div>` +
+    `<div style="margin: 8px 0;"><span style="color: #606266;">用户手机:</span><span style="font-weight: 500;">${row.mobilePhone}</span></div>` +
+    `<div style="margin: 8px 0;"><span style="color: #606266;">退款金额:</span><span style="font-weight: 500; color: #F56C6C;">${u.fmt.fmtMoney(row.refund)}</span></div>` +
+    `<div style="margin: 8px 0;"><span style="color: #606266;">充值时间:</span><span style="font-weight: 500;">${row.rechargeTime ? row.rechargeTime.replace('T', ' ') : '无'}</span></div>` +
+    `<div style="margin: 15px 0; padding: 10px; background-color: #FDF6EC; border-radius: 4px; border-left: 3px solid #E6A23C;">` +
+    `<div style="color: #E6A23C; margin-bottom: 5px;">该订单已超过365天退款时限</div>` +
+    `<div style="color: #909399;">请确认已通过线下方式完成实际退款</div>` +
+    `</div>` +
+    `</div>`, 
+    '线下退款确认',
     {
-      confirmButtonText: '确认线下退款',
+      confirmButtonText: '确认已完成线下退款',
       cancelButtonText: '取消',
       type: 'warning'
     }
@@ -327,7 +343,7 @@ const handleTableSelectionChange = (selection: any) => {
   // emit("on-check-change", selection)
 }
 
-const handleTableSortChange = (column, prop, order) => {
+const handleTableSortChange = (column: any, prop: any, order: any) => {
   console.log("handleTableSortChange>>", column, prop, order)
   // emit("on-sort-change", column)
 }