zyedu/application/wap/view/first/Studyplan/index.html

<!-- +---------------------------------------------------------------------- -->
<!-- | 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" @click="specialDetails(item.id)">
                <div>
                    <div>
                        <img :src="item.image" alt="">
                    </div>
                    <div>
                        <div>{{ item.title }}</div>
                        <div>{{ item.subject_name }}</div>
                        <div class="price-wrap">
                            <div class="price">￥<span>{{ item.money }}</span></div>
                            <div>
                                <input class="zybt" v-if="item.isbuy == 1" value="开始学习" type="button"/>
                                <input class="zybt" v-if="item.isbuy == 0" 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>
</div>
{/block}
{block name="foot"}
<script>
    require(['vue', 'store', 'helper', '{__WAP_PATH}zsff/js/quick.js'], function (Vue, store, $h) {
        var app = new Vue({
            el: '#app',
            data: {
                navs: ['全部', '待核销', '已核销'],
                navActive: 0,
                activityList: [],
                loading: false,
                loadend: false,
                page: 1,
                limit: 20,
                loadTitle:''
            },
            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();
                        }
                    });
                },
                specialDetails: function (order_id) {
                    return window.location.href=$h.U({ c: 'special', a: 'details', q: {id: order_id } });
                },
                // 获取历史列表
                geLogList: function () {
                    var that = this;
                    that.activityList.push(
                        {"id":37,"isbuy":0,"title":"测试学习计划","subject_id":53,"admin_id":0,"lecturer_id":0,"type":3,"is_light":0,"light_type":0,"is_mer_visible":0,"abstract":"\u79c1\u8463\u4f1a\u8bfe\u7a0b\u79c1\u8463\u4f1a\u8bfe\u7a0b\u79c1\u8463\u4f1a\u8bfe\u7a0b","phrase":"","image":"http:\/\/dazaoip.oss-cn-chengdu.aliyuncs.com\/a5f24202208051419226268.png","label":"[\"\\u79c1\\u8463\\u4f1a\\u8bfe\\u7a0b\"]","banner":"[\"http:\\\/\\\/dazaoip.oss-cn-chengdu.aliyuncs.com\\\/8ba4920220805141935969.png\"]","poster_image":"http:\/\/dazaoip.oss-cn-chengdu.aliyuncs.com\/43607202208051419476167.png","service_code":"","is_live":0,"money":98,"pink_money":"0.00","is_pink":0,"pink_number":0,"pink_strar_time":0,"pink_end_time":0,"pink_time":0,"is_fake_pink":0,"fake_pink_number":0,"sort":0,"score":5,"sales":0,"fake_sales":0,"browse_count":55,"pay_type":1,"member_pay_type":0,"member_money":"0.00","link":"","is_show":1,"is_del":0,"add_time":1659680676,"validity":0,"is_alone":0,"brokerage_ratio":0,"brokerage_two":0,"mer_id":0,"quantity":1,"sum":3,"status":1,"success_time":0,"fail_message":"","fail_time":0,"sort_order":0,"log_time":1660357216,"subject_name":"这个学习计划可以快速提升","count":1}
                    );
                    that.activityList.push(
                        {"id":38,"isbuy":1,"title":"测试学习计划1","subject_id":53,"admin_id":0,"lecturer_id":0,"type":3,"is_light":0,"light_type":0,"is_mer_visible":0,"abstract":"\u79c1\u8463\u4f1a\u8bfe\u7a0b\u79c1\u8463\u4f1a\u8bfe\u7a0b\u79c1\u8463\u4f1a\u8bfe\u7a0b","phrase":"","image":"http:\/\/dazaoip.oss-cn-chengdu.aliyuncs.com\/a5f24202208051419226268.png","label":"[\"\\u79c1\\u8463\\u4f1a\\u8bfe\\u7a0b\"]","banner":"[\"http:\\\/\\\/dazaoip.oss-cn-chengdu.aliyuncs.com\\\/8ba4920220805141935969.png\"]","poster_image":"http:\/\/dazaoip.oss-cn-chengdu.aliyuncs.com\/43607202208051419476167.png","service_code":"","is_live":0,"money":98,"pink_money":"0.00","is_pink":0,"pink_number":0,"pink_strar_time":0,"pink_end_time":0,"pink_time":0,"is_fake_pink":0,"fake_pink_number":0,"sort":0,"score":5,"sales":0,"fake_sales":0,"browse_count":55,"pay_type":1,"member_pay_type":0,"member_money":"0.00","link":"","is_show":1,"is_del":0,"add_time":1659680676,"validity":0,"is_alone":0,"brokerage_ratio":0,"brokerage_two":0,"mer_id":0,"quantity":1,"sum":3,"status":1,"success_time":0,"fail_message":"","fail_time":0,"sort_order":0,"log_time":1660357216,"subject_name":"这个学习计划可以快速提升","count":1}
                    );
                    // if (that.loading) return;
                    // if (that.loadend) return;
                    // that.loading = true;
                    // store.baseGet($h.U({ c: 'my', a: 'special_log', 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;
                    // });
                }
            }
        });
    });
</script>
{/block}