feat: better UI, prepare for download count

app.py

@@ -46,8 +46,11 @@ def list():
     teacher = request.args.get('teacher')
     year = request.args.get('year')
     year = year and year.isdigit() and int(year)
-    has_year = year or year == 0
-    ept = not (course or teacher or has_year)
+
+    has_course = course is not None
+    has_teacher = teacher is not None
+    has_year = year is not None
+    ept = not (has_course or has_teacher or has_year)
 
     ps = Paper.query
 
@@ -55,7 +58,7 @@ def list():
         ps = ps.filter_by(course=course)
     if teacher:
         ps = ps.filter_by(teacher=teacher)
-    if has_year:
+    if year or year==0:
         ps = ps.filter_by(year=year)
 
     ps = ps.order_by(db.desc('like_num'))

templates/list.html

@@ -115,10 +115,6 @@
       border-color: #495057;
     }
 
-    .qbox .inner {
-      margin: 15px 0 20px 15px;
-    }
-
     .like {
       fill: #fff;
     }
@@ -215,7 +211,7 @@
             <input type="checkbox" class="custom-control-input" id="anon" name="anon">
             <label class="custom-control-label" for="anon">匿名发布</label>
           </div>
-          <p> 勾选匿名发布后，其他人在查看时作者会显示为“匿名”。 </p>
+          <p> 开启匿名发布后，其他人在查看时作者会显示为“匿名”。 </p>
           <button type="submit" class="btn btn-link btn-lg mt-4 pr-1">提交</button>
           <span>
 				    <a href="##" role="button"data-toggle="popover" >
@@ -228,7 +224,7 @@
 
     <div class="part2" id="part2">
 
-      <div id="accordion" class="mb-4">
+      <div id="accordion">
         <div class="card">
           <div class="card-header" id="headingOne">
             <h5 class="mb-0">
@@ -238,7 +234,7 @@
             </h5>
           </div>
 
-          <div id="collapseOne" class="collapse {{'show' if course or ept else ''}}" data-parent="#accordion">
+          <div id="collapseOne" class="collapse {{'show' if has_course or ept else ''}}" data-parent="#accordion">
             <div class="card-body">
               {% for c in all_courses %}
               <span class="cate {{'selected' if c==course else ''}}"><a href="?course={{'' if c==course else c}}#part2">{{c}}</a></span>
@@ -254,7 +250,7 @@
               </button>
             </h5>
           </div>
-          <div id="collapseTwo" class="collapse {{'show' if teacher else ''}}" data-parent="#accordion">
+          <div id="collapseTwo" class="collapse {{'show' if has_teacher else ''}}" data-parent="#accordion">
             <div class="card-body">
               {% for t in all_teachers %}
               <span class="cate {{'selected' if t==teacher else ''}}"><a href="?teacher={{'' if t==teacher else t}}#part2">{{t}}</a></span>
@@ -271,14 +267,17 @@
             </h5>
           </div>
           <div id="collapseThree" class="collapse {{'show' if has_year else ''}}" data-parent="#accordion">
-      <div class="card-body">
-        {% for y in all_years %}
-        <span class="cate {{'selected' if y==year else ''}}"><a href="?year={{'' if y==year else y}}#part2">{{y or '/'}}</a></span>
-        {% endfor %}
+            <div class="card-body">
+              {% for y in all_years %}
+              <span class="cate {{'selected' if y==year else ''}}"><a href="?year={{'' if y==year else y}}#part2">{{y or '/'}}</a></span>
+              {% endfor %}
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="ml-2 mt-2 mb-4">
+        <p>点击某一课程/教师/年份进行筛选</p>
       </div>
-    </div>
-  </div>
-</div>
 
 
       {% for p in pagination.items %}
@@ -291,26 +290,18 @@
           </button>
         </form>
         {% endif %}
-        <p class="inner">
-          {{p.course}} - {{p.teacher}} - {{p.year or '/'}}
-          <small class="ml-4"><a href="{{ipfs_base_url}}/{{p.file_hash}}" target="_blank">查看</a></small>
+        <h5>{{p.course}}</h5>
+        <p class="ml-3">
+          {{p.teacher}} - {{p.year or '/'}}
         </p>
-        <p class="inner">{{p.notes}}</p>
-        <div style="text-align:right;margin: 27px 0 -5px">
+        <pre class="ml-3">{{p.notes}}</pre>
+        <div class="text-right">
           <small>@{{'匿名用户' if p.anon else p.author}} | {{p.create_date}}</small>
-          <a href="##" class="btn btn-link" id="like-{{p.id}}" onClick="like('{{p.id}}')" style="text-decoration: none;">
-            <svg viewBox="-20 0 552 512" height="16" class="{{'like'}}">
-              <path stroke="#000" stroke-width="30" d="M474.644,74.27C449.391,45.616,414.358,29.836,376,29.836c-53.948,0-88.103,32.22-107.255,59.25
-                            c-4.969,7.014-9.196,14.047-12.745,20.665c-3.549-6.618-7.775-13.651-12.745-20.665c-19.152-27.03-53.307-59.25-107.255-59.25
-                            c-38.358,0-73.391,15.781-98.645,44.435C13.267,101.605,0,138.213,0,177.351c0,42.603,16.633,82.228,52.345,124.7
-                            c31.917,37.96,77.834,77.088,131.005,122.397c19.813,16.884,40.302,34.344,62.115,53.429l0.655,0.574
-                            c2.828,2.476,6.354,3.713,9.88,3.713s7.052-1.238,9.88-3.713l0.655-0.574c21.813-19.085,42.302-36.544,62.118-53.431
-                            c53.168-45.306,99.085-84.434,131.002-122.395C495.367,259.578,512,219.954,512,177.351
-                            C512,138.213,498.733,101.605,474.644,74.27z" />
-            </svg>
-            <span>
-              {{p.like_num}}
-            </span>
+          <a href="##" class="btn btn-link" id="like-{{p.id}}" onClick="like('{{p.id}}')">
+            <span>有用({{p.like_num}})</span>
+          </a>
+          <a href="{{p.id}}/download" target="_blank" class="btn btn-link pl-0" id="like-{{p.id}}" onClick="like('{{p.id}}')">
+            <span>下载({{p.like_num}})</span>
           </a>
         </div>
       </div>
@@ -351,7 +342,7 @@
 
 <script>
   function like(toot) {
-    if ($(`#like-${toot} svg`).hasClass("liked")) {
+    if ($(`#like-${toot}`).hasClass("liked")) {
       alert('赞都赞了，别撤回嘛');
       return;
     }