Merge pull request #246 from dod-ccpo/ui/request-approval

UI/request approval
This commit is contained in:
dandds
2018-09-05 15:50:33 -04:00
committed by GitHub

View File

@@ -1,6 +1,7 @@
{% extends "base.html" %} {% extends "base.html" %}
{% from "components/icon.html" import Icon %} {% from "components/icon.html" import Icon %}
{% from "components/alert.html" import Alert %}
{% block content %} {% block content %}
@@ -68,56 +69,129 @@
</header> </header>
<div class='panel__content'> <div class='panel__content'>
<p>Here is some good text explaining what the CCPO needs to do in order to approve the request. This text should also explain why we are asking for multiple people's names and the risk of boiling the ocean.</p>
<div class="form__sub-fields">
<h3>Instructions for the Requestor</h3>
Provide instructions or notes for additional information that is necessary to approve the request here. The requestor may then re-submit the updated request or initiate contact outside of AT-AT if further discussion is required. <b>These notes will be visible to the person making the JEDI request</b>.
<div class='usa-input'> <div class='usa-input'>
<label for='notes'>Notes</label> <label for='notes'>Comments <em>(optional)</em></label>
<textarea id='notes' placeholder='Add notes or comments related to the approval or disapproval of this request.'/></textarea> <textarea id='notes' placeholder='Add notes or comments explaining what changes are being requested or why further discussion is needed about this request.'/></textarea>
</div>
</div>
<div class="form-row">
<div class="form-col">
<h3>Authorizing Officials</h3>
<p>This section is not visible to the person making the request. It is only viewable by CCPO staff.</p>
<p>Provide the name of the key officials for both parties that have authorized this request to move forward.</p>
</div>
</div>
<h4 class="h3">Mission Authorizing Official</h4>
<div class='form-row'>
<div class='form-col form-col--half'>
<div class='usa-input'>
<label for='mo-behalf-fname'>First Name</label>
<input id='mo-behalf-fname' type='text' placeholder='First name of mission authorizing official' />
</div>
</div>
<div class='form-col form-col--half'>
<div class='usa-input'>
<label for='mo-behalf-lname'>Last Name</label>
<input id='mo-behalf-lname' type='text' placeholder='Last name of mission authorizing official'/>
</div>
</div>
</div> </div>
<div class='form-row'> <div class='form-row'>
<div class='form-col'>
<div class='usa-input'> <div class='form-col form-col--half'>
<label for='mo-behalf-name'>Mission Owner approval on behalf of</label>
<input id='mo-behalf-name' type='text' placeholder='Name of approving officer'/>
</div>
<div class='usa-input'> <div class='usa-input'>
<label for='mo-behalf-email'>Mission Owner e-mail</label> <label for='mo-behalf-email'>Mission Owner e-mail (optional)</label>
<input id='mo-behalf-email' type='email' placeholder='i.e. name@mail.mil'/> <input id='mo-behalf-email' type='email' placeholder='name@mail.mil'/>
</div> </div>
</div>
<div class='form-col form-col--half'>
<div class='usa-input'> <div class='usa-input'>
<label for='mo-behalf-phone'>Mission Owner phone number</label> <label for='mo-behalf-phone'>Mission Owner phone number (optional)</label>
<input id='mo-behalf-phone' type='tel' placeholder='i.e. (123) 456-7890'/> <input id='mo-behalf-phone' type='tel' placeholder='(123) 456-7890'/>
</div> </div>
</div> </div>
</div>
<h4 class="h3">CCPO Authorizing Official</h4>
<div class='form-row'>
<div class='form-col form-col--half'>
<div class='usa-input'>
<label for='ccpo-behalf-fname'>First Name</label>
<input id='ccpo-behalf-fname' type='text' placeholder='First name of CCPO authorizing official' />
</div>
</div>
<div class='form-col form-col--half'>
<div class='usa-input'>
<label for='ccpo-behalf-lname'>Last Name</label>
<input id='ccpo-behalf-lname' type='text' placeholder='Last name of CCPO authorizing official'/>
</div>
</div>
</div>
<h4 class="h3">CCPO Internal Notes</h4>
<p>You may add additional comments and notes for internal CCPO reference and follow-up here.</p>
<div class='form-row'>
<div class='form-col'> <div class='form-col'>
<div class='usa-input'>
<label for='ccpo-behalf-name'>CCPO approval on behalf of</label>
<input id='ccpo-behalf-name' type='text' placeholder='Name of approving officer'/>
</div>
<div class='usa-input'> <div class='usa-input'>
<label for='ccpo-behalf-email'>CCPO e-mail</label> <label for='notes'>Internal Comments <em>(optional)</em></label>
<input id='ccpo-behalf-email' type='email' placeholder='i.e. name@mail.mil'/> <textarea id='notes' placeholder='Add notes or comments for internal CCPO reference.'/></textarea>
</div> </div>
<div class='usa-input'>
<label for='ccpo-behalf-phone'>CCPO phone number</label>
<input id='ccpo-behalf-phone' type='tel' placeholder='i.e. (123) 456-7890'/>
</div>
</div> </div>
</div> </div>
</div> </div>
</section> </section>
<section class='action-group'> <section class='action-group'>
<a href='/' class='usa-button usa-button-big'>Approve Request</a> <a href='#' class='usa-button usa-button-big'>Approve Request</a>
<a href='/' class='usa-button usa-button-big usa-button-secondary'>Deny Request</a> <a href='#' class='usa-button usa-button-big usa-button-secondary'>Mark as Changes Requested</a>
<a href='/' class='icon-link'> <a href='#' class='icon-link'>
{{ Icon('x') }} {{ Icon('x') }}
<span>Cancel</span> <span>Cancel</span>
</a> </a>