Improve submission search and UI

modules/submission.js

@@ -30,6 +30,22 @@ app.get('/submissions', async (req, res) => {
     if (user) where.user_id = user.id;
     else if (req.query.submitter) where.user_id = -1;
     if (req.query.problem_id) where.problem_id = parseInt(req.query.problem_id) || -1;
+
+    let minScore = parseInt(req.query.min_score);
+    if (isNaN(minScore)) minScore = 0;
+    let maxScore = parseInt(req.query.max_score);
+    if (isNaN(maxScore)) maxScore = 0;
+
+    where.score = {
+      $and: {
+        $gte: parseInt(minScore),
+        $lte: parseInt(maxScore)
+      }
+    };
+
+    if (req.query.language) where.language = req.query.language;
+    if (req.query.status) where.status = req.query.status;
+
     where.type = { $ne: 1 };
 
     let paginate = syzoj.utils.paginate(await JudgeState.count(where), req.query.page, syzoj.config.page.judge_state);
@@ -42,10 +58,7 @@ app.get('/submissions', async (req, res) => {
     res.render('submissions', {
       judge_state: judge_state,
       paginate: paginate,
-      form: {
+      form: req.query
-        submitter: req.query.submitter || '',
-        problem_id: req.query.problem_id || ''
-      }
     });
   } catch (e) {
     syzoj.log(e);

views/problems.ejs

@@ -6,7 +6,7 @@ if (typeof tags !== 'undefined') tagIDs = tags.map(x => x.id);
 %>
 <script src="//cdn.bootcss.com/js-cookie/2.1.4/js.cookie.min.js"></script>
 <div class="padding">
-  <div class="ui grid">
+  <div class="ui grid" style="margin-bottom: 10px; ">
     <div class="row">
       <div class="seven wide column">
         <% if (typeof tags !== 'undefined') { %>

views/ranklist.ejs

@@ -1,8 +1,8 @@
 <% this.title = '排名' %>
 <% include header %>
 <div class="padding">
-  <form action="<%= syzoj.utils.makeUrl(['find_user']) %>" class="ui mini form" method="get" role="form">
+  <form action="<%= syzoj.utils.makeUrl(['find_user']) %>" class="ui mini form" method="get" role="form" style="margin-bottom: 25px; text-align: right; ">
-    <div class="ui action left icon input inline" style="width: 180px; ">
+    <div class="ui action left icon input inline" style="width: 180px; margin-right: 77px; ">
       <i class="search icon"></i><input name="nickname" placeholder="用户名" type="text">
       <button class="ui mini button" type="submit">查找用户</button>
     </div>

views/submissions.ejs

@@ -1,20 +1,65 @@
 <% this.title = '评测记录' %>
 <% include header %>
+<% include util %>
 <div class="padding">
-  <div class="ui two column grid">
+  <form action="<%= syzoj.utils.makeUrl(['submissions']) %>" class="ui mini form" method="get" role="form" id="form">
-    <div class="twelve wide column">
+    <div class="inline fields" style="margin-bottom: 25px; ">
-      <form action="<%= syzoj.utils.makeUrl(['submissions']) %>" class="ui mini form" method="get" role="form">
+      <label style="font-size: 1.2em; margin-right: 3px; ">题目 ID：</label>
-        <div class="inline field">
+      <div class="field"><input name="problem_id" style="width: 50px; " type="text" value="<%= form.problem_id %>"></div>
-          <input name="submitter" placeholder="提交者" style="margin: 0px;" type="text" value="<%= form.submitter %>"> <input name="problem_id" placeholder="题目编号" type="text" value="<%= form.problem_id %>"> <button class="ui mini button" type="submit">搜索</button>
+      <label style="font-size: 1.2em; margin-right: 3px; ">提交者：</label>
+      <div class="field"><input name="submitter" style="width: 100px; " type="text" value="<%= form.submitter %>"></div>
+      <label style="font-size: 1.2em; margin-right: 3px; ">分数：</label>
+      <div class="field" style="padding-right: 6px; "><input name="min_score" style="width: 45px; " type="text" value="<%= form.min_score || 0 %>"></div>
+      <label style="font-size: 1.2em; margin-right: 7px; ">～</label>
+      <div class="field"><input name="max_score" style="width: 45px; " type="text" value="<%= form.max_score || 100 %>"></div>
+      <label style="font-size: 1.2em; margin-right: 3px; ">语言：</label>
+      <div class="field">
+        <div class="ui fluid selection dropdown" id="select_language" style="width: 110px; ">
+          <input type="hidden" name="language" value="<%= form.language %>">
+          <i class="dropdown icon"></i>
+          <div class="default text"></div>
+          <div class="menu">
+            <div class="item" data-value="">不限</div>
+            <% for (let lang in syzoj.config.languages) { %>
+              <div class="item" data-value="<%= lang %>"><%= syzoj.config.languages[lang].show %></div>
+            <% } %>
           </div>
-      </form>
         </div>
-    <% if (user) { %>
-    <div class="four wide column padding">
-      <a class="ui mini button right floated" href="<%= syzoj.utils.makeUrl(['submissions'], { submitter: user.username }) %>">我的提交</a>
       </div>
+      <label style="font-size: 1.2em; margin-right: 3px; ">状态：</label>
+      <div class="field">
+        <div class="ui fluid selection dropdown" id="select_status" style="width: 210px; ">
+          <input type="hidden" name="status" value="<%= form.status %>">
+          <i class="dropdown icon"></i>
+          <div class="default text"></div>
+          <div class="menu">
+            <div class="item" data-value="">不限<i class="dropdown icon" style="visibility: hidden; "></i></div>
+            <% for (let status in this.icon) { %>
+              <div class="item" data-value="<%= status %>"><span class="status <%= status.toLowerCase().split(' ').join('_') %>"><i class="<%= this.icon[status] %> icon"></i> <%= status %></div>
+            <% } %>
+          </div>
+        </div>
+      </div>
+      <button class="ui labeled icon mini button" type="submit">
+        <i class="search icon"></i>
+        搜索
+      </button>
+      <% if (user) { %>
+      <a class="ui mini labeled icon blue button" style="margin-left: auto; " id="my_submit">
+        <i class="user icon"></i>
+        我的提交
+      </a>
+      <script>
+      $(function () {
+        $('#my_submit').click(function () {
+          $('[name=submitter]').val(<%- JSON.stringify(user.username) %>);
+          $('#form').submit();
+        });
+      });
+      </script>
       <% } %>
-  </div><br>
+    </div>
+  </form>
   <table class="ui very basic center aligned table" style="white-space: nowrap; ">
     <thead>
       <tr>
@@ -38,4 +83,10 @@
   <br>
   <% include page %>
 </div>
+<script>
+$(function () {
+  $('#select_language').dropdown();
+  $('#select_status').dropdown();
+});
+</script>
 <% include footer %>