Django+xadmin打造線上教育平臺（八）
阿新 • • 發佈：2018-12-31
目錄
程式碼
十一、使用者資訊
11.1.個人資訊展示
（1）新建‘usercenter-bae.html’當母板
{% load staticfiles %} <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="renderer" content="webkit"> <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"usercenter-base.html> <title>{% block title %} 個人資訊- 慕學線上網 {% endblock %}</title> <link rel="stylesheet" type="text/css" href="{% static 'css/reset.css' %}"> <link rel="stylesheet" type="text/css" href="{% static 'css/animate.css' %}"> <link rel="stylesheet" type="text/css"href="{% static 'css/style.css' %}"> <link rel="stylesheet" type="text/css" href="{% static 'js/plugins/queryCity/css/cityLayout.css' %}"> {% block custom_css %} {% endblock %} <link rel="stylesheet" type="text/css" href="{% static 'css/lq.datetimepick.css' %}"/> <script src="{% static 'js/jquery.min.js' %}" type="text/javascript"></script> <script src="{% static 'js/jquery-migrate-1.2.1.min.js' %}" type="text/javascript"></script> </head> <body> <section class="headerwrap headerwrap2"> <header> <div class="header2 header"> <div class="top"> <div class="wp"> <div class="fl"><p>服務電話：<b>33333333</b></p></div> <!--登入後跳轉--> <div class="personal"> <dl class="user fr"> <dd>bobby<img class="down fr" src="{% static 'js/jquery-migrate-1.2.1.min.js' %}"/></dd> <dt><img width="20" height="20" src="{% static 'media/image/2016/12/default_big_14.png' %}"/></dt> </dl> <div class="userdetail"> <dl> <dt><img width="80" height="80" src="{% static 'media/image/2016/12/default_big_14.png' %}"/></dt> <dd> <h2>django</h2> <p>bobby</p> </dd> </dl> <div class="btn"> <a class="personcenter fl" href="usercenter-info.html">進入個人中心</a> <a class="fr" href="/logout/">退出</a> </div> </div> </div> <a href="usercenter-message.html"> <div class="msg-num"><span id="MsgNum">0</span></div> </a> </div> </div> <div class="middle"> <div class="wp"> <a href="index.html"><img class="fl" src="{% static 'images/logo2.png' %}"/></a> <h1>我的慕學網</h1> </div> </div> </div> </header> </section> <!--crumbs start--> {% block custom_bread %} {% endblock %} <section> <div class="wp list personal_list"> <div class="left"> <ul> <li class="active2"><a href="usercenter-info.html">個人資料</a></li> <li ><a href="usercenter-mycourse.html">我的課程</a></li> <li ><a href="usercenter-fav-course.html">我的收藏</a></li> <li > <a href="usercenter-message.html" style="position: relative;"> 我的訊息 </a> </li> </ul> </div> {% block custom_right_content %} {% endblock %} </div> </section> <script src="{% static 'js/selectUi.js' %}" type='text/javascript'></script> <script type="text/javascript" src="{% static 'js/plugins/laydate/laydate.js' %}"></script> <script src="{% static 'js/plugins/layer/layer.js' %}"></script> <script src="{% static 'js/plugins/queryCity/js/public.js' %}" type="text/javascript"></script> <script src="{% static 'js/unslider.js' %}" type="text/javascript"></script> <script src="{% static 'js/plugins/jquery.scrollLoading.js' %}" type="text/javascript"></script> <script src="{% static 'js/validateDialog.js' %}" type="text/javascript"></script> <script src="{% static 'js/deco-common.js' %}" type="text/javascript"></script> <script src="{% static 'js/plugins/jquery.upload.js' %}" type='text/javascript'></script> <script src="{% static 'js/validate.js' %}" type="text/javascript"></script> <script src="{% static 'js/deco-user.js' %}"></script> <script type="text/javascript"> $('.jsDeleteFav_course').on('click', function(){ var _this = $(this), favid = _this.attr('data-favid'); alert(favid) $.ajax({ cache: false, type: "POST", url: "/org/add_fav/", data: { fav_type: 1, fav_id: favid, csrfmiddlewaretoken: '799Y6iPeEDNSGvrTu3noBrO4MBLv6enY' }, async: true, success: function(data) { Dml.fun.winReload(); } }); }); $('.jsDeleteFav_teacher').on('click', function(){ var _this = $(this), favid = _this.attr('data-favid'); $.ajax({ cache: false, type: "POST", url: "/org/add_fav/", data: { fav_type: 3, fav_id: favid, csrfmiddlewaretoken: '799Y6iPeEDNSGvrTu3noBrO4MBLv6enY' }, async: true, success: function(data) { Dml.fun.winReload(); } }); }); $('.jsDeleteFav_org').on('click', function(){ var _this = $(this), favid = _this.attr('data-favid'); $.ajax({ cache: false, type: "POST", url: "/org/add_fav/", data: { fav_type: 2, fav_id: favid, csrfmiddlewaretoken: '799Y6iPeEDNSGvrTu3noBrO4MBLv6enY' }, async: true, success: function(data) { Dml.fun.winReload(); } }); }); </script> {% block custom_js %} {% endblock %}k %} <script> var shareUrl = '', shareText = '', shareDesc = '', shareComment = ''; $(function () { $(".bdsharebuttonbox a").mouseover(function () { var type = $(this).attr('data-cmd'), $parent = $(this).parent('.bdsharebuttonbox'), fxurl = $parent.attr('data-url'), fxtext = $parent.attr('data-text'), fxdesc = $parent.attr('data-desc'), fxcomment = $parent.attr('data-comment'); switch (type){ case 'tsina': case 'tqq': case 'renren': shareUrl = fxurl; shareText = fxdesc; shareDesc = ''; shareComment = ''; break; default : shareUrl = fxurl; shareText = fxtext; shareDesc = fxdesc; shareComment = fxcomment; break; } }); }); function SetShareUrl(cmd, config) { if (shareUrl) { config.bdUrl = "" + shareUrl; } if(shareText){ config.bdText = shareText; } if(shareDesc){ config.bdDesc = shareDesc; } if(shareComment){ config.bdComment = shareComment; } return config; } window._bd_share_config = { "common": { "onBeforeClick":SetShareUrl, "bdPic":"", "bdMini":"2", "searchPic":"1", "bdMiniList":false }, "share": { "bdSize":"16" } }; with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com../api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)]; </script> </body> </html>
(2)修改‘usercenter-info.html’繼承usercenter-bae.html
{% load staticfiles %} <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="renderer" content="webkit"> <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" > <title>{% block title %} 個人資訊- 慕學線上網 {% endblock %}</title> <link rel="stylesheet" type="text/css" href="{% static 'css/reset.css' %}"> <link rel="stylesheet" type="text/css" href="{% static 'css/animate.css' %}"> <link rel="stylesheet" type="text/css" href="{% static 'css/style.css' %}"> <link rel="stylesheet" type="text/css" href="{% static 'js/plugins/queryCity/css/cityLayout.css' %}"> {% block custom_css %} {% endblock %} <link rel="stylesheet" type="text/css" href="{% static 'css/lq.datetimepick.css' %}"/> <script src="{% static 'js/jquery.min.js' %}" type="text/javascript"></script> <script src="{% static 'js/jquery-migrate-1.2.1.min.js' %}" type="text/javascript"></script> </head> <body> <section class="headerwrap headerwrap2"> <header> <div class="header2 header"> <div class="top"> <div class="wp"> <div class="fl"><p>服務電話：<b>33333333</b></p></div> <!--登入後跳轉--> <div class="personal"> <dl class="user fr"> <dd>bobby<img class="down fr" src="{% static 'js/jquery-migrate-1.2.1.min.js' %}"/></dd> <dt><img width="20" height="20" src="{% static 'media/image/2016/12/default_big_14.png' %}"/></dt> </dl> <div class="userdetail"> <dl> <dt><img width="80" height="80" src="{% static 'media/image/2016/12/default_big_14.png' %}"/></dt> <dd> <h2>django</h2> <p>bobby</p> </dd> </dl> <div class="btn"> <a class="personcenter fl" href="usercenter-info.html">進入個人中心</a> <a class="fr" href="/logout/">退出</a> </div> </div> </div>