123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479 |
- <template>
- <view class="content">
- <!-- <swiper-bar :banner="banner"></swiper-bar> -->
- <view class="home">
- <view class="home-title">
- 充值金额
- </view>
- <view class="home-content box-pack-between wrap">
- <view class="home-item" @click="choise" :class="index==indexAct?'home-item-active':''"
- :data-index='index' :data-money='item.money' v-for="(item,index) of list" :key='index'>
- <view class="flex-center hg100">
- <view class="">
- <view class="color-ffa ft28">
- <text class="ft48"> {{item.money}} </text> 元
- </view>
- <view class="ft24">
- {{item.name}}
- </view>
- </view>
- </view>
- <!-- <image v-if="pay_type==1" class="icon-pay-jiao" src="../../static/images/jiao.png" mode=""></image> -->
- </view>
- <view class='input_box flex-y-center'>
- <text class='input_label'>¥</text>
- <input v-model="moneys" type="digit" @focus="getpricefocus" @input="getprice"
- placeholder="其他充值金额"
- maxlength="5"></input>
- </view>
- </view>
- <view class="home-title">
- 支付方式
- </view>
- <view class=" box-pack-between ">
- <view @click="bindtype" data-index="1" class="flex-center home-pay ft28 pr">
- <image class="icon-pay" src="../../static/images/wx.png" mode=""></image>
- <text>微信</text>
- <image class="icon-pay-jiao" src="../../static/images/jiao.png" mode=""></image>
- </view>
- </view>
- <view class="recharge_desc" v-if="recharge_desc">
- 充值提示:{{recharge_desc}}
- </view>
- <view class="hg100px"></view>
- <view class="login-btn flex-center" @click="pay">
- 立即充值
- </view>
-
- <view class="login-btn flex-center login-back" @click="getBack">
- 返回
- </view>
-
- <view class="hg50px"></view>
-
- </view>
- </view>
- </template>
- <script>
- // #ifdef H5
- import getWXSign from "@/static/js/config.js";
- // #endif
- export default {
- data() {
- return {
- // banner: [],
- list: [{
- name: '',
- money: 50,
- }, {
- name: '',
- money: 100,
- }, {
- name: '',
- money: 200,
- },
- {
- name: '',
- money: 500,
- },
- {
- name: '',
- money: 1000,
- },
- {
- name: '',
- money: 2000,
- },
- ],
- indexAct: null,
- pay_type: 2,
- id: null,
- is_pay: false,
- showBottom: false,
- isnav: false,
- recharge_desc: "",
- money: 0,
- moneys: '',
- store_user: {},
- openid: '',
- }
- },
- onLoad(e) {
- this.store_user = uni.getStorageSync("store_user");
- // #ifdef H5
- this.isweb();
- // #endif
- // #ifdef MP-WEIXIN
- uni.login({
- success: (res) => {
- console.log(res)
- // return
- if (res.code) {
- //发起网络请求
- this.request({
- url: 'Smdcshop/xcx_openid',
- data: {
- code: res.code,
- super_id: this.store_user.super_id,
- type: 1,
- },
- }).then(res => {
- if (res.code == '200') {
- this.openid = res.data.openid;
- }
- })
- } else {
- console.log('登录失败!' + res.errMsg)
- }
- }
- })
- // #endif
- },
- onShareAppMessage(e) {
- },
- methods: {
- getBack(e){
- uni.navigateTo({
- url:"../my/my"
- })
- },
- gzhurl(e) {
- this.request({
- url: "user/gzhurl",
- data: {
- type: 4,
- },
- }).then(res => {
- if (res.data.url) {
- window.location.href = res.data.url
- }
- }).catch((res) => {
- console.log("message", res)
- });
- },
- isweb() {
- function GetRequest() {
- var url = location.search; //获取url中"?"符后的字串
- var theRequest = new Object();
- if (url.indexOf("?") != -1) {
- //判断是否有参数
- var str = url.substr(1); //从第一个字符开始 因为第0个是?号 获取所有除问号的所有符串
- var strs = str.split("&");
- console.log(strs)
- for (var i = 0; i < strs.length; i++) {
- theRequest[strs[i].split("=")[0]] = (strs[i].split("=")[1]);
- }
- }
- console.log(theRequest)
- return theRequest;
- }
- if (GetRequest().code) {
- this.request({
- url: "Smdcshop/xcx_openid",
- data: {
- code: GetRequest().code,
- super_id: this.store_user.super_id,
- type: 2,
- },
- }).then(res => {
- console.log(res, "user/gzhurl");
- if (res.code == 200) {
- this.openid = res.data.openid;
- }
- }).catch((res) => {
- console.log("message", res)
- });
- } else {
- this.gzhurl()
- }
- },
- getpricefocus(e) {
- this.paytype = -1;
- this.money = this.money;
- },
- getprice(e) {
- this.money = e.detail.value;
- this.indexAct = null;
- },
- choise(e) {
- this.moneys = '';
- this.money = e.currentTarget.dataset.money;
- this.indexAct = e.currentTarget.dataset.index;
- },
- pay(e) {
- var pay_type = 1;
- // #ifdef H5
- let ua = window.navigator.userAgent.toLowerCase();
- if (ua.match(/MicroMessenger/i) == 'micromessenger') {
- var pay_type = 2;
- }
- // #endif
- this.request({
- url: "Smdcshop/jhwechatcz",
- data: {
- admin_id: uni.getStorageSync("admin_id"),
- money: this.money,
- openid: this.openid,
- type: pay_type,
- },
- }).then(res => {
- console.log(res, "res")
- if (res.code === '200') {
- let autoinfo = res.data;
- // #ifdef H5
- getWXSign().then(res => {
- console.log('wx_getLocation');
- this.$wx.chooseWXPay({
-
- 'appId': autoinfo.appid,
- 'timestamp': autoinfo.timeStamp + "",
- 'nonceStr': autoinfo.nonceStr + "",
- 'package': autoinfo.package,
- 'signType': autoinfo.signType,
- 'paySign':autoinfo.paySign,
- success: (t) => {
- if (t.errMsg == 'chooseWXPay:ok') {
- uni.showModal({
- title: '提示',
- showCancel: false,
- content: "支付成功",
- success: (e) => {
- if (e.confirm) {
- uni.navigateTo({
- url: "./rechargeRecord"
- })
- }
- }
- });
- }
- },
- // 支付取消回调函数
- cencel: function(res) {
- // Toast('用户取消支付~')
- uni.showToast({
- title: "用户取消支付",
- icon: "none",
- })
- },
- // 支付失败回调函数
- fail: function(res) {
- uni.showToast({
- title: "支付失败",
- icon: "none",
- })
- // Toast('支付失败~')
- }
- })
- })
- // #endif
- // #ifdef MP-WEIXIN
- uni.requestPayment({
- provider: "wxpay",
- timeStamp: autoinfo.timeStamp + "",
- nonceStr: autoinfo.nonceStr,
- package: autoinfo.package,
- signType: autoinfo.signType,
- paySign: autoinfo.paySign,
- //微信、支付宝订单数据
- success: (res) => {
- console.log('success:', res);
- uni.showModal({
- title: "提示",
- content: "支付成功",
- showCancel: false,
- success: (res) => {
- uni.navigateTo({
- url: "./rechargeRecord"
- })
- }
- })
- },
- fail: (err) => {
- console.log(err, "err")
- uni.showModal({
- title: "提示",
- content: "支付失败",
- showCancel: false,
- success: (res) => {
- return
- }
- })
- }
- });
- // #endif
- }
- }).catch(res => {
- if (res.code == "4004") {
- uni.showModal({
- title: "提示",
- content: "请先进行账号绑定",
- confirmText: "去绑定",
- showCancel: false,
- success: (res) => {
- if (res.confirm) {
- uni.navigateTo({
- url: "../personal/weixin",
- })
- }
- }
- })
- } else {
- uni.showToast({
- title: res.message,
- icon: "none",
- })
- }
- });
- }
- }
- }
- </script>
- <style lang="scss">
- .home {
- width: 690rpx;
- margin: 0 auto;
- }
- .input_box {
- display: flex;
- padding: 20rpx;
- border-bottom: 1px solid #efefef;
- flex: 1;
- font-size: 40rpx;
- }
- .home-title {
- font-size: 28rpx;
- font-weight: 500;
- color: rgba(51, 51, 51, 1);
- opacity: 1;
- padding: 31rpx 0;
- }
- .home-item {
- width: 48%;
- background: rgba(255, 255, 255, 1);
- box-shadow: 0px 0px 10rpx rgba(168, 168, 168, 0.16);
- opacity: 1;
- border-radius: 4rpx;
- text-align: center;
- display: inline-block;
- margin: 0 0rpx 30rpx 0;
- color: #3387ff;
- padding: 16rpx;
- border-radius: 8rpx;
- }
- .home-content .home-item:nth-child(3n) {
- margin-right: 0rpx;
- }
- .home-content .home-item-active {
- background: #3387ff;
- color: #FFFFFF;
- }
- .home-content .home-item-active .color-ffa {
- color: #FFFFFF;
- }
- .ft48 {
- font-weight: bold;
- }
- .home-pay {
- width: 330rpx;
- height: 90rpx;
- background: rgba(255, 255, 255, 1);
- box-shadow: 0px 0px 10rpx rgba(168, 168, 168, 0.16);
- border-radius: 4rpx;
- position: relative;
- }
- .icon-pay {
- width: 48rpx;
- height: 48rpx;
- margin-right: 20rpx;
- }
- .icon-pay-jiao {
- position: absolute;
- bottom: 0;
- right: 0;
- width: 38rpx;
- height: 38rpx;
- }
- .login-btn {
- width: 630rpx;
- height: 90rpx;
- background: linear-gradient(315deg, #3387ff 2%, #569bff 99%);
- // box-shadow: 0px 2rpx 12rpx rgba(252, 219, 178, 1);
- opacity: 1;
- border-radius: 45rpx;
- margin: 0 auto;
- color: #FFFFFF;
- font-size: 30rpx;
- font-family: Source Han Sans CN;
- font-weight: 500;
- opacity: 1;
- }
- .login-btns {
- width: 630rpx;
- height: 90rpx;
- background: #ccc;
- box-shadow: 0px 2rpx 12rpx #FFFFFF;
- opacity: 1;
- border-radius: 45rpx;
- margin: 0 auto;
- color: #fff;
- font-size: 30rpx;
- font-family: Source Han Sans CN;
- font-weight: 500;
- opacity: 1;
- margin-top: 30rpx;
- }
- .hg100px {
- height: 100rpx;
- }
- .recharge_desc {
- padding: 20rpx 0;
- font-size: 24rpx;
- color: #999;
- }
-
- .login-back{
- margin-top: 40rpx;
- }
-
- </style>
|