Skip to content

Commit e0e0fe0

Browse files
ryoldashryoldash
committed
Code refactoring
1 parent 04867f7 commit e0e0fe0

File tree

7 files changed

+75
-152
lines changed

7 files changed

+75
-152
lines changed

‎reactjs/src/scenes/Tenants/components/createOrUpdateTenant.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@ class CreateOrUpdateTenant extends React.Component<ICreateOrUpdateTenantProps> {
5656
const { visible, onCancel, onCreate } = this.props;
5757

5858
return (
59-
<Modal visible={visible} onCancel={onCancel} onOk={onCreate} title={L('CreateNewTenant')} width={550}>
59+
<Modal visible={visible} onCancel={onCancel} onOk={onCreate} title={L('Tenants')} width={550}>
6060
<Form>
6161
<FormItem label={L('TenancyName')} {...formItemLayout}>
6262
{this.props.form.getFieldDecorator('tenancyName', { rules: rules.tenancyName })(<Input />)}
@@ -77,7 +77,7 @@ class CreateOrUpdateTenant extends React.Component<ICreateOrUpdateTenantProps> {
7777
<FormItem label={L('IsActive')} {...tailFormItemLayout}>
7878
{getFieldDecorator('isActive', { valuePropName: 'checked' })(<Checkbox />)}
7979
</FormItem>
80-
<Col>{'Default password is 123qwe'}</Col>
80+
<Col>{L('Default password is 123qwe')}</Col>
8181
</Form>
8282
</Modal>
8383
);

‎reactjs/src/scenes/Users/components/createOrUpdateUser.tsx

Lines changed: 54 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -4,16 +4,24 @@ import FormItem from 'antd/lib/form/FormItem';
44
import CheckboxGroup from 'antd/lib/checkbox/Group';
55
import { GetRoles } from 'src/services/user/dto/getRolesOuput';
66
import { L } from 'src/lib/abpUtility';
7-
7+
import { FormComponentProps } from 'antd/lib/form';
8+
import rules from './createOrUpdateUser.validation';
89

910
const TabPane = Tabs.TabPane;
10-
class CreateOrUpdateUser extends React.Component<any> {
11-
constructor(props: any) {
12-
super(props);
13-
}
11+
12+
export interface ICreateOrUpdateUserProps extends FormComponentProps {
13+
visible: boolean;
14+
onCancel: () => void;
15+
modalType: string;
16+
onCreate: () => void;
17+
roles: GetRoles[];
18+
}
19+
20+
class CreateOrUpdateUser extends React.Component<ICreateOrUpdateUserProps> {
1421
state = {
1522
confirmDirty: false,
1623
};
24+
1725
compareToFirstPassword = (rule: any, value: any, callback: any) => {
1826
const form = this.props.form;
1927
if (value && value !== form.getFieldValue('password')) {
@@ -30,9 +38,10 @@ class CreateOrUpdateUser extends React.Component<any> {
3038
}
3139
callback();
3240
};
41+
3342
render() {
34-
const { roles}=this.props
35-
43+
const { roles } = this.props;
44+
3645
const formItemLayout = {
3746
labelCol: {
3847
xs: { span: 6 },
@@ -51,48 +60,51 @@ class CreateOrUpdateUser extends React.Component<any> {
5160
xxl: { span: 18 },
5261
},
5362
};
54-
const tailFormItemLayout = {
55-
labelCol: {
56-
xs: { span: 6 },
57-
sm: { span: 6 },
58-
md: { span: 6 },
59-
lg: { span: 6 },
60-
xl: { span: 6 },
61-
xxl: { span: 6 }
62-
},
63+
const tailFormItemLayout = {
64+
labelCol: {
65+
xs: { span: 6 },
66+
sm: { span: 6 },
67+
md: { span: 6 },
68+
lg: { span: 6 },
69+
xl: { span: 6 },
70+
xxl: { span: 6 },
71+
},
6372
wrapperCol: {
6473
xs: { span: 18 },
6574
sm: { span: 18 },
6675
md: { span: 18 },
6776
lg: { span: 18 },
6877
xl: { span: 18 },
6978
xxl: { span: 18 },
70-
} };
79+
},
80+
};
81+
7182
const { getFieldDecorator } = this.props.form;
7283
const { visible, onCancel, onCreate } = this.props;
73-
7484

75-
const options = roles.map((x:GetRoles)=>{
76-
77-
var test= { label: x.displayName, value:x.normalizedName}
78-
return test;
79-
})
80-
return <Modal visible={visible} cancelText={L('Cancel')} okText={L('OK')} onCancel={onCancel} onOk={onCreate} title={'User'}>
85+
const options = roles.map((x: GetRoles) => {
86+
var test = { label: x.displayName, value: x.normalizedName };
87+
return test;
88+
});
89+
90+
return (
91+
<Modal visible={visible} cancelText={L('Cancel')} okText={L('OK')} onCancel={onCancel} onOk={onCreate} title={'User'}>
8192
<Tabs defaultActiveKey={'userInfo'} size={'small'} tabBarGutter={64}>
8293
<TabPane tab={'User'} key={'user'}>
8394
<FormItem label={L('Name')} {...formItemLayout}>
84-
{getFieldDecorator('name', { rules: [{ required: true, message: 'Please input your name!' }] })(<Input />)}
95+
{getFieldDecorator('name', { rules: rules.name })(<Input />)}
8596
</FormItem>
8697
<FormItem label={L('Surname')} {...formItemLayout}>
87-
{getFieldDecorator('surname', { rules: [{ required: true, message: 'Please input your surname!' }] })(<Input />)}
98+
{getFieldDecorator('surname', { rules: rules.surname })(<Input />)}
8899
</FormItem>
89-
<FormItem label={L('UserName')} {...formItemLayout}>
90-
{getFieldDecorator('userName', { rules: [{ required: true, message: 'Please input your username!' }] })(<Input />)}
100+
<FormItem label={L('UserName')} {...formItemLayout}>
101+
{getFieldDecorator('userName', { rules: rules.userName })(<Input />)}
91102
</FormItem>
92-
<FormItem label={L('Email')} {...formItemLayout}>
93-
{getFieldDecorator('emailAddress', { rules: [{ required: true, message: 'Please input your email!' }] })(<Input />)}
103+
<FormItem label={L('Email')} {...formItemLayout}>
104+
{getFieldDecorator('emailAddress', { rules: rules.emailAddress })(<Input />)}
94105
</FormItem>
95-
{this.props.modalType == 'edit' ? <FormItem label={L("Password")} {...formItemLayout}>
106+
{this.props.modalType == 'edit' ? (
107+
<FormItem label={L('Password')} {...formItemLayout}>
96108
{getFieldDecorator('password', {
97109
rules: [
98110
{
@@ -104,33 +116,36 @@ class CreateOrUpdateUser extends React.Component<any> {
104116
},
105117
],
106118
})(<Input type="password" />)}
107-
</FormItem> : null}
108-
{this.props.modalType == 'edit' ? <FormItem label={L("ConfirmPassword")} {...formItemLayout}>
119+
</FormItem>
120+
) : null}
121+
{this.props.modalType == 'edit' ? (
122+
<FormItem label={L('ConfirmPassword')} {...formItemLayout}>
109123
{getFieldDecorator('confirm', {
110124
rules: [
111125
{
112126
required: true,
113-
message: 'Please confirm your password!',
127+
message: L('ConfirmPassword'),
114128
},
115129
{
116130
validator: this.compareToFirstPassword,
117131
},
118132
],
119133
})(<Input type="password" />)}
120-
</FormItem> : null}
134+
</FormItem>
135+
) : null}
121136
<FormItem label={L('IsActive')} {...tailFormItemLayout}>
122137
{getFieldDecorator('isActive', { valuePropName: 'checked' })(<Checkbox>Aktif</Checkbox>)}
123138
</FormItem>
124139
</TabPane>
125-
<TabPane tab={L('Roles')} key={'rol'}>
140+
<TabPane tab={L('Roles')} key={'rol'}>
126141
<FormItem {...tailFormItemLayout}>
127142
{getFieldDecorator('roleNames', { valuePropName: 'value' })(<CheckboxGroup options={options} />)}
128143
</FormItem>
129144
</TabPane>
130145
</Tabs>
131-
</Modal>;
146+
</Modal>
147+
);
132148
}
133149
}
134150

135-
const nwUserInfoCreateOrEdit = Form.create()(CreateOrUpdateUser);
136-
export default nwUserInfoCreateOrEdit;
151+
export default Form.create()(CreateOrUpdateUser);

‎reactjs/src/scenes/Users/components/createOrUpdateUser.validation.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
const rules = {
2+
name: [{ required: true, message: 'Please input your name!' }],
3+
surname: [{ required: true, message: 'Please input your surname!' }],
4+
userName: [{ required: true, message: 'Please input your username!' }],
5+
emailAddress: [{ required: true, message: 'Please input your email!' }],
6+
};
7+
8+
export default rules;

‎reactjs/src/scenes/Users/components/createOrUpdateUserContainer.tsx

Lines changed: 0 additions & 45 deletions
This file was deleted.

‎reactjs/src/scenes/Users/components/createOrUpdateUserRole.tsx

Lines changed: 0 additions & 44 deletions
This file was deleted.

‎reactjs/src/scenes/Users/index.tsx

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ const confirm = Modal.confirm;
1616

1717
@inject(Stores.UserStore)
1818
@observer
19-
class User extends React.Component<any> {
19+
class User extends React.Component<IUserProps> {
2020
formRef: any;
2121

2222
constructor(props: any) {
@@ -48,11 +48,6 @@ class User extends React.Component<any> {
4848
});
4949
};
5050

51-
setPermissions() {
52-
this.props.userStore.updateUserPermissions();
53-
this.Modal();
54-
}
55-
5651
async createOrUpdateModalOpen(entityDto: EntityDto) {
5752
if (entityDto.id == 0) {
5853
await this.props.userStore.createUser();
@@ -61,6 +56,7 @@ class User extends React.Component<any> {
6156
await this.props.userStore.get(entityDto);
6257
await this.props.userStore.getRoles();
6358
}
59+
6460
this.setState({ userId: entityDto.id });
6561
this.Modal();
6662

@@ -93,6 +89,7 @@ class User extends React.Component<any> {
9389
await this.props.userStore.update({ id: this.state.userId, ...values });
9490
}
9591
}
92+
9693
await this.getAll();
9794
this.setState({ modalVisible: false });
9895
form.resetFields();
@@ -143,6 +140,7 @@ class User extends React.Component<any> {
143140
),
144141
},
145142
];
143+
146144
return (
147145
<Card>
148146
<Row>
@@ -178,7 +176,7 @@ class User extends React.Component<any> {
178176
xxl={{ span: 24, offset: 0 }}
179177
>
180178
<Table
181-
rowKey="id"
179+
rowKey={record => record.id}
182180
size={'default'}
183181
bordered={true}
184182
columns={columns}

‎reactjs/src/stores/userStore.ts

Lines changed: 6 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -15,17 +15,13 @@ class UserStore {
1515

1616
@action
1717
async create(createUserInput: CreateOrUpdateUserInput) {
18-
19-
var result = await userService.create(createUserInput);
20-
console.log(result);
18+
let result = await userService.create(createUserInput);
2119
this.users.items.push(result);
2220
}
2321

2422
@action
2523
async update(updateUserInput: UpdateUserInput) {
26-
27-
var result = await userService.update(updateUserInput);
28-
console.log(result);
24+
let result = await userService.update(updateUserInput);
2925
this.users.items = this.users.items.map((x: GetUserOutput) => {
3026
if (x.id == updateUserInput.id) x = result;
3127
return x;
@@ -34,23 +30,19 @@ class UserStore {
3430

3531
@action
3632
async delete(entityDto: EntityDto) {
37-
var result = await userService.delete(entityDto);
38-
console.log(result);
39-
33+
await userService.delete(entityDto);
4034
this.users.items = this.users.items.filter((x: GetUserOutput) => x.id != entityDto.id);
4135
}
4236

4337
@action
4438
async getRoles() {
45-
var result = await userService.getRoles();
46-
console.log(result);
39+
let result = await userService.getRoles();
4740
this.roles = result;
4841
}
4942

5043
@action
5144
async get(entityDto: EntityDto) {
52-
var result = await userService.get(entityDto);
53-
console.log(result);
45+
let result = await userService.get(entityDto);
5446
this.editUser = result;
5547
}
5648

@@ -71,8 +63,7 @@ class UserStore {
7163

7264
@action
7365
async getAll(pagedFilterAndSortedRequest: PagedFilterAndSortedRequest) {
74-
var result = await userService.getAll(pagedFilterAndSortedRequest);
75-
console.log(result);
66+
let result = await userService.getAll(pagedFilterAndSortedRequest);
7667
this.users = result;
7768
}
7869

0 commit comments

Comments
 (0)