优化

src/App.vue

@@ -72,7 +72,7 @@
                             </el-tag>
                         </transition-group>
                     </draggable>
-            
+
                 </div>
             </div>
             <el-divider></el-divider>
@@ -96,10 +96,13 @@
                     </div>
                 </div>
                 <div style="margin-left: 15px;margin-top: 10px;" v-if="activedAction.Alias == 'actions'">
-                    <el-button @click="toActions">进入容器</el-button>
+                    <div style="margin-left: 15px;margin-top: 10px;" v-if="activedAction.Alias == 'actions'">
+                        <el-button @click="toActions">进入容器</el-button>
+                    </div>
+                    <component :is="dynamicComponent" @dataChanged="handleDataChange" :activedAction="activedAction"
+                        v-if="activedAction.Alias !== ''">
+                    </component>
                 </div>
-                <component :is="dynamicComponent" @dataChanged="handleDataChange" :activedAction="activedAction" v-if="activedAction.Alias !== ''">
-                </component>
             </div>
         </div>
     </div>
@@ -176,7 +179,7 @@ export default {
         }
     },
     created () {
-       this.currentAction = this.rootAction;
+        this.currentAction = this.rootAction;
         this.currentActionsParents = [this.rootAction];
     },
     mounted () {
@@ -283,7 +286,7 @@ export default {
             return parents.reverse();
         },
         // 创建新动作
-       createNewAction (parent) {
+        createNewAction (parent) {
             // 创建一个新的动作
             let rtns = {};
             // 设置新动作的名称
@@ -299,6 +302,31 @@ export default {
             // 返回新动作
             return rtns;
         },
+        initActionParent (action) {
+            if (action.actions === null || action.actions === undefined || action.actions.length === 0) return;
+            action.actions.forEach(a => {
+                a.parent = action;
+                this.initActionParent(a);
+            });
+        },
+        getActionParents (action) {
+            let parents = [];
+            parents.push(action);
+            while (action.parent) {
+                parents.push(action.parent);
+                action = action.parent;
+            }
+            return parents.reverse();
+        },
+        createNewAction (parent) {
+            let rtns = {};
+            rtns.Name = "新建动作";
+            rtns.parent = parent;
+            rtns.tagId = this.tagId++;
+            parent.actions = parent.actions || [];
+            parent.actions.push(rtns);
+            return rtns;
+        },
         // 新建动作
         newAction () {
             // 重置actionType
@@ -314,7 +342,7 @@ export default {
 
         },
         // 进入容器
-       toActions () {
+        toActions () {
             let _this = this;
             // 设置当前激活的动作
             _this.currentAction = _this.activedAction;
@@ -323,6 +351,7 @@ export default {
             // 隐藏动作
             _this.isShowAction = false
 
+
         },
         // 动作下拉框
         handleChange (val) {
@@ -354,12 +383,11 @@ export default {
         // 删除标签
         handleClose (tag) {
             let _this = this
-       
             _this.currentAction.actions.splice(_this.currentAction.actions.indexOf(tag), 1);
             console.log(this.rootAction.actions)
             _this.isShowAction = false
         },
-        importJson () {},
+        importJson () { },
         //导出json
         exportJson () {
             // if (key == "privateProperty1") return undefined; else if (key == "privateProperty2") return undefined; else return value; 
@@ -368,7 +396,7 @@ export default {
             // 创建一个Blob对象
             let blob = new Blob([jsonString], { type: 'application/json' });
             // 使用file-saver库保存文件
-            saveAs(blob, this.taskName+'.json');
+            saveAs(blob, this.taskName + '.json');
             console.log(jsonString);
         },
         //开始拖拽事件-标签拖拽

src/components/elclick.vue

@@ -46,7 +46,7 @@ export default {
     },
     created () {
         console.log(this.activedAction);
-        if (this.activedAction.Target!==undefined){
+        if (this.activedAction.Target !== undefined) {
             this.actionConfig.Target = this.activedAction.Target;
         }
     },

src/components/pageJavascript.vue

+<template>
+  <div class="pageJavascript">
+    <!-- 表单区域 -->
+    <el-form label-position="right" label-width="120px" :model="actionConfig">
+      <el-form-item label="JavaScript脚本">
+        <el-input type="textarea" :rows="3" v-model="actionConfig.Script"></el-input>
+      </el-form-item>
+    </el-form>
+    <!-- 提交按钮 -->
+    <el-button size="small" class="button-new-tag" @click="submit" style="position: absolute;bottom: 10px;right: 15px;">提交信息</el-button>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'pageJavascript',
+  components: {},
+  props: ['actionName', 'actionType', 'dynamicTagObj'],
+  data () {
+    return {
+      elementInfos: {}, // 存储当前选中元素的信息
+      actionConfig: {
+        "Script": "",
+        "Name": this.actionName,
+        "Alias": this.actionType
+      },
+    };
+  },
+  created () {
+    console.log(this.dynamicTagObj);
+    if (Object.keys(this.dynamicTagObj.actionConfigs).length == 0) return
+    this.actionConfig = this.dynamicTagObj.actionConfigs
+  },
+  mounted () { },
+  watch: {},
+  computed: {},
+  methods: {
+    // 提交表单信息
+    submit () {
+      console.log(this.actionConfig);
+      // 防止父级改变，子级未改变重新赋值
+      this.actionConfig.Name = this.actionName;
+      this.actionConfig.Alias = this.actionType;
+      this.$emit('dataChanged', this.actionConfig);
+    },
+  },
+};
+</script>
+
+<style scoped>
+.el-form-item {
+  margin-bottom: 0;
+  padding-top: 20px;
+  margin-right: 15px;
+}
+
+.tooltips button {
+  width: 60px !important;
+  height: 30px !important;
+}
+</style>
\ No newline at end of file