Kongzibapt 3 years ago
parent
commit
aa62eaef6c
3 changed files with 108 additions and 47 deletions
  1. 5
    4
      src/js/Components/Sort.js
  2. 42
    24
      src/js/Views/Stock.js
  3. 61
    19
      src/js/Views/Ticket.js

+ 5
- 4
src/js/Components/Sort.js View File

@@ -20,13 +20,14 @@ class Sort extends Component {
20 20
                     <div id="selectBlock">
21 21
                         <div id="selectBox">
22 22
                             <select id="sortSelect" onChange={this.props.handleChangeSortType}>
23
-                                <option className="optionSort" value="Ordre Alphabétique">Ordre Alphabétique</option>
24
-                                <option className="optionSort" value="Catégorie">Catégorie</option>
25
-                                <option className="optionSort" value="Quantité">Quantité</option>
23
+                                <option className="optionSort" value="name">Ordre Alphabétique</option>
24
+                                <option className="optionSort" value="category_id">Catégorie</option>
25
+                                <option className="optionSort" value="quantity">Quantité</option>
26
+                                <option className="optionSort" value="price">Prix</option>
26 27
                             </select>
27 28
                         </div>
28 29
                     </div>
29
-                    <p id="sortOrder" onClick={this.props.handleChangeSortOrder} hidden={this.props.orderIsVisible}>
30
+                    <p id="sortOrder" onClick={this.props.handleChangeSortOrder} hidden={this.props.orderIsHidden}>
30 31
                        {this.props.lowToHigh ? "A-Z" : "Z-A"}   
31 32
                     </p>
32 33
                 </div>

+ 42
- 24
src/js/Views/Stock.js View File

@@ -17,7 +17,6 @@ import EditCategory from '../Components/EditCategory';
17 17
 import Sort from '../Components/Sort';
18 18
 import { Link } from 'react-router-dom';
19 19
 import Selected from '../Components/Selected';
20
-import BarcodeReader from 'react-barcode-reader'
21 20
 
22 21
 export default class Stock extends React.Component {
23 22
 
@@ -67,8 +66,9 @@ export default class Stock extends React.Component {
67 66
   sortArticles = (sortType) => {
68 67
       
69 68
     let sorted;
69
+    //TRI PAR ORDRE ALPHABETIQUE OU PRIX
70 70
     if (sortType === "name"){
71
-      this.setState({orderIsVisible: false})
71
+      this.setState({orderIsHidden: false}) //choix d'ordre possible
72 72
       if (this.state.lowToHigh) {
73 73
         //ordre alphabétique croissant
74 74
         sorted = [...this.state.articles].sort((a, b) => a.name.localeCompare(b.name))
@@ -76,17 +76,31 @@ export default class Stock extends React.Component {
76 76
         //ordre alphabétique décroissant
77 77
         sorted = [...this.state.articles].sort((a, b) => b.name.localeCompare(a.name))
78 78
       }
79
+    } else if (sortType === "price") {
80
+      console.log('tri pix')
81
+      this.setState({orderIsHidden: false}) //choix d'ordre possible
82
+      if (this.state.lowToHigh) {
83
+        //ordre croissant
84
+        sorted = [...this.state.articles].sort((a, b) => a.price - b.price)
85
+      } else {
86
+        //ordre décroissant
87
+        sorted = [...this.state.articles].sort((a, b) => b.price - a.price)
88
+      }
89
+      
79 90
     } else {
80
-      this.setState({orderIsVisible: true})
91
+      console.log('autre 1')
92
+      this.setState({orderIsHidden: true})
81 93
       this.setState({lowToHigh: false})
82 94
       sorted = [...this.state.articles].sort((a, b) => b[sortType] - a[sortType]);
83 95
     }
84 96
 
97
+    //TRI PAR CATEGORIE
85 98
     if (sortType === 'category_id'){
86
-        this.setState({articles:sorted},() => {
87
-          this.setState({onSortedCategories:true})
88
-        })
99
+      this.setState({articles:sorted},() => {
100
+        this.setState({onSortedCategories:true})
101
+      })
89 102
     }else{
103
+      console.log('autre 2')
90 104
       this.setState({articles:sorted},() => {
91 105
         console.log(this.state.articles)
92 106
         this.setState({onSortedCategories:false})
@@ -153,23 +167,34 @@ export default class Stock extends React.Component {
153 167
     this.setState({onEditCategory:false})
154 168
   }
155 169
 
156
-  handleChangeSortType = (e) => {
157
-    this.setState({sortType:e.target.value},()=>{
158
-      if (this.state.sortType === "Ordre Alphabétique"){
159
-        this.sortArticles("name")
160
-      } else if(this.state.sortType === "Catégorie"){
161
-        this.sortArticles("category_id")
162
-      } else if(this.state.sortType === "Quantité"){
163
-        this.sortArticles("quantity")
164
-      } 
170
+  // handleChangeSortType = (e) => {
171
+  //   console.log(e.target.value)
172
+  //   this.setState({sortType:e.target.value},()=>{
173
+  //     if (this.state.sortType === "Ordre Alphabétique"){
174
+  //       this.sortArticles("name")
175
+  //     } else if(this.state.sortType === "Catégorie"){
176
+  //       this.sortArticles("category_id")
177
+  //     } else if(this.state.sortType === "Quantité"){
178
+  //       this.sortArticles("quantity")
179
+  //     } else if(this.state.sortType === "Prix"){
180
+  //       this.sortArticles("price");
181
+  //     } 
182
+
183
+  //   })
184
+  // }
165 185
 
186
+  handleChangeSortType = (e) => {
187
+    console.log(e.target.value)
188
+    this.setState({sortType: e.target.value}, () => {
189
+      this.sortArticles(this.state.sortType)
166 190
     })
167 191
   }
168 192
 
169 193
   //Gère le choix de tri par ordre croissant ou décroissant quand c'est possible avec le tri actuel
170 194
   handleChangeSortOrder = e => {
171 195
     this.setState({lowToHigh: (this.state.lowToHigh + 1) % 2},() => {
172
-      this.sortArticles("name");
196
+      console.log(this.state.sortType)
197
+      this.sortArticles(this.state.sortType);
173 198
     });
174 199
   }
175 200
 
@@ -216,19 +241,12 @@ export default class Stock extends React.Component {
216 241
     }
217 242
   }
218 243
 
219
-  handleScan = (data) => {
220
-    this.setState({code:data},()=>{
221
-      console.log(this.state.code)
222
-    })
223
-  }
224
-
225 244
   render() {
226 245
     if (!sessionStorage.getItem('token')){
227 246
       return (<div id="errorRouteBlock"><div id="errorRouteTitle">ERREUR </div><br/><div id="errorRouteTxt">Vous n'êtes pas connecté</div><br/><Link id="link" to='/'>Retourner à l'Accueil</Link></div>)
228 247
     } else {
229 248
       return (
230 249
           <div id="stock" tabIndex={-1} onKeyDown={this.closeWithEscape}>
231
-          <BarcodeReader onScan={this.handleScan}/>
232 250
               <Header title='Le Stock'/>
233 251
               <Navbar handleNewArticle={this.handleNewArticle} handleNewCategory={this.handleNewCategory} right="Le Ticket de Caisse" left="Créer" leftLeft="Article" leftMiddle="|" leftRight="Catégorie" redirect="/ticket"/>
234 252
               {this.state.onNewArticle ?
@@ -236,7 +254,7 @@ export default class Stock extends React.Component {
236 254
               : null}
237 255
               <SearchBar handleSubmit={this.handleSubmit} handleSearchChange={this.handleSearchChange}/>
238 256
               <div id="sortBlock">
239
-                <Sort handleChangeSortType={this.handleChangeSortType} handleChangeSortOrder={this.handleChangeSortOrder} orderIsVisible={this.state.orderIsVisible} lowToHigh={this.state.lowToHigh}/>
257
+                <Sort handleChangeSortType={this.handleChangeSortType} handleChangeSortOrder={this.handleChangeSortOrder} orderIsHidden={this.state.orderIsHidden} lowToHigh={this.state.lowToHigh}/>
240 258
               </div>
241 259
               <div id="selectedBlock">
242 260
                 <Selected counter={this.state.counter}/>

+ 61
- 19
src/js/Views/Ticket.js View File

@@ -6,34 +6,76 @@ import 'react-perfect-scrollbar/dist/css/styles.css';
6 6
 import Footer from '../Components/Footer';
7 7
 import { Link } from 'react-router-dom';
8 8
 import SearchBar from '../Components/SearchBar';
9
+import BarcodeReader from 'react-barcode-reader';
10
+import axios from 'axios';
9 11
 
10 12
 export default class Stock extends React.Component {
11 13
 
12 14
   constructor(props){
13 15
     super(props)
14 16
     this.state = {
17
+      articles: [],
18
+      scannedCode: ''
15 19
     }
20
+
21
+    this.handleScan = this.handleScan.bind(this);
22
+  }
23
+
24
+  
25
+  getArticles = () => {
26
+    axios.get('https://etud.insa-toulouse.fr/~proximo/v2/api/articles')
27
+        .then(res => {
28
+            this.setState({articles : res.data}, () => {
29
+                console.log(this.state.articles)
30
+            })
31
+        })
32
+        .catch(error => {
33
+            console.log(error.response)
34
+        })
16 35
   }
17 36
 
18 37
   componentDidMount() {
19
-}
38
+    this.getArticles();
39
+  }
40
+  
41
+  // RECHERCHE DE L'ARTICLE
42
+  getArticleByCode() {
43
+    let i=0;
44
+    let current = this.state.articles[i];
45
+    let trouve = current === this.state.scannedCode ? true : false;
46
+    while(!trouve) {
47
+      i++;
48
+      current = this.state.articles[i];
49
+      if (current.scannedCode === this.state.scannedCode) {
50
+        trouve = !trouve;
51
+      }
52
+    }
53
+    console.log(current);
54
+  }
55
+
56
+  handleScan(code) {
57
+    this.setState({result: code}, () => {
58
+      console.log(this.state.result);
59
+    });
60
+  }
20 61
 
21
-    render() {
22
-      if (!sessionStorage.getItem('token')){
23
-        return (<div id="errorRouteBlock"><div id="errorRouteTitle">ERREUR </div><br/><div id="errorRouteTxt">Vous n'êtes pas connecté</div><br/><Link id="link" to='/'>Retourner à l'Accueil</Link></div>)
24
-      } else {
25
-      return (
26
-          <div id="stock">
27
-              <Header title='Le Ticket de Caisse'/>
28
-              <Navbar redirect="/stock" left="Monnaie" right="Le Stock"/>
29
-              <SearchBar/>
30
-              <div id="emptyTicketBox">
31
-                <p id="emptyTicket">
62
+  render() {
63
+    if (!sessionStorage.getItem('token')){
64
+      return (<div id="errorRouteBlock"><div id="errorRouteTitle">ERREUR </div><br/><div id="errorRouteTxt">Vous n'êtes pas connecté</div><br/><Link id="link" to='/'>Retourner à l'Accueil</Link></div>)
65
+    } else {
66
+    return (
67
+        <div id="stock">
68
+            <Header title='Le Ticket de Caisse'/>
69
+            <Navbar redirect="/stock" left="Monnaie" right="Le Stock"/>
70
+            <BarcodeReader onScan={this.handleScan}/>
71
+            <SearchBar/>
72
+            <div id="emptyTicketBox">
73
+              <p id="emptyTicket">
32 74
                 Scanne tes articles pour remplir le ticket de caisse ! 
33
-                </p>
34
-              </div>
35
-              <Footer/>
36
-          </div>
37
-      )}
38
-    }
39
-  }
75
+              </p>
76
+            </div>
77
+            <Footer/>
78
+        </div>
79
+    )}
80
+  }
81
+}

Loading…
Cancel
Save