Ver código fonte

Add repetition table for word counting

Tatiana Inama 6 anos atrás
pai
commit
853ed504e5
2 arquivos alterados com 32 adições e 2 exclusões
  1. 11 1
      src/Admin.css
  2. 21 1
      src/Admin.tsx

+ 11 - 1
src/Admin.css

@@ -106,5 +106,15 @@
 }
 
 .vom-selected-data {
-  padding-left: 1rem;
+  margin-top: 1rem;
+  display: flex;
+}
+
+.vom-wordcloud-repetition {
+  width: 50%;
+  margin-right: 1rem;
+}
+
+.vom-selected-table {
+  width: 50%;
 }

+ 21 - 1
src/Admin.tsx

@@ -555,7 +555,27 @@ class Admin extends React.Component<{}, AdminState> {
             {
               this.state.selectedArea ? (
                 <>
-                  <SelectedAreaTable items={this.state.selectedArea}></SelectedAreaTable>
+                  { this.state.wordCloud.length ? (
+                    <Table bordered className="vom-wordcloud-repetition">
+                      <thead>
+                        <tr>
+                          <th>word</th>
+                          <th>repetition</th>
+                        </tr>
+                      </thead>
+                      <tbody>
+                        { this.state.wordCloud.map(({text, value}, i) => (
+                          <tr key={i}>
+                            <td>{text}</td>
+                            <td>{value}</td>
+                          </tr>
+                        )) }
+                      </tbody>
+                    </Table>
+                  ) : null }
+                  <div className="vom-selected-table">
+                    <SelectedAreaTable items={this.state.selectedArea}></SelectedAreaTable>
+                  </div>
                 </>
               ) : null
             }