mirror of
https://github.com/hyperledger/fabric-samples.git
synced 2026-06-23 01:55:10 +00:00
149 lines
No EOL
5.1 KiB
HTML
149 lines
No EOL
5.1 KiB
HTML
<!-- SPDX-License-Identifier: Apache-2.0 -->
|
|
|
|
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Hyperledger Fabric v1.4 Transactions POC</title>
|
|
<link rel="icon" href="favicon.png" type="image/gif">
|
|
|
|
<!-- require jquery and bootstrap scripts -->
|
|
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
|
|
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
|
|
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>
|
|
|
|
<!-- adding style here -->
|
|
<style type="text/css">
|
|
header{
|
|
background-color: lightgray;
|
|
font-size:20px;
|
|
padding:15px;
|
|
}
|
|
header, .form-group{
|
|
margin-bottom: 3%;
|
|
}
|
|
.form-group{
|
|
width:50%;
|
|
}
|
|
#body{
|
|
margin-left:3%;
|
|
margin-right:3%;
|
|
}
|
|
.form-control{
|
|
margin: 8px;
|
|
}
|
|
#right_header{
|
|
width:20%;
|
|
font-size:15px;
|
|
margin-right:0px;
|
|
}
|
|
#left_header{
|
|
margin-left:0;
|
|
width:40%;
|
|
display:inline-block;
|
|
}
|
|
#id {
|
|
width:49%;
|
|
display: inline-block;
|
|
}
|
|
table {
|
|
font-family: arial, sans-serif;
|
|
border-collapse: collapse;
|
|
width: 100%;
|
|
}
|
|
td, th {
|
|
border: 1px solid #dddddd;
|
|
text-align: left;
|
|
padding: 8px;
|
|
}
|
|
tr:nth-child(even) {
|
|
background-color: #dddddd;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body ng-app="application" ng-controller="appController">
|
|
<header>
|
|
<div id="left_header">Hyperledger Fabric v1.4 Transactions POC</div>
|
|
</header>
|
|
|
|
<div id="body">
|
|
<div class="form-group">
|
|
<a href="transaction_flow.PNG" target="_blank">
|
|
<img src="transaction_flow.PNG" style="width:100%">
|
|
</a>
|
|
<label>List all Fabric items in the Ledger</label>
|
|
<p><input id="queryAllProduce" type="submit" value="Query" class="btn btn-primary" ng-click="queryAllProduce()"></p>
|
|
</div>
|
|
|
|
<table id="all_produce" class="table" align="center">
|
|
|
|
<tr>
|
|
<th>ProductID</th>
|
|
<th>Type</th>
|
|
<th>Size</th>
|
|
<th>Price</th>
|
|
<th>Owner</th>
|
|
</tr>
|
|
|
|
<tr ng-repeat="produce in all_produce">
|
|
<td>{{produce.ID}}</td>
|
|
<td>{{produce.Color}}</td>
|
|
<td>{{produce.Size}}</td>
|
|
<td>{{produce.AppraisedValue}}</td>
|
|
<td>{{produce.Owner}}</td>
|
|
</tr>
|
|
</table>
|
|
|
|
<div class="form-group">
|
|
<label>Query a Specific Fabric by ID</label><br>
|
|
<h5 style="color:red;margin-bottom:2%" id="error_query">Error: Please enter a valid Id</h5>
|
|
|
|
Enter an ID number: <input id="createName" class="form-control" type="text" placeholder="Ex: 3" ng-model="produce_id">
|
|
<input id="querySubmit" type="submit" value="Query" class="btn btn-primary" ng-click="queryProduce()">
|
|
</div>
|
|
|
|
<table id="query_produce" class="table" align="center">
|
|
|
|
<tr>
|
|
<th>ProductID</th>
|
|
<th>Type</th>
|
|
<th>Size</th>
|
|
<th>Price</th>
|
|
<th>Owner</th>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td>{{query_produce.ID}}</td>
|
|
<td>{{query_produce.Color}}</td>
|
|
<td>{{query_produce.Size}}</td>
|
|
<td>{{query_produce.AppraisedValue}}</td>
|
|
<td>{{query_produce.Owner}}</td>
|
|
</tr>
|
|
</table>
|
|
|
|
<div class="form-group">
|
|
<label>Create Produce Record</label>
|
|
<h5 style="color:green;margin-bottom:2%" id="success_create">Successfully added to Ledger!</h5>
|
|
<br>
|
|
Fabric id: <input class="form-control" type="text" placeholder="Ex: 6" ng-model="produce.assetID">
|
|
Type: <input class="form-control" type=text placeholder="Ex: Cotton" ng-model="produce.color">
|
|
Size: <input class="form-control" type=number step=1 ng-model="produce.size">
|
|
Price: <input class="form-control" type=number step=1 ng-model="produce.appraisedValue">
|
|
Owner name: <input class="form-control" type="text" placeholder="Ex: Alice" ng-model="produce.owner">
|
|
<input id="createSubmit" type="submit" value="Create" class="btn btn-primary" ng-click="recordProduce()">
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label>Change Product Owner</label><br>
|
|
<h5 style="color:green;margin-bottom:2%" id="success_holder">Successfully updated Ledger!</h5>
|
|
<h5 style="color:red;margin-bottom:2%" id="error_holder">Error: Please enter a valid Product Id</h5>
|
|
Enter the product ID to transfer ownership: <input class="form-control" name="assetSelect" placeholder="Ex: 1" ng-model="holder.assetID">
|
|
Enter the name of new owner: <input class="form-control" name="assetSelect" placeholder="Ex: Dalio" ng-model="holder.name">
|
|
<input id="transferSubmit" type="submit" value="Change" class="btn btn-primary" ng-click="changeHolder()">
|
|
</div>
|
|
|
|
</div>
|
|
</body>
|
|
<!-- requiring the angular page -->
|
|
<script type="text/javascript" src="app.js"> </script>
|
|
</html> |