123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285 |
- <!-- +---------------------------------------------------------------------- -->
- <!-- | CRMEB [ CRMEB赋能开发者,助力企业发展 ] -->
- <!-- +---------------------------------------------------------------------- -->
- <!-- | Copyright (c) 2016~2022 https://www.crmeb.com All rights reserved. -->
- <!-- +---------------------------------------------------------------------- -->
- <!-- | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权 -->
- <!-- +---------------------------------------------------------------------- -->
- <!-- | Author: CRMEB Team <admin@crmeb.com> -->
- <!-- +---------------------------------------------------------------------- -->
- {extend name="public/container"}
- {block name="title"}学习计划{/block}
- {block name="head"}
- <style>
- body {
- background: #F5F5F5;
- }
- .price-wrap {
- display: flex;
- align-items: center;
- font-size: .24rem;
- line-height: .33rem;
- color: #DC9845;
- }
- .price-wrap .price {
- flex: 1;
- font-weight: bold;
- font-size: .24rem;
- line-height: .45rem;
- color: #DC9845;
- }
- .price-wrap .price span {
- font-size: .32rem;
- }
- .activity-list li > div > div > div:last-child {
- font-weight: normal;
- }
- .activity-list .tab div{text-align: left; padding-left: 10px;}
- </style>
- {/block}
- {block name="content"}
- <div class="activity-list" v-cloak id="app">
- <div class="content">
- <ul v-if="activityList.length">
- <li v-for="(item, index) in activityList" :key="index">
- <div>
- <div>
- <img :src="item.plan_head" alt="" @click="planDetails(item.id)">
- </div>
- <div>
- <div @click="planDetails(item.id)">{{ item.plan_name }}</div>
- <div class="price-wrap">
- <div class="price" @click="planDetails(item.id)">¥<span>{{ item.sales }}</span></div>
- <div>
- <input class="zybt" @click="planDetails(item.id)" v-if="item.isbuy" value="开始学习" type="button"/>
- <input class="zybt" @click="OpenPay(item)" v-if="!item.isbuy" value="购买学习" type="button"/>
- </div>
- </div>
- </div>
- </div>
- </li>
- </ul>
- <div v-if="!activityList.length && loadend" class="empty">
- <img src="{__WAP_PATH}zsff/images/empty.png" alt="暂无数据">
- <div>暂无数据</div>
- </div>
- </div>
- <quick-menu></quick-menu>
- <!-- 支付弹窗 -->
- <pay-dialog :open.sync="payDialogOpen" :money="money" :now_money="now_money" :special_id="planinfo.id" :link_pay_uid="link_pay_uid"
- :pay_type_num="pay_type_num" :pink-id="pinkId" :is-wechat="isWechat" :is-alipay="is_alipay" :is-balance="is_yue"
- :template-id="templateId" :wxpay-h5="wxpayH5" :is-member="isMember" @change="changeVal">
- </pay-dialog>
- <!-- 登录弹窗 -->
- <base-login :login-show="loginShow" :site-name="site_name" @login-close="loginClose"></base-login>
- </div>
- {/block}
- {block name="foot"}
- <script>
-
- require(['vue', 'store', 'helper', '{__WAP_PATH}zsff/js/quick.js',
- 'components/pay-dialog/index', 'components/base-login/index'
- ], function (Vue, store, $h, quick, PayDialog, BaseLogin) {
- var isPay = 0;
- var link_pay_uid = 0;
- var is_yue = {$is_yue? 'true': 'false'};
- var is_alipay = {$is_alipay? 'true': 'false'};
- var isWechat = {$isWechat? 'true': 'false'};
- var isPay = {$isPay? 'true': 'false'};
- var wxpayH5 = {$is_h5_wechat_payment_switch? 'true': 'false'};
- var now_money = {$now_money};
- var isMember = {$is_member};
- var site_name = '{$Auth_site_name}';
- var app = new Vue({
- el: '#app',
- components: {
- 'base-login': BaseLogin,
- 'pay-dialog': PayDialog,
- },
- data: {
- navs: ['全部', '待核销', '已核销'],
- navActive: 0,
- activityList: [],
- loading: false,
- loadend: false,
- page: 1,
- limit: 20,
- loadTitle:'',
- planinfo:{},
- //支付登录相关
- payDialogOpen: false,
- loginShow: false,
- is_pay: isPay,
- money:0,
- link_pay_uid:link_pay_uid,
- pay_type_num: 7, //新增的 学习计划支付类型
- pinkId: 0,
- isWechat: isWechat,
- is_pay: isPay,
- is_alipay: is_alipay, //支付宝是否开启
- is_yue: is_yue, //余额是否开启
- now_money: now_money, //余额
- templateId: '',
- wxpayH5:wxpayH5,
- isMember:isMember,
- site_name:site_name,
- },
- mounted: function () {
- this.geLogList();
- this.$nextTick(function () {
- this.init();
- });
- },
- methods: {
- init: function () {
- var that = this;
- window.addEventListener('scroll', function () {
- var clientHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight,
- scrollHeight = document.documentElement.scrollHeight || document.body.scrollHeight,
- scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
- if (clientHeight + scrollTop >= scrollHeight) {
- that.geLogList();
- }
- });
- },
- planDetails: function (order_id) {
- return window.location.href=$h.U({ c: 'studyplan', a: 'details', q: {id: order_id } });
- },
- study: function (id){
- return window.location.href=$h.U({ c: 'studyplan', a: 'gotoStudy', q: {id: id } });
- },
- // 获取学习记录
- geLogList: function () {
- var that = this;
- if (that.loading) return;
- if (that.loadend) return;
- that.loading = true;
- store.baseGet($h.U({ c: 'studyplan', a: 'index', p: { page: that.page, limit: that.limit, op:'list' } }), function (res) {
- var list = res.data.data;
- that.activityList.push.apply(that.activityList, list);
- that.loadend = list.length < that.limit;
- that.loadTitle = that.loadend ? '已全部加载完' : '上拉加载更多';
- that.page = that.page + 1;
- that.loading = false;
- that.$set(this, 'activityList', that.activityList);
- }, function (res) {
- that.loadTitle = '上拉加载更多';
- that.loading = false;
- });
- },
- //所有插件回调处理事件
- changeVal: function (opt) {
- if (typeof opt != 'object') opt = {};
- var action = opt.action || '';
- var value = opt.value || '';
- this[action] && this[action](value);
- },
- pay_order: function (data) {
- this.orderId = data.data.result.orderId || '';
- switch (data.data.status) {
- case "PAY_ERROR":
- case 'ORDER_EXIST':
- case 'ORDER_ERROR':
- this.extendOrder(data.msg);
- break;
- case 'WECHAT_PAY':
- this.wechatPay(data.data.result.jsConfig);
- break;
- case 'WECHAT_H5_PAY':
- this.payDialogOpen = false;
- var callbackUrl = callback_url + '?type=9&id=' + this.planinfo.id;
- var mwebUrl = data.data.result.jsConfig.mweb_url + '&redirect_url=' + encodeURIComponent(callbackUrl);
- window.location.href = mwebUrl;
- break;
- case 'SUCCESS':
- this.successOrder(data.msg);
- break;
- case 'ZHIFUBAO_PAY':
- window.location.href = $h.U({
- m: 'wap',
- c: 'alipay',
- a: 'index',
- q: {info: data.data.result, params: 'plan'}
- });
- break;
- }
- },
- wechatPay: function (config) {
- var that = this;
- mapleWx($jssdk(), function () {
- this.chooseWXPay(config, function () {
- that.successOrder();
- }, {
- fail: that.extendOrder,
- cancel: that.extendOrder
- });
- });
- },
- successOrder: function (msg) {
- var that = this;
- $h.showMsg({
- title: msg ? msg : '支付成功',
- icon: 'success',
- success: function () {
- that.paid = true;
- that.is_pay = true;
- that.payDialogOpen = false;
- var opt = {
- c: 'studyplan',
- a: 'details',
- q: {
- id: that.planinfo.id
- }
- };
- window.location.assign($h.U(opt));
- }
- });
-
- },
- extendOrder: function (msg) {
- var that = this;
- if (typeof msg === 'object') {
- if (msg.errMsg === 'chooseWXPay:cancel') {
- msg = '微信支付取消';
- } else {
- msg = '支付失败';
- }
- } else {
- msg = '支付失败';
- }
- $h.pushMsg(msg, function () {
- that.payDialogOpen = false;
- if (that.orderId) {
- store.baseGet($h.U({c: 'studyplan', a: 'del_order', q: {orderId: that.orderId}}));
- }
- });
- },
- //打开支付插件,并检测登录状态,没有登录,打开登录插件
- OpenPay: function (plan) {
- this.planinfo = plan;
- this.money = plan.sales;
- var vm = this;
- store.baseGet($h.U({c: 'index', a: 'user_login'}), function (res) {
- this.payDialogOpen = true;
- // var opt = {
- // c: 'studyplan',
- // a: 'details',
- // q: {
- // id: this.planinfo.id
- // }
- // };
- // window.location.assign($h.U(opt));
- }.bind(this), function () {
- vm.loginShow = true;
- });
- },
- //关闭登录
- loginClose: function (val) {
- this.loginShow = false;
- val && this.logComplete();
- },
- }
- });
- });
- </script>
- {/block}
|