daily pastebin goal
52%
SHARE
TWEET

Untitled

a guest Feb 20th, 2019 55 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. import React, { Component } from 'react';
  2. import transactions from './transactions';
  3. import TableList from './Table';
  4. import Buttons from './Buttons';
  5.  
  6. // Get current month for filter
  7. const currMonth = new Date();
  8.  
  9. const operators = {
  10.   '>': function(a, b) {
  11.     return a > b;
  12.   },
  13.   '===': function(a, b) {
  14.     return a === b;
  15.   }
  16. };
  17.  
  18. class App extends Component {
  19.   state = {
  20.     type: 'all',
  21.     value: '',
  22.     date: '',
  23.     btn: [
  24.       {
  25.         id: 1,
  26.         btnLabel: 'income',
  27.         btnClass: 'inactive',
  28.         conditionValue: 'income',
  29.         conditionKey: 'type',
  30.         conditionOperator: '==='
  31.       },
  32.       {
  33.         id: 2,
  34.         btnLabel: 'expenditure',
  35.         btnClass: 'inactive',
  36.         conditionValue: 'expenditure',
  37.         conditionKey: 'type',
  38.         conditionOperator: '==='
  39.       },
  40.       {
  41.         id: 3,
  42.         btnLabel: 'last month',
  43.         btnClass: 'inactive',
  44.         conditionValue: '1',
  45.         conditionKey: 'date',
  46.         conditionOperator: '==='
  47.       },
  48.       {
  49.         id: 4,
  50.         btnLabel: 'more than 1000rub',
  51.         btnClass: 'inactive',
  52.         conditionValue: '1000',
  53.         conditionKey: 'value',
  54.         conditionOperator: '>'
  55.       }
  56.     ]
  57.   };
  58.  
  59.   onFilterToggle = (type, value) => {
  60.     if (!this.state[type]) {
  61.       this.setState({ [type]: value });
  62.     } else {
  63.       this.setState({ [type]: '' });
  64.     }
  65.   };
  66.  
  67.   filterUp(item, operator, param) {
  68.     return operators[operator](item, param);
  69.   }
  70.  
  71.   filterArray() {
  72.     let typeParam;
  73.     let valueParam;
  74.     let dateParam;
  75.     typeParam = this.state.type;
  76.     valueParam = this.state.value;
  77.     dateParam = this.state.date;
  78.  
  79.     if (typeParam === 'all') {
  80.       typeParam = '';
  81.     }
  82.     let filterArr = transactions.slice();
  83.     filterArr = filterArr.filter(
  84.       item =>
  85.         this.filterUp(item.type, '>', typeParam) &&
  86.         this.filterUp(item.value, '>', valueParam) &&
  87.         this.filterUp(item.date, '>', dateParam)
  88.     );
  89.     // /transactions.filter (trns => filters.every(filter => filter(trans))
  90.     console.log(filterArr);
  91.     return filterArr;
  92.   }
  93.  
  94.   render() {
  95.     const { filterType, filterValue, filterDate, btn } = this.state;
  96.     // make copy of original array for filters
  97.     const filteredArray = this.filterArray();
  98.     return (
  99.       <div>
  100.         <Buttons
  101.           items={btn}
  102.           onFilterToggle={this.onFilterToggle}
  103.           onActiveToggle={this.onActiveToggle}
  104.         />
  105.         <TableList items={filteredArray} />
  106.       </div>
  107.     );
  108.   }
  109. }
  110.  
  111. export default App;
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top