一、彩票系統

1.1 欄位

• 彩票管理者，負責彩票的開獎與退訂
• 彩民池，參與買彩票的玩家
• 當前期數，指的是彩票是第幾期

二、代碼實作

2.1 remix端代碼實作

pragma solidity ^0.4.26;
contract lottory{
    //彩票管理者
    address public admin;
    //參與玩家
    address[] public players;
    //彩票期數
    uint public round;
    //合約部署者
    constructor() public {
        admin = msg.sender;
    }
    //參與買彩票
    function play()  public  payable{
        require(msg.value == 1 ether);
        players.push(msg.sender);
    }
    //獲取當前合約的余額
    function getBalance() public view returns(uint256){
        return address(this).balance;
    }
    //獲取當前參與的人數
    function getPlayers() public view returns (address[]){
        return players;
    }
}

2.2 投注函式

• 投注函式
  參與者參與購買彩票，然后將參與者加入彩民池中
• 開獎函式

2.3 開獎函式

• 從參與者中隨機選擇一位參與者，方法是:對(當前時間，參與者人數，挖礦難度)作哈希，然后對參與人數求余
• 將合約中的錢9成轉給中獎者，剩下的一成轉給參與者
• 期數加1，保存本期中獎者，且清空此次參與人的資訊，即清空players

function lucky() public {
        bytes memory v1 = abi.encodePacked(block.timestamp, block.difficulty,players.length);
        bytes32 res = keccak256(v1);
        uint256 index = uint256(res) % players.length;
        lucky = players[index];
        uint256 contractMoney = address(this).balance;
        uint256 money1 = contractMoney / 100 * 90;
        uint256 money2 = contractMoney / 100 * 10;
        lucky.transfer(money1);
        admin.transfer(money2);
        round ++;
        delete(players);
    }

2.4 退獎函式

• 遍歷獎池陣列，給每個參與者退回參與資金
• 洗掉彩民池

  function reject() onlymanager public{
        for (uint256 i = 0; i < players.length; i++){
            players[i].transfer(1 ether);
        }
        delete players;
    }

三、前端頁面實作

3.1 react腳手架搭建

• 安裝腳手架

npm install create-react-app

• 創建react專案

create-react-app lottery-pro

• 啟動專案

npn run start

3.2 獲取用戶的metamask的provider

let Web3 = require('web3')
let web3 = new Web3()
//這里的provider是用戶自己的provider,好比用戶自己的卡,我們提供手機
web3.setProvider('http//localhost:7545')
//window.web3.currentProvider已經被deprecated,暫時還未找到替代的
console.log(web3.currentProvider)
module.exports = web3

3.3 簡單頁面的實作

• app.js

import React from 'react';
import Show from "./showMsg";
//let web3 = require('./utils/initweb3')
//let contractInstance = require('./eth/lotteryInstance')
class App extends React.Component{
    constructor(){
        super()
        this.state = {
            admin:'kkkk',
            name:'jack',
            address: '西安'
        }
    }
    componentDidMount(){

    }
    async componentWillAmount(){
        //let myadmin =  await contractInstance.methods.admin().call()
        this.setState({
            name:'jack',
            admin:'admin'
        })
    }
    render() {
        return (
            <div>
                <Show name ={this.state.name} admin = {this.state.admin}/>
                <p>address = {this.state.address}</p>
            </div>
        );
    }
}
export default App;

• index.js

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';

ReactDOM.render(
  <React.StrictMode>
    <App/>
  </React.StrictMode>,
  document.getElementById('root')
);

3.4 資料在不同組件中的傳播

• 通過props傳播
  app.js中的內容:

 <div>
                <Show name ={this.state.name} admin = {this.state.admin}/>
                <p>address = {this.state.address}</p>
            </div>

showMsg.js

3.5不做了