diff --git a/src/apis/appCenter/appCenterService.ts b/src/apis/appCenter/appCenterService.ts
new file mode 100644
index 0000000000000000000000000000000000000000..d719d5b0d85e1f9548a2273092d4fe82864c007a
--- /dev/null
+++ b/src/apis/appCenter/appCenterService.ts
@@ -0,0 +1,70 @@
+// Copyright (c) Huawei Technologies Co., Ltd. 2023-2024. All rights reserved.
+import { post, get, del, put } from 'src/apis/server';
+import type { FcResponse } from 'src/apis/server';
+import { QueryAppListParamsType, CreateOrUpdateAppParamsType } from './type';
+/**
+ * 获取应用列表
+ * @param params
+ * @returns
+ */
+export const queryAppList = (params: QueryAppListParamsType): Promise<[any, FcResponse<unknown> | undefined]> => {
+  return get('/api/app', params);
+};
+
+/**
+ * 创建应用/更新应用
+ * @param params
+ * @returns
+ */
+export const createOrUpdateApp = (
+  params: CreateOrUpdateAppParamsType,
+): Promise<[any, FcResponse<unknown> | undefined]> => {
+  return post('/api/app', params);
+};
+
+/**
+ * 获取应用数据
+ * @param params
+ * @returns
+ */
+export const querySingleAppData = (params: { id: string }): Promise<[any, FcResponse<unknown> | undefined]> => {
+  return get(`/api/app/${params.id}`, params);
+};
+
+/**
+ * 删除应用
+ * @param params
+ * @returns
+ */
+export const deleteSingleAppData = (params: { id: string }): Promise<[any, FcResponse<unknown> | undefined]> => {
+  return del(`/api/app/${params.id}`, params);
+};
+
+/**
+ * 发布应用
+ * @param params
+ * @returns
+ */
+export const releaseSingleAppData = (params: { id: string }): Promise<[any, FcResponse<unknown> | undefined]> => {
+  return post(`/api/app/${params.id}`, params);
+};
+
+/**
+ * 更改应用收藏状态
+ * @param params
+ * @returns
+ */
+export const changeSingleAppCollect = (params: { id: string }): Promise<[any, FcResponse<unknown> | undefined]> => {
+  return put(`/api/app/${params.id}`, params);
+};
+
+
+
+export const appCenterApi = {
+  queryAppList,
+  createOrUpdateApp,
+  querySingleAppData,
+  deleteSingleAppData,
+  releaseSingleAppData,
+  changeSingleAppCollect
+};
\ No newline at end of file
diff --git a/src/apis/appCenter/index.ts b/src/apis/appCenter/index.ts
index 7bfa29bdccefbe2cd362b1422df5ea63b25f2092..38c74110bb32ca5e3a568ec104e27a7163c05b8a 100644
--- a/src/apis/appCenter/index.ts
+++ b/src/apis/appCenter/index.ts
@@ -1,59 +1,4 @@
 // Copyright (c) Huawei Technologies Co., Ltd. 2023-2024. All rights reserved.
-import { post, get, del, put } from 'src/apis/server';
-import type { FcResponse } from 'src/apis/server';
-import { QueryAppListParamsType, CreateOrUpdateAppParamsType } from './type';
-/**
- * 获取应用列表
- * @param params
- * @returns
- */
-export const queryAppList = (params: QueryAppListParamsType): Promise<[any, FcResponse<unknown> | undefined]> => {
-  return get('/app', params);
-};
+export * from './appCenterService';
+ 
 
-/**
- * 创建应用/更新应用
- * @param params
- * @returns
- */
-export const createOrUpdateApp = (
-  params: CreateOrUpdateAppParamsType,
-): Promise<[any, FcResponse<unknown> | undefined]> => {
-  return post('/app', params);
-};
-
-/**
- * 获取应用数据
- * @param params
- * @returns
- */
-export const querySingleAppData = (params: { id: string }): Promise<[any, FcResponse<unknown> | undefined]> => {
-  return get(`/app/${params.id}`, params);
-};
-
-/**
- * 删除应用
- * @param params
- * @returns
- */
-export const deleteSingleAppData = (params: { id: string }): Promise<[any, FcResponse<unknown> | undefined]> => {
-  return del(`/app/${params.id}`, params);
-};
-
-/**
- * 发布应用
- * @param params
- * @returns
- */
-export const releaseSingleAppData = (params: { id: string }): Promise<[any, FcResponse<unknown> | undefined]> => {
-  return post(`/app/${params.id}`, params);
-};
-
-/**
- * 更改应用收藏状态
- * @param params
- * @returns
- */
-export const changeSingleAppCollect = (params: { id: string }): Promise<[any, FcResponse<unknown> | undefined]> => {
-  return put(`/app/${params.id}`, params);
-};
diff --git a/src/apis/index.ts b/src/apis/index.ts
index 19d9c0f65349bde01d8923209bac0615ee66d511..1f31eb50f5c577adc5db04d3d887d44a1dd166d6 100644
--- a/src/apis/index.ts
+++ b/src/apis/index.ts
@@ -8,6 +8,8 @@
 // PURPOSE.
 // See the Mulan PSL v2 for more details.
 import { accountApi, sessionApi, externalApi, apiKeyApi, knowledgeApi, appApi, apiApi } from './paths';
+import { workFlowApi } from './workFlow';
+import { appCenterApi } from './appCenter';
 
 export const api = {
   ...accountApi,
@@ -15,6 +17,8 @@ export const api = {
   ...externalApi,
   ...apiKeyApi,
   ...knowledgeApi,
+  ...appCenterApi,
+  ...workFlowApi,
   ...appApi,
-  ...apiApi
+  ...apiApi,
 };
diff --git a/src/apis/workFlow/index.ts b/src/apis/workFlow/index.ts
index 19f1a369bf1cc3664e420305103c55c80d44cff6..fba2fe856dd1d995c5960174fd10a8865ea7a46b 100644
--- a/src/apis/workFlow/index.ts
+++ b/src/apis/workFlow/index.ts
@@ -1,62 +1,2 @@
 // Copyright (c) Huawei Technologies Co., Ltd. 2023-2024. All rights reserved.
-import { post, get, del, put } from 'src/apis/server';
-import type { FcResponse } from 'src/apis/server';
-import { CreateOrUpdateFlowParamsType, CreateOrUpdataFlowBodyType } from './type';
-/**
- * 获取所有服务
- * @param params
- * @returns
- */
-export const queryAllFlowService = (params: {
-  page: number;
-  pageSize: number;
-}): Promise<[any, FcResponse<unknown> | undefined]> => {
-  return get('/flow/service', params);
-};
-
-/**
- * 获取服务下的所有节点的元数据
- * @param params
- * @returns
- */
-export const querySingleFlowServiceNode = (params: {
-  serviceId: string;
-}): Promise<[any, FcResponse<unknown> | undefined]> => {
-  return get('/flow/service/node', params);
-};
-
-/**
- * 获取工作流拓扑结构
- * @param params
- * @returns
- */
-export const querySingleFlowTopology = (params: {
-  appId: number;
-  flowId: number;
-}): Promise<[any, FcResponse<unknown> | undefined]> => {
-  return get('/flow', params);
-};
-
-/**
- * 创建/修改工作流拓扑结构
- * @param params
- * @returns
- */
-export const createOrUpdateFlowTopology = (
-  params: CreateOrUpdateFlowParamsType,
-  data: CreateOrUpdataFlowBodyType,
-): Promise<[any, FcResponse<unknown> | undefined]> => {
-  return put('/flow', data, params);
-};
-
-/**
- * 删除工作流拓扑结构
- * @param params
- * @returns
- */
-export const delFlowTopology = (params: {
-  appId: number;
-  flowId: number;
-}): Promise<[any, FcResponse<unknown> | undefined]> => {
-  return del('/flow', params);
-};
+export * from './workFlowService';
diff --git a/src/apis/workFlow/workFlowService.ts b/src/apis/workFlow/workFlowService.ts
new file mode 100644
index 0000000000000000000000000000000000000000..7935f5492a050f2c3b8ec67a38e8491a09d9b276
--- /dev/null
+++ b/src/apis/workFlow/workFlowService.ts
@@ -0,0 +1,72 @@
+// Copyright (c) Huawei Technologies Co., Ltd. 2023-2024. All rights reserved.
+import { post, get, del, put } from 'src/apis/server';
+import type { FcResponse } from 'src/apis/server';
+import { CreateOrUpdateFlowParamsType, CreateOrUpdataFlowBodyType } from './type';
+/**
+ * 获取所有服务
+ * @param params
+ * @returns
+ */
+export const queryAllFlowService = (params: {
+  page: number;
+  pageSize: number;
+  user_sub:string;
+}): Promise<[any, FcResponse<unknown> | undefined]> => {
+  return get('/api/flow/service', params);
+};
+
+/**
+ * 获取服务下的所有节点的元数据
+ * @param params
+ * @returns
+ */
+export const querySingleFlowServiceNode = (params: {
+  serviceId: string;
+}): Promise<[any, FcResponse<unknown> | undefined]> => {
+  return get('/api/flow/service/node', params);
+};
+
+/**
+ * 获取工作流拓扑结构
+ * @param params
+ * @returns
+ */
+export const querySingleFlowTopology = (params: {
+  appId: number;
+  flowId: number;
+}): Promise<[any, FcResponse<unknown> | undefined]> => {
+  return get('/api/flow', params);
+};
+
+/**
+ * 创建/修改工作流拓扑结构
+ * @param params
+ * @returns
+ */
+export const createOrUpdateFlowTopology = (
+  params: CreateOrUpdateFlowParamsType,
+  data: CreateOrUpdataFlowBodyType,
+): Promise<[any, FcResponse<unknown> | undefined]> => {
+  return put('/api/flow', data, params);
+};
+
+/**
+ * 删除工作流拓扑结构
+ * @param params
+ * @returns
+ */
+export const delFlowTopology = (params: {
+  appId: number;
+  flowId: number;
+}): Promise<[any, FcResponse<unknown> | undefined]> => {
+  return del('/api/flow', params);
+};
+
+
+export const workFlowApi = {
+  queryAllFlowService,
+  querySingleFlowServiceNode,
+  querySingleFlowTopology,
+  delFlowTopology,
+  createOrUpdateFlowTopology
+};
\ No newline at end of file
diff --git a/src/views/createapp/components/workFlow.vue b/src/views/createapp/components/workFlow.vue
index 3a4d89dbb401d1e37bc45169f21e14e283ce5233..b671e7bf14d58452bf7e66828916e77bd9518f80 100644
--- a/src/views/createapp/components/workFlow.vue
+++ b/src/views/createapp/components/workFlow.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import '../../styles/workFlowArrange.scss';
-import { nextTick, ref, watch } from 'vue';
+import { nextTick, onMounted, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { ElTooltip } from 'element-plus';
 import { VueFlow, useVueFlow, Panel } from '@vue-flow/core';
@@ -16,6 +16,7 @@ import WorkFlowDebug from './workFlowDebug.vue';
 import { useLayout } from './workFlowConfig/useLayout';
 import { IconSearch, IconCaretRight, IconCaretDown, IconPlusCircle } from '@computing/opendesign-icons';
 import EditYamlDrawer from './workFlowConfig/yamlEditDrawer.vue';
+import { api } from 'src/apis';
 
 const { t } = useI18n();
 const copilotAside = ref<HTMLElement>();
@@ -238,6 +239,16 @@ const updateNodeTest = state => {
   });
 };
 
+onMounted(()=>{
+  api.queryAllFlowService({
+    page:1,
+    pageSize:10,
+    user_sub:'text'
+  }).then(res=>{
+     
+  })
+})
+
 const handleDebugDialogOps = visible => {
   debugDialogVisible.value = visible;
 };
diff --git a/src/views/createapp/components/workFlowDebug.vue b/src/views/createapp/components/workFlowDebug.vue
index 086b837902c2163237a3fdf59e0fa19126258e65..f77635e526a4bb1f0c181ecd5c702a1c844ebad9 100644
--- a/src/views/createapp/components/workFlowDebug.vue
+++ b/src/views/createapp/components/workFlowDebug.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="workFlowDebug" :class="debugTheme === 'light' ? 'debugThemeLight' : 'debugThemeDark'">
+  <div class="workFlowDebug">
     <div class="workFlowDebugClose">
       <div class="closeBtn" @click="handleCloseDebugDialog"><IconX /></div>
     </div>
@@ -12,25 +12,13 @@
 <script setup lang="ts">
 import '../../styles/workFlowDebug.scss';
 import { watch, ref } from 'vue';
-import { useChangeThemeStore } from 'src/store/conversation';
 import { IconX } from '@computing/opendesign-icons';
 interface DebugProps {
   handleDebugDialogOps:any
 }
-const themeStore = useChangeThemeStore();
 const props = defineProps<DebugProps>();
-const debugTheme = ref();
 const handleCloseDebugDialog = ()=>{
   props.handleDebugDialogOps(false)
 }
-watch(
-  () => themeStore.theme,
-  () => {
-    debugTheme.value = themeStore.theme;
-  },
-  {
-    immediate: true,
-    deep: true,
-  },
-);
+ 
 </script>
diff --git a/src/views/styles/createApp.scss b/src/views/styles/createApp.scss
index 178f1bda7a285d40781bdfd3abafd1e78eade9ab..fa961f598c255e593806be08cd40ee5cf79d4fe9 100644
--- a/src/views/styles/createApp.scss
+++ b/src/views/styles/createApp.scss
@@ -100,18 +100,8 @@
   .createAppContainerMainRight {
     width: 100%;
     height: calc(100% - 32px);
-    background-image: url('../../assets/images/light_background.png');
-    --o-bg-image: url('../../assets/images/light_background.png');
-    --o-shell-image: url('../../assets/images/light_shell.png');
-    --o-sider: url('../../assets/images/light_sider.png');
-    --o-sider-hover: url('../../assets/images/light_sider-hover.png');
-    --o-button-color: #c3cedf;
-    --o-button-border-color: #d3dce9;
-    --o-button-disable-color: #bfc7d7;
-    --o-button-disable-background: #ebedf3;
-    --o-button-disable-border: #ebedf3;
-    --o-time-text: #dfe5ef;
-    --o-bash-bg: #f4f6fa;
+    background-image: var(--o-bg-image);
+    background-position: -520px -200px;
     .copilot-footer {
       margin-bottom: 12px;
     }
diff --git a/src/views/styles/workFlowDebug.scss b/src/views/styles/workFlowDebug.scss
index 70f20e02b433aca5e231bfea8a467ccc06595a39..3171656d0a77e70079ce3f8194606d4aa354ede9 100644
--- a/src/views/styles/workFlowDebug.scss
+++ b/src/views/styles/workFlowDebug.scss
@@ -3,7 +3,7 @@
   height: 100%;
   position: absolute;
   right: 0;
-  background-position: -520px -200px;
+  background-position: -370px -320px;
   border-radius: 8px;
   box-shadow: -16px 4px 16px 0px rgba(0,0,0,0.1);
   border-right: 1px solid white;
@@ -31,36 +31,8 @@
     background: var(--o-border-color-light);
   }
 }
-.debugThemeDark {
-  background-image: url('../../assets/images/dark_background.png');
-  --o-shell-image: url('../../assets/images/dark_shell.png');
-  --o-sider: url('../../assets/images/dark_sider.png');
-  --o-sider-hover: url('../../assets/images/dark_sider-hover.png');
-  --o-button-color: #576372;
-  --o-button-border-color: #576372;
-  --o-button-disable-color: #626d7c;
-  --o-button-disable-background: #203052;
-  --o-button-disable-border: #626d7c;
-  --o-time-text: #3e4551;
-  --o-bash-bg: #2a2f37;
-  --o-flow-code-bg: rgb(42, 47, 55);
-  --o-flow-code-border: rgb(62, 69, 81);
-}
-
-.debugThemeLight {
-    background-image: url('../../assets/images/light_background.png');
-  --o-shell-image: url('../../assets/images/light_shell.png');
-  --o-sider: url('../../assets/images/light_sider.png');
-  --o-sider-hover: url('../../assets/images/light_sider-hover.png');
-  --o-button-color: #c3cedf;
-  --o-button-border-color: #d3dce9;
-  --o-button-disable-color: #bfc7d7;
-  --o-button-disable-background: #ebedf3;
-  --o-button-disable-border: #ebedf3;
-  --o-time-text: #dfe5ef;
-  --o-bash-bg: #f4f6fa;
-  --o-flow-code-bg: rgb(244, 256, 258);
-  --o-flow-code-border: rgb(223, 229, 239);
+.workFlowDebug{
+  background-image: var(--o-bg-image);
 }