「基于Django的全民健康智慧中医数字服务平台」前端应用Articles功能(一)
发布时间
阅读量:
阅读量
试读内容 :
「 Django 基 backend 的全民健康智慧中医数字平台」项目的文档列表
「 Django 基 backend 的全民健康智慧中医数字平台 '' 在问诊功能中的应用及其开发原理与理论研究基础
「 Django 基 backend 的全民健康智慧中医数字平台 V2.0 '' 版本的产品设计与技术实现
如果你对中医感兴趣,请您邀请我留言讨论;如果觉得我的内容对你有所帮助,请您邀请我喝一杯沪上阿姨,感激不尽!
文章目录
- 内容简介
- 创建文章应用模块
- 配置文章应用模块
- 文章应用代码实现
内容简介
遵循前后端分离的设计理念,在后端API接口的基础上整合前端交互逻辑进行搭建的前端 用户应用 模块具体内容如下:本文主要涉及业务功能代码实现,并通过分析功能流程图来理解并完成相应功能的开发与测试工作。
本章节介绍 应用配置 和 文章主页 代码编写部分。
创建文章应用模块
进入文件根目录执行命令创建应用
cd TCM_Web
python manage.py startapp articles
代码解读
将创建好的应用文件夹移动到目录的apps下即可
配置文章应用模块
在settings.py文件中修改
INSTALLED_APPS = [
...
# 添加通用数据应用
'articles',
代码解读
文章应用代码实现
1.views.py 全部使用的第三方库和配置
import random
from django.shortcuts import render
from django.http import HttpResponse
from django.core.mail import send_mail
from apps.utils.RequestTools import *
# 加载settings中设置的API网址和端口号
from NewsWeb3.settings import ApiBaseUrl
# 设置API基本参数
# 设置分页
PAGESIZE = 10
# 设置apps.articles
ArticleCategoryUrl = ApiBaseUrl + '/ArticleSettings/ArticleCategory/'
ArticleItemUrl = ApiBaseUrl + '/ArticleSettings/ArticleItem/'
ArticleTagUrl = ApiBaseUrl + '/ArticleSettings/ArticleTag/'
ArticleInfoUrl = ApiBaseUrl + '/ArticleSettings/ArticleInfo/'
ArticleDetailUrl = ApiBaseUrl + '/ArticleSettings/ArticleDetail/'
ArticleStorageLinkUrl = ApiBaseUrl + '/ArticleSettings/ArticleStorageLink/'
ArticleInfoHomeListUrl = ApiBaseUrl + '/ArticleSettings/ArticleInfoHomeList/'
ArticleInfoItemListUrl = ApiBaseUrl + '/ArticleSettings/ArticleInfoItemList/'
# 设置apps.general_data
MyBannerListUrl = ApiBaseUrl + '/GeneralDataSettings/MyBannerList/'
# MyProjectListUrl = ApiBaseUrl + '/GeneralDataSettings/MyProjectList/'
VisitTotalNumberListUrl = ApiBaseUrl + '/GeneralDataSettings/VisitTotalNumberList/'
# VisitEveryDayNumberListUrl = ApiBaseUrl + '/GeneralDataSettings/VisitEveryDayNumberList/'
VisitIpPartListUrl = ApiBaseUrl + '/GeneralDataSettings/VisitIpPartList/'
# VisitEveryIpCountListUrl = ApiBaseUrl + '/GeneralDataSettings/VisitEveryIpCountList/'
# 设置apps.users
UserProfileListUrl = ApiBaseUrl + '/UserSettings/UserProfileList/' # 用户列表API
UserSubscriptionListUrl = ApiBaseUrl + '/UserSettings/UserSubscriptionList/' # 用户订阅API
UserFavListUrl = ApiBaseUrl + '/UserSettings/UserFavList/' # 用户收藏API
UserReadListUrl = ApiBaseUrl + '/UserSettings/UserReadList/' # 用户阅读详情API
UserOrderListUrl = ApiBaseUrl + '/UserSettings/UserOrderList/' # 用户订单API
# 设置全局TEMPLATES变量用于每个页面使用
def GlobalInitArticle(request):
ArticleCategoryList = GetData(ArticleCategoryUrl)
ArticleItemUrlList = GetData(ArticleItemUrl)
ArticleTagUrlList = random.sample(GetData(ArticleTagUrl), 5)
MyBannerListUrlList = GetData(MyBannerListUrl)
# MyProjectListUrlList = GetData(MyProjectListUrl)
ArticleInfoHomeListUrlList = GetData(ArticleInfoHomeListUrl)
return locals()
代码解读
2.views.py Home主页
# 主页Home数据
def HomePage(request):
UserInfo = GetUserInfo(UserProfileListUrl, request) # 通过Session获取用户登陆信息
VisitIpPost(VisitIpPartListUrl, request, "主页")
return render(request, 'articles/HomePage.html', locals())
代码解读
3.项目 settings.py 路由配置
urlpatterns = [
......
re_path(r'^$', HomePage, name='HomePage'), # 资源主页
......
]
代码解读
4.base.html 全部继承模板
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="description" content="Magz is a HTML5 & CSS3 magazine template is based on Bootstrap 3.">
<title>Mr.数据杨的家庭健康数字服务平台</title>
{% load static %}
{# ico#}
<link rel="shortcut icon" href="{% static 'images/favicon.ico' %}" type="image/x-icon">
<!-- Bootstrap -->
<link rel="stylesheet" href="{% static 'scripts/bootstrap/bootstrap.min.css' %}">
<!-- IonIcons -->
<link rel="stylesheet" href="{% static 'scripts/ionicons/css/ionicons.min.css' %}">
<!-- Toast -->
<link rel="stylesheet" href="{% static 'scripts/toast/jquery.toast.min.css' %}">
<!-- OwlCarousel -->
<link rel="stylesheet" href="{% static 'scripts/owlcarousel/dist/assets/owl.carousel.min.css' %}">
<link rel="stylesheet" href="{% static 'scripts/owlcarousel/dist/assets/owl.theme.default.min.css' %}">
<!-- Magnific Popup -->
<link rel="stylesheet" href="{% static 'scripts/magnific-popup/dist/magnific-popup.css' %}">
<link rel="stylesheet" href="{% static 'scripts/sweetalert/dist/sweetalert.css' %}">
<!-- Custom style -->
<link rel="stylesheet" href="{% static 'css/style.css' %}">
<link rel="stylesheet" href="{% static 'css/skins/all.css' %}">
<link rel="stylesheet" href="{% static 'css/demo.css' %}">
</head>
<body class="skin-orange">
<header class="primary">
<!-- 第一部分-->
<div class="firstbar">
<div class="container">
<div class="row">
<!-- 左上角logo-->
<div class="col-md-3 col-sm-12">
<div class="brand">
<a href="{% url 'HomePage' %}">
<img src="{% static 'images/logo.png' %}" alt="Logo">
</a>
</div>
</div>
<!-- 搜索栏-->
<div class="col-md-6 col-sm-12" id="search_header">
<form class="search" autocomplete="off" name="search" action="/GetArticleSearchInfo/" method="post">
{% csrf_token %}
<div class="form-group">
<div class="input-group">
<input type="text" name="search_data" id="search_data" class="form-control"
placeholder="搜索其他关键字或使用过滤器以获得更准确的结果">
<div class="input-group-btn">
<select class="form-control" name="search_type" style="width:80px;">
<option value="news" id="news">新闻</option>
<!-- <option value="data" id="data">数据</option>-->
<!-- <option value="other" id="other">其他</option>-->
</select>
<button class="btn btn-primary"><i class="ion-search"></i></button>
</div>
</div>
</div>
<div class="help-block">
<div>常用搜索关键词:</div>
<ul>
<li><a>中医</a></li>
</ul>
</div>
</form>
</div>
<!-- 用户注册、登陆-->
<div class="col-md-3 col-sm-12 text-right">
<ul class="nav-icons">
{% if UserInfo %}
<li>
<a href="#"><i class="ion-person"></i>
<div>{{ UserInfo.nick_name }}</div>
</li>
<li>
<a href="{% url 'UserLogout' %}"><i class="ion-person"></i>
<div>登出</div>
</a>
</li>
{% else %}
<li>
<a href="#"><i class="ion-person"></i>
<div>游客状态</div>
</li>
<li>
<a href="{% url 'UserRegister' %}"><i class="ion-person-add"></i>
<div>注册</div>
</a>
</li>
<li>
<a href="{% url 'UserLogin' %}"><i class="ion-person"></i>
<div>登陆</div>
</a>
</li>
{% endif %}
</ul>
</div>
</div>
</div>
</div>
<!-- 第二部分-->
<nav class="menu">
<div class="container">
<div class="mobile-toggle">
<a href="#" data-toggle="menu" data-target="#menu-list"><i class="ion-navicon-round"></i></a>
</div>
<div class="mobile-toggle">
<a href="#" data-toggle="sidebar" data-target="#sidebar"><i class="ion-ios-arrow-left"></i></a>
</div>
<div id="menu-list">
<ul class="nav-list">
<li><a href="{% url 'HomePage' %}">网站首页</a></li>
<li><a href="{% url 'MyHome' %}" target="_blank">站长介绍</a></li>
<!-- 章的全部类别-->
{% for Category in ArticleCategoryList %}
<li class="dropdown magz-dropdown magz-dropdown-megamenu">
<a href="">{{ Category.category_name }}<i class="ion-ios-arrow-right"></i></a>
<div class="dropdown-menu megamenu">
<div class="megamenu-inner">
<div class="row">
<div class="col-md-4">
<ul class="vertical-menu">
{% for Item in ArticleItemUrlList %}
{% if Category.category_name == Item.category_name %}
<li>
<a href="{% url 'GetArticleChannelInfo' %}?article_category={{ Item.category_name }}&article_item={{ Item.item_name }}">
{{ Item.item_name }}
</a>
</li>
{% endif %}
{% endfor %}
</ul>
</div>
</div>
</div>
</div>
</li>
{% endfor %}
</ul>
</div>
</div>
</nav>
</header>
<!--中间插入部分-->
{% block home_data %}
<script type="text/javascript">
var url_link =
{% url "UserSubscription" %} {#订阅邮件方法#}
</script>
{% endblock %}
{% block user_data %}
<script type="text/javascript">
var url_link =
{% url "UserSubscription" %} {#订阅邮件方法#}
var addfav_link =
{% url "AddFav" %} {#收藏的方法#}
var article_slug =
{{ ArticleInfo.article_slug }}
</script>
{% endblock %}
<!-- 第三部分-->
<section class="best-of-the-week">
<!-- 滚动推荐 部分-->
<div class="container">
<h1>
<div class="text">滚动推荐</div>
<div class="carousel-nav" id="best-of-the-week-nav">
<div class="prev">
<i class="ion-ios-arrow-left"></i>
</div>
<div class="next">
<i class="ion-ios-arrow-right"></i>
</div>
</div>
</h1>
<div class="owl-carousel owl-theme carousel-1">
{% for data in ArticleInfoHomeListUrlList %}
{% if data.home_id == "6" %}
<article class="article">
<div class="inner">
<figure>
<a href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
{% if data.article_cover_1|length > data.article_cover_2|length %}
<figure>
<img src="{{ data.article_cover_1 }}" alt="">
</figure>
{% else %}
<figure>
<img src="{{ data.article_cover_2 }}" alt="">
</figure>
{% endif %}
</a>
</figure>
<div class="padding">
<div class="detail">
<div class="time">{{ data.article_publish_date| slice:"10"}}</div>
<div class="category"><a href="#">{{ data.article_category }}</a></div>
</div>
<h2>
<a href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
{{ data.article_title }}
</a>
</h2>
<p>{{ data.article_summary | slice:"50"}}</p>
</div>
</div>
</article>
{% endif %}
{% endfor %}
</div>
</div>
</section>
<!-- 第四部分-->
<footer class="footer">
<div class="container">
<div class="row">
<div class="col-md-3 col-sm-6 col-xs-12">
<div class="block">
<h1 class="block-title">网站介绍</h1>
<div class="block-body">
<figure class="foot-logo">
<img src="{% static 'images/logo-light.png' %}" class="img-responsive" alt="Logo">
</figure>
<p class="brand-description">
数据系统前后端分离项目,通过Scrapy进行文章的抓取,使用NPL处理技术对文章进行初级编辑,由于都是自动化完成业务,没有编辑,有些内容排版可能不是很美观。
<br><br>
使用较为流行的Item推荐算法进行文章推荐。
<br><br>
文章内容均来自互联网,如有侵权请联系我会马上删除。
</p>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 col-xs-12">
<div class="block">
<h1 class="block-title">流行标签
<div class="right"><a href="">快速了解 <i class="ion-ios-arrow-thin-right"></i></a></div>
</h1>
<div class="block-body">
<ul class="tags">
{% for tag in ArticleTagUrlList %}
<li>
<a href="{{ tag.tag_name }}">
{{ tag.tag_name }}
</a>
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 col-xs-12">
<div class="block">
<h1 class="block-title">技术介绍</h1>
<div class="block-body">
<p class="brand-description">
Django的Web框架
<br><br>
Scrapy的数据采集框架
<br><br>
Gerapy分布式抓取框架
<br><br>
百度AI的NLP接口
</p>
</div>
</div>
</div>
<div class="col-md-3 col-xs-12 col-sm-6">
<div class="block">
<h1 class="block-title">关于我</h1>
<div class="block-body">
</div>
</div>
<div class="line"></div>
<a href="http://www.wjml.tech" class="btn btn-magz white">关于作者
<i class="ion-ios-arrow-thin-right"></i>
</a>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="copyright">
备案号:津ICP:18009366 备案时间:2018-12-03
</div>
</div>
</div>
</footer>
<!-- JS-->
<script src="{% static 'js/jquery.js' %}"></script>
<script src="{% static 'js/jquery.migrate.js' %}"></script>
<script src="{% static 'scripts/bootstrap/bootstrap.min.js' %}"></script>
<script>var $target_end = $(".best-of-the-week");</script>
<script src="{% static 'scripts/jquery-number/jquery.number.min.js' %}"></script>
<script src="{% static 'scripts/owlcarousel/dist/owl.carousel.min.js' %}"></script>
<script src="{% static 'scripts/magnific-popup/dist/jquery.magnific-popup.min.js' %}"></script>
<script src="{% static 'scripts/easescroll/jquery.easeScroll.js' %}"></script>
<script src="{% static 'scripts/sweetalert/dist/sweetalert.min.js' %}"></script>
<script src="{% static 'scripts/toast/jquery.toast.min.js' %}"></script>
<script src="{% static 'js/demo.js' %}"></script>
<script src="{% static 'js/e-magz.js' %}"></script>
<script src="{% static 'js/user_authorization.js' %}"></script>
<script src="{% static 'js/search.js' %}"></script>
</body>
</html>
代码解读
5.HomePage.html 主页继承部分
{% extends 'base.html' %}
{% load staticfiles %}
{% block home_data %}
<section class="home">
<div class="container">
<div class="row">
<div class="col-md-8 col-sm-12 col-xs-12">
<!-- 滚动轮播的位置-->
<div class="headline">
<div class="nav" id="headline-nav">
<a class="left carousel-control" role="button" data-slide="prev">
<span class="ion-ios-arrow-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" role="button" data-slide="next">
<span class="ion-ios-arrow-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
<div class="owl-carousel owl-theme" id="headline">
{% for data in ArticleInfoHomeListUrlList %}
{% if data.home_id == "7" %}
<div class="item">
<a href="#">
<div class="badge">最新</div>
{{ data.article_title }}</a>
</div>
{% endif %}
{% endfor %}
</div>
</div>
<!-- 首页大图 部分-->
<div class="owl-carousel owl-theme slide" id="featured">
{% for data in ArticleInfoHomeListUrlList %}
{% if data.home_id == "7" and data.module_top == "1" %}
<div class="item">
<article class="featured">
<div class="overlay"></div>
<a href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
{% if data.article_cover_1|length > data.article_cover_2|length %}
<figure>
<img src="{{ data.article_cover_1 }}" alt="">
</figure>
{% else %}
<figure>
<img src="{{ data.article_cover_2 }}" alt="">
</figure>
{% endif %}
</a>
<div class="details">
<div class="category"><a href="#">{{ data.article_category }}</a></div>
<h1>
<a href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
{{ data.article_title | slice:"50"}}
</a>
</h1>
<div class="time">
{{ data.article_publish_date| slice:"10"}}
</div>
</div>
</article>
</div>
{% endif %}
{% endfor %}
</div>
<!-- 最新内容 部分-->
<div class="line top">
<div>最新文章列表</div>
</div>
<div class="row">
{% for data in ArticleInfoHomeListUrlList %}
{% if data.home_id == "1" %}
<article class="col-md-12 article-list">
<div class="inner">
{% if data.integral_num == 0 %}
<div class="badge">
免费资料
</div>
{% else %}
<div class="badge">
积分:{{ data.integral_num }}
</div>
{% endif %}
<figure>
<a href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
{% if data.article_cover_1|length > data.article_cover_2|length %}
<figure>
<img src="{{ data.article_cover_1 }}" alt="">
</figure>
{% else %}
<figure>
<img src="{{ data.article_cover_2 }}" alt="">
</figure>
{% endif %}
</a>
</figure>
<div class="details">
<div class="detail">
<div class="category">
<a>{{ data.article_category }}</a>
</div>
<div class="time">
{{ data.article_publish_date| slice:"10"}}
</div>
</div>
<h1>
<a href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
{{ data.article_title }}
</a>
</h1>
<p>{{ data.article_summary | slice:"50" }}</p>
<footer>
<a class="btn btn-primary more"
href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
<div>详情</div>
<div><i class="ion-ios-arrow-thin-right"></i></div>
</a>
</footer>
<div>浏览量:{{ data.read_num }}次</div>
</div>
</div>
</article>
{% endif %}
{% endfor %}
</div>
<div class="line transparent little"></div>
<div class="row"></div>
</div>
<div class="col-xs-6 col-md-4 sidebar" id="sidebar">
<!-- 用户信息 部分-->
{% include 'users/UserInfo.html' %}
<!-- 热门文章 部分-->
<div class="aside-body">
<h1 class="title-col">热门文章
<div class="carousel-nav" id="hot-news-nav">
<div class="prev">
<i class="ion-ios-arrow-left"></i>
</div>
<div class="next">
<i class="ion-ios-arrow-right"></i>
</div>
</div>
</h1>
<div class="body-col vertical-slider" data-max="4" data-nav="#hot-news-nav"
data-item="article">
{% for data in ArticleInfoHomeListUrlList %}
{% if data.home_id == "2" %}
<article class="article-mini">
<div class="inner">
<figure>
<a href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
{% if data.article_cover_1|length > data.article_cover_2|length %}
<figure>
<img src="{{ data.article_cover_1 }}" alt="">
</figure>
{% else %}
<figure>
<img src="{{ data.article_cover_2 }}" alt="">
</figure>
{% endif %}
</a>
</figure>
<div class="padding">
<h1>
<a href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
{{ data.article_title }}
</a>
</h1>
<div class="detail">
<div class="category">
<a href="#">
{{ data.article_category }}
</a>
</div>
<div class="time">
{{ data.article_publish_date| slice:"10" }}
</div>
</div>
</div>
</div>
</article>
{% endif %}
{% endfor %}
</div>
</div>
<!-- 阅读排名、转发排名、收藏排名-->
<aside>
<ul class="nav nav-tabs nav-justified" role="tablist">
<li class="active">
<a href="#recomended" aria-controls="recomended" role="tab" data-toggle="tab">
<i class="icon ion-ios-book-outline">
阅读排名
</i>
</a>
</li>
<li>
<a href="#comments" aria-controls="comments" role="tab" data-toggle="tab">
<i class="icon ion-android-share-alt">
转发排名
</i>
</a>
</li>
<li>
<a href="#fav" aria-controls="comments" role="tab" data-toggle="tab">
<i class="icon ion-android-favorite-outline">
收藏排名
</i>
</a>
</li>
</ul>
<div class="tab-content">
<!-- 阅读排名列表部分-->
<div class="tab-pane active" id="recomended">
{% for data in ArticleInfoHomeListUrlList %}
{% if data.home_id == "3" and data.module_top == "1" %}
<article class="article-fw">
<div class="inner">
<figure>
<a href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
{% if data.article_cover_1|length > data.article_cover_2|length %}
<figure>
<img src="{{ data.article_cover_1 }}" alt="">
</figure>
{% else %}
<figure>
<img src="{{ data.article_cover_2 }}" alt="">
</figure>
{% endif %}
</a>
</figure>
<div class="details">
<div class="detail">
<div class="time">
{{ data.article_publish_date | slice:"10" }}
</div>
<div class="category">
<a href="#">
{{ data.article_category }}
</a>
</div>
</div>
<h1>
<a href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
{{ data.article_title }}
</a>
</h1>
<p>{{ data.article_summary | slice:"50"}}</p>
</div>
</div>
</article>
{% endif %}
{% endfor %}
<div class="line"></div>
{% for data in ArticleInfoHomeListUrlList %}
{% if data.home_id == "3" and data.module_top != "1" %}
<article class="article-mini">
<div class="inner">
<figure>
<a href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
{% if data.article_cover_1|length > data.article_cover_2|length %}
<figure>
<img src="{{ data.article_cover_1 }}" alt="">
</figure>
{% else %}
<figure>
<img src="{{ data.article_cover_2 }}" alt="">
</figure>
{% endif %}
</a>
</figure>
<div class="padding">
<h1>
<a href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
{{ data.article_title }}
</a>
</h1>
<div class="detail">
<div class="category">
<a href="#">
{{ data.article_category }}
</a>
</div>
<div class="time">
{{ data.article_publish_date| slice:"10"}}
</div>
</div>
</div>
</div>
</article>
{% endif %}
{% endfor %}
</div>
<!-- 转发排名列表部分-->
<div class="tab-pane comments" id="comments">
{% for data in ArticleInfoHomeListUrlList %}
{% if data.home_id == "4" and data.module_top == "1" %}
<article class="article-fw">
<div class="inner">
<figure>
<a href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
{% if data.article_cover_1|length > data.article_cover_2|length %}
<figure>
<img src="{{ data.article_cover_1 }}" alt="">
</figure>
{% else %}
<figure>
<img src="{{ data.article_cover_2 }}" alt="">
</figure>
{% endif %}
</a>
</figure>
<div class="details">
<div class="detail">
<div class="time">
{{ data.article_publish_date | slice:"10" }}
</div>
<div class="category">
<a href="#">
{{ data.article_category }}
</a>
</div>
</div>
<h1>
<a href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
{{ data.article_title }}
</a>
</h1>
<p>{{ data.article_summary | slice:"50"}}</p>
</div>
</div>
</article>
{% endif %}
{% endfor %}
<div class="line"></div>
{% for data in ArticleInfoHomeListUrlList %}
{% if data.home_id == "4" and data.module_top != "1" %}
<article class="article-mini">
<div class="inner">
<figure>
<a href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
{% if data.article_cover_1|length > data.article_cover_2|length %}
<figure>
<img src="{{ data.article_cover_1 }}" alt="">
</figure>
{% else %}
<figure>
<img src="{{ data.article_cover_2 }}" alt="">
</figure>
{% endif %}
</a>
</figure>
<div class="padding">
<h1>
<a href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
{{ data.article_title }}
</a>
</h1>
<div class="detail">
<div class="category">
<a href="#">
{{ data.article_category }}
</a>
</div>
<div class="time">
{{ data.article_publish_date | slice:"10"}}
</div>
</div>
</div>
</div>
</article>
{% endif %}
{% endfor %}
</div>
<!-- 收藏排名列表部分-->
<div class="tab-pane comments" id="fav">
{% for data in ArticleInfoHomeListUrlList %}
{% if data.home_id == "5" and data.module_top == "1" %}
<article class="article-fw">
<div class="inner">
<figure>
<a href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
{% if data.article_cover_1|length > data.article_cover_2|length %}
<figure>
<img src="{{ data.article_cover_1 }}" alt="">
</figure>
{% else %}
<figure>
<img src="{{ data.article_cover_2 }}" alt="">
</figure>
{% endif %}
</a>
</figure>
<div class="details">
<div class="detail">
<div class="time">
{{ data.article_publish_date | slice:"10" }}
</div>
<div class="category">
<a href="#">
{{ data.article_category }}
</a>
</div>
</div>
<h1>
<a href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
{{ data.article_title }}
</a>
</h1>
<p>{{ data.article_summary | slice:"50"}}</p>
</div>
</div>
</article>
{% endif %}
{% endfor %}
<div class="line"></div>
{% for data in ArticleInfoHomeListUrlList %}
{% if data.home_id == "5" and data.module_top != "1" %}
<article class="article-mini">
<div class="inner">
<figure>
<a href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
{% if data.article_cover_1|length > data.article_cover_2|length %}
<figure>
<img src="{{ data.article_cover_1 }}" alt="">
</figure>
{% else %}
<figure>
<img src="{{ data.article_cover_2 }}" alt="">
</figure>
{% endif %}
</a>
</figure>
<div class="padding">
<h1>
<a href="{% url 'GetArticleDetail' %}?article_slug={{ data.article_slug }}">
{{ data.article_title }}
</a>
</h1>
<div class="detail">
<div class="category">
<a href="#">
{{ data.article_category }}
</a>
</div>
<div class="time">
{{ data.article_publish_date | slice:"10"}}
</div>
</div>
</div>
</div>
</article>
{% endif %}
{% endfor %}
</div>
</div>
</aside>
<!-- 我的其他项目 部分-->
<aside id="sponsored">
<h1 class="aside-title">Mr数据杨的其他项目</h1>
<div class="aside-body">
<ul class="sponsored">
{% for data in MyProjectListUrlList %}
<li>
{{ data.project_name }}
<a href="{{ data.project_url }}">
<img src="{{ data.project_image }}" alt="我的其他项目">
</a>
</li>
{% endfor %}
</ul>
</div>
</aside>
<!-- 邮件订阅功能,暂时未实现-->
<div class="aside-body">
<form class="newsletter">
<div class="icon">
<i class="ion-ios-email-outline"></i>
<h1>订阅文章</h1>
</div>
<div class="input-group">
<input type="email" id="email" name="email" class="form-control email"
placeholder="输入你的邮箱">
<div class="input-group-btn">
<button class="btn btn-primary" onclick="SubscriptionEmail()"><i
class="ion-paper-airplane"></i></button>
</div>
</div>
<p>订阅后,您将在电子邮件中收到新文章</p>
<p>反复提交只会记录一次邮箱</p>
</form>
</div>
</div>
</div>
</div>
</section>
{% endblock %}
代码解读
全部评论 (0)
还没有任何评论哟~
