feat: enhance AutoProbe state management with page pattern and data handling

frontend/crawlab-ui/src/interfaces/models/autoprobe.d.ts

@@ -14,7 +14,7 @@ export declare global {
   }
 
   // Hierarchical pattern structure for V2
-  interface PatternV2 {
+  interface PatternV2 extends BaseModel {
     name: string;
     type: PatternTypeV2;
     selector_type?: SelectorType;
@@ -23,6 +23,15 @@ export declare global {
     extraction_type?: ExtractType;
     attribute_name?: string;
     children?: PatternV2[];
+    parent_id?: string;
+  }
+
+  type PatternTypeV2 = 'field' | 'list' | 'list-item' | 'action' | 'content';
+
+  interface PatternDataV2 extends BaseModel {
+    task_id: string;
+    pattern_id: string;
+    data?: any;
   }
 
   interface PagePatternV2 {
@@ -30,7 +39,12 @@ export declare global {
     children?: PatternV2[];
   }
 
-  type PatternTypeV2 = 'field' | 'list' | 'list-item' | 'action' | 'content';
+  interface AutoProbeNavItemV2<T = any> extends NavItem<T> {
+    name?: string;
+    type?: PatternTypeV2;
+    children?: AutoProbeNavItemV2[];
+    parent?: AutoProbeNavItemV2;
+  }
 
   type AutoProbeTaskStatus =
     | 'pending'

frontend/crawlab-ui/src/interfaces/store/modules/autoprobe.d.ts

@@ -5,13 +5,23 @@ type AutoProbeStoreModule = BaseModule<
   AutoProbeStoreActions
 >;
 
-interface AutoProbeStoreState extends BaseStoreState<AutoProbe> {}
+interface AutoProbeStoreState extends BaseStoreState<AutoProbe> {
+  pagePattern?: PagePatternV2;
+  pagePatternData?: PatternDataV2[];
+}
 
 type AutoProbeStoreGetters = BaseStoreGetters<AutoProbe>;
 
-interface AutoProbeStoreMutations extends BaseStoreMutations<AutoProbe> {}
+interface AutoProbeStoreMutations extends BaseStoreMutations<AutoProbe> {
+  setPagePattern: StoreMutation<AutoProbeStoreState, PagePatternV2>;
+  resetPagePattern: StoreMutation<AutoProbeStoreState>;
+  setPagePatternData: StoreMutation<AutoProbeStoreState, PatternDataV2[]>;
+  resetPagePatternData: StoreMutation<AutoProbeStoreState>;
+}
 
 interface AutoProbeStoreActions extends BaseStoreActions<AutoProbe> {
   runTask: StoreAction<AutoProbeStoreState, { id: string }>;
   cancelTask: StoreAction<AutoProbeStoreState, { id: string }>;
+  getPagePattern: StoreAction<AutoProbeStoreState, { id: string }>;
+  getPagePatternData: StoreAction<AutoProbeStoreState, { id: string }>;
 }

frontend/crawlab-ui/src/store/modules/autoprobe.ts

@@ -32,6 +32,8 @@ const state = {
     { id: TAB_NAME_TASKS, title: t('common.tabs.tasks') },
     { id: TAB_NAME_PATTERNS, title: t('common.tabs.patterns') },
   ],
+  pagePattern: undefined,
+  pagePatternData: [],
 } as AutoProbeStoreState;
 
 const getters = {
@@ -40,21 +42,52 @@ const getters = {
 
 const mutations = {
   ...getDefaultStoreMutations<AutoProbe>(),
+  setPagePattern(state: AutoProbeStoreState, pagePattern: PagePatternV2) {
+    state.pagePattern = pagePattern;
+  },
+  resetPagePattern(state: AutoProbeStoreState) {
+    state.pagePattern = undefined;
+  },
+  setPagePatternData(
+    state: AutoProbeStoreState,
+    pagePatternData: PatternDataV2[]
+  ) {
+    state.pagePatternData = pagePatternData;
+  },
+  resetPagePatternData(state: AutoProbeStoreState) {
+    state.pagePatternData = [];
+  },
 } as AutoProbeStoreMutations;
 
+const endpoint = '/ai/autoprobes';
+
 const actions = {
-  ...getDefaultStoreActions<AutoProbe>('/ai/autoprobes'),
+  ...getDefaultStoreActions<AutoProbe>(endpoint),
   runTask: async (
     _: StoreActionContext<AutoProbeStoreState>,
     { id }: { id: string }
   ) => {
-    await post(`/ai/autoprobes/${id}/tasks`);
+    await post(`${endpoint}/${id}/tasks`);
   },
   cancelTask: async (
     _: StoreActionContext<AutoProbeStoreState>,
     { id }: { id: string }
   ) => {
-    await post(`/ai/autoprobes/tasks/${id}/cancel`);
+    await post(`${endpoint}/tasks/${id}/cancel`);
+  },
+  getPagePattern: async (
+    { commit }: StoreActionContext<AutoProbeStoreState>,
+    { id }: { id: string }
+  ) => {
+    const res = await post(`${endpoint}/${id}/pattern`);
+    commit('setPagePattern', res.data);
+  },
+  getPagePatternData: async (
+    { commit }: StoreActionContext<AutoProbeStoreState>,
+    { id }: { id: string }
+  ) => {
+    const res = await post(`${endpoint}/${id}/pattern/data`);
+    commit('setPagePatternData', res.data);
   },
 } as AutoProbeStoreActions;