diff --git a/src/components/BreakdownChart.vue b/src/components/BreakdownChart.vue
index b3186b7..95011db 100644
--- a/src/components/BreakdownChart.vue
+++ b/src/components/BreakdownChart.vue
@@ -1,13 +1,13 @@
 <script lang="ts" setup>
 import G6 from "@antv/g6";
-import { onMounted } from "vue";
-import { useDataStore } from "@/store/data.ts";
+import {onMounted} from "vue";
+import {useJobStore} from "@/store/job.ts";
 
 const props = defineProps<{
   graphId: string;
 }>();
 
-const dataStore = useDataStore();
+const dataStore = useJobStore();
 
 const getGraphNum = function () {
   return "mountNode-" + props.graphId;
@@ -34,7 +34,7 @@ onMounted(() => {
     },
   });
 
-  tree.data(dataStore.getTreeData);
+  tree.data(dataStore.breakdownData);
   tree.render();
   tree.fitView(50);
 });
diff --git a/src/components/WorkflowChart.vue b/src/components/WorkflowChart.vue
index dec0df2..8cdf82a 100644
--- a/src/components/WorkflowChart.vue
+++ b/src/components/WorkflowChart.vue
@@ -4,15 +4,15 @@
     @Date: 2024/6/7
 -->
 <script setup lang="ts">
-import { onMounted } from "vue";
+import {onMounted} from "vue";
 import G6 from "@antv/g6";
-import { useDataStore } from "@/store/data.ts";
+import {useJobStore} from "@/store/job.ts";
 
 const props = defineProps<{
   graphId: string;
 }>();
 
-const dataStore = useDataStore();
+const dataStore = useJobStore();
 
 const getGraphNum = function () {
   return "mountNode-" + props.graphId;
@@ -39,7 +39,7 @@ onMounted(() => {
     },
   });
 
-  graph.data(dataStore.getGraphData);
+  graph.data(dataStore.workflowData);
   graph.render();
 
   const group = graph.get("edgeGroup");
diff --git a/src/store/data.ts b/src/store/data.ts
deleted file mode 100644
index 9d0e3b4..0000000
--- a/src/store/data.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-import { defineStore } from "pinia";
-import { jobData2Tree, tree2Graph } from "@/utils/graphUtil.ts";
-import { computed, reactive } from "vue";
-import { mockFetchJob } from "@/api/fetch.ts";
-import { Task } from "@/type.ts";
-// import axios from "@/api";
-
-export const useDataStore = defineStore("data", () => {
-  let localData = reactive({}) as Task;
-
-  const getTreeData = computed(() => jobData2Tree(localData));
-
-  const getGraphData = computed(() => tree2Graph(getTreeData.value));
-
-  async function getData(task: string) {
-    localData = ((await mockFetchJob(task)) as { data: any }).data;
-    // console.log(await mockFetchJob(task));
-    // localData = (await axios.fetchJob(`{"task":"${task}"}`)).data;
-    console.log("localData", localData);
-  }
-
-  return { localData, getTreeData, getGraphData, getData };
-});
diff --git a/src/store/job.ts b/src/store/job.ts
new file mode 100644
index 0000000..24cdcb6
--- /dev/null
+++ b/src/store/job.ts
@@ -0,0 +1,43 @@
+import {defineStore} from "pinia";
+import {job2G6Tree, jobLeafNode2G6Graph} from "@/utils/graphUtil.ts";
+import {computed} from "vue";
+import {mockFetchJob} from "@/api/fetch.ts";
+import {Task} from "@/type.ts";
+// import axios from "@/api";
+
+export const useJobStore = defineStore("job", () => {
+    let _job;
+
+    async function fetchData(task: string) {
+        const res = ((await mockFetchJob(task)) as { data: any }).data;
+        // localData = (await axios.fetchJob(`{"task":"${task}"}`)).data;
+        console.debug("res", res);
+        _job = convertData(res);
+
+        function convertData(data: any) {
+            const children = data.subtasks;
+            const task = new Task(data.task, data.toolId, data.toolName);
+
+            if (children && children.length > 0) {
+                for (let i = 0; i < children.length; i++) {
+                    task.addChild(convertData(children[i]));
+                }
+            }
+            return task;
+        }
+    }
+
+    const breakdownData = computed(() => job2G6Tree(_job));
+
+    const workflowData = computed(() => jobLeafNode2G6Graph(_job));
+
+    const job = computed(() => {
+        if (!_job) {
+            return new Task();
+        } else {
+            return _job;
+        }
+    })
+
+    return {fetchData, job, breakdownData, workflowData};
+});
diff --git a/src/store/session.ts b/src/store/session.ts
index 01369a6..92fed0b 100644
--- a/src/store/session.ts
+++ b/src/store/session.ts
@@ -1,7 +1,7 @@
-import { defineStore } from "pinia";
-import { reactive, ref } from "vue";
-import { generateId } from "@/utils/graphUtil";
-import { useDataStore } from "@/store/data.ts";
+import {defineStore} from "pinia";
+import {reactive, ref} from "vue";
+import {generateId} from "@/utils/graphUtil";
+import {useJobStore} from "@/store/job.ts";
 
 type Session = {
   sessionId: string;
@@ -10,7 +10,7 @@ type Session = {
 };
 
 export const useSessionStore = defineStore("session", () => {
-  const dataStore = useDataStore();
+  const dataStore = useJobStore();
 
   const session = reactive<Session>({
     sessionId: generateId(),
@@ -20,8 +20,8 @@ export const useSessionStore = defineStore("session", () => {
   const graphShow = ref(false);
 
   async function chatted() {
-    if (!dataStore.localData.task) {
-      await dataStore.getData(session.question);
+    if (!dataStore.job.name) {
+      await dataStore.fetchData(session.question);
     }
     // session.question = "";
     graphShow.value = true;
diff --git a/src/type.ts b/src/type.ts
index 238023b..7aa3705 100644
--- a/src/type.ts
+++ b/src/type.ts
@@ -1,20 +1,39 @@
-export type Task = {
-  task: string;
-  toolId: string;
-  toolName: string;
-  subtasks: Task[];
-};
+export class Task {
+  name: string;
+  tool: Tool;
+  children: Task[];
+
+  constructor(task: string, toolId: string, toolName: string) {
+    this.name = task;
+    this.initTool(toolId, toolName);
+    this.children = [] as Task[];
+  }
+
+  initTool(toolId: string, toolName: string) {
+    this.tool = new Tool(toolId, toolName);
+  }
+
+  addChild(task: Task) {
+    this.children.push(task);
+  }
+}
+
+export class Tool {
+  id: string;
+  name: string;
+  description: string;
+  args: {
+    name: string;
+    type: string;
+    description: string;
+  }[];
+
+  constructor(id: string, name: string) {
+    this.id = id;
+    this.name = name;
+  }
+}
 
-// export type Tool = {
-//   id: string;
-//   name: string;
-//   description: string;
-//   args: {
-//     name: string;
-//     type: string;
-//     description: string;
-//   }[];
-// };
 export type Node = {
   id: string;
   name: string;
diff --git a/src/utils/graphUtil.ts b/src/utils/graphUtil.ts
index e5ffc98..f8e2e9f 100644
--- a/src/utils/graphUtil.ts
+++ b/src/utils/graphUtil.ts
@@ -3,69 +3,58 @@
  * @Author: Chris
  * @Date: 2024/6/7
  */
-import G6, { TreeGraphData } from "@antv/g6";
-import { GraphData } from "@antv/g6-core/lib/types";
-import { Task } from "@/type.ts";
+import G6, {TreeGraphData} from "@antv/g6";
+import {GraphData} from "@antv/g6-core/lib/types";
+import {Task} from "@/type.ts";
 
-// export type Tool = {
-//   id: string;
-//   name: string;
-//   description: string;
-//   args: {
-//     name: string;
-//     type: string;
-//     description: string;
-//   }[];
-// };
-// type TreeNode = {
-//   label: string;
-//   toolId: string;
-//   toolName: string;
-//   children: TreeNode[];
-// };
+export function job2G6Tree(job: Task) {
 
-export function jobData2Tree(data: Task) {
-  const { subtasks } = data;
-  const graphData: TreeGraphData = {
-    id: generateId(),
-    label: data.task,
-    toolId: data.toolId,
-    toolName: data.toolName,
-    children: [],
-  };
-  if (subtasks && subtasks.length > 0) {
-    for (let i = 0; i < subtasks.length; i++) {
-      graphData.children!.push(jobData2Tree(subtasks[i]));
+  function buildTreeNode(task: Task) {
+    const {children} = task;
+    const treeNode: TreeGraphData = {
+      id: generateId(),
+      label: task.name,
+      toolId: task.tool.id,
+      toolName: task.tool.name,
+      children: [] as TreeGraphData[],
+    };
+    if (children && children.length > 0) {
+      for (let i = 0; i < children.length; i++) {
+        treeNode.children!.push(buildTreeNode(children[i]));
+      }
     }
+    return treeNode;
   }
-  return graphData;
+
+  return buildTreeNode(job);
 }
 
-export function tree2Graph(treeData: TreeGraphData) {
-  const finalTaskList: GraphData = {
+export function jobLeafNode2G6Graph(job: Task) {
+  const leafNodes: GraphData = {
     nodes: [],
     edges: [],
   };
-  function buildNode(nodes: TreeGraphData) {
-    const { id, label, toolId, toolName, children } = nodes;
+
+  function buildNode(task: Task) {
+    const {children} = task;
     const node = {
-      id,
-      label,
-      toolId,
-      toolName,
+      id: generateId(),
+      label: task.name,
+      toolId: task.tool.id,
+      toolName: task.tool.name,
     };
     if (children && children.length > 0) {
       children.forEach((child) => {
         buildNode(child);
       });
     } else {
-      finalTaskList.nodes!.push(node);
+      leafNodes.nodes!.push(node);
     }
   }
   function buildEdge(nodeData: GraphData) {
     if (nodeData.nodes) {
       for (let i = 1; i < nodeData.nodes.length; i++) {
-        finalTaskList.edges!.push({
+        leafNodes.edges!.push({
           id: generateId(),
           source: nodeData.nodes[i - 1].id,
           target: nodeData.nodes[i].id,
@@ -73,10 +62,11 @@ export function tree2Graph(treeData: TreeGraphData) {
       }
     }
   }
-  buildNode(treeData);
-  buildEdge(finalTaskList);
 
-  return finalTaskList;
+  buildNode(job);
+  buildEdge(leafNodes);
+
+  return leafNodes;
 }
 
 /**