224 lines
11 KiB
HTML
224 lines
11 KiB
HTML
|
{% extends "main_base.html" %}
|
||
|
|
{% import "_macros.html" as macros %}
|
||
|
|
{% block title%}FAQS|COVID-19 Detector{% endblock %}
|
||
|
|
{% block mycontent%}
|
||
|
|
<section class="mypage-header">
|
||
|
|
</section><!-- /.page-header -->
|
||
|
|
<section class="faq-one faq-one__faq-page" id="square">
|
||
|
|
<a href="{{ url_for('faqs.post', username=current_user.username) }}" class="floating-button">
|
||
|
|
<img src="{{ url_for('static', filename='images/icon/post.png')}}" alt="Edit" />
|
||
|
|
</a>
|
||
|
|
{% if pagination.page == 1 %}
|
||
|
|
<div class="container">
|
||
|
|
<div class="block-title text-center" style="margin-top: 50px;">
|
||
|
|
<h3>是否有这些疑问？</h3>
|
||
|
|
</div><!-- /.block-title -->
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-lg-6">
|
||
|
|
<div class="accrodion-grp" data-grp-name="faq-one-accrodion">
|
||
|
|
{% for i in range(4) %}
|
||
|
|
<div class="accrodion">
|
||
|
|
<div class="accrodion-title">
|
||
|
|
<h4>{{head_1[i]}}</h4>
|
||
|
|
</div>
|
||
|
|
<div class="accrodion-content">
|
||
|
|
<div class="inner">
|
||
|
|
<p>{{content_1[i]}} </p>
|
||
|
|
</div><!-- /.inner -->
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
{%endfor%}
|
||
|
|
</div>
|
||
|
|
</div><!-- /.col-lg-6 -->
|
||
|
|
<div class="col-lg-6">
|
||
|
|
<div class="accrodion-grp" data-grp-name="faq-two-accrodion">
|
||
|
|
{% for i in range(4) %}
|
||
|
|
<div class="accrodion">
|
||
|
|
<div class="accrodion-title">
|
||
|
|
<h4>{{head_2[i]}}</h4>
|
||
|
|
</div>
|
||
|
|
<div class="accrodion-content">
|
||
|
|
<div class="inner">
|
||
|
|
<p>{{content_2[i]}} </p>
|
||
|
|
</div><!-- /.inner -->
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
{%endfor%}
|
||
|
|
</div>
|
||
|
|
</div><!-- /.col-lg-6 -->
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
{% else %}
|
||
|
|
{% endif %}
|
||
|
|
</section>
|
||
|
|
<div class="row">
|
||
|
|
<div class="container">
|
||
|
|
{% if pagination.page == 1 %}
|
||
|
|
<div class="block-title text-center" style="margin-top: 30px;">
|
||
|
|
<h3>仍然有疑问？</h3>
|
||
|
|
</div><!-- /.block-title -->
|
||
|
|
{% else %}
|
||
|
|
<div style="height: 100px;"></div>
|
||
|
|
{% endif %}
|
||
|
|
{% for post in posts %}
|
||
|
|
<hr>
|
||
|
|
<div class="post">
|
||
|
|
<div class="row align-items-center">
|
||
|
|
<div class="col-1">
|
||
|
|
{% if post.author.has_avatar %}
|
||
|
|
<img src="{{ url_for('static', filename='images/avatar/' ~ post.author.username ~ '.jpg')}}"
|
||
|
|
alt="头像" class="img-fluid rounded-circle" style="width:75px; height:75px;">
|
||
|
|
{% else %}
|
||
|
|
<div class="postavatar {{ post.author.avatar_color }}">
|
||
|
|
<span id="initial" style="z-index: 1;">{{ post.author.username[0] }}</span>
|
||
|
|
</div>
|
||
|
|
{% endif %}
|
||
|
|
</div>
|
||
|
|
{%if post.author.role_id==2%}
|
||
|
|
<div class="col-7">
|
||
|
|
<h5
|
||
|
|
style="position:relative; top:12px;font-size:20px;font-weight: bold;">
|
||
|
|
{{ post.author.username }}</h5>
|
||
|
|
</div>
|
||
|
|
{%else%}
|
||
|
|
<div class="col-7">
|
||
|
|
<div style="height: 40px; position: relative;">
|
||
|
|
<h5 style="position: absolute; top: 0; left: 0; right: 0; bottom: 50%;
|
||
|
|
margin: auto; font-size: 20px;font-weight: bold;">{{ post.author.name }}</h5>
|
||
|
|
<h5 style="position: absolute; top: 50%; left: 0; right: 0; bottom: 0;
|
||
|
|
margin-top: 10px; font-size: 20px;">{{ post.author.location
|
||
|
|
}} {{post.author.department}}</h5>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
{%endif%}
|
||
|
|
<div class="col-4 text-right" style="font-family: 'Times New Roman';">
|
||
|
|
<p>发布时间: {{ moment(post.timestamp).format('LLL') }}</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
{%set url=url_for('auth.pleaselogin')%}
|
||
|
|
{%if current_user.is_authenticated %}
|
||
|
|
{%set url=url_for('faqs.article',id=post.id)%}
|
||
|
|
{%endif%}
|
||
|
|
<a href="{{url}}">
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col">
|
||
|
|
<h4
|
||
|
|
style="position:relative; top:12px;font-size:25px;font-weight: bold; margin-bottom: 20px;">
|
||
|
|
{{ post.title }}</h4>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="row">
|
||
|
|
<div class="col">
|
||
|
|
<p style="-webkit-line-clamp: 2; /* for Safari, iOS Safari */
|
||
|
|
-webkit-box-orient: vertical;
|
||
|
|
display: -webkit-box;
|
||
|
|
overflow: hidden;
|
||
|
|
text-overflow: ellipsis;">{{ post.content }}</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</a>
|
||
|
|
<div class="row">
|
||
|
|
{% for i in range(1,post.img_count+1) %}
|
||
|
|
<div class="col-md-4">
|
||
|
|
<img src="{{ url_for('static', filename='images/post/' ~post.id~ '/' ~i~ '.jpg')}}"
|
||
|
|
class="img-fluid" style="max-height: 300px;" data-toggle="modal"
|
||
|
|
data-target="#myModal{{post.id}}a{{ i }}">
|
||
|
|
</div>
|
||
|
|
{% endfor %}
|
||
|
|
</div>
|
||
|
|
{% for i in range(1,post.img_count+1) %}
|
||
|
|
<div class="modal fade" id="myModal{{post.id}}a{{ i }}" tabindex="-1" role="dialog"
|
||
|
|
aria-labelledby="myModalLabel">
|
||
|
|
<div class="modal-dialog modal-dialog-centered" role="document">
|
||
|
|
<div class="modal-content">
|
||
|
|
<div class="modal-body text-center p-0"
|
||
|
|
style="display: flex; justify-content: center; align-items: center;">
|
||
|
|
<img src="{{ url_for('static', filename='images/post/' ~post.id~ '/' ~i~ '.jpg')}}"
|
||
|
|
class="img-fluid"
|
||
|
|
style="max-height: 70vh; max-width: 70vw; object-fit: contain !important;">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
{% endfor %}
|
||
|
|
<div class="row">
|
||
|
|
<div class="col text-left">
|
||
|
|
<div class="btn-group" role="group" aria-label="Collect Button">
|
||
|
|
{% set has_collected = 0 %}
|
||
|
|
{% if current_user.is_authenticated %}
|
||
|
|
{% set has_collected = Collect.query.filter_by(user_id=current_user.id, post_id=post.id).first()
|
||
|
|
%}
|
||
|
|
<button class="faqbtn btn-sm btn-primary{% if has_collected %} active{% endif %}"
|
||
|
|
style="background-color:#4da6ff;" id="collect1-{{ post.id }}"
|
||
|
|
onclick="collect1('{{ post.id }}')">
|
||
|
|
{% if has_collected %}
|
||
|
|
<i class="fas fa-bookmark" style="margin-right: 10px;color: orange;"></i>
|
||
|
|
{% else %}
|
||
|
|
<i class="fas fa-bookmark" style="margin-right: 10px;"></i>
|
||
|
|
{% endif %}
|
||
|
|
{{ post.collect_num }} 个收藏
|
||
|
|
</button>
|
||
|
|
{% else %}
|
||
|
|
<button class="faqbtn btn-sm btn-primary" style="background-color:#4da6ff;" disabled>
|
||
|
|
<i class="fas fa-bookmark" style="margin-right: 10px;"></i>
|
||
|
|
{{ post.collect_num }} 个收藏
|
||
|
|
</button>
|
||
|
|
{% endif %}
|
||
|
|
</div>
|
||
|
|
{% if current_user.is_authenticated %}
|
||
|
|
<a href="{{ url_for('faqs.article', id=post.id) }}#comments">
|
||
|
|
<div class="btn-group" role="group" aria-label="Comment Button">
|
||
|
|
<button class="faqbtn btn-sm btn-primary" id="comment-btn-{{ post.id }}"
|
||
|
|
style="background-color:#4da6ff;">
|
||
|
|
<i class=" fas fa-comment" style="margin-right: 10px;"></i> {{ post.comment_num }} 条评论
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
</a>
|
||
|
|
{% else %}
|
||
|
|
<div class="btn-group" role="group" aria-label="Comment Button">
|
||
|
|
<button class="faqbtn btn-sm btn-primary disabled" style="background-color:#4da6ff;">
|
||
|
|
<i class=" fas fa-comment" style="margin-right: 10px;"></i> {{ post.comment_num }} 条评论
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
{% endif %}
|
||
|
|
|
||
|
|
<div class="btn-group" role="group" aria-label="Like Button">
|
||
|
|
{% set has_liked = 0 %}
|
||
|
|
{% if current_user.is_authenticated %}
|
||
|
|
{% set has_liked= Like.query.filter_by(user_id=current_user.id, post_id=post.id).first() %}
|
||
|
|
<button class="faqbtn btn-sm btn-primary{% if has_liked %} active{% endif %}"
|
||
|
|
style="background-color:#4da6ff;" id="like1-{{ post.id }}" onclick="like1('{{ post.id }}')">
|
||
|
|
{% if has_liked %}
|
||
|
|
<i class="fas fa-heart" style="margin-right: 10px; color:red;"></i>
|
||
|
|
{% else %}
|
||
|
|
<i class="fas fa-heart" style="margin-right: 10px;"></i>
|
||
|
|
{% endif %}
|
||
|
|
{{ post.like_num }} 个赞同
|
||
|
|
</button>
|
||
|
|
{% else %}
|
||
|
|
<button class="faqbtn btn-sm btn-primary" style="background-color:#4da6ff;" disabled>
|
||
|
|
<i class="fas fa-heart" style="margin-right: 10px;"></i>
|
||
|
|
{{ post.like_num }} 个赞同
|
||
|
|
</button>
|
||
|
|
{% endif %}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
{% endfor %}
|
||
|
|
<div class="pagination" style="margin-top: 20px;">
|
||
|
|
{{macros.pagination_widget(pagination,'.faqs')}}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
$(document).ready(function () {
|
||
|
|
$('.img-fluid').click(function () {
|
||
|
|
$($(this).data("target")).modal("show");
|
||
|
|
});
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
{% endblock %}
|