ui: fix tag

packages/ui-default/components/problem/tag.page.styl

@@ -11,6 +11,12 @@
   margin: rem(0 2px 2px 0) !important
   padding: 0 !important
 
+.problem__tag-item
+  padding: rem(0px)
+  margin-left: rem(3px)
+  &:hover
+    text-decoration: none
+
 .problem__tag-link
   display: inline-block
   padding: rem(0 7px)

packages/ui-default/package.json

@@ -24,6 +24,7 @@
     "@babel/runtime-corejs3": "^7.14.0",
     "@blueprintjs/core": "^3.44.2",
     "@blueprintjs/icons": "^3.26.0",
+    "@blueprintjs/select": "^3.16.2",
     "@hydrooj/utils": "^1.0.15",
     "@undefined-moe/monaco-yaml": "^2.5.0",
     "ansi_up": "^5.0.1",

packages/ui-default/pages/record_main.page.js

@@ -1,5 +1,6 @@
 import { NamedPage } from 'vj/misc/Page';
 import UserSelectAutoComplete from 'vj/components/autocomplete/UserSelectAutoComplete';
+import ProblemSelectAutoComplete from 'vj/components/autocomplete/ProblemSelectAutoComplete';
 
 const page = new NamedPage('record_main', async () => {
   const { default: SockJs } = await import('../components/socket');
@@ -24,7 +25,10 @@ const page = new NamedPage('record_main', async () => {
       $newTr.trigger('vjContentNew');
     }
   };
-  UserSelectAutoComplete.getOrConstruct($('.filter-user [name="uidOrName"]'), {
+  UserSelectAutoComplete.getOrConstruct($('[name="uidOrName"]'), {
+    clearDefaultValue: false,
+  });
+  ProblemSelectAutoComplete.getOrConstruct($('[name="pid"]'), {
     clearDefaultValue: false,
   });
 });

packages/ui-default/templates/layout/basic.html

@@ -1,9 +1,7 @@
 {% set layout_name = "basic" %}
 {% extends "layout/html5.html" %}
 {% block body %}
-
 {% include "partials/nav.html" %}
-
 <div class="slideout-panel" id="panel">
   <div class="slideout-overlay"></div>
   {% include "partials/header_mobile.html" %}
@@ -13,7 +11,5 @@
   </div>
   {% include "partials/footer.html" %}
 </div>
-
 {% include "partials/login_dialog.html" %}
-
 {% endblock %}

packages/ui-default/templates/partials/problem_sidebar_normal.html

@@ -105,13 +105,14 @@
     </ol>
   </div>
 </div>
-
+{% if pagename != 'problem_detail' %}
 <div class="section side">
   <div class="section__header">
     <h1 class="section__title">{{ _('Information') }}</h1>
   </div>
   {% include "partials/problem-sidebar-information.html" %}
 </div>
+{% endif %}
 {% if page_name == 'problem_detail' and (tdocs or ctdocs) %}
 <div class="section side">
   <div class="section__header">

packages/ui-default/templates/problem_detail.html

@@ -39,12 +39,13 @@
       </div>
       <div class="section__body">
         <ul class="problem__tags">
-          <li class="problem__tag"><p class="problem__tag-link">{{ _('Time') }}: {{ pdoc.config.timeMax if pdoc.config.timeMax == pdoc.config.timeMin else pdoc.config.timeMin+'~'+pdoc.config.timeMax }}ms</p></li>
-          <li class="problem__tag"><p class="problem__tag-link">{{ _('Memory') }}: {{ pdoc.config.memoryMax if pdoc.config.memoryMax == pdoc.config.memoryMin else pdoc.config.memoryMin+'~'+pdoc.config.memoryMax }}MiB</p></li>
-          <li class="problem__tag"><p class="problem__tag-link">{{ _('Accepted') }}: {{ pdoc.nAccept }}</p></li>
-          <li class="problem__tag"><p class="problem__tag-link">{{ _('Accepted Ratio') }}: {% if pdoc.nSubmit > 0 %}{{ (100 * pdoc.nAccept / pdoc.nSubmit)|round|int }}%{% else %}{{ _('?') }}{% endif %}</p></li>
-          <li class="problem__tag"><p class="problem__tag-link">{{ _('Difficulty') }}: {{ pdoc['difficulty'] or _('(None)') }}</p></li>
-          <li class="problem__tag"><p class="problem__tag-link">{{ _('Uploaded By') }}: {{ user.render_inline(owner_udoc, badge=false) }}</p></li>
+          <span class="bp3-tag bp3-large bp3-minimal problem__tag-item">{{ _('Time') }}: {{ pdoc.config.timeMax if pdoc.config.timeMax == pdoc.config.timeMin else pdoc.config.timeMin+'~'+pdoc.config.timeMax }}ms</span>
+          <span class="bp3-tag bp3-large bp3-minimal problem__tag-item">{{ _('Memory') }}: {{ pdoc.config.memoryMax if pdoc.config.memoryMax == pdoc.config.memoryMin else pdoc.config.memoryMin+'~'+pdoc.config.memoryMax }}MiB</span>
+          <a class="bp3-tag bp3-large bp3-minimal bp3-interactive problem__tag-item" href="{{ url('record_main', query={pid:pdoc.docId}) }}">{{ _('Submitted') }}: {{ pdoc.nSubmit }}</a>
+          <a class="bp3-tag bp3-large bp3-minimal bp3-interactive problem__tag-item" href="{{ url('record_main', query={pid:pdoc.docId, status:1}) }}">{{ _('Accepted') }}: {{ pdoc.nAccept }}</a>
+          <span class="bp3-tag bp3-large bp3-minimal problem__tag-item">{{ _('Accepted Ratio') }}: {% if pdoc.nSubmit > 0 %}{{ (100 * pdoc.nAccept / pdoc.nSubmit)|round|int }}%{% else %}{{ _('?') }}{% endif %}</span>
+          <span class="bp3-tag bp3-large bp3-minimal problem__tag-item">{{ _('Difficulty') }}: {{ pdoc['difficulty'] or _('(None)') }}</span>
+          <span class="bp3-tag bp3-large bp3-minimal bp3-interactive problem__tag-item">{{ _('Uploaded By') }}: {{ user.render_inline(udoc, badge=false) }}</span>
         </ul>
       </div>
     </div>