From a9c2590938b2402b7cf78d24cbf8f2e8a03e2365 Mon Sep 17 00:00:00 2001
From: shangbin <shangbin03@meituan.com>
Date: Thu, 20 Jan 2022 10:45:05 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0JS=E9=80=BB=E8=BE=91=E5=B8=AE?=
 =?UTF-8?q?=E5=8A=A9=E5=85=A5=E5=8F=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/JSCodeEditorDialog.vue | 58 +++++++++++----------------
 1 file changed, 24 insertions(+), 34 deletions(-)

diff --git a/src/components/JSCodeEditorDialog.vue b/src/components/JSCodeEditorDialog.vue
index 8484f98..3a36ff1 100644
--- a/src/components/JSCodeEditorDialog.vue
+++ b/src/components/JSCodeEditorDialog.vue
@@ -3,10 +3,17 @@
     :center=true>
     <CodeEditor style="max-height: 65vh;" ref="codeEditor" :initCode="code" mode="text/javascript"></CodeEditor>
 
-    <div style="text-align:center;padding: 10px;">
-      <el-button type="primary" @click="onSave">确认修改</el-button>
-      <div style="color: #6c6c6c; font-size:12px; margin-top:5px;">Tips: 确认修改之后将会影响最终生成的代码逻辑</div>
-      <div v-if="error" style="color: red; font-size:12px; margin-top:5px;">请检查语法错误：{{error}}</div>
+    <div style="padding: 10px; display:flex;justify-content: flex-end;align-items: center;">
+      <div>
+        <el-button type="primary" @click="onSave">确认修改</el-button>
+        <div v-if="error" style="color: red; font-size:12px; margin-top:5px;">请检查语法错误：{{error}}</div>
+      </div>
+
+      <div style="margin-left: 5px;">
+        <el-link href="https://vcc.sahadev.tech/doc/#/improve/logic?id=%e9%80%bb%e8%be%91%e6%a8%a1%e6%9d%bf"
+          target="_blank" icon="el-icon-question">帮助与说明</el-link>
+        <div style="color: #6c6c6c; font-size:12px; margin-top:5px;">Tips: 建议看一下使用说明</div>
+      </div>
     </div>
   </el-dialog>
 
@@ -19,16 +26,7 @@ import CodeEditor from './CodeEditor.vue'
 import prettier from "prettier/standalone";
 import babel from "prettier/parser-babel";
 
-export default {
-  props: ['codeDialogVisible'],
-  components: {
-    CodeEditor
-  },
-
-  data() {
-    return {
-      error: '',
-      code: dedent`
+const example = dedent`
   /**
    *  以下代码中的方法会被注入到最终的代码中，如果命名与源代码有相同的，则会替换源代码
    *  内部集成了axios，开发者可以直接通过axios发起网络请求，不过接口需要允许跨域。
@@ -36,9 +34,6 @@ export default {
    *  axios官方文档：https://www.npmjs.com/package/axios
    */
   {
-      props: [],
-      components: {},
-
       data() {
         return {
 
@@ -57,25 +52,20 @@ export default {
           axios.get('https://apis.sahadev.tech/exchange?url=https://www.baidu.com').then(res => console.info(res), err => console.error(err));
         }
       },
-
-      // 生命周期 start
-      beforeCreate() {},
-      created() {},
-
-      beforeMount() {},
-      mounted() {},
-
-      beforeUpdate() {},
-      updated() {},
-
-      beforeDestory() {},
-      destoryed() {},
-      // 生命周期 end
-
-      fillter: {},
   };
-      
       `
+
+export default {
+  props: ['codeDialogVisible'],
+  components: {
+    CodeEditor
+  },
+
+  data() {
+    return {
+      error: '',
+      code: example,
+      example: `${example}`
     };
   },
   beforeCreate() { },