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,104 @@
+import React, { useState, useRef, useEffect } from 'react';
+import './RangeQuickPicker.css';
+
+function fmt(d) {
+  return d.getFullYear() + '-' + String(d.getMonth() + 1).padStart(2, '0') + '-' + String(d.getDate()).padStart(2, '0');
+}
+function presetRange(p) {
+  const end = new Date();
+  end.setHours(0, 0, 0, 0);
+  const start = new Date(end);
+  if (p.year === 'this') start.setMonth(0, 1);
+  else if (p.month === 'this') start.setDate(1);
+  else if (p.month === 'last') {
+    start = new Date(end.getFullYear(), end.getMonth() - 1, 1);
+    end.setDate(0);
+  } else {
+    start.setDate(end.getDate() + (p.days || 0));
+    if (p.len) start.setDate(end.getDate() - (p.len - 1));
+  }
+  return { start: fmt(start), end: fmt(end) };
+}
+
+const DEFAULT_PRESETS = [
+  { label: '今天', days: 0 },
+  { label: '昨天', days: -1, len: 1 },
+  { label: '近7天', days: -6 },
+  { label: '近30天', days: -29 },
+  { label: '本月', month: 'this' },
+  { label: '上月', month: 'last' },
+  { label: '本年', year: 'this' }
+];
+
+export default function RangeQuickPicker({ modelValue = { start: '', end: '' }, presets = DEFAULT_PRESETS, onChange }) {
+  const root = useRef(null);
+  const [open, setOpen] = useState(false);
+  const [start, setStart] = useState(modelValue.start);
+  const [end, setEnd] = useState(modelValue.end);
+  const [activeIndex, setActiveIndex] = useState(-1);
+
+  useEffect(() => {
+    function onDoc(e) {
+      if (root.current && !root.current.contains(e.target)) {
+        setOpen(false);
+        setActiveIndex(-1);
+      }
+    }
+    document.addEventListener('click', onDoc);
+    return () => document.removeEventListener('click', onDoc);
+  }, []);
+
+  const applyPreset = (i) => {
+    const r = presetRange(presets[i]);
+    setStart(r.start);
+    setEnd(r.end);
+    setActiveIndex(i);
+  };
+  const confirm = () => {
+    if (onChange) onChange({ start, end });
+    setOpen(false);
+    setActiveIndex(-1);
+  };
+
+  return (
+    <div className="aa-range" ref={root}>
+      <div className={'aa-range-trigger' + (open ? ' is-focus' : '')} onClick={() => setOpen((o) => !o)}>
+        {modelValue.start && modelValue.end ? (
+          <span>
+            {modelValue.start} <span className="aa-range-sep">~</span> {modelValue.end}
+          </span>
+        ) : (
+          <span className="aa-range-placeholder">请选择时间范围</span>
+        )}
+      </div>
+      {open && (
+        <div className="aa-range-pop">
+          <div className="aa-range-presets">
+            {presets.map((p, i) => (
+              <button
+                key={i}
+                className={'aa-range-preset' + (activeIndex === i ? ' is-active' : '')}
+                onClick={applyPreset.bind(null, i)}
+              >
+                {p.label}
+              </button>
+            ))}
+          </div>
+          <div className="aa-range-custom">
+            <input type="date" value={start} onChange={(e) => setStart(e.target.value)} />
+            <span className="aa-range-tilde">~</span>
+            <input type="date" value={end} onChange={(e) => setEnd(e.target.value)} />
+          </div>
+          <div className="aa-range-actions">
+            <button className="aa-range-cancel" onClick={() => setOpen(false)}>
+              取消
+            </button>
+            <button className="aa-range-ok" onClick={confirm}>
+              确定
+            </button>
+          </div>
+        </div>
+      )}
+    </div>
+  );
+}