Add theme-mdui.

2026-02-06 05:30:05 +00:00 · 2022-01-08 23:54:24 +08:00
parent 87ba69ff8b
commit 9d9a3b093f
9 changed files with 580 additions and 1 deletions
--- a/resource/template/theme-mdui/viewpassword.html
+++ b/resource/template/theme-mdui/viewpassword.html
@@ -0,0 +1,88 @@
+{{define "theme-mdui/viewpassword"}}
+<!doctype html>
+<html lang="zh-CN">
+
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1"/>
+  <title>{{.Title}}</title>
+
+  <!-- MDUI CSS -->
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/mdui@1.0.2/dist/css/mdui.min.css"/>
+  <link rel="stylesheet" href="/static/theme-mdui/mdui.css" type="text/css">
+  {{if ts .CustomCode}}
+  {{.CustomCode|safe}}
+  {{end}}
+</head>
+
+<body>
+  <div class="mdui-container" id="container">
+  </div>
+
+  <script src="https://cdn.jsdelivr.net/npm/mdui@1.0.2/dist/js/mdui.min.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/jquery@3.4.1/dist/jquery.min.js"></script>
+  <script>
+    var content = '<div class="mdui-textfield">' +
+      '<i class="mdui-icon material-icons">lock</i>' +
+      '<label class="mdui-textfield-label">密码</label>' +
+      '<input class="mdui-textfield-input" type="password">' +
+      '</div>';
+
+    var onConfirm = async function(pwd) {
+      const res = await fetch("/view-password", {
+        method: 'POST',
+        headers: {'Content-Type': 'application/json'},
+        redirect: 'follow',
+        body: JSON.stringify({ Password: pwd }),
+      });
+      if (res.ok) {
+        if (res.redirected) {
+          window.location.href = res.url;
+        } else {
+          mdui.snackbar({
+           message: '密码错误',
+           position: 'top',
+         });
+          mdui.mutation();
+        }
+      }
+    };
+
+    var onConfirmClick = function (dialog) {
+      var value = dialog.$element.find('.mdui-textfield-input').val();
+      onConfirm(value, dialog);
+    };
+
+    var checkPwd = mdui.dialog({
+      title: '验证查看密码',
+      content: content,
+      buttons: [
+        {
+          text: '验证',
+          bold: false,
+          onClick: onConfirmClick,
+        }
+      ],
+      cssClass: 'mdui-dialog-prompt',
+      modal: true,
+      onOpen: function (dialog) {
+        var $input = dialog.$element.find('.mdui-textfield-input');
+        mdui.updateTextFields($input);
+        $input[0].focus();
+        $input.on('keydown', function (event) {
+          if (event.keyCode === 13) {
+            var value = dialog.$element.find('.mdui-textfield-input').val();
+            onConfirm(value, dialog);
+            return false;
+          }
+          return;
+        });
+      },
+    });
+
+    $('#container').add(checkPwd);
+    mdui.mutation();
+  </script>
+</body>
+</html>
+{{end}}