Merge pull request #411 from dod-ccpo/phone-extensions

Add phone ext

templates/components/phone_input.html

@@ -0,0 +1,12 @@
+{% from "components/text_input.html" import TextInput %}
+
+{% macro PhoneInput(phone_number, phone_ext, placeholder_phone="") %}
+  <div class='phone-input'>
+      <div class='phone-input__phone'>
+        {{ TextInput(phone_number, placeholder=placeholder_phone, validation='usPhone') }}
+      </div>
+      <div class='phone-input__extension'>
+        {{ TextInput(phone_ext, validation='phoneExt')}}
+      </div>
+  </div>
+{%- endmacro %}

templates/fragments/edit_user_form.html

@@ -1,6 +1,7 @@
 {% from "components/text_input.html" import TextInput %}
 {% from "components/options_input.html" import OptionsInput %}
 {% from "components/date_input.html" import DateInput %}
+{% from "components/phone_input.html" import PhoneInput %}
 
 <form method="POST" action='{{ form_action }}'>
   {{ form.csrf_token }}
@@ -16,15 +17,8 @@
         </div>
       </div>
 
-      <div class='form-row'>
-        <div class='form-col form-col--half'>
-          {{ TextInput(form.email, validation='email') }}
-        </div>
-
-        <div class='form-col form-col--half'>
-          {{ TextInput(form.phone_number, validation='usPhone') }}
-        </div>
-      </div>
+      {{ TextInput(form.email, validation='email') }}
+      {{ PhoneInput(form.phone_number, form.phone_ext) }}
 
       {{ OptionsInput(form.service_branch) }}
       {{ OptionsInput(form.citizenship) }}

templates/requests/_review.html

@@ -102,7 +102,20 @@
 
   {{ DefinitionReviewField("Email Address", "information_about_you", "email_request") }}
 
-  {{ DefinitionReviewField("Phone Number", "information_about_you", "phone_number", filter="usPhone") }}
+  <div>
+    <dt>Phone Number</dt>
+    <dd>
+      {% if data.information_about_you.phone_number is not none %}
+        {{ data.information_about_you.phone_number }}
+      {% else %}
+        {{ RequiredLabel() }}
+      {% endif %}
+
+      {% if data.information_about_you.phone_ext %}
+        ext. {{ data.information_about_you.phone_ext }}
+      {% endif %}
+    </dd>
+  </div>
 
   {{ DefinitionReviewField("Service Branch or Agency", "information_about_you", "service_branch", filter="getOptionLabel", filter_args=[service_branches]) }}
 

templates/requests/approval.html

@@ -3,6 +3,7 @@
 {% from "components/icon.html" import Icon %}
 {% from "components/alert.html" import Alert %}
 {% from "components/text_input.html" import TextInput %}
+{% from "components/phone_input.html" import PhoneInput %}
 
 {% block content %}
 
@@ -112,7 +113,12 @@
                                 <h3 class='approval-log__log-item__header'>Mission Owner approval on behalf of:</h3>
                                 <span>{{ review.full_name_mao }}</span>
                                 <span>{{ review.email_mao }}</span>
-                                <span>{{ review.phone_mao }}</span>
+                                <span>
+                                  {{ review.phone_mao }}
+                                  {% if review.phone_ext_mao %}
+                                    ext. {{ review.phone_ext_mao }}
+                                  {% endif %}
+                                </span>
                               </div>
                             {% endif %}
 
@@ -197,15 +203,8 @@
                     </div>
                   </div>
 
-                  <div class='form-row'>
-                    <div class='form-col form-col--half'>
-                      {{ TextInput(review_form.email_mao, placeholder="name@mail.mil", validation='email') }}
-                    </div>
-
-                    <div class='form-col form-col--half'>
-                      {{ TextInput(review_form.phone_mao, placeholder="(123) 456-7890", validation='usPhone') }}
-                    </div>
-                  </div>
+                  {{ TextInput(review_form.email_mao, placeholder="name@mail.mil", validation='email') }}
+                  {{ PhoneInput(review_form.phone_mao, review_form.phone_ext_mao) }}
 
                   <hr />
 

templates/requests/screen-2.html

@@ -4,6 +4,7 @@
 {% from "components/text_input.html" import TextInput %}
 {% from "components/options_input.html" import OptionsInput %}
 {% from "components/date_input.html" import DateInput %}
+{% from "components/phone_input.html" import PhoneInput %}
 
 {% block heading %}
   Information About You
@@ -25,10 +26,8 @@
   <div class='form-col form-col--half'>{{ TextInput(f.lname_request) }}</div>
 </div>
 
-<div class='form-row'>
-  <div class='form-col form-col--half'>{{ TextInput(f.email_request, placeholder='e.g. jane@mail.mil', validation='email') }}</div>
-  <div class='form-col form-col--half'>{{ TextInput(f.phone_number, placeholder='e.g. (123) 456-7890', validation='usPhone') }}</div>
-</div>
+{{ TextInput(f.email_request, placeholder='e.g. jane@mail.mil', validation='email') }}
+{{ PhoneInput(f.phone_number, f.phone_ext, placeholder_phone='e.g. (123) 456-7890') }}
 
 <p>We want to collect the following information from you for security auditing and determining priviledged user access.</p>