Tag: Super

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.0/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.0/umd/react-dom.production.min.js"></script>
import React,{useEffect,useState,} from "react";
import SideBar from '../components/SideBar'
import IdleMonitor from '../components/checkIdle'
import MenuBoletos from '../Boletos/MenuBoletos'
import DataGrid, {
  Column,
  Editing,
  RequiredRule,
  Paging,
  Selection,
  Lookup,
  Export
 
} from 'devextreme-react/data-grid';
import PrintButton from 'devextreme-react/button';
import DataSource from 'devextreme/data/data_source';

import ArrayStore from 'devextreme/data/array_store';
import { Button } from 'devextreme-react/button';

import { API, graphqlOperation } from 'aws-amplify';
import { createCondomino, updateCondomino,deleteCondomino} from '../graphql/mutations';
import { listCondominos,listUnidades } from '../graphql/queries';
import formatDate from '../components/formatDate'


async function fetchUsuarios() {
    try {
          const condominosData = await API.graphql(graphqlOperation(listCondominos));
         
          if(this.perfillogado==='1'){
            this.setState({condominos:condominosData.data.listCondominos.items})
          }else{
            this.setState({condominos:condominosData.data.listCondominos.items.filter(item=>item.unidade===this.unidadelogado )})
          }  
         
          
        } catch (err) {
          alert('Erro ao Carregar a Lista de moradores',err);
        }
 }

  const componentDidMount=()=>{
  fetchUnidades()
  fetchUsuarios()
 }

 
 async function fetchUnidades() {
 try {
         const unidadesData = await API.graphql(graphqlOperation(listUnidades));

         const unidadelist = unidadesData.data.listUnidades.items.filter(item=>item.unidade!==this.unidadelogado)
         this.state.unidades(unidadelist)     
       } catch (err) {
         alert('Erro ao Carregar a Lista de Unidades',err);
       }
 }


 async function addRecords(input) {
       
   try {
       const result = await API.graphql(graphqlOperation(createCondomino, { input }));
       const newTodo = result.data.createCondomino;
       
   } catch (error) {
     alert('Erro:Cadastrando ',error);
   }
 }

 const removeRecord = async id => {
  try {
      const input = { id };
      const result = await API.graphql(graphqlOperation(deleteCondomino, {input}));
     
      alert('Excluído com Sucesso ');
    } catch (err) {
      alert('Erro ao Excluir registro')
    };
};  


 async function updateRecords(input) {
  //alert('Estou aqui para alterar no banco')
  try {
      const result = await API.graphql(graphqlOperation(updateCondomino, { input }));
      const newTodo = result.data.updateCondomino;
  } catch (error) {
   alert('Erro:Cadastrando '+error);
  }
}



   
  async function  deleteRecords() {
    this.selectedItemKeys.forEach((key) => {
       
        removeRecord(key);
       
       
    });
    
    
  }

  function onRowValidating(e) {

   
    try{
       this.condominos.filter(item => item.id===e.oldData.id)
    }catch (error){    
      
        let nome=(e.newData.nome);
        let local=(e.newData.local);
        let unidade=(e.newData.unidade);
        let email=(e.newData.email);
        let telefone=(e.newData.telefone);
        let categoria=(e.newData.categoria);
        let perfil=('3');
        let dtEntrada=(e.newData.dtEntrada);
        let dtSaida=(e.newData.dtEntrada);
        let situacao=(e.newData.situacao);
        const input = {nome,unidade,local,categoria,situacao,dtSaida,dtEntrada,telefone,email,perfil};   
        addRecords(input)
        return
    
     }
         
         let id=(e.newData.id?e.newData.id:e.oldData.id);
         let nome=(e.newData.nome?e.newData.nome:e.oldData.nome);
         let local=(e.newData.local?e.newData.local:e.oldData.local);
         let unidade=(e.newData.unidade?e.newData.unidade:e.oldData.unidade);
         let email=(e.newData.email?e.newData.email:e.oldData.email);
         let telefone=(e.newData.telefone?e.newData.telefone:e.oldData.telefone);
         let categoria=(e.newData.categoria?e.newData.categoria:e.oldData.categoria);
         let perfil=(e.newData.perfil?e.newData.perfil:e.oldData.perfil);
         let dtEntrada=(e.newData.dtEntrada?e.newData.dtEntrada:e.oldData.dtEntrada);
         let dtSaida=(e.newData.dtSaida?e.newData.dtSaida:e.oldData.dtSaida);
         let situacao=(e.newData.situacao?e.newData.situacao:e.oldData.situacao);
         const input = {id,nome,unidade,local,categoria,situacao,dtSaida,dtEntrada,telefone,email,perfil};
       
         this.updateRecords(input);

    
         

  }

  
  
function selectionChanged(data) {
  console.log(data)
}



function handleRefreshModeChange(e) {
  console.log(e)
}

const PROP1 = (
  {
    id: 'Sim',
    nome: 'Sim',
  },
  {
    id: 'Não',
    nome: 'Não',
  },
  
);

const PROP2 = (
  {
    id: 'Inquilino',
    nome: 'Inquilino',
  },
  {
    id: 'Proprietário',
    nome: 'Proprietário',
  },
  {
    id: 'Funcionário',
    nome: 'Funcionário',
  },
  {
    id: 'Temporário',
    nome: 'Temporário',
  },
  
);

const PROP3 = (
  {
    id: '1',
    nome: 'Administrador',
  },
  {
    id: '2',
    nome: 'Sindico',
  },
  {
    id: '3',
    nome: 'Morador',
  },
  {
    id: '4',
    nome: 'Funcionario',
  },
  {
    id: '5',
    nome: 'Inquilino',
  },
  
);


 
function printScreen() {
 window.print();
}
 
class Usuarios extends React.Component {

  constructor(props) {
    super(props);
    this.state = {
      condominos: (),
      unidades:'',
     unidadelogado:localStorage.getItem('unidadelogado'),
     perfillogado: localStorage.getItem('perfillogado'),
     filename:'ListaUsuarios'+formatDate()+'.csv'

    };
    //this.onContentReady = this.onContentReady.bind(this);
  }


render(){
return (
 
      <div id="data-grid-demo"> 
         
       <SideBar/>
        <p></p>
        <p></p>
        <p></p>
        <p></p>
        <MenuBoletos/>
        {this.perfillogado==='1'?  
        <Button id="gridDeleteSelected"
          text="Excluir item selecionado"
          height={30}
          disabled={!this.selectedItemKeys.length}
          onClick={deleteRecords} />
          :null}
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <PrintButton icon="print"
            text="Print"
            onClick={printScreen}
          />
      
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          {/*}<ExportReactCSV csvData={condominos} fileName={filename} />{*/}
          <p></p>
          <p></p>

         
          
        
          <p> <b> Unidades</b></p>
          <DataGrid id="gridContainer"
          dataSource={this.condominos}
          keyExpr="id"
          showBorders={true}
          selectedRowKeys={this.selectedItemKeys}
          onSelectionChanged={selectionChanged}
          onRowValidating={onRowValidating}
          >
       <Export enabled={true}  allowExporting={true}/>
          
          <Selection mode="multiple" />
          <Paging enabled={false} />
         
              <Editing
                refreshMode={handleRefreshModeChange}
                mode="popup"
                allowUpdating={this.perfillogado==='1'?true:false}
                allowAdding={this.perfillogado==='1' || this.perfillogado==='2'?true:false}
            
              />
           

        
          <Column dataField="nome" caption="Nome"  width={150}>
         
          </Column>
          <Column dataField="shortname" caption="Nome Curto"  visible={false} width={90}>
          <RequiredRule />
          </Column>
          <Column dataField="local" caption="Local"  width={80} >
         
          </Column>
          <Column dataField="unidade" caption="Unidade" visible={false}  width={80} placeholder='Selecione'>
            <Lookup dataSource={this.unidades} valueExpr="codigo" displayExpr="nome"  />
            </Column>
          <Column dataField="email" caption="Email"   width={200}>
         
          </Column>
          <Column dataField="telefone" caption="Telefone"   width={100}>
       
          </Column>
          <Column dataField="categoria" caption="Categoria" visible={false} width={100} placeholder='Selecione'>
        
        
             <Lookup dataSource={PROP2} valueExpr="id" displayExpr="nome" />
          </Column>
          <Column dataField="situacao" caption="Residente?" visible={false}  width={100} placeholder='Selecione'>
         
     
             <Lookup dataSource={PROP1} valueExpr="id" displayExpr="nome" />
          </Column>
          <Column dataField="perfil" caption="Perfil"  visible={false}  width={80} placeholder='Selecione'>
       
             <Lookup dataSource={PROP3} valueExpr="id" displayExpr="nome" />
          </Column>
         
          <Column dataField="dtEntrada" caption="Data Entrada" visible={false}  dataType="date" format='dd/MM/yyyy'>
        
          </Column>
      
        


        

        </DataGrid>
    
        
      </div>
    );
  }
}

export default Usuarios