ui: add hint

packages/ui-default/components/hint.ts

@@ -0,0 +1,19 @@
+import { InfoDialog } from 'vj/components/dialog';
+import i18n from 'vj/utils/i18n';
+import tpl from 'vj/utils/tpl';
+
+export default function createHint(message: string, element?: any) {
+  if (i18n(message) === message || !element) return;
+  const a = document.createElement('a');
+  a.setAttribute('href', 'javascript:;');
+  const span = document.createElement('span');
+  span.setAttribute('class', 'icon icon-help');
+  a.appendChild(span);
+  a.onclick = () => {
+    new InfoDialog({
+      cancelByClickingBack: false,
+      $body: tpl.typoMsg(i18n(message)),
+    }).open();
+  };
+  $(element).append(a);
+}

packages/ui-default/components/problem/create.page.js

@@ -7,10 +7,7 @@ export default new NamedPage(['problem_create', 'problem_edit', 'problem_import_
   $('input[name="pid"]').on('blur', () => {
     if (/^[0-9]+$/.test($('input[name="pid"]').val())) {
       new InfoDialog({
-        $body: tpl`
-          <div class="typo">
-            <p>${i18n('Problem ID cannot be a pure number. Leave blank if you want to use numberic id.')}</p>
-          </div>`,
+        $body: tpl.typoMsg(i18n('Problem ID cannot be a pure number. Leave blank if you want to use numberic id.')),
       }).open();
     }
   });