@lcap/nasl 3.3.2-beta.2 → 3.3.2-beta.4

package/src/service/storage/init.ts

@@ -1,3 +1,4 @@
+import { cloneDeep } from 'lodash';
 import { App, LogicItem, Logic, Module, View, ViewElement, Argument, SelectMembers, SynatxNode, BindDirective, CallLogic } from '../../concepts';
 import { addBreakpointNodesFromApp } from '../../breakpoint';
 import { getConceptConstructor } from '../../decorators';
@@ -5,9 +6,9 @@ import { config } from '../../config';
 import storageService from './service';
 import { v4 as uuidv4 } from 'uuid';
 import stepRecorder from '../../manager/stepRecorder';
+import * as jsoner from './jsoner';
 /// #if !process.env.NODE_ENV || process.env.BUILD_TARGET === 'node'
 import * as fs from 'fs-extra';
-import * as jsoner from './jsoner';
 import type { NaslServer } from 'src/server/naslServer';
 /// #endif
 
@@ -21,6 +22,228 @@ export const breakpoint = storageService.breakpoint;
 let tabTimestamp: string;
 export const databaseTypes = storageService.databaseTypes;
 
+export const operationRecordInfoMap: Map<string, any> = new Map();
+
+// 操作栈记录
+export function doOperationRecord(operation: Operation) {
+  const request = indexedDB.open('naslData', 1);
+
+  request.onupgradeneeded = (event: any) => {
+    const db = event.target.result;
+    const objectStore = db.createObjectStore('operationRecord', { autoIncrement: true });
+    objectStore.createIndex('appId', 'appId');
+    objectStore.createIndex('timestamp', 'timestamp');
+  };
+
+  request.onsuccess = (event: any) => {
+    const db = event.target.result;
+    const transaction = db.transaction('operationRecord', 'readwrite');
+    const objectStore = transaction.objectStore('operationRecord');
+    operation.appId = operationRecordInfoMap.get('appId');
+    operation.branchId = operationRecordInfoMap.get('branchId');
+    operation.accountId = operationRecordInfoMap.get('accountId');
+    operation.userId = operationRecordInfoMap.get('userId');
+    operation.phone = operationRecordInfoMap.get('phone');
+    // 将时间戳添加到记录中
+    operation.timestamp = Date.now();
+    // 这份数据不存在向上的引用，因此用cloneDeep没有关系
+    objectStore.put(cloneDeep(operation));
+    transaction.oncomplete = () => {
+      db.close();
+    };
+  };
+
+  request.onerror = function(event) {
+    console.log('Failed to open database');
+  };
+}
+
+// 删除失效数据
+async function deleteExpiredRecords() {
+  return new Promise((resolve, reject) => {
+    const request = indexedDB.open('naslData', 1);
+
+    request.onupgradeneeded = (event: any) => {
+      const db = event.target.result;
+      const objectStore = db.createObjectStore('operationRecord', { autoIncrement: true });
+      objectStore.createIndex('appId', 'appId');
+      objectStore.createIndex('timestamp', 'timestamp');
+    };
+
+    request.onsuccess = (event: any) => {
+      const db = event.target.result;
+      const transaction = db.transaction('operationRecord', 'readwrite');
+      const objectStore = transaction.objectStore('operationRecord');
+      const index = objectStore.index('timestamp');
+      // 设置有效期，默认7天
+      const localStorageExpiresAt = window.localStorage.getItem('expiresAt');
+      const expiresAt = Date.now() - (localStorageExpiresAt ? +localStorageExpiresAt : 7 * 24 * 60 * 60 * 1000);
+      const range = IDBKeyRange.upperBound(expiresAt);
+      const expiredRecordsRequest = index.openCursor(range);
+
+      expiredRecordsRequest.onsuccess = (event: any) => {
+        const cursor = event.target.result;
+        if (cursor) {
+          console.log(cursor);
+          objectStore.delete(cursor.primaryKey);
+          cursor.continue();
+        } else {
+          resolve(void 0);
+        }
+      };
+
+      transaction.oncomplete = () => {
+        db.close();
+      };
+    };
+
+    request.onerror = (event) => {
+      reject('Failed to open database');
+    };
+  });
+}
+
+// 操作栈查询
+export function operationRecordQuery(app: any) {
+  return new Promise((resolve, reject) => {
+    const appId = app?.id;
+    const request = indexedDB.open('naslData', 1);
+    request.onsuccess = (event: any) => {
+      const db = event.target.result;
+      const transaction = db.transaction('operationRecord', 'readonly');
+      const objectStore = transaction.objectStore('operationRecord');
+      const index = objectStore.index('appId'); // 查询 'appId' 索引
+      const range = IDBKeyRange.only(appId);
+      const request = index.openCursor(range);
+      const result: any[] = [];
+
+      request.onsuccess = (event: any) => {
+        const cursor = event.target.result;
+        if (cursor) {
+          const record = cursor.value;
+          const branchId = operationRecordInfoMap.get('branchId');
+          if (record.branchId === branchId) {
+            result.push(record);
+          }
+          cursor.continue();
+        } else {
+          console.log('操作记录栈：', result);
+          resolve(result);
+        }
+      };
+
+      transaction.oncomplete = () => {
+        db.close();
+      };
+    };
+
+    request.onerror = (event) => {
+      reject('Failed to open database');
+    };
+  });
+}
+
+// 获取父对象
+function getParentInfo(appJson: any, path: string) {
+  const pathArr: string[] = [];
+  (path?.split('.') || []).forEach((pathItem: string) => {
+    const arrayPropertyKey = pathItem.split('[')[0];
+    const matchArr = pathItem.match(/\[(.+?)\]/);
+    if (matchArr) {
+      pathArr.push(arrayPropertyKey, matchArr[0]);
+    } else {
+      pathArr.push(pathItem);
+    }
+  });
+  pathArr.pop();
+  let parentPath = '';
+  pathArr.forEach((pathItem: string, index: number) => {
+    const matchArr = pathItem.match(/\[(.+?)\]/);
+    if (matchArr || index === 0) {
+      parentPath += pathItem;
+    } else {
+      parentPath += `.${pathItem}`
+    }
+  });
+  const parentNode = jsoner.queryNodeByPath(appJson, parentPath);
+  return {
+    parentPath,
+    parentNode,
+  };
+}
+
+// 操作记录回放
+export async function operationRecordPlayback(app: any, action: 'undo' | 'redo') {
+  const operationRecord: any = await operationRecordQuery(app);
+  let operationRecordIndex = operationRecordInfoMap.get('operationRecordIndex');
+  if ([null, undefined].includes(operationRecordIndex)) {
+    operationRecordIndex = operationRecord?.length;
+  }
+  const appJson = app.toJSON();
+  if (action === 'undo') {
+    if (operationRecordIndex > 0) {
+      const currentRecordItem = operationRecord?.[operationRecordIndex];
+      const { type, action: recordItemAction } = currentRecordItem || {};
+      // 多人协作
+      if (type === 'cooperation' && recordItemAction === 'confirmPull') {
+        console.log(`当前所处栈位置:${operationRecordIndex}，已经进行了多人协作“合并”操作，无法继续对操作栈进行回放！`);
+        return;
+      }
+      operationRecordIndex--;
+    } else {
+      console.log(`当前所处栈位置:${operationRecordIndex},无法继续回放`);
+      console.log('当前appJSON:', appJson);
+      return;
+    }
+  } else {
+    if (operationRecordIndex < operationRecord?.length) {
+      operationRecordIndex++;
+    } else {
+      console.log(`当前所处栈位置:${operationRecordIndex},无法继续前进`);
+      console.log('当前appJSON:', appJson);
+      return;
+    }
+  }
+  operationRecordInfoMap.set('operationRecordIndex', operationRecordIndex);
+  const currentIndex = operationRecordIndex;
+  ([...operationRecord].splice(currentIndex, operationRecord?.length) || []).reverse()?.forEach((recordItem: any) => {
+    const { actionItem } = recordItem || {};
+    const { list } = actionItem || {};
+    [...(list || [])].reverse().forEach((actionItem: any) => {
+      const { path, action, oldObject, parentKey, index: oldIndex } = actionItem || {};
+      const { parentNode } = getParentInfo(appJson, path);
+      const node = jsoner.queryNodeByPath(appJson, path);
+      switch (action) {
+        case 'create':
+          if (Array.isArray(parentNode)) {
+            const index = parentNode.indexOf(node);
+            if (index !== -1) {
+              parentNode.splice(index, 1);
+            }
+          } else {
+            parentNode[parentKey] = null;
+          }
+          break;
+        case 'delete':
+          if (Array.isArray(parentNode) && oldIndex !== -1) {
+            parentNode.splice(oldIndex, 0, oldObject);
+          } else {
+            parentNode[parentKey] = oldObject;
+          }
+          break;
+        case 'update':
+          for (const key in oldObject) {
+            (node as any)[key] = oldObject[key] ?? null;
+          }
+          break;
+      }
+    });
+  });
+  console.log('当前所处栈位置:', currentIndex);
+  console.log('当前appJSON:', appJson);
+  return appJson;
+}
+
 function getLogic(key: string, app: any, diffLogicList: string[]) {
   if (!diffLogicList.includes(key)) {
     diffLogicList.push(key);
@@ -47,6 +270,7 @@ function getLogic(key: string, app: any, diffLogicList: string[]) {
     }
   }
 }
+
 /* 获取LogicITEM */
 function getStatement(state: any, app: any, diffLogicList: string[]) {
   let logicItems = [];
@@ -149,6 +373,11 @@ const handleAIPoint = (app: any, actionItem: any) => {
  *  执行更新
  */
 async function doAction(app: any, actionItem: any) {
+  const isOperationRecord = operationRecordInfoMap.get('isOperationRecord');
+  if (isOperationRecord) {
+    console.log('正在进行操作栈回放操作，如需行任何Nasl操作请刷新页面');
+    return;
+  }
   let hasFrontEnd = false;
   let hasBackEnd = false;
   const actionList: any[] = [];
@@ -375,19 +604,39 @@ async function doAction(app: any, actionItem: any) {
     return;
   }
 
+  const uuid = uuidv4().replace(/-/g, '');
   const instructList = [{
-    uuid: uuidv4().replace(/-/g, ''),
+    uuid,
     actions: actionList,
   }];
-  saveNasl({ app, hasFrontEnd, hasBackEnd, instructList });
-
+  const operation: Operation = {
+    type: 'doAction',
+    uuid,
+    actionItem: {
+      actionMsg,
+      list: list.map((item: any) => {
+        const { path, action, object, oldObject, parentKey, index } = item?.originEvent || {};
+        return {
+          path,
+          action,
+          parentKey,
+          index,
+          object: object?.toJSON?.() || object,
+          oldObject: oldObject?.toJSON?.() || oldObject,
+        }
+      }),
+    },
+  };
+  saveNasl({ app, hasFrontEnd, hasBackEnd, instructList, operationList: [operation] });
+  // 进行nasl操作后需要将Index重置
+  operationRecordInfoMap.set('operationRecordIndex', null);
   if (!app._historying) {
     if (app._historyIndex !== app._historyList.length) {
       app._historyList = app._historyList.splice(0, app._historyIndex);
     }
     app._historyList.push({
       actionMsg,
-      list: list.map((item: any) => item.originEvent),
+      list: list.map((item: any) => item?.originEvent),
     });
     app._historyIndex = app._historyList.length;
   } else {
@@ -414,6 +663,7 @@ type TaskOption = {
   hasFrontEnd: boolean,
   hasBackEnd: boolean,
   instructList: Instruct[],
+  operationList: Operation[],
 };
 enum TaskQueueStatus {
   ExceedMaxTaskCount,
@@ -461,6 +711,7 @@ class TaskQueue {
     let hasFrontEnd = false;
     let hasBackEnd = false;
     let instructList: Instruct[] = [];
+    let operationList: Operation[] = [];
 
     for (const task of queue) {
       if (task.hasFrontEnd)
@@ -468,6 +719,7 @@ class TaskQueue {
       if (task.hasBackEnd)
         hasBackEnd = true;
       instructList = instructList.concat(task.instructList);
+      operationList = operationList.concat(task.operationList);
     }
 
     if (queue === this.queue) {
@@ -477,11 +729,11 @@ class TaskQueue {
 
     this.running = true;
     const error = await _saveNasl({
-      app, hasFrontEnd, hasBackEnd, instructList,
+      app, hasFrontEnd, hasBackEnd, instructList, operationList
     });
 
     // code: 401650, 检测到当前应用拉取操作已被强制结束, 用户确认后再刷新
-    // code: 500502  msg: "该应用已在新tab 页打开，请刷新!"      不重试或刷新
+    // code: 500502  msg: '该应用已在新tab 页打开，请刷新!'      不重试或刷新
     if (!error)
       this.recover(app);
     else if (![401650, 500502].includes(error.code)) {
@@ -551,8 +803,24 @@ async function saveNasl(options: TaskOption) {
   taskQueue.addTask(options);
 }
 
+class Operation {
+  appId?: string;
+  branchId?: string;
+  accountId?: string;
+  userId?: string;
+  phone?: string;
+  actionItem: any;
+  res?: any;
+  err?: any;
+  parentKey?: string;
+  timestamp?: any;
+  type?: string;
+  uuid?: string;
+  action?: string;
+}
+
 async function _saveNasl(options: TaskOption) {
-  const { app, hasFrontEnd, hasBackEnd, instructList } = options;
+  const { app, hasFrontEnd, hasBackEnd, instructList, operationList } = options;
   app.emit('saving');
   let ChangedNASLType = '';
   if (hasFrontEnd && hasBackEnd) {
@@ -562,10 +830,13 @@ async function _saveNasl(options: TaskOption) {
   } else if (hasBackEnd) {
     ChangedNASLType = 'backend';
   }
-  let err;
+  let res: any;
+  let err: any;
+
   if (config.storage.protocol === 'http') {
     try {
-      await storageService.batchInstruct({
+      // 接口请求
+      res = await storageService.batchInstruct({
         body: instructList,
         headers: {
           appId: app.id,
@@ -577,6 +848,13 @@ async function _saveNasl(options: TaskOption) {
     } catch (error) {
       err = error;
     }
+    operationList.forEach((operation) => {
+      doOperationRecord({
+        ...operation,
+        res,
+        err,
+      });
+    });
   } else if (config.storage.protocol === 'mock') {
     // Do nothing
   } else {
@@ -741,6 +1019,10 @@ type BreakpointItem =
  * @returns app 对象
  */
 export async function loadApp(appId?: string) {
+  try {
+    // 删除失效数据
+    deleteExpiredRecords();
+  } catch(err) { }
   let app: App;
   if (config.storage.protocol === 'http') {
     console.time('batchQuery');

package/src/utils/index.ts

@@ -188,3 +188,16 @@ export function replaceNode(oldNode: any, newNode: any) {
     app.emit('collect:end');
   }
 }
+
+
+export function attrConvertCamelCase(str: string) {
+  let strList: string[] = str.split('-');
+  strList = strList.map((strItem, index) => {
+    if (index === 0) {
+      return strItem;
+    } else {
+      return `${strItem.slice(0, 1).toUpperCase()}${strItem.slice(1)}`;
+    }
+  });
+  return strList.join('');
+}

package/test/concepts/member-expression/__snapshots__/toJS.spec.ts.snap

@@ -6,7 +6,7 @@ exports[`member-expression:toJS app.enums.UserStatusEnum 1`] = `
 `;
 
 exports[`member-expression:toJS elements.table-view.data 1`] = `
-"this[\\"__tableView_data-source\\"];
+"this[\\"__tableView_dataSource\\"];
 "
 `;
 

package/test/concepts/member-expression/__snapshots__/toVue.spec.ts.snap

@@ -6,7 +6,7 @@ exports[`member-expression:toVue app.enums.UserStatusEnum 1`] = `
 `;
 
 exports[`member-expression:toVue elements.table-view.data 1`] = `
-"<template>this['__tableView_data-source']</template>
+"<template>__tableView_dataSource</template>
 "
 `;
 

package/test/concepts/view-element/__snapshots__/toVue.spec.ts.snap

@@ -150,28 +150,7 @@ exports[`view-element:toVue with-table 1`] = `
       </u-linear-layout>
       <u-table-view
         :ref=\\"\`tableView\`\\"
-        :data-source=\\"
-          (params) => {
-            this['__tableView_params'] = { ...params };
-            return this.$logics['app.logics.loadTestTableView2']({
-              config: {
-                download: false,
-              },
-              query: {},
-              headers: {
-                'lcap-calllogic-uuid': '217e2a4c84424b5387b6a1c69a4bbb47',
-              },
-              path: {},
-              body: {
-                page: this['__tableView_params']?.page,
-                size: this['__tableView_params']?.size,
-                sort: this['__tableView_params']?.sort,
-                order: this['__tableView_params']?.order,
-                filter: filter1,
-              },
-            });
-          }
-        \\"
+        :data-source=\\"__tableView_dataSourceLoad\\"
         :data-schema=\\"\`LoadTestTableView2Structure\`\\"
         :value-field=\\"\`entity2.id\`\\"
         :pagination=\\"true\\"