[DEV-217] update tickets when changing departments (#1137)

* update tickets when changing departments

* add loading to ticketlist
This commit is contained in:
Joel Elias Méndez 2022-02-03 17:19:22 -03:00 committed by GitHub
parent 3e3a95f518
commit 527843f00f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 26 additions and 5 deletions

View File

@ -64,7 +64,8 @@ class StaffEditor extends React.Component {
owners: [], owners: [],
tags: [] tags: []
}, },
ticketData: {} ticketData: {},
ticketListLoading: false
}; };
componentDidMount() { componentDidMount() {
@ -301,7 +302,7 @@ class StaffEditor extends React.Component {
renderDepartmentsInfo() { renderDepartmentsInfo() {
const { departments } = this.state; const { departments } = this.state;
const departmentsAssigned = this.getDepartments().filter((_department, index) => departments.includes(index)) const departmentsAssigned = this.getDepartments().filter((_department, index) => departments.includes(index));
return ( return (
<Form values={{departments: Array.from({length: departmentsAssigned.length}, (value, index) => index)}}> <Form values={{departments: Array.from({length: departmentsAssigned.length}, (value, index) => index)}}>
@ -330,7 +331,10 @@ class StaffEditor extends React.Component {
<span className="separator" /> <span className="separator" />
<div className="staff-editor__tickets"> <div className="staff-editor__tickets">
<div className="staff-editor__tickets-title">{i18n('TICKETS_ASSIGNED')}</div> <div className="staff-editor__tickets-title">{i18n('TICKETS_ASSIGNED')}</div>
{this.state.ticketListLoading ?
<Loading className="staff-editor__ticketlist-loading" backgrounded size="large"/> :
<TicketList {...this.getTicketListProps()} /> <TicketList {...this.getTicketListProps()} />
}
</div> </div>
</div> </div>
); );
@ -423,7 +427,10 @@ class StaffEditor extends React.Component {
} }
onSubmit(eventType, form) { onSubmit(eventType, form) {
this.setState({loadingStats: true}); this.setState({
loadingStats: true,
ticketListLoading: true
});
const { myAccount, staffId, onChange } = this.props; const { myAccount, staffId, onChange } = this.props;
let departments; let departments;
@ -447,7 +454,11 @@ class StaffEditor extends React.Component {
}).then(() => { }).then(() => {
this.retrieveStaffMembers(); this.retrieveStaffMembers();
window.scrollTo(0,250); window.scrollTo(0,250);
this.setState({message: eventType, showMessage: true}); this.setState({
message: eventType,
showMessage: true,
ticketListLoading: false
});
const departmentsAssigned = SessionStore.getDepartments().filter((_department, index) => this.state.departments.includes(index)); const departmentsAssigned = SessionStore.getDepartments().filter((_department, index) => this.state.departments.includes(index));
const departmentsAssignedId = departmentsAssigned.map(department => department.id); const departmentsAssignedId = departmentsAssigned.map(department => department.id);
@ -462,6 +473,7 @@ class StaffEditor extends React.Component {
this.setState({loadingStats: false}); this.setState({loadingStats: false});
}); });
this.retrieveTicketsAssigned({page: 1});
onChange && onChange(); onChange && onChange();
}).catch(() => { }).catch(() => {
window.scrollTo(0,250); window.scrollTo(0,250);

View File

@ -174,6 +174,15 @@
margin-bottom: 20px; margin-bottom: 20px;
} }
&__ticketlist-loading {
min-height: 361px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background-color: $grey;
}
&__separator { &__separator {
margin: 3px 0; margin: 3px 0;
} }