feat(P4): precompute移植+app.js sources双向回填+回归1003/1003+验收体积/文件/data.json

2026-09-12 14:18:41 +08:00
parent 16f365a045
commit c65a69c34e
401 changed files with 22932 additions and 140 deletions
@@ -0,0 +1,49 @@
+<!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 · NotificationPro（普通 H5）</title>
+  <link rel="stylesheet" href="../.design_library/aurora-admin/colors_and_type.css" />
+  <link rel="stylesheet" href="NotificationPro.css" />
+  <style>body{margin:0;padding:24px;background: var(--au-color-page-bg);display:flex;gap:8px;flex-wrap:wrap;}</style>
+</head>
+<body>
+  <button onclick="AaNotify.success('审批通过', '订单 ORD-2024 已通过主管审批')">success</button>
+  <button onclick="AaNotify.error('提交失败', '网络异常，请稍后重试')">error</button>
+  <button onclick="AaNotify.warning('存储空间不足', '当前已使用 92%')">warning</button>
+  <button onclick="AaNotify.info('新版本', '系统已发布 v2.3.0')">info</button>
+
+  <script>
+    (function () {
+      var ICON = { success: '✓', error: '✕', warning: '!', info: 'i' };
+      var wrap = document.createElement('div');
+      wrap.className = 'aa-notification-wrap';
+      document.body.appendChild(wrap);
+      var id = 0;
+      function open(opts) {
+        var el = document.createElement('div');
+        el.className = 'aa-notification is-' + opts.type;
+        el.innerHTML = '<span class="aa-notification-icon" aria-live="polite">' + (ICON[opts.type] || 'i') + '</span>' +
+          '<div class="aa-notification-body" aria-live="polite"><div class="aa-notification-title" aria-live="polite">' + opts.title + '</div>' +
+          '<div class="aa-notification-desc" aria-live="polite">' + opts.desc + '</div></div>' +
+          '<span class="aa-notification-close" role="status" aria-live="polite">✕</span>';
+        wrap.appendChild(el);
+        var myId = ++id;
+        function close() { if (el.parentNode) el.parentNode.removeChild(el); }
+        el.querySelector('.aa-notification-close').addEventListener('click', close);
+        var d = opts.duration == null ? 4500 : opts.duration;
+        if (d > 0) setTimeout(close, d);
+        return close;
+      }
+      window.AaNotify = {
+        success: function (t, d, dur) { return open({ type: 'success', title: t, desc: d, duration: dur }); },
+        error: function (t, d, dur) { return open({ type: 'error', title: t, desc: d, duration: dur }); },
+        warning: function (t, d, dur) { return open({ type: 'warning', title: t, desc: d, duration: dur }); },
+        info: function (t, d, dur) { return open({ type: 'info', title: t, desc: d, duration: dur }); },
+        open: open
+      };
+    })();
+  </script>
+</body>
+</html>
@@ -0,0 +1,44 @@
+import React, { forwardRef, useImperativeHandle, useState, useRef } from 'react';
+import './NotificationPro.css';
+
+const ICON = { success: '✓', error: '✕', warning: '!', info: 'i' };
+
+const NotificationPro = forwardRef(function NotificationPro({ duration = 4500 }, ref) {
+  const [list, setList] = useState([]);
+  const idRef = useRef(0);
+
+  function close(id) { setList(l => l.filter(m => m.id !== id)); }
+  function open(opts) {
+    const id = ++idRef.current;
+    setList(l => [...l, { id, type: opts.type || 'info', title: opts.title, desc: opts.desc }]);
+    const d = opts.duration == null ? duration : opts.duration;
+    if (d > 0) setTimeout(() => close(id), d);
+    return id;
+  }
+
+  useImperativeHandle(ref, () => ({
+    open,
+    close,
+    success: (t, d, dur) => open({ type: 'success', title: t, desc: d, duration: dur }),
+    error: (t, d, dur) => open({ type: 'error', title: t, desc: d, duration: dur }),
+    warning: (t, d, dur) => open({ type: 'warning', title: t, desc: d, duration: dur }),
+    info: (t, d, dur) => open({ type: 'info', title: t, desc: d, duration: dur })
+  }));
+
+  return (
+    <div className="aa-notification-wrap">
+      {list.map(m => (
+        <div key={m.id} className={`aa-notification is-${m.type}`}>
+          <span className="aa-notification-icon">{ICON[m.type] || 'i'}</span>
+          <div className="aa-notification-body">
+            <div className="aa-notification-title">{m.title}</div>
+            {m.desc ? <div className="aa-notification-desc">{m.desc}</div> : null}
+          </div>
+          <span className="aa-notification-close" onClick={() => close(m.id)}>✕</span>
+        </div>
+      ))}
+    </div>
+  );
+});
+
+export default NotificationPro;
@@ -0,0 +1,37 @@
+<template>
+  <div class="aa-notification-wrap">
+    <div v-for="m in list" :key="m.id" class="aa-notification" :class="'is-' + m.type">
+      <span class="aa-notification-icon">{{ icon(m.type) }}</span>
+      <div class="aa-notification-body">
+        <div class="aa-notification-title">{{ m.title }}</div>
+        <div class="aa-notification-desc" v-if="m.desc">{{ m.desc }}</div>
+      </div>
+      <span class="aa-notification-close" @click="close(m.id)">✕</span>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'AaNotificationPro',
+  props: { duration: { type: Number, default: 4500 } },
+  data: function () { return { list: [], _id: 0 }; },
+  methods: {
+    icon: function (t) { return ({ success: '✓', error: '✕', warning: '!', info: 'i' })[t] || 'i'; },
+    open: function (opts) {
+      var id = ++this._id;
+      this.list.push({ id: id, type: opts.type || 'info', title: opts.title, desc: opts.desc });
+      var d = opts.duration == null ? this.duration : opts.duration;
+      if (d > 0) { var self = this; setTimeout(function () { self.close(id); }, d); }
+      return id;
+    },
+    close: function (id) { this.list = this.list.filter(function (m) { return m.id !== id; }); },
+    success: function (t, d, dur) { return this.open({ type: 'success', title: t, desc: d, duration: dur }); },
+    error: function (t, d, dur) { return this.open({ type: 'error', title: t, desc: d, duration: dur }); },
+    warning: function (t, d, dur) { return this.open({ type: 'warning', title: t, desc: d, duration: dur }); },
+    info: function (t, d, dur) { return this.open({ type: 'info', title: t, desc: d, duration: dur }); }
+  }
+};
+</script>
+
+<style src="./NotificationPro.css"></style>
@@ -0,0 +1,37 @@
+<template>
+  <div class="aa-notification-wrap">
+    <div v-for="m in list" :key="m.id" class="aa-notification" :class="'is-' + m.type">
+      <span class="aa-notification-icon">{{ icon(m.type) }}</span>
+      <div class="aa-notification-body">
+        <div class="aa-notification-title">{{ m.title }}</div>
+        <div class="aa-notification-desc" v-if="m.desc">{{ m.desc }}</div>
+      </div>
+      <span class="aa-notification-close" @click="close(m.id)">✕</span>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+const props = defineProps({ duration: { type: Number, default: 4500 } });
+const list = ref([]);
+let _id = 0;
+
+function icon(t) { return ({ success: '✓', error: '✕', warning: '!', info: 'i' })[t] || 'i'; }
+function close(id) { list.value = list.value.filter(m => m.id !== id); }
+function open(opts) {
+  const id = ++_id;
+  list.value.push({ id, type: opts.type || 'info', title: opts.title, desc: opts.desc });
+  const d = opts.duration == null ? props.duration : opts.duration;
+  if (d > 0) setTimeout(() => close(id), d);
+  return id;
+}
+function success(t, d, dur) { return open({ type: 'success', title: t, desc: d, duration: dur }); }
+function error(t, d, dur) { return open({ type: 'error', title: t, desc: d, duration: dur }); }
+function warning(t, d, dur) { return open({ type: 'warning', title: t, desc: d, duration: dur }); }
+function info(t, d, dur) { return open({ type: 'info', title: t, desc: d, duration: dur }); }
+
+defineExpose({ open, close, success, error, warning, info });
+</script>
+
+<style src="./NotificationPro.css"></style>