github.com/muhammedhassanm/blockchain@v0.0.0-20200120143007-697261defd4d/Decentralized-Energy-Composer-master/angular-app/src/app/UtilityCompany/UtilityCompany.component.html (about) 1 2 <div class="modal fade" id="addUtilityCompanyModal" tabindex="-1" role="dialog" aria-labelledby="addUtilityCompanyModalLabel"> 3 <div class="modal-dialog" role="document"> 4 <div class="modal-content"> 5 <div class="modal-header"> 6 <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> 7 <h4 class="modal-title" id="addUtilityCompanyModalLabel">Add UtilityCompany</h4> 8 </div> 9 <form [formGroup]="myForm"> 10 <div class="modal-body"> 11 <div class="form-group text-left"> 12 <label for="utilityID">Utility Company ID</label> 13 <input formControlName="utilityID" type="text" class="form-control"> 14 </div> 15 <div class="form-group text-left"> 16 <label for="name">Name</label> 17 <input formControlName="name" type="text" class="form-control"> 18 </div> 19 20 <div class="form-group text-left"> 21 <label for="coinsValue">Coins Balance</label> 22 <input formControlName="coinsValue" type="text" class="form-control"> 23 </div> 24 25 <div class="form-group text-left"> 26 <label for="energyValue">Energy Value</label> 27 <input formControlName="energyValue" type="text" class="form-control"> 28 </div> 29 30 <div class="form-group text-left"> 31 <label for="energyUnits">Energy Units</label> 32 33 <div> 34 <select name="energyUnits" formControlName="energyUnits"> 35 <option value="kwh">kWh</option> 36 </select> 37 </div> 38 </div> 39 40 </div> 41 <div class="modal-footer"> 42 <button (click)="addUtilityCompany(myForm);" type="submit" class="btn btn-success" data-dismiss="modal">Submit</button> 43 <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 44 </div> 45 </form> 46 </div> 47 </div> 48 </div> 49 50 51 <div class="modal fade" id="updateUtilityCompanyModal" tabindex="-1" role="dialog" aria-labelledby="updateUtilityCompanyModalLabel"> 52 <div class="modal-dialog" role="document"> 53 <div class="modal-content"> 54 <div class="modal-header"> 55 <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> 56 <h4 class="modal-title" id="updateUtilityCompanyModalLabel">Update Asset</h4> 57 </div> 58 <form [formGroup]="myForm"> 59 <div class="modal-body"> 60 <div class="form-group text-left"> 61 <label for="utilityID">utilityID</label> 62 <input [ngModel]="utilityID"formControlName="utilityID" type="text" class="form-control"> 63 </div> 64 <div class="form-group text-left"> 65 <label for="name">Name</label> 66 <input [ngModel]="name"formControlName="name" type="text" class="form-control"> 67 </div> 68 </div> 69 <div class="modal-footer"> 70 <button (click)="updateUtilityCompany(myForm)" type="submit" class="btn btn-success" data-dismiss="modal">Submit</button> 71 <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 72 </div> 73 </form> 74 </div> 75 </div> 76 </div> 77 78 79 80 <div class="modal fade" id="deleteUtilityCompanyModal" tabindex="-1" role="dialog" aria-labelledby="deleteUtilityCompanyModalLabel"> 81 <div class="modal-dialog" role="document"> 82 <div class="modal-content"> 83 <div class="modal-header"> 84 <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> 85 <h4 class="modal-title" id="deleteUtilityCompanyModalLabel">Delete Asset</h4> 86 </div> 87 <form [formGroup]="myForm" (ngSubmit)="deleteUtilityCompany()"> 88 <div class="modal-body"> 89 Are you sure you want to delete this asset? 90 </div> 91 <div class="modal-footer"> 92 <button (click)="deleteUtilityCompany()" type="submit" class="btn btn-danger" data-dismiss="modal">Yes</button> 93 <button type="button" class="btn btn-default" data-dismiss="modal">No</button> 94 </div> 95 </form> 96 </div> 97 </div> 98 </div> 99 100 101 102 103 104 105 <div class="container"> 106 <div *ngIf="errorMessage" class="alert alert-danger" role="alert"> 107 <strong>Error:</strong> {{errorMessage}} 108 </div> 109 <div class="row"> 110 <h1 class="heading">Utility Companies </h1> 111 </div><!-- /row --> 112 113 <div class="row"> 114 <div class="col-md-12 text-right"> 115 <button (click)="resetForm()" type="button" class="btn btn-primary" data-toggle="modal" data-target="#addUtilityCompanyModal">Add UtilityCompany</button> 116 </div> 117 </div> 118 <br> 119 <div class="row"> 120 <div class="col-md-12"> 121 <table class="table table-bordered table-responsive table-hover"> 122 <thead class="thead"> 123 <tr class="thead-cols"> 124 125 <th class="bc">ID</th> 126 127 <th class="bc">Name</th> 128 129 <th class="bc">Coins Balance</th> 130 131 <th class="bc">Energy Value</th> 132 133 <th class="bc">Energy Units</th> 134 135 <th class="bc">Actions</th> 136 </tr> 137 </thead> 138 <tbody> 139 <tr *ngFor="let utilityCompany of allUtilityCompanys"> 140 141 <td>{{utilityCompany.utilityID}}</td> 142 143 <td>{{utilityCompany.name}}</td> 144 145 <td>{{utilityCompany.coinsValue}}</td> 146 147 <td>{{utilityCompany.energyValue}}</td> 148 149 <td>{{utilityCompany.energyUnits}}</td> 150 151 <td> 152 153 <button (click)="getForm(utilityCompany.utilityID);" type="button" class="btn btn-success" data-toggle="modal" data-target="#updateUtilityCompanyModal">Update</button> 154 155 <button (click)="setId(utilityCompany.utilityID);" type="button" class="btn btn-danger" data-toggle="modal" data-target="#deleteUtilityCompanyModal">Delete</button> 156 157 </td> 158 </tr> 159 </tbody> 160 </table> 161 </div> 162 </div> 163 164 </div>