Skip to content

Commit 97577bc

Browse files
committed
fix: loading of profile management
1 parent 3e4f924 commit 97577bc

File tree

1 file changed

+83
-66
lines changed

1 file changed

+83
-66
lines changed

media/src/components/ProfileManager/ProfileManagerIndex.tsx

Lines changed: 83 additions & 66 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,9 @@ export const ProfileManagerIndex: React.FC<ProfileManagerIndexProps> = (props) =
3030
</div>
3131
{status === "success" ? (
3232
<div className="my-4 text-base">
33-
<Message type="success">新增成功!</Message>
33+
<Message type="success" style={{ borderRadius: 4 }}>
34+
新增成功!
35+
</Message>
3436
<div className="my-8 flex justify-end">
3537
<Button
3638
type="primary"
@@ -51,72 +53,87 @@ export const ProfileManagerIndex: React.FC<ProfileManagerIndexProps> = (props) =
5153
</div>
5254
</div>
5355
) : (
54-
<Form labelAlign="left">
55-
<Form.Item label={<span className="text-sm font-medium">Profile 名称</span>} required>
56-
<span className="text-gray-500">用于区别不同的 profiles。</span>
57-
<Input id="profileName" name="profileName" placeholder="请输入字符串" />
58-
</Form.Item>
59-
<Form.Item label={<span className="text-sm font-medium">Access Key</span>} required>
60-
<span className="text-gray-500">
61-
获取方式请参见
62-
<a
63-
href="https://help.aliyun.com/zh/ram/user-guide/create-an-accesskey-pair#title-ebf-nrl-l0i"
64-
target="_blank"
56+
<div>
57+
{status === "loading" ? (
58+
<Message type="loading" className="my-4 text-base" style={{ border: "none" }}>
59+
写入中...
60+
</Message>
61+
) : null}
62+
{status === "faild" ? (
63+
<Message type="error" className="my-4 text-base" style={{ borderRadius: 4 }}>
64+
添加失败,请重试
65+
</Message>
66+
) : null}
67+
<Form labelAlign="left">
68+
<Form.Item label={<span className="text-sm font-medium">Profile 名称</span>} required>
69+
<span className="text-gray-500">用于区别不同的 profiles。</span>
70+
<Input id="profileName" name="profileName" placeholder="请输入字符串" />
71+
</Form.Item>
72+
<Form.Item label={<span className="text-sm font-medium">Access Key</span>} required>
73+
<span className="text-gray-500">
74+
获取方式请参见
75+
<a
76+
href="https://help.aliyun.com/zh/ram/user-guide/create-an-accesskey-pair#title-ebf-nrl-l0i"
77+
target="_blank"
78+
>
79+
创建 RAM 用户的 AccessKey
80+
</a>
81+
82+
</span>
83+
<Input id="accessKey" name="accessKey" placeholder="指定您的AccessKey ID" />
84+
</Form.Item>
85+
<Form.Item label={<span className="text-sm font-medium">Secret Key</span>} required>
86+
<span className="text-gray-500">
87+
获取方式请参见
88+
<a
89+
href="https://help.aliyun.com/zh/ram/user-guide/create-an-accesskey-pair#title-ebf-nrl-l0i"
90+
target="_blank"
91+
>
92+
创建 RAM 用户的 AccessKey
93+
</a>
94+
95+
</span>
96+
<Input id="secretKey" name="secretKey" placeholder="指定您的AccessKey Secret" />
97+
</Form.Item>
98+
<Form.Item label={<span className="text-sm font-medium">默认 Region Id</span>} required>
99+
<span className="text-gray-500">
100+
阿里云支持的 Region Id ,请参见
101+
<a
102+
href="https://help.aliyun.com/zh/ecs/product-overview/regions-and-zones#concept-2459516"
103+
target="_blank"
104+
>
105+
地域和可用区
106+
</a>
107+
108+
</span>
109+
<Input id="defaultRegionId" name="defaultRegionId" placeholder="指定默认区域的Region Id" />
110+
</Form.Item>
111+
<div className="flex">
112+
<Form.Submit
113+
validate
114+
type="primary"
115+
onClick={(submitValue, errors) => {
116+
if (errors) {
117+
return;
118+
} else {
119+
setStatus("loading");
120+
PontUIService.addNewAKProfile(submitValue).then((res) => {
121+
if (res.success === true) {
122+
setStatus("success");
123+
} else {
124+
setStatus("faild");
125+
}
126+
});
127+
}
128+
}}
129+
className="text-right"
65130
>
66-
创建 RAM 用户的 AccessKey
67-
</a>
68-
69-
</span>
70-
<Input id="accessKey" name="accessKey" placeholder="指定您的AccessKey ID" />
71-
</Form.Item>
72-
<Form.Item label={<span className="text-sm font-medium">Secret Key</span>} required>
73-
<span className="text-gray-500">
74-
获取方式请参见
75-
<a
76-
href="https://help.aliyun.com/zh/ram/user-guide/create-an-accesskey-pair#title-ebf-nrl-l0i"
77-
target="_blank"
78-
>
79-
创建 RAM 用户的 AccessKey
80-
</a>
81-
82-
</span>
83-
<Input id="secretKey" name="secretKey" placeholder="指定您的AccessKey Secret" />
84-
</Form.Item>
85-
<Form.Item label={<span className="text-sm font-medium">默认 Region Id</span>} required>
86-
<span className="text-gray-500">
87-
阿里云支持的 Region Id ,请参见
88-
<a
89-
href="https://help.aliyun.com/zh/ecs/product-overview/regions-and-zones#concept-2459516"
90-
target="_blank"
91-
>
92-
地域和可用区
93-
</a>
94-
95-
</span>
96-
<Input id="defaultRegionId" name="defaultRegionId" placeholder="指定默认区域的Region Id" />
97-
</Form.Item>
98-
<div className="flex">
99-
<Form.Submit
100-
validate
101-
type="primary"
102-
onClick={(submitValue, errors) => {
103-
if (errors) {
104-
return;
105-
} else {
106-
PontUIService.addNewAKProfile(submitValue).then((res) => {
107-
if (res.success === true) {
108-
setStatus("success");
109-
}
110-
});
111-
}
112-
}}
113-
className="text-right"
114-
>
115-
新增
116-
</Form.Submit>
117-
<Form.Reset style={{ marginLeft: 10 }}>重置</Form.Reset>
118-
</div>
119-
</Form>
131+
新增
132+
</Form.Submit>
133+
<Form.Reset style={{ marginLeft: 10 }}>重置</Form.Reset>
134+
</div>
135+
</Form>
136+
</div>
120137
)}
121138
</div>
122139
</div>

0 commit comments

Comments
 (0)