ui: submission status

packages/ui-default/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hydrooj/ui-default",
-  "version": "4.8.16",
+  "version": "4.8.17",
   "author": "undefined <i@undefined.moe>",
   "license": "AGPL-3.0",
   "main": "hydro.js",

packages/ui-default/pages/problem_detail.page.jsx

@@ -1,4 +1,5 @@
 import yaml from 'js-yaml';
+import * as echarts from 'echarts';
 import { NamedPage } from 'vj/misc/Page';
 import Navigation from 'vj/components/navigation';
 import Notification from 'vj/components/notification/index';
@@ -105,7 +106,7 @@ class ProblemPageExtender {
   }
 }
 
-const page = new NamedPage(['problem_detail', 'contest_detail_problem', 'homework_detail_problem'], () => {
+const page = new NamedPage(['problem_detail', 'contest_detail_problem', 'homework_detail_problem'], async (pagename) => {
   let reactLoaded = false;
   let renderReact = null;
   let unmountReact = null;
@@ -247,6 +248,32 @@ const page = new NamedPage(['problem_detail', 'contest_detail_problem', 'homewor
   });
   $('[name="problem-sidebar__send-to"]').on('click', handleClickCopyProblem);
   loadSubjective();
+
+  if (pagename === 'contest_detail_problem') return;
+  const data = await request.get('');
+  const $dom = document.getElementById('submission-detail-placeholder');
+  const chart = echarts.init($dom);
+  chart.setOption({
+    tooltip: { trigger: 'item' },
+    series: [
+      {
+        name: 'Submissions',
+        type: 'pie',
+        radius: [10, 70],
+        roseType: 'radius',
+        data: [
+          { value: data.pdoc.stats?.TLE, name: 'TLE' },
+          { value: data.pdoc.stats?.AC, name: 'AC' },
+          { value: data.pdoc.stats?.MLE, name: 'MLE' },
+          { value: data.pdoc.stats?.WA, name: 'WA' },
+          { value: data.pdoc.stats?.RE, name: 'RE' },
+          { value: data.pdoc.stats?.CE, name: 'CE' },
+          { value: data.pdoc.stats?.SE, name: 'SE' },
+          { value: data.pdoc.stats?.IGN, name: 'IGN' },
+        ],
+      },
+    ],
+  });
 });
 
 export default page;

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

@@ -105,13 +105,20 @@
     </ol>
   </div>
 </div>
-{% if pagename != 'problem_detail' %}
+{% if page_name != 'problem_detail' %}
 <div class="section side">
   <div class="section__header">
     <h1 class="section__title">{{ _('Information') }}</h1>
   </div>
   {% include "partials/problem-sidebar-information.html" %}
 </div>
+{% else %}
+<div class="section side nojs-hide">
+  <div class="section__header">
+    <h1 class="section__title">{{ _('Statistics') }}</h1>
+  </div>
+  <div id="submission-detail-placeholder" style="width: 100%; height:230px"></div>
+</div>
 {% endif %}
 {% if page_name == 'problem_detail' and (tdocs or ctdocs) %}
 <div class="section side">