fix: jinsha支付重新对接

portal-ui/src/components/RechargePc.vue

@@ -73,6 +73,47 @@
 				</mf-button>
 			</div>
 		</mf-dialog>
+		<!-- 银行卡信息输入对话框 -->
+		<mf-dialog
+			:visible="cardInfoVisible"
+			modal-class="card-info-dialog"
+			class="card-info-dialog-wrapper"
+			:title="$t('common.recharge')"
+			hideTitle
+			:footer="false"
+			unmountOnClose
+			@cancel="cancelCardInfo">
+			<div class="card-info-close">
+				<mf-icon
+					value="icon-close"
+					@click="cancelCardInfo" />
+			</div>
+			<div class="card-info-title">
+				{{ $t('common.recharge') }}
+			</div>
+			<mf-input
+				class="card-info-input"
+				:placeholder="$t('common.cardNo')"
+				v-model="cardno" />
+			<mf-input
+				class="card-info-input"
+				:placeholder="$t('common.cardName')"
+				v-model="cardname" />
+			<div class="card-info-submit">
+				<mf-button
+					size="large"
+					@click="cancelCardInfo">
+					{{ $t('common.cancel') }}
+				</mf-button>
+				<mf-button
+					size="large"
+					type="primary"
+					:loading="loading"
+					@click="submitCardInfo">
+					{{ $t('common.ok') }}
+				</mf-button>
+			</div>
+		</mf-dialog>
 	</div>
 </template>
 
@@ -90,7 +131,11 @@ export default {
 			rechargeRemark: '',
 			payVisible: false,
 			orderNo: null,
-			showPay: import.meta.env.VITE_SHOW_PAY == "SUCCESS"
+			showPay: import.meta.env.VITE_SHOW_PAY == "SUCCESS",
+			cardInfoVisible: false,
+			cardno: '',
+			cardname: '',
+			currentGearId: null
 		}
 	},
 	props: {
@@ -108,6 +153,12 @@ export default {
 			this.orderNo = null
 			this.payVisible = false
 		},
+		cancelCardInfo() {
+			this.cardInfoVisible = false
+			this.cardno = ''
+			this.cardname = ''
+			this.currentGearId = null
+		},
 		selectItem(item, idx) {
 			this.selectedIndex = idx
 			this.rechargeRemark = item.title
@@ -167,14 +218,41 @@ export default {
 		},
 		ok() {
 			let selectedItem = this.dataList[this.selectedIndex]
-			let amount = selectedItem.rechargeAmount
+			// 判断是否是 jinsha-pay 接口，需要先输入银行卡信息
+			if (this.apiUrl && this.apiUrl.includes('jinsha-pay')) {
+				this.currentGearId = selectedItem.id
+				this.cardInfoVisible = true
+				return
+			}
+			// 其他支付方式直接调用
+			this.doRecharge(selectedItem.id)
+		},
+		submitCardInfo() {
+			// 验证银行卡信息
+			if (!this.cardno || !this.cardno.trim()) {
+				this.$message.error(this.$t('common.cardNoRequired') || '请输入银行卡号')
+				return
+			}
+			if (!this.cardname || !this.cardname.trim()) {
+				this.$message.error(this.$t('common.cardNameRequired') || '请输入银行卡姓名')
+				return
+			}
+			this.doRecharge(this.currentGearId, this.cardno.trim(), this.cardname.trim())
+		},
+		doRecharge(gearId, cardno, cardname) {
 			this.loading = true
+			let params = {
+				gearId: gearId
+			}
+			// 如果是 jinsha-pay，添加银行卡信息参数
+			if (cardno && cardname) {
+				params.cardno = cardno
+				params.cardname = cardname
+			}
 			this.$axios({
 				url: this.apiUrl,
 				method: 'get',
-				data: {
+				data: params
-					gearId: selectedItem.id
-				}
 			})
 				.then((res) => {
 					this.loading = false
@@ -184,13 +262,31 @@ export default {
 						return;
 					}
 					if (res.code == 200) {
+						// jinsha-pay 返回格式: {code: 0, msg: "成功"}
+						// 其他支付方式返回: {orderNo, payUrl}
+						if (this.apiUrl && this.apiUrl.includes('jinsha-pay')) {
+							// jinsha支付成功，关闭对话框
+							this.cardInfoVisible = false
+							this.cardno = ''
+							this.cardname = ''
+							this.$message.success(this.$t('common.rechargeSuccessfully') || '充值成功，请等待处理')
+						} else {
+							// 其他支付方式，跳转支付页面
 							this.orderNo = res.data?.orderNo;
 							this.rechargeUrl = res.data?.payUrl;
-						window.open(res.data?.payUrl)
+							if (res.data?.payUrl) {
+								window.open(res.data.payUrl)
+							}
+						}
 					}
 				})
-				.catch((_) => {
+				.catch((err) => {
 					this.loading = false
+					if (err.response && err.response.data && err.response.data.msg) {
+						this.$message.error(err.response.data.msg)
+					} else {
+						this.$message.error(this.$t('common.rechargeFailed') || '充值失败')
+					}
 				})
 		}
 	}
@@ -298,6 +394,96 @@ export default {
 		}
 	}
 }
+
+.card-info-dialog {
+	border-radius: 20px;
+	overflow: hidden;
+	background: linear-gradient(
+		0deg,
+		rgba(39, 20, 51, 0.7) 0%,
+		rgba(230, 33, 122, 0.7) 49%
+	);
+	border-radius: 20px;
+	border: 2px solid #e6217a;
+	width: 500px;
+	top: 45% !important;
+	transform: translateY(-45%) !important;
+	&-wrapper {
+		.arco-modal-mask {
+			backdrop-filter: blur(10px);
+			background-color: rgba(0, 0, 0, 0.7);
+		}
+	}
+
+	.arco-modal-body {
+		padding: 24px 30px 30px 30px;
+	}
+
+	.card-info-close {
+		position: absolute;
+		right: 12px;
+		top: 6px;
+		cursor: pointer;
+		color: #fff;
+
+		.mf-icon {
+			font-size: 14px;
+		}
+	}
+
+	.card-info-title {
+		font-size: 20px;
+		color: #ffffff;
+		margin-bottom: 30px;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	}
+
+	.card-info-input {
+		display: flex;
+		align-items: center;
+		border-radius: 10px;
+		justify-content: center;
+		border-radius: 10px;
+		border: 1px solid rgba(#ffffff, 0.3);
+		height: 40px;
+		margin-top: 20px;
+		padding: 0 16px;
+		font-size: 14px;
+		color: #ffffff;
+		position: relative;
+		cursor: pointer;
+		background-color: transparent;
+		cursor: text;
+		font-size: 14px;
+
+		::placeholder {
+			color: rgba(#fff, 0.5);
+		}
+
+		&.arco-input-wrapper:focus-within {
+			background-color: transparent;
+		}
+
+		&:hover {
+			background-color: transparent;
+			border-color: #fff;
+		}
+	}
+
+	.card-info-submit {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		margin-top: 30px;
+		gap: 14px;
+		.mf-button {
+			width: 160px;
+			border-radius: 10px;
+		}
+	}
+}
 .mf-recharge-pc {
 	display: flex;
 	flex-flow: wrap;

portal-ui/src/lang/en_US/common.js

@@ -137,5 +137,10 @@ export default {
 	loadingText: 'Loading...',
 	hasMore: 'Pull up to load more',
 	noMore: 'No more data',
-	giftAmount: 'Credited Amount'
+	giftAmount: 'Credited Amount',
+	cardNo: 'Card Number',
+	cardName: 'Cardholder Name',
+	cardNoRequired: 'Please enter card number',
+	cardNameRequired: 'Please enter cardholder name',
+	rechargeFailed: 'Recharge failed'
 }

portal-ui/src/lang/zh_HK/common.js

@@ -141,5 +141,10 @@ export default {
     loadingText: '載入中...',
     hasMore: '上拉載入更多',
     noMore: '沒有更多了',
-    giftAmount: '到帳金額'
+    giftAmount: '到帳金額',
+    cardNo: '銀行卡號',
+    cardName: '銀行卡姓名',
+    cardNoRequired: '請輸入銀行卡號',
+    cardNameRequired: '請輸入銀行卡姓名',
+    rechargeFailed: '充值失敗'
 }