Web: People: refactoring LeaveFormDialog
This commit is contained in:
parent
c44543e177
commit
09a91ba47f
@ -6,6 +6,11 @@ import { withTranslation } from "react-i18next";
|
||||
import { utils } from "asc-web-common";
|
||||
import ModalDialogContainer from "../ModalDialogContainer";
|
||||
import { createI18N } from "../../../helpers/i18n";
|
||||
import {
|
||||
setIsVisibleModalLeave,
|
||||
setIsEditingForm,
|
||||
} from "../../../store/people/actions";
|
||||
|
||||
const i18n = createI18N({
|
||||
page: "LeaveFormDialog",
|
||||
localesPath: "dialogs/LeaveFormDialog",
|
||||
@ -16,28 +21,28 @@ const { changeLanguage } = utils;
|
||||
class LeaveFormDialogComponent extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.state = {
|
||||
visible: props.visible,
|
||||
};
|
||||
changeLanguage(i18n);
|
||||
}
|
||||
|
||||
onClose = () => {
|
||||
this.setState({ visible: false });
|
||||
const { setIsVisibleModalLeave } = this.props;
|
||||
setIsVisibleModalLeave(false);
|
||||
};
|
||||
|
||||
onSubbmit = () => {
|
||||
const { onContinue } = this.props;
|
||||
onSubmit = () => {
|
||||
const { onContinue, setIsVisibleModalLeave, setIsEditingForm } = this.props;
|
||||
|
||||
setIsVisibleModalLeave(false);
|
||||
setIsEditingForm(false);
|
||||
|
||||
onContinue && onContinue();
|
||||
};
|
||||
render() {
|
||||
const { t } = this.props;
|
||||
const { visible } = this.state;
|
||||
const { t, isVisibleModalLeave } = this.props;
|
||||
|
||||
return (
|
||||
<ModalDialogContainer>
|
||||
<ModalDialog visible={visible} onClose={this.onClose}>
|
||||
<ModalDialog visible={isVisibleModalLeave} onClose={this.onClose}>
|
||||
<ModalDialog.Header>{t("LeaveDialogHeader")}</ModalDialog.Header>
|
||||
<ModalDialog.Body>
|
||||
<Text fontSize="13px">{t("LeaveDialogBody")}</Text>
|
||||
@ -48,7 +53,7 @@ class LeaveFormDialogComponent extends React.Component {
|
||||
label={t("LeaveDialogLeaveBtn")}
|
||||
size="medium"
|
||||
primary={true}
|
||||
onClick={this.onSubbmit}
|
||||
onClick={this.onSubmit}
|
||||
/>
|
||||
<Button
|
||||
className="button-dialog"
|
||||
@ -71,8 +76,17 @@ const LeaveFormDialog = (props) => (
|
||||
);
|
||||
|
||||
LeaveFormDialog.propTypes = {
|
||||
visible: PropTypes.bool.isRequired,
|
||||
isVisibleModalLeave: PropTypes.bool.isRequired,
|
||||
onContinue: PropTypes.func.isRequired,
|
||||
};
|
||||
|
||||
export default LeaveFormDialog;
|
||||
function mapStateToProps(state) {
|
||||
return {
|
||||
isVisibleModalLeave: state.people.editingForm.isVisibleModalLeave,
|
||||
};
|
||||
}
|
||||
|
||||
export default connect(mapStateToProps, {
|
||||
setIsVisibleModalLeave,
|
||||
setIsEditingForm,
|
||||
})(LeaveFormDialog);
|
||||
|
@ -26,6 +26,8 @@ export const SET_SELECTED = "SET_SELECTED";
|
||||
export const SET_FILTER = "SET_FILTER";
|
||||
export const SELECT_GROUP = "SELECT_GROUP";
|
||||
export const SET_SELECTOR_USERS = "SET_SELECTOR_USERS";
|
||||
export const SET_IS_VISIBLE_MODAL_LEAVE = "SET_IS_VISIBLE_MODAL_LEAVE";
|
||||
export const SET_IS_EDITING_FORM = "SET_IS_EDITING_FORM";
|
||||
|
||||
export function setUser(user) {
|
||||
return {
|
||||
@ -141,6 +143,20 @@ export function setSelectorUsers(users) {
|
||||
};
|
||||
}
|
||||
|
||||
export function setIsVisibleModalLeave(isVisible) {
|
||||
return {
|
||||
type: SET_IS_VISIBLE_MODAL_LEAVE,
|
||||
isVisible,
|
||||
};
|
||||
}
|
||||
|
||||
export function setIsEditingForm(isEdit) {
|
||||
return {
|
||||
type: SET_IS_EDITING_FORM,
|
||||
isEdit,
|
||||
};
|
||||
}
|
||||
|
||||
export function fetchSelectorUsers() {
|
||||
return (dispatch) => {
|
||||
api.people.getSelectorUserList().then((data) => {
|
||||
@ -245,12 +261,6 @@ export function resetFilter() {
|
||||
|
||||
export function updateProfileInUsers(updatedProfile) {
|
||||
return (dispatch, getState) => {
|
||||
if (!updatedProfile) {
|
||||
const { profile } = getState();
|
||||
updatedProfile = profile.targetUser;
|
||||
}
|
||||
|
||||
const { userName } = updatedProfile;
|
||||
const { people } = getState();
|
||||
const { users } = people;
|
||||
|
||||
@ -258,6 +268,12 @@ export function updateProfileInUsers(updatedProfile) {
|
||||
return updateUserList(dispatch);
|
||||
}
|
||||
|
||||
if (!updatedProfile) {
|
||||
const { profile } = getState();
|
||||
updatedProfile = profile.targetUser;
|
||||
}
|
||||
|
||||
const { userName } = updatedProfile;
|
||||
const oldProfile = getUserByUserName(users, userName);
|
||||
const newProfile = {};
|
||||
|
||||
|
@ -8,7 +8,9 @@ import {
|
||||
SET_FILTER,
|
||||
SELECT_GROUP,
|
||||
SET_USER,
|
||||
SET_SELECTOR_USERS
|
||||
SET_SELECTOR_USERS,
|
||||
SET_IS_VISIBLE_MODAL_LEAVE,
|
||||
SET_IS_EDITING_FORM,
|
||||
} from "./actions";
|
||||
import { isUserSelected, skipUser, getUsersBySelected } from "./selectors";
|
||||
import { api } from "asc-web-common";
|
||||
@ -22,60 +24,78 @@ const initialState = {
|
||||
selectedGroup: null,
|
||||
filter: Filter.getDefault(),
|
||||
selector: {
|
||||
users: []
|
||||
}
|
||||
users: [],
|
||||
},
|
||||
editingForm: {
|
||||
isEdit: false,
|
||||
isVisibleModalLeave: false,
|
||||
},
|
||||
};
|
||||
|
||||
const peopleReducer = (state = initialState, action) => {
|
||||
switch (action.type) {
|
||||
case SET_GROUPS:
|
||||
return Object.assign({}, state, {
|
||||
groups: action.groups
|
||||
groups: action.groups,
|
||||
});
|
||||
case SET_USERS:
|
||||
return Object.assign({}, state, {
|
||||
users: action.users
|
||||
users: action.users,
|
||||
});
|
||||
case SET_USER:
|
||||
return Object.assign({}, state, {
|
||||
users: state.users.map(user =>
|
||||
users: state.users.map((user) =>
|
||||
user.id === action.user.id ? action.user : user
|
||||
)
|
||||
),
|
||||
});
|
||||
case SET_SELECTION:
|
||||
return Object.assign({}, state, {
|
||||
selection: action.selection
|
||||
selection: action.selection,
|
||||
});
|
||||
case SELECT_USER:
|
||||
if (!isUserSelected(state.selection, action.user.id)) {
|
||||
return Object.assign({}, state, {
|
||||
selection: [...state.selection, action.user]
|
||||
selection: [...state.selection, action.user],
|
||||
});
|
||||
} else return state;
|
||||
case DESELECT_USER:
|
||||
if (isUserSelected(state.selection, action.user.id)) {
|
||||
return Object.assign({}, state, {
|
||||
selection: skipUser(state.selection, action.user.id)
|
||||
selection: skipUser(state.selection, action.user.id),
|
||||
});
|
||||
} else return state;
|
||||
case SET_SELECTED:
|
||||
return Object.assign({}, state, {
|
||||
selected: action.selected,
|
||||
selection: getUsersBySelected(state.users, action.selected)
|
||||
selection: getUsersBySelected(state.users, action.selected),
|
||||
});
|
||||
case SET_FILTER:
|
||||
return Object.assign({}, state, {
|
||||
filter: action.filter
|
||||
filter: action.filter,
|
||||
});
|
||||
case SELECT_GROUP:
|
||||
return Object.assign({}, state, {
|
||||
selectedGroup: action.groupId
|
||||
selectedGroup: action.groupId,
|
||||
});
|
||||
case SET_SELECTOR_USERS:
|
||||
return Object.assign({}, state, {
|
||||
selector: Object.assign({}, state.selector, {
|
||||
users: action.users
|
||||
})
|
||||
selector: Object.assign({}, state.selector, {
|
||||
users: action.users,
|
||||
}),
|
||||
});
|
||||
case SET_IS_VISIBLE_MODAL_LEAVE:
|
||||
return Object.assign({}, state, {
|
||||
editingForm: {
|
||||
...state.editingForm,
|
||||
isVisibleModalLeave: action.isVisible,
|
||||
},
|
||||
});
|
||||
case SET_IS_EDITING_FORM:
|
||||
return Object.assign({}, state, {
|
||||
editingForm: {
|
||||
...state.editingForm,
|
||||
isEdit: action.isEdit,
|
||||
},
|
||||
});
|
||||
default:
|
||||
return state;
|
||||
|
Loading…
Reference in New Issue
Block a user