From 89ee68c59cdcaa4b7fa0178be42d58bec651ee73 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期四, 09 七月 2020 12:15:03 +0800
Subject: [PATCH] 2020-07-09
---
src/views/pay/index.jsx | 154 ++++++++++++++++++++++++++++++++++++++++++++++++---
1 files changed, 144 insertions(+), 10 deletions(-)
diff --git a/src/views/pay/index.jsx b/src/views/pay/index.jsx
index 50b306f..44c1372 100644
--- a/src/views/pay/index.jsx
+++ b/src/views/pay/index.jsx
@@ -1,17 +1,32 @@
import React, {Component} from 'react'
+import moment from 'moment'
+import md5 from 'md5'
+import QRCode from 'qrcode.react'
+import { notification, Radio } from 'antd'
-// import Api from '@/api'
+import Api from '@/api'
+import Utils from '@/utils/utils.js'
+import WeiXinPay from '@/assets/img/weixinpay.jpg'
+import WeiXinScan from '@/assets/img/weixinscan.png'
import './index.scss'
class Pay extends Component {
state = {
- orderId: ''
+ orderId: '',
+ orderNo: '',
+ logo: '',
+ name: '',
+ copyRight: '',
+ icp: '',
+ total: '',
+ unit: '',
+ qrcode: ''
}
UNSAFE_componentWillMount () {
- let _param = window.atob(this.props.match.params.param)
+ let _urlparam = window.decodeURIComponent(window.atob(this.props.match.params.param))
let _params = {}
- _param.split('&').forEach(cell => {
+ _urlparam.split('&').forEach(cell => {
let _cell = cell.split('=')
_params[_cell[0]] = _cell[1]
})
@@ -19,22 +34,141 @@
if (!sessionStorage.getItem('LoginUID') && _params.LoginUID) {
sessionStorage.setItem('LoginUID', _params.LoginUID)
}
+ if (!sessionStorage.getItem('UserID') && _params.userid) {
+ sessionStorage.setItem('UserID', _params.userid)
+ }
+ if (!sessionStorage.getItem('SessionUid') && _params.suid) {
+ sessionStorage.setItem('SessionUid', _params.suid)
+ }
this.setState({
- orderId: _params.ID
+ orderId: _params.ID,
+ logo: _params.logo,
+ name: _params.name,
+ copyRight: _params.copyRight,
+ icp: _params.icp
+ })
+
+ if (_params.ID) {
+ this.getOrder(_params.ID)
+ } else {
+ notification.warning({
+ top: 92,
+ message: '鏈幏鍙栧埌璁㈠崟ID锛�',
+ duration: 5
+ })
+ }
+ }
+
+ getOrder = (Id) => {
+ let param = {
+ func: 's_get_weixin_pay_native',
+ ID: Id,
+ sandbox: 'Y'
+ }
+
+ param.LTextOut = md5(param.ID + window.GLOB.appkey)
+ param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') + '.000'
+ param.secretkey = Utils.encrypt(param.LTextOut, param.timestamp)
+
+ Api.getLocalConfig(param).then(res => {
+ if (res.status) {
+ this.setState({
+ orderNo: res.out_trade_no,
+ total: res.amount ? res.amount.total : '',
+ unit: res.amount && res.amount.currency === 'CNY' ? '鍏�' : '鍏�',
+ })
+
+ if (!res.out_trade_no) {
+ notification.warning({
+ top: 10,
+ message: '鏈幏鍙栧埌璁㈠崟鍙凤紒',
+ duration: 5
+ })
+ return
+ } else if (!res.appid) {
+ notification.warning({
+ top: 10,
+ message: '鏈幏鍙栧埌搴旂敤ID锛�',
+ duration: 5
+ })
+ return
+ }
+
+ Api.getWxNativePay({ 'out_biz_no': res.out_trade_no, 'out_open_id': res.appid }).then(result => {
+ if (result.qrcode) {
+ this.setState({
+ qrcode: result.qrcode
+ })
+ } else {
+ notification.warning({
+ top: 10,
+ message: result.msg || '鏈幏鍙栧埌鏀粯鐮侊紒',
+ duration: 5
+ })
+ }
+ })
+ } else {
+ notification.warning({
+ top: 10,
+ message: res.message,
+ duration: 5
+ })
+ }
})
}
+ onChange = () => {
+
+ }
+
render () {
+ const { logo, name, orderNo, icp, copyRight, total, unit, qrcode } = this.state
+
return (
<div className="mk-pay-container">
<div className="mk-pay-box">
- <div className="pay-tip">璇锋偍灏藉揩鏀粯锛屼互渚胯鍗曞揩閫熷鐞嗭紒</div>
- <div className="mk-pay-content">
- <div>鏀粯鏂瑰紡:</div>
+ <header>
+ <img className="plat-logo" src={logo} alt=""/>
+ <div className="user-name">{name}</div>
+ </header>
+ <div className="pay-tip">
+ <span>璇锋偍灏藉揩鏀粯锛屼互渚胯鍗曞揩閫熷鐞嗭紒璁㈠崟鍙凤細{orderNo}</span>
+ <span className="pay-total">搴斾粯閲戦<span>{total}</span>{unit}</span>
</div>
- <div className="mk-pay-msg">
- <div>搴斾粯閲戦:</div>
+ <div className="mk-pay-content">
+ <div className="mk-pay-type">
+ <span className="tip">鏀粯鏂瑰紡锛�</span>
+ <Radio.Group onChange={this.onChange} value="weixin">
+ <Radio value="weixin">寰俊鏀粯</Radio>
+ </Radio.Group>
+ </div>
+ <div className="qrcode-box">
+ <p>浜岀淮鐮佹湁鏁堟椂闀�5鍒嗛挓锛岃繃鏈熷悗璇峰埛鏂伴〉闈㈤噸鏂拌幏鍙栦簩缁寸爜銆�</p>
+ <QRCode
+ value={qrcode}
+ size={230}
+ fgColor="#000000"
+ // imageSettings={{
+ // src: '',
+ // height: 60,
+ // width: 60,
+ // excavate: true
+ // }}
+ />
+ <div className="qrcode-tip">
+ <img src={WeiXinScan} alt=""/>
+ <div>
+ <p>璇蜂娇鐢ㄥ井淇℃壂涓�鎵�</p>
+ <p>鎵弿浜岀淮鐮佹敮浠�</p>
+ </div>
+ </div>
+ </div>
+ <img className="weixin-scan" src={WeiXinPay} alt=""/>
+ </div>
+ <div className="mk-pay-bottom">
+ {copyRight ? <p dangerouslySetInnerHTML={{ __html: copyRight.replace(/\s/ig, ' ') }}></p> : null}
+ {icp ? <p dangerouslySetInnerHTML={{ __html: icp.replace(/\s/ig, ' ') }}></p> : null}
</div>
</div>
</div>
--
Gitblit v1.8.0