学习计划详情实现

application/admin/model/study/PlanBuy.php

@@ -0,0 +1,24 @@
+<?php
+// +----------------------------------------------------------------------
+// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
+// +----------------------------------------------------------------------
+// | Copyright (c) 2016～2022 https://www.crmeb.com All rights reserved.
+// +----------------------------------------------------------------------
+// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
+// +----------------------------------------------------------------------
+// | Author: CRMEB Team <admin@crmeb.com>
+// +----------------------------------------------------------------------
+
+namespace app\admin\model\study;
+
+use traits\ModelTrait;
+use basic\ModelBasic;
+
+/**
+ * Class plan 讲师
+ * @package app\admin\model\special
+ */
+class PlanBuy extends ModelBasic {
+    use ModelTrait;
+   
+}

application/admin/model/study/PlanSteps.php

@@ -15,7 +15,7 @@ use traits\ModelTrait;
 use basic\ModelBasic;
 
 /**
- * Class plan 讲师
+ * Class planSteps 步骤
  * @package app\admin\model\special
  */
 class PlanSteps extends ModelBasic {

application/admin/view/study/plan/create.php

@@ -94,7 +94,7 @@
                     <div class="layui-form-item required">
                         <label class="layui-form-label">介绍：</label>
                         <div class="layui-input-block">
-                            <textarea id="editor">{{formData.introduction}}</textarea>
+                            <textarea v-model="formData.introduction" style="width: 80%;" rows="5"></textarea>
                         </div>
                     </div>
                     <div class="layui-form-item">
@@ -188,7 +188,6 @@
                 },
                 save:function () {
                     var that=this;
-                    that.formData.introduction = that.ue.getContent();
                     that.$nextTick(function () {
                         if (!that.formData.plan_name) return layList.msg('请输入学习计划名称');
                         if (!that.formData.plan_head) return layList.msg('请上传封面图片');
@@ -236,10 +235,6 @@
             mounted:function () {
                 var that=this;
                 window.changeIMG = that.changeIMG;
-                //选择图片插入到编辑器中
-                window.insertEditor = function(list,fodder){
-                    that.ue.execCommand('insertimage', list);
-                };
                 layList.date({
                     elem: '#shelf_time', type: 'datetime', done: function (value) {
                         that.formData.shelf_time = value;
@@ -247,19 +242,6 @@
                 });
                 this.$nextTick(function () {
                     layList.form.render();
-                    //实例化编辑器
-                    UE.registerUI('选择图片', function (editor, uiName) {
-                        var btn = new UE.ui.Button({
-                            name: uiName,
-                            title: uiName,
-                            cssRules: 'background-position: -380px 0;',
-                            onclick: function() {
-                                ossUpload.createFrame(uiName, { fodder: editor.key }, { w: 800, h: 550 });
-                            }
-                        });
-                        return btn;
-                    });
-                    that.ue = UE.getEditor('editor');
                 });
                 layList.form.on('radio(is_show)',function (data) {
                     that.formData.is_show=data.value;

application/wap/controller/Studyplan.php

@@ -12,6 +12,12 @@
 
 namespace app\wap\controller;
 
+use app\admin\model\study\Plan;
+use app\admin\model\study\PlanSteps;
+use app\admin\model\study\PlanItems;
+use app\wap\model\special\Special as SpecialModel;
+use service\JsonService;
+use think\Url;
 
 /**商品控制器
  * Class Store
@@ -28,7 +34,44 @@ class Studyplan extends AuthController{
         ];
     }
 
-    public function index(){
+    public function index($page = 1, $limit = 20, $op = ''){
+        if ($op == 'list') {
+            $model = Plan::alias('p')->where('p.is_del', 0)->page((int)$page, (int)$limit);
+            $model = $model->join('PlanBuy pb', 'pb.uid = ' . $this->uid  .' and pb.planid = p.id ', 'left');
+            $orderList = $model->order('p.shelf_time DESC')->field('p.*, pb.id as isbuy')->select();
+            $orderList = count($orderList) > 0 ? $orderList->toArray() : [];
+            return JsonService::successful($orderList);
+        }
+        return $this->fetch();
+    }
+
+    public function details($id = 0) {
+        if (!$id) $this->failed('缺少参数,无法访问', Url::build('index/index'));
+        $planinfo = Plan::get($id);
+        if (!$planinfo) $this->failed('参数错误,无法访问', Url::build('index/index'));
+        $planinfo['introduction'] = htmlspecialchars_decode($planinfo['introduction']);
+        $steps = PlanSteps::where('is_del', 0)->where('pid', $id)->select();
+        $stepids = [];
+        foreach($steps as $v){
+            $stepids[] = $v['id'];
+        }
+        $itemsList = [];
+        $join = [
+            ['special s', 's.id = it.cid and s.is_del = 0 and s.status = 1']
+        ];
+        $items = PlanItems::alias('it')->field('s.*, it.stepsid,it.pid')
+            ->join($join)
+            ->where('pid', $id)
+            ->where('stepsid', 'in', $stepids)
+            ->select();
+        foreach ($items as $v) {
+            $v['count'] = SpecialModel::numberChapters($v['type'], $v['id']);
+            $itemsList[$v['stepsid']][] = $v->toArray();
+        }
+        $this->assign('steps', json_encode($steps));
+        $this->assign('itemsList', json_encode($itemsList));
+        $this->assign('planinfo', json_encode($planinfo));
+        
         return $this->fetch();
     }
 }

application/wap/view/first/studyplan/details.html

@@ -0,0 +1,136 @@
+<!-- +---------------------------------------------------------------------- -->
+<!-- | 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: .42rem;
+    }
+    .activity-list li > div > div > div:last-child {
+        font-weight: normal;
+    }
+    .activity-list .tab div{text-align: left; padding-left: 10px;}
+
+    .plan_header{ background: #fff;}
+    .plan_header>div{padding: 0.16rem;}
+    .plan_header img{width: 100%; height: 4rem; }
+    .plan_title{ font-size: 0.4rem;font-weight: bolder;}
+    .content1{ margin: 0.2rem; background:#F5F5F5;}
+</style>
+{/block}
+{block name="content"}
+<div v-cloak id="app">
+    <div class="plan_header">
+        <div>
+            <img :src="planinfo.plan_head">
+            <div class="price-wrap">
+                <div class="price">￥<span>{{ planinfo.sales }}</span></div>
+            </div>
+            <div class="plan_title">{{ planinfo.plan_name }}</div>
+            <div class="plan_introduction">{{ planinfo.introduction }}</div>
+        </div>
+    </div>
+    <div class="content1">
+        <ul v-if="steps.length">
+            <li v-for="(item1, index1) in steps" :key="index1">
+                <div>
+                    <div class="public_title acea-row row-between-wrapper">
+                        <div class="name" >
+                            <div class="title-circular"></div>
+                            <div class="title-text" v-text="item1.stepname"></div>
+                        </div>
+                    </div>
+                    <div>
+                        {{item1.introduction}}
+                    </div>
+                </div>
+                <div class="activity-list">
+                    <div class="content">
+                        <ul v-if="itemsList[item1.id]">
+                            <li v-for="(item, index) in itemsList[item1.id] " style=" background: none;">
+                                <div>
+                                    <div style="padding: 0;">
+                                        <img :src="item.image">
+                                    </div>
+                                    <div>
+                                        <div style="font-weight:bolder; ">{{ item.title }}</div>
+                                        <div style="color:gray; ">{{ item.abstract }}</div>
+                                        <div style="color:gray;">共 {{item.count}} 节</div>
+                                    </div>
+                                </div>
+                            </li>
+                        </ul>
+                    </div>
+                    <div v-if="!itemsList[item1.id]" class="empty">
+                        <div>暂无数据</div>
+                    </div>
+                </div>
+            </li>
+        </ul>
+        <div v-if="!steps.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 planinfo = {$planinfo};
+        var steps = {$steps};
+        var itemsList = {$itemsList};
+        console.log(planinfo);
+        var app = new Vue({
+            el: '#app',
+            data: {
+                planinfo:planinfo,
+                steps:steps,
+                itemsList: itemsList,
+            },
+            mounted: function () {
+                this.$nextTick(function () {
+                    this.init();
+                });
+            },
+            methods: {
+                init: function () {
+                    var that = this;
+                },
+                buy: function (){
+                    alert('去购买');
+                },
+                study: function (){
+                    alert('去学习');
+                },
+            }
+        });
+    });
+</script>
+{/block}

application/wap/view/first/studyplan/index.html

@@ -41,19 +41,18 @@
 <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)">
+            <li v-for="(item, index) in activityList" :key="index">
                 <div>
                     <div>
-                        <img :src="item.image" alt="">
+                        <img :src="item.plan_head" alt="" @click="planDetails(item.id)">
                     </div>
                     <div>
-                        <div>{{ item.title }}</div>
-                        <div>{{ item.subject_name }}</div>
+                        <div @click="planDetails(item.id)">{{ item.plan_name }}</div>
                         <div class="price-wrap">
-                            <div class="price">￥<span>{{ item.money }}</span></div>
+                            <div class="price" @click="planDetails(item.id)">￥<span>{{ item.sales }}</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"/>
+                                <input class="zybt" @click="study(item.id)" v-if="item.isbuy == 1" value="开始学习" type="button"/>
+                                <input class="zybt" @click="buy(item.id)" v-if="!item.isbuy" value="购买学习" type="button"/>
                             </div>
                         </div>
                     </div>
@@ -101,33 +100,33 @@
                         }
                     });
                 },
-                specialDetails: function (order_id) {
-                    return window.location.href=$h.U({ c: 'special', a: 'details', q: {id: order_id } });
+                planDetails: function (order_id) {
+                    return window.location.href=$h.U({ c: 'studyplan', a: 'details', q: {id: order_id } });
                 },
-                // 获取历史列表
+                buy: function (){
+                    alert('去购买');
+                },
+                study: function (){
+                    alert('去学习');
+                },
+                // 获取学习记录
                 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;
-                    // });
+                    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;
+                    });
                 }
             }
         });