新增脚本执行动作

src/App.vue

@@ -138,6 +138,9 @@ export default {
                 value: 'el.output',
                 label: '取值'
             }, {
+                value: 'page.javascipt',
+                label: '脚本执行'
+            }, {
                 value: 'collectionTable',
                 label: '采集表'
             }, {
@@ -153,9 +156,6 @@ export default {
                 value: 'mouseMove',
                 label: '鼠标移动'
             }, {
-                value: 'page.javascipt',
-                label: '脚本执行'
-            }, {
                 value: 'submit',
                 label: '提交'
             }, {

src/components/pageJavascript.vue

 <template>
-  <div class="pageJavascipt">页面执行</div>
+  <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: 'pageJavascipt',
+  name: 'pageJavascript',
   components: {},
-  props: {},
+  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
   },
-  created () { },
   mounted () { },
   watch: {},
   computed: {},
-  methods: {},
-}
+  methods: {
+    // 提交表单信息
+    submit () {
+      console.log(this.actionConfig);
+      // 防止父级改变，子级未改变重新赋值
+      this.actionConfig.Name = this.actionName;
+      this.actionConfig.Alias = this.actionType;
+      this.$emit('dataChanged', this.actionConfig);
+    },
+  },
+};
 </script>
-<style lang="scss" scoped></style>
+
\ No newline at end of file
+<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