Aurora Admin v1.2.0: 79 components x 5 ends, doc site, contracts batch 1, playground, regression, deploy ready

2026-09-10 19:21:56 +08:00
commit 51ce3a28f7
654 changed files with 49082 additions and 0 deletions
@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>Aurora Admin · ImagePreview（普通 H5）</title>
+  <link rel="stylesheet" href="../.design_library/aurora-admin/colors_and_type.css" />
+  <link rel="stylesheet" href="ImagePreview.css" />
+  <style>body{margin:0;padding:24px;background:#F5F7FA;display:flex;gap:8px;}
+    .aa-thumb{width:80px;height:80px;border-radius:6px;object-fit:cover;cursor:pointer;border:1px solid #E8ECF1;}</style>
+</head>
+<body>
+  <div id="thumbs"></div>
+  <div class="aa-imgprev-mask" id="mask" style="display:none">
+    <button class="aa-imgprev-close" id="close">✕</button>
+    <button class="aa-imgprev-arrow prev" id="prev">‹</button>
+    <img class="aa-imgprev-img" id="big" />
+    <button class="aa-imgprev-arrow next" id="next">›</button>
+    <div class="aa-imgprev-count" id="count"></div>
+    <div class="aa-imgprev-thumbs" id="strip"></div>
+  </div>
+
+  <script>
+    function svg(c1, c2, t) {
+      var s = "<svg xmlns='http://www.w3.org/2000/svg' width='400' height='300'><defs><linearGradient id='g' x1='0' y1='0' x2='1' y2='1'>" +
+        "<stop offset='0' stop-color='" + c1 + "'/><stop offset='1' stop-color='" + c2 + "'/></linearGradient></defs>" +
+        "<rect width='400' height='300' fill='url(#g)'/><text x='200' y='160' font-size='40' fill='#fff' text-anchor='middle' font-family='sans-serif'>" + t + "</text></svg>";
+      return "data:image/svg+xml;utf8," + encodeURIComponent(s);
+    }
+    var IMGS = [svg('#2F54EB','#1D39C4','图 1'), svg('#13C2C2','#08979C','图 2'), svg('#722ED1','#531DAB','图 3'), svg('#FA8C16','#D46B08','图 4')];
+    var cur = 0;
+    var mask = document.getElementById('mask');
+
+    document.getElementById('thumbs').innerHTML = IMGS.map(function (u, i) {
+      return '<img class="aa-thumb" src="' + u + '" data-i="' + i + '">';
+    }).join('');
+    document.querySelectorAll('.aa-thumb').forEach(function (t) {
+      t.onclick = function () { cur = parseInt(t.dataset.i, 10); show(); };
+    });
+
+    function show() {
+      mask.style.display = 'flex';
+      document.getElementById('big').src = IMGS[cur];
+      document.getElementById('count').textContent = (cur + 1) + ' / ' + IMGS.length;
+      document.getElementById('strip').innerHTML = IMGS.map(function (u, i) {
+        return '<img class="aa-imgprev-thumb ' + (i === cur ? 'is-active' : '') + '" src="' + u + '" data-i="' + i + '">';
+      }).join('');
+      document.querySelectorAll('.aa-imgprev-thumb').forEach(function (th) {
+        th.onclick = function () { cur = parseInt(th.dataset.i, 10); show(); };
+      });
+    }
+    function hide() { mask.style.display = 'none'; }
+    document.getElementById('close').onclick = hide;
+    document.getElementById('prev').onclick = function () { cur = (cur - 1 + IMGS.length) % IMGS.length; show(); };
+    document.getElementById('next').onclick = function () { cur = (cur + 1) % IMGS.length; show(); };
+    mask.addEventListener('click', function (e) { if (e.target === mask) hide(); });
+  </script>
+</body>
+</html>