123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155 |
- <template>
- <view class="com-renew-form">
- <view class="renew-form">
- <view class="renew-top">
- <view class="renew-top-name">
- 套餐订购
- </view>
- </view>
- <view class="renew-tips">
- <view class="text">您当前要订购的是<text class="txt">{{courseInfo.name}}</text>套餐:</view>
- </view>
- <view class="renew-list">
- <view class="list-items">
- <block v-for="(it,index) in packageList">
- <view class="item " :class="activeIndex==index?'actived':''" @click="onPickLeve(index)">
- <view class="tips">{{it.name}}</view>
- <view class="item-img">
- <image :src="it.icon" class="package-img"></image>
- </view>
- <view class="item-price">
- <view class="price">
- <text class="sign">¥</text>{{it.salePrice}}
- </view>
- </view>
- <view class="active" v-if="activeIndex==index">
- <uni-icons type="checkbox-filled" size="30"></uni-icons>
- </view>
- </view>
- </block>
- </view>
- </view>
- <view class="renew-btns">
- <button class="btn-pay" @click="onBuyOrder">立即支付</button>
- </view>
- </view>
- <view class="letter"></view>
- </view>
- </template>
- <script>
- import {
- mapState,
- mapMutations
- } from 'vuex'
- export default {
- name: "RenewForm",
- emits:['onCloseRenew'],
- props: {
- packageList: {
- type: Array,
- default: () => {
- return [];
- }
- },
- courseInfo:{
- type:Object,
- default:()=>{
- return null;
- }
- },
- },
- watch: {
- 'packageList': {
- handler(newVar, oldVar) {
- console.log("newVar", newVar);
- },
- deep: true,
- immediate: true,
- }
- },
- data() {
- return {
- activeIndex: 0,
- };
- },
- computed: {
- ...mapState(['systemInfo', 'store_id', 'userInfo']),
- },
- onShow() {
- },
- methods: {
- onPickLeve(e) {
- this.activeIndex = e;
- },
- onBuyOrder(e) {
- let _this = this;
- let packageId = _this.packageList[_this.activeIndex].id;
- let par = {
- package_id:packageId,
- user_id: _this.userInfo.id,
- course_id:_this.courseInfo.id,
- store_id:_this.store_id,
- pay_type: 1,
- }
- _this.$http.request('fitness/addCourseOrder', {
- ...par
- }, "", "", true).then(res => {
- if (res.code == '200') {
- // #ifdef MP-WEIXIN
- wx.requestPayment({
- timeStamp: res.data.timeStamp,
- nonceStr: res.data.nonceStr,
- package: res.data.package,
- signType: res.data.signType,
- paySign: res.data.paySign,
- success: (res) => {
- uni.showToast({
- title:'您已支付成功,现在可以直接提交预约啦',
- icon:'success',
- success: (e) => {
- _this.$emit("onCloseRenew");
- }
- })
- },
- fail: (res) => {
- uni.showToast({
- title:'支付失败',
- icon:'error',
- success: (e) => {
- _this.$emit("onCloseRenew");
- }
- })
- }
- })
- // #endif
- }
- }).catch(err => {})
- },
- }
- }
- </script>
- <style lang="scss">
- @import './FitPackageForm.scss'
- </style>
|