@lcap/nasl 1.0.0-alpha → 1.0.0-alpha.3

package/src/concepts/View__.ts

@@ -1,6 +1,6 @@
 import Namespace from './Namespace__';
 import { TranslatorState, shiftState, withSourceMap, indent, createCompilerState } from '../translator';
-import translator from '../../bak/translator';
+import translator from '../bak/translator';
 import Role from './Role__';
 import { ElementToVueOptions } from './ViewElement__';
 import { Structure } from './Structure__';
@@ -12,13 +12,14 @@ import { EventPayload, Params } from '../common/EventEmitter';
 import { concept, excludedInJSON, property } from '../decorators';
 
 import * as utils from '../utils';
+import { v4 as uuidv4 } from 'uuid';
 import BaseNode from '../common/BaseNode';
 import classMap from '../common/classMap';
 import ViewElement from './ViewElement__';
 import Param from './Param__';
 import Variable from './Variable__';
-import BindEvent from './BindEvent__';
 import Logic from './Logic__';
+import BindEvent from './BindEvent__';
 import Module from './Module__';
 import App from './App__';
 
@@ -46,10 +47,10 @@ export class View extends BaseNode {
     name: string = undefined;
 
     /**
-     * 前后端路径
+     * 唯一标识
      */
     @property()
-    tempPath: string = undefined;
+    uuid: string = undefined;
 
     /**
      * 页面标题
@@ -111,18 +112,18 @@ export class View extends BaseNode {
     @property('Variable')
     variables: Array<Variable> = [];
 
-    /**
-     * 元素绑定事件列表
-     */
-    @property('BindEvent')
-    events: Array<BindEvent> = [];
-
     /**
      * 逻辑列表
      */
     @property('Logic')
     logics: Array<Logic> = [];
 
+    /**
+     * 元素绑定事件列表
+     */
+    @property('BindEvent')
+    bindEvents: Array<BindEvent> = [];
+
     /**
      * 绑定的角色
      */
@@ -233,9 +234,7 @@ export class View extends BaseNode {
         });
     }
 
-        getViewElementUniqueName(name = 'viewElement1') {
-        return utils.unique(name, this.getViewElementExistingNames());
-    }
+    
 
     /**
     * 插入页面元素
@@ -266,22 +265,22 @@ export class View extends BaseNode {
             viewElement = ViewElement.from({
                 ...viewElementOptions,
                 name: this.getViewElementUniqueName(),
-            }, this);
+            }, this, 'elements');
         } else if (typeof options === 'string') {
             viewElement = ViewElement.from({
                 ...viewElementOptions,
                 name: options,
-            }, this);
+            }, this, 'elements');
         } else if (options instanceof ViewElement) {
             options.delete(); // 同一实例不支持多处存在
             viewElement = options;
+            Object.assign(viewElement, relationOptions);
         } else {
             viewElement = ViewElement.from({
                 ...viewElementOptions,
                 ...options,
-            }, this);
+            }, this, 'elements');
         }
-        Object.assign(viewElement, relationOptions);
         this.elements.splice(index, 0, viewElement);
         return viewElement;
     }
@@ -373,7 +372,7 @@ export class View extends BaseNode {
 
     getParamExistingNames(excludedList: Array<Param> = []) {
         const excludedSet = new Set(excludedList);
-        return this.params.filter((item) => !excludedSet.has(item)).map((item) => item.name);
+        return (this.params || []).filter((item) => !excludedSet.has(item)).map((item) => item.name);
     }
     getParamUniqueName(name = 'param1') {
         return utils.unique(name, this.getParamExistingNames());
@@ -408,22 +407,22 @@ export class View extends BaseNode {
             param = Param.from({
                 ...paramOptions,
                 name: this.getParamUniqueName(),
-            }, this);
+            }, this, 'params');
         } else if (typeof options === 'string') {
             param = Param.from({
                 ...paramOptions,
                 name: options,
-            }, this);
+            }, this, 'params');
         } else if (options instanceof Param) {
             options.delete(); // 同一实例不支持多处存在
             param = options;
+            Object.assign(param, relationOptions);
         } else {
             param = Param.from({
                 ...paramOptions,
                 ...options,
-            }, this);
+            }, this, 'params');
         }
-        Object.assign(param, relationOptions);
         this.params.splice(index, 0, param);
         return param;
     }
@@ -515,7 +514,7 @@ export class View extends BaseNode {
 
     getVariableExistingNames(excludedList: Array<Variable> = []) {
         const excludedSet = new Set(excludedList);
-        return this.variables.filter((item) => !excludedSet.has(item)).map((item) => item.name);
+        return (this.variables || []).filter((item) => !excludedSet.has(item)).map((item) => item.name);
     }
     getVariableUniqueName(name = 'variable1') {
         return utils.unique(name, this.getVariableExistingNames());
@@ -550,22 +549,22 @@ export class View extends BaseNode {
             variable = Variable.from({
                 ...variableOptions,
                 name: this.getVariableUniqueName(),
-            }, this);
+            }, this, 'variables');
         } else if (typeof options === 'string') {
             variable = Variable.from({
                 ...variableOptions,
                 name: options,
-            }, this);
+            }, this, 'variables');
         } else if (options instanceof Variable) {
             options.delete(); // 同一实例不支持多处存在
             variable = options;
+            Object.assign(variable, relationOptions);
         } else {
             variable = Variable.from({
                 ...variableOptions,
                 ...options,
-            }, this);
+            }, this, 'variables');
         }
-        Object.assign(variable, relationOptions);
         this.variables.splice(index, 0, variable);
         return variable;
     }
@@ -655,285 +654,285 @@ export class View extends BaseNode {
     }
 
 
-    getBindEventExistingNames(excludedList: Array<BindEvent> = []) {
+    getLogicExistingNames(excludedList: Array<Logic> = []) {
         const excludedSet = new Set(excludedList);
-        return this.events.filter((item) => !excludedSet.has(item)).map((item) => item.name);
+        return (this.logics || []).filter((item) => !excludedSet.has(item)).map((item) => item.name);
     }
-    getBindEventUniqueName(name = 'bindEvent1') {
-        return utils.unique(name, this.getBindEventExistingNames());
+    getLogicUniqueName(name = 'logic1') {
+        return utils.unique(name, this.getLogicExistingNames());
     }
 
     /**
-    * 插入元素绑定事件
+    * 插入逻辑
     * @internal
-    * @param name 元素绑定事件名称，如果不填会自动生成一个唯一名称
+    * @param name 逻辑名称，如果不填会自动生成一个唯一名称
     */
-    _insertBindEventAt(name: string, index: number): BindEvent;
+    _insertLogicAt(name: string, index: number): Logic;
 
     /**
-    * 插入元素绑定事件
+    * 插入逻辑
     * @internal
-    * @param bindEventOptions 元素绑定事件参数
+    * @param logicOptions 逻辑参数
     */
-    _insertBindEventAt(bindEventOptions: Partial<BindEvent>, index: number): BindEvent;
+    _insertLogicAt(logicOptions: Partial<Logic>, index: number): Logic;
 
     /**
-    * 插入元素绑定事件
+    * 插入逻辑
     * @internal
-    * @param bindEvent 已有的元素绑定事件实例
+    * @param logic 已有的逻辑实例
     */
-    _insertBindEventAt(bindEvent: BindEvent, index: number): BindEvent;
+    _insertLogicAt(logic: Logic, index: number): Logic;
 
-    _insertBindEventAt(options: string | Partial<BindEvent> | BindEvent, index: number) {
-        const bindEventOptions: any = {};
-        const relationOptions = { parentNode: this, parentKey: 'events' };
-        let bindEvent: BindEvent;
+    _insertLogicAt(options: string | Partial<Logic> | Logic, index: number) {
+        const logicOptions: any = {};
+        const relationOptions = { parentNode: this, parentKey: 'logics' };
+        let logic: Logic;
         if (!options) {
-            bindEvent = BindEvent.from({
-                ...bindEventOptions,
-                name: this.getBindEventUniqueName(),
-            }, this);
+            logic = Logic.from({
+                ...logicOptions,
+                name: this.getLogicUniqueName(),
+            }, this, 'logics');
         } else if (typeof options === 'string') {
-            bindEvent = BindEvent.from({
-                ...bindEventOptions,
+            logic = Logic.from({
+                ...logicOptions,
                 name: options,
-            }, this);
-        } else if (options instanceof BindEvent) {
+            }, this, 'logics');
+        } else if (options instanceof Logic) {
             options.delete(); // 同一实例不支持多处存在
-            bindEvent = options;
+            logic = options;
+            Object.assign(logic, relationOptions);
         } else {
-            bindEvent = BindEvent.from({
-                ...bindEventOptions,
+            logic = Logic.from({
+                ...logicOptions,
                 ...options,
-            }, this);
+            }, this, 'logics');
         }
-        Object.assign(bindEvent, relationOptions);
-        this.events.splice(index, 0, bindEvent);
-        return bindEvent;
+        this.logics.splice(index, 0, logic);
+        return logic;
     }
 
     /**
-     * 插入元素绑定事件
-     * @param name 元素绑定事件名称，如果不填会自动生成一个唯一名称
+     * 插入逻辑
+     * @param name 逻辑名称，如果不填会自动生成一个唯一名称
      */
-    insertBindEventAt(name: string, index: number): BindEvent;
+    insertLogicAt(name: string, index: number): Logic;
 
     /**
-     * 插入元素绑定事件
-     * @param bindEventOptions 元素绑定事件参数
+     * 插入逻辑
+     * @param logicOptions 逻辑参数
      */
-    insertBindEventAt(bindEventOptions: Partial<BindEvent>, index: number): BindEvent;
+    insertLogicAt(logicOptions: Partial<Logic>, index: number): Logic;
 
     /**
-     * 插入元素绑定事件
-     * @param bindEvent 已有的元素绑定事件实例
+     * 插入逻辑
+     * @param logic 已有的逻辑实例
      */
-    insertBindEventAt(bindEvent: BindEvent, index: number): BindEvent;
+    insertLogicAt(logic: Logic, index: number): Logic;
 
-    insertBindEventAt(options: string | Partial<BindEvent> | BindEvent, index: number) {
-        const node = this._insertBindEventAt(options as any, index);
+    insertLogicAt(options: string | Partial<Logic> | Logic, index: number) {
+        const node = this._insertLogicAt(options as any, index);
         node.create({
             index,
             parentNode: this,
-            parentKey: 'events',
+            parentKey: 'logics',
         });
         return node;
     }
 
     /**
-     * 添加元素绑定事件
+     * 添加逻辑
      * @internal
-     * @param name 元素绑定事件名称，如果不填会自动生成一个唯一名称
+     * @param name 逻辑名称，如果不填会自动生成一个唯一名称
      */
-    _addBindEvent(name?: string): BindEvent;
+    _addLogic(name?: string): Logic;
 
     /**
-     * 添加元素绑定事件
+     * 添加逻辑
      * @internal
-     * @param bindEventOptions 元素绑定事件参数
+     * @param logicOptions 逻辑参数
      */
-    _addBindEvent(bindEventOptions: Partial<BindEvent>): BindEvent;
+    _addLogic(logicOptions: Partial<Logic>): Logic;
 
     /**
-     * 添加元素绑定事件
+     * 添加逻辑
      * @internal
-     * @param bindEvent 已有的元素绑定事件实例
+     * @param logic 已有的逻辑实例
      */
-    _addBindEvent(bindEvent: BindEvent): BindEvent;
+    _addLogic(logic: Logic): Logic;
 
-    _addBindEvent(options?: string | Partial<BindEvent> | BindEvent) {
-        const index = this.events.length;
-        return this._insertBindEventAt(options as any, index);
+    _addLogic(options?: string | Partial<Logic> | Logic) {
+        const index = this.logics.length;
+        return this._insertLogicAt(options as any, index);
     }
 
     /**
-     * 添加元素绑定事件
+     * 添加逻辑
      * @internal
-     * @param name 元素绑定事件名称，如果不填会自动生成一个唯一名称
+     * @param name 逻辑名称，如果不填会自动生成一个唯一名称
      */
-    addBindEvent(name?: string): BindEvent;
+    addLogic(name?: string): Logic;
 
     /**
-     * 添加元素绑定事件
-     * @param bindEventOptions 元素绑定事件参数
+     * 添加逻辑
+     * @param logicOptions 逻辑参数
      */
-    addBindEvent(bindEventOptions: Partial<BindEvent>): BindEvent;
+    addLogic(logicOptions: Partial<Logic>): Logic;
 
     /**
-     * 添加元素绑定事件
-     * @param bindEvent 已有的元素绑定事件实例
+     * 添加逻辑
+     * @param logic 已有的逻辑实例
      */
-    addBindEvent(bindEvent: BindEvent): BindEvent;
+    addLogic(logic: Logic): Logic;
 
-    addBindEvent(options?: string | Partial<BindEvent> | BindEvent) {
-        const node = this._addBindEvent(options as any);
-        const index = this.events.length;
+    addLogic(options?: string | Partial<Logic> | Logic) {
+        const node = this._addLogic(options as any);
+        const index = this.logics.length;
         node.create({
             index,
             parentNode: this,
-            parentKey: 'events',
+            parentKey: 'logics',
         });
         return node;
     }
 
 
-    getLogicExistingNames(excludedList: Array<Logic> = []) {
+    getBindEventExistingNames(excludedList: Array<BindEvent> = []) {
         const excludedSet = new Set(excludedList);
-        return this.logics.filter((item) => !excludedSet.has(item)).map((item) => item.name);
+        return (this.bindEvents || []).filter((item) => !excludedSet.has(item)).map((item) => item.name);
     }
-    getLogicUniqueName(name = 'logic1') {
-        return utils.unique(name, this.getLogicExistingNames());
+    getBindEventUniqueName(name = 'bindEvent1') {
+        return utils.unique(name, this.getBindEventExistingNames());
     }
 
     /**
-    * 插入逻辑
+    * 插入元素绑定事件
     * @internal
-    * @param name 逻辑名称，如果不填会自动生成一个唯一名称
+    * @param name 元素绑定事件名称，如果不填会自动生成一个唯一名称
     */
-    _insertLogicAt(name: string, index: number): Logic;
+    _insertBindEventAt(name: string, index: number): BindEvent;
 
     /**
-    * 插入逻辑
+    * 插入元素绑定事件
     * @internal
-    * @param logicOptions 逻辑参数
+    * @param bindEventOptions 元素绑定事件参数
     */
-    _insertLogicAt(logicOptions: Partial<Logic>, index: number): Logic;
+    _insertBindEventAt(bindEventOptions: Partial<BindEvent>, index: number): BindEvent;
 
     /**
-    * 插入逻辑
+    * 插入元素绑定事件
     * @internal
-    * @param logic 已有的逻辑实例
+    * @param bindEvent 已有的元素绑定事件实例
     */
-    _insertLogicAt(logic: Logic, index: number): Logic;
+    _insertBindEventAt(bindEvent: BindEvent, index: number): BindEvent;
 
-    _insertLogicAt(options: string | Partial<Logic> | Logic, index: number) {
-        const logicOptions: any = {};
-        const relationOptions = { parentNode: this, parentKey: 'logics' };
-        let logic: Logic;
+    _insertBindEventAt(options: string | Partial<BindEvent> | BindEvent, index: number) {
+        const bindEventOptions: any = {};
+        const relationOptions = { parentNode: this, parentKey: 'bindEvents' };
+        let bindEvent: BindEvent;
         if (!options) {
-            logic = Logic.from({
-                ...logicOptions,
-                name: this.getLogicUniqueName(),
-            }, this);
+            bindEvent = BindEvent.from({
+                ...bindEventOptions,
+                name: this.getBindEventUniqueName(),
+            }, this, 'bindEvents');
         } else if (typeof options === 'string') {
-            logic = Logic.from({
-                ...logicOptions,
+            bindEvent = BindEvent.from({
+                ...bindEventOptions,
                 name: options,
-            }, this);
-        } else if (options instanceof Logic) {
+            }, this, 'bindEvents');
+        } else if (options instanceof BindEvent) {
             options.delete(); // 同一实例不支持多处存在
-            logic = options;
+            bindEvent = options;
+            Object.assign(bindEvent, relationOptions);
         } else {
-            logic = Logic.from({
-                ...logicOptions,
+            bindEvent = BindEvent.from({
+                ...bindEventOptions,
                 ...options,
-            }, this);
+            }, this, 'bindEvents');
         }
-        Object.assign(logic, relationOptions);
-        this.logics.splice(index, 0, logic);
-        return logic;
+        this.bindEvents.splice(index, 0, bindEvent);
+        return bindEvent;
     }
 
     /**
-     * 插入逻辑
-     * @param name 逻辑名称，如果不填会自动生成一个唯一名称
+     * 插入元素绑定事件
+     * @param name 元素绑定事件名称，如果不填会自动生成一个唯一名称
      */
-    insertLogicAt(name: string, index: number): Logic;
+    insertBindEventAt(name: string, index: number): BindEvent;
 
     /**
-     * 插入逻辑
-     * @param logicOptions 逻辑参数
+     * 插入元素绑定事件
+     * @param bindEventOptions 元素绑定事件参数
      */
-    insertLogicAt(logicOptions: Partial<Logic>, index: number): Logic;
+    insertBindEventAt(bindEventOptions: Partial<BindEvent>, index: number): BindEvent;
 
     /**
-     * 插入逻辑
-     * @param logic 已有的逻辑实例
+     * 插入元素绑定事件
+     * @param bindEvent 已有的元素绑定事件实例
      */
-    insertLogicAt(logic: Logic, index: number): Logic;
+    insertBindEventAt(bindEvent: BindEvent, index: number): BindEvent;
 
-    insertLogicAt(options: string | Partial<Logic> | Logic, index: number) {
-        const node = this._insertLogicAt(options as any, index);
+    insertBindEventAt(options: string | Partial<BindEvent> | BindEvent, index: number) {
+        const node = this._insertBindEventAt(options as any, index);
         node.create({
             index,
             parentNode: this,
-            parentKey: 'logics',
+            parentKey: 'bindEvents',
         });
         return node;
     }
 
     /**
-     * 添加逻辑
+     * 添加元素绑定事件
      * @internal
-     * @param name 逻辑名称，如果不填会自动生成一个唯一名称
+     * @param name 元素绑定事件名称，如果不填会自动生成一个唯一名称
      */
-    _addLogic(name?: string): Logic;
+    _addBindEvent(name?: string): BindEvent;
 
     /**
-     * 添加逻辑
+     * 添加元素绑定事件
      * @internal
-     * @param logicOptions 逻辑参数
+     * @param bindEventOptions 元素绑定事件参数
      */
-    _addLogic(logicOptions: Partial<Logic>): Logic;
+    _addBindEvent(bindEventOptions: Partial<BindEvent>): BindEvent;
 
     /**
-     * 添加逻辑
+     * 添加元素绑定事件
      * @internal
-     * @param logic 已有的逻辑实例
+     * @param bindEvent 已有的元素绑定事件实例
      */
-    _addLogic(logic: Logic): Logic;
+    _addBindEvent(bindEvent: BindEvent): BindEvent;
 
-    _addLogic(options?: string | Partial<Logic> | Logic) {
-        const index = this.logics.length;
-        return this._insertLogicAt(options as any, index);
+    _addBindEvent(options?: string | Partial<BindEvent> | BindEvent) {
+        const index = this.bindEvents.length;
+        return this._insertBindEventAt(options as any, index);
     }
 
     /**
-     * 添加逻辑
+     * 添加元素绑定事件
      * @internal
-     * @param name 逻辑名称，如果不填会自动生成一个唯一名称
+     * @param name 元素绑定事件名称，如果不填会自动生成一个唯一名称
      */
-    addLogic(name?: string): Logic;
+    addBindEvent(name?: string): BindEvent;
 
     /**
-     * 添加逻辑
-     * @param logicOptions 逻辑参数
+     * 添加元素绑定事件
+     * @param bindEventOptions 元素绑定事件参数
      */
-    addLogic(logicOptions: Partial<Logic>): Logic;
+    addBindEvent(bindEventOptions: Partial<BindEvent>): BindEvent;
 
     /**
-     * 添加逻辑
-     * @param logic 已有的逻辑实例
+     * 添加元素绑定事件
+     * @param bindEvent 已有的元素绑定事件实例
      */
-    addLogic(logic: Logic): Logic;
+    addBindEvent(bindEvent: BindEvent): BindEvent;
 
-    addLogic(options?: string | Partial<Logic> | Logic) {
-        const node = this._addLogic(options as any);
-        const index = this.logics.length;
+    addBindEvent(options?: string | Partial<BindEvent> | BindEvent) {
+        const node = this._addBindEvent(options as any);
+        const index = this.bindEvents.length;
         node.create({
             index,
             parentNode: this,
-            parentKey: 'logics',
+            parentKey: 'bindEvents',
         });
         return node;
     }
@@ -943,7 +942,7 @@ export class View extends BaseNode {
 
     getViewExistingNames(excludedList: Array<View> = []) {
         const excludedSet = new Set(excludedList);
-        return this.children.filter((item) => !excludedSet.has(item)).map((item) => item.name);
+        return (this.children || []).filter((item) => !excludedSet.has(item)).map((item) => item.name);
     }
     getViewUniqueName(name = 'view1') {
         return utils.unique(name, this.getViewExistingNames());
@@ -978,22 +977,22 @@ export class View extends BaseNode {
             view = View.from({
                 ...viewOptions,
                 name: this.getViewUniqueName(),
-            }, this);
+            }, this, 'children');
         } else if (typeof options === 'string') {
             view = View.from({
                 ...viewOptions,
                 name: options,
-            }, this);
+            }, this, 'children');
         } else if (options instanceof View) {
             options.delete(); // 同一实例不支持多处存在
             view = options;
+            Object.assign(view, relationOptions);
         } else {
             view = View.from({
                 ...viewOptions,
                 ...options,
-            }, this);
+            }, this, 'children');
         }
-        Object.assign(view, relationOptions);
         this.children.splice(index, 0, view);
         return view;
     }
@@ -1236,46 +1235,46 @@ export class View extends BaseNode {
 
 
     /**
-    * 删除元素绑定事件
-    * @param name 元素绑定事件名称
+    * 删除逻辑
+    * @param name 逻辑名称
     */
-    removeBindEvent(name: string): void;
+    removeLogic(name: string): void;
 
     /**
-     * 删除元素绑定事件
-     * @param bindEvent 已有的元素绑定事件实例
+     * 删除逻辑
+     * @param logic 已有的逻辑实例
      */
-    removeBindEvent(bindEvent: BindEvent): void;
+    removeLogic(logic: Logic): void;
 
-    removeBindEvent(options: string | BindEvent) {
-        let bindEvent: BindEvent;
+    removeLogic(options: string | Logic) {
+        let logic: Logic;
         if (typeof options === 'string') {
-            bindEvent = this.events.find((item) => item.name === options);
-            if (!bindEvent) {
-                throw new Error('找不到元素绑定事件 ' + options);
+            logic = this.logics.find((item) => item.name === options);
+            if (!logic) {
+                throw new Error('找不到逻辑 ' + options);
             }
         } else {
-            bindEvent = options;
+            logic = options;
         }
-        return bindEvent.delete();
+        return logic.delete();
     }
 
-    __removeBindEvent(bindEvent: BindEvent) {
-        const parentKey = bindEvent.parentKey;
+    __removeLogic(logic: Logic) {
+        const parentKey = logic.parentKey;
         const params: Params = {
             parentNode: this,
             parentKey,
             index: -1,
             object: null,
-            oldObject: bindEvent,
+            oldObject: logic,
         };
         if (parentKey) {
             params.parentKey = parentKey;
             if (Array.isArray((this as any)[parentKey])) {
-                const index = (this as any)[parentKey].indexOf(bindEvent);
+                const index = (this as any)[parentKey].indexOf(logic);
                 ~index && (this as any)[parentKey].splice(index, 1);
                 params.index = index;
-            } else if ((this as any)[parentKey] === bindEvent) {
+            } else if ((this as any)[parentKey] === logic) {
                 params.index = 0;
                 (this as any)[parentKey] = undefined;
             }
@@ -1286,46 +1285,46 @@ export class View extends BaseNode {
 
 
     /**
-    * 删除逻辑
-    * @param name 逻辑名称
+    * 删除元素绑定事件
+    * @param name 元素绑定事件名称
     */
-    removeLogic(name: string): void;
+    removeBindEvent(name: string): void;
 
     /**
-     * 删除逻辑
-     * @param logic 已有的逻辑实例
+     * 删除元素绑定事件
+     * @param bindEvent 已有的元素绑定事件实例
      */
-    removeLogic(logic: Logic): void;
+    removeBindEvent(bindEvent: BindEvent): void;
 
-    removeLogic(options: string | Logic) {
-        let logic: Logic;
+    removeBindEvent(options: string | BindEvent) {
+        let bindEvent: BindEvent;
         if (typeof options === 'string') {
-            logic = this.logics.find((item) => item.name === options);
-            if (!logic) {
-                throw new Error('找不到逻辑 ' + options);
+            bindEvent = this.bindEvents.find((item) => item.name === options);
+            if (!bindEvent) {
+                throw new Error('找不到元素绑定事件 ' + options);
             }
         } else {
-            logic = options;
+            bindEvent = options;
         }
-        return logic.delete();
+        return bindEvent.delete();
     }
 
-    __removeLogic(logic: Logic) {
-        const parentKey = logic.parentKey;
+    __removeBindEvent(bindEvent: BindEvent) {
+        const parentKey = bindEvent.parentKey;
         const params: Params = {
             parentNode: this,
             parentKey,
             index: -1,
             object: null,
-            oldObject: logic,
+            oldObject: bindEvent,
         };
         if (parentKey) {
             params.parentKey = parentKey;
             if (Array.isArray((this as any)[parentKey])) {
-                const index = (this as any)[parentKey].indexOf(logic);
+                const index = (this as any)[parentKey].indexOf(bindEvent);
                 ~index && (this as any)[parentKey].splice(index, 1);
                 params.index = index;
-            } else if ((this as any)[parentKey] === logic) {
+            } else if ((this as any)[parentKey] === bindEvent) {
                 params.index = 0;
                 (this as any)[parentKey] = undefined;
             }
@@ -1424,12 +1423,12 @@ export class View extends BaseNode {
         return Array.from(this.existingViewElement);
     }
 
-    // getViewElementUniqueName(name = 'viewElement1') {
-    //     this.collectExistingViewElementName();
-    //     const viewElementUniqueName = utils.unique(name, this.existingViewElement);
-    //     this.existingViewElement.add(viewElementUniqueName);
-    //     return viewElementUniqueName;
-    // }
+    getViewElementUniqueName(name = 'viewElement1') {
+        this.collectExistingViewElementName();
+        const viewElementUniqueName = utils.unique(name, this.existingViewElement);
+        this.existingViewElement.add(viewElementUniqueName);
+        return viewElementUniqueName;
+    }
 
     // 组件名是否有效
     isValidElementName(name: string): boolean {
@@ -1587,7 +1586,7 @@ export class View extends BaseNode {
             params: this.params,
             variables: this.variables,
             logics: this.logics,
-            events: this.events,
+            events: this.bindEvents,
             title: this.title,
             crumb: this.crumb,
             first: this.isIndex,
@@ -1613,16 +1612,16 @@ export class View extends BaseNode {
      * 转换成设计器中使用的 Vue template 内容
      * @param options
      */
-    genDesignerVueTemplate(options?: ElementToVueOptions) {
-        return this.elements.map((element) => element.toDesignerVue(options) + '\n').join('');
+    genDesignerVueTemplate() {
+        return this.elements.map((element) => element.toDesignerVue() + '\n').join('');
     }
     /**
      * 转换成设计器中使用的 Vue 文件
      * 目前不需要 script 和 style
      * @param options
      */
-    toDesignerVue(options?: ElementToVueOptions) {
-        return `<template>\n${this.genDesignerVueTemplate(options)}</template>`;
+    toDesignerVue() {
+        return `<template>\n${this.genDesignerVueTemplate()}</template>`;
     }
     /**
      * 转换成 VueOptions
@@ -1639,7 +1638,15 @@ export class View extends BaseNode {
      * @param name 一般不用传，用于 rename
      */
     getEmbeddedFilePath(name = this.name) {
-        return `/embedded/${this.app.name}/views/${name}.ts`;
+        let pathName = name;
+        let parent = this.parentNode;
+        if (parent) {
+            while (parent && parent instanceof View) {
+                pathName = parent.name + '/' + pathName;
+                parent = parent.parentNode;
+            }
+        }
+        return `/embedded/${this.app.name}/views/${pathName}.ts`;
     }
 
     getNamespace(): string {
@@ -1648,15 +1655,45 @@ export class View extends BaseNode {
             if (this.parentNode.concept === 'View') {
                 parentNodeNamespace = `${(this.parentNode as View).getNamespace()}.${this.parentNode.name}`;
             }
-            return `${parentNodeNamespace}.${this.parentNode.concept === this.concept ? 'children' : 'views'}`;
+            return `${parentNodeNamespace}.views`;
         } else
             throw new Error('无法获取命名空间，请设置 parentNode！');
     }
 
+    get tsName() {
+        let tsName = this.name;
+        if (/^\d/.test(tsName)) {
+            tsName = '$' + tsName;
+        }
+        // 匹配所有特殊字符都转为_
+        tsName = tsName.replace(/\W/g, '_');
+        return tsName;
+    }
+    // 获取当前element，铺平
+    elementsMethods(elements: Array<ViewElement>, allMethods: Array<ViewElement>) {
+        if (elements) {
+            elements.forEach((item: ViewElement) => {
+                allMethods.push(item);
+                if (item.children) {
+                    this.elementsMethods(item.children, allMethods);
+                }
+            });
+        }
+    }
+
     @withSourceMap()
-    toEmbeddedTS(state?: TranslatorState, parentName?: string): string {
-        const currentName = `${parentName ? parentName + '.children.' : ''}${this.name}`;
-        let code = `export namespace ${currentName} {\n`;
+    toEmbeddedTS(state?: TranslatorState): string {
+        function chineseTsName(name: string) {
+            let tsName = name;
+            if (/^\d/.test(tsName)) {
+                tsName = '$' + tsName;
+            }
+            // 匹配所有特殊字符都转为_
+            tsName = tsName.replace(/\W/g, '_');
+            return tsName;
+        }
+
+        let code = `export namespace ${this.tsName} {\n`;
         // 角色
         // if (this.auth && Array.isArray(this.roles) && this.roles.length) {
         //     code += indent(state.tabSize + 1);
@@ -1675,7 +1712,7 @@ export class View extends BaseNode {
             code += 'export let bindRoles = [\n';
             this.bindRoles.forEach((role) => {
                 code += indent(state.tabSize + 1);
-                code += `${this.app.getNamespace()}.roles.${role}.${role},`;
+                code += `${this.app.getNamespace()}.roles.${chineseTsName(role)}.${chineseTsName(role)},`;
                 code += '\n';
             });
             code += '\n';
@@ -1720,36 +1757,37 @@ export class View extends BaseNode {
             code += '}\n';
         }
         // 事件
-        if (Array.isArray(this.events) && this.events.length) {
-            this.events.forEach((event) => {
-                code += event.toEmbeddedTS(shiftState(state, code, {
-                    tabSize: state.tabSize,
-                }));
-                code += '\n';
-            });
-        }
+        // bindEvent暂时不用生成，生成就会校验参数
+        // if (Array.isArray(this.events) && this.events.length) {
+        //     this.events.forEach((event) => {
+        //         code += event.toObjectTS(shiftState(state, code, {
+        //             tabSize: state.tabSize,
+        //         }));
+        //         code += '\n';
+        //     });
+        // }
 
         // render函数
         code += '\n' + indent(state.tabSize + 1);
         code += `export function __render(`;
         code += `){\n`;
-        code += indent(state.tabSize + 1);
+        code += indent(state.tabSize);
 
         // elements 元素
-        // if (Array.isArray(this.elements)) {
-        //     // 生成嵌套式的内容
-        //     this.elements.forEach((element) => {
-        //         code += element.toEmbeddedTS(shiftState(state, code, {
-        //             tabSize: state.tabSize + 3,
-        //         }));
-        //         code += '\n';
-        //     });
-        // }
+        if (Array.isArray(this.elements)) {
+            // 生成嵌套式的内容
+            this.elements.forEach((element) => {
+                code += element.toEmbeddedTS(shiftState(state, code, {
+                    tabSize: state.tabSize + 3,
+                }));
+                code += '\n';
+            });
+        }
 
         code += '\n' + indent(state.tabSize + 1) + '}\n';
 
         if (Array.isArray(this.params)) {
-            code += indent(state.tabSize + 1) + `export function destination(`;
+            code += indent(state.tabSize + 1) + `export function $destination(`;
             this.params.forEach((param, index) => {
                 code += `${param.toEmbeddedTS(shiftState(state, code, { inline: true }))}`;
                 if (index !== this.params.length - 1)
@@ -1758,14 +1796,6 @@ export class View extends BaseNode {
             code += '){}\n';
         }
         code += indent(state.tabSize) + '}\n';
-        // 子页面
-        if (Array.isArray(this.children)) {
-            this.children.forEach((child) => {
-                code += child.toEmbeddedTS(shiftState(state, code), currentName);
-                code += '\n';
-            });
-        }
-
         return code;
     }
 
@@ -1800,6 +1830,23 @@ export class View extends BaseNode {
         return path;
     }
 
+    /**
+     * @param path 子路径
+     * 比如当前页面路径为：/dashboard
+     * path 为要查找子路径：如 /student/list、student/list
+     */
+    findViewByPath(path: string): View {
+        const arr = path.split('/');
+        if (arr[0] === '')
+            arr.shift();
+
+        if (!arr.length)
+            return this;
+        const childName = arr.shift();
+        const subView = this.children.find((child) => child.name === childName);
+        return arr.length ? subView.findViewByPath(arr.join('/')) : subView;
+    }
+
     _setAsIndexView(isIndex: boolean) {
         let views: View[] = [];
         if (this.parentNode.concept !== 'View') {