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,50 @@
+<!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 · MessagePro（普通 H5）</title>
+  <link rel="stylesheet" href="../.design_library/aurora-admin/colors_and_type.css" />
+  <link rel="stylesheet" href="MessagePro.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="AaMessage.success('保存成功')">success</button>
+  <button onclick="AaMessage.error('操作失败')">error</button>
+  <button onclick="AaMessage.warning('注意风险')">warning</button>
+  <button onclick="AaMessage.info('已发送通知')">info</button>
+  <button onclick="AaMessage.loading('加载中…')">loading</button>
+
+  <script>
+    (function () {
+      var ICON = { success: '✓', error: '✕', warning: '!', info: 'i', loading: '…' };
+      var wrap = document.createElement('div');
+      wrap.className = 'aa-message-wrap';
+      document.body.appendChild(wrap);
+      var id = 0;
+      function open(opts) {
+        var el = document.createElement('div');
+        el.className = 'aa-message is-' + opts.type;
+        el.innerHTML = '<span class="aa-message-icon" aria-live="polite">' + (ICON[opts.type] || 'i') + '</span>' +
+          '<span class="aa-message-content" aria-live="polite">' + opts.content + '</span>' +
+          (opts.closable !== false ? '<span class="aa-message-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-message-close') && el.querySelector('.aa-message-close').addEventListener('click', close);
+        var d = opts.duration == null ? 3000 : opts.duration;
+        if (d > 0) setTimeout(close, d);
+        return close;
+      }
+      window.AaMessage = {
+        success: function (c, d) { return open({ type: 'success', content: c, duration: d }); },
+        error: function (c, d) { return open({ type: 'error', content: c, duration: d }); },
+        warning: function (c, d) { return open({ type: 'warning', content: c, duration: d }); },
+        info: function (c, d) { return open({ type: 'info', content: c, duration: d }); },
+        loading: function (c, d) { return open({ type: 'loading', content: c, duration: d }); },
+        open: open
+      };
+    })();
+  </script>
+</body>
+</html>
@@ -0,0 +1,42 @@
+import React, { forwardRef, useImperativeHandle, useState, useRef } from 'react';
+import './MessagePro.css';
+
+const ICON = { success: '✓', error: '✕', warning: '!', info: 'i', loading: '…' };
+
+const MessagePro = forwardRef(function MessagePro({ duration = 3000 }, 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', content: opts.content, closable: opts.closable }]);
+    const d = opts.duration == null ? duration : opts.duration;
+    if (d > 0) setTimeout(() => close(id), d);
+    return id;
+  }
+
+  useImperativeHandle(ref, () => ({
+    open,
+    close,
+    success: (c, d) => open({ type: 'success', content: c, duration: d }),
+    error: (c, d) => open({ type: 'error', content: c, duration: d }),
+    warning: (c, d) => open({ type: 'warning', content: c, duration: d }),
+    info: (c, d) => open({ type: 'info', content: c, duration: d }),
+    loading: (c, d) => open({ type: 'loading', content: c, duration: d })
+  }));
+
+  return (
+    <div className="aa-message-wrap">
+      {list.map(m => (
+        <div key={m.id} className={`aa-message is-${m.type}`}>
+          <span className="aa-message-icon">{ICON[m.type] || 'i'}</span>
+          <span className="aa-message-content">{m.content}</span>
+          {m.closable !== false ? <span className="aa-message-close" onClick={() => close(m.id)}>✕</span> : null}
+        </div>
+      ))}
+    </div>
+  );
+});
+
+export default MessagePro;
@@ -0,0 +1,36 @@
+<template>
+  <div class="aa-message-wrap">
+    <div v-for="m in list" :key="m.id" class="aa-message" :class="'is-' + m.type">
+      <span class="aa-message-icon">{{ icon(m.type) }}</span>
+      <span class="aa-message-content">{{ m.content }}</span>
+      <span v-if="m.closable !== false" class="aa-message-close" @click="close(m.id)">✕</span>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'AaMessagePro',
+  props: { duration: { type: Number, default: 3000 } },
+  data: function () { return { list: [], _id: 0 }; },
+  methods: {
+    icon: function (t) { return ({ success: '✓', error: '✕', warning: '!', info: 'i', loading: '…' })[t] || 'i'; },
+    open: function (opts) {
+      var id = ++this._id;
+      var item = { id: id, type: opts.type || 'info', content: opts.content, closable: opts.closable };
+      this.list.push(item);
+      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 (c, d) { return this.open({ type: 'success', content: c, duration: d }); },
+    error: function (c, d) { return this.open({ type: 'error', content: c, duration: d }); },
+    warning: function (c, d) { return this.open({ type: 'warning', content: c, duration: d }); },
+    info: function (c, d) { return this.open({ type: 'info', content: c, duration: d }); },
+    loading: function (c, d) { return this.open({ type: 'loading', content: c, duration: d }); }
+  }
+};
+</script>
+
+<style src="./MessagePro.css"></style>
@@ -0,0 +1,35 @@
+<template>
+  <div class="aa-message-wrap">
+    <div v-for="m in list" :key="m.id" class="aa-message" :class="'is-' + m.type">
+      <span class="aa-message-icon">{{ icon(m.type) }}</span>
+      <span class="aa-message-content">{{ m.content }}</span>
+      <span v-if="m.closable !== false" class="aa-message-close" @click="close(m.id)">✕</span>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+const props = defineProps({ duration: { type: Number, default: 3000 } });
+const list = ref([]);
+let _id = 0;
+
+function icon(t) { return ({ success: '✓', error: '✕', warning: '!', info: 'i', loading: '…' })[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', content: opts.content, closable: opts.closable });
+  const d = opts.duration == null ? props.duration : opts.duration;
+  if (d > 0) setTimeout(() => close(id), d);
+  return id;
+}
+function success(c, d) { return open({ type: 'success', content: c, duration: d }); }
+function error(c, d) { return open({ type: 'error', content: c, duration: d }); }
+function warning(c, d) { return open({ type: 'warning', content: c, duration: d }); }
+function info(c, d) { return open({ type: 'info', content: c, duration: d }); }
+function loading(c, d) { return open({ type: 'loading', content: c, duration: d }); }
+
+defineExpose({ open, close, success, error, warning, info, loading });
+</script>
+
+<style src="./MessagePro.css"></style>