@lcap/nasl 3.3.0-beta.0 → 3.4.0-alpha.1

package/src/concepts/BindDirective__.ts

@@ -1,18 +1,18 @@
-import { TranslatorState, shiftState, withSourceMap } from '../translator';
-import { ElementToVueOptions } from './ViewElement__';
+import { v4 as uuidv4 } from 'uuid';
+import { TranslatorState, shiftState, withSourceMap, createCompilerState } from '../translator';
+import ViewElement, { ElementToVueOptions } from './ViewElement__';
 import MemberExpression from './MemberExpression__';
-//================================================================================
+//= ===============================================================================
 // 从这里开始到结尾注释之间的代码由 NASL Workbench 自动生成，请不手动修改！
 // ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓
-//================================================================================
+//= ===============================================================================
 import { EventPayload, Params } from '../common/EventEmitter';
-import { concept, excludedInJSON, property, className } from '../decorators';
+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 LogicItem from './LogicItem__';
-import ViewElement from './ViewElement__';
 import View from './View__';
 import Module from './Module__';
 import App from './App__';
@@ -21,67 +21,55 @@ import Frontend from './Frontend__';
 /**
  * 元素指令
  */
-@className
 @concept('元素指令')
-// @ts-ignore
 export class BindDirective extends BaseNode {
-  /** 类名 */
-  static readonly ConceptName = 'BindDirective';
-
   /**
    * 产品概念
    */
-  // @ts-ignore
-  readonly concept!: 'BindDirective';
+  @property()
+  concept: 'BindDirective' = 'BindDirective';
 
   /**
    * 元素指令名称
    */
   @property()
-  // @ts-ignore
-  name!: string;
+  name: string = undefined;
 
   /**
    * 原始名称
    */
   @property()
-  // @ts-ignore
-  rawName!: string;
+  rawName: string = undefined;
 
   /**
    * type
    */
   @property()
-  // @ts-ignore
-  type!: 'string' | 'static' | 'dynamic';
+  type: 'string' | 'static' | 'dynamic' = undefined;
 
   /**
    * 指令值
    */
   @property()
-  // @ts-ignore
-  value!: string;
+  value: string = undefined;
 
   /**
    * 属性表达式
    */
   @property('LogicItem')
-  // @ts-ignore
-  expression!: LogicItem;
+  expression: LogicItem = undefined;
 
   /**
    * 指令参数
    */
   @property()
-  // @ts-ignore
-  arg!: string;
+  arg: string = undefined;
 
   /**
    * 指令修饰器
    */
   @property()
-  // @ts-ignore
-  modifiers!: string;
+  modifiers: string = undefined;
 
   /**
    * 草稿态
@@ -95,24 +83,28 @@ export class BindDirective extends BaseNode {
   get element() {
     return this.getAncestor('ViewElement') as ViewElement;
   }
+
   /**
    * 祖先 View
    */
   get view() {
     return this.getAncestor('View') as View;
   }
+
   /**
    * 祖先 Module
    */
   get module() {
     return this.getAncestor('Module') as Module;
   }
+
   /**
    * 祖先 App
    */
   get app() {
     return this.getAncestor('App') as App;
   }
+
   /**
    * 祖先 Frontend
    */
@@ -124,11 +116,16 @@ export class BindDirective extends BaseNode {
    * @param source 需要合并的部分参数
    */
   constructor(source?: Partial<BindDirective>) {
-    source = Object.assign({}, BindDirective.getDefaultOptions(), source);
+    // @ts-ignore
+    source = { ...BindDirective.getDefaultOptions(), ...source };
     super(source);
     super.subConstructor(source);
   }
 
+  getClassName() {
+    return 'BindDirective';
+  }
+
   static from(source: any, parentNode?: any, parentKey?: string): BindDirective {
     return super.from(source, parentNode, parentKey) as BindDirective;
   }
@@ -144,6 +141,7 @@ export class BindDirective extends BaseNode {
     }
     return params;
   }
+
   /**
    * 设置属性表达式
    */
@@ -188,7 +186,7 @@ export class BindDirective extends BaseNode {
           ...options,
         },
         this,
-        'playground',
+        'playground'
       );
     }
     this.playground.splice(index, 0, logicItem);
@@ -276,7 +274,7 @@ export class BindDirective extends BaseNode {
     if (typeof options === 'string') {
       expression = this.expression;
       if (!expression) {
-        throw new Error('找不到逻辑项 ' + options);
+        throw new Error(`找不到逻辑项 ${options}`);
       }
     } else {
       expression = options;
@@ -291,12 +289,12 @@ export class BindDirective extends BaseNode {
   removeItemInPlayground(logicItem: LogicItem): void;
 
   removeItemInPlayground(options: LogicItem) {
-    let logicItem: LogicItem = options;
+    const logicItem: LogicItem = options;
     return logicItem.delete();
   }
 
   __removeLogicItem(logicItem: LogicItem) {
-    const parentKey = logicItem.parentKey;
+    const { parentKey } = logicItem;
     const params: Params = {
       parentNode: this,
       parentKey,
@@ -318,10 +316,10 @@ export class BindDirective extends BaseNode {
     return params;
   }
 
-  //================================================================================
+  //= ===============================================================================
   // ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑
   // 自动生成的代码已结束。下面可以手动编写。
-  //================================================================================
+  //= ===============================================================================
   onChange($event?: EventPayload): void {
     this.emit('change', $event);
   }
@@ -358,10 +356,7 @@ export class BindDirective extends BaseNode {
       }
       // 变量和变量的成员表达式不进行替换
       if (
-        !(
-          this.expression?.concept === 'Identifier' ||
-          (rootMemberExpression && rootMemberExpression.object?.concept === 'Identifier')
-        ) &&
+        !(this.expression?.concept === 'Identifier' || (rootMemberExpression && rootMemberExpression.object?.concept === 'Identifier')) &&
         (this.type === 'dynamic' || (this.name === 'rules' && (this as any).rules))
       ) {
         bindExpression = true;
@@ -452,7 +447,7 @@ export class BindDirective extends BaseNode {
           '_collectingList',
           '_historyList',
         ]),
-      },
+      }
     );
     return map;
   }
@@ -583,7 +578,7 @@ export class BindDirective extends BaseNode {
   }
 
   @withSourceMap()
-  toEmbeddedTS(state?: TranslatorState): string {
+  toEmbeddedTS(state = createCompilerState()): string {
     let code = '()=>{';
     if (this.expression) {
       code += this.expression.toEmbeddedTS(shiftState(state, code, { tabSize: (state?.tabSize || 0) + 1 }));
@@ -599,14 +594,15 @@ export class BindDirective extends BaseNode {
     return code;
   }
 
-  //================================================================================
+  //= ===============================================================================
   // 从这里开始到结尾注释之间的代码由 NASL Workbench 自动生成，请不手动修改！
   // ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓
-  //================================================================================
+  //= ===============================================================================
 }
 
+classMap.BindDirective = BindDirective;
 export default BindDirective;
-//================================================================================
+//= ===============================================================================
 // ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑
 // 自动生成的代码已结束。下面可以手动编写。
-//================================================================================
+//= ===============================================================================

package/src/concepts/BindEvent__.ts

@@ -12,11 +12,12 @@ import Process from './Process__';
 // ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓   ↓
 //================================================================================
 import { EventPayload, Params } from '../common/EventEmitter';
-import { concept, excludedInJSON, property, className } from '../decorators';
+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 Logic from './Logic__';
 import Argument from './Argument__';
 import ViewElement from './ViewElement__';
@@ -28,25 +29,19 @@ import Frontend from './Frontend__';
 /**
  * 元素绑定事件
  */
-@className
 @concept('元素绑定事件')
-// @ts-ignore
 export class BindEvent extends BaseNode {
-  /** 类名 */
-  static readonly ConceptName = 'BindEvent';
-
   /**
    * 产品概念
    */
-  // @ts-ignore
-  readonly concept!: 'BindEvent';
+  @property()
+  concept: 'BindEvent' = 'BindEvent';
 
   /**
    * 元素绑定事件名称
    */
   @property()
-  // @ts-ignore
-  name!: string;
+  name: string = undefined;
 
   /**
    * 逻辑列表
@@ -58,15 +53,13 @@ export class BindEvent extends BaseNode {
    * calleeNamespace
    */
   @property()
-  // @ts-ignore
-  calleeNamespace!: string;
+  calleeNamespace: string = undefined;
 
   /**
    * calleeName
    */
   @property()
-  // @ts-ignore
-  calleeName!: string;
+  calleeName: string = undefined;
 
   /**
    * 实际参数
@@ -113,6 +106,9 @@ export class BindEvent extends BaseNode {
     super(source);
     super.subConstructor(source);
   }
+  getClassName() {
+    return 'BindEvent';
+  }
 
   static from(source: any, parentNode?: any, parentKey?: string): BindEvent {
     return super.from(source, parentNode, parentKey) as BindEvent;
@@ -206,7 +202,7 @@ export class BindEvent extends BaseNode {
           name: this.getLogicUniqueName(),
         },
         this,
-        'logics',
+        'logics'
       );
     } else if (typeof options === 'string') {
       logic = Logic.from(
@@ -215,7 +211,7 @@ export class BindEvent extends BaseNode {
           name: options,
         },
         this,
-        'logics',
+        'logics'
       );
     } else if (options instanceof Logic) {
       options.ensureDelete(); // 同一实例不支持多处存在
@@ -228,7 +224,7 @@ export class BindEvent extends BaseNode {
           ...options,
         },
         this,
-        'logics',
+        'logics'
       );
     }
     this.logics.splice(index, 0, logic);
@@ -348,7 +344,7 @@ export class BindEvent extends BaseNode {
           ...options,
         },
         this,
-        'arguments',
+        'arguments'
       );
     }
     this.arguments.splice(index, 0, argument);
@@ -474,7 +470,7 @@ export class BindEvent extends BaseNode {
   removeArgument(argument: Argument): void;
 
   removeArgument(options: Argument) {
-    let argument: Argument = options;
+    const argument: Argument = options;
     return argument.delete();
   }
 
@@ -586,7 +582,7 @@ export class BindEvent extends BaseNode {
                 shiftState(state, code, {
                   tabSize: (state?.tabSize || 0) + 2,
                 }),
-                'noExport',
+                'noExport'
               );
             } finally {
               // 翻译logic可能出错
@@ -597,7 +593,7 @@ export class BindEvent extends BaseNode {
               shiftState(state, code, {
                 tabSize: (state?.tabSize || 0) + 2,
               }),
-              'noExport',
+              'noExport'
             );
           }
 
@@ -613,7 +609,7 @@ export class BindEvent extends BaseNode {
             shiftState(state, code, {
               tabSize: (state?.tabSize || 0) + 2,
             }),
-            'noExport',
+            'noExport'
           );
           code += indent(state?.tabSize || 0);
           code += `${logic.name}();\n`;
@@ -646,7 +642,7 @@ export class BindEvent extends BaseNode {
             shiftState(state, code, {
               tabSize: (state?.tabSize || 0) + 2,
             }),
-            'noExport',
+            'noExport'
           );
         } finally {
           // 翻译logic可能出错
@@ -657,7 +653,7 @@ export class BindEvent extends BaseNode {
           shiftState(state, code, {
             tabSize: (state?.tabSize || 0) + 2,
           }),
-          'noExport',
+          'noExport'
         );
       }
 
@@ -669,24 +665,72 @@ export class BindEvent extends BaseNode {
     return code;
   }
 
+  @withSourceMap()
+  toNaturalTS(state = createCompilerState(), isPageCycle?: Boolean): string {
+    // 如果有绑定的事件名
+    let code = ``;
+    if (isPageCycle) {
+      this.logics.forEach((logic, index) => {
+        const logicName = `viewLogic_${logic.name}${index}`;
+        // logic.name = logic.view.name + logic.name + index;
+        code += logic.toNaturalTS(shiftState(state, code, {
+          tabSize: state.tabSize,
+        }), 'noExport', logicName);
+
+        // logic.name = logicName;
+        // code += indent(state.tabSize);
+        // code += `${logicName}();\n`;
+      });
+      return code;
+    }
+    // code = `${this.toHump(this.name) || '__IDENTIFIER__'}: (event: `;
+
+    // event的类型
+    // code += this.getEventTypeString();
+
+    // code += ') => [\n';
+    this.logics.forEach((logic) => {
+      // 一些默认的逻辑不翻译 排除掉
+      if (logic.name.startsWith('__')) {
+        return;
+      }
+      if (logic.view) {
+        const logicName = logic.name;
+        logic.name = `on_${(logic.parentNode as BindEvent).element.name}_${logic.name}`;
+        // logic.name = '__' + logic.view.name + (logic.parentNode as BindEvent).element.name + logic.name;
+        logic.name = logic.name.replace(/-/g, '');
+        try {
+          code += logic.toNaturalTS(shiftState(state, code, {
+            tabSize: state.tabSize,
+          }), 'noExport');
+        } finally {
+          // 翻译logic可能出错
+          logic.name = logicName;
+        }
+      } else {
+        code += logic.toNaturalTS(shiftState(state, code, {
+          tabSize: state.tabSize,
+        }), 'noExport');
+      }
+
+      code += indent(state.tabSize);
+      // code += ',\n';
+    });
+    // if (this.view)
+    //     code += '],\n';
+    // else
+    //     code += ']\n';
+    return code;
+  }
+
   getEventTypeString() {
     let code = '';
     if (!Object.keys(elementsEventsMap).length) return;
     // 已有的点击事件，已知类型的，就直接取值
     if (
-      [
-        'click',
-        'dblclick',
-        'contextmenu',
-        'mousedown',
-        'mouseup',
-        'mouseenter',
-        'mouseleave',
-        'focus',
-        'blur',
-        'keydown',
-        'keyup',
-      ].includes(this.name)
+      ['click', 'dblclick', 'contextmenu', 'mousedown', 'mouseup', 'mouseenter', 'mouseleave', 'focus', 'blur', 'keydown', 'keyup'].includes(
+        this.name
+      )
     ) {
       const eventInfo = elementsEventsMap[this.name];
       const ref = eventInfo.params[0].schema.$ref;
@@ -824,11 +868,7 @@ export class BindEvent extends BaseNode {
       argsList.push(event);
       while (parent && parent.concept !== 'View') {
         if ((parent as ViewElement).slotScope) {
-          const param = Param.from(
-            { name: index === 0 ? 'current' : 'current' + index, typeAnnotation: null },
-            logic,
-            'virtualParams',
-          );
+          const param = Param.from({ name: index === 0 ? 'current' : 'current' + index, typeAnnotation: null }, logic, 'virtualParams');
           argsList.push(param);
           index++;
         }
@@ -877,46 +917,26 @@ export class BindEvent extends BaseNode {
         let title = '';
         const textChild = parent.children.find((item) => item.tag === 'u-text');
         if (textChild) {
-          const bindAttr = textChild.bindAttrs.find(
-            (bindAttr) => bindAttr.name === 'text' || bindAttr.name === 'title' || bindAttr.name === 'label',
-          );
+          const bindAttr = textChild.bindAttrs.find((bindAttr) => bindAttr.name === 'text' || bindAttr.name === 'title' || bindAttr.name === 'label');
           if (bindAttr && bindAttr.type === 'string') title = bindAttr.value;
         } else {
-          const bindAttr = parent.bindAttrs.find(
-            (bindAttr) => bindAttr.name === 'text' || bindAttr.name === 'title' || bindAttr.name === 'label',
-          );
+          const bindAttr = parent.bindAttrs.find((bindAttr) => bindAttr.name === 'text' || bindAttr.name === 'title' || bindAttr.name === 'label');
           if (bindAttr && bindAttr.type === 'string') title = bindAttr.value;
         }
 
         const cap = suffixRE.exec(event?.title);
         if (cap) return `${event.title.replace(suffixRE, '')}${title ? `“${title}”` : ''}${parent.name}${cap[0]}`;
         else return `${event.title}${title ? `“${title}”` : ''}${parent.name}`;
-      } else if (
-        [
-          'click',
-          'dblclick',
-          'contextmenu',
-          'mousedown',
-          'mouseup',
-          'mouseenter',
-          'mouseleave',
-          'focus',
-          'blur',
-        ].includes(this.name)
-      ) {
+      } else if (['click', 'dblclick', 'contextmenu', 'mousedown', 'mouseup', 'mouseenter', 'mouseleave', 'focus', 'blur'].includes(this.name)) {
         const event = elementsEventsMap[this.name];
 
         let title = '';
         const textChild = parent.children.find((item) => item.tag === 'u-text');
         if (textChild) {
-          const bindAttr = textChild.bindAttrs.find(
-            (bindAttr) => bindAttr.name === 'text' || bindAttr.name === 'title' || bindAttr.name === 'label',
-          );
+          const bindAttr = textChild.bindAttrs.find((bindAttr) => bindAttr.name === 'text' || bindAttr.name === 'title' || bindAttr.name === 'label');
           if (bindAttr && bindAttr.type === 'string') title = bindAttr.value;
         } else {
-          const bindAttr = parent.bindAttrs.find(
-            (bindAttr) => bindAttr.name === 'text' || bindAttr.name === 'title' || bindAttr.name === 'label',
-          );
+          const bindAttr = parent.bindAttrs.find((bindAttr) => bindAttr.name === 'text' || bindAttr.name === 'title' || bindAttr.name === 'label');
           if (bindAttr && bindAttr.type === 'string') title = bindAttr.value;
         }
 
@@ -938,19 +958,7 @@ export class BindEvent extends BaseNode {
       if (elementsEventsMap[eventName]) {
         const event = elementsEventsMap[eventName];
         return `${event.title}`;
-      } else if (
-        [
-          'click',
-          'dblclick',
-          'contextmenu',
-          'mousedown',
-          'mouseup',
-          'mouseenter',
-          'mouseleave',
-          'focus',
-          'blur',
-        ].includes(this.name)
-      ) {
+      } else if (['click', 'dblclick', 'contextmenu', 'mousedown', 'mouseup', 'mouseenter', 'mouseleave', 'focus', 'blur'].includes(this.name)) {
         const event = elementsEventsMap[this.name];
         return `${event.title}`;
       }
@@ -1042,6 +1050,7 @@ export class BindEvent extends BaseNode {
   //================================================================================
 }
 
+classMap.BindEvent = BindEvent;
 export default BindEvent;
 //================================================================================
 // ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑