diff --git a/frontend/packages/core/src/pages/aiApis/index.tsx b/frontend/packages/core/src/pages/aiApis/index.tsx
index 76eae7a0..90d208c4 100644
--- a/frontend/packages/core/src/pages/aiApis/index.tsx
+++ b/frontend/packages/core/src/pages/aiApis/index.tsx
@@ -215,7 +215,7 @@ const ApiSettings: React.FC = () => {
         <Alert
           message={message}
           type={type}
-          className="my-4"
+          className="mt-[30px]"
           showIcon
           action={
             <Button
@@ -236,7 +236,7 @@ const ApiSettings: React.FC = () => {
 
   return (
     <InsidePage
-      className="overflow-y-auto gap-4 pb-PAGE_INSIDE_B"
+      className="overflow-y-auto pb-PAGE_INSIDE_B"
       pageTitle={$t('AI API 列表')}
       description={
         <>
diff --git a/frontend/packages/core/src/pages/aiSetting/styles.css b/frontend/packages/core/src/pages/aiSetting/styles.css
index 13d5b62b..0311fdf3 100644
--- a/frontend/packages/core/src/pages/aiSetting/styles.css
+++ b/frontend/packages/core/src/pages/aiSetting/styles.css
@@ -8,6 +8,7 @@
 .react-flow__container {
   width: 100%;
   height: 100%;
+  transform: translate(0px, 0px) !important;
 }
 
 .react-flow__renderer {
diff --git a/frontend/packages/core/src/pages/keySettings/index.tsx b/frontend/packages/core/src/pages/keySettings/index.tsx
index 6ea97505..61eb784a 100644
--- a/frontend/packages/core/src/pages/keySettings/index.tsx
+++ b/frontend/packages/core/src/pages/keySettings/index.tsx
@@ -27,6 +27,7 @@ const KeySettings: React.FC = () => {
   const [total, setTotal] = useState<number>(0)
   const modalRef = useRef<any>()
   const { accessData } = useGlobalContext()
+  const [apiKeys, setApiKeys] = useState<APIKey[]>([])
 
   useEffect(() => {
     pageListRef.current?.reload()
@@ -154,16 +155,30 @@ const KeySettings: React.FC = () => {
   }
 
   const handleDragSortEnd = async (beforeIndex: number, afterIndex: number, newDataSource: APIKey[]) => {
-    console.log(beforeIndex, afterIndex, newDataSource)
     try {
+      let targetId
+      let sortDirection
+
+      // Check if there's an item before afterIndex
+      if (afterIndex > 0) {
+        targetId = newDataSource[afterIndex - 1].id
+        sortDirection = 'after'
+      } else if (afterIndex < newDataSource.length - 1) {
+        // If no item before, use the item after
+        targetId = newDataSource[afterIndex + 1].id
+        sortDirection = 'before'
+      }
+
       const response = await fetchData<BasicResponse<any>>('ai/resource/key/sort', {
         method: 'PUT',
         eoParams: {
-          origin: newDataSource[beforeIndex].id,
-          target: newDataSource[afterIndex].id,
-          sort: afterIndex > beforeIndex ? 'before' : 'after'
+          provider: selectedProvider
+        },
+        eoBody: {
+          origin: apiKeys[beforeIndex].id,
+          target: targetId,
+          sort: sortDirection
         }
-        // eoApiPrefix: 'http://uat.apikit.com:11204/mockApi/aoplatform/api/v1/'
       })
 
       if (response.code === STATUS_CODE.SUCCESS) {
@@ -171,9 +186,13 @@ const KeySettings: React.FC = () => {
         pageListRef.current?.reload()
       } else {
         message.error(response.msg || RESPONSE_TIPS.error)
+        // Revert the UI if API call fails
+        pageListRef.current?.reload()
       }
     } catch (error) {
       message.error(RESPONSE_TIPS.error)
+      // Revert the UI if API call fails
+      pageListRef.current?.reload()
     }
   }
 
@@ -195,6 +214,7 @@ const KeySettings: React.FC = () => {
 
       if (response.code === STATUS_CODE.SUCCESS) {
         setTotal(response.data.total)
+        setApiKeys(response.data.keys)
         return {
           data: response.data.keys,
           success: true,