feat(admin): 更新runtime

magic-admin/server/.gitignore

@@ -5,6 +5,6 @@ package.json.lock
 coverage
 .vscode
 assets
-!runtime/assets
+!static/**/assets
 src/config/database.ts
 src/config/key.ts

magic-admin/server/runtime/assets/config.js

@@ -1,2 +0,0 @@
-var t=[{text:"\u9875\u9762\u6807\u8BC6",name:"name",disabled:!0,extra:"\u5728\u591A\u9875\u9762\u7684\u60C5\u51B5\u4E0B\u7528\u6765\u6307\u5B9A\u8981\u6253\u5F00\u7684\u9875\u9762"},{text:"\u9875\u9762\u6807\u9898",name:"title"},{name:"layout",text:"\u5BB9\u5668\u5E03\u5C40",type:"select",defaultValue:"absolute",options:[{value:"absolute",text:"\u7EDD\u5BF9\u5B9A\u4F4D"},{value:"relative",text:"\u6D41\u5F0F\u5E03\u5C40"}]}],e=[{name:"layout",text:"\u5BB9\u5668\u5E03\u5C40",type:"select",defaultValue:"absolute",options:[{value:"absolute",text:"\u7EDD\u5BF9\u5B9A\u4F4D"},{value:"relative",text:"\u6D41\u5F0F\u5E03\u5C40"}]}],a=[{text:"\u6587\u672C",name:"text"}],l=[{name:"text",text:"\u6587\u672C"},{name:"multiple",text:"\u591A\u884C\u6587\u672C",type:"switch"}],n=[{text:"\u56FE\u7247",name:"src"},{text:"\u94FE\u63A5",name:"url"}],o=[{text:"\u94FE\u63A5",name:"url"}],r=[];(function(){const u={page:t,container:e,button:a,text:l,img:n,qrcode:o,overlay:r};window.magicPresetConfigs=u})();
-//# sourceMappingURL=config.js.map

magic-admin/server/runtime/assets/event.js

@@ -1,2 +0,0 @@
-var u={methods:[{label:"\u5237\u65B0\u9875\u9762",value:"refresh"}]},l={methods:[{label:"\u6253\u5F00\u8499\u5C42",value:"openOverlay"},{label:"\u5173\u95ED\u8499\u5C42",value:"closeOverlay"}],events:[{label:"\u6253\u5F00\u8499\u5C42",value:"overlay:open"},{label:"\u5173\u95ED\u8499\u5C42",value:"overlay:close"}]};(function(){const e={page:u,overlay:l};window.magicPresetEvents=e})();
-//# sourceMappingURL=event.js.map

magic-admin/server/runtime/assets/event.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"event.js","sources":["../../../../packages/ui/src/page/src/event.ts","../../../../packages/ui/src/overlay/src/event.ts","../../src/event-entry.ts"],"sourcesContent":["export default {\n  methods: [\n    {\n      label: '刷新页面',\n      value: 'refresh',\n    },\n  ],\n};\n","export default {\n  methods: [\n    {\n      label: '打开蒙层',\n      value: 'openOverlay',\n    },\n    {\n      label: '关闭蒙层',\n      value: 'closeOverlay',\n    },\n  ],\n  events: [\n    {\n      label: '打开蒙层',\n      value: 'overlay:open',\n    },\n    {\n      label: '关闭蒙层',\n      value: 'overlay:close',\n    },\n  ],\n};\n","import page from '/data/magic/tmagic-editor/packages/ui/src/page/src/event';\nimport overlay from '/data/magic/tmagic-editor/packages/ui/src/overlay/src/event';\n\n(function() {\n  const events: Record<string, any> = {\n    'page': page,\n    'overlay': overlay,\n  };\n\n  window.magicPresetEvents = events;\n})();"],"names":[],"mappings":"AAAA,GAAe,GAAA,CACb,QAAS,CACP,CACE,MAAO,2BACP,MAAO,SACT,CACF,CACF,ECPe,EAAA,CACb,QAAS,CACP,CACE,MAAO,2BACP,MAAO,aACT,EACA,CACE,MAAO,2BACP,MAAO,cACT,CACF,EACA,OAAQ,CACN,CACE,MAAO,2BACP,MAAO,cACT,EACA,CACE,MAAO,2BACP,MAAO,eACT,CACF,CACF,EClBC,AAAW,WAAA,CACV,KAAM,GAA8B,CAClC,KAAQ,EACR,QAAW,CAAA,EAGb,OAAO,kBAAoB,CAC7B,GAAG"}

magic-admin/server/runtime/assets/playground.js

@@ -1,2 +0,0 @@
-import{A as g,a as m,_ as v}from"./plugin-vue_export-helper.8f6f5b47.js";const h="modulepreload",f={},w="/runtime/",E=function(s,c){return!c||c.length===0?s():Promise.all(c.map(r=>{if(r=`${w}${r}`,r in f)return;f[r]=!0;const t=r.endsWith(".css"),i=t?'[rel="stylesheet"]':"";if(document.querySelector(`link[href="${r}"]${i}`))return;const e=document.createElement("link");if(e.rel=t?"stylesheet":h,t||(e.as="script",e.crossOrigin=""),e.href=r,document.head.appendChild(e),t)return new Promise((n,u)=>{e.addEventListener("load",n),e.addEventListener("error",()=>u(new Error(`Unable to preload CSS for ${r}`)))})})).then(()=>s())};const _=Vue.defineComponent({setup(){const o=Vue.ref(),s=Vue.ref(),c=Vue.ref(),r=Vue.computed(()=>{var i,e,n,u;return((e=(i=o.value)==null?void 0:i.items)==null?void 0:e.find(a=>a.id===s.value))||((u=(n=o.value)==null?void 0:n.items)==null?void 0:u[0])}),t=new g({config:o.value,platform:"editor"});return Vue.provide("app",t),Vue.watch(r,async()=>{await Vue.nextTick();const i=document.querySelector(".magic-ui-page");i&&window.magic.onPageElUpdate(i)}),Vue.onMounted(()=>{var i;(i=window.magic)==null||i.onRuntimeReady({getApp(){return t},updateRootConfig(e){console.log("update config",e),o.value=e,t==null||t.setConfig(e,s.value)},updatePageId(e){console.log("update page id",e),s.value=e,t==null||t.setPage(e)},getSnapElements(){return Array.from(document.querySelectorAll("[class*=magic-ui][id]"))},select(e){console.log("select config",e),c.value=e;const n=document.getElementById(`${e}`);return n||Vue.nextTick().then(()=>document.getElementById(`${e}`))},add({config:e}){var l;if(console.log("add config",e),!o.value)throw new Error("error");if(!c.value)throw new Error("error");const n=m(c.value,[o.value]),u=n.pop(),a=u!=null&&u.items?u:n.pop();if(!a)throw new Error("\u672A\u627E\u5230\u7236\u8282\u70B9");(l=a.items)==null||l.push(e)},update({config:e}){var p;if(console.log("update config",e),!o.value)throw new Error("error");const n=m(e.id,[o.value]),u=n.pop(),a=n.pop();if(!u)throw new Error("\u672A\u627E\u5230\u76EE\u6807\u8282\u70B9");if(!a)throw new Error("\u672A\u627E\u5230\u7236\u8282\u70B9");const l=(p=a.items)==null?void 0:p.findIndex(d=>d.id===u.id);a.items.splice(l,1,Vue.reactive(e))},remove({id:e}){var p;if(!o.value)throw new Error("error");const n=m(e,[o.value]),u=n.pop();if(!u)throw new Error("\u672A\u627E\u5230\u76EE\u6807\u5143\u7D20");const a=n.pop();if(!a)throw new Error("\u672A\u627E\u5230\u7236\u5143\u7D20");const l=(p=a.items)==null?void 0:p.findIndex(d=>d.id===u.id);a.items.splice(l,1)}})}),{pageConfig:r}}});function V(o,s,c,r,t,i){const e=Vue.resolveComponent("magic-ui-page");return o.pageConfig?(Vue.openBlock(),Vue.createBlock(e,{key:0,config:o.pageConfig},null,8,["config"])):Vue.createCommentVNode("v-if",!0)}var A=v(_,[["render",V],["__file","/data/magic/tmagic-editor/runtime/vue3/src/playground/App.vue"]]);E(()=>import("./comp-entry.d785a88e.js"),["assets/comp-entry.d785a88e.js","assets/plugin-vue_export-helper.8f6f5b47.js"]).then(o=>{const{components:s,plugins:c}=o.default,r=Vue.createApp(A);Object.values(s).forEach(t=>{r.component(t.name,t)}),Object.values(c).forEach(t=>{r.use(t)}),r.mount("#app")});
-//# sourceMappingURL=playground.js.map

magic-admin/server/runtime/assets/style.6555bdb0.css

@@ -1 +0,0 @@
-#app::-webkit-scrollbar{width:0!important;display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}:focus{outline:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{-webkit-appearance:none;-moz-appearance:none}input[type=search]{-webkit-appearance:none;-moz-appearance:none;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}textarea{overflow:auto;vertical-align:top;resize:vertical}audio,canvas,video{display:inline-block;*display: inline;*zoom: 1;max-width:100%}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}a:focus{outline:thin dotted}a:active,a:hover{outline:0}img{border:0;-ms-interpolation-mode:bicubic}figure{margin:0}form{margin:0}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0;white-space:normal;*margin-left: -7px}button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align: middle}button,input{line-height:normal}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer;*overflow: visible}button[disabled],html input[disabled]{cursor:default}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0;*height: 13px;*width: 13px}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}html,button,input,select,textarea{color:#222}::-moz-selection{background:#b3d4fc;text-shadow:none}::selection{background:#b3d4fc;text-shadow:none}img{vertical-align:middle}fieldset{border:0;margin:0;padding:0}textarea{resize:vertical}.chromeframe{margin:.2em 0;background:#ccc;color:#000;padding:.2em 0}html,body,#app{width:100%;height:100%}#app{position:relative;overflow:auto}#app::-webkit-scrollbar{width:0}.magic-ui-container{background-color:#88888880}.action-area{background-color:#3399ff80!important}

magic-admin/server/runtime/assets/value.js

@@ -1,2 +0,0 @@
-var e={items:[],style:{width:"100%",height:"100%"}},i={items:[],style:{width:"375",height:"100"}},u={text:"\u8BF7\u8F93\u5165\u6587\u672C\u5185\u5BB9",multiple:!0,style:{width:"270",height:"37.5",border:0,backgroundColor:"#fb6f00"}},o={type:"text",text:"\u8BF7\u8F93\u5165\u6587\u672C\u5185\u5BB9",multiple:!0,style:{width:"100",height:"auto"}},l={src:"https://puui.qpic.cn/vupload/0/1573555382625_bhp0wud8l6w.png/0",url:"",style:{position:"absolute",left:"57",width:"176",height:"176"}},r={url:"https://m.film.qq.com",style:{position:"absolute",left:"57",width:"176",height:"176"}},h={style:{position:"fixed",width:"100%",height:"100%",top:0,left:0,backgroundColor:"rgba(0, 0, 0, 0.8)"},items:[]};(function(){const t={page:e,container:i,button:u,text:o,img:l,qrcode:r,overlay:h};window.magicPresetValues=t})();
-//# sourceMappingURL=value.js.map

magic-admin/server/runtime/page.html

@@ -1,17 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vue3 Page</title>
-    <script src="https://unpkg.com/vue@next/dist/vue.runtime.global.js"></script>
-    <script type="module" crossorigin src="/runtime/assets/page.js"></script>
-    <link rel="modulepreload" href="/runtime/assets/plugin-vue_export-helper.8f6f5b47.js">
-    <link rel="modulepreload" href="/runtime/assets/comp-entry.d785a88e.js">
-    <link rel="stylesheet" href="/runtime/assets/style.6555bdb0.css">
-  </head>
-  <body>
-    <div id="app"></div>
-    
-  </body>
-</html>

magic-admin/server/runtime/playground.html

@@ -1,32 +0,0 @@
-<!DOCTYPE html>
-<html lang="en" style="font-size: 100px">
-<head>
-  <meta charset="UTF-8">
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Vue3 Playground</title>
-  <style>
-    html{-ms-overflow-style: none; overflow: -moz-scrollbars-none;}
-    html,body {height: 100%; margin: 0; padding: 0}
-    body {
-      height: fit-content;
-      min-height: 100%;
-    }
-    html::-webkit-scrollbar, .body::-webkit-scrollbar { width: 0 !important }
-    .magic-ui-page {
-      overflow: hidden;
-    }
-  </style>
-  <script type="module" crossorigin src="/runtime/assets/playground.js"></script>
-  <link rel="modulepreload" href="/runtime/assets/plugin-vue_export-helper.8f6f5b47.js">
-  <link rel="stylesheet" href="/runtime/assets/style.6555bdb0.css">
-</head>
-<body style="font-size: 14px">
-  
-  <div id="app"></div>
-
-  <script src="https://unpkg.com/vue@next/dist/vue.global.js"></script>
-
-  
-</body>
-</html>

magic-admin/server/src/config/config.ts

@@ -35,7 +35,7 @@ export enum PageStatus {
 export const StaticPath = {
   ASSETS: path.resolve(__dirname, '../../assets'),
   TEMPLATE: path.resolve(__dirname, '../template'),
-  RUNTIME: path.resolve(__dirname, '../../runtime'),
+  STATIC: path.resolve(__dirname, '../../static'),
   PUBLISH: path.resolve(__dirname, '../../assets/publish'),
 };
 

magic-admin/server/src/routers/static.ts

@@ -29,8 +29,8 @@ router.get('/', async (ctx) => {
   await send(ctx, `${StaticPath.ASSETS}/index.html`, options);
 });
 
-router.get('/runtime/*', async (ctx) => {
+router.get('/static/*', async (ctx) => {
-  const file = `${StaticPath.RUNTIME}/${ctx.params[0]}`;
+  const file = `${StaticPath.STATIC}/${ctx.params[0]}`;
   if (pathExistsSync(file)) {
     await send(ctx, file, options);
   }

magic-admin/server/src/service/publish.ts

@@ -243,7 +243,7 @@ const publishHtml = (pageConfig: DivideConfigTrans) => {
   try {
     // 复制html模板
     const distHtml = `${StaticPath.PUBLISH}/${pageName}.html`;
-    const tmpHtml = `${StaticPath.RUNTIME}/page.html`;
+    const tmpHtml = `${StaticPath.STATIC}/vue3/runtime/page/index.html`;
     copySync(tmpHtml, distHtml);
     // 注入活动配置文件
     const configScript = `<script type='module' src='./uiconfig_${pageName}.js'></script>\n\t${UiRuntimeJS}`;

magic-admin/server/static/vue3/entry/config/index.umd.js

@@ -0,0 +1,95 @@
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
+  typeof define === 'function' && define.amd ? define(factory) :
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.magicPresetConfigs = factory());
+})(this, (function () { 'use strict';
+
+  const page = [
+    {
+      text: "\u9875\u9762\u6807\u8BC6",
+      name: "name",
+      disabled: true,
+      extra: "\u5728\u591A\u9875\u9762\u7684\u60C5\u51B5\u4E0B\u7528\u6765\u6307\u5B9A\u8981\u6253\u5F00\u7684\u9875\u9762"
+    },
+    {
+      text: "\u9875\u9762\u6807\u9898",
+      name: "title"
+    },
+    {
+      name: "layout",
+      text: "\u5BB9\u5668\u5E03\u5C40",
+      type: "select",
+      defaultValue: "absolute",
+      options: [
+        { value: "absolute", text: "\u7EDD\u5BF9\u5B9A\u4F4D" },
+        { value: "relative", text: "\u6D41\u5F0F\u5E03\u5C40" }
+      ]
+    }
+  ];
+
+  const container = [
+    {
+      name: "layout",
+      text: "\u5BB9\u5668\u5E03\u5C40",
+      type: "select",
+      defaultValue: "absolute",
+      options: [
+        { value: "absolute", text: "\u7EDD\u5BF9\u5B9A\u4F4D" },
+        { value: "relative", text: "\u6D41\u5F0F\u5E03\u5C40" }
+      ]
+    }
+  ];
+
+  const button = [
+    {
+      text: "\u6587\u672C",
+      name: "text"
+    }
+  ];
+
+  const text = [
+    {
+      name: "text",
+      text: "\u6587\u672C"
+    },
+    {
+      name: "multiple",
+      text: "\u591A\u884C\u6587\u672C",
+      type: "switch"
+    }
+  ];
+
+  const img = [
+    {
+      text: "\u56FE\u7247",
+      name: "src"
+    },
+    {
+      text: "\u94FE\u63A5",
+      name: "url"
+    }
+  ];
+
+  const qrcode = [
+    {
+      text: "\u94FE\u63A5",
+      name: "url"
+    }
+  ];
+
+  const overlay = [];
+
+  const configs = {
+    "page": page,
+    "container": container,
+    "button": button,
+    "text": text,
+    "img": img,
+    "qrcode": qrcode,
+    "overlay": overlay
+  };
+
+  return configs;
+
+}));
+//# sourceMappingURL=index.umd.js.map

magic-admin/server/static/vue3/entry/event/index.umd.js

@@ -0,0 +1,47 @@
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
+  typeof define === 'function' && define.amd ? define(factory) :
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.magicPresetEvents = factory());
+})(this, (function () { 'use strict';
+
+  const page = {
+    methods: [
+      {
+        label: "\u5237\u65B0\u9875\u9762",
+        value: "refresh"
+      }
+    ]
+  };
+
+  const overlay = {
+    methods: [
+      {
+        label: "\u6253\u5F00\u8499\u5C42",
+        value: "openOverlay"
+      },
+      {
+        label: "\u5173\u95ED\u8499\u5C42",
+        value: "closeOverlay"
+      }
+    ],
+    events: [
+      {
+        label: "\u6253\u5F00\u8499\u5C42",
+        value: "overlay:open"
+      },
+      {
+        label: "\u5173\u95ED\u8499\u5C42",
+        value: "overlay:close"
+      }
+    ]
+  };
+
+  const events = {
+    "page": page,
+    "overlay": overlay
+  };
+
+  return events;
+
+}));
+//# sourceMappingURL=index.umd.js.map

magic-admin/server/static/vue3/entry/event/index.umd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.umd.js","sources":["../../../../../packages/ui/src/page/src/event.ts","../../../../../packages/ui/src/overlay/src/event.ts","../../../.tmagic/event-entry.ts"],"sourcesContent":["export default {\n  methods: [\n    {\n      label: '刷新页面',\n      value: 'refresh',\n    },\n  ],\n};\n","export default {\n  methods: [\n    {\n      label: '打开蒙层',\n      value: 'openOverlay',\n    },\n    {\n      label: '关闭蒙层',\n      value: 'closeOverlay',\n    },\n  ],\n  events: [\n    {\n      label: '打开蒙层',\n      value: 'overlay:open',\n    },\n    {\n      label: '关闭蒙层',\n      value: 'overlay:close',\n    },\n  ],\n};\n","import page from '/data/magic/tmagic-editor/packages/ui/src/page/src/event';\nimport overlay from '/data/magic/tmagic-editor/packages/ui/src/overlay/src/event';\n\nconst events: Record<string, any> = {\n  'page': page,\n  'overlay': overlay,\n};\n\nexport default events;"],"names":[],"mappings":";;;;;;AAAA,eAAe;EAAA,EACb,OAAS,EAAA;EAAA,IACP;EAAA,MACE,KAAO,EAAA,0BAAA;EAAA,MACP,KAAO,EAAA,SAAA;EAAA,KACT;EAAA,GACF;EACF,CAAA;;ACPA,kBAAe;EAAA,EACb,OAAS,EAAA;EAAA,IACP;EAAA,MACE,KAAO,EAAA,0BAAA;EAAA,MACP,KAAO,EAAA,aAAA;EAAA,KACT;EAAA,IACA;EAAA,MACE,KAAO,EAAA,0BAAA;EAAA,MACP,KAAO,EAAA,cAAA;EAAA,KACT;EAAA,GACF;EAAA,EACA,MAAQ,EAAA;EAAA,IACN;EAAA,MACE,KAAO,EAAA,0BAAA;EAAA,MACP,KAAO,EAAA,cAAA;EAAA,KACT;EAAA,IACA;EAAA,MACE,KAAO,EAAA,0BAAA;EAAA,MACP,KAAO,EAAA,eAAA;EAAA,KACT;EAAA,GACF;EACF,CAAA;;AClBA,QAAM,MAA8B,GAAA;EAAA,EAClC,MAAQ,EAAA,IAAA;EAAA,EACR,SAAW,EAAA,OAAA;EACb;;;;;;;;"}

magic-admin/server/static/vue3/entry/value/index.umd.js

@@ -0,0 +1,90 @@
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
+  typeof define === 'function' && define.amd ? define(factory) :
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.magicPresetValues = factory());
+})(this, (function () { 'use strict';
+
+  const page = {
+    items: [],
+    style: {
+      width: "100%",
+      height: "100%"
+    }
+  };
+
+  const container = {
+    items: [],
+    style: {
+      width: "375",
+      height: "100"
+    }
+  };
+
+  const button = {
+    text: "\u8BF7\u8F93\u5165\u6587\u672C\u5185\u5BB9",
+    multiple: true,
+    style: {
+      width: "270",
+      height: "37.5",
+      border: 0,
+      backgroundColor: "#fb6f00"
+    }
+  };
+
+  const text = {
+    type: "text",
+    text: "\u8BF7\u8F93\u5165\u6587\u672C\u5185\u5BB9",
+    multiple: true,
+    style: {
+      width: "100",
+      height: "auto"
+    }
+  };
+
+  const img = {
+    src: "https://puui.qpic.cn/vupload/0/1573555382625_bhp0wud8l6w.png/0",
+    url: "",
+    style: {
+      position: "absolute",
+      left: "57",
+      width: "176",
+      height: "176"
+    }
+  };
+
+  const qrcode = {
+    url: "https://m.film.qq.com",
+    style: {
+      position: "absolute",
+      left: "57",
+      width: "176",
+      height: "176"
+    }
+  };
+
+  const overlay = {
+    style: {
+      position: "fixed",
+      width: "100%",
+      height: "100%",
+      top: 0,
+      left: 0,
+      backgroundColor: "rgba(0, 0, 0, 0.8)"
+    },
+    items: []
+  };
+
+  const values = {
+    "page": page,
+    "container": container,
+    "button": button,
+    "text": text,
+    "img": img,
+    "qrcode": qrcode,
+    "overlay": overlay
+  };
+
+  return values;
+
+}));
+//# sourceMappingURL=index.umd.js.map

magic-admin/server/static/vue3/runtime/page/index.html

@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="icon" href="/static/vue3/runtime/page/favicon.png" type="image/png">
+    <title>Vue3 Page</title>
+    <style>
+      html,
+      body,
+      #app {
+        width: 100%;
+        height: 100%;
+      }
+
+      #app {
+        position: relative;
+        overflow: auto;
+      }
+
+      #app::-webkit-scrollbar {
+        width: 0 !important;
+        display: none;
+      }
+    </style>
+    <script src="https://unpkg.com/vue@next/dist/vue.runtime.global.js"></script>
+    <script type="module" crossorigin src="/static/vue3/runtime/page/assets/index.b9c60957.js"></script>
+    <script type="module">try{import.meta.url;import("_").catch(()=>1);}catch(e){}window.__vite_is_modern_browser=true;</script>
+    <script type="module">!function(){if(window.__vite_is_modern_browser)return;console.warn("vite: loading legacy build because dynamic import or import.meta.url is unsupported, syntax error above should be ignored");var e=document.getElementById("vite-legacy-polyfill"),n=document.createElement("script");n.src=e.src,n.onload=function(){System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))},document.body.appendChild(n)}();</script>
+  </head>
+  <body>
+    <div id="app"></div>
+    
+    <script nomodule>!function(){var e=document,t=e.createElement("script");if(!("noModule"in t)&&"onbeforeload"in t){var n=!1;e.addEventListener("beforeload",(function(e){if(e.target===t)n=!0;else if(!e.target.hasAttribute("nomodule")||!n)return;e.preventDefault()}),!0),t.type="module",t.src=".",e.head.appendChild(t),t.remove()}}();</script>
+    <script nomodule crossorigin id="vite-legacy-polyfill" src="/static/vue3/runtime/page/assets/polyfills-legacy.7a061a97.js"></script>
+    <script nomodule crossorigin id="vite-legacy-entry" data-src="/static/vue3/runtime/page/assets/index-legacy.9fd49d9c.js">System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))</script>
+  </body>
+</html>

magic-admin/server/static/vue3/runtime/playground/assets/plugin-entry-legacy.7d9da6d6.js

@@ -0,0 +1,2 @@
+System.register([],(function(e){"use strict";return{execute:function(){e("default",{})}}}));
+//# sourceMappingURL=plugin-entry-legacy.7d9da6d6.js.map

magic-admin/server/static/vue3/runtime/playground/assets/plugin-entry-legacy.7d9da6d6.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"plugin-entry-legacy.7d9da6d6.js","sources":["../../../../.tmagic/plugin-entry.ts"],"sourcesContent":["const plugins: Record<string, any> = {};\nexport default plugins;"],"names":["exports"],"mappings":"uEAAqCA,EAAA,UAAA,CAAA"}

magic-admin/server/static/vue3/runtime/playground/assets/plugin-entry.b765d2c2.js

@@ -0,0 +1,2 @@
+const s={};export{s as default};
+//# sourceMappingURL=plugin-entry.b765d2c2.js.map

magic-admin/server/static/vue3/runtime/playground/assets/plugin-entry.b765d2c2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"plugin-entry.b765d2c2.js","sources":["../../../../.tmagic/plugin-entry.ts"],"sourcesContent":["const plugins: Record<string, any> = {};\nexport default plugins;"],"names":[],"mappings":"AAAA,KAAM,GAA+B,CAAA"}

magic-admin/server/static/vue3/runtime/playground/index.html

@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<html lang="en" style="font-size: 100px">
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <link rel="icon" href="/static/vue3/runtime/playground/favicon.png" type="image/png">
+  <title>Vue3 Playground</title>
+  <style>
+    html,body {margin: 0; padding: 0}
+
+    .magic-ui-page {
+      overflow: hidden;
+    }
+
+    ::-webkit-scrollbar {
+      width: 0;
+    }
+
+    html,
+    body,
+    #app {
+      width: 100%;
+      height: 100%;
+    }
+
+    #app {
+      position: relative;
+      overflow: auto;
+    }
+
+    .magic-ui-container {
+      background-color: rgba(136, 136, 136, 0.5);
+    }
+
+    .action-area {
+      background-color: rgba(51, 153, 255, 0.5) !important;
+    }
+  </style>
+  <script type="module" crossorigin src="/static/vue3/runtime/playground/assets/index.79d6c210.js"></script>
+  <script type="module">try{import.meta.url;import("_").catch(()=>1);}catch(e){}window.__vite_is_modern_browser=true;</script>
+  <script type="module">!function(){if(window.__vite_is_modern_browser)return;console.warn("vite: loading legacy build because dynamic import or import.meta.url is unsupported, syntax error above should be ignored");var e=document.getElementById("vite-legacy-polyfill"),n=document.createElement("script");n.src=e.src,n.onload=function(){System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))},document.body.appendChild(n)}();</script>
+</head>
+<body style="font-size: 14px">
+  
+  <div id="app"></div>
+
+  <script src="https://unpkg.com/vue@next/dist/vue.global.js"></script>
+
+  
+  <script nomodule>!function(){var e=document,t=e.createElement("script");if(!("noModule"in t)&&"onbeforeload"in t){var n=!1;e.addEventListener("beforeload",(function(e){if(e.target===t)n=!0;else if(!e.target.hasAttribute("nomodule")||!n)return;e.preventDefault()}),!0),t.type="module",t.src=".",e.head.appendChild(t),t.remove()}}();</script>
+  <script nomodule crossorigin id="vite-legacy-polyfill" src="/static/vue3/runtime/playground/assets/polyfills-legacy.ebeee3b7.js"></script>
+  <script nomodule crossorigin id="vite-legacy-entry" data-src="/static/vue3/runtime/playground/assets/index-legacy.ac8fb9e1.js">System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))</script>
+</body>
+</html>

magic-admin/web/.gitignore

@@ -1,7 +1,6 @@
 .DS_Store
 node_modules
 /dist
-package-lock.json
 
 # local env files
 .env.local

magic-admin/web/src/views/editor.vue

@@ -66,13 +66,13 @@ export default defineComponent({
       await initConfigByActId({ actId: Number(route.params.actId) });
     };
 
-    asyncLoadJs('/runtime/assets/config.js').then(() => {
+    asyncLoadJs('/static/vue3/entry/config/index.umd.js').then(() => {
       magicPresetConfigs.value = (window as any).magicPresetConfigs;
     });
-    asyncLoadJs('/runtime/assets/value.js').then(() => {
+    asyncLoadJs('/static/vue3/entry/value/index.umd.js').then(() => {
       magicPresetValues.value = (window as any).magicPresetValues;
     });
-    asyncLoadJs('/runtime/assets/event.js').then(() => {
+    asyncLoadJs('/static/vue3/entry/event/index.umd.js').then(() => {
       magicPresetEvents.value = (window as any).magicPresetEvents;
     });
 
@@ -84,7 +84,7 @@ export default defineComponent({
       componentList,
       menu: topMenu(),
       uiConfigs,
-      runtimeUrl: '/runtime/playground.html',
+      runtimeUrl: '/static/vue3/runtime/playground/index.html',
       magicPresetValues,
       magicPresetConfigs,
       magicPresetEvents,

magic-admin/web/vue.config.js

@@ -13,14 +13,15 @@ module.exports = defineConfig({
   outputDir: path.resolve(__dirname, './dist'),
 
   devServer: {
-    port: 8181,
+    port: 80,
+    host: '0.0.0.0',
     proxy: {
       '/api': {
         target: 'http://localhost:3001/',
         ws: true,
         changOrigin: true,
       },
-      '/runtime': {
+      '/static': {
         target: 'http://localhost:3001/',
         ws: true,
         changOrigin: true,

runtime/react/build.vite.config.ts

@@ -33,7 +33,7 @@ export default defineConfig(({ mode }) => {
         sourcemap: true,
         minify: false,
         target: 'esnext',
-        outDir: isAdmin ? `./dist/entry/react/${type}` : `../../playground/public/entry/react/${type}`,
+        outDir: isAdmin ? `./dist/entry/${type}` : `../../playground/public/entry/react/${type}`,
 
         lib: {
           entry: `.tmagic/${type}-entry.ts`,
@@ -47,9 +47,9 @@ export default defineConfig(({ mode }) => {
 
   if (['page', 'playground', 'page:admin', 'playground:admin'].includes(mode)) {
     const [type, isAdmin] = mode.split(':');
-    const base = isAdmin ? `/runtime/${type}/` : `/tmagic-editor/playground/runtime/react/${type}`;
+    const base = isAdmin ? `/static/react/runtime/${type}/` : `/tmagic-editor/playground/runtime/react/${type}`;
     const outDir = isAdmin
-      ? path.resolve(process.cwd(), `./dist/${type}`)
+      ? path.resolve(process.cwd(), `./dist/runtime/${type}`)
       : path.resolve(process.cwd(), `../../playground/public/runtime/react/${type}`);
     return {
       plugins: [

runtime/vue2/build.vite.config.ts

@@ -35,7 +35,7 @@ export default defineConfig(({ mode }) => {
         sourcemap: true,
         minify: false,
         target: 'esnext',
-        outDir: isAdmin ? `./dist/entry/vue2/${type}` : `../../playground/public/entry/vue2/${type}`,
+        outDir: isAdmin ? `./dist/entry/${type}` : `../../playground/public/entry/vue2/${type}`,
 
         lib: {
           entry: `.tmagic/${type}-entry.ts`,
@@ -49,9 +49,9 @@ export default defineConfig(({ mode }) => {
 
   if (['page', 'playground', 'page:admin', 'playground:admin'].includes(mode)) {
     const [type, isAdmin] = mode.split(':');
-    const base = isAdmin ? `/runtime/${type}/` : `/tmagic-editor/playground/runtime/vue2/${type}`;
+    const base = isAdmin ? `/static/vue2/runtime/${type}/` : `/tmagic-editor/playground/runtime/vue2/${type}`;
     const outDir = isAdmin
-      ? path.resolve(process.cwd(), `./dist/${type}`)
+      ? path.resolve(process.cwd(), `./dist/runtime/${type}`)
       : path.resolve(process.cwd(), `../../playground/public/runtime/vue2/${type}`);
     return {
       plugins: [

runtime/vue3/build.vite.config.ts

@@ -36,7 +36,7 @@ export default defineConfig(({ mode }) => {
         sourcemap: true,
         minify: false,
         target: 'esnext',
-        outDir: isAdmin ? `./dist/entry/vue3/${type}` : `../../playground/public/entry/vue3/${type}`,
+        outDir: isAdmin ? `./dist/entry/${type}` : `../../playground/public/entry/vue3/${type}`,
 
         lib: {
           entry: `.tmagic/${type}-entry.ts`,
@@ -50,9 +50,9 @@ export default defineConfig(({ mode }) => {
 
   if (['page', 'playground', 'page:admin', 'playground:admin'].includes(mode)) {
     const [type, isAdmin] = mode.split(':');
-    const base = isAdmin ? `/runtime/${type}/` : `/tmagic-editor/playground/runtime/vue3/${type}`;
+    const base = isAdmin ? `/static/vue3/runtime/${type}/` : `/tmagic-editor/playground/runtime/vue3/${type}`;
     const outDir = isAdmin
-      ? path.resolve(process.cwd(), `./dist/${type}`)
+      ? path.resolve(process.cwd(), `./dist/runtime/${type}`)
       : path.resolve(process.cwd(), `../../playground/public/runtime/vue3/${type}`);
     return {
       plugins: [