@lcap/nasl 0.3.10-beta → 0.3.10-beta.10

package/src/types/page/Element.ts

@@ -7,7 +7,6 @@ import { vertexsMap } from '../cacheData';
 import Variable from '../logic/Variable';
 import * as babelParser from '@babel/parser';
 import { isPlainObject, cloneDeep, mapValues } from 'lodash';
-import * as utilsAll from '../../../src/types/utils/string';
 import { refreshHtml } from '../cache';
 import { BusinessCode } from '../enum';
 
@@ -31,14 +30,14 @@ export interface ParseContext {
 
 export function catchFn(view: View) {
     return async (err: any) => {
-        if(err.code !== BusinessCode.HasReferenced)  // 节点被引用，不用刷新数据
+        if (err.code !== BusinessCode.HasReferenced) // 节点被引用，不用刷新数据
             await refreshHtml(view);
         else
             config.defaultApp?.emit('saved', err);
 
         config.defaultApp?.history.load();
         throw err;
-    }
+    };
 }
 
 /**
@@ -76,6 +75,12 @@ export class Element extends Vertex {
      */
     @immutable()
     public readonly name: string = undefined;
+
+    /*
+    * 描述信息
+    */
+    @immutable()
+    public readonly description: string = undefined;
     /**
      * 属性列表
      * 和原来的 attrsList 不同，注意区分
@@ -155,6 +160,16 @@ export class Element extends Vertex {
      */
     @immutable()
     public readonly children?: Array<Element> = [];
+    /**
+     * 标签名前缀
+     */
+    @immutable()
+    public static readonly TAG_NAME_REG?: RegExp = /^([lieu]|van)[-_]/;
+    /**
+     * 忽略命名的标签
+     */
+    @immutable()
+    public static readonly ignoreTag?: Array<string> = ['div', 'span'];
 
     /**
      * @param source 需要合并的部分参数
@@ -181,45 +196,45 @@ export class Element extends Vertex {
         }
 
         config.defaultApp?.emit('saving');
-            if (actionOptions?.actionMode !== ACTION_MODE.undoRedo) {
-                const body = this.toJSON();
-                body.parentId = this.parent && this.parent.id;
-                body._posIndex = this.parent && this.parent.children.indexOf(this);
-                utils.logger.debug('添加元素', body);
-                const result = await elementService.create({
-                    headers: {
-                        appId: config.defaultApp?.id,
-                        operationAction: 'Element.create',
-                        operationDesc: `添加组件"${this.getElementTitle()}"`,
-                    },
-                    body,
-                }).catch(catchFn(this.view));
-
-                this.deepPick(result, ['id', 'parentId', 'elementId']);
-                // attr,directive,event的id,exprssion需要合并
-                this.attrList.forEach((attr, index) => {
-                    attr.deepPick(result.attrList[index], ['id', 'expression']);
-                });
-                this.directiveList.forEach((directive, index) => {
-                    directive.deepPick(result.directiveList[index], ['id', 'expression']);
-                });
-                this.eventList.forEach((event, index) => {
-                    event.deepPick(result.eventList[index], ['id']);
-                });
-            }
-
-            this.view && this.view.emit('change');
-
-            if (actionOptions?.loadHistory !== false) {
-                await config.defaultApp?.history.load(actionOptions?.actionMode !== ACTION_MODE.undoRedo && {
+        if (actionOptions?.actionMode !== ACTION_MODE.undoRedo) {
+            const body = this.toJSON();
+            body.parentId = this.parent && this.parent.id;
+            body._posIndex = this.parent && this.parent.children.indexOf(this);
+            utils.logger.debug('添加元素', body);
+            const result = await elementService.create({
+                headers: {
+                    appId: config.defaultApp?.id,
                     operationAction: 'Element.create',
-                    operationBeforeImage: null,
-                    operationAfterImage: JSON.parse(JSON.stringify(this)),
                     operationDesc: `添加组件"${this.getElementTitle()}"`,
-                });
+                },
+                body,
+            }).catch(catchFn(this.view));
+
+            this.deepPick(result, ['id', 'parentId', 'elementId']);
+            // attr,directive,event的id,expression需要合并
+            this.attrList.forEach((attr, index) => {
+                attr.deepPick(result.attrList[index], ['id', 'expression']);
+            });
+            this.directiveList.forEach((directive, index) => {
+                directive.deepPick(result.directiveList[index], ['id', 'expression']);
+            });
+            this.eventList.forEach((event, index) => {
+                event.deepPick(result.eventList[index], ['id']);
+            });
+        }
+
+        this.view && this.view.emit('change');
+
+        if (actionOptions?.loadHistory !== false) {
+            await config.defaultApp?.history.load(actionOptions?.actionMode !== ACTION_MODE.undoRedo && {
+                operationAction: 'Element.create',
+                operationBeforeImage: null,
+                operationAfterImage: JSON.parse(JSON.stringify(this)),
+                operationDesc: `添加组件"${this.getElementTitle()}"`,
+            });
             config.defaultApp?.emit('saved');
-            }
-            return this;
+        }
+        return this;
     }
     /**
      * 删除元素
@@ -229,6 +244,7 @@ export class Element extends Vertex {
         if (actionOptions?.actionMode === ACTION_MODE.local) {
             const index = this.parent.children.indexOf(this);
             ~index && this.parent.children.splice(index, 1);
+            this.deepRemoveElementsName();
             this.view && this.view.emit('local-change');
             return this;
         }
@@ -240,21 +256,24 @@ export class Element extends Vertex {
 
         if (actionOptions?.actionMode !== ACTION_MODE.undoRedo) {
             if (this.id) {
-                    await elementService.delete({
-                        headers: {
-                            appId: config.defaultApp?.id,
-                            operationAction: 'Element.delete',
-                            operationDesc: `删除组件"${this.getElementTitle()}"`,
-                        },
-                        query: {
-                            id: this.id,
-                        },
-                    }).catch(catchFn(this.view));
+                await elementService.delete({
+                    headers: {
+                        appId: config.defaultApp?.id,
+                        operationAction: 'Element.delete',
+                        operationDesc: `删除组件"${this.getElementTitle()}"`,
+                    },
+                    query: {
+                        id: this.id,
+                    },
+                }).catch(catchFn(this.view));
             }
         }
 
         const index = this.parent.children.indexOf(this);
         ~index && this.parent.children.splice(index, 1);
+
+        // 递归删除组件名的缓存
+        this.deepRemoveElementsName();
         this.destroy();
         this.view && this.view.emit('change');
         if (actionOptions?.loadHistory !== false) {
@@ -274,32 +293,32 @@ export class Element extends Vertex {
             config.defaultApp?.emit('saving');
 
             source && this.assign(source);
-                if (actionOptions?.actionMode !== ACTION_MODE.undoRedo) {
-                    const body = this.toPlainJSON();
-                    utils.logger.debug('修改组件', body);
-                    await elementService.update({
-                        headers: {
-                            appId: config.defaultApp?.id,
-                            operationAction: actionOptions?.actionName || 'Element.update',
-                            operationDesc: actionOptions?.actionDesc || `修改组件"${this.getElementTitle()}"`,
-                        },
-                        body,
-                    }).catch(catchFn(this.view));
-                }
+            if (actionOptions?.actionMode !== ACTION_MODE.undoRedo) {
+                const body = this.toPlainJSON();
+                utils.logger.debug('修改组件', body);
+                await elementService.update({
+                    headers: {
+                        appId: config.defaultApp?.id,
+                        operationAction: actionOptions?.actionName || 'Element.update',
+                        operationDesc: actionOptions?.actionDesc || `修改组件"${this.getElementTitle()}"`,
+                    },
+                    body,
+                }).catch(catchFn(this.view));
+            }
 
-                this.view && this.view.emit('change');
-                await config.defaultApp?.history.load(actionOptions?.actionMode !== ACTION_MODE.undoRedo && {
-                    operationAction: 'Element.update',
-                    operationBeforeImage: null,
-                    operationAfterImage: null,
-                    operationDesc: `修改组件"${this.getElementTitle()}"`,
-                });
+            this.view && this.view.emit('change');
+            await config.defaultApp?.history.load(actionOptions?.actionMode !== ACTION_MODE.undoRedo && {
+                operationAction: 'Element.update',
+                operationBeforeImage: null,
+                operationAfterImage: null,
+                operationDesc: `修改组件"${this.getElementTitle()}"`,
+            });
 
                 config.defaultApp?.emit('saved');
                 return this;
     }
 
-        /**
+    /**
      * 按当前 id 加载逻辑数据
      */
     async load() {
@@ -379,6 +398,8 @@ export class Element extends Vertex {
 
         const index = this.parent.children.indexOf(this);
         const newNode = Element.fromHTML(code, this.parent, this.view);
+        // 复制的元素需重新命名
+        newNode.deepRenameElements();
 
         const mergeExpression = (originList: Array<Attr|Directive>, newList: Array<Attr|Directive>) => {
             newList.forEach((item) => {
@@ -436,7 +457,7 @@ export class Element extends Vertex {
         // 处理弹窗组件的命名问题
         if (newNode.tag === 'u-modal') {
             Object.assign(newNode, {
-                name: utilsAll.unique('saveModal1', existingNames as any),
+                name: utils.unique('saveModal1', existingNames as any),
             });
         }
 
@@ -465,6 +486,8 @@ export class Element extends Vertex {
         }
         if (isPlainObject(child)) {
             child = Element.from(child, this, this.view);
+            child.initElementName();
+            child.deepRenameElements();
         }
         if (!this.children.includes(child)) {
             const index = child._posIndex === undefined ? this.children.length : child._posIndex;
@@ -496,7 +519,7 @@ export class Element extends Vertex {
         await this.update(undefined, {
             actionDesc: `设置组件"${this.getElementTitle()}"的名称为"${name}"`,
         });
-        
+
         if (!(window as any).globalData.hasUserCenter) {
             // 同步权限
             new Nuims({
@@ -510,6 +533,22 @@ export class Element extends Vertex {
             this.view.page.service.emit('vertexIdToNameChange', this.id, this.name);
         }
     }
+
+    /**
+     * 更新描述信息
+     * @param description 
+     */
+    async setDescription(description: string) {
+        this.assign({ description });
+        await this.update(undefined, {
+            actionDesc: `设置组件"${this.getElementTitle()}"的描述为"${description}"`,
+        });
+
+        this.view && this.view.emit('change');
+        if (this.view && this.view.page && this.view.page.service) {
+            this.view.page.service.emit('vertexIdToNameChange', this.id, this.name);
+        } 
+    }
     /**
      * 添加组件属性
      */
@@ -730,8 +769,11 @@ export class Element extends Vertex {
                 if (attr.level === LEVEL_ENUM.attr) {
                     const api = config.allNodesAPI[el.tag];
                     const apiOfAttr = api && api.attrs && api.attrs.find((_attr) => _attr.name === attr.name);
-                    if (apiOfAttr && apiOfAttr['designer-value']) {
-                        const designerValue = apiOfAttr['designer-value'].replace(/"/g, '\'');
+                    if (apiOfAttr && apiOfAttr['designer-value'] !== undefined) {
+                        let designerValue = apiOfAttr['designer-value'];
+                        if (typeof designerValue === 'string') {
+                            designerValue = designerValue.replace(/"/g, '\'');
+                        }
                         try {
                             json5.parse(designerValue);
                             return `:${attr.name}="${designerValue}"`;
@@ -844,6 +886,46 @@ export class Element extends Vertex {
             }
         }
     }
+
+    // 初始化组件名
+    public initElementName() {
+        if (Element.ignoreTag.includes(this.tag)) {
+            return;
+        }
+        const name = this.genElementName();
+        this.assign({ name });
+        this.view.addElementName(name);
+    }
+
+    // 生成新的组件名
+    public genElementName(): string {
+        const compNameSet = this.view.elementNameSet;
+        const tagName = this.tag.replace(Element.TAG_NAME_REG, '').replace(/-/g, '_');
+        const componentName = utils.unique(tagName + '1', compNameSet);
+        return componentName;
+    }
+
+    // 递归生成组件名
+    public deepRenameElements(): void {
+        return this.traverseChildren((ele: Element) => {
+            ele.initElementName();
+        });
+    }
+
+    // 递归删除组件名的缓存
+    public deepRemoveElementsName(): void {
+        return this.traverseChildren((ele: Element) => {
+            this.view.removeElementName(ele.name);
+        });
+    }
+
+    // 递归遍历组件
+    public traverseChildren(cb: (ele: Element) => void): void {
+        utils.traverse((current) => {
+            cb(current.node);
+        }, { node: this });
+    }
+
     /**
      * 从 Vue 的 ASTNode 转换成 ASL 元素
      * @param astNode Vue 的 ASTNode
@@ -1322,6 +1404,11 @@ export class Element extends Vertex {
         const element = this.parse(html, context);
         utils.traverse((current) => {
             current.node.assign({ view, parent: current.parent });
+            // 生成唯一组件名 依赖element.view
+
+            if (!current.node.name) {
+                current.node.initElementName();
+            }
         }, { node: element, parent });
         return element;
     }

package/src/types/page/Page.ts

@@ -56,6 +56,13 @@ export class Page extends Vertex {
      */
     @immutable()
     public readonly isIndex: boolean = undefined;
+
+    /**
+     * 描述信息
+     */
+    @immutable()
+    public readonly description: string = undefined;
+
     /**
      * 根页面视图
      */

package/src/types/page/View.ts

@@ -1,6 +1,5 @@
-
 import { immutable, circular, action, excludedInJSON } from '../decorators';
-import { config, history, LEVEL_ENUM, Vertex, PackageJSON, App, Enum, Service, WebService, Structure, Page, Element, utils, ViewParam, ViewVariable, Lifecycle, genFinalCode, generator, Nuims, ActionOptions, ACTION_MODE, vertexsMap, updateDataTypeList, Interface, LogicItem } from '..';
+import { config, history, LEVEL_ENUM, Vertex, PackageJSON, App, Enum, Service, WebService, Structure, Page, Element, utils, ViewParam, ViewVariable, Lifecycle, genFinalCode, generator, Nuims, ActionOptions, ACTION_MODE, vertexsMap, updateDataTypeList, Interface } from '..';
 import Block from './Block';
 import { viewService } from '../../service/page';
 import { Param } from '../logic/Param';
@@ -17,14 +16,6 @@ import * as babel from '@babel/core';
 import view from '@/service/page/view';
 import Entity from '../data/Entity';
 import { postServiceType } from '../../service/common/preprocess';
-export interface FrontEndsourceMap {
-    [id: string]: {
-        isLogic: boolean,
-        node: LogicItem,
-        from: number,
-        to: number,
-    }
-}
 import { catchFn } from './Page';
 
 /**
@@ -68,6 +59,12 @@ export class View extends Block {
      */
     @immutable()
     public readonly title: string = undefined;
+
+     /**
+     * 标题
+     */
+    @immutable()
+    public readonly description: string = undefined;
     /**
      * 面包屑
      */
@@ -121,9 +118,6 @@ export class View extends Block {
      */
     @excludedInJSON()
     public contentPromise: Promise<any> = undefined;
-
-    @excludedInJSON()
-    public sourceMap: FrontEndsourceMap = {};
     /**
      * 输入参数
      */
@@ -140,6 +134,12 @@ export class View extends Block {
      */
     @immutable()
     public readonly moreChildrenFields: Array<string> = ['$def.params', '$def.variables', '$def.logics'];
+    /**
+     * 当前View中所有组件名的缓存
+     */
+    @immutable()
+    public readonly elementNameSet: Set<string> = new Set();
+
     /**
      * @param source 需要合并的部分参数
      */
@@ -208,41 +208,44 @@ export class View extends Block {
                 // def 情况比较特殊，需要单独处理，防止逻辑重新加载
                 this._syncDef($def);
                 this.attachNodePath(true);
-                this.toVueOptions();
                 return this;
             } catch (err) { }
         })().finally(() => this.contentPromise = undefined);
     }
     loadAll(enableCache = true) {
+        const isGONGHANG = utils.getGlobalEnv() === 'gonghang';
+        if (isGONGHANG) {
+            enableCache = false;
+        }
         // 如果有正在进行的 Promise，则直接返回它
         if (this.contentPromise)
             return this.contentPromise;
 
         return this.contentPromise = (async () => {
-                const result: View = await viewService.load({
-                    path: {
-                        id: this.id,
-                    },
-                    query: {
-                        enableCache,
-                    },
-                    config: { noErrorTip: true },
-                });
-                const oldLogics = this.$def.logics;
-                Object.assign(result, {
-                    children: this.children,
-                })
-                const temp = View.from(result, this.parent, this.page, this);
-                const newLogics = temp.$def.logics;
-                oldLogics.forEach((logic) => {
-                    if(!newLogics.find((item) => item.id === logic.id))
-                        logic.destroy();
-                });
-                this.assign(temp);
-                utils.traverse((current) => {
-                    current.node.attachNodePath(true);
-                }, { node: this });
-                return this;
+            const result: View = await viewService.load({
+                path: {
+                    id: this.id,
+                },
+                query: {
+                    enableCache,
+                },
+                config: { noErrorTip: true },
+            });
+            const oldLogics = this.$def.logics;
+            Object.assign(result, {
+                children: this.children,
+            });
+            const temp = View.from(result, this.parent, this.page, this);
+            const newLogics = temp.$def.logics;
+            oldLogics.forEach((logic) => {
+                if (!newLogics.find((item) => item.id === logic.id))
+                    logic.destroy();
+            });
+            this.assign(temp);
+            utils.traverse((current) => {
+                current.node.attachNodePath(true);
+            }, { node: this });
+            return this;
         })().finally(() => this.contentPromise = undefined);
     }
     isContentLoaded() {
@@ -430,16 +433,16 @@ export class View extends Block {
         if (!this.parent)
             throw Error('该子页面为根节点！');
 
-            await viewService.delete({
-                headers: {
-                    appId: config.defaultApp?.id,
-                    operationAction: actionOptions?.actionName || 'View.delete',
-                    operationDesc: actionOptions?.actionDesc || `删除子页面"${this.name}${this.title ? `(${this.title})` : ''}"`,
-                },
-                path: {
-                    id: this.id,
-                },
-            }).catch(catchFn());
+        await viewService.delete({
+            headers: {
+                appId: config.defaultApp?.id,
+                operationAction: actionOptions?.actionName || 'View.delete',
+                operationDesc: actionOptions?.actionDesc || `删除子页面"${this.name}${this.title ? `(${this.title})` : ''}"`,
+            },
+            path: {
+                id: this.id,
+            },
+        }).catch(catchFn());
 
         const index = this.parent.children.indexOf(this);
         ~index && this.parent.children.splice(index, 1);
@@ -541,6 +544,28 @@ export class View extends Block {
         this.page.service.emit('pageTreeChange');
         this.emit('change');
     }
+
+     /**
+     * 描述信息
+     * @param description 描述信息
+     */
+    @action('设置子页面面包屑')
+    async setDescription(description: string) {
+        const oldDescription = this.description;
+        this.assign({ description });
+        console.info('description abc', description);
+        await this.update(undefined, {
+            actionDesc: `设置页面"${oldDescription}"的描述为"${description}"`,
+        });
+
+        if (this.page.rootView === this) {
+            this.page.assign({ description });
+            await this.page.update();
+        }
+
+        this.page.service.emit('pageTreeChange');
+        this.emit('change');
+    }
     /**
      * 设置该子页面为默认跳转页
      */
@@ -681,6 +706,7 @@ export class View extends Block {
         let componentOptions = 'const componentOptions = {};';
         if (this.script)
             componentOptions = this.script.trim().replace(/export default |module\.exports +=/, 'const componentOptions = ');
+
         const $def = JSON.parse(JSON.stringify(this.$def));
         $def.title = this.title;
         $def.crumb = this.crumb;
@@ -706,16 +732,10 @@ export class View extends Block {
         //         );
         //     }
         // }, { node: $def }, { mode: 'anyObject' });
-        const {
-            output,
-            sourceMap,
-        } = translator($def, this.script);
-        return {
-            script: `${componentOptions}${genFinalCode(output, options && options.finalCode)}
+        return `${componentOptions}
+        ${genFinalCode(translator($def), options && options.finalCode)}
         export default componentOptions;
-`,
-            sourceMap,
-        };
+`;
     }
     /**
      * 转换成 Vue 文件
@@ -749,12 +769,9 @@ export class View extends Block {
      * @TODO 后面 template 可以优化成 render 函数
      */
     toVueOptions(options?: ElementToVueOptions) {
-        const { script, sourceMap } = this.toScript(options);
-        this.sourceMap = sourceMap;
         return {
             template: this.$html.toVue(options),
-            script,
-            sourceMap,
+            script: this.toScript(options),
             // definition: JSON.stringify(this.$def),
         };
     }
@@ -928,6 +945,40 @@ export class View extends Block {
         // config.defaultApp?.emit('saved');
     }
 
+    // 遍历页面缓存所有组件名
+    traverseAllElementName(): void {
+        this.elementNameSet.clear();
+        utils.traverse(({ node }) => {
+            node && this.elementNameSet.add(node.name);
+        }, { node: this.$html });
+    }
+
+    // 组件名是否有效
+    isValidElementName(name: string): boolean {
+        if (name) {
+            return !this.elementNameSet.has(name);
+        }
+        return false;
+    }
+
+    // 保存组件名至缓存
+    addElementName(nameOrElement: string | Element) {
+        let name: string = nameOrElement as string;
+        if (nameOrElement instanceof Element) {
+            name = nameOrElement.name;
+        }
+        return this.elementNameSet.add(name);
+    }
+
+    // 在缓存中移除组件名
+    removeElementName(nameOrElement: string | Element): void {
+        let name: string = nameOrElement as string;
+        if (nameOrElement instanceof Element) {
+            name = nameOrElement.name;
+        }
+        this.elementNameSet.delete(name);
+    }
+
     _removeDef($def: View['$def']) {
         const removedParams = this.$def.params.filter((param) => $def.params?.find((item) => param.id === item.id));
         this.$def.params = this.$def.params.filter((param) => !$def.params?.find((item) => param.id === item.id));