Django+xadmin打造在线教育平台(八)

八、讲师模块

准备工作:将资料包中的关于teacher的两个前端页面全部复制到templates/orgs下

1、讲师列表页功能实现

(1)、url

将 path('teacher_list',teacher_list, name='teacher_list')加入到orgs/url.py的urlpatterns中。

from django.urls import path, re_path
from .views import *

app_name = 'orgs'

urlpatterns = [
    path('org_list', org_list, name='org_list'),
    re_path(r'org_detail/(\d+)$', org_detail, name='org_detail'),
    re_path(r'org_detail_course/(\d+)$', org_detail_course, name='org_detail_course'),
    re_path(r'org_detail_desc/(\d+)$', org_detail_desc, name='org_detail_desc'),
    re_path(r'org_detail_teacher/(\d+)$', org_detail_teacher, name='org_detail_teacher'),
    path('teacher_list',teacher_list, name='teacher_list')

]

(2)、试图函数

在orgs/views.py中,编写视图函数

def teacher_list(request):
    all_teachers = TeacherInfo.objects.all()
    sort_teachers = all_teachers.order_by('-love_num')[:2]

    sort = request.GET.get('sort')
    if sort:
        all_teachers = all_teachers.order_by('-' + sort)

    # 分页
    pagenum = request.GET.get('pagenum', '')
    pa = Paginator(all_teachers, 2)
    try:
        pages = pa.page(pagenum)
    except PageNotAnInteger:
        pages = pa.page(1)
    except EmptyPage:
        pages = pa.page(pa.num_pages)

    return render(request, 'orgs/teachers-list.html', {
        'all_teachers': all_teachers,
        'sort_teachers': sort_teachers,
        'pages': pages,
        'sort': sort
    })

(3)、前端页面

注意在base.html中给出接口

{% extends 'base.html' %}
{% block title %}
课程讲师 - 谷粒教育网
{% endblock %}
{% block content %}
    <section>
        <div class="wp">
            <ul  class="crumbs">
                <li><a href="/">首页</a>></li>
                <li>课程讲师</li>
            </ul>
        </div>
    </section>

    <section>
    <div class="wp butler_list_box list">
    <div class='left'>
        <div class="butler_list layout">
            <div class="head">
                <ul class="fl tab_header">
                    <li {% if sort == '' %} class="active" {% endif %}><a href="?sort=">全部</a> </li>
                    <li {% if sort == 'click_num' %} class="active" {% endif %}><a href="?sort=click_num">人气 &#8595;</a></li>
                </ul>
                <div class="fr butler-num"><span class="key">{{ all_teachers.count }}</span>&nbsp;&nbsp;&nbsp;</div>
            </div>
                {% for teacher in pages %}
                <dl class="des">
                    <dt>
                        <a href="/org/teacher/detail/1/">
                            <div class="picpic">
                                <img width="100" height="100" class="scrollLoading" src="{{ MEDIA_URL }}{{ teacher.image }}"/>
                            </div>
                        </a>
                        <div class="btn">
                            <div class="fr btn2 bdsharebuttonbox">
                                <span class="fl">分享</span>
                                <a href="#" class="bds_more" data-cmd="more"></a>
                            </div>
                        </div>
                    </dt>
                    <dd>
                        <a href="/org/teacher/detail/1/">
                            <h1>{{ teacher.name }}<span class="key picbig">金牌讲师</span></h1>
                        </a>
                        <ul class="cont">
                            <li>工作年限:<span>{{ teacher.work_year }}年</span></li>
                            <li>工作职位:<span>{{ teacher.work_position }}</span></li>
                            <li>就职公司:<span>{{ teacher.work_company.name }}&nbsp;</span></li>
                            <li>年龄:<span>{{ teacher.age }}岁</span></li>
                            <li>教学特点:<span>{{ teacher.work_style }}</span></li>
                        </ul>
                    </dd>
                    <a class="buy buyservice" href="/org/teacher/detail/1/"><br/>查看<br/>详情</a>
                </dl>
                {% endfor %}



        </div>
         <div class="pageturn">
            <ul class="pagelist">
                {% if pages.has_previous %}
                <li class="long"><a href="?pagenum={{ pages.previous_page_number }}&sort={{ sort }}">上一页</a></li>
                {% endif %}
                {% for num in pages.paginator.page_range %}
                <li {% if num == pages.number %} class="active" {% endif %}><a href="?pagenum={{ num }}&sort={{ sort }}">{{ num }}</a></li>
                {% endfor %}
                {% if pages.has_next %}
                <li class="long"><a href="?pagenum={{ pages.next_page_number }}&sort={{ sort }}">下一页</a></li>
                {% endif %}
            </ul>
        </div>
    </div>
    <div class="right layout">
        <div class="head">讲师排行榜</div>
            {% for teacher in sort_teachers %}
            <dl class="des">
                <span class="num fl">{{ forloop.counter }}</span>
                <a href="/diary/hk_detail/6/">
                    <dt>
                        <img width="50" height="50" class="scrollLoading"  src="{{ MEDIA_URL }}{{ teacher.image }}"/>
                    </dt>
                </a>
                <dd>
                    <a href="/diary/hk_detail/6/">
                        <h1 title="weesmile">{{ teacher.name }}</h1>
                    </a>
                    <p>工作年限:<span>{{ teacher.work_year }}年</span></p>
                </dd>
            </dl>
            {% endfor %}


    </div>
    </div>
</section>
{% endblock %}
orgs/teacher_list.html

2、讲师详情页

(1)、url

from django.urls import path, re_path
from .views import *

app_name = 'orgs'

urlpatterns = [
    path('org_list', org_list, name='org_list'),
    re_path(r'org_detail/(\d+)$', org_detail, name='org_detail'),
    re_path(r'org_detail_course/(\d+)$', org_detail_course, name='org_detail_course'),
    re_path(r'org_detail_desc/(\d+)$', org_detail_desc, name='org_detail_desc'),
    re_path(r'org_detail_teacher/(\d+)$', org_detail_teacher, name='org_detail_teacher'),
    path('teacher_list',teacher_list, name='teacher_list'),
    re_path(r'teacher_detail/(\d+)$', teacher_detail, name='teacher_detail')

]

(2)、视图函数

def teacher_detail(request, teacher_id):
    if teacher_id:
        teacher = TeacherInfo.objects.filter(id=int(teacher_id))[0]
        all_teachers = TeacherInfo.objects.all()
        sort_teachers = all_teachers.order_by('-love_num')[:2]
        return render(request, 'orgs/teacher-detail.html', {
            'teacher': teacher,
            'sort_teachers': sort_teachers,
        })

(3)、前端页面

{% extends 'base.html' %}
{% block title %}
    讲师详情 - 谷粒教育网
{% endblock %}
{% block content %}
    <section>
        <div class="wp">
            <ul  class="crumbs">
                <li><a href="/">首页</a>></li>
                <li><a href="{% url 'orgs:teacher_list' %}">授课讲师</a>></li>
                <li>讲师详情</li>
            </ul>
        </div>
    </section>

    <section>
    <div class="wp butler-detail-box butler-diaryd-box clearfix">
        <div class="fl list">
            <div class="butler_detail_list clearfix">
                <div class="brief">
                    <dl class="des">
                        <dt>
                            <div class="picpic">
                                <img width="100" height="100" src="{{ MEDIA_URL }}{{ teacher.image }}"/>
                            </div>
                            <div class="btn">
                                <span class="fl btn1 collectionbtn" id="jsLeftBtn">
                                     收藏
                                </span>
                                <span class="fr btn2 shareBtn bdsharebuttonbox">
                                    <span class="fl">分享</span>
                                    <a href="#" class="bds_more" data-cmd="more"></a>
                                </span>
                            </div>
                        </dt>
                        <dd>
                            <a href="{% url 'orgs:teacher_detail' teacher.id %}">
                                <h1>weesmile<span class="key picbig">金牌讲师</span></h1>
                            </a>
                            <ul class="cont">
                                <li>工作年限:<span>{{ teacher.work_year }}年</span></li>
                                <li>就职公司:<span>{{ teacher.work_company.name }}</span></li>
                                <li>工作职位:<span>{{ teacher.work_position }}&nbsp;</span></li>
                                <li>教学特点:<span>{{ teacher.work_style }}</span></li>
                            </ul>
                        </dd>
                    </dl>
                </div>
            </div>
            <div class="butler_detail_cont clearfix">
                <div class="left layout">
                <div class="head">
                    <ul class="tab_header">
                        <li class="active"><a href="{% url 'courses:course_list' %}">全部课程</a> </li>
                    </ul>
                </div>
                    <div class="companycenter">
                        <div class="group_list brief">
                            {% for course in teacher.courseinfo_set.all %}
                            <div class="module1_5 box">
                                <a href="{% url 'courses:course_detail' course.id %}">
                                    <img width="214" height="190" class="scrollLoading" src="{{ MEDIA_URL }}{{ course.image }}"/>
                                </a>
                                <div class="des">
                                    <a href="{% url 'courses:course_detail' course.id %}"><h2>{{ course.name }}</h2></a>
                                    <span class="fl">时长:<i class="key">{{ course.study_time }}</i></span>
                                    <span class="fr">学习人数:{{ course.study_num }}</span>
                                </div>
                                <div class="bottom">
                                    <span class="fl">{{ course.orginfo.name }}</span>
                                    <span class="star fr  notlogin" data-favid="15">{{ course.love_num }}</span>
                                </div>
                            </div>
                            {% endfor %}

                        </div>
                    </div>
                <!--<div class="pageturn">-->
                    <!--<ul class="pagelist">-->
                        <!--<li class="active"><a href="?page=1">1</a></li>-->
                    <!--</ul>-->
                <!--</div>-->
            </div>
            </div>
        </div>
        <div class="fr list">
             <div class="butler_detail_list">
                <div class="right butler-company-box">
                <div class="head">
                    <h1>{{ teacher.work_company.name }}</h1>
                    <p>{{ teacher.work_company.desc }}</p>
                </div>
                <div class="pic">
                    <a href="{% url 'orgs:org_detail' teacher.work_company.id %}">
                        <img width="150" height="80" src="{{ MEDIA_URL }}{{ teacher.work_company.image }}"/>
                    </a>
                </div>
                <a href="{% url 'orgs:org_detail' teacher.work_company.id %}">
                    <h2 class="center">{{ teacher.work_company.name }}</h2>
                </a>
                <p class="center tell">{{ teacher.work_company.address }}</p>
                <a class="btn" id="jsRightBtn">收藏</a>
            </div>
            </div>
            <div class="butler_detail_cont">
                <div class="butler_list_box">
                    <div class="right layout">
                        <div class="head">讲师排行榜</div>
                        {% for teacher1 in sort_teachers %}
                        <dl class="des">
                            <span class="num fl">{{ forloop.counter }}</span>
                            <a href="{% url 'orgs:teacher_detail' teacher1.id %}">
                                <dt>
                                    <img width="50" height="50" class="scrollLoading" src="{{ MEDIA_URL }}{{ teacher1.image }}"/>
                                </dt>
                            </a>
                            <dd>
                                <a href="{% url 'orgs:teacher_detail' teacher1.id %}">
                                    <h1 title="weesmile">{{ teacher1.name }}</h1>
                                </a>
                                <p>工作年限:<span>{{ teacher1.work_year }}年</span></p>
                            </dd>
                        </dl>
                        {% endfor %}

                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
{% endblock %}
orgs/teacher_detail.html

3、收藏功能

这边的收藏和课程模块的收藏很相似。

(1)、视图函数

def course_detail(request, course_id):
    if course_id:
        course = CourseInfo.objects.filter(id=course_id)[0]
        relate_course = CourseInfo.objects.filter(category=course.category).exclude(id=int(course_id))[:2]

        # lovecourse和loveorg用来存储用户收藏这个东西的状态,在模板中,根据状态来确定页面加载时候显示的收藏还是取消收藏
        lovecourse = False
        loveorg = False
        if request.user.is_authenticated: # 判断用户是否登录
            # 获取用户是否收藏过课程
            love1 = UserLove.objects.filter(love_id=int(course_id), love_type=2, love_status=True, love_man=request.user)
            if love1:
                lovecourse = True
            # 获取用户是否收藏过机构
            love2 = UserLove.objects.filter(love_id=int(course.orginfo.id), love_type=1, love_status=True, love_man=request.user)
            if love2:
                loveorg = True
        return render(request, 'courses/course-detail.html', {
            'course': course,
            'relate_course': relate_course,
            'lovecourse': lovecourse,
            'loveorg': loveorg,
        })

(2)、前端js代码

<script>
        $(function () {
            $('#jsLeftBtn').click(function () {
                var loveid= {{ teacher.id }};
                var lovetype = 3;
                $.ajax({
                    type: 'GET',
                    url: '{% url 'operations:user_love' %}',
                    data:{
                        loveid:loveid,
                        lovetype:lovetype,

                    },
                    success:function(callback){
                        if (callback.status == 'ok'){
                            $('#jsLeftBtn').text(callback.msg)
                        }else{
                            alert(callback.msg)
                        }
                    }
                })
            });
            $('#jsRightBtn').click(function () {
                var loveid= {{ teacher.work_company.id }};
                var lovetype = 1;
                $.ajax({
                    type: 'GET',
                    url: '{% url 'operations:user_love' %}',
                    data:{
                        loveid:loveid,
                        lovetype:lovetype,

                    },
                    success:function(callback){
                        if (callback.status == 'ok'){
                            $('#jsRightBtn').text(callback.msg)
                        }else{
                            alert(callback.msg)
                        }
                    }
                })
            });

        })
    </script>
{% extends 'base.html' %}
{% block title %}
    讲师详情 - 谷粒教育网
{% endblock %}
{% block content %}
    <section>
        <div class="wp">
            <ul  class="crumbs">
                <li><a href="/">首页</a>></li>
                <li><a href="{% url 'orgs:teacher_list' %}">授课讲师</a>></li>
                <li>讲师详情</li>
            </ul>
        </div>
    </section>

    <section>
    <div class="wp butler-detail-box butler-diaryd-box clearfix">
        <div class="fl list">
            <div class="butler_detail_list clearfix">
                <div class="brief">
                    <dl class="des">
                        <dt>
                            <div class="picpic">
                                <img width="100" height="100" src="{{ MEDIA_URL }}{{ teacher.image }}"/>
                            </div>
                            <div class="btn">
                                <span class="fl btn1 collectionbtn" id="jsLeftBtn">
                                     {% if loveteacher %} 取消收藏
                                         {% else %}
                                         收藏
                                     {% endif %}
                                </span>
                                <span class="fr btn2 shareBtn bdsharebuttonbox">
                                    <span class="fl">分享</span>
                                    <a href="#" class="bds_more" data-cmd="more"></a>
                                </span>
                            </div>
                        </dt>
                        <dd>
                            <a href="{% url 'orgs:teacher_detail' teacher.id %}">
                                <h1>weesmile<span class="key picbig">金牌讲师</span></h1>
                            </a>
                            <ul class="cont">
                                <li>工作年限:<span>{{ teacher.work_year }}年</span></li>
                                <li>就职公司:<span>{{ teacher.work_company.name }}</span></li>
                                <li>工作职位:<span>{{ teacher.work_position }}&nbsp;</span></li>
                                <li>教学特点:<span>{{ teacher.work_style }}</span></li>
                            </ul>
                        </dd>
                    </dl>
                </div>
            </div>
            <div class="butler_detail_cont clearfix">
                <div class="left layout">
                <div class="head">
                    <ul class="tab_header">
                        <li class="active"><a href="{% url 'courses:course_list' %}">全部课程</a> </li>
                    </ul>
                </div>
                    <div class="companycenter">
                        <div class="group_list brief">
                            {% for course in teacher.courseinfo_set.all %}
                            <div class="module1_5 box">
                                <a href="{% url 'courses:course_detail' course.id %}">
                                    <img width="214" height="190" class="scrollLoading" src="{{ MEDIA_URL }}{{ course.image }}"/>
                                </a>
                                <div class="des">
                                    <a href="{% url 'courses:course_detail' course.id %}"><h2>{{ course.name }}</h2></a>
                                    <span class="fl">时长:<i class="key">{{ course.study_time }}</i></span>
                                    <span class="fr">学习人数:{{ course.study_num }}</span>
                                </div>
                                <div class="bottom">
                                    <span class="fl">{{ course.orginfo.name }}</span>
                                    <span class="star fr  notlogin" data-favid="15">{{ course.love_num }}</span>
                                </div>
                            </div>
                            {% endfor %}

                        </div>
                    </div>
                <!--<div class="pageturn">-->
                    <!--<ul class="pagelist">-->
                        <!--<li class="active"><a href="?page=1">1</a></li>-->
                    <!--</ul>-->
                <!--</div>-->
            </div>
            </div>
        </div>
        <div class="fr list">
             <div class="butler_detail_list">
                <div class="right butler-company-box">
                <div class="head">
                    <h1>{{ teacher.work_company.name }}</h1>
                    <p>{{ teacher.work_company.desc }}</p>
                </div>
                <div class="pic">
                    <a href="{% url 'orgs:org_detail' teacher.work_company.id %}">
                        <img width="150" height="80" src="{{ MEDIA_URL }}{{ teacher.work_company.image }}"/>
                    </a>
                </div>
                <a href="{% url 'orgs:org_detail' teacher.work_company.id %}">
                    <h2 class="center">{{ teacher.work_company.name }}</h2>
                </a>
                <p class="center tell">{{ teacher.work_company.address }}</p>
                <a class="btn" id="jsRightBtn">
                    {% if loveorg %}
                        取消收藏
                        {% else %}
                        收藏
                    {% endif %}
                </a>
            </div>
            </div>
            <div class="butler_detail_cont">
                <div class="butler_list_box">
                    <div class="right layout">
                        <div class="head">讲师排行榜</div>
                        {% for teacher1 in sort_teachers %}
                        <dl class="des">
                            <span class="num fl">{{ forloop.counter }}</span>
                            <a href="{% url 'orgs:teacher_detail' teacher1.id %}">
                                <dt>
                                    <img width="50" height="50" class="scrollLoading" src="{{ MEDIA_URL }}{{ teacher1.image }}"/>
                                </dt>
                            </a>
                            <dd>
                                <a href="{% url 'orgs:teacher_detail' teacher1.id %}">
                                    <h1 title="weesmile">{{ teacher1.name }}</h1>
                                </a>
                                <p>工作年限:<span>{{ teacher1.work_year }}年</span></p>
                            </dd>
                        </dl>
                        {% endfor %}

                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
{% endblock %}
{% block myjs %}
      <script>
        $(function () {
            $('#jsLeftBtn').click(function () {
                var loveid= {{ teacher.id }};
                var lovetype = 3;
                $.ajax({
                    type: 'GET',
                    url: '{% url 'operations:user_love' %}',
                    data:{
                        loveid:loveid,
                        lovetype:lovetype,

                    },
                    success:function(callback){
                        if (callback.status == 'ok'){
                            $('#jsLeftBtn').text(callback.msg)
                        }else{
                            alert(callback.msg)
                        }
                    }
                })
            });
            $('#jsRightBtn').click(function () {
                var loveid= {{ teacher.work_company.id }};
                var lovetype = 1;
                $.ajax({
                    type: 'GET',
                    url: '{% url 'operations:user_love' %}',
                    data:{
                        loveid:loveid,
                        lovetype:lovetype,

                    },
                    success:function(callback){
                        if (callback.status == 'ok'){
                            $('#jsRightBtn').text(callback.msg)
                        }else{
                            alert(callback.msg)
                        }
                    }
                })
            });

        })
    </script>
{% endblock %}
orgs/teacher_detail.html

猜你喜欢

转载自www.cnblogs.com/huiyichanmian/p/12014020.html