Ver código fonte

Toggle wordcloud button

Tatiana Inama 6 anos atrás
pai
commit
af4f890a2a
2 arquivos alterados com 21 adições e 3 exclusões
  1. 4 0
      src/Admin.css
  2. 17 3
      src/Admin.tsx

+ 4 - 0
src/Admin.css

@@ -38,6 +38,10 @@
   overflow-y: scroll;
 }
 
+.vom-results-table-actions .badge {
+  margin-left: 0.5rem;
+}
+
 #vom-results-filters h6 {
   color: #6c757d;
   font-weight: 700;

+ 17 - 3
src/Admin.tsx

@@ -199,7 +199,6 @@ class Admin extends React.Component<{}, AdminState> {
       });
       this.setState({
         selectedArea: items || [],
-        wordCloud: this.mkWords(items)
       })
     }
   }
@@ -517,8 +516,23 @@ class Admin extends React.Component<{}, AdminState> {
                 {
                   this.state.selectedArea ? (
                     <>
-                      <p>drawings in area: 
-                        <Badge color="info">{this.state.selectedArea.length}</Badge> <Badge color="warning" href="#" onClick={() => this.clearDrawing() }>clear drawing</Badge> <Badge color="success" href="#" onClick={() => this.downloadResultsData() }>download results</Badge>
+                      <p className="vom-results-table-actions">drawings in area: 
+                        <Badge color="info">{this.state.selectedArea.length}</Badge>
+                        <Badge color="warning" href="#" onClick={() => this.clearDrawing() }>clear drawing</Badge>
+                        <Badge color="success" href="#" onClick={() => this.downloadResultsData() }>download results</Badge>
+                        <Badge color="primary" href="#" onClick={() => {
+                          if (this.state.wordCloud.length !== 0) {
+                            this.setState({
+                              wordCloud: []
+                            })
+                          } else {
+                            if(this.state.selectedArea) {
+                              this.setState({
+                                wordCloud: this.mkWords(this.state.selectedArea)
+                              })
+                            }
+                          }
+                        } }>toggle wordcloud</Badge>
                       </p>
                       <DrawingsTable
                         items={this.state.selectedArea}