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
commit 11b0f0d103
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -1,6 +1,7 @@
{% extends "base.html" %}
{% from "components/icon.html" import Icon %}
{% from "components/alert.html" import Alert %}
{% block content %}
@ -68,56 +69,129 @@
</header>
<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'>
<label for='notes'>Comments <em>(optional)</em></label>
<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 class='usa-input'>
<label for='notes'>Notes</label>
<textarea id='notes' placeholder='Add notes or comments related to the approval or disapproval of this request.'/></textarea>
</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 class='form-row'>
<div class='form-col'>
<div class='usa-input'>
<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='form-col form-col--half'>
<div class='usa-input'>
<label for='mo-behalf-email'>Mission Owner e-mail</label>
<input id='mo-behalf-email' type='email' placeholder='i.e. name@mail.mil'/>
<label for='mo-behalf-email'>Mission Owner e-mail (optional)</label>
<input id='mo-behalf-email' type='email' placeholder='name@mail.mil'/>
</div>
<div class='usa-input'>
<label for='mo-behalf-phone'>Mission Owner phone number</label>
<input id='mo-behalf-phone' type='tel' placeholder='i.e. (123) 456-7890'/>
</div>
</div>
<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='form-col form-col--half'>
<div class='usa-input'>
<label for='ccpo-behalf-email'>CCPO e-mail</label>
<input id='ccpo-behalf-email' type='email' placeholder='i.e. name@mail.mil'/>
<label for='mo-behalf-phone'>Mission Owner phone number (optional)</label>
<input id='mo-behalf-phone' type='tel' placeholder='(123) 456-7890'/>
</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>
<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='usa-input'>
<label for='notes'>Internal Comments <em>(optional)</em></label>
<textarea id='notes' placeholder='Add notes or comments for internal CCPO reference.'/></textarea>
</div>
</div>
</div>
</div>
</section>
<section class='action-group'>
<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='icon-link'>
<a href='#' class='usa-button usa-button-big'>Approve Request</a>
<a href='#' class='usa-button usa-button-big usa-button-secondary'>Mark as Changes Requested</a>
<a href='#' class='icon-link'>
{{ Icon('x') }}
<span>Cancel</span>
</a>