九、用户模块

7、取消收藏机构

用户取消收藏机构应该在operations下实现。

(1)、url

from django.urls import path

from .views import *

app_name = 'operations'

urlpatterns = [
    path('user_ask', user_ask, name='user_ask'),
    path('user_love', user_love, name='user_love'),
    path('user_comment', user_comment, name='user_comment'),
    path('user_delete', user_delete, name='user_delete'),
    ]

(2)、前端页面

用户收藏的机构是由后端传递过去的,前端通过for循环遍历,将机构存放在dl中,这时候我们需要知道用户取消哪个机构。

所以将class='delete jsDeleteFav_org'的div中的data-favid直接存为机构的id。

    <script>
        $(function () {
            $('.delete').click(function () {
                // prop()用来取自带属性的值或设置值, attr()用来去元素自定义的属性的值或设置值
                var loveid = $(this).attr('data-favid');  // 如果天生的属性用 prop()
                var lovetype = 1;
                var obj = $(this);
                $.ajax({
                    type: 'GET',
                    url: '{% url 'operations:user_delete' %}',
                    data:{
                        loveid:loveid,
                        lovetype:lovetype
                    },
                    success(callback){
                        if (callback.status == 'ok'){
                            alert(callback.msg);
                            //拿到点击对象的祖先节点当中有类名是des的对象
                            obj.parents('.des').remove()   //拿到dl标签,并移除
                        }else{
                            alert(callback.msg)
                        }
                    }
                })
            })
        })
    </script>

同时在调试的过程中,发现二级base中的一个js对当前页面有影响,为了保留原本的js,切不影响当前页面,在二级base中挖坑,将这个js包含,当前页面填坑重写。置空。

{% extends 'users/usercenter-base.html' %}
{% load staticfiles %}
{% block title %}
我的收藏- 谷粒教育网
{% endblock %}
{% block breach %}
    我的收藏
{% endblock %}
{% block right %}
<div class="right" >
            <div class="personal_des Releasecont">
                <div class="head">
                    <h1>我的收藏</h1>
                </div>

            </div>
            <div class="personal_des permessage">
                <div class="head">
                    <ul class="tab_header messagehead">
                        <li class="active"><a href="{% url 'users:user_loveorg' %}">课程机构</a> </li>
                        <li><a href="usercenter-fav-teacher.html">授课教师 </a></li>
                        <li><a href="usercenter-fav-course.html">公开课程</a></li>
                    </ul>
                </div>
                <div class="messagelist">

                    <div class="messages butler_list company company-fav-box">
                        {% for org in org_list %}
                        <dl class="des fr">
                            <dt>
                                <a href="{% url 'orgs:org_detail' org.id %}">
                                    <img width="160" height="90" src="{{ MEDIA_URL }}{{ org.image }}"/>
                                </a>
                            </dt>
                            <dd>
                                <h1><a href="{% url 'orgs:org_detail' org.id %}">{{ org.name }}</a></h1>
                                <div class="pic fl" style="width:auto;">

                                    <img src="{% static 'images/authentication.png' %}"/>
                                    <img src="{% static 'images/gold.png' %}"/>

                                </div>
                                <span class="c8 clear">{{ org.address }}</span>
                                <div class="delete jsDeleteFav_org" data-favid="{{ org.id }}"></div>
                            </dd>
                        </dl>
                        {% endfor %}
                    </div>

                </div>
            </div>
        </div>
{% endblock %}
{% block user %}
{% endblock %}
{% block myjs1 %}
    <script>
        $(function () {
            $('.delete').click(function () {
                // prop()用来取自带属性的值或设置值, attr()用来去元素自定义的属性的值或设置值
                var loveid = $(this).attr('data-favid');  // 如果天生的属性用 prop()
                var lovetype = 1;
                var obj = $(this);
                $.ajax({
                    type: 'GET',
                    url: '{% url 'operations:user_delete' %}',
                    data:{
                        loveid:loveid,
                        lovetype:lovetype
                    },
                    success(callback){
                        if (callback.status == 'ok'){
                            alert(callback.msg);
                            //拿到点击对象的祖先节点当中有类名是des的对象
                            obj.parents('.des').remove()   //拿到dl标签,并移除
                        }else{
                            alert(callback.msg)
                        }
                    }
                })
            })
        })
    </script>
{% endblock %}
usercenter-fav-org.html
{% extends 'base.html' %}
{% load staticfiles %}
{% block mycss %}
    <link rel="stylesheet" type="text/css" href="{% static 'js/plugins/queryCity/css/cityLayout.css' %}">
    <link rel="stylesheet" type="text/css" href="{% static 'css/lq.datetimepick.css' %}"/>
    {% block mycss1 %}
    {% endblock %}
{% endblock %}
{% block middle %}
     <div class="middle">
        <div class="wp">
            <a href="/"><img class="fl" src="{% static 'images/logo1.png' %}"/></a>
            <h1>我的谷粒教育网</h1>
        </div>
    </div>
{% endblock %}
{% block content %}
    <section>
        <div class="wp">
            <ul  class="crumbs">
                <li><a href="/">首页</a>></li>
                <li><a href="{% url 'users:user_info' %}">个人中心</a>></li>
                <li>{% block breach %}{% endblock %}</li>
            </ul>
        </div>
    </section>

    <section>
    <div class="wp list personal_list">
    <div class="left">
        <ul>
            <li class="active2"><a href="{% url 'users:user_info' %}">个人资料</a></li>
            <li ><a href="{% url 'users:user_course'  %}">我的课程</a></li>
            <li ><a href="{% url 'users:user_loveorg' %}">我的收藏</a></li>
            <li >
                <a href="usercenter-message.html" style="position: relative;">
                    我的消息
                </a>
            </li>
        </ul>
    </div>

    {% block right %}

    {% endblock %}

    </div>
</section>

    {% block dialog %}
    <div class="dialog" id="jsDialog">
        <div class="resetpwdbox dialogbox" id="jsResetDialog">
        <h1>修改密码</h1>
        <div class="close jsCloseDialog"><img src="{% static 'images/dig_close.png' %}"/></div>
        <div class="cont">
            <form id="jsResetPwdForm" autocomplete="off">
                <div class="box">
                    <span class="word2" >&nbsp;&nbsp;&nbsp;&nbsp;</span>
                    <input type="password" id="pwd" name="password1" placeholder="6-20位非中文字符"/>
                </div>
                <div class="box">
                    <span class="word2" >确定密码</span>
                    <input type="password" id="repwd" name="password2" placeholder="6-20位非中文字符"/>
                </div>
                <div class="error btns" id="jsResetPwdTips"></div>
                <div class="button">
                    <input id="jsResetPwdBtn" type="button" value="提交" />
                </div>
                <input type='hidden' name='csrfmiddlewaretoken' value='DaP7IUKm9FA9nELA9YUlYYWpyIDdCiIP' />
            <input type='hidden' name='csrfmiddlewaretoken' value='799Y6iPeEDNSGvrTu3noBrO4MBLv6enY' />
            </form>
        </div>
    </div>
        <div class="dialogbox changeemai1 changephone" id="jsChangeEmailDialog">
        <h1>修改邮箱</h1>
        <div class="close jsCloseDialog"><img src="{% static 'images/dig_close.png' %}"/></div>
        <p>请输入新的邮箱地址</p>
        <form id="jsChangeEmailForm" autocomplete="off">
            <div class="box">
                <input class="fl change_email" name="email" id="jsChangeEmail" type="text" placeholder="输入重新绑定的邮箱地址">
            </div>
            <div class="box">
                <input class="fl email_code" type="text" id="jsChangeEmailCode" name="code" placeholder="输入邮箱验证码">
                <input class="getcode getting" type="button" id="jsChangeEmailCodeBt" value="获取验证码">
            </div>
            <div class="error btns change_email_tips" id="jsChangeEmailTips" >请输入...</div>
            <div class="button">
                <input class="changeemai_btn" id="jsChangeEmailBt" type="button" value="完成"/>
            </div>
            <input type='hidden' name='csrfmiddlewaretoken' value='DaP7IUKm9FA9nELA9YUlYYWpyIDdCiIP' />
        <input type='hidden' name='csrfmiddlewaretoken' value='799Y6iPeEDNSGvrTu3noBrO4MBLv6enY' />
        </form>
    </div>
    </div>
    <div class="bg" id="dialogBg"></div>
    {% endblock %}
{% endblock %}

{% block footer %}

{% endblock %}
{% block myjs %}
<script src='{% static 'js/plugins/jquery.upload.js' %}' type='text/javascript'></script>
<script src="{% static 'js/validate.js' %}" type="text/javascript"></script>
    {% block user %}
        <script src="{% static 'js/deco-user.js' %}"></script>
    {% endblock %}
    {% block myjs1 %}
    {% endblock %}
    <script>
        $(function () {
            $('#jsChangeEmailCodeBt').click(function () {
                var email = $('#jsChangeEmail').val();
                $.ajax({
                    type: 'POST',
                    url : '{% url 'users:user_changeeamil' %}',
                    data : {
                        email: email,
                        csrfmiddlewaretoken: '{{ csrf_token }}'
                    },
                    success(callback){
                        if (callback == 'ok'){
                            alert(callback.msg)
                        }else{
                            alert(callback.msg)
                        }
                    }
                })
            });
            $('#jsChangeEmailBt').click(function () {
                var eamil = $('#jsChangeEmail').val();
                var code = $('#jsChangeEmailCode').val();
                $.ajax({
                    type: 'POST',
                    url: '{% url "users:user_resetemail" %}',
                    data:{
                        email: eamil,
                        code: code,
                        csrfmiddlewaretoken: {{ csrf_token }}
                    },
                    success:function (callback) {
                        if(callback.status == 'ok'){
                            alert(callback.msg);
                            window.location.herf = '{% url "users:login" %}' //修改成功后需要重新登录
                        }else{
                            alert(callback.msg)
                        }
                    }
                })
            })
        })
    </script>
{% endblock %}
usercenter-base.html

(3)、视图函数

# operations/view.py

def user_delete(request):
    loveid = request.GET.get("loveid", '')
    lovetype = request.GET.get('lovetype', '')
    if loveid and lovetype:
        love = UserLove.objects.filter(love_id=int(loveid), love_type=int(lovetype), love_man=request.user, love_status=True)
        if love:
            love[0].love_status = False
            love[0].save()
            return JsonResponse({
                'status': 'ok',
                'msg': '取消成功'
            })
        else:
            return JsonResponse({
                'status': 'fail',
                'msg': '取消失败'
            })
    return JsonResponse({
        'status': 'fail',
        'msg': '取消失败'
    })

8、收藏老师功能包含取消收藏

12-24 15:53