TMGG开源
首页
GitHub
首页
GitHub
  • 快速上手
  • 配置说明
  • session
  • 定时作业
  • 开放接口
  • 扩展插件

    • 扩展插件 - Kettle
    • 扩展模块 - 支付
    • 扩展插件 - 流程引擎
  • 前端手册

    • 开始
    • 组件
    • 工具类
    • UI 规范
  • 其他

    • 编码贴士
    • 常见问题

扩展模块 - 支付

app端需没有实例化控制器,需继承 PaymentController, 并设置RequestMapping

示例

package cn.crec.venue.venue.app.controler;

import io.tmgg.payment.PaymentController;
import lombok.extern.slf4j.Slf4j;
import org.springframework.web.bind.annotation.*;

@Slf4j
@RestController
@RequestMapping("rest/payment")
public class PaymentAppController extends PaymentController {


}


前端支付页面,uniapp示例

<template>
  <view style="padding:32rpx">
    <u-toast ref="uToast"></u-toast>

    <view style="display: flex;align-items: center;flex-direction: column">
      <view>
        <u--text :text="previewOrder.description"></u--text>
      </view>
      <u-gap></u-gap>
      <view>
        <u--text size="32" mode="price" :text="previewOrder.amount / 100"></u--text>
      </view>
    </view>
    <u-gap></u-gap>   
    <u-radio-group
        v-model="selectedPaymentChannelId"
        placement="column"
        @change="onPaymentChannelChange"
    >
      <u-radio
          :customStyle="{marginBottom: '8px'}"
          v-for="(item, index) in paymentChannelList"
          :key="index"
          :label="item.name"
          :name="item.id"
      >
      </u-radio>
    </u-radio-group>

    <u-gap></u-gap>
    <u-gap></u-gap>
    <u-button @click="callFrontPay" text="确认支付" type="primary"></u-button>

  </view>
</template>

<script>
import http from '@/common/vmeitime-http/interface';

export default {
  data() {
    return {
      orderId: null, // 业务订单id

      // 业务标识, 如订单业务,充值业务等
      bizCode: null,

      // 选择的支付渠道
      selectedPaymentChannelId: null,

	  // 支付成功后返回页面
	  returnPage: '/',

      paymentChannelList: [],

      previewOrder: {
        amount: 0
      },

    }
  },

  onLoad: function (options) {
    this.orderId = options.orderId
    this.bizCode = options.bizCode
	this.returnPage = decodeURIComponent( options.returnPage)
    this.getPreviewOrder()
    this.getPaymentChannelList()
  },
  methods: {
    getPreviewOrder() {
      http.get('/rest/payment/previewOrder', {orderId: this.orderId, bizCode: this.bizCode}).then(response => {
        this.previewOrder = response.data.data
      })
    },

    getPaymentChannelList() {
      http.get('/rest/payment/channelList', {orderId: this.orderId, bizCode: this.bizCode}).then(response => {
        this.paymentChannelList = response.data.data
		if(this.paymentChannelList.length > 0){
			this.selectedPaymentChannelId = this.paymentChannelList[0].id
		}
      })
    },
    onPaymentChannelChange(v) {
      this.selectedPaymentChannelId = v;
    },


    callFrontPay() {
      let params = {orderId: this.orderId, bizCode: this.bizCode, channelId: this.selectedPaymentChannelId};
      http.get('/rest/payment/createOrder', params).then(response => {
        let payInfo = response.data.data
        uni.requestPayment({
          ...payInfo,
          package: payInfo.packageValue,
          success: this.paySuccess,
          fail: this.payFail
        })
      })
    },

    paySuccess(e) {
	  const url = this.returnPage
      this.$refs.uToast.show({
        message: '支付成功',
		complete(){
			uni.navigateTo({
				url:url
			})
		}
      });
    },
    payFail(e) {
      this.$refs.uToast.show({
        message: '支付失败',
      });
    }

  }
}
</script>


Edit this page
最近更新:: 2025/4/27 01:02
Prev
扩展插件 - Kettle
Next
扩展插件 - 流程引擎