fix: loading of profile management

Author: yini-chen

media/package.json

@@ -13,6 +13,7 @@
   },
   "dependencies": {
     "@alicloud/console-components": "^1.6.2",
+    "@ant-design/icons": "^5.3.7",
     "@monaco-editor/react": "^4.6.0",
     "@vercel/ncc": "^0.38.1",
     "@vscode-elements/elements": "^1.3.0",

media/src/components/ProfileManager/ProfileManagerIndex.tsx

@@ -5,6 +5,8 @@
 import { Button, Form, Input, Message } from "@alicloud/console-components";
 import React from "react";
 import { PontUIService } from "../../service/UIService";
+import { message } from "antd";
+import { LoadingOutlined } from "@ant-design/icons";
 
 export class ProfileManagerIndexProps {}
 
@@ -30,9 +32,10 @@ export const ProfileManagerIndex: React.FC<ProfileManagerIndexProps> = (props) =
         </div>
         {status === "success" ? (
           <div className="my-4 text-base">
-            <Message type="success" style={{ borderRadius: 4 }}>
-              新增成功！
-            </Message>
+            <div className="flex w-[100%] rounded-sm bg-[#d8f5d8] px-4 py-2 text-sm">
+              <div className="codicon codicon-pass-filled success m-[2px] mr-1  leading-5 text-green-600"></div>
+              <div className="text-[12px] leading-5 text-gray-600">新增成功！</div>
+            </div>
             <div className="my-8 flex justify-end">
               <Button
                 type="primary"
@@ -55,14 +58,10 @@ export const ProfileManagerIndex: React.FC<ProfileManagerIndexProps> = (props) =
         ) : (
           <div>
             {status === "loading" ? (
-              <Message type="loading" className="my-4 text-base" style={{ border: "none" }}>
-                写入中...
-              </Message>
-            ) : null}
-            {status === "faild" ? (
-              <Message type="error" className="my-4 text-base" style={{ borderRadius: 4 }}>
-                添加失败，请重试
-              </Message>
+              <div className="my-4 flex w-[100%] rounded-sm bg-[#f6f6f6] px-4 py-2 text-sm">
+                <LoadingOutlined />
+                <div className="ml-2 text-[12px] leading-5 text-gray-600">写入中...</div>
+              </div>
             ) : null}
             <Form labelAlign="left">
               <Form.Item label={<span className="text-sm font-medium">Profile 名称</span>} required>
@@ -121,7 +120,8 @@ export const ProfileManagerIndex: React.FC<ProfileManagerIndexProps> = (props) =
                         if (res.success === true) {
                           setStatus("success");
                         } else {
-                          setStatus("faild");
+                          message.error("添加失败，请重试");
+                          setStatus("edit");
                         }
                       });
                     }

media/yarn.lock

@@ -92,6 +92,11 @@
   resolved "https://registry.npmmirror.com/@ant-design/icons-svg/-/icons-svg-4.3.1.tgz#4b2f65a17d4d32b526baa6414aca2117382bf8da"
   integrity sha512-4QBZg8ccyC6LPIRii7A0bZUk3+lEDCLnhB+FVsflGdcWPPmV+j3fire4AwwoqHV/BibgvBmR9ZIo4s867smv+g==
 
+"@ant-design/icons-svg@^4.4.0":
+  version "4.4.2"
+  resolved "https://registry.npmmirror.com/@ant-design/icons-svg/-/icons-svg-4.4.2.tgz#ed2be7fb4d82ac7e1d45a54a5b06d6cecf8be6f6"
+  integrity sha512-vHbT+zJEVzllwP+CM+ul7reTEfBR0vgxFe7+lREAsAA7YGsYpboiq2sQNeQeRvh09GfQgs/GyFEvZpJ9cLXpXA==
+
 "@ant-design/icons@^5.2.6":
   version "5.2.6"
   resolved "https://registry.npmmirror.com/@ant-design/icons/-/icons-5.2.6.tgz#2d4a9a37f531eb2a20cebec01d6fb69cf593900d"
@@ -103,6 +108,17 @@
     classnames "^2.2.6"
     rc-util "^5.31.1"
 
+"@ant-design/icons@^5.3.7":
+  version "5.3.7"
+  resolved "https://registry.npmmirror.com/@ant-design/icons/-/icons-5.3.7.tgz#d9f3654bf7934ee5faba43f91b5a187f5309ec68"
+  integrity sha512-bCPXTAg66f5bdccM4TT21SQBDO1Ek2gho9h3nO9DAKXJP4sq+5VBjrQMSxMVXSB3HyEz+cUbHQ5+6ogxCOpaew==
+  dependencies:
+    "@ant-design/colors" "^7.0.0"
+    "@ant-design/icons-svg" "^4.4.0"
+    "@babel/runtime" "^7.11.2"
+    classnames "^2.2.6"
+    rc-util "^5.31.1"
+
 "@ant-design/react-slick@~1.0.2":
   version "1.0.2"
   resolved "https://registry.npmmirror.com/@ant-design/react-slick/-/react-slick-1.0.2.tgz#241bb412aeacf7ff5d50c61fa5db66773fde6b56"
@@ -5644,6 +5660,7 @@ string-convert@^0.2.0:
   integrity sha512-u/1tdPl4yQnPBjnVrmdLo9gtuLvELKsAoRapekWggdiQNvvvum+jYF329d84NAa660KQw7pB2n36KrIKVoXa3A==
 
 "string-width-cjs@npm:string-width@^4.2.0", string-width@^4.1.0:
+  name string-width-cjs
   version "4.2.3"
   resolved "https://registry.npmmirror.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
   integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==