Skip to content

Instantly share code, notes, and snippets.

@kshkong97

kshkong97/LoanList.htmlv2

Created August 10, 2020 20:50
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save kshkong97/4ef3208726df35c72ef2a518ab0de0ea to your computer and use it in GitHub Desktop.
Save kshkong97/4ef3208726df35c72ef2a518ab0de0ea to your computer and use it in GitHub Desktop.
Download ZIP
Raw
LoanList.htmlv2
@{
ViewBag.Title = "LoanList";
}
<h2>Admin Page</h2>
<html>
<style>
h2 {
font-family: Corbel;
}
table,
th,
td {
border: 1px solid black;
background-color: snow;
border-collapse: collapse;
}
body {
font-family: "Open Sans", sans-serif;
background-color: ghostwhite;
font-size: 15px;
}
input {
color: black;
background-color: ghostwhite;
margin: 15px;
}
div {
color: black;
}
#loanrequests {
background-color: #cae4f7;
color: black;
padding: 10px;
margin: 10px;
}
#CustomerDetails {
color: black;
background-color: #cae4f7;
padding: 10px;
margin: 10px;
}
#LoanForm {
color: white;
background-color: #2088ce;
width: 800;
padding: 10px;
margin: 20px;
}
.button {
background-color: #4caf50; /* Green */
border: none;
color: white;
padding: 10px 24px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 12px;
margin: 4px 2px;
transition-duration: 0.4s;
cursor: pointer;
}
.button {
background-color: white;
color: black;
border: 2px solid #008cba;
}
.button:hover {
background-color: #008cba;
color: ghostwhite;
}
label {
width: 150px;
display: inline-block;
text-align: right;
}
</style>
<body>
<div>
<h3 id="LoanForm">
Get all Loans
</h3>
<br /><br />
<b>
<button class="button" id="getAllLoans">Get all Loans</button>
<!-- Table to display loan -->
<table id="DisplayAllLoan">
<tr>
<th>Address</th>
<th>Loan Amount</th>
</tr>
</table>
</div>
<br>
<br>
<br>
<br>
</div>
<link rel="stylesheet" type="text/css" href="style18.css">
<br /><br /><br />
</b>
<div>
<h3 id="LoanForm">
Get Specific Loan Status (0 = Pending, 1 = Approved)
</h3>
<br /><br />
<b>
<label for="name"> Loan Status:</label>
<input type="text"
id="loanamount"
name="loanamount"
size="50" /><br /><br /><br />
<button class="button" id="LoanRequest">Get Loan</button>
<br /><br /><br />
</b>
</div>
<link rel="stylesheet" type="text/css" href="style18.css" />
<title>Front-End Blockchain</title>
<script src="https://cdn.jsdelivr.net/npm/web3@latest/dist/web3.min.js"></script>
<script>
let provider, Contract, address;
window.addEventListener("DOMContentLoaded", async () => {
try {
await ethereum.enable();
provider = new Web3(web3.currentProvider);
const abi = [
{
"inputs": [
{
"internalType": "address",
"name": "caddress",
"type": "address"
}
],
"name": "acceptLoan",
"outputs": [],
"stateMutability": "nonpayable",
"type": "function"
},
{
"inputs": [
{
"internalType": "uint256",
"name": "_loanamount",
"type": "uint256"
},
{
"internalType": "address",
"name": "caddress",
"type": "address"
}
],
"name": "LoanRequest",
"outputs": [],
"stateMutability": "nonpayable",
"type": "function"
},
{
"inputs": [
{
"internalType": "string",
"name": "_name",
"type": "string"
},
{
"internalType": "string",
"name": "_dob",
"type": "string"
},
{
"internalType": "string",
"name": "_nric",
"type": "string"
},
{
"internalType": "address",
"name": "_caddress",
"type": "address"
}
],
"name": "Registration",
"outputs": [],
"stateMutability": "nonpayable",
"type": "function"
},
{
"inputs": [],
"stateMutability": "nonpayable",
"type": "constructor"
},
{
"inputs": [
{
"internalType": "address",
"name": "caddress",
"type": "address"
}
],
"name": "VerifyCustomer",
"outputs": [],
"stateMutability": "nonpayable",
"type": "function"
},
{
"inputs": [
{
"internalType": "address",
"name": "",
"type": "address"
}
],
"name": "customers",
"outputs": [
{
"internalType": "string",
"name": "name",
"type": "string"
},
{
"internalType": "string",
"name": "dob",
"type": "string"
},
{
"internalType": "string",
"name": "nric",
"type": "string"
},
{
"internalType": "address",
"name": "caddress",
"type": "address"
},
{
"internalType": "bool",
"name": "verified",
"type": "bool"
},
{
"internalType": "uint256",
"name": "loanID",
"type": "uint256"
}
],
"stateMutability": "view",
"type": "function"
},
{
"inputs": [],
"name": "getAllLoans",
"outputs": [
{
"components": [
{
"internalType": "enum Project.LoanStatus",
"name": "loanStatus",
"type": "uint8"
},
{
"internalType": "address",
"name": "borrower",
"type": "address"
},
{
"internalType": "uint256",
"name": "loanamount",
"type": "uint256"
}
],
"internalType": "struct Project.Loan[]",
"name": "output",
"type": "tuple[]"
}
],
"stateMutability": "view",
"type": "function"
},
{
"inputs": [
{
"internalType": "address",
"name": "caddress",
"type": "address"
}
],
"name": "getCustomerDob",
"outputs": [
{
"internalType": "string",
"name": "",
"type": "string"
}
],
"stateMutability": "view",
"type": "function"
},
{
"inputs": [
{
"internalType": "address",
"name": "caddress",
"type": "address"
}
],
"name": "getCustomerName",
"outputs": [
{
"internalType": "string",
"name": "",
"type": "string"
}
],
"stateMutability": "view",
"type": "function"
},
{
"inputs": [
{
"internalType": "address",
"name": "caddress",
"type": "address"
}
],
"name": "getCustomerNric",
"outputs": [
{
"internalType": "string",
"name": "",
"type": "string"
}
],
"stateMutability": "view",
"type": "function"
},
{
"inputs": [
{
"internalType": "address",
"name": "caddress",
"type": "address"
}
],
"name": "getCustomerVerified",
"outputs": [
{
"internalType": "bool",
"name": "",
"type": "bool"
}
],
"stateMutability": "view",
"type": "function"
},
{
"inputs": [
{
"internalType": "enum Project.LoanStatus",
"name": "status",
"type": "uint8"
}
],
"name": "getLoansWithStatus",
"outputs": [
{
"components": [
{
"internalType": "enum Project.LoanStatus",
"name": "loanStatus",
"type": "uint8"
},
{
"internalType": "address",
"name": "borrower",
"type": "address"
},
{
"internalType": "uint256",
"name": "loanamount",
"type": "uint256"
}
],
"internalType": "struct Project.Loan[]",
"name": "outputs",
"type": "tuple[]"
}
],
"stateMutability": "view",
"type": "function"
},
{
"inputs": [
{
"internalType": "uint256",
"name": "",
"type": "uint256"
}
],
"name": "loans",
"outputs": [
{
"internalType": "enum Project.LoanStatus",
"name": "loanStatus",
"type": "uint8"
},
{
"internalType": "address",
"name": "borrower",
"type": "address"
},
{
"internalType": "uint256",
"name": "loanamount",
"type": "uint256"
}
],
"stateMutability": "view",
"type": "function"
}
]; // PUT ABI HERE0x247e0125472b6cd7ace3216ae9084323cc23320b
Contract = new provider.eth.Contract(
abi, "0xc48356B5765856079868D5E8Fd131F0bA2E79810"
);
document.querySelector("#caddress").value = ethereum.selectedAddress;
document.querySelector("#GetAddress").value =
ethereum.selectedAddress;
} catch (error) {
console.log({ error });
return alert("You need to enable Metamask to use this app.");
}
document.querySelector("#getAllLoans").addEventListener("click", () => {
console.log("test");
Contract.methods
.getAllLoans().call().then(function (result) {
markup = ""
console.log("test");
for (let i = 0; i < result.length; i++) { markup += "<tr><td>" + i + "</td><td>" + i + "</td></tr>" }
tableBody = document.querySelector("#DisplayAllLoan");
tableBody.append(markup);
console.log("in get all loans callback");
});
});
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment