VotingSession.js 4.73 KB
Newer Older
timothe 2004's avatar
timothe 2004 committed
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154
import React, { useState, useEffect } from 'react';
import { ethers } from 'ethers';

const VotingSession = ({ 
  isVoter, 
  submitVote, 
  delegateVote,
  fetchVoterInfo,
  fetchProposals,
  currentStatus, 
  proposals,
  loading,
  voterInfo
}) => {
  const [selectedProposal, setSelectedProposal] = useState(null);
  const [delegateAddress, setDelegateAddress] = useState('');
  const [error, setError] = useState('');
  const [delegateError, setDelegateError] = useState('');

  useEffect(() => {
    if (isVoter && parseInt(currentStatus) >= 3) {
      fetchVoterInfo();
      fetchProposals();
    }
  }, [isVoter, currentStatus, fetchVoterInfo, fetchProposals]);

  const handleVote = () => {
    if (selectedProposal === null) {
      setError('Veuillez sélectionner une proposition');
      return;
    }
    
    setError('');
    submitVote(selectedProposal);
  };

  const handleDelegateVote = () => {
    if (!ethers.utils.isAddress(delegateAddress)) {
      setDelegateError('Adresse Ethereum invalide');
      return;
    }
    
    setDelegateError('');
    delegateVote(delegateAddress);
    setDelegateAddress('');
  };

  // Si l'utilisateur n'est pas un électeur ou si on n'est pas à la phase de vote
  if (!isVoter || parseInt(currentStatus) < 3) {
    return null;
  }

  // Si les votes sont comptabilisés et qu'il y a au moins une proposition
  if (parseInt(currentStatus) === 5 && proposals.length > 0) {
    // Trouver la proposition gagnante
    let winningProposalId = 0;
    let maxVotes = 0;
    
    proposals.forEach((proposal, index) => {
      if (parseInt(proposal.voteCount) > maxVotes) {
        maxVotes = parseInt(proposal.voteCount);
        winningProposalId = index;
      }
    });
    
    const winningProposal = proposals[winningProposalId];
    
    return (
      <div className="card">
        <h2>Résultat du vote</h2>
        <div className="winner-info">
          <h3>Proposition gagnante :</h3>
          <div className="proposal-item winner">
            <strong>Proposition #{winningProposalId}:</strong> {winningProposal.description}
            <div className="vote-count">
              <span>{winningProposal.voteCount} vote(s)</span>
            </div>
          </div>
        </div>
      </div>
    );
  }

  return (
    <div className="card">
      <h2>Session de vote</h2>
      
      {parseInt(currentStatus) === 3 && (
        <>
          {!voterInfo.hasVoted ? (
            <div className="voter-actions">
              <h3>Voter pour une proposition</h3>
              
              <ul className="proposal-list">
                {proposals.slice(1).map((proposal, index) => (
                  <li 
                    key={index + 1} 
                    className={`proposal-item ${selectedProposal === index + 1 ? 'selected' : ''}`}
                    onClick={() => setSelectedProposal(index + 1)}
                  >
                    <strong>Proposition #{index + 1}:</strong> {proposal.description}
                  </li>
                ))}
              </ul>
              
              {error && <p className="status error">{error}</p>}
              
              <div className="voting-buttons">
                <button
                  className="button"
                  onClick={handleVote}
                  disabled={loading || selectedProposal === null}
                >
                  {loading ? "Transaction en cours..." : "Voter"}
                </button>
                
                <div className="delegation-section">
                  <h4>Ou déléguer votre vote</h4>
                  <input
                    type="text"
                    className="input"
                    placeholder="Adresse Ethereum du délégué (0x...)"
                    value={delegateAddress}
                    onChange={(e) => setDelegateAddress(e.target.value)}
                  />
                  {delegateError && <p className="status error">{delegateError}</p>}
                  <button
                    className="button secondary"
                    onClick={handleDelegateVote}
                    disabled={loading || !delegateAddress}
                  >
                    {loading ? "Transaction en cours..." : "Déléguer le vote"}
                  </button>
                </div>
              </div>
            </div>
          ) : (
            <div className="already-voted">
              <p className="status success">Vous avez déjà voté pour la proposition #{voterInfo.votedProposalId}.</p>
            </div>
          )}
        </>
      )}
      
      {parseInt(currentStatus) === 4 && (
        <div className="waiting-results">
          <p>La session de vote est terminée. En attente du comptage des votes...</p>
        </div>
      )}
    </div>
  );
};

export default VotingSession;