zhongrj
2025-11-24 276323dce9613867abb3f58a4cc2abbfb2fd0dea
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
import React from 'react';
import '../css/SortPanel.scss';
import PropTypes from 'prop-types';
import { _ } from '../classes/gettext';
 
class SortPanel extends React.Component {
  static defaultProps = {
    items: [],
    onChange: () => {},
    selected: null
  };
 
  static propTypes = {
    items: PropTypes.arrayOf(PropTypes.object),
    onChange: PropTypes.func,
    selected: PropTypes.string
  };
 
  constructor(props){
    super(props);
 
    this.state = {
      items: props.items
    }
 
    if (props.selected){
      let normSortKey = props.selected.replace("-", "");
      this.state.items.forEach(s => {
          if (s.key === normSortKey) s.selected = props.selected[0] === "-" ? "desc" : "asc";
      });
    }
  }
 
  handleClick = (key, order) => {
    return () => {
      this.state.items.forEach(i => {
        i.selected = i.key === key ? order : false;
      });
      this.setState({
        items: this.state.items
      })
      this.props.onChange(order === "desc" ? "-" + key : key);
    }
  }
 
  render() {
    return (<ul className="dropdown-menu dropdown-menu-right sort-items">
      <li className="sort-order-label">{_("Descending")}</li>
      {this.state.items.map(i => 
        <li key={i.key}><a onClick={this.handleClick(i.key, "desc")} className="sort-item">
          { i.label } {i.selected === "desc" ? <i className="fa fa-check"></i> : ""}
        </a></li>
      )}
      <li className="sort-order-label">{_("Ascending")}</li>
      {this.state.items.map(i => 
        <li key={i.key}><a onClick={this.handleClick(i.key, "asc")} className="sort-item">
          { i.label } {i.selected === "asc" ? <i className="fa fa-check"></i> : ""}
        </a></li>
      )}
    </ul>);
  }
}
 
export default SortPanel;