| beccabroek | 309b5da | 2018-11-07 12:22:31 -0600 | [diff] [blame] | 1 | <loader loading="loading"></loader> | 
 | 2 | <div id="configuration-cert"> | 
 | 3 |   <div class="row column"> | 
 | 4 |     <h1>SSL certificates</h1> | 
 | 5 |   </div> | 
| miramurali23 | 5e8785d | 2019-06-10 15:09:27 -0500 | [diff] [blame] | 6 |   <div ng-repeat="certificate in certificates | filter:{isExpiring:true}" class="row column"> | 
| beccabroek | 309b5da | 2018-11-07 12:22:31 -0600 | [diff] [blame] | 7 |     <div class="small-12 alert alert-warning" role="alert"> | 
| miramurali23 | 219738d | 2019-08-15 16:22:06 -0400 | [diff] [blame] | 8 |       <icon file="icon-warning.svg" aria-hidden="true"></icon> | 
 | 9 |       The uploaded {{certificate.name}} is expiring in {{getDays(certificate.ValidNotAfter) === 0 ? 'less than one day!' : getDays(certificate.ValidNotAfter) | 
 | 10 |       + ' days!'}} Consider replacing it with a new certificate. | 
| beccabroek | 309b5da | 2018-11-07 12:22:31 -0600 | [diff] [blame] | 11 |     </div> | 
 | 12 |   </div> | 
 | 13 |   <div ng-repeat="certificate in certificates|filter:{isExpired:true}" class="row column"> | 
 | 14 |     <div class="small-12 alert alert-danger" role="alert"> | 
| Yoshie Muranaka | dbafdc5 | 2019-06-28 09:41:19 -0500 | [diff] [blame] | 15 |       <div class="icon__critical inline"></div> The uploaded {{certificate.name}} has expired! Consider replacing it with a new certificate. | 
| beccabroek | 309b5da | 2018-11-07 12:22:31 -0600 | [diff] [blame] | 16 |     </div> | 
 | 17 |   </div> | 
 | 18 |   <div class="row column"> | 
| miramurali23 | 5e8785d | 2019-06-10 15:09:27 -0500 | [diff] [blame] | 19 |     <button type="button" class="btn  btn-tertiary" ng-disabled="availableCertificateTypes.length === 0" ng-click="addCertificateModal=true"> | 
 | 20 |       <icon class="icon-add" file="icon-plus.svg"></icon> | 
| beccabroek | 309b5da | 2018-11-07 12:22:31 -0600 | [diff] [blame] | 21 |       Add new certificate | 
 | 22 |     </button> | 
| miramurali23 | 5e8785d | 2019-06-10 15:09:27 -0500 | [diff] [blame] | 23 |     <button type="button" class="btn btn-tertiary" ng-click="addCSRModal=true"> | 
 | 24 |       <icon class="icon-add" file="icon-plus.svg"></icon> | 
 | 25 |       Generate CSR | 
 | 26 |     </button> | 
| beccabroek | 309b5da | 2018-11-07 12:22:31 -0600 | [diff] [blame] | 27 |   </div> | 
 | 28 |   <div class="row column"> | 
 | 29 |     <div class="small-12 certificate__table"> | 
 | 30 |       <div class="table__row-header"> | 
 | 31 |         <div class="row column"> | 
 | 32 |           <div class="certificate__type-header"> | 
 | 33 |             Certificate | 
 | 34 |           </div> | 
| Zbigniew Kurzynski | c81cdd4 | 2019-07-25 11:52:15 +0200 | [diff] [blame] | 35 |           <div class="certificate__issue-header"> | 
 | 36 |             Issued by | 
 | 37 |           </div> | 
 | 38 |           <div class="certificate__issue-header"> | 
 | 39 |             Issued to | 
 | 40 |           </div> | 
| beccabroek | 309b5da | 2018-11-07 12:22:31 -0600 | [diff] [blame] | 41 |           <div class="certificate__date-header"> | 
 | 42 |             Valid from | 
 | 43 |           </div> | 
 | 44 |           <div class="certificate__status-header"> | 
 | 45 |           </div> | 
 | 46 |           <div class="certificate__date-header"> | 
 | 47 |             Valid until | 
 | 48 |           </div> | 
 | 49 |         </div> | 
 | 50 |       </div> | 
| miramurali23 | 5e8785d | 2019-06-10 15:09:27 -0500 | [diff] [blame] | 51 |       <div ng-if="certificates.length < 1" class="empty__logs">There have been no certificates added.</div> | 
| beccabroek | 309b5da | 2018-11-07 12:22:31 -0600 | [diff] [blame] | 52 |       <div ng-repeat="certificate in certificates"> | 
| miramurali23 | 5e8785d | 2019-06-10 15:09:27 -0500 | [diff] [blame] | 53 |         <certificate cert="certificate" reload="loadCertificates()" )></certificate> | 
| beccabroek | 309b5da | 2018-11-07 12:22:31 -0600 | [diff] [blame] | 54 |       </div> | 
 | 55 |     </div> | 
 | 56 |   </div> | 
 | 57 |   <section class="modal add__certificate__modal" aria-hidden="true" role="dialog" ng-class="{'active': addCertificateModal}"> | 
| miramurali23 | 5e8785d | 2019-06-10 15:09:27 -0500 | [diff] [blame] | 58 |     <form name="add__cert__form" id="add__cert__form" ng-class="{'submitted': submitted}"> | 
 | 59 |       <div class="modal__content"> | 
 | 60 |         <button class="certificate__close-modal" ng-click="addCertificateModal = false; add__cert__form.$setUntouched()"> | 
 | 61 |           <icon aria-hidden="true" file="icon-close.svg"> | 
 | 62 |         </button> | 
 | 63 |         <h2 class="page-header">Add new certificate</h2> | 
 | 64 |         <div class="row column add-certificate__section "> | 
| beccabroek | 309b5da | 2018-11-07 12:22:31 -0600 | [diff] [blame] | 65 |           <div class="small-12"> | 
| miramurali23 | 5e8785d | 2019-06-10 15:09:27 -0500 | [diff] [blame] | 66 |             <label for="cert__type">Certificate type</label> | 
 | 67 |             <select id="cert__type" name="cert__type" ng-model="newCertificate.selectedType" required> | 
 | 68 |               <option class="courier-bold" ng-value="">Select an option</option> | 
 | 69 |               <option class="courier-bold" ng-value="type" ng-repeat="type in availableCertificateTypes"> | 
| Yoshie Muranaka | dbafdc5 | 2019-06-28 09:41:19 -0500 | [diff] [blame] | 70 |                 {{type.name}}</option> | 
| miramurali23 | 5e8785d | 2019-06-10 15:09:27 -0500 | [diff] [blame] | 71 |             </select> | 
 | 72 |             <div ng-messages="add__cert__form.cert__type.$error" class="form-error" ng-class="{'visible' : add__cert__form.cert__type.$touched || submitted }"> | 
 | 73 |               <p ng-message="required">Field is required</p> | 
| beccabroek | 309b5da | 2018-11-07 12:22:31 -0600 | [diff] [blame] | 74 |             </div> | 
 | 75 |           </div> | 
 | 76 |         </div> | 
| miramurali23 | 5e8785d | 2019-06-10 15:09:27 -0500 | [diff] [blame] | 77 |         <div class="row column add-certificate__section"> | 
 | 78 |           <div class="small-12"> | 
 | 79 |             <label class="select__new-label" for="upload_cert_new">Certificate file</label> | 
 | 80 |           </div> | 
 | 81 |           <div class="row column file__upload add-certificate__section "> | 
 | 82 |             <label for='upload_cert_new'> | 
 | 83 |               <input name="upload_cert_new" id="upload_cert_new" type="file" file="newCertificate.file" class="hide" /> | 
 | 84 |               <span class="btn btn-secondary select__new-button">Choose file</span> | 
 | 85 |             </label> | 
 | 86 |           </div> | 
 | 87 |           <div class="row column add-certificate__section "> | 
 | 88 |             <div ng-if="newCertificate.file" class="small-7 file__name"> | 
 | 89 |               <span>{{newCertificate.file.name}}</span> | 
 | 90 |               <icon file="icon-close.svg" ng-if="newCertificate.file.name" ng-click="newCertificate.file = '';" class="float-right"></icon> | 
 | 91 |             </div> | 
 | 92 |           </div> | 
 | 93 |         </div> | 
 | 94 |       </div> | 
 | 95 |       <div class="modal__button-wrapper"> | 
 | 96 |         <button class="btn btn-secondary" ng-click="addCertificateModal = false; newCertificate={};add__cert__form.$setUntouched();">Cancel</button> | 
 | 97 |         <button class="btn btn-primary" ng-disabled="add__cert__form.$invalid || !newCertificate.file" ng-click="submitted = true; uploadCertificate();">Save</button> | 
 | 98 |       </div> | 
 | 99 |     </form> | 
| beccabroek | 309b5da | 2018-11-07 12:22:31 -0600 | [diff] [blame] | 100 |   </section> | 
| miramurali23 | 5e8785d | 2019-06-10 15:09:27 -0500 | [diff] [blame] | 101 |  | 
 | 102 |   <section class="modal add-csr__modal" aria-hidden="true" role="dialog" ng-class="{'active': addCSRModal}"> | 
 | 103 |     <!--Close button for displaying CSR Code, we need a close button within form to reset form validation correctly--> | 
 | 104 |     <button class="certificate__close-modal" ng-click="resetCSRModal();" ng-if="displayCSRCode==true"> | 
 | 105 |       <icon aria-hidden="true" file="icon-close.svg"> | 
 | 106 |     </button> | 
 | 107 |  | 
 | 108 |     <!-- CSR Code display content--> | 
 | 109 |  | 
 | 110 |     <div ng-if="displayCSRCode==true"> | 
 | 111 |       <h2 class="page-header">Certificate Signing Request (CSR)</h2> | 
 | 112 |       <div class="modal__content add-csr__container"> | 
 | 113 |         <span id="csrCode" class="add-csr__container-csr-code">{{csrCode}}</span> | 
 | 114 |       </div> | 
 | 115 |       <div class="modal__button-wrapper"> | 
 | 116 |         <button class="btn btn-secondary" clipboard text="csrCode" on-copied="copySuccess(event)" on-error="copyfailed(err)"> | 
 | 117 |           <span ng-if="!copied">Copy</span> | 
 | 118 |           <span ng-if="copied"> | 
 | 119 |             <icon aria-hidden="true" file="icon-check.svg"></icon> | 
 | 120 |             <span>Copied</span> | 
 | 121 |           </span> | 
 | 122 |         </button> | 
 | 123 |         <button class="btn btn-primary" ng-click="addCSRModal = false;"> | 
 | 124 |           <a ng-href="data:text/json;charset=utf-8,{{csrCode}}" download="csrCode.txt" class="add-csr__text-download"> | 
 | 125 |             Download</a> | 
 | 126 |         </button> | 
 | 127 |       </div> | 
 | 128 |  | 
 | 129 |     </div> | 
 | 130 |  | 
 | 131 |  | 
 | 132 |  | 
 | 133 |     <form name="add__csr__form" id="add__csr__form" novalidate ng-if="displayCSRCode==false"> | 
 | 134 |       <div class="modal__content add-csr__container"> | 
 | 135 |         <button class="certificate__close-modal" ng-click="resetCSRModal(); add__csr__form.$setUntouched()"> | 
 | 136 |           <icon aria-hidden="true" file="icon-close.svg"> | 
 | 137 |         </button> | 
 | 138 |         <h2 class="page-header">Generate a Certificate Signing Request (CSR)</h2> | 
 | 139 |         <div class="row"> | 
 | 140 |           <fieldset class="column medium-8 add-csr__section"> | 
 | 141 |             <legend class="add-csr__section-title">General</legend> | 
 | 142 |             <div class="row"> | 
 | 143 |               <div class="column medium-6"> | 
 | 144 |                 <label for="cert__type" class="add-csr__label">Certificate Type *</label> | 
 | 145 |                 <select class="add-csr__select" id="cert__type" name="cert__type" ng-model="newCSR.certificateCollection" required> | 
 | 146 |                   <option class="courier-bold" ng-value="default" ng-model="selectOption">Select an option</option> | 
| Yoshie Muranaka | dbafdc5 | 2019-06-28 09:41:19 -0500 | [diff] [blame] | 147 |                   <!-- Do not show CA certificate as an option. Only a certificate authority can generate a CA certificate (known as TrustStore Certificate in Redfish) --> | 
| miramurali23 | 219738d | 2019-08-15 16:22:06 -0400 | [diff] [blame] | 148 |                   <option class="courier-bold" ng-value="type" ng-repeat="type in allCertificateTypes" ng-if="type.Description !== 'TrustStore Certificate'"> | 
| Yoshie Muranaka | dbafdc5 | 2019-06-28 09:41:19 -0500 | [diff] [blame] | 149 |                     {{type.name}}</option> | 
| miramurali23 | 5e8785d | 2019-06-10 15:09:27 -0500 | [diff] [blame] | 150 |                 </select> | 
 | 151 |                 <div ng-messages="add__csr__form.cert__type.$error" class="form-error" ng-class="{'visible' : add__csr__form.cert__type.$touched}"> | 
 | 152 |                   <p ng-message="required">Field is required</p> | 
 | 153 |                 </div> | 
 | 154 |               </div> | 
 | 155 |               <div class="column medium-6"> | 
 | 156 |                 <label for="countryCode" class="add-csr__label">Country *</label> | 
 | 157 |                 <select class="add-csr__select" id="countryCode" name="countryCode" ng-model="newCSR.countryCode" required> | 
 | 158 |                   <option class="courier-bold" ng-value="" ng-model="selectOption">Select an option</option> | 
 | 159 |                   <option class="courier-bold" ng-value="country" ng-repeat="country in countryList">{{country.Name}} | 
 | 160 |                   </option> | 
 | 161 |                 </select> | 
 | 162 |                 <div ng-messages="add__csr__form.countryCode.$error" class="form-error" ng-class="{'visible' : add__csr__form.countryCode.$touched}"> | 
 | 163 |                   <p ng-message="required">Field is required</p> | 
 | 164 |                 </div> | 
 | 165 |               </div> | 
 | 166 |  | 
 | 167 |               <div class="column medium-6"> | 
 | 168 |                 <label for="state" class="add-csr__label">State *</label> | 
 | 169 |                 <input class="add-csr__input" ng-model="newCSR.state" type="text" id="state" name="state" required></input> | 
 | 170 |                 <div ng-messages="add__csr__form.state.$error" class="form-error" ng-class="{'visible' : add__csr__form.state.$touched}"> | 
 | 171 |                   <p ng-message="required">Field is required</p> | 
 | 172 |                 </div> | 
 | 173 |               </div> | 
 | 174 |  | 
 | 175 |               <div class="column medium-6"> | 
 | 176 |                 <label for="city" class="add-csr__label">City *</label> | 
 | 177 |                 <input class="add-csr__input" id="city" name="city" ng-model="newCSR.city" type="text" required></input> | 
 | 178 |                 <div ng-messages="add__csr__form.city.$error" class="form-error" ng-class="{'visible' : add__csr__form.city.$touched}"> | 
 | 179 |                   <p ng-message="required">Field is required</p> | 
 | 180 |                 </div> | 
 | 181 |               </div> | 
 | 182 |  | 
 | 183 |               <div class="column medium-6"> | 
 | 184 |                 <label for="companyName" class="add-csr__label">Company Name *</label> | 
 | 185 |                 <input class="add-csr__input" type="text" ng-model="newCSR.organization" id="companyName" name="companyName" required></input> | 
 | 186 |                 <div ng-messages="add__csr__form.companyName.$error" class="form-error" ng-class="{'visible' : add__csr__form.companyName.$touched}"> | 
 | 187 |                   <p ng-message="required">Field is required</p> | 
 | 188 |                 </div> | 
 | 189 |               </div> | 
 | 190 |  | 
 | 191 |               <div class="column medium-6"> | 
 | 192 |                 <label for="companyUnit" class="add-csr__label">Company Unit *</label> | 
 | 193 |                 <input class="add-csr__input" ng-model="newCSR.companyUnit" name="companyUnit" id="companyUnit" type="text" required></input> | 
 | 194 |                 <div ng-messages="add__csr__form.companyUnit.$error" class="form-error" ng-class="{'visible' : add__csr__form.companyUnit.$touched}"> | 
 | 195 |                   <p ng-message="required">Field is required</p> | 
 | 196 |                 </div> | 
 | 197 |               </div> | 
 | 198 |  | 
 | 199 |               <div class="column medium-6"> | 
 | 200 |                 <label for="commonName" class="add-csr__label">Common Name *</label> | 
 | 201 |                 <input class="add-csr__input" ng-model="newCSR.commonName" name="commonName" type="text" id="commonName" required></input> | 
 | 202 |                 <div ng-messages="add__csr__form.commonName.$error" class="form-error" ng-class="{'visible' : add__csr__form.commonName.$touched}"> | 
 | 203 |                   <p ng-message="required">Field is required</p> | 
 | 204 |                 </div> | 
 | 205 |               </div> | 
 | 206 |  | 
 | 207 |               <div class="column medium-6"> | 
 | 208 |                 <label for="challengePassword" class="add-csr__label">Challenge Password</label> | 
 | 209 |                 <input class="add-csr__input-no-validation" id="challengePassword" ng-model="newCSR.challengePassword" type="text"></input> | 
 | 210 |               </div> | 
 | 211 |  | 
 | 212 |               <div class="column medium-6"> | 
 | 213 |                 <label for="contactPerson" class="add-csr__label">Contact Person</label> | 
 | 214 |                 <input class="add-csr__input-no-validation" id="contactPerson" ng-model="newCSR.contactPerson" type="text"></input> | 
 | 215 |               </div> | 
 | 216 |  | 
 | 217 |               <div class="column medium-6"> | 
 | 218 |                 <label for="emailAddress" class="add-csr__label">Email Address</label> | 
 | 219 |                 <input class="add-csr__input-no-validation" id="emailAddress" ng-model="newCSR.emailAddress" type="text"></input> | 
 | 220 |               </div> | 
 | 221 |  | 
 | 222 |               <div class="column medium-6"> | 
 | 223 |                 <div> | 
 | 224 |                   <label id="alternate-name-label" for="alternateName" class="add-csr__label">Alternate Name</label> | 
 | 225 |                   <input class="add-csr__input-no-validation" ng-model="newCSR.firstAlternativeName" id="alternateName" name="alternativeName" | 
 | 226 |                     type="text"></input> | 
 | 227 |                 </div> | 
 | 228 |                 <div class="add-csr__additional-alt-names" ng-repeat="name in names"> | 
 | 229 |                   <input id="alternate-name-input-{{$index}}" aria-describedby="alternate-name-label" class="add-csr__input-no-validation" | 
 | 230 |                     ng-model="name.Value" type="text"></input> | 
 | 231 |                   <button aria-label="Delete alternate name field" aria-controls="alternate-name-input-{{$index}}" class="btn btn-tertiary add-csr__alt-name-delete-btn" | 
 | 232 |                     ng-click="deleteOptionalRow($index)" ng-disabled="multiSelected"> | 
 | 233 |                     <icon aria-hidden="true" file="icon-trashcan.svg"> | 
 | 234 |                   </button> | 
 | 235 |                 </div> | 
 | 236 |               </div> | 
 | 237 |  | 
 | 238 |               <div class="column medium-6"> | 
 | 239 |                 <button class="btn btn-tertiary add-csr__alt-name-add-btn" ng-click="addOptionalRow()"> | 
 | 240 |                   <icon file="icon-plus.svg"></icon> | 
 | 241 |                   Add another alternate name | 
 | 242 |                 </button> | 
 | 243 |               </div> | 
 | 244 |             </div> | 
 | 245 |           </fieldset> | 
 | 246 |  | 
 | 247 |           <fieldset class="column medium-4 add-csr__section add-csr__section--border "> | 
 | 248 |             <legend class="add-csr__section-title">Private key</legend> | 
 | 249 |             <div class="add-csr__container-private-key"> | 
 | 250 |               <div class="add-csr__content-private-key"> | 
 | 251 |                 <label for="keyPairAlgorithm" class="add-csr__label">Key Pair Algorithm *</label> | 
 | 252 |                 <select class="add-csr__select" ng-model="newCSR.keyPairAlgorithm" id="keyPairAlgorithm" name="keyPairAlgorithm" required> | 
 | 253 |                   <option class="courier-bold" ng-value="" ng-model="selectOption">Select an option</option> | 
 | 254 |                   <option class="courier-bold" ng-value="data" ng-repeat="data in keyPairAlgorithm">{{data}}</option> | 
 | 255 |                 </select> | 
 | 256 |                 <div ng-messages="add__csr__form.keyPairAlgorithm.$error" class="form-error" ng-class="{'visible' : add__csr__form.keyPairAlgorithm.$touched}"> | 
 | 257 |                   <p ng-message="required">Field is required</p> | 
 | 258 |                 </div> | 
 | 259 |  | 
 | 260 |                 <div ng-if="newCSR.keyPairAlgorithm == 'EC'"> | 
 | 261 |                   <label for="keyCurveId" class="add-csr__label">Key Curve ID</label> | 
 | 262 |                   <select class="add-csr__select" ng-model="newCSR.keyCurveId" id="keyCurveId" name="keyCurveId" required> | 
 | 263 |                     <option class="courier-bold" ng-value="">None</option> | 
 | 264 |                     <option class="courier-bold" ng-value="data" ng-repeat="data in keyCurveId">{{data}}</option> | 
 | 265 |                   </select> | 
 | 266 |                   <div ng-messages="add__csr__form.keyCurveId.$error" class="form-error" ng-class="{'visible' : add__csr__form.keyCurveId.$touched}"> | 
 | 267 |                     <p ng-message="required">Field is required</p> | 
 | 268 |                   </div> | 
 | 269 |                 </div> | 
 | 270 |  | 
 | 271 |  | 
 | 272 |                 <div ng-if="newCSR.keyPairAlgorithm =='RSA'"> | 
 | 273 |                   <label for="keyBitLength" class="add-csr__label">Key Bit Length *</label> | 
 | 274 |                   <select class="add-csr__select" ng-model="newCSR.keyBitLength" id="keyBitLength" name="keyBitLength" required> | 
 | 275 |                     <option class="courier-bold" ng-value="">Select an option</option> | 
 | 276 |                     <option class="courier-bold" ng-value="data" ng-repeat="data in keyBitLength">{{data}}</option> | 
 | 277 |                   </select> | 
 | 278 |                   <div ng-messages="add__csr__form.keyBitLength.$error" class="form-error" ng-class="{'visible' : add__csr__form.keyBitLength.$touched}"> | 
 | 279 |                     <p ng-message="required">Field is required</p> | 
 | 280 |                   </div> | 
 | 281 |                 </div> | 
 | 282 |  | 
 | 283 |               </div> | 
 | 284 |           </fieldset> | 
 | 285 |           </div> | 
 | 286 |         </div> | 
 | 287 |         <div class="modal__button-wrapper"> | 
 | 288 |           <button class="btn btn-secondary" ng-click="resetCSRModal();add__csr__form.$setUntouched();">Cancel</button> | 
 | 289 |           <button class="btn btn-primary" ng-click="csrSubmitted = true; getCSRCode();add__csr__form.$setUntouched();" ng-disabled="add__csr__form.$invalid">Generate CSR</button> | 
 | 290 |         </div> | 
 | 291 |       </div> | 
 | 292 |     </form> | 
 | 293 |   </section> | 
 | 294 |   <div class="modal-overlay" tabindex="-1" ng-class="{'active': addCertificateModal || addCSRModal}"></div> |