Separadores

ui/src/components/Separadores/index.jsx

@@ -0,0 +1,28 @@
+import React from 'react';
+import Tabs from 'antd/lib/tabs';
+import GraficoStock from "../GraficoStock/index.jsx";
+import TabelaCategoria from "../TabelaCategorias/index.jsx";
+import TabelaLoja from "../TabelaLoja/index.jsx";
+import TabelaProduto from "../TabelaProdutos/index.jsx";
+const { TabPane } = Tabs;
+
+function callback(key) {
+  console.log(key);
+}
+
+const Separadores = () => (
+    <Tabs defaultActiveKey="1" onChange={callback}>
+      <TabPane tab="Loja" key="1">
+        <TabelaLoja/> 
+      </TabPane>
+      <TabPane tab="Produtos" key="2">
+        <TabelaProduto/>
+        <GraficoStock/>
+      </TabPane>
+      <TabPane tab="Categorias" key="3">
+        <TabelaCategoria/>
+      </TabPane>
+    </Tabs>
+  );
+
+  export default Separadores;

ui/src/containers/DashboardContainer/index.jsx

@@ -9,6 +9,7 @@ import TabelaProduto from "../../components/TabelaProdutos/index.jsx";
 
 import "./index.less";
 import GraficoStock from "../../components/GraficoStock/index.jsx";
+import Separadores from "../../components/Separadores/index.jsx";
 
 export default class DashboardContainer extends Component {
     constructor(props) {
@@ -95,14 +96,16 @@ export default class DashboardContainer extends Component {
         return (
             <div className="my-dashboard">
               
-                    <h1 style={styleh1}>Lojas</h1>
+                    {/* <h1 style={styleh1}>Lojas</h1>
                     <TabelaLoja/>
                     <h1 style={styleh1}>Produtos</h1>
                     <TabelaProduto/>
                     <h1 style={styleh1}>Categorias</h1>
                     <TabelaCategoria/> 
                     <h1 style={styleh1}>Gráfico</h1>
-                    <GraficoStock/>   
+                    <GraficoStock/>    */}
+
+                    <Separadores/>
 
             </div>
         );