From 8ca8fde2734308744a867cbfdf2f214d3daf2399 Mon Sep 17 00:00:00 2001
From: konbai <1527468660@qq.com>
Date: Thu, 15 Sep 2022 01:46:26 +0800
Subject: [PATCH] =?UTF-8?q?fix(=E8=A1=A8=E5=8D=95=E6=9E=84=E5=BB=BA):=20?=
 =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E8=A1=A8=E5=8D=95=E8=AE=BE=E8=AE=A1=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E8=BF=90=E8=A1=8C=E6=8A=A5=E9=94=99=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ruoyi-ui/public/preview.html                 | 88 ++++++++++++++++++++
 ruoyi-ui/src/views/tool/build/FormDrawer.vue |  2 +-
 ruoyi-ui/src/views/tool/build/index.vue      | 10 ++-
 3 files changed, 97 insertions(+), 3 deletions(-)
 create mode 100644 ruoyi-ui/public/preview.html
diff --git a/ruoyi-ui/public/preview.html b/ruoyi-ui/public/preview.html
new file mode 100644
index 00000000..173ae0d4
--- /dev/null
+++ b/ruoyi-ui/public/preview.html
@@ -0,0 +1,88 @@
+<!DOCTYPE html>
+<html lang="zh">
+  <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="<%= BASE_URL %>favicon.ico">
+    <title>form-generator-preview</title>
+    <link href="https://lib.baomitu.com/element-ui/2.13.2/theme-chalk/index.css" rel="stylesheet">
+    <script src="https://lib.baomitu.com/vue/2.6.11/vue.min.js"></script>
+    <script src="https://lib.baomitu.com/vue-router/3.1.3/vue-router.min.js"></script>
+    <script src="https://lib.baomitu.com/element-ui/2.13.2/index.js"></script>
+    <style>
+      body{
+        margin: 0;
+        padding: 0;
+        overflow-x: hidden;
+        -moz-osx-font-smoothing: grayscale;
+        -webkit-font-smoothing: antialiased;
+        text-rendering: optimizeLegibility;
+        height: calc(100vh - 33px);
+        padding: 12px;
+        box-sizing: border-box;
+        font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji;
+      }
+      input, textarea{
+        font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji;
+      }
+    </style>
+  </head>
+  <body>
+    <noscript>
+      <strong>抱歉，javascript被禁用，请开启后重试。</strong>
+    </noscript>
+    <div id="previewApp"></div>
+    <script type="text/javascript">
+      const childAttrs = {
+        file: '',
+        dialog: ' width="600px" class="dialog-width" v-if="visible" :visible.sync="visible" :modal-append-to-body="false" '
+      }
+
+      window.addEventListener('message', init, false)
+      function init(event) {
+        if (event.data.type === 'refreshFrame') {
+          const code = event.data.data
+          const attrs = childAttrs[code.generateConf.type]
+          let links = ''
+
+          if (Array.isArray(code.links) && code.links.length > 0) {
+            links = buildLinks(code.links)
+          }
+
+          document.getElementById('previewApp').innerHTML = `${links}<style>${code.css}</style><div id="app"></div>`
+
+          if (Array.isArray(code.scripts) && code.scripts.length > 0) {
+            this.loadScriptQueue(code.scripts, () => {
+              newVue(attrs, code.js, code.html)
+            })
+          } else {
+            newVue(attrs, code.js, code.html)
+          }
+        }
+      }
+      function buildLinks(links) {
+        let strs = ''
+        links.forEach(url => {
+          strs += `<link href="${url}" rel="stylesheet">`
+        })
+        return strs
+      }
+      function newVue(attrs, main, html) {
+        main = eval(`(${main})`)
+        main.template = `<div>${html}</div>`
+        new Vue({
+          components: {
+            child: main
+          },
+          data() {
+            return {
+              visible: true
+            }
+          },
+          template: `<div><child ${attrs}/></div>`
+        }).$mount('#app')
+      }
+    </script>
+  </body>
+</html>
diff --git a/ruoyi-ui/src/views/tool/build/FormDrawer.vue b/ruoyi-ui/src/views/tool/build/FormDrawer.vue
index fc9efec0..50d38bf3 100644
--- a/ruoyi-ui/src/views/tool/build/FormDrawer.vue
+++ b/ruoyi-ui/src/views/tool/build/FormDrawer.vue
@@ -60,7 +60,7 @@
               ref="previewPage"
               class="result-wrapper"
               frameborder="0"
-              src="preview.html"
+              src="/preview.html"
               @load="iframeLoad"
             />
             <div v-show="!isIframeLoaded" v-loading="true" class="result-wrapper" />
diff --git a/ruoyi-ui/src/views/tool/build/index.vue b/ruoyi-ui/src/views/tool/build/index.vue
index 50e46c85..02ed4418 100644
--- a/ruoyi-ui/src/views/tool/build/index.vue
+++ b/ruoyi-ui/src/views/tool/build/index.vue
@@ -456,9 +456,15 @@ export default {
       this.operationType = 'download'
     },
     run() {
-      this.dialogVisible = true
-      this.showFileName = false
+      // TODO 弹窗类型异常
+      // this.dialogVisible = true
+      // this.showFileName = false
       this.operationType = 'run'
+      let data = {
+        fileName: undefined,
+          type: 'file'
+      }
+      this.generate(data);
     },
     copy() {
       this.dialogVisible = true
