对接线上退款

src/views/moneyManage/financialAccount/cashFlow.vue

@@ -5,6 +5,12 @@ import request from '@/util/http.js'
 import dayjs from 'dayjs'
 import { useI18n } from 'vue-i18n'
 import { Moneyfunds, refundOnline } from '@/api/cash/financialAccount.js'
+import { useAdminStore } from '@/store/index.js'
+import { storeToRefs } from 'pinia'
+import _ from 'lodash';
+
+const adminStore = useAdminStore()
+const { adminData } = storeToRefs(adminStore)
 
 const { t } = useI18n()
 
@@ -137,18 +143,67 @@ const handleCurrentChange = (val) => {
 }
 
 // 退款操作
-const handleRefund = (row) => {
-  ElMessageBox.confirm(`确定要对订单 ${row.systemTradeNo} 进行退款吗？`, '退款确认', {
-    confirmButtonText: '确定',
-    cancelButtonText: '取消',
-    type: 'warning'
-  }).then(() => {
+const openRefundConfirm = (row) => {
+  textContent.value = t('common.willRefundOrder') + '?'
+  refundConfirmDialog.value = true
+  refundFormData.value = {
+    ...row,
+    oldpermanentGold: row.permanentGold,//退款永久金币
+    oldfreeGold: row.freeGold,//退款免费金币
+    permanentGold: null,
+    freeGold: null,
+  }
+  console.log(row);
+}
+const openRefundDialog = () => {
+  refundDialog.value = true
+  closeConfirmRefund()
 
+}
+
+const closeConfirmRefund = () => {
+  refundConfirmDialog.value = false
+  textContent.value = ''
+}
+const refundConfirmDialog = ref(false)
+const textContent = ref('')
+const refundDialog = ref(false)
+const refundFormData = ref({})
 
-    ElMessage.success('退款申请已提交')
-    // 刷新列表
+const handleRefund = async () => {
+  try {
+    if (refundFormData.value.refundModel == 1) {
+      refundFormData.value.permanentGold = refundFormData.value.oldpermanentGold
+      refundFormData.value.freeGold = refundFormData.value.oldfreeGold
+    }
+    let params = {
+      jwcode: refundFormData.value.jwcode,
+      name: refundFormData.value.name,
+      market: refundFormData.value.marketName,
+      submitterMarket: adminData.value.markets,
+      remark: refundFormData.value.remark,
+      originalOrderId: refundFormData.value.id,
+      refundReason: refundFormData.value.refundReason,
+      refundModel: refundFormData.value.refundModel,
+      orderCode: refundFormData.value.orderCode,
+      submitterId: adminData.value.id,
+      submitterMarket: adminData.value.markets,
+      permanentGold: (refundFormData.value.permanentGold) * 100 || 0,
+      handlingCharge: refundFormData.value.handlingCharge == null ? null : refundFormData.value.handlingCharge * 100,
+      freeGold: (refundFormData.value.freeGold) * 100 || 0,
+    }
+    console.log('这是退款参数：', params);
+
+    const res = await refundOnline(params)
+    if (res.code == 200) {
+      refundDialog.value = false
       fetchData()
-  }).catch(() => {})
+    } else {
+      ElMessage.error(res.msg || '退款失败')
+    }
+  } catch (error) {
+    console.error(error)
+  }
 }
 
 // ==================== 导出相关逻辑 ====================
@@ -246,7 +301,9 @@ const getTagText = (state) => {
     default: return t('elmessage.unknownStatus');
   }
 }
-
+const throttledsubmitRefund = _.throttle(handleRefund, 5000, {
+  trailing: false
+})
 onMounted(() => {
   getMarket()
   fetchData()
@@ -267,16 +324,9 @@ onMounted(() => {
           <div class="search-item">
             <span class="label">所属地区：</span>
             <!-- 下拉多选，使用 el-cascader 匹配地区树结构 -->
-            <el-cascader
-              v-model="queryParams.markets"
-              :options="marketOptions"
-              :props="{ multiple: true, emitPath: false }"
-              collapse-tags
-              collapse-tags-tooltip
-              placeholder="请选择地区"
-              clearable
-              style="width: 220px;"
-            />
+            <el-cascader v-model="queryParams.markets" :options="marketOptions"
+              :props="{ multiple: true, emitPath: false }" collapse-tags collapse-tags-tooltip placeholder="请选择地区"
+              clearable style="width: 220px;" />
           </div>
           <div class="search-item">
             <span class="label">支付平台：</span>
@@ -297,15 +347,9 @@ onMounted(() => {
 
           <div class="search-item" style="width: auto;">
             <span class="label">付款时间：</span>
-            <el-date-picker
-              v-model="queryParams.timeRange"
-              type="datetimerange"
-              range-separator="至"
-              start-placeholder="开始时间"
-              end-placeholder="结束时间"
-              :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
-              style="width: 350px;"
-            />
+            <el-date-picker v-model="queryParams.timeRange" type="datetimerange" range-separator="至"
+              start-placeholder="开始时间" end-placeholder="结束时间"
+              :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]" style="width: 350px;" />
           </div>
           <div class="search-btn-group">
             <el-button type="primary" @click="handleSearch">{{ t('common.search') }}</el-button>
@@ -320,7 +364,9 @@ onMounted(() => {
 
     <!-- 表格区域 -->
     <el-card class="table-card">
-      <el-table :data="tableData" v-loading="loading" style="width: 100%; flex: 1;" :cell-style="{ textAlign: 'center' }"  :header-cell-style="{ background: '#F3FAFE', color: '#333',textAlign: 'center' }">
+      <el-table :data="tableData" v-loading="loading" style="width: 100%; flex: 1;"
+        :cell-style="{ textAlign: 'center' }"
+        :header-cell-style="{ background: '#F3FAFE', color: '#333', textAlign: 'center' }">
         <el-table-column type="index" label="序号" width="60" align="center" fixed="left" />
         <el-table-column prop="jwcode" label="精网号" width="120" fixed="left" />
         <el-table-column prop="name" label="姓名" width="150" show-overflow-tooltip />
@@ -355,13 +401,8 @@ onMounted(() => {
 
         <el-table-column label="操作" width="100" fixed="right" align="center">
           <template #default="{ row }">
-            <el-button 
-              v-if="row.orderCode.slice(0,4) == 'GOLD'" 
-              type="danger" 
-              link 
-              size="small" 
-              @click="handleRefund(row)"
-            >
+            <el-button v-if="row.orderCode.slice(0, 4) == 'GOLD'" type="danger" link size="small"
+              @click="openRefundConfirm(row)">
               退款
             </el-button>
           </template>
@@ -370,16 +411,9 @@ onMounted(() => {
 
       <!-- 分页 -->
       <div class="pagination-container">
-        <el-pagination
-          background
-          layout="total, sizes, prev, pager, next, jumper"
-          :total="total"
-          :current-page="queryParams.pageNum"
-          :page-size="queryParams.pageSize"
-          :page-sizes="[10, 20, 50, 100]"
-          @size-change="handlePageSizeChange"
-          @current-change="handleCurrentChange"
-        />
+        <el-pagination background layout="total, sizes, prev, pager, next, jumper" :total="total"
+          :current-page="queryParams.pageNum" :page-size="queryParams.pageSize" :page-sizes="[10, 20, 50, 100]"
+          @size-change="handlePageSizeChange" @current-change="handleCurrentChange" />
       </div>
     </el-card>
 
@@ -414,6 +448,128 @@ onMounted(() => {
         </div>
       </template>
     </el-dialog>
+
+    <div class="recallDialog" v-show="refundConfirmDialog">
+      <div class="close">
+        <button @click="closeConfirmRefund" class="Btn">{{ t('common.close') }}</button>
+      </div>
+      <div class="text">
+        <text class="txt">{{ textContent }}</text>
+      </div>
+      <div class="cancle">
+        <button @click="closeConfirmRefund" class="Btn">{{ t('common.cancel') }}</button>
+      </div>
+      <div class="confirm">
+        <button @click="openRefundDialog" class="Btn">{{ t('common.confirm') }}</button>
+      </div>
+    </div>
+
+    <el-dialog v-model="refundDialog" :title="t('common_add.refund')" class="refundDialog" overflow draggable
+      style="width: 40vw;" :before-close="closeRefundForm">
+      <div style="display: flex;">
+        <div class="left">
+          <div class="add-item">
+            <el-text style="width:4vw;">{{ t('common_add.jwcode') }}</el-text>
+            <el-input v-model="refundFormData.jwcode" style="width:10vw;" disabled />
+          </div>
+          <div class="add-item">
+            <el-text style="width:4vw;">{{ t('common_add.customerName') }}</el-text>
+            <el-input v-model="refundFormData.name" style="width:10vw;" disabled />
+          </div>
+          <div class="add-item">
+            <el-text style="width:4vw;">{{ t('common_add.market') }}</el-text>
+            <el-input v-model="refundFormData.marketName" style="width:10vw;" disabled />
+          </div>
+          <div class="add-item">
+            <el-text style="width:4vw;">{{ t('common_add.activity') }}</el-text>
+            <el-input v-model="refundFormData.activity" style="width:10vw;" disabled />
+          </div>
+          <div class="add-item">
+            <el-text style="width:4vw;">{{ t('common_add.productName') }}</el-text>
+            <el-input v-model="refundFormData.goodsName" style="width:10vw;" disabled />
+          </div>
+          <div style="display: flex; margin-bottom: 10px;">
+            <div style=" display: flex; align-items: center;justify-content: center; ">
+              <span style="color: #999999;  white-space: nowrap;">{{ t('common_add.permanentGold')
+              }}：</span>
+              <el-input style="padding-right: 10px;  height: 30px; width: 70px;"
+                v-model="refundFormData.oldpermanentGold" disabled />
+            </div>
+            <div style=" display: flex; align-items: center;justify-content: center; ">
+              <span style="color: #999999;  white-space: nowrap;">{{ t('common_add.freeGold') }}：</span>
+              <el-input style="padding-right: 10px;  height: 30px; width: 70px;" v-model="refundFormData.oldfreeGold"
+                disabled />
+            </div>
+          </div>
+          <div class="add-item">
+            <el-text style="width:4vw;">{{ t('common_add.payCurrency') }}</el-text>
+            <el-input v-model="refundFormData.paymentCurrency" style="width:10vw;" disabled />
+          </div>
+          <div class="add-item">
+            <el-text style="width:4vw;">{{ t('common_add.payAmount') }}</el-text>
+            <el-input v-model="refundFormData.paymentAmount" style="width:10vw;" disabled />
+          </div>
+          <div class="add-item">
+            <el-text style="width:4vw;">{{ t('common_add.payMethod') }}</el-text>
+            <el-input v-model="refundFormData.payType" style="width:10vw;" disabled />
+          </div>
+          <div class="add-item">
+            <el-text style="width:4vw;">{{ t('common_add.payTime') }}</el-text>
+            <el-date-picker v-model="refundFormData.payTime" type="datetime" style="width:10vw;" disabled />
+          </div>
+          <div class="add-item">
+            <el-text style="width:4vw;" size="small">{{ t('common_add.transferVoucher') }}</el-text>
+            <el-form-item :rules="{ required: true, message: t('common_add.uploadPhoto'), trigger: 'change' }">
+              <el-upload ref="uploadRef" :auto-upload="false" list-type="picture-card" :show-file-list="false">
+                <template #default>
+                  <img v-if="refundFormData.voucher" :src="refundFormData.voucher"
+                    style="width: 100%; height: 100%; object-fit: cover;">
+                  <el-icon v-else>
+                    <Plus />
+                  </el-icon>
+                </template>
+              </el-upload>
+            </el-form-item>
+          </div>
+          <div class="add-item">
+            <el-text style="width:4vw;">{{ t('common_add.remark') }}</el-text>
+            <el-input v-model="refundFormData.remark" style="width:10vw;" :rows="2" type="textarea" maxLength="100"
+              disabled show-word-limit />
+          </div>
+        </div>
+        <div class="right">
+          <div class="add-item">
+            <el-text style="width:4vw;">{{ t('common_add.refundModel') }}</el-text>
+            <el-radio-group v-model="refundFormData.refundModel">
+              <el-radio value="0">{{ t('common_add.refundModelAll') }}</el-radio>
+              <el-radio value="1">{{ t('common_add.refundModelPart') }}</el-radio>
+            </el-radio-group>
+          </div>
+          <div v-show="refundFormData.refundModel == '1'" style="display: flex; margin-bottom: 10px;">
+            <div style=" display: flex; align-items: center;justify-content: center; ">
+              <span style="color: #999999;  white-space: nowrap;">{{ t('common_add.permanentGold')
+              }}：</span>
+              <el-input style="padding-right: 10px;  height: 30px; width: 70px;"
+                v-model="refundFormData.permanentGold" />
+            </div>
+            <div style=" display: flex; align-items: center;justify-content: center; ">
+              <span style="color: #999999;  white-space: nowrap;">{{ t('common_add.freeGold') }}：</span>
+              <el-input style="padding-right: 10px;  height: 30px; width: 70px;" v-model="refundFormData.freeGold" />
+            </div>
+          </div>
+          <div class="add-item">
+            <el-text style="width:4vw;">{{ t('common_add.refundReason') }}</el-text>
+            <el-input v-model="refundFormData.refundReason" style="width:10vw;" :rows="5" maxlength="150"
+              show-word-limit type="textarea" />
+          </div>
+          <div>{{ t('common_add.tip') }}</div>
+          <div style="display:flex;justify-content: center;margin-top: 5vh;">
+            <el-button type="default" @click="resetRefund">{{ t('common.reset') }}</el-button>
+            <el-button type="primary" @click="throttledsubmitRefund">{{ t('common.submit') }}</el-button>
+          </div>
+        </div>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
@@ -460,7 +616,8 @@ onMounted(() => {
     text-align: right;
   }
 
-  .el-input, .el-select {
+  .el-input,
+  .el-select {
     width: 200px;
   }
 }
@@ -498,10 +655,117 @@ onMounted(() => {
 :deep(.el-table__body-wrapper),
 :deep(.el-table__cell),
 :deep(.el-table__body td) {
-  background-color: #F3FAFE !important; // 如果想完全一致可以加这个，但有时候会影响阅读，暂保留头部颜色
+  background-color: #F3FAFE !important;
 }
 
 :deep(.el-table__row:hover > .el-table__cell) {
   background-color: #E5EBFE !important;
 }
+
+.refundDialog {
+  .left {
+    width: 50%;
+    height: 70vh;
+    min-height: 700px;
+    padding: 0 2vw;
+
+    .add-item {
+      display: flex;
+      align-items: center;
+      margin-bottom: 1vh;
+    }
+
+    .image {
+      width: 4vw !important;
+      height: 4vw !important;
+    }
+  }
+
+  .right {
+    width: 50%;
+    height: 50vh;
+
+    .add-item {
+      display: flex;
+      align-items: center;
+      margin-bottom: 1vh;
+    }
+  }
+}
+
+.recallDialog {
+  //撤回弹窗提示
+  height: 392px;
+  width: 700px;
+  background-image: url('/src/assets/receive-recall.png');
+  position: fixed; // 固定定位，相对于浏览器窗口
+  top: 50%; // 距离顶部50%
+  left: 50%; // 距离左侧50%
+  transform: translate(-50%, -50%); // 向左、向上平移自身宽高的50%，实现居中
+  z-index: 1000; // 确保在其他元素上层显示
+
+  .close {
+    position: absolute;
+    left: 625px;
+    top: 20px;
+    height: 38px;
+    width: 38px;
+    opacity: 0;
+
+    .Btn {
+      height: 100%;
+      width: 100%;
+      border-radius: 10px;
+    }
+  }
+
+  .text {
+    position: absolute;
+    left: 185px;
+    top: 190px;
+    height: 67px;
+    width: 500px;
+
+    .txt {
+      height: 100%;
+      width: 100%;
+      color: #001a42;
+      font-family: "PingFang SC";
+      font-size: 48px;
+      font-style: normal;
+      font-weight: 900;
+      line-height: normal;
+    }
+  }
+
+  .cancle {
+    position: absolute;
+    left: 185px;
+    top: 304px;
+    height: 55px;
+    width: 150px;
+    opacity: 0;
+
+    .Btn {
+      height: 100%;
+      width: 100%;
+      border-radius: 20px;
+    }
+  }
+
+  .confirm {
+    position: absolute;
+    left: 375px;
+    top: 304px;
+    height: 55px;
+    width: 150px;
+    opacity: 0;
+
+    .Btn {
+      height: 100%;
+      width: 100%;
+      border-radius: 20px;
+    }
+  }
+}
 </style>

src/views/moneyManage/financialAccount/performanceAttribution.vue

@@ -2,11 +2,11 @@
 import { ref, reactive, onMounted, toRefs } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import request from '@/util/http.js'
-import { storeToRefs } from 'pinia'
 import dayjs from 'dayjs'
 import { useI18n } from 'vue-i18n'
 import { refundOnline,performanceSelect,exportPerformance } from '@/api/cash/financialAccount.js'
 import {useAdminStore} from '@/store/index.js'
+import { storeToRefs } from 'pinia'
 
 const adminStore = useAdminStore()
 const {adminData} = storeToRefs(adminStore)