|
|
@@ -0,0 +1,191 @@
|
|
|
+<template>
|
|
|
+ <!-- 各种回调页面 -->
|
|
|
+ <div class="app-content awaitPayYe awaitPayYe">
|
|
|
+ <div class="callback-wrap">
|
|
|
+ <div class="bg_01"></div>
|
|
|
+ <div class="callback-blo">
|
|
|
+ <!-- 使用icon -->
|
|
|
+ <!-- 待支付 -->
|
|
|
+ <block>
|
|
|
+ <div class="icon">
|
|
|
+ <i class="iconfont icondaizhifu"></i>
|
|
|
+ </div>
|
|
|
+ </block>
|
|
|
+ <view class="wait">待确认</view>
|
|
|
+ <!-- 待支付 -->
|
|
|
+ <block>
|
|
|
+ <div class="price">
|
|
|
+ <span>￥</span>
|
|
|
+ <span class="app-size-36 app-bold">{{ actPrice || ''}}</span>
|
|
|
+ </div>
|
|
|
+ <div class="order-num app-color-3">订单号: {{ orderSn || ''}}</div>
|
|
|
+ </block>
|
|
|
+ <block>
|
|
|
+ <div class="call-one-btn">
|
|
|
+ <button
|
|
|
+ class="button-com green pay-wx"
|
|
|
+ @click="_wxPay"
|
|
|
+ >微信支付</button>
|
|
|
+ </div>
|
|
|
+ </block>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 键盘 -->
|
|
|
+ <keyboard-module
|
|
|
+ :show="keyShow"
|
|
|
+ @comfirm="hideKeyFn"
|
|
|
+ @clickKey="clickKeyFn"
|
|
|
+ :psdShow="true"
|
|
|
+ :type="_type"
|
|
|
+ @closeKey="closeKeyFn"
|
|
|
+ />
|
|
|
+ <!-- 弹窗 - 未设置支付密码 -->
|
|
|
+ <alert-module
|
|
|
+ :show="setPassModal"
|
|
|
+ btnText="设置"
|
|
|
+ btnColor="#FF2842"
|
|
|
+ padding="66rpx 24rpx 66rpx 24rpx"
|
|
|
+ @click="hideAlert"
|
|
|
+ >
|
|
|
+ <div class="go-login-module">
|
|
|
+ <div>请先设置支付密码！</div>
|
|
|
+ </div>
|
|
|
+ </alert-module>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { purchaseClearCreateOrder, purchaseClearWxPay, purchaseBalancePay } from "@/api/purchase/index";
|
|
|
+import keyboardModule from './components/keyboard'
|
|
|
+import AlertModule from "@/components/plugin/alert";
|
|
|
+import { mapGetters } from "vuex";
|
|
|
+import wexinPay from "@/utils/pay/wxPay";
|
|
|
+export default {
|
|
|
+ name: "callback",
|
|
|
+ components: {
|
|
|
+ keyboardModule,
|
|
|
+ AlertModule
|
|
|
+ },
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ type: '',
|
|
|
+ keyShow: false,
|
|
|
+ modalForm: {
|
|
|
+ payPassword: ''
|
|
|
+ },
|
|
|
+ psdKey: '',
|
|
|
+ orderSn: '',
|
|
|
+ actPrice: '',
|
|
|
+ setPassModal: false,
|
|
|
+ _type: '1'
|
|
|
+ };
|
|
|
+ },
|
|
|
+ onLoad (options) {
|
|
|
+ this.getWeChat(options.id)
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters(["getLoginInfo", 'getDictionariesInfo']),
|
|
|
+ },
|
|
|
+ mounted () {
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getWeChat (id) {
|
|
|
+ // console.log(this.options.id)
|
|
|
+ purchaseClearCreateOrder({ id }).then(res => {
|
|
|
+ this.orderSn = res.data.orderSn
|
|
|
+ this.actPrice = res.data.actPrice
|
|
|
+ }).catch(err => { console.log(err) })
|
|
|
+ },
|
|
|
+ _wxPay () {
|
|
|
+ purchaseClearWxPay({ orderSn: this.orderSn }).then(res => {
|
|
|
+ console.log(res)
|
|
|
+ wexinPay(res.data, this.getSuccess, this.getError)
|
|
|
+ }).catch(err => { console.log(err) })
|
|
|
+ },
|
|
|
+ getSuccess () {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pagesPurchase/particulars'
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getError () {
|
|
|
+ this.$msg("支付失败!");
|
|
|
+ },
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.app-content {
|
|
|
+ .callback-wrap {
|
|
|
+ padding-top: 50px;
|
|
|
+ // background-image: url("../../src/static/images/callback/bg.png");
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-size: 100% auto;
|
|
|
+ position: relative;
|
|
|
+ .bg_01 {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100vw;
|
|
|
+ height: 290upx;
|
|
|
+ background: #3385ff;
|
|
|
+ border-radius: 0rpx 0rpx 83rpx 83rpx;
|
|
|
+ z-index: 1;
|
|
|
+ }
|
|
|
+ .callback-blo {
|
|
|
+ position: absolute;
|
|
|
+ z-index: 9;
|
|
|
+ left: 50%;
|
|
|
+ transform: translateX(-50%);
|
|
|
+ width: 90%;
|
|
|
+ margin: 0 auto;
|
|
|
+ padding: 70px 0;
|
|
|
+ background-color: #fff;
|
|
|
+ box-shadow: 2px 2px 16px 0px rgba(181, 181, 181, 0.29);
|
|
|
+ border-radius: 10px;
|
|
|
+ text-align: center;
|
|
|
+ // 使用icon
|
|
|
+ .icon {
|
|
|
+ .iconfont {
|
|
|
+ font-size: 170px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 一个按钮
|
|
|
+ .call-one-btn {
|
|
|
+ .button-com {
|
|
|
+ width: 80%;
|
|
|
+ padding-top: 22px;
|
|
|
+ padding-bottom: 22px;
|
|
|
+ font-size: 32px;
|
|
|
+ margin-top: 40px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+// 待支付 - 公共
|
|
|
+.awaitPayWx,
|
|
|
+.awaitPayYe {
|
|
|
+ .status-text {
|
|
|
+ margin-top: 22px;
|
|
|
+ margin-bottom: 52px;
|
|
|
+ color: #ffa92e;
|
|
|
+ }
|
|
|
+ .surplus {
|
|
|
+ margin-top: 22px;
|
|
|
+ margin-bottom: 38px;
|
|
|
+ }
|
|
|
+ .icon {
|
|
|
+ .iconfont {
|
|
|
+ color: #ffa92e;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+// 待确认样式
|
|
|
+.wait {
|
|
|
+ color: #ffa92e;
|
|
|
+ font-size: 40upx;
|
|
|
+ font-weight: 700;
|
|
|
+ margin: 20upx 0;
|
|
|
+}
|
|
|
+</style>
|
jf