Able to manage token now

2025-10-18 17:51:28 +00:00 · 2023-04-23 12:43:10 +08:00
parent b908229429
commit 63da6dc6a0
11 changed files with 573 additions and 121 deletions
--- a/web/src/pages/Channel/EditChannel.js
+++ b/web/src/pages/Channel/EditChannel.js
@@ -0,0 +1,132 @@
+import React, { useEffect, useState } from 'react';
+import { Button, Form, Header, Segment } from 'semantic-ui-react';
+import { useParams } from 'react-router-dom';
+import { API, showError, showSuccess } from '../../helpers';
+
+const EditChannel = () => {
+  const params = useParams();
+  const userId = params.id;
+  const [loading, setLoading] = useState(true);
+  const [inputs, setInputs] = useState({
+    username: '',
+    display_name: '',
+    password: '',
+    github_id: '',
+    wechat_id: '',
+    email: '',
+  });
+  const { username, display_name, password, github_id, wechat_id, email } =
+    inputs;
+  const handleInputChange = (e, { name, value }) => {
+    setInputs((inputs) => ({ ...inputs, [name]: value }));
+  };
+
+  const loadUser = async () => {
+    let res = undefined;
+    if (userId) {
+      res = await API.get(`/api/user/${userId}`);
+    } else {
+      res = await API.get(`/api/user/self`);
+    }
+    const { success, message, data } = res.data;
+    if (success) {
+      data.password = '';
+      setInputs(data);
+    } else {
+      showError(message);
+    }
+    setLoading(false);
+  };
+  useEffect(() => {
+    loadUser().then();
+  }, []);
+
+  const submit = async () => {
+    let res = undefined;
+    if (userId) {
+      res = await API.put(`/api/user/`, { ...inputs, id: parseInt(userId) });
+    } else {
+      res = await API.put(`/api/user/self`, inputs);
+    }
+    const { success, message } = res.data;
+    if (success) {
+      showSuccess('用户信息更新成功！');
+    } else {
+      showError(message);
+    }
+  };
+
+  return (
+    <>
+      <Segment loading={loading}>
+        <Header as='h3'>更新用户信息</Header>
+        <Form autoComplete='off'>
+          <Form.Field>
+            <Form.Input
+              label='用户名'
+              name='username'
+              placeholder={'请输入新的用户名'}
+              onChange={handleInputChange}
+              value={username}
+              autoComplete='off'
+            />
+          </Form.Field>
+          <Form.Field>
+            <Form.Input
+              label='密码'
+              name='password'
+              type={'password'}
+              placeholder={'请输入新的密码'}
+              onChange={handleInputChange}
+              value={password}
+              autoComplete='off'
+            />
+          </Form.Field>
+          <Form.Field>
+            <Form.Input
+              label='显示名称'
+              name='display_name'
+              placeholder={'请输入新的显示名称'}
+              onChange={handleInputChange}
+              value={display_name}
+              autoComplete='off'
+            />
+          </Form.Field>
+          <Form.Field>
+            <Form.Input
+              label='已绑定的 GitHub 账户'
+              name='github_id'
+              value={github_id}
+              autoComplete='off'
+              placeholder='此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改'
+              readOnly
+            />
+          </Form.Field>
+          <Form.Field>
+            <Form.Input
+              label='已绑定的微信账户'
+              name='wechat_id'
+              value={wechat_id}
+              autoComplete='off'
+              placeholder='此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改'
+              readOnly
+            />
+          </Form.Field>
+          <Form.Field>
+            <Form.Input
+              label='已绑定的邮箱账户'
+              name='email'
+              value={email}
+              autoComplete='off'
+              placeholder='此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改'
+              readOnly
+            />
+          </Form.Field>
+          <Button onClick={submit}>提交</Button>
+        </Form>
+      </Segment>
+    </>
+  );
+};
+
+export default EditChannel;