feat: 低代码文件编辑历史记录 crud 功能完成

apps/designer/src/io/history.ts

@@ -2,10 +2,10 @@ import instance from './instance';
 import { type HistorySchema } from '@vtj/core';
 
 export type LowCodeHistorySchema = {
-  project_id: string;
-  id: string;
-  page_id?: string;
-  block_id?: string;
+  project_id: number;
+  file_id: string;
+  history_id: string;
+  id?: string;
   dsl?: HistorySchema;
 };
 
@@ -15,8 +15,40 @@ function transformHistoryData(data: LowCodeHistorySchema) {
     dsl: JSON.stringify(data.dsl || {})
   };
 }
-export const getHistories = async () => {
-  const response = await instance.get('/api/v1/histories');
+
+export type HistoriesResponse = {
+  code: number;
+  data: {
+    list: Array<{
+      id: number;
+      project_id: number;
+      file_id: string;
+      history_id: string;
+      dsl: Record<string, any>;
+      created_at: string;
+      updated_at: string;
+    }>;
+    total: number;
+  };
+  message: string;
+};
+
+export type GetHistoriesParams = {
+  project_id: number;
+  file_id: string;
+  page?: number;
+  per_page?: number;
+};
+
+export const getHistories = async (params: GetHistoriesParams) => {
+  const response = await instance.get<HistoriesResponse>('/api/v1/histories', {
+    params: {
+      project_id: params.project_id,
+      file_id: params.file_id,
+      ...(params.page && { page: params.page }),
+      ...(params.per_page && { per_page: params.per_page })
+    }
+  });
   return response.data;
 };
 

apps/designer/src/service/index.ts

@@ -23,9 +23,9 @@ import {
   updateHistory as updateLowCodeHistory,
   deleteHistory as deleteLowCodeHistory,
   getHistories as getLowCodeHistories,
-  createHistory as createLowCodeHistory
+  createHistory as createLowCodeHistory,
+  getHistories
 } from '@/io';
-import { isNumeric } from 'licia-es';
 const storage = new Storage({
   type: 'local',
   expired: 0
@@ -41,7 +41,7 @@ const stringifyFields = [
   'meta'
 ];
 
-export class StorageService extends BaseService {
+export class LowCodeService extends BaseService {
   public async init(project: ProjectSchema): Promise<ProjectSchema> {
     const remoteProject = await getProject('2');
     const model = new ProjectModel(remoteProject);
@@ -81,7 +81,6 @@ export class StorageService extends BaseService {
   }
 
   public async saveFile(file: BlockSchema): Promise<boolean> {
-    console.log('saveFile', file);
     if (file.id) {
       const existFile = await getLowCodeFile(file.id);
       if (existFile.file_id) {
@@ -115,7 +114,6 @@ export class StorageService extends BaseService {
   }
 
   public async getFile(id: string): Promise<BlockSchema> {
-    console.log('getFile', id);
     return getLowCodeFile(id).then((lowCodeFile) => {
       if (lowCodeFile.dsl) {
         return Promise.resolve(lowCodeFile.dsl as BlockSchema);
@@ -130,14 +128,6 @@ export class StorageService extends BaseService {
   }
 
   public async saveHistory(history: HistorySchema): Promise<boolean> {
-    console.log('saveHistory', history);
-    // const existHistory = await getLowCodeHistory(history.id);
-    // if (existHistory.history_id) {
-    //   await updateLowCodeHistory(history.id, history);
-    // } else {
-    //   await createLowCodeHistory(history);
-    // }
-    storage.save(`history_${history.id}`, history);
     return Promise.resolve(true);
   }
 
@@ -150,40 +140,52 @@ export class StorageService extends BaseService {
     console.log('uploader', file, projectId);
     return Promise.resolve(true);
   };
-
+  // TODO: 做成数据库存储后没啥用，保留就行
   public removeHistory(id: string): Promise<boolean> {
-    return deleteLowCodeHistory(id).then((res) => {
-      console.log('removeHistory', res);
-      return Promise.resolve(true);
-    });
-  }
-
-  public async getHistory(id: string): Promise<HistorySchema> {
-    const dsl = storage.get(`history_${id}`);
-    console.log('getHistoryDSL', dsl);
-    const history = new HistoryModel(dsl || { id });
-    console.log('getHistory', dsl, id, history);
-    // const histories = await getLowCodeHistories(id);
-    return Promise.resolve(history.toDsl());
-  }
-
-  public getHistoryItem(fId: string, id: string): Promise<HistoryItem> {
-    const item = storage.get(`history_${fId}_${id}`);
-    console.log('getHistoryItem', item);
-    return Promise.resolve(item);
-  }
-
-  public saveHistoryItem(fileId: string, item: HistoryItem): Promise<boolean> {
-    console.log('saveHistoryItem', fileId, item);
-    storage.save(`history_${fileId}_${item.id}`, item);
+    console.log('removeHistory', id);
     return Promise.resolve(true);
   }
 
-  public removeHistoryItem(fId: string, ids: string[]): Promise<boolean> {
-    ids.forEach((id) => {
-      storage.remove(`history_${fId}_${id}`);
-      console.log('removeHistoryItem', fId, id);
+  public async getHistory(fileId: string): Promise<HistorySchema> {
+    const histories = await getHistories({
+      project_id: 2,
+      file_id: fileId,
+      per_page: 50
     });
+    const formatDsl = {
+      id: histories.list[0].file_id,
+      items: histories.list.map((item) => {
+        return {
+          ...item,
+          id: item.history_id,
+          label: item.created_at
+        };
+      })
+    };
+    const history = new HistoryModel(formatDsl);
+    return Promise.resolve(history.toDsl());
+  }
+
+  public async getHistoryItem(fId: string, id: string): Promise<HistoryItem> {
+    const history = await getLowCodeHistory(id);
+    return Promise.resolve(history);
+  }
+
+  public async saveHistoryItem(
+    fileId: string,
+    historyItem: HistoryItem
+  ): Promise<boolean> {
+    const saveHistory = await createLowCodeHistory({
+      project_id: 2,
+      file_id: fileId,
+      history_id: historyItem.id,
+      dsl: historyItem.dsl as HistorySchema
+    });
+    return Promise.resolve(true);
+  }
+
+  public async removeHistoryItem(fId: string, ids: string[]): Promise<boolean> {
+    await Promise.all(ids.map((id) => deleteLowCodeHistory(id)));
     return Promise.resolve(true);
   }
   public publish(project: ProjectSchema): Promise<boolean> {

apps/designer/src/views/index.vue

@@ -10,16 +10,16 @@ import {
   // type ProjectModel
 } from '@vtj/pro';
 
-import { StorageService } from '@/service';
+import { LowCodeService } from '@/service';
 
 const container = ref();
-const service = new StorageService();
+const service = new LowCodeService();
 
 const engine = new Engine({
   container,
   service,
   project: {
-    id: 'test',
+    id: '2',
     name: '测试'
   }
 });

apps/designer/src/views/preview.vue

@@ -5,14 +5,13 @@
 import { ref, getCurrentInstance } from 'vue';
 import { useRoute } from 'vue-router';
 import { createProvider, ContextMode } from '@vtj/pro';
-import { StorageService } from '@/service';
-const service = new StorageService();
+import { LowCodeService } from '@/service';
+const service = new LowCodeService();
 const { provider, onReady } = createProvider({
   mode: ContextMode.Runtime,
   service,
   project: {
-    id: 'test',
-    name: '测试'
+    id: '2'
   },
   dependencies: {
     Vue: () => import('vue'),