@lcap/nasl 3.3.0-alpha.2 → 3.3.0-alpha.3

package/out/concepts/ViewElement__.js

@@ -34,28 +34,36 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 var ViewElement_1;
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ViewElement = void 0;
+const translator_1 = require("../translator");
+const concepts_1 = require("../concepts");
 const babelParser = __importStar(require("@babel/parser"));
 const json5 = __importStar(require("json5"));
 const compiler = __importStar(require("vue-template-compiler"));
-const translator_1 = require("../translator");
-const concepts_1 = require("../concepts");
 const LogicItem__1 = require("./LogicItem__");
+const Logic__1 = require("./Logic__");
 const config_1 = require("../config");
 const MemberExpression__1 = __importDefault(require("./MemberExpression__"));
 const Identifier__1 = __importDefault(require("./Identifier__"));
 const utils_1 = require("../utils");
-const decorators_1 = require("../decorators");
-const utils = __importStar(require("../utils"));
-const BaseNode_1 = __importDefault(require("../common/BaseNode"));
-const classMap_1 = __importDefault(require("../common/classMap"));
-const BindAttribute__1 = __importDefault(require("./BindAttribute__"));
-const BindEvent__1 = __importDefault(require("./BindEvent__"));
-const BindDirective__1 = __importDefault(require("./BindDirective__"));
-const BindStyle__1 = __importDefault(require("./BindStyle__"));
 /**
  * 自闭合标签
  */
-const selfClosingTag = ['base', 'meta', 'area', 'embed', 'link', 'img', 'input', 'param', 'hr', 'br', 'source', 'track', 'wbr', 'col'];
+const selfClosingTag = [
+    'base',
+    'meta',
+    'area',
+    'embed',
+    'link',
+    'img',
+    'input',
+    'param',
+    'hr',
+    'br',
+    'source',
+    'track',
+    'wbr',
+    'col',
+];
 function genArgumentMemberExpression(arr) {
     let expressionNode;
     const propertyName = arr.pop();
@@ -92,16 +100,14 @@ function transAstNodeToNaslNode(astNode, namespace) {
             kind: 'Expression',
             calleeNamespace: 'nasl.util',
             calleeName,
-            arguments: astNode.arguments
-                .map((argument) => ({
+            arguments: astNode.arguments.map((argument) => ({
                 concept: 'Argument',
                 name: '',
                 kind: 'Statement',
                 keyword: '',
-                expression: transAstNodeToNaslNode({ ...argument }),
-            }))
-                .filter((item) => item.expression),
-            typeArguments: astNode.arguments.map((argument) => transAstNodeToNaslTypeNode({ ...argument })).filter((item) => item),
+                expression: transAstNodeToNaslNode(Object.assign({}, argument)),
+            })).filter((item) => item.expression),
+            typeArguments: astNode.arguments.map((argument) => (transAstNodeToNaslTypeNode(Object.assign({}, argument)))).filter((item) => item),
         };
     }
     else if (astNode.type === 'MemberExpression') {
@@ -155,15 +161,17 @@ function transAstNodeToNaslNode(astNode, namespace) {
         if (astNode?.value?.startsWith('__enumTypeAnnotation_')) {
             return null;
         }
-        node = {
-            concept: 'StringLiteral',
-            kind: 'Expression',
-            name: '',
-            value: astNode.value,
-        };
+        else {
+            node = {
+                concept: 'StringLiteral',
+                kind: 'Expression',
+                name: '',
+                value: astNode.value,
+            };
+        }
     }
     else if (astNode.type === 'UnaryExpression') {
-        const { argument } = astNode;
+        const argument = astNode.argument;
         if (argument.type === 'NumericLiteral') {
             node = {
                 concept: 'NumericLiteral',
@@ -187,6 +195,32 @@ function transAstNodeToNaslNode(astNode, namespace) {
             value: numberString,
         };
     }
+    else if (astNode.type === 'ArrowFunctionExpression') {
+        if (astNode.body?.callee?.name) {
+            astNode.name = astNode.body.callee.name;
+        }
+        let tempNode = {
+            calleeNamespace: 'app.logics',
+            concept: 'CallLogic',
+            namespace: namespace || '',
+            name: astNode.name,
+            calleeName: astNode.name,
+            kind: 'Expression',
+            parentNode: astNode.parentNode,
+            parentKey: astNode.parentKey,
+            arguments: astNode?.body?.arguments?.map((argument) => ({
+                concept: 'Argument',
+                name: '',
+                kind: 'Statement',
+                keyword: '',
+                expression: transAstNodeToNaslNode(Object.assign({}, argument)),
+            })).filter((item) => item.expression),
+            typeArguments: astNode?.body?.arguments?.map((argument) => (transAstNodeToNaslTypeNode(Object.assign({}, argument)))).filter((item) => item)
+        };
+        node = Logic__1.Logic.from({
+            ...tempNode,
+        }, undefined, 'logics');
+    }
     else {
         node = astNode;
         node.concept = astNode.type;
@@ -209,6 +243,15 @@ function transAstNodeToNaslTypeNode(astNode, namespace) {
     }
     return node;
 }
+const decorators_1 = require("../decorators");
+const utils = __importStar(require("../utils"));
+const BaseNode_1 = __importDefault(require("../common/BaseNode"));
+const classMap_1 = __importDefault(require("../common/classMap"));
+const BindAttribute__1 = __importDefault(require("./BindAttribute__"));
+const BindEvent__1 = __importDefault(require("./BindEvent__"));
+const BindDirective__1 = __importDefault(require("./BindDirective__"));
+const BindStyle__1 = __importDefault(require("./BindStyle__"));
+const View__1 = require("./View__");
 /**
  * 页面元素
  */
@@ -301,8 +344,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
      * @param source 需要合并的部分参数
      */
     constructor(source) {
-        // @ts-ignore
-        source = { ...ViewElement_1.getDefaultOptions(), ...source };
+        source = Object.assign({}, ViewElement_1.getDefaultOptions(), source);
         super(source);
         super.subConstructor(source);
     }
@@ -652,7 +694,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         if (typeof options === 'string') {
             bindAttribute = this.bindAttrs.find((item) => item.name === options);
             if (!bindAttribute) {
-                throw new Error(`找不到元素绑定属性 ${options}`);
+                throw new Error('找不到元素绑定属性 ' + options);
             }
         }
         else {
@@ -661,7 +703,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         return bindAttribute.delete();
     }
     __removeBindAttribute(bindAttribute) {
-        const { parentKey } = bindAttribute;
+        const parentKey = bindAttribute.parentKey;
         const params = {
             parentNode: this,
             parentKey,
@@ -688,7 +730,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         if (typeof options === 'string') {
             bindEvent = this.bindEvents.find((item) => item.name === options);
             if (!bindEvent) {
-                throw new Error(`找不到元素绑定事件 ${options}`);
+                throw new Error('找不到元素绑定事件 ' + options);
             }
         }
         else {
@@ -697,7 +739,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         return bindEvent.delete();
     }
     __removeBindEvent(bindEvent) {
-        const { parentKey } = bindEvent;
+        const parentKey = bindEvent.parentKey;
         const params = {
             parentNode: this,
             parentKey,
@@ -724,7 +766,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         if (typeof options === 'string') {
             bindDirective = this.bindDirectives.find((item) => item.name === options);
             if (!bindDirective) {
-                throw new Error(`找不到元素指令 ${options}`);
+                throw new Error('找不到元素指令 ' + options);
             }
         }
         else {
@@ -733,7 +775,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         return bindDirective.delete();
     }
     __removeBindDirective(bindDirective) {
-        const { parentKey } = bindDirective;
+        const parentKey = bindDirective.parentKey;
         const params = {
             parentNode: this,
             parentKey,
@@ -760,7 +802,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         if (typeof options === 'string') {
             bindStyle = this.bindStyles.find((item) => item.name === options);
             if (!bindStyle) {
-                throw new Error(`找不到元素绑定样式 ${options}`);
+                throw new Error('找不到元素绑定样式 ' + options);
             }
         }
         else {
@@ -769,7 +811,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         return bindStyle.delete();
     }
     __removeBindStyle(bindStyle) {
-        const { parentKey } = bindStyle;
+        const parentKey = bindStyle.parentKey;
         const params = {
             parentNode: this,
             parentKey,
@@ -796,7 +838,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         if (typeof options === 'string') {
             viewElement = this.children.find((item) => item.name === options);
             if (!viewElement) {
-                throw new Error(`找不到页面元素 ${options}`);
+                throw new Error('找不到页面元素 ' + options);
             }
         }
         else {
@@ -805,7 +847,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         return viewElement.delete();
     }
     __removeViewElement(viewElement) {
-        const { parentKey } = viewElement;
+        const parentKey = viewElement.parentKey;
         const params = {
             parentNode: this,
             parentKey,
@@ -827,10 +869,10 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         }
         return params;
     }
-    //= ===============================================================================
+    //================================================================================
     // ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑
     // 自动生成的代码已结束。下面可以手动编写。
-    //= ===============================================================================
+    //================================================================================
     /* 主页面有没有权限 */
     get parentAuth() {
         const _nameSpace = this.view.getNamespace();
@@ -895,6 +937,14 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         else if (this.tag === 'u-table-view-column-dynamic') {
             code += `${this.name}: nasl.ui.${this.toHump(this.tag)}<any, any>;\n`;
         }
+        else if (Object.keys(View__1.PAGE_COMPONENT_INCLUDE_TAG_MAP).includes(this.tag)) {
+            if (this.bindAttrs?.findIndex((attr) => attr.name === 'data-source') > -1) {
+                code += `${this.name}: nasl.ui.${this.toHump(this.tag)}<__elements_completionProperty['${this.name}']['dataSource']>;\n`;
+            }
+            else {
+                code += `${this.name}: nasl.ui.${this.toHump(this.tag)}<any>;\n`;
+            }
+        }
         else {
             code += `${this.name}: nasl.ui.${this.toHump(this.tag)}<any>;\n`;
         }
@@ -905,6 +955,93 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         }
         return code;
     }
+    toEmbeddedTSVariableDefinition(state, variableList) {
+        let code = '';
+        code += (0, translator_1.indent)((state?.tabSize || 0) + 2);
+        code += `${this.name}: {\n`;
+        if (Array.isArray(this.bindAttrs)) {
+            this.bindAttrs.filter((attr) => View__1.PAGE_COMPONENT_INCLUDE_TAG_MAP[this.tag]?.[attr.name]).forEach((attr) => {
+                code += attr.toEmbeddedTSVariableDefinition((0, translator_1.shiftState)(state, code, { inline: true }), variableList, this.name);
+            });
+            if (['u-select', 'van-pickerson'].includes(this.tag)) {
+                code += (0, translator_1.indent)((state?.tabSize || 0) + 3);
+                code += `pageNumber: nasl.core.Long\n`;
+            }
+            else if (['u-list-view', 'u-grid-view', 'u-table-view', 'van-list-view', 'van-grid-view'].includes(this.tag) && this.bindAttrs?.findIndex((attr) => attr.name === 'sorting') === -1) {
+                code += (0, translator_1.indent)((state?.tabSize || 0) + 3);
+                code += `sorting: {
+                    field: nasl.core.String
+                    order: nasl.core.String
+                }\n`;
+            }
+        }
+        code += (0, translator_1.indent)((state?.tabSize || 0) + 2);
+        code += `}`;
+        return code;
+    }
+    toNaturalTS(state = (0, translator_1.createCompilerState)(), parentLevel) {
+        let code = '';
+        const levelIndex = parentLevel || 0;
+        if (Array.isArray(this.bindEvents)) {
+            this.bindEvents.forEach((event) => {
+                code += event.toNaturalTS((0, translator_1.shiftState)(state, code, {
+                    tabSize: state.tabSize,
+                }));
+                // code += '\n';
+            });
+        }
+        if (Array.isArray(this.children)) {
+            if (this.children.find((item) => item.tag === 'template' && item.slotTarget)) {
+                // code += indent(state.tabSize + 2);
+                const defaultArr = [];
+                // 先把插槽翻译了
+                this.children.forEach((element) => {
+                    if (element.tag === 'template') {
+                        code += element.toNaturalTS((0, translator_1.shiftState)(state, code, {
+                            tabSize: state.tabSize,
+                        }), levelIndex);
+                    }
+                    else {
+                        defaultArr.push(element);
+                    }
+                });
+                // 翻译其余的子集
+                if (defaultArr.length) {
+                    defaultArr.forEach((element) => {
+                        code += element.toNaturalTS((0, translator_1.shiftState)(state, code, {
+                            tabSize: state.tabSize,
+                        }), levelIndex);
+                    });
+                }
+            }
+            else {
+                this.children.forEach((element) => {
+                    code += element.toNaturalTS((0, translator_1.shiftState)(state, code, {
+                        tabSize: state.tabSize,
+                    }), levelIndex);
+                });
+            }
+        }
+        return code;
+    }
+    toNaturalTSDefinition(state) {
+        let code = '';
+        if (['u-button', 'u-form', 'u-modal', 'u-table-view', 'u-select', 'u-input', 'u-number-input'].includes(this.tag)) {
+            code += (0, translator_1.indent)(state.tabSize + 1);
+            // 登录组件不翻译
+            // if (this.toHump(this.tag) === 'lcapLogin' || this.staticClass === 'login-form') {
+            //     code += `${this.name}: nasl.ui.div;\n`;
+            // } else {
+            code += `${this.name}: nasl.ui.${(0, utils_1.kebab2Camel)(this.tag.replace(/^\w-/, ''))},\n`;
+            // }
+        }
+        if (Array.isArray(this.children)) {
+            this.children.forEach((element) => {
+                code += element.toNaturalTSDefinition((0, translator_1.shiftState)(state, code));
+            });
+        }
+        return code;
+    }
     getTypeArgmentsStr(state) {
         // 登录组件不翻译
         if (this.toHump(this.tag) === 'lcapLogin' || this.staticClass === 'login-form')
@@ -913,7 +1050,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         // formItem的单独处理
         if (this.tag === 'u-form-item') {
             if (Array.isArray(this.children) && this.children.length) {
-                const { tag } = this.children[0];
+                const tag = this.children[0].tag;
                 if (tag === 'u-input') {
                     code += '<nasl.core.String>';
                 }
@@ -926,7 +1063,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
             }
             return code;
         }
-        const { bindAttrs } = this;
+        const bindAttrs = this.bindAttrs;
         if (bindAttrs && bindAttrs.length) {
             const attr = bindAttrs.find((item) => item.name === 'data-source');
             if (attr && attr.expression) {
@@ -943,14 +1080,19 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
     getDatasourceTypeCodeStr(state, eleArr) {
         let code = '';
         (eleArr || []).forEach((element, index) => {
-            const { bindAttrs } = element;
+            const bindAttrs = element.bindAttrs;
             if (bindAttrs && bindAttrs.length) {
                 const attr = bindAttrs.find((item) => item.name === 'data-source');
                 if (attr && attr.expression) {
-                    const datasourceName = `datasourceName${index}`;
+                    const datasourceName = `datasourceName${element.name}`;
                     element.__tsDataSourceTypeName = datasourceName;
-                    if (attr.expression instanceof MemberExpression__1.default || attr.expression instanceof Identifier__1.default) {
-                        const value = attr.expression.toEmbeddedTS((0, translator_1.shiftState)(state, code));
+                    if (attr.expression instanceof MemberExpression__1.default || attr.expression instanceof Identifier__1.default || attr.expression instanceof concepts_1.CallLogic) {
+                        const extraParams = {
+                            tabSize: 4,
+                            inline: true,
+                            noNeedParams: true
+                        };
+                        let value = attr.expression.toEmbeddedTS((0, translator_1.shiftState)(state, code, attr.expression.concept === 'CallLogic' ? extraParams : {}));
                         code += `type ${datasourceName} = `;
                         code += `nasl.ui.GetItemTypeFromDataSource<typeof ${value}>;\n`;
                     }
@@ -969,18 +1111,20 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         return code;
     }
     toEmbeddedTS(state, parentLevel) {
-        const { parentNode, app, tag, staticClass, name, bindDirectives, bindRoles, bindEvents, children } = this;
+        const { parentNode, app, tag, staticClass, name, bindDirectives, bindRoles, bindEvents, children, } = this;
         const chineseTsName = (name) => {
             let tsName = name;
             // 匹配所有特殊字符都转为_
             tsName = tsName.replace(/[^\u4e00-\u9fa5a-zA-Z0-9]/g, '_');
             if (/^\d/.test(tsName)) {
-                tsName = `$${tsName}`;
+                tsName = '$' + tsName;
             }
             return tsName;
         };
         // 过滤模板的登录中的一些翻译，这里只过滤h5表格中的两个列
-        if ((parentNode.concept === 'ViewElement' && parentNode.tag && this.toHump(parentNode.tag) === 'lcapLogin') || staticClass === 'login-cell') {
+        if (parentNode.concept === 'ViewElement' &&
+            parentNode.tag && this.toHump(parentNode.tag) === 'lcapLogin' ||
+            staticClass === 'login-cell') {
             return '';
         }
         // pc事件翻译
@@ -1000,7 +1144,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         }
         let levelIndex = parentLevel || 0;
         if (tag === 'template' && this.haveScope()) {
-            const slotTarget = !this.slotTarget ? 'slotDefault' : `slot${this.toFirstUpper(this.toHump(this.slotTarget))}`;
+            const slotTarget = !this.slotTarget ? 'slotDefault' : 'slot' + this.toFirstUpper(this.toHump(this.slotTarget));
             let code = '';
             code += `${slotTarget}: (current${levelIndex === 0 ? '' : levelIndex})=> {\n`;
             code += this.getDatasourceTypeCodeStr(state, this.children);
@@ -1008,7 +1152,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
             code += 'return [';
             this.children.forEach((element) => {
                 code += element.toEmbeddedTS((0, translator_1.shiftState)(state, code, {
-                    tabSize: state?.tabSize || 0,
+                    tabSize: (state?.tabSize || 0),
                 }), levelIndex);
             });
             code += ']';
@@ -1016,15 +1160,15 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
             code += '},\n';
             return code;
         }
-        if (tag === 'template') {
-            const slotTarget = !this.slotTarget ? 'slotDefault' : `slot${this.toFirstUpper(this.toHump(this.slotTarget))}`;
+        else if (tag === 'template') {
+            const slotTarget = !this.slotTarget ? 'slotDefault' : 'slot' + this.toFirstUpper(this.toHump(this.slotTarget));
             let code = '';
             code += `${slotTarget}: ()=> {\n`;
             code += this.getDatasourceTypeCodeStr(state, this.children);
             code += 'return [';
             this.children.forEach((element) => {
                 code += element.toEmbeddedTS((0, translator_1.shiftState)(state, code, {
-                    tabSize: state?.tabSize || 0,
+                    tabSize: (state?.tabSize || 0),
                 }), levelIndex);
             });
             code += (0, translator_1.indent)((state?.tabSize || 0) + 2);
@@ -1065,10 +1209,10 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
             code += (0, translator_1.indent)((state?.tabSize || 0) + 1);
             if (Array.isArray(this.bindAttrs)) {
                 code += `bindAttr: () => [\n`;
-                this.bindAttrs.forEach((attr) => (code += `${attr.toEmbeddedTS((0, translator_1.shiftState)(state, code, { tabSize: 1 }))},\n`));
-                this.bindDirectives.forEach((directive) => (code += `${directive.toEmbeddedTS((0, translator_1.shiftState)(state, code, { tabSize: 1 }))},\n`));
-                this.bindStyles.forEach((bindStyle) => (code += `${bindStyle.toEmbeddedTS((0, translator_1.shiftState)(state, code, { tabSize: 1 }))},\n`));
-                code += `${(0, translator_1.indent)((state?.tabSize || 0) + 2)}],\n`;
+                this.bindAttrs.forEach((attr) => code += attr.toEmbeddedTS((0, translator_1.shiftState)(state, code, { tabSize: 1 })) + ',\n');
+                this.bindDirectives.forEach((directive) => code += directive.toEmbeddedTS((0, translator_1.shiftState)(state, code, { tabSize: 1 })) + ',\n');
+                this.bindStyles.forEach((bindStyle) => code += bindStyle.toEmbeddedTS((0, translator_1.shiftState)(state, code, { tabSize: 1 })) + ',\n');
+                code += (0, translator_1.indent)((state?.tabSize || 0) + 2) + '],\n';
             }
             // 如果子集中有插槽的就
             if (children.find((item) => item.tag === 'template' && item.slotTarget)) {
@@ -1078,7 +1222,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
                 children.forEach((element) => {
                     if (element.tag === 'template') {
                         code += element.toEmbeddedTS((0, translator_1.shiftState)(state, code, {
-                            tabSize: state?.tabSize || 0,
+                            tabSize: (state?.tabSize || 0),
                         }), levelIndex);
                     }
                     else {
@@ -1120,7 +1264,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
                 code += '}\n';
             }
         }
-        code += `${(0, translator_1.indent)(state?.tabSize || 0)}})`;
+        code += (0, translator_1.indent)((state?.tabSize || 0)) + '})';
         // 顶层元素是单独的表达式
         if (parentNode.concept === 'View') {
             code += ';\n';
@@ -1130,69 +1274,6 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         }
         return code;
     }
-    toNaturalTS(state = (0, translator_1.createCompilerState)(), parentLevel) {
-        let code = '';
-        const levelIndex = parentLevel || 0;
-        if (Array.isArray(this.bindEvents)) {
-            this.bindEvents.forEach((event) => {
-                code += event.toNaturalTS((0, translator_1.shiftState)(state, code, {
-                    tabSize: state.tabSize,
-                }));
-                // code += '\n';
-            });
-        }
-        if (Array.isArray(this.children)) {
-            if (this.children.find((item) => item.tag === 'template' && item.slotTarget)) {
-                // code += indent(state.tabSize + 2);
-                const defaultArr = [];
-                // 先把插槽翻译了
-                this.children.forEach((element) => {
-                    if (element.tag === 'template') {
-                        code += element.toNaturalTS((0, translator_1.shiftState)(state, code, {
-                            tabSize: state.tabSize,
-                        }), levelIndex);
-                    }
-                    else {
-                        defaultArr.push(element);
-                    }
-                });
-                // 翻译其余的子集
-                if (defaultArr.length) {
-                    defaultArr.forEach((element) => {
-                        code += element.toNaturalTS((0, translator_1.shiftState)(state, code, {
-                            tabSize: state.tabSize,
-                        }), levelIndex);
-                    });
-                }
-            }
-            else {
-                this.children.forEach((element) => {
-                    code += element.toNaturalTS((0, translator_1.shiftState)(state, code, {
-                        tabSize: state.tabSize,
-                    }), levelIndex);
-                });
-            }
-        }
-        return code;
-    }
-    toNaturalTSDefinition(state) {
-        let code = '';
-        if (['u-button', 'u-form', 'u-modal', 'u-table-view', 'u-select', 'u-input', 'u-number-input'].includes(this.tag)) {
-            code += (0, translator_1.indent)(state.tabSize + 1);
-            // 登录组件不翻译
-            // if (this.toHump(this.tag) === 'lcapLogin' || this.staticClass === 'login-form') {
-            //     code += `${this.name}: nasl.ui.div;\n`;
-            // } else {
-            code += `${this.name}: nasl.ui.${(0, utils_1.kebab2Camel)(this.tag.replace(/^\w-/, ''))},\n`;
-            // }
-        }
-        if (Array.isArray(this.children)) {
-            this.children.forEach((element) => {
-                code += element.toNaturalTSDefinition((0, translator_1.shiftState)(state, code));
-            });
-        }
-        return code;
-    }
     _duplicate() {
         const element = ViewElement_1.from(this.toTemplateJSON());
         const nameMap = element.deepRenameElements(this);
@@ -1256,7 +1337,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
                     name: '',
                     kind: 'Statement',
                     keyword: func?.params?.[index]?.name ?? '',
-                    expression: transAstNodeToNaslNode({ ...argument }),
+                    expression: transAstNodeToNaslNode(Object.assign({}, argument)),
                 }));
             }
         }
@@ -1278,10 +1359,10 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
     static _fromASTNode(astNode, context) {
         const view = context?.view;
         // 临时处理组件的 text
-        // h5-mock
-        if (['u-text', 'van-text', 'u-link', 'u-button', 'u-label', 'u-radio', 'u-checkbox', 'u-navbar-item', 'u-sidebar-item', 'u-menu-item'].includes(astNode.tag) &&
-            astNode.children.length === 1 &&
-            astNode.children[0].type === 3) {
+        //h5-mock
+        if (['u-text', 'van-text', 'u-link', 'u-button', 'u-label', 'u-radio', 'u-checkbox', 'u-navbar-item', 'u-sidebar-item', 'u-menu-item'].includes(astNode.tag)
+            && astNode.children.length === 1
+            && astNode.children[0].type === 3) {
             astNode.attrs = astNode.attrs || [];
             astNode.attrs.push({
                 name: 'text',
@@ -1300,18 +1381,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
             delete astNode.scopedSlots;
         }
         // 提示不支持的属性
-        [
-            'component',
-            'inlineTemplate',
-            'pre',
-            'ns',
-            'transition',
-            'transitionOnAppear',
-            'transitionMode',
-            'slotName',
-            'classBinding',
-            'styleBinding',
-        ].forEach((key) => {
+        ['component', 'inlineTemplate', 'pre', 'ns', 'transition', 'transitionOnAppear', 'transitionMode', 'slotName', 'classBinding', 'styleBinding'].forEach((key) => {
             if (astNode[key])
                 console.warn(`[warn] ViewElement NASL unsupports '${key}' field in node `, astNode);
         });
@@ -1363,6 +1433,9 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
                         if (oldAttr.name === 'rules') {
                             source.rules = tmp?.split('|').map((ruleStr) => this._parseValidationRule(ruleStr.trim()));
                         }
+                        else if (['page-number', 'page-size'].includes(oldAttr.name)) {
+                            source.value = Number(source.value);
+                        }
                         attr = new BindAttribute__1.default(source);
                     }
                     catch (e) {
@@ -1381,8 +1454,8 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
                 element.addBindAttribute(attr);
             });
             // compiler 处理:value.sync 时会加上update:value事件，需要过滤
-            astNode.events &&
-                Object.keys(astNode.events)
+            astNode.events
+                && Object.keys(astNode.events)
                     .filter((name) => !name.startsWith('update:'))
                     .forEach((name) => {
                     const oldEvent = astNode.events[name];
@@ -1416,8 +1489,8 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
                         }));
                     }
                 });
-            astNode.directives &&
-                astNode.directives.forEach((directive) => {
+            astNode.directives
+                && astNode.directives.forEach((directive) => {
                     if (directive.name === 'model') {
                         const valueAttr = astNode.attrs && astNode.attrs.find((attr) => attr.name === 'value');
                         if (!valueAttr) {
@@ -1497,7 +1570,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
             preserveWhitespace: false,
             outputSourceRange: true,
         };
-        let { ast } = compiler.compile(code, compilerOptions);
+        let ast = compiler.compile(code, compilerOptions).ast;
         if (ast.tag === 'template' && !ast.slotTarget)
             ast = ast.children[0];
         return this._fromASTNode(ast, {
@@ -1528,7 +1601,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
                     }
                     if (apiOfAttr && apiOfAttr['designer-value'] !== undefined) {
                         let designerValue = apiOfAttr['designer-value'];
-                        // 对流程模板拖拽进行特判
+                        //对流程模板拖拽进行特判
                         element.bindAttrs.forEach((property) => {
                             if (property.name === 'repeat' && property.value === '1')
                                 designerValue = '[{}, {}]';
@@ -1567,7 +1640,8 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
                                 .replace(/\bcurrent\.item\.\b/g, '');
                             return `${name}="{{ ${value} }}"`;
                         });
-                    return defaultResult;
+                    else
+                        return defaultResult;
                 }
                 return false;
             },
@@ -1587,7 +1661,11 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
                     }
                     if (childEmpty) {
                         let addEmpty = true;
-                        if (['u-grid-view', 'u-list-view', 'van-list-view', 'van-grid-view', 'u-carousel'].includes(el.tag)) {
+                        if (['u-grid-view',
+                            'u-list-view',
+                            'van-list-view',
+                            'van-grid-view',
+                            'u-carousel'].includes(el.tag)) {
                             const hasDataSource = el.bindAttrs.find((attr) => attr.name === 'data-source');
                             addEmpty = !hasDataSource;
                         }
@@ -1597,21 +1675,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
                             if (hasAuto)
                                 addEmpty = false;
                         }
-                        if ([
-                            'u-select',
-                            'u-dropdown',
-                            'u-panel',
-                            'u-toc',
-                            'u-toc-item',
-                            'u-tree-view-new',
-                            'u-tree-view-node-new',
-                            'u-tree-select',
-                            'u-tree-select-new',
-                            'u-anchor',
-                            'u-drawer',
-                            'u-timeline',
-                            'u-tabs',
-                        ].includes(el.tag)) {
+                        if (['u-select', 'u-dropdown', 'u-panel', 'u-toc', 'u-toc-item', 'u-tree-view-new', 'u-tree-view-node-new', 'u-tree-select', 'u-tree-select-new', 'u-anchor', 'u-drawer', 'u-timeline', 'u-tabs'].includes(el.tag)) {
                             addEmpty = false;
                         }
                         const background = (emptySlot && emptySlot['empty-background']) || (hasSupport ? 'add-sub' : '');
@@ -1620,7 +1684,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
                 }
                 if (['u-router-view', 'van-router-view'].includes(el.tag)) {
                     const excludes = ['background-color:', 'background:', 'background-image:'];
-                    if (excludes.some((key) => el.staticStyle && el.staticStyle.includes(key))) {
+                    if (excludes.some((key) => (el.staticStyle && el.staticStyle.includes(key)))) {
                         parts.push(':designer="false"');
                     }
                 }
@@ -1635,7 +1699,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         let index = 0;
         while (parent && parent.concept !== 'View') {
             if (parent.slotScope) {
-                argsList.push(index === 0 ? 'current' : `current${index}`);
+                argsList.push(index === 0 ? 'current' : 'current' + index);
                 index++;
             }
             parent = parent.parentNode;
@@ -1663,7 +1727,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         if (this.slotScope) {
             currentList.unshift(this.slotScope);
         }
-        const newOptions = {
+        const newOptions = Object.assign({
             indentStyle: 'space',
             tabSize: 4,
             indentLevel: 0,
@@ -1679,21 +1743,19 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
                     .filter((item) => item !== undefined)
                     .join(', ')}}"`;
             },
-            ...options,
+        }, options, {
             currentList,
-        };
+        });
         const tabString = ' '.repeat(newOptions.tabSize * newOptions.indentLevel);
         const insideTabString = ' '.repeat(newOptions.tabSize * (newOptions.indentLevel + 1));
         let shouldIndent = true;
-        const content = !this.children
-            ? ''
-            : this.children
-                .map((element) => {
-                const childOptions = { ...newOptions };
-                childOptions.indentLevel++;
-                return (shouldIndent ? `\n${insideTabString}` : '') + element?.toVue(childOptions);
-            })
-                .join('');
+        const content = !this.children ? '' : this.children
+            .map((element) => {
+            const childOptions = Object.assign({}, newOptions);
+            childOptions.indentLevel++;
+            return (shouldIndent ? '\n' + insideTabString : '') + element?.toVue(childOptions);
+        })
+            .join('');
         if (!content.length) {
             shouldIndent = false;
         }
@@ -1709,8 +1771,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
             parts.push(`vusion-node-path="${this.nodePath}"`);
         }
         // 模板里解析时候，可能会有多级嵌套的 current，所以当前有多少的长度，当前就是多大的下标
-        this.slotTarget &&
-            parts.push(`#${this.slotTarget}${this.slotScope ? `="${currentList.length > 1 ? this.slotScope + (currentList.length - 1) : this.slotScope}"` : ''}`);
+        this.slotTarget && parts.push(`#${this.slotTarget}` + (this.slotScope ? `="${currentList.length > 1 ? this.slotScope + (currentList.length - 1) : this.slotScope}"` : ''));
         this.refName && parts.push(`:ref="\`${this.refName}\`"`);
         this.staticClass && parts.push(`class="${this.staticClass}"`);
         this.staticStyle && parts.push(`style="${this.staticStyle}"`);
@@ -1749,13 +1810,13 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         let partsString = '';
         parts.forEach((part) => {
             if (partsLength >= 120 || part.length >= 120) {
-                partsString += `\n${tabString}${' '.repeat(3)}`; // ' '.repeat(el.tag.length + 1);
+                partsString += '\n' + tabString + ' '.repeat(3); // ' '.repeat(el.tag.length + 1);
                 partsLength = 0;
             }
-            partsString += ` ${part}`;
+            partsString += ' ' + part;
             partsLength += part.length;
         });
-        let htmlContent = `<${this.tag}${partsString.length ? partsString : ''}>${content}${shouldIndent ? `\n${tabString}` : ''}</${this.tag}>`;
+        let htmlContent = `<${this.tag}${partsString.length ? partsString : ''}>` + content + (shouldIndent ? '\n' + tabString : '') + `</${this.tag}>`;
         if (!content.trim() && selfClosingTag.includes(this.tag)) {
             htmlContent = `<${this.tag}${partsString.length ? partsString : ''} />`;
         }
@@ -1802,7 +1863,7 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
             }
             parent = parent.parentNode;
         }
-        current = index === 0 ? 'current' : `current${index}`;
+        current = (index === 0 ? 'current' : 'current' + index);
         return current;
     }
     /**
@@ -1811,13 +1872,16 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
      * @param doNotRecordLastWidthHeight 是否不记录上一次的宽高
      */
     computeConstraintStyle(positionData, ops = {}) {
+        if (!positionData) {
+            return;
+        }
         const { nodeRect, parentRect, parentBorder } = positionData;
         const staticWidth = nodeRect.width;
         const staticHeight = nodeRect.height;
         const staticLeft = nodeRect.left - parentRect.left - parentBorder.left;
         const staticTop = nodeRect.top - parentRect.top - parentBorder.top;
-        const staticRight = parentRect.width - nodeRect.width - staticLeft - parentBorder.right - parentBorder.left;
-        const staticBottom = parentRect.height - nodeRect.height - staticTop - parentBorder.bottom - parentBorder.top;
+        const staticRight = (parentRect.width - nodeRect.width - staticLeft - parentBorder.right - parentBorder.left);
+        const staticBottom = (parentRect.height - nodeRect.height - staticTop - parentBorder.bottom - parentBorder.top);
         const styleObj = this.parseStyleToObject(this.staticStyle);
         const constraintX = styleObj['--constraint-x'] || 'left';
         const constraintY = styleObj['--constraint-y'] || 'top';
@@ -1837,12 +1901,12 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         const parentWidth = staticLeft + staticWidth + staticRight;
         const parentHeight = staticTop + staticHeight + staticBottom;
         if (constraintX === 'left') {
-            left = `${staticLeft}px`;
+            left = staticLeft + 'px';
             right = '';
         }
         else if (constraintX === 'right') {
             left = '';
-            right = `${staticRight}px`;
+            right = staticRight + 'px';
         }
         else if (constraintX === 'center') {
             const offset = staticLeft + staticWidth / 2 - parentWidth / 2;
@@ -1851,24 +1915,24 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
             transform = 'translateX(-50%)';
         }
         else if (constraintX === 'scale') {
-            left = `${(staticLeft * 100) / parentWidth}%`;
+            left = staticLeft * 100 / parentWidth + '%';
             right = '';
-            width = `${(staticWidth * 100) / parentWidth}%`;
+            width = staticWidth * 100 / parentWidth + '%';
             constraintWidthAuto = 1;
         }
         else if (constraintX === 'left-right') {
-            left = `${staticLeft}px`;
-            right = `${staticRight}px`;
+            left = staticLeft + 'px';
+            right = staticRight + 'px';
             width = 'auto';
             constraintWidthAuto = 1;
         }
         if (constraintY === 'top') {
-            top = `${staticTop}px`;
+            top = staticTop + 'px';
             bottom = '';
         }
         else if (constraintY === 'bottom') {
             top = '';
-            bottom = `${staticBottom}px`;
+            bottom = staticBottom + 'px';
         }
         else if (constraintY === 'center') {
             const offset = staticTop + staticHeight / 2 - parentHeight / 2;
@@ -1877,14 +1941,14 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
             transform = transform ? 'translate(-50%, -50%)' : 'translateY(-50%)';
         }
         else if (constraintY === 'scale') {
-            top = `${(staticTop * 100) / parentHeight}%`;
+            top = staticTop * 100 / parentHeight + '%';
             bottom = '';
-            height = `${(staticHeight * 100) / parentHeight}%`;
+            height = staticHeight * 100 / parentHeight + '%';
             constraintHeightAuto = 1;
         }
         else if (constraintY === 'top-bottom') {
-            top = `${staticTop}px`;
-            bottom = `${staticBottom}px`;
+            top = staticTop + 'px';
+            bottom = staticBottom + 'px';
             height = 'auto';
             constraintHeightAuto = 1;
         }
@@ -1933,16 +1997,16 @@ let ViewElement = ViewElement_1 = class ViewElement extends BaseNode_1.default {
         return styleObj;
     }
     stringifyStyleAttr(styleObj) {
-        return (Object.keys(styleObj)
+        return Object.keys(styleObj)
             // 空字符串是允许的，因为有时候想要覆盖之前的样式。undefined 则不允许
-            .filter((key) => styleObj[key] !== undefined)
+            .filter(key => styleObj[key] !== undefined)
             .map((key) => `${key}:${String(styleObj[key]).trim()};`)
-            .join(''));
+            .join('');
     }
     // 批量更新绑定属性
     batchUpdateBindAttrs(attrOptions) {
-        const oldBindAttrs = this.bindAttrs.filter((it) => !attrOptions.some((item) => item.name === it.name));
-        const newBindAttrs = attrOptions.map((it) => BindAttribute__1.default.from(it, this, 'bindAttrs'));
+        const oldBindAttrs = this.bindAttrs.filter(it => !attrOptions.some(item => item.name === it.name));
+        const newBindAttrs = attrOptions.map(it => BindAttribute__1.default.from(it, this, 'bindAttrs'));
         this.update({
             bindAttrs: [...oldBindAttrs, ...newBindAttrs],
         });
@@ -1995,10 +2059,10 @@ __decorate([
 ], ViewElement.prototype, "children", void 0);
 __decorate([
     (0, translator_1.withSourceMap)()
-], ViewElement.prototype, "toEmbeddedTS", null);
+], ViewElement.prototype, "toNaturalTS", null);
 __decorate([
     (0, translator_1.withSourceMap)()
-], ViewElement.prototype, "toNaturalTS", null);
+], ViewElement.prototype, "toEmbeddedTS", null);
 __decorate([
     (0, decorators_1.excludedInJSON)()
 ], ViewElement.prototype, "computedStyle", void 0);
@@ -2008,8 +2072,8 @@ ViewElement = ViewElement_1 = __decorate([
 exports.ViewElement = ViewElement;
 classMap_1.default.ViewElement = ViewElement;
 exports.default = ViewElement;
-//= ===============================================================================
+//================================================================================
 // ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑
 // 自动生成的代码已结束。下面可以手动编写。
-//= ===============================================================================
+//================================================================================
 //# sourceMappingURL=ViewElement__.js.map