|
@@ -1,493 +0,0 @@
|
|
|
-<template>
|
|
|
- <view>
|
|
|
- <view v-if="showSignup" style="padding-top: 50rpx;">
|
|
|
- <view class="pay">
|
|
|
- <image src="https://qnys.chuliu.cc/daweiboshi_szy/1_1615541900_nrG1vctYn8.jpg"
|
|
|
- mode="widthFix" style="width: 750rpx;margin-bottom: 60rpx;"></image>
|
|
|
- <view class="pay_title">
|
|
|
- 大卫博士学位争霸赛第43季
|
|
|
- </view>
|
|
|
- <view class="item">
|
|
|
- <input maxlength="6" type="number" v-model="sms_code" placeholder="请输入验证码" />
|
|
|
- <view v-throttle="2000" class="countdown" @tap="getCode">
|
|
|
- {{ countDown ? `重新获取(${countDown}s)` : '获取验证码' }}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view v-throttle="2000" class="pay_btnSig" :class="status ? 'red' : 'gray'" @click="singup">支付9.9报名</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view v-else class="top">
|
|
|
- <view class="top_flex">
|
|
|
- <image src="../../static/team/green.png" mode="widthFix" style="width: 150rpx;"></image>
|
|
|
- <view class="topt">
|
|
|
- <view class="title">
|
|
|
- 报名成功!
|
|
|
- </view>
|
|
|
- <view class="tip">
|
|
|
- 感谢您的支持
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-<!-- <view class="bottom">
|
|
|
- <view class="bottom_box">
|
|
|
- <view class="show"></view>
|
|
|
- <view class="bottom-money">
|
|
|
- <text>¥</text>{{ data.money }}
|
|
|
- </view>
|
|
|
- <view class="line" />
|
|
|
- <view class="bottom-p">
|
|
|
- 订单编号:{{ data.pay_number }}
|
|
|
- </view>
|
|
|
- <view class="bottom-p">
|
|
|
- 支付时间:{{ data.time }}
|
|
|
- </view>
|
|
|
- <view class="bottom-p">
|
|
|
- 支付方式:银行卡支付
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view> -->
|
|
|
- <!-- 公众号跳转小程序 -->
|
|
|
- <view class="ceshi" v-html="html"></view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
- import { getSignPackage } from '@/apis/app.js';
|
|
|
- import { _API_HuiFuCheck, _API_QuickBankPay, _API_QuickBankSms, _API_CheckStatus } from '../../apis/zbs.js';
|
|
|
- const jweixin = require('jweixin-module');
|
|
|
- export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- status: true,
|
|
|
- data: {},
|
|
|
- showSignup: false,
|
|
|
- countDown: 0, // 倒计时,
|
|
|
- sms_code: '', // 验证码,
|
|
|
- id: '',
|
|
|
- payId: '',
|
|
|
- html: ''
|
|
|
- }
|
|
|
- },
|
|
|
- onShow() {
|
|
|
- // this.getData()
|
|
|
- },
|
|
|
- computed: {
|
|
|
- userinfo() {
|
|
|
- return this.$store.state.userinfo
|
|
|
- }
|
|
|
- },
|
|
|
- onReady() {
|
|
|
- this.signInit();
|
|
|
- // 微信 config 信息验证后,渲染开放标签
|
|
|
- uni.$on('jweixinReady', () => {
|
|
|
- console.log('完成')
|
|
|
- this.init()
|
|
|
- })
|
|
|
- },
|
|
|
- methods: {
|
|
|
- //进入争霸赛按钮
|
|
|
- init() {
|
|
|
- this.html =
|
|
|
- `<wx-open-launch-weapp
|
|
|
- id="launch-btn"
|
|
|
- username="gh_170e5722c167"
|
|
|
- path="pages/index/index"
|
|
|
- >
|
|
|
- <template>
|
|
|
- <style>
|
|
|
- .link_btn {
|
|
|
- width: 400rpx;
|
|
|
- margin: 600rpx auto 0;
|
|
|
- height: 88rpx;
|
|
|
- background: linear-gradient(88deg, #5FBC23 0%, #85CE52 100%);
|
|
|
- opacity: 1;
|
|
|
- border-radius: 44rpx;
|
|
|
- color: #fff;
|
|
|
- text-align: center;
|
|
|
- line-height: 88rpx;
|
|
|
- font-size: 32rpx;
|
|
|
- }
|
|
|
- </style>
|
|
|
- <div class="link_btn">前往争霸赛小程序下</div>
|
|
|
- </template>
|
|
|
- </wx-open-launch-weapp>`
|
|
|
-
|
|
|
- },
|
|
|
- //进入争霸赛小程序
|
|
|
- signInit() {
|
|
|
- const _this = this;
|
|
|
- let link = window.location.href;
|
|
|
- getSignPackage({
|
|
|
- url: link
|
|
|
- }).then(res => {
|
|
|
- if (res.code == 200) {
|
|
|
- let data = JSON.parse(res.data);
|
|
|
- // 判断是否支持分享
|
|
|
- jweixin.config({
|
|
|
- debug: false, //开启debug模式.正式环境设置为false,测试环境设置为true
|
|
|
- appId: data.appId,
|
|
|
- timestamp: data.timestamp,
|
|
|
- nonceStr: data.nonceStr,
|
|
|
- signature: data.signature,
|
|
|
- jsApiList: ['wx-open-launch-weapp'], //根据需要看需要哪些SDK的功能
|
|
|
- openTagList: ['wx-open-launch-weapp'] // 跳转小程序时必填
|
|
|
- });
|
|
|
- jweixin.ready(res => {
|
|
|
- uni.showToast({
|
|
|
- title: '获取成功',
|
|
|
- })
|
|
|
- uni.$emit('jweixinReady', res)
|
|
|
- this.$nextTick(() => {
|
|
|
- let btn = document.getElementById('launch-btn');
|
|
|
- btn.addEventListener('launch', e => {
|
|
|
- console.log('success');
|
|
|
- });
|
|
|
- btn.addEventListener('error', e => {
|
|
|
- alert('小程序打开失败');
|
|
|
- console.log('fail', e.detail);
|
|
|
- });
|
|
|
- });
|
|
|
- });
|
|
|
-
|
|
|
- jweixin.error(err => {
|
|
|
- uni.showToast({
|
|
|
- title: '获取失败',
|
|
|
- })
|
|
|
- console.log(err, 'err')
|
|
|
- uni.showModal({
|
|
|
- content: err || '失败',
|
|
|
- showCancel: false
|
|
|
- })
|
|
|
- });
|
|
|
- } else {
|
|
|
- uni.showModal({
|
|
|
- content: res.msg || '分享失败',
|
|
|
- showCancel: false
|
|
|
- })
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
- // 查询报名信息
|
|
|
- getData() {
|
|
|
- _API_HuiFuCheck().then(res => {
|
|
|
- if (res.code == 200) {
|
|
|
- this.id = res.data.id
|
|
|
- if (res.data.status) {
|
|
|
- this.showSignup = false
|
|
|
- this.data = res.data
|
|
|
- }
|
|
|
- } else if (res.code == 50014) {
|
|
|
- uni.showModal({
|
|
|
- title: '提示',
|
|
|
- content: '检测到您还未绑定银行卡,请前往绑定',
|
|
|
- showCancel: false,
|
|
|
- success: (res) => {
|
|
|
- if (res.confirm) {
|
|
|
- uni.redirectTo({
|
|
|
- url: './form'
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
- })
|
|
|
- return
|
|
|
- } else {
|
|
|
- uni.showModal({
|
|
|
- content: res.message || '获取验证码失败',
|
|
|
- showCancel: false
|
|
|
- });
|
|
|
- return false;
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
- // 1.发送验证码
|
|
|
- getCode() {
|
|
|
- let that = this
|
|
|
- _API_QuickBankPay({ id: this.id }).then(res => {
|
|
|
- if (res.code == 200) {
|
|
|
- uni.showModal({
|
|
|
- content: '验证码发送成功',
|
|
|
- showCancel: false,
|
|
|
- success: (e) => {
|
|
|
- if (e.confirm) {
|
|
|
- that.payId = res.data.id
|
|
|
- that.countDown = 180;
|
|
|
- that.timer = setInterval(() => {
|
|
|
- that.countDown--;
|
|
|
- if (!that.countDown) {
|
|
|
- that.countDown = 0;
|
|
|
- clearInterval(that.timer);
|
|
|
- }
|
|
|
- }, 1000);
|
|
|
- }
|
|
|
- }
|
|
|
- })
|
|
|
- } else {
|
|
|
- uni.showModal({
|
|
|
- content: res.message || '获取验证码失败',
|
|
|
- showCancel: false
|
|
|
- });
|
|
|
- return false;
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
- // 2. 携带验证码支付
|
|
|
- singup() {
|
|
|
- let that = this
|
|
|
- if (!this.sms_code) {
|
|
|
- uni.showModal({
|
|
|
- content: '请先输入验证码',
|
|
|
- showCancel: false
|
|
|
- })
|
|
|
- return
|
|
|
- }
|
|
|
- uni.showModal({
|
|
|
- title: '提示',
|
|
|
- content: '确定要支付吗?',
|
|
|
- success: (res) => {
|
|
|
- if (res.confirm) {
|
|
|
- _API_QuickBankSms({ id: that.payId, sms_code: that.sms_code }).then(res => {
|
|
|
- if (res.code == 200) {
|
|
|
- if (res.data.status == 0) {
|
|
|
- that.SearchStatus()
|
|
|
- } else if (res.data.status == 1) {
|
|
|
- that.showSignup = false
|
|
|
- }
|
|
|
- } else {
|
|
|
- uni.showModal({
|
|
|
- title: '失败',
|
|
|
- content: res.message || '获取失败',
|
|
|
- showCancel: false
|
|
|
- })
|
|
|
- return false;
|
|
|
- }
|
|
|
- })
|
|
|
- .catch(err => {})
|
|
|
- .finally(() => {
|
|
|
- setTimeout(() => {}, 3000)
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
- // 3. 查询支付状态
|
|
|
- SearchStatus() {
|
|
|
- let that = this
|
|
|
- uni.showLoading({
|
|
|
- title: '查询支付状态中...',
|
|
|
- mask: true
|
|
|
- });
|
|
|
- _API_CheckStatus({ id: this.payId }).then(res => {
|
|
|
- if (res.code == 200) {
|
|
|
- if (res.data.status == 1) {
|
|
|
- uni.hideLoading()
|
|
|
- that.getData()
|
|
|
- that.showSignup = false
|
|
|
- } else {
|
|
|
- that.SearchStatus()
|
|
|
- }
|
|
|
- } else {
|
|
|
- uni.hideLoading()
|
|
|
- uni.showModal({
|
|
|
- content: res.message || '查询失败',
|
|
|
- showCancel: false
|
|
|
- })
|
|
|
- }
|
|
|
- }).catch(err => {
|
|
|
- uni.hideLoading()
|
|
|
- uni.showModal({
|
|
|
- content: err || '查询失败',
|
|
|
- showCancel: false
|
|
|
- })
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-</script>
|
|
|
-<style>
|
|
|
- page {
|
|
|
- background-color: #F5F5F5;
|
|
|
- }
|
|
|
-</style>
|
|
|
-<style lang="scss" scoped>
|
|
|
- .link_btn {
|
|
|
- width: 400rpx;
|
|
|
- margin: 600rpx auto 0;
|
|
|
- height: 88rpx;
|
|
|
- background: linear-gradient(88deg, #5FBC23 0%, #85CE52 100%);
|
|
|
- opacity: 1;
|
|
|
- border-radius: 44rpx;
|
|
|
- color: #fff;
|
|
|
- text-align: center;
|
|
|
- line-height: 88rpx;
|
|
|
- font-size: 32rpx;
|
|
|
- }
|
|
|
- .pay {
|
|
|
- margin: 0 30rpx 0 30rpx;
|
|
|
- border-radius: 16rpx;
|
|
|
- background-color: #fff;
|
|
|
- padding: 40rpx 20rpx 40rpx 20rpx;
|
|
|
- &_title {
|
|
|
- font-size: 34rpx;
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
-
|
|
|
- &_time {
|
|
|
- margin-top: 20rpx;
|
|
|
- font-size: 32rpx;
|
|
|
- }
|
|
|
-
|
|
|
- &_btnSig {
|
|
|
- margin: 50rpx auto 0;
|
|
|
- width: 600rpx;
|
|
|
- line-height: 88rpx;
|
|
|
- border-radius: 44rpx;
|
|
|
- text-align: center;
|
|
|
- color: #fff;
|
|
|
- font-size: 32rpx;
|
|
|
- }
|
|
|
- .red {
|
|
|
- background: linear-gradient(93deg, #FF232C 0%, #FF571B 100%);
|
|
|
- }
|
|
|
- .gray {
|
|
|
- background-color: #E1E1E1;
|
|
|
- }
|
|
|
- }
|
|
|
- .item {
|
|
|
- @include flex();
|
|
|
- height: 104rpx;
|
|
|
- box-sizing: border-box;
|
|
|
- color: $app-sec-text-color;
|
|
|
- background: #F8F8F8;
|
|
|
- margin: 50rpx 0 40rpx 0;
|
|
|
- border-radius: 8rpx;
|
|
|
- padding-left: 24rpx;
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- .login_icon {
|
|
|
- width: 36rpx;
|
|
|
- height: 44rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .icon,
|
|
|
- .cuIcon-roundclosefill {
|
|
|
- margin: 0 20rpx;
|
|
|
- font-size: 36rpx;
|
|
|
- }
|
|
|
-
|
|
|
- input {
|
|
|
- flex: 1;
|
|
|
- height: 104rpx;
|
|
|
- margin-left: 15rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .countdown {
|
|
|
- @include flex();
|
|
|
- height: 60rpx;
|
|
|
- font-size: 24rpx;
|
|
|
- padding: 0 20rpx;
|
|
|
- border: 2rpx solid #FB231F;
|
|
|
- margin-right: 20rpx;
|
|
|
- border-radius: 33rpx;
|
|
|
- color: $base-color;
|
|
|
-
|
|
|
- text {
|
|
|
- margin-left: 8rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .top {
|
|
|
- width: 100%;
|
|
|
- height: 340rpx;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- background: linear-gradient(88deg, #72DB2E 0%, #92E25A 100%);
|
|
|
- &_flex {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- margin-top: 40rpx;
|
|
|
- .topt {
|
|
|
- color: #fff;
|
|
|
- margin-left: 24rpx;
|
|
|
- .title {
|
|
|
- font-size: 38rpx;
|
|
|
- font-weight: bold;
|
|
|
- color: #fff;
|
|
|
- }
|
|
|
- .tip {
|
|
|
- font-size: 28rpx;
|
|
|
- color: #fff;
|
|
|
- margin-top: 10rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .bottom {
|
|
|
- width: 750rpx;
|
|
|
- height: 28rpx;
|
|
|
- border-radius: 490rpx;
|
|
|
- margin-top: 42rpx;
|
|
|
- position: relative;
|
|
|
- background: #419F05;
|
|
|
- &_box {
|
|
|
- // width: 702rpx;
|
|
|
- width: 94%;
|
|
|
- // height: 300rpx;
|
|
|
- background-color: #fff;
|
|
|
- position: absolute;
|
|
|
- left: 24rpx;
|
|
|
- top: 14rpx;
|
|
|
- padding-bottom: 16rpx;
|
|
|
- .tip {
|
|
|
- margin-top: 30rpx;
|
|
|
- padding: 0 24rpx;
|
|
|
- margin-bottom: 150rpx;
|
|
|
- .tipTitle {
|
|
|
- font-size: 36rpx;
|
|
|
- font-weight: bold;
|
|
|
- color: #333;
|
|
|
- margin-bottom: 14rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- .show {
|
|
|
- width: 100%;
|
|
|
- height: 38rpx;
|
|
|
- background: linear-gradient(180deg, #419F05 0%, rgba(65, 159, 5, 0) 100%);
|
|
|
- opacity: 0.49;
|
|
|
- }
|
|
|
- }
|
|
|
- &-money {
|
|
|
- text-align: center;
|
|
|
- font-size: 72rpx;
|
|
|
- font-family: PingFang SC, PingFang SC;
|
|
|
- font-weight: bold;
|
|
|
- color: #77C740;
|
|
|
- line-height: 100rpx;
|
|
|
- padding: 10rpx 0 48rpx 0;
|
|
|
- text {
|
|
|
- font-size: 40rpx;
|
|
|
- font-family: PingFang SC, PingFang SC;
|
|
|
- font-weight: bold;
|
|
|
- color: #77C740;
|
|
|
- }
|
|
|
- }
|
|
|
- .line {
|
|
|
- margin: 0 auto;
|
|
|
- width: 654rpx;
|
|
|
- height: 0px;
|
|
|
- opacity: 1;
|
|
|
- border: 2rpx dashed #EEEEEE;
|
|
|
- margin-bottom: 40rpx;
|
|
|
- }
|
|
|
- &-p {
|
|
|
- font-size: 32rpx;
|
|
|
- font-family: PingFang SC, PingFang SC;
|
|
|
- font-weight: 400;
|
|
|
- color: #333333;
|
|
|
- padding: 0 24rpx;
|
|
|
- margin-bottom: 24rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-</style>
|