feat:rename subtree from frontend-vue to frontend

frontend/src/stores/index.ts

@@ -0,0 +1,12 @@
+import { createPinia } from 'pinia'
+import type { App } from 'vue'
+
+export const store = createPinia()
+
+// 全局注册 store
+export function setupStore(app: App<Element>) {
+  app.use(store)
+}
+
+export * from './modules/agents.ts'
+export * from './modules/config.ts'

frontend/src/stores/modules/agents.ts

@@ -0,0 +1,152 @@
+import { ref } from 'vue'
+import { defineStore } from 'pinia'
+import { v4 as uuidv4 } from 'uuid'
+
+import { store } from '../index'
+import { useStorage } from '@vueuse/core'
+import type { IExecuteRawResponse } from '@/api'
+import { useConfigStore } from '@/stores/modules/config.ts'
+
+export interface Agent {
+  Name: string
+  Profile: string
+  Icon: string
+  Classification: string
+}
+
+type HslColorVector = [number, number, number]
+
+export interface IRichText {
+  template: string
+  data: Record<
+    string,
+    {
+      text: string
+      style?: Record<string, string>
+      color?: HslColorVector
+    }
+  >
+}
+
+export interface TaskProcess {
+  ActionType: string
+  AgentName: string
+  Description: string
+  ID: string
+  ImportantInput: string[]
+}
+
+export interface IRawStepTask {
+  Id?: string
+  StepName?: string
+  TaskContent?: string
+  InputObject_List?: string[]
+  OutputObject?: string
+  AgentSelection?: string[]
+  Collaboration_Brief_FrontEnd: IRichText
+  TaskProcess: TaskProcess[]
+}
+
+export interface IRawPlanResponse {
+  'Initial Input Object'?: string[] | string
+  'General Goal'?: string
+  'Collaboration Process'?: IRawStepTask[]
+}
+
+const storageKey = '$agents' as const
+
+// 清除所有以 storageKey 开头的 localStorage
+function clearStorageByVersion() {
+  Object.keys(localStorage)
+    .filter((key) => key.startsWith(storageKey))
+    .forEach((key) => localStorage.removeItem(key))
+}
+
+export const useAgentsStore = defineStore('agents', () => {
+  const configStore = useConfigStore()
+
+  const agents = useStorage<Agent[]>(`${storageKey}-repository`, [])
+  function setAgents(agent: Agent[]) {
+    agents.value = agent
+  }
+
+  // 任务搜索的内容
+  const searchValue = useStorage<string>(`${storageKey}-search-value`, '')
+  function setSearchValue(value: string) {
+    searchValue.value = value
+  }
+
+  const storageVersionIdentifier = useStorage<string>(`${storageKey}-storage-version-identifier`, '')
+  // 监听 configStore.config.agentRepository.storageVersionIdentifier 改变
+  watch(
+    () => configStore.config.agentRepository.storageVersionIdentifier,
+    (value) => {
+      // value与storageVersionIdentifier不一致清除所有storageKey开头的localStorage
+      if (value !== storageVersionIdentifier.value) {
+        clearStorageByVersion()
+        storageVersionIdentifier.value = value
+      }
+    },
+    {
+      immediate: true,
+    }
+  )
+
+  // 当前的展示的任务流程
+  const currentTask = ref<IRawStepTask>()
+  function setCurrentTask(task: IRawStepTask) {
+    currentTask.value = task
+  }
+
+  const agentRawPlan = ref<{ data?: IRawPlanResponse; loading?: boolean }>({ loading: false })
+
+  function setAgentRawPlan(plan: { data?: IRawPlanResponse; loading?: boolean }) {
+    if (plan.data) {
+      plan.data['Collaboration Process'] = plan.data['Collaboration Process']?.map((item) => ({
+        ...item,
+        Id: uuidv4(),
+      }))
+    }
+    agentRawPlan.value = {
+      ...agentRawPlan.value,
+      ...plan,
+    }
+  }
+
+  // 执行完任务的结果
+  const executePlan = ref<IExecuteRawResponse[]>([])
+  function setExecutePlan(plan: IExecuteRawResponse[]) {
+    executePlan.value = plan
+  }
+
+  function resetAgent() {
+    agentRawPlan.value = {
+      loading: false,
+    }
+    currentTask.value = undefined
+    executePlan.value = []
+  }
+
+  return {
+    agents,
+    setAgents,
+    searchValue,
+    setSearchValue,
+    currentTask,
+    setCurrentTask,
+    agentRawPlan,
+    setAgentRawPlan,
+    executePlan,
+    setExecutePlan,
+    resetAgent,
+  }
+})
+
+/**
+ * 用于在组件外部（如在Pinia Store 中）使用 Pinia 提供的 store 实例。
+ * 官方文档解释了如何在组件外部使用 Pinia Store：
+ * https://pinia.vuejs.org/core-concepts/outside-component-usage.html#using-a-store-outside-of-a-component
+ */
+export function useAgentsStoreHook() {
+  return useAgentsStore(store)
+}

frontend/src/stores/modules/config.ts

@@ -0,0 +1,39 @@
+import { defineStore } from 'pinia'
+import { readConfig } from '@/utils/readJson.ts'
+import { store } from '@/stores'
+
+export interface Config {
+  title: string
+  subTitle: string
+  centerTitle: string
+  taskPromptWords: string[]
+  agentRepository: {
+    storageVersionIdentifier: string
+  }
+}
+
+
+export const useConfigStore = defineStore('config', () => {
+  const  config = ref<Config>({} as Config)
+
+  // 异步调用readConfig
+  async function initConfig() {
+    config.value = await readConfig<Config>('config.json')
+  }
+
+
+  return {
+    config,
+    initConfig
+  }
+})
+
+
+/**
+ * 用于在组件外部（如在Pinia Store 中）使用 Pinia 提供的 store 实例。
+ * 官方文档解释了如何在组件外部使用 Pinia Store：
+ * https://pinia.vuejs.org/core-concepts/outside-component-usage.html#using-a-store-outside-of-a-component
+ */
+export function useConfigStoreHook() {
+  return useConfigStore(store)
+}