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,71 @@
+<!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 · IDCardInput</title>
+  <link rel="stylesheet" href="../.design_library/aurora-admin/colors_and_type.css" />
+  <link rel="stylesheet" href="./IDCardInput.css" />
+</head>
+<body>
+  <div class="aa-page">
+    <h2 class="aa-h2">IDCardInput 身份证输入</h2>
+    <p class="aa-desc">18 位校验（含校验位）、自动提取出生日期与性别。</p>
+
+    <div class="aa-demo">
+      <div class="aa-demo__title">基础用法</div>
+      <div class="aa-idcard" id="idcard">
+        <div class="aa-idcard-field" id="field">
+          <input class="aa-idcard-input" id="input" placeholder="请输入 18 位身份证号" maxlength="18" />
+        </div>
+        <div class="aa-idcard-info" id="info" style="display:none"></div>
+        <div class="aa-idcard-tip" id="tip">示例：11010119900307657X</div>
+      </div>
+    </div>
+  </div>
+
+  <script>
+    var WEIGHTS = [7,9,10,5,8,4,2,1,6,3,7,9,10,5,8,4,2];
+    var CHECK = '10X98765432';
+    function validate(v) {
+      if (!/^\d{17}[\dX]$/.test(v)) return { ok: false };
+      var sum = 0;
+      for (var i = 0; i < 17; i++) sum += parseInt(v[i], 10) * WEIGHTS[i];
+      if (CHECK[sum % 11] !== v[17].toUpperCase()) return { ok: false };
+      var birth = v.slice(6, 14);
+      var birthStr = birth.slice(0,4) + '-' + birth.slice(4,6) + '-' + birth.slice(6,8);
+      var gender = parseInt(v[16], 10) % 2 === 1 ? '男' : '女';
+      return { ok: true, birth: birthStr, gender: gender };
+    }
+
+    var field = document.getElementById('field');
+    var input = document.getElementById('input');
+    var info = document.getElementById('info');
+    var tip = document.getElementById('tip');
+
+    input.addEventListener('input', function () {
+      var v = input.value.replace(/[^0-9Xx]/g, '').toUpperCase().slice(0, 18);
+      input.value = v;
+      field.classList.remove('is-valid', 'is-invalid');
+      tip.className = 'aa-idcard-tip';
+      if (!v) { info.style.display = 'none'; tip.textContent = '示例：11010119900307657X'; return; }
+      var r = validate(v);
+      if (v.length < 18) { tip.textContent = '已输入 ' + v.length + ' 位，继续…'; return; }
+      if (r.ok) {
+        field.classList.add('is-valid');
+        tip.className = 'aa-idcard-tip valid';
+        tip.textContent = '校验通过';
+        info.style.display = 'flex';
+        info.innerHTML = '<span>出生日期：<b>' + r.birth + '</b></span><span>性别：<b>' + r.gender + '</b></span>';
+      } else {
+        field.classList.add('is-invalid');
+        tip.className = 'aa-idcard-tip invalid';
+        tip.textContent = '身份证号校验失败，请检查';
+        info.style.display = 'none';
+      }
+    });
+    input.addEventListener('focus', function () { field.classList.add('is-focus'); });
+    input.addEventListener('blur', function () { field.classList.remove('is-focus'); });
+  </script>
+</body>
+</html>