feat(AccountsPage): add userEdit

client/src/components/UserEdit.tsx

@@ -1,25 +1,43 @@
+import { UserService } from '@/services/userService';
+import { useUserSelector } from '@/store/userStore';
+import { User } from '@/types/user';
 import { Button, Form, Input, Select } from 'antd';
+import { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 
 const { Option } = Select;
 
-export default function UserEdit() {
+interface UserEditProps {
+  userId?: number;
+}
+
+export default function UserEdit({ userId }: UserEditProps) {
+  const currentUser = useUserSelector();
+  const [form] = Form.useForm();
   const { t } = useTranslation();
+  const [user, setUser] = useState<User | null>(null);
+
+  useEffect(() => {
+    async function getUser() {
+      if (typeof userId === 'undefined') {
+        return;
+      }
+      const user = await UserService.getUserById(userId);
+      setUser(user);
+      form.setFieldsValue({ ...user });
+    }
+
+    getUser();
+  }, []);
+
   return (
     <div style={{ display: 'flex', flexDirection: 'column', height: '100%' }}>
       <Form
+        form={form}
         name="user-edit-form"
         layout="vertical"
         // onFinish={onFinish}
-        initialValues={{
-          name: 'Александр Александров',
-          login: 'alexandralex@vorkout.ru',
-          password: 'jKUUl776GHd',
-          email: 'alexandralex@vorkout.ru',
-          tenant: 'text',
-          role: 'Директор магазина',
-          status: 'Активен',
-        }}
+        initialValues={{ ...user }}
         style={{ flex: 1, display: 'flex', flexDirection: 'column' }}
       >
         <Form.Item
@@ -71,9 +89,11 @@ export default function UserEdit() {
           rules={[{ required: true, message: t('roleMessage') }]}
         >
           <Select placeholder={t('roleMessage')}>
-            <Option value="Директор магазина">Директор магазина</Option>
-            <Option value="Менеджер">Менеджер</Option>
-            <Option value="Кассир">Кассир</Option>
+            {currentUser && currentUser.role === 'OWNER' ? (
+              <Option value="ADMIN">{t('ADMIN')}</Option>
+            ) : undefined}
+            <Option value="EDITOR">{t('EDITOR')}</Option>
+            <Option value="VIEWER">{t('VIEWER')}</Option>
           </Select>
         </Form.Item>
 
@@ -83,10 +103,10 @@ export default function UserEdit() {
           rules={[{ required: true, message: t('statusMessage') }]}
         >
           <Select placeholder={t('statusMessage')}>
-            <Option value="ACTIVE">Активен</Option>
-            <Option value="DISABLED">Неактивен</Option>
-            <Option value="BLOCKED">Заблокирован</Option>
-            <Option value="DELETED">Удален</Option>
+            <Option value="ACTIVE">{t('ACTIVE')}</Option>
+            <Option value="DISABLED">{t('DISABLED')}</Option>
+            <Option value="BLOCKED">{t('BLOCKED')}</Option>
+            <Option value="DELETED">{t('DELETED')}</Option>
           </Select>
         </Form.Item>