tyler.durden/opensupports
1
0
Fork 0
mirror of https://github.com/opensupports/opensupports.git synced 2025-04-08 18:35:06 +02:00
Code Issues Packages Projects Releases Wiki Activity

Maxi - Add table sorter [skip ci]

Browse Source
This commit is contained in:
ivan 2016-09-30 18:54:29 -03:00
parent 0bd26c8aa4
commit c63fce6a26
5 changed files with 91 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
client/src/app-components/ticket-list.js
View File

@ -6,6 +6,8 @@ import Table from 'core-components/table';
import Button from 'core-components/button'; import Button from 'core-components/button';
import Tooltip from 'core-components/tooltip'; import Tooltip from 'core-components/tooltip';
import DateTransformer from 'lib-core/date-transformer';
class TicketList extends React.Component { class TicketList extends React.Component {
static propTypes = { static propTypes = {
tickets: React.PropTypes.arrayOf(React.PropTypes.object), tickets: React.PropTypes.arrayOf(React.PropTypes.object),
@ -23,7 +25,7 @@ class TicketList extends React.Component {
render() { render() {
return ( return (
<div className="ticket-list"> <div className="ticket-list">
<Table headers={this.getTableHeaders()} rows={this.getTableRows()} pageSize={10} /> <Table headers={this.getTableHeaders()} rows={this.getTableRows()} pageSize={10} comp={this.compareFunction} />
</div> </div>
); );
} }
@ -109,11 +111,13 @@ class TicketList extends React.Component {
priority: this.getTicketPriority(ticket.priority), priority: this.getTicketPriority(ticket.priority),
department: ticket.department.name, department: ticket.department.name,
author: ticket.author.name, author: ticket.author.name,
date: ticket.date, date: DateTransformer.transformToString(ticket.date),
unread: ticket.unread,
highlighted: ticket.unread highlighted: ticket.unread
}; };
} }
getTicketPriority(priority){
getTicketPriority(priority) {
if(priority == 'high'){ if(priority == 'high'){
return ( return (
<span className="ticket-list__priority-high">{i18n('HIGH')}</span> <span className="ticket-list__priority-high">{i18n('HIGH')}</span>
@ -130,6 +134,39 @@ class TicketList extends React.Component {
); );
} }
} }
compareFunction(row1, row2) {
let ans = 0;
if (row1.closed == row2.closed) {
if (row1.unread == row2.unread) {
let s1 = row1.date;
let s2 = row2.date;
let y1 = s1.substring(0, 4);
let y2 = s2.substring(0, 4);
if (y1 == y2) {
let m1 = s1.substring(4, 6);
let m2 = s2.substring(4, 6);
if (m1 == m2) {
let d1 = s1.substring(6, 8);
let d2 = s2.substring(6, 8);
if (d1 == d2) {
return 0;
}
return d1 > d2 ? -1 : 1;
}
return m1 > m2 ? -1 : 1;
}
return y1 > y2 ? -1 : 1;
}
return row1.unread ? -1 : 1;
}
return row1.closed ? -1 : 1;
}
} }

37
client/src/app/demo/components-demo-page.js
View File

@ -128,21 +128,28 @@ let DemoPage = React.createClass({
{value:'Title First', key: 'title1'}, {value:'Title First', key: 'title1'},
{value:'Title Second', key: 'title2'} {value:'Title Second', key: 'title2'}
]} rows={[ ]} rows={[
{title1: 'Row1', title2: 'Example'}, {title1: 'Row1', title2: 'Example', n: 1},
{title1: 'Row2', title2: 'Example'}, {title1: 'Row2', title2: 'Example', n: 2},
{title1: 'Row3', title2: 'Example'}, {title1: 'Row3', title2: 'Example', n: 3},
{title1: 'Row4', title2: 'Example'}, {title1: 'Row4', title2: 'Example', n: 4},
{title1: 'Row5', title2: 'Example'}, {title1: 'Row5', title2: 'Example', n: 5},
{title1: 'Row6', title2: 'Example'}, {title1: 'Row6', title2: 'Example', n: 6},
{title1: 'Row7', title2: 'Example'}, {title1: 'Row7', title2: 'Example', n: 7},
{title1: 'Row8', title2: 'Example'}, {title1: 'Row8', title2: 'Example', n: 8},
{title1: 'Row9', title2: 'Example'}, {title1: 'Row9', title2: 'Example', n: 9},
{title1: 'Row10', title2: 'Example'}, {title1: 'Row10', title2: 'Example', n: 10},
{title1: 'Row11', title2: 'Example'}, {title1: 'Row11', title2: 'Example', n: 11},
{title1: 'Row12', title2: 'Example'}, {title1: 'Row12', title2: 'Example', n: 12},
{title1: 'Row13', title2: 'Example'}, {title1: 'Row13', title2: 'Example', n: 13},
{title1: 'Row14', title2: 'Example'} {title1: 'Row14', title2: 'Example', n: 14}
]} pageSize={3}/> ]} pageSize={3} comp={function (a, b) {
let ans = 0;
if(a.title1 < b.title1)
ans = -1;
else if(a.title1 > b.title1)
ans = 1;
return ans;
}}/>
) )
} }
], ],

12
client/src/core-components/table.js
View File

@ -13,7 +13,8 @@ class Table extends React.Component {
})), })),
rows: React.PropTypes.arrayOf(React.PropTypes.object), rows: React.PropTypes.arrayOf(React.PropTypes.object),
pageSize: React.PropTypes.number, pageSize: React.PropTypes.number,
type: React.PropTypes.oneOf(['default']) type: React.PropTypes.oneOf(['default']),
comp: React.PropTypes.func
}; };
static defaultProps = { static defaultProps = {
@ -34,7 +35,7 @@ class Table extends React.Component {
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
{this.props.rows.map(this.renderRow.bind(this))} {this.getRows().map(this.renderRow.bind(this))}
</tbody> </tbody>
</table> </table>
{(this.props.pageSize && this.props.rows.length > this.props.pageSize) ? this.renderNavigation() : null} {(this.props.pageSize && this.props.rows.length > this.props.pageSize) ? this.renderNavigation() : null}
@ -100,6 +101,13 @@ class Table extends React.Component {
return classNames(classes); return classNames(classes);
} }
getRows() {
let v = _.clone(this.props.rows);
v.sort(this.props.comp);
return v;
}
} }
export default Table; export default Table;

14
client/src/data/fixtures/user-fixtures.js
View File

@ -143,10 +143,10 @@ module.exports = [
id: 2, id: 2,
name: 'Environment Setup' name: 'Environment Setup'
}, },
date: '15 Apr 2016', date: '20140415',
file: 'http://www.opensupports.com/some_file.zip', file: 'http://www.opensupports.com/some_file.zip',
language: 'en', language: 'en',
unread: true, unread: false,
closed: false, closed: false,
priority: 'low', priority: 'low',
author: { author: {
@ -168,7 +168,7 @@ module.exports = [
email: 'jobs@steve.com', email: 'jobs@steve.com',
staff: true staff: true
}, },
date: '12 Dec 2016', date: '20161212',
file: '' file: ''
}, },
{ {
@ -179,7 +179,7 @@ module.exports = [
steve: 'haskell@lambda.com', steve: 'haskell@lambda.com',
staff: false staff: false
}, },
date: '12 Dec 2016', date: '20161212',
file: '' file: ''
} }
] ]
@ -192,7 +192,7 @@ module.exports = [
id: 2, id: 2,
name: 'Environment Setup' name: 'Environment Setup'
}, },
date: '15 Apr 2016', date: '20170415',
file: 'http://www.opensupports.com/some_file.zip', file: 'http://www.opensupports.com/some_file.zip',
language: 'en', language: 'en',
unread: false, unread: false,
@ -232,10 +232,10 @@ module.exports = [
id: 2, id: 2,
name: 'Environment Setup' name: 'Environment Setup'
}, },
date: '15 Apr 2016', date: '20160415',
file: 'http://www.opensupports.com/some_file.zip', file: 'http://www.opensupports.com/some_file.zip',
language: 'en', language: 'en',
unread: false, unread: true,
closed: false, closed: false,
priority: 'high', priority: 'high',
author: { author: {

12
client/src/lib-core/date-transformer.js Normal file
View File

@ -0,0 +1,12 @@
let month = ["", "Jan", "Feb", "Mar", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
export default {
transformToString (date) {
let y = date.substring(0, 4);
let m = date.substring(4, 6);
let d = date.substring(6, 8);
m = (m[0] - '0') * 10 + (m[1] - '0');
return d + " " + month[m] + " " + y;
}
};