Ivan - Add my tickets department dropdown, fix loading, add filter, merge master[skip ci]

This commit is contained in:
ivan 2016-10-28 03:28:11 -03:00
parent 22cd244846
commit 3179b29158
9 changed files with 110 additions and 27 deletions

View File

@ -12,6 +12,7 @@ import DateTransformer from 'lib-core/date-transformer';
class TicketList extends React.Component {
static propTypes = {
loading: React.PropTypes.bool,
ticketPath: React.PropTypes.string,
tickets: React.PropTypes.arrayOf(React.PropTypes.object),
type: React.PropTypes.oneOf([
'primary',
@ -21,6 +22,7 @@ class TicketList extends React.Component {
static defaultProps = {
tickets: [],
ticketPath: '/dashboard/ticket/',
type: 'primary'
};
@ -106,7 +108,7 @@ class TicketList extends React.Component {
</Tooltip>
),
title: (
<Button className="ticket-list__title-link" type="clean" route={{to: '/dashboard/ticket/' + ticket.ticketNumber}}>
<Button className="ticket-list__title-link" type="clean" route={{to: this.props.ticketPath + ticket.ticketNumber}}>
{titleText}
</Button>
),

View File

@ -1,4 +1,5 @@
import React from 'react';
import _ from 'lodash';
import {connect} from 'react-redux';
import i18n from 'lib-app/i18n';
@ -9,6 +10,15 @@ import DropDown from 'core-components/drop-down';
import TicketList from 'app-components/ticket-list';
class AdminPanelMyTickets extends React.Component {
static defaultProps = {
departments: [],
tickets: []
};
state = {
selectedDepartment: 0
};
componentDidMount() {
this.props.dispatch(AdminDataAction.retrieveMyTickets());
@ -16,31 +26,68 @@ class AdminPanelMyTickets extends React.Component {
render() {
return (
<div>
<div className="admin-panel-my-tickets">
<Header title={i18n('MY_TICKETS')} description={i18n('MY_TICKETS_DESCRIPTION')} />
<DropDown {...this.getProps()} />
<TicketList tickets={this.props.tickets} type="secondary" loading={true} />
<div className="admin-panel-my-tickets__department-select">
<DropDown {...this.getDropdownProps()} />
</div>
<TicketList {...this.getProps()}/>
</div>
);
}
getProps() {
console.log(this.props.tickets);
return {
items: this.props.departments.map(function (obj) {
return {
content: obj.name
};
}),
tickets: this.getTickets(),
type: 'secondary',
loading: this.props.loading,
ticketPath: '/admin/panel/tickets/view-ticket/'
};
}
getDropdownProps() {
return {
items: this.getDepartments(),
onChange: this.changeSelectedDepartment.bind(this),
size: 'medium'
};
}
getTickets() {
return (this.state.selectedDepartment) ? _.filter(this.props.tickets, (ticket) => {
return ticket.department.id == this.state.selectedDepartment
}) : this.props.tickets;
}
getDepartments() {
let departments = this.props.departments.map((department) => {
return {content: department.name};
});
departments.unshift({
content: i18n('ALL_DEPARTMENTS')
});
return departments;
}
changeSelectedDepartment(event) {
if(event.index === 0) {
this.setState({
selectedDepartment: 0
});
} else {
this.setState({
selectedDepartment: this.props.departments[event.index - 1].id
});
}
}
}
export default connect((store) => {
return {
departments: store.session.userDepartments,
tickets: store.adminData.myTickets
tickets: store.adminData.myTickets,
loading: !store.adminData.myTicketsLoaded
};
})(AdminPanelMyTickets);

View File

@ -0,0 +1,6 @@
.admin-panel-my-tickets {
&__department-select {
margin-bottom: 25px;
}
}

View File

@ -166,7 +166,7 @@ let DemoPage = React.createClass({
else if(a.title1 > b.title1)
ans = 1;
return ans;
}}/>
}} loading/>
)
}
],

View File

@ -51,6 +51,8 @@
&__loading-wrapper {
min-height: 200px;
position: relative;
background-color: $grey;
}
&__loading {

View File

@ -17,6 +17,7 @@
background-color: #F7F7F7;
color: black;
padding: 10px;
z-index: 1000;
}
&__pointer {

View File

@ -13,9 +13,7 @@ module.exports = [
staff: true,
departments: [
{id: 1, name: 'Sales Support'},
{id: 2, name: 'Technical Issues'},
{id: 3, name: 'System and Administration'},
{id: 4, name: 'Guillermo\'s department'}
{id: 2, name: 'Technical Issues'}
]
}
};
@ -23,7 +21,7 @@ module.exports = [
},
{
path: '/staff/get-tickets',
time: 2000,
time: 300,
response: function () {
return {
status: 'success',
@ -34,7 +32,7 @@ module.exports = [
content: 'I had a problem with the installation of the php server',
department: {
id: 2,
name: 'Environment Setup'
name: 'Technical Issues'
},
date: '20160416',
file: 'http://www.opensupports.com/some_file.zip',
@ -52,7 +50,7 @@ module.exports = [
name: 'Steve Jobs',
email: 'steve@jobs.com'
},
actions: [
events: [
{
type: 'ASSIGN',
date: '20150409',
@ -153,7 +151,7 @@ module.exports = [
content: 'I had a problem with the installation of the php server',
department: {
id: 2,
name: 'Environment Setup'
name: 'Technical Issues'
},
date: '20160415',
file: 'http://www.opensupports.com/some_file.zip',
@ -168,7 +166,7 @@ module.exports = [
owner: {
name: 'Steve Jobs'
},
actions: [
events: [
{
type: 'ASSIGN',
date: '20150409',
@ -269,7 +267,7 @@ module.exports = [
content: 'I had a problem with the installation of the php server',
department: {
id: 2,
name: 'Environment Setup'
name: 'Technical Issues'
},
date: '20150409',
file: 'http://www.opensupports.com/some_file.zip',
@ -284,7 +282,7 @@ module.exports = [
owner: {
name: 'Steve Jobs'
},
actions: [
events: [
{
type: 'ASSIGN',
date: '20150409',
@ -378,6 +376,32 @@ module.exports = [
}
}
]
},
{
ticketNumber: '445441',
title: 'Inscription ACM ICPC',
content: 'I had a problem with the installation of the php server',
department: {
id: 1,
name: 'Sales Support'
},
date: '20160416',
file: 'http://www.opensupports.com/some_file.zip',
language: 'en',
unread: false,
closed: false,
priority: 'low',
author: {
id: 12,
name: 'Haskell Curry',
email: 'haskell@lambda.com'
},
owner: {
id: 15,
name: 'Steve Jobs',
email: 'steve@jobs.com'
},
events: []
}
]
}

View File

@ -72,6 +72,7 @@ export default {
'UN_ASSIGN': 'Unassign',
'VIEW_TICKET': 'View Ticket',
'SELECT_CUSTOM_RESPONSE': 'Select a custom response...',
'ALL_DEPARTMENTS': 'All Departments',
//VIEW DESCRIPTIONS
'CREATE_TICKET_DESCRIPTION': 'This is a form for creating tickets. Fill the form and send us your issues/doubts/suggestions. Our support system will answer it as soon as possible.',

View File

@ -17,7 +17,7 @@ class AdminDataReducer extends Reducer {
getTypeHandlers() {
return {
'CUSTOM_RESPONSES_FULFILLED': this.onCustomResponses,
'SESSION_CHECKED': this.onSessionChecked
'SESSION_CHECKED': this.onSessionChecked,
'MY_TICKETS_FULFILLED': this.onMyTicketsRetrieved,
'MY_TICKETS_PENDING': this.onMyTicketsPending
};
@ -44,13 +44,13 @@ class AdminDataReducer extends Reducer {
onMyTicketsRetrieved(state, payload) {
return _.extend({}, state, {
myTickets: payload.data,
customResponsesLoaded: true
myTicketsLoaded: true
})
}
onMyTicketsPending(state) {
return _.extennd({}, state, {
myTicketsLoaded: true
return _.extend({}, state, {
myTicketsLoaded: false
})
}
}