feat(Consumer): use username instead of id (#742)

* feat(Consumer): use username instead of id * feat: remove duplicated var
apache · Nov 9, 2020 · 8c40e0f · 8c40e0f
1 parent 6efd492
commit 8c40e0f
Show file tree

Hide file tree

Showing 5 changed files with 15 additions and 31 deletions.
diff --git a/web/config/routes.ts b/web/config/routes.ts
@@ -68,7 +68,7 @@ const routes = [
     component: './Consumer/Create',
   },
   {
-    path: '/consumer/:id/edit',
+    path: '/consumer/:username/edit',
     component: './Consumer/Create',
   },
   {

diff --git a/web/src/pages/Consumer/Create.tsx b/web/src/pages/Consumer/Create.tsx
@@ -33,10 +33,10 @@ const Page: React.FC = (props) => {
   const { formatMessage } = useIntl();
 
   useEffect(() => {
-    const { id } = (props as any).match.params;
-    if (id) {
-      fetchItem(id).then(({ data }) => {
-        const { username, desc, ...rest } = data;
+    const { username } = (props as any).match.params;
+    if (username) {
+      fetchItem(username).then(({ data }) => {
+        const { desc, ...rest } = data;
         form1.setFieldsValue({ username, desc });
         setPlugins(rest.plugins);
       });
@@ -45,12 +45,12 @@ const Page: React.FC = (props) => {
 
   const onSubmit = () => {
     const data = { ...form1.getFieldsValue(), plugins } as ConsumerModule.Entity;
-    const { id } = (props as any).match.params;
-    (id ? update(id, data) : create(data))
+    const { username } = (props as any).match.params;
+    (username ? update(username, data) : create(data))
       .then(() => {
         notification.success({
           message: `${
-            id
+            username
               ? formatMessage({ id: 'component.global.edit' })
               : formatMessage({ id: 'component.global.create' })
           } ${formatMessage({ id: 'menu.consumer' })} ${formatMessage({

diff --git a/web/src/pages/Consumer/List.tsx b/web/src/pages/Consumer/List.tsx
@@ -53,7 +53,7 @@ const Page: React.FC = () => {
           <Button
             type="primary"
             style={{ marginRight: 10 }}
-            onClick={() => history.push(`/consumer/${record.id}/edit`)}
+            onClick={() => history.push(`/consumer/${record.username}/edit`)}
           >
             {formatMessage({ id: 'component.global.edit' })}
           </Button>
@@ -62,7 +62,7 @@ const Page: React.FC = () => {
             okText={formatMessage({ id: 'component.global.confirm' })}
             cancelText={formatMessage({ id: 'component.global.cancel' })}
             onConfirm={() => {
-              remove(record.id).then(() => {
+              remove(record.username).then(() => {
                 notification.success({
                   message: `${formatMessage({ id: 'component.global.delete' })} ${formatMessage({
                     id: 'menu.consumer',

diff --git a/web/src/pages/Consumer/index.ts b/web/src/pages/Consumer/index.ts
diff --git a/web/src/pages/Consumer/service.ts b/web/src/pages/Consumer/service.ts
@@ -28,19 +28,19 @@ export const fetchList = ({ current = 1, pageSize = 10, ...res }) =>
     total: data.total_size,
   }));
 
-export const fetchItem = (id: string) =>
-  request<{ data: ConsumerModule.ResEntity }>(`/consumers/${id}`);
+export const fetchItem = (username: string) =>
+  request<{ data: ConsumerModule.ResEntity }>(`/consumers/${username}`);
 
 export const create = (data: ConsumerModule.Entity) =>
   request('/consumers', {
     method: 'POST',
     data,
   });
 
-export const update = (id: string, data: ConsumerModule.Entity) =>
-  request(`/consumers/${id}`, {
+export const update = (username: string, data: ConsumerModule.Entity) =>
+  request(`/consumers/${username}`, {
     method: 'PUT',
     data,
   });
 
-export const remove = (id: string) => request(`/consumers/${id}`, { method: 'DELETE' });
+export const remove = (username: string) => request(`/consumers/${username}`, { method: 'DELETE' });