From 0f0d9464d828c2ce3bcdd206e2fced73b91ee3e5 Mon Sep 17 00:00:00 2001 From: leigh-mil Date: Thu, 17 Oct 2019 17:14:30 -0400 Subject: [PATCH 1/9] Update styling for tables across the site --- styles/components/_portfolio_layout.scss | 24 +++++---- styles/elements/_panels.scss | 8 +-- styles/elements/_tables.scss | 52 +++++-------------- .../portfolios/fragments/members_edit.html | 7 ++- 4 files changed, 31 insertions(+), 60 deletions(-) diff --git a/styles/components/_portfolio_layout.scss b/styles/components/_portfolio_layout.scss index fea6cf20..658039bf 100644 --- a/styles/components/_portfolio_layout.scss +++ b/styles/components/_portfolio_layout.scss @@ -138,11 +138,6 @@ .portfolio-content { margin: (4 * $gap) $gap 0 $gap; - .panel { - @include shadow-panel; - padding-bottom: $gap * 3; - } - a.add-new-button { display: inherit; margin-left: auto; @@ -156,11 +151,6 @@ margin-bottom: 0; } - table { - min-width: 100%; - margin-top: 0; - } - input.usa-button.usa-button-primary { width: 9rem; height: 4rem; @@ -250,6 +240,20 @@ .panel { @include shadow-panel; padding-bottom: 2rem; + + table { + thead, + tbody { + tr { + th, + td { + &:last-child { + border-left: none; + } + } + } + } + } } .application-list-item { diff --git a/styles/elements/_panels.scss b/styles/elements/_panels.scss index b8d306cf..8ecd36c6 100644 --- a/styles/elements/_panels.scss +++ b/styles/elements/_panels.scss @@ -46,7 +46,6 @@ } @mixin shadow-panel { - padding: ($gap / 2) 0; box-shadow: $box-shadow; border-top: none; border-bottom: none; @@ -59,8 +58,7 @@ @include shadow-panel; &__content { - margin: ($gap * 2) 0; - padding: 0 ($gap * 2); + padding: $gap * 2; } &__body { @@ -110,8 +108,4 @@ &__footer { padding: 3 * $gap; } - - &__actions { - @include panel-actions; - } } diff --git a/styles/elements/_tables.scss b/styles/elements/_tables.scss index 89469512..cea5f829 100644 --- a/styles/elements/_tables.scss +++ b/styles/elements/_tables.scss @@ -6,7 +6,6 @@ table.atat-table { @include panel-margin; - min-width: 100%; @include ie-only { @@ -42,42 +41,24 @@ table.atat-table { } } + tbody, thead { - tr th { - .sorting-direction { - position: inherit; - margin-right: -16px; - width: 16px; - - .icon { - height: 14px; - width: 16px; - margin: 0; - } - } - } - } - - tbody { tr { th, td { - @include block-list-item; - + background-color: $color-white; + margin: 0; + padding: $gap * 2; + border: 1px solid $color-gray-light; display: table-cell; white-space: nowrap; - border-bottom-style: solid; - border-top: none; + + &:first-child { + border-left: none; + } &:last-child { - border-bottom-style: dashed; - } - } - - &:last-child { - td, - th { - border-bottom-style: solid; + border-right: none; } } } @@ -87,19 +68,12 @@ table.atat-table { tr { th, td { - @include block-list-header; - display: table-cell; - white-space: nowrap; - color: black; + background-color: $color-gray-lightest; + padding: 1rem 1.5rem; + border-top: none; } } } - - @at-root .panel #{&} { - &:last-child { - margin-bottom: 0; - } - } } .responsive-table-wrapper { diff --git a/templates/portfolios/fragments/members_edit.html b/templates/portfolios/fragments/members_edit.html index 8fb62f35..a297356f 100644 --- a/templates/portfolios/fragments/members_edit.html +++ b/templates/portfolios/fragments/members_edit.html @@ -30,10 +30,9 @@ {{ "portfolios.members.archive_button" | translate }} + {% if not ppoc %} + {{ subform.member_id() }} + {% endif %} - - {% if not ppoc %} - {{ subform.member_id() }} - {% endif %} {% endfor %} From f76fd0b567d7b2d1627a5f668c5a0404e1ee88ad Mon Sep 17 00:00:00 2001 From: leigh-mil Date: Mon, 21 Oct 2019 13:57:58 -0400 Subject: [PATCH 2/9] Move files into applications/fragments --- .../{ => applications}/fragments/environments.html | 0 templates/{ => applications}/fragments/members.html | 6 +++--- templates/applications/new/step_3.html | 13 ++++++------- templates/applications/settings.html | 4 ++-- 4 files changed, 11 insertions(+), 12 deletions(-) rename templates/{ => applications}/fragments/environments.html (100%) rename templates/{ => applications}/fragments/members.html (97%) diff --git a/templates/fragments/environments.html b/templates/applications/fragments/environments.html similarity index 100% rename from templates/fragments/environments.html rename to templates/applications/fragments/environments.html diff --git a/templates/fragments/members.html b/templates/applications/fragments/members.html similarity index 97% rename from templates/fragments/members.html rename to templates/applications/fragments/members.html index 823dcbc7..a138f88f 100644 --- a/templates/fragments/members.html +++ b/templates/applications/fragments/members.html @@ -12,9 +12,9 @@ new_member_form, action) %} -
+

{{ 'portfolios.applications.settings.team_members' | translate }} -

+ {% if g.matchesPath("application-members") %} {% include "fragments/flash.html" %} @@ -143,7 +143,7 @@ {% for env in member.environment_roles %} - {{ env.environment_name }}{% if not env == member.environment_roles[-1]%},{% endif %} + {{ env.environment_name }}
{% endfor %} diff --git a/templates/applications/new/step_3.html b/templates/applications/new/step_3.html index 94521d8b..3094c52e 100644 --- a/templates/applications/new/step_3.html +++ b/templates/applications/new/step_3.html @@ -2,7 +2,7 @@ {% extends "applications/base.html" %} -{% from "fragments/members.html" import MemberManagementTemplate with context %} +{% from "applications/fragments/members.html" import MemberManagementTemplate with context %} {% set secondary_breadcrumb = 'portfolios.applications.new_application_title' | translate %} {% block portfolio_header %} @@ -16,16 +16,16 @@ {{ ('portfolios.applications.new.step_3_description' | translate) }}

- + {{ MemberManagementTemplate( - application, + application, members, new_member_form, "applications.update_new_application_step_3") }} - + - + Return to Application Settings @@ -35,6 +35,5 @@ Cancel - -{% endblock %} +{% endblock %} diff --git a/templates/applications/settings.html b/templates/applications/settings.html index 15cee284..cb610743 100644 --- a/templates/applications/settings.html +++ b/templates/applications/settings.html @@ -2,8 +2,8 @@ {% from "components/alert.html" import Alert %} {% from "components/delete_confirmation.html" import DeleteConfirmation %} -{% from "fragments/environments.html" import EnvironmentManagementTemplate %} -{% from "fragments/members.html" import MemberManagementTemplate with context %} +{% from "applications/fragments/environments.html" import EnvironmentManagementTemplate with context %} +{% from "applications/fragments/members.html" import MemberManagementTemplate with context %} {% from "components/modal.html" import Modal %} {% from "components/pagination.html" import Pagination %} {% from "components/save_button.html" import SaveButton %} From 6ca08502ed553a7d4f5e30388d6f0f0bd8cc7bd7 Mon Sep 17 00:00:00 2001 From: leigh-mil Date: Tue, 22 Oct 2019 14:30:09 -0400 Subject: [PATCH 3/9] Import environments macro with context so you don't need to pass perms --- templates/applications/fragments/environments.html | 6 ++---- templates/applications/settings.html | 4 +--- 2 files changed, 3 insertions(+), 7 deletions(-) diff --git a/templates/applications/fragments/environments.html b/templates/applications/fragments/environments.html index 7b39f730..a4970fe2 100644 --- a/templates/applications/fragments/environments.html +++ b/templates/applications/fragments/environments.html @@ -6,9 +6,7 @@ {% macro EnvironmentManagementTemplate( application, environments_obj, - new_env_form, - user_can_create_environment -) %} + new_env_form) %}

{{ "portfolios.applications.settings.environments" | translate }}

@@ -94,7 +92,7 @@ {%- endif %} - {% if user_can_create_environment -%} + {% if user_can(permissions.CREATE_ENVIRONMENT) -%} {% include "applications/fragments/add_new_environment.html" %} {%- endif %}
diff --git a/templates/applications/settings.html b/templates/applications/settings.html index cb610743..6eaf3bbe 100644 --- a/templates/applications/settings.html +++ b/templates/applications/settings.html @@ -57,9 +57,7 @@ {{ EnvironmentManagementTemplate( application, environments_obj, - new_env_form, - user_can_create_environment=user_can(permissions.CREATE_ENVIRONMENT) - ) }} + new_env_form) }} {% if user_can(permissions.DELETE_APPLICATION) %} {% set env_count = application.environments | length %} From b1a18f83f33f8fa55ab818f46b38b77becd48ca0 Mon Sep 17 00:00:00 2001 From: leigh-mil Date: Mon, 21 Oct 2019 14:47:02 -0400 Subject: [PATCH 4/9] Update table border color --- styles/elements/_tables.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/styles/elements/_tables.scss b/styles/elements/_tables.scss index cea5f829..eec6279d 100644 --- a/styles/elements/_tables.scss +++ b/styles/elements/_tables.scss @@ -49,7 +49,7 @@ table.atat-table { background-color: $color-white; margin: 0; padding: $gap * 2; - border: 1px solid $color-gray-light; + border: 1px solid $color-gray-lighter; display: table-cell; white-space: nowrap; From 750ea6568b1f8aa4839f3d76547cae13268a9b32 Mon Sep 17 00:00:00 2001 From: leigh-mil Date: Mon, 21 Oct 2019 14:48:44 -0400 Subject: [PATCH 5/9] Add label macro --- static/icons/envelope.svg | 2 +- styles/elements/_labels.scss | 1 + templates/applications/fragments/environments.html | 3 ++- templates/applications/fragments/members.html | 3 ++- templates/components/label.html | 8 ++++++++ 5 files changed, 14 insertions(+), 3 deletions(-) create mode 100644 templates/components/label.html diff --git a/static/icons/envelope.svg b/static/icons/envelope.svg index a2557ef2..e0c6e57d 100644 --- a/static/icons/envelope.svg +++ b/static/icons/envelope.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/styles/elements/_labels.scss b/styles/elements/_labels.scss index 4dae377f..d36ae027 100644 --- a/styles/elements/_labels.scss +++ b/styles/elements/_labels.scss @@ -18,6 +18,7 @@ padding: 0 $gap; border-radius: $gap / 3; white-space: nowrap; + text-transform: uppercase; &--info { background-color: $color-primary; diff --git a/templates/applications/fragments/environments.html b/templates/applications/fragments/environments.html index a4970fe2..8ea06585 100644 --- a/templates/applications/fragments/environments.html +++ b/templates/applications/fragments/environments.html @@ -1,4 +1,5 @@ {% from "components/icon.html" import Icon %} +{% from "components/label.html" import Label %} {% from 'components/save_button.html' import SaveButton %} {% from "components/text_input.html" import TextInput %} {% from "components/toggle_list.html" import ToggleButton, ToggleSection %} @@ -51,7 +52,7 @@ }}
{% if env['pending'] -%} - {{Icon('exchange')}} CHANGES PENDING + {{ Label('exchange', 'Changes Pending', classes='label--below')}} {% else %} {{ "portfolios.applications.csp_link" | translate }} {{ Icon('link', classes="icon--tiny") }} diff --git a/templates/applications/fragments/members.html b/templates/applications/fragments/members.html index a138f88f..41ba6b94 100644 --- a/templates/applications/fragments/members.html +++ b/templates/applications/fragments/members.html @@ -1,5 +1,6 @@ {% from "components/alert.html" import Alert %} {% from "components/icon.html" import Icon %} +{% from "components/label.html" import Label %} {% import "applications/fragments/new_member_modal_content.html" as member_steps %} {% import "applications/fragments/member_form_fields.html" as member_fields %} {% from "components/modal.html" import Modal %} @@ -131,7 +132,7 @@
{% if member.role_status == 'pending' %} - INVITE PENDING + {{ Label('envelope', 'invite pending', 'success', classes='label--below') }} {% endif %} diff --git a/templates/components/label.html b/templates/components/label.html new file mode 100644 index 00000000..4fcd897f --- /dev/null +++ b/templates/components/label.html @@ -0,0 +1,8 @@ +{% from "components/icon.html" import Icon %} + +{% macro Label(icon_name, text, type=None, classes="") -%} + + + {{ Icon(icon_name) }} {{ text }} + +{%- endmacro %} From 176b9b4e2567ebf429cc90b0517b85ee5088f2df Mon Sep 17 00:00:00 2001 From: leigh-mil Date: Mon, 21 Oct 2019 15:01:04 -0400 Subject: [PATCH 6/9] Final tweaks to the app members table --- styles/components/_portfolio_layout.scss | 12 ++----- styles/elements/_tables.scss | 1 + templates/applications/fragments/members.html | 31 ++++++++++--------- 3 files changed, 20 insertions(+), 24 deletions(-) diff --git a/styles/components/_portfolio_layout.scss b/styles/components/_portfolio_layout.scss index 658039bf..2ac9c75d 100644 --- a/styles/components/_portfolio_layout.scss +++ b/styles/components/_portfolio_layout.scss @@ -242,16 +242,8 @@ padding-bottom: 2rem; table { - thead, - tbody { - tr { - th, - td { - &:last-child { - border-left: none; - } - } - } + .form-row { + margin: 0; } } } diff --git a/styles/elements/_tables.scss b/styles/elements/_tables.scss index eec6279d..1086215b 100644 --- a/styles/elements/_tables.scss +++ b/styles/elements/_tables.scss @@ -52,6 +52,7 @@ table.atat-table { border: 1px solid $color-gray-lighter; display: table-cell; white-space: nowrap; + vertical-align: top; &:first-child { border-left: none; diff --git a/templates/applications/fragments/members.html b/templates/applications/fragments/members.html index 41ba6b94..4c758178 100644 --- a/templates/applications/fragments/members.html +++ b/templates/applications/fragments/members.html @@ -118,7 +118,6 @@ Member Application Permissions Environment Access - @@ -143,19 +142,23 @@ {% endfor %} - {% for env in member.environment_roles %} - {{ env.environment_name }}
- {% endfor %} - - - {% if member.role_status == 'pending' -%} - {% set revoke_invite_modal = "revoke_invite_{}".format(member.role_id) %} - {% set resend_invite_modal = "resend_invite-{}".format(member.role_id) %} - Resend Invite
- {% if user_can(permissions.DELETE_APPLICATION_MEMBER) -%} - {{ 'invites.revoke' | translate }} - {%- endif %} - {%- endif %} +
+
+ {% for env in member.environment_roles %} + {{ env.environment_name }}
+ {% endfor %} +
+
+ {% if member.role_status == 'pending' -%} + {% set revoke_invite_modal = "revoke_invite_{}".format(member.role_id) %} + {% set resend_invite_modal = "resend_invite-{}".format(member.role_id) %} + Resend Invite
+ {% if user_can_delete_app_member -%} + {{ 'invites.revoke' | translate }} + {%- endif %} + {%- endif %} +
+
{% endfor %} From f71f2c91fb66180c8bbaf7d84ba77d15512697dc Mon Sep 17 00:00:00 2001 From: leigh-mil Date: Mon, 21 Oct 2019 15:23:57 -0400 Subject: [PATCH 7/9] Update app members blank slate and section header text --- templates/applications/fragments/members.html | 63 ++++++------------- translations.yaml | 9 +-- 2 files changed, 23 insertions(+), 49 deletions(-) diff --git a/templates/applications/fragments/members.html b/templates/applications/fragments/members.html index 4c758178..a04df7b8 100644 --- a/templates/applications/fragments/members.html +++ b/templates/applications/fragments/members.html @@ -24,33 +24,11 @@
{% if not application.members %}
-

{{ ("portfolios.applications.team_settings.blank_slate.title" | translate) }}

- - {{ Icon('avatar') }} - - {% if not user_can(permissions.CREATE_APPLICATION_MEMBER) %} -

{{ ("portfolios.applications.team_settings.blank_slate.sub_message" | translate) }}

- {% endif %} - - {% if user_can(permissions.CREATE_APPLICATION_MEMBER) %} - {% set new_member_modal_name = "add-app-mem" %} - - {{ "portfolios.applications.team_settings.blank_slate.action_label" | translate }} - - {{ MultiStepModalForm( - name=new_member_modal_name, - form=new_member_form, - form_action=url_for(action, application_id=application.id), - steps=[ - member_steps.MemberStepOne(new_member_form), - member_steps.MemberStepTwo(new_member_form, application) - ], - ) }} - {% endif %} +

+ {{ ("portfolios.applications.members.blank_slate" | translate) }} +

- {% else %} - {% set new_member_modal_name = "add-app-mem" %} {% for member in members %} {%- if user_can(permissions.EDIT_APPLICATION_MEMBER) %} @@ -115,7 +93,7 @@ - + @@ -164,26 +142,25 @@ {% endfor %}
MemberName Application Permissions Environment Access
- {% if user_can(permissions.CREATE_APPLICATION_MEMBER) %} - - {{ "portfolios.applications.add_member" | translate }} - - {% endif %}
- - {% if user_can(permissions.CREATE_APPLICATION_MEMBER) %} - {{ MultiStepModalForm( - name=new_member_modal_name, - form=new_member_form, - form_action=url_for(action, application_id=application.id), - steps=[ - member_steps.MemberStepOne(new_member_form), - member_steps.MemberStepTwo(new_member_form, application) - ], - ) }} - {% endif %} {% endif %} + {% if user_can(permissions.CREATE_APPLICATION_MEMBER) %} + {% set new_member_modal_name = "add-app-mem" %} + + {{ "portfolios.applications.add_member" | translate }} + + + {{ MultiStepModalForm( + name=new_member_modal_name, + form=new_member_form, + form_action=url_for(action, application_id=application.id), + steps=[ + member_steps.MemberStepOne(new_member_form), + member_steps.MemberStepTwo(new_member_form, application) + ], + ) }} + {% endif %} {% endmacro %} diff --git a/translations.yaml b/translations.yaml index 7ff39092..b3c5a0a4 100644 --- a/translations.yaml +++ b/translations.yaml @@ -310,7 +310,7 @@ portfolios: applications: add_application_text: Add a new application add_environment: Create an Environment - add_member: Add a New Team Member + add_member: Add Team Member add_another_environment: Add another environment app_settings_text: App settings new: @@ -376,13 +376,9 @@ portfolios: settings_heading: Application Settings settings: name_description: Application name and description - team_members: Team Members + team_members: Application Team environments: Application Environments team_settings: - blank_slate: - action_label: Invite a new team member - sub_message: Please contact your JEDI Cloud portfolio administrator to invite new members. - title: There are currently no team members for this application. environments: Environments section: table: @@ -394,6 +390,7 @@ portfolios: add_to_environment: Add to existing environment team_text: Team members: + blank_slate: This Application has no members form: env_mgmt: label: Manage Environments From 14fcef8c87a72c6f642605bfd7370d0aa41ba22e Mon Sep 17 00:00:00 2001 From: leigh-mil Date: Tue, 22 Oct 2019 13:38:47 -0400 Subject: [PATCH 8/9] Delete redundant css --- styles/components/_portfolio_layout.scss | 76 ------------------------ styles/sections/_application_list.scss | 24 -------- styles/sections/_reports.scss | 1 - templates/applications/settings.html | 3 +- 4 files changed, 1 insertion(+), 103 deletions(-) diff --git a/styles/components/_portfolio_layout.scss b/styles/components/_portfolio_layout.scss index 2ac9c75d..2b4f4358 100644 --- a/styles/components/_portfolio_layout.scss +++ b/styles/components/_portfolio_layout.scss @@ -415,82 +415,6 @@ padding: 2 * $gap; padding-top: 0; } - - table { - thead { - th:first-child { - padding-left: 3 * $gap; - } - } - - th { - background-color: $color-gray-lightest; - padding: $gap 2 * $gap; - border-top: none; - border-bottom: none; - color: $color-gray; - - .icon { - margin-left: 1rem; - } - } - - td { - border-bottom: 1px solid $color-gray-lightest; - } - - td.unused-balance { - color: $color-red; - } - - .label--expired { - background-color: $color-gray-light; - } - - .to-performance-period { - display: flex; - flex-wrap: wrap; - - .to-end-date { - margin-right: 1.2rem; - } - - &.to-expiring-soon { - .to-expiration-alert { - font-weight: $font-bold; - font-size: 1.5rem; - word-break: normal; - white-space: normal; - - .icon { - margin-left: 0; - } - } - - &.funded .to-expiration-alert { - color: $color-blue; - - .icon { - @include icon-color($color-blue); - } - } - - &.unfunded { - .to-expiration-alert { - color: $color-red; - } - - .icon { - @include icon-color($color-red); - } - - .to-end-date { - color: $color-red; - } - } - } - } - } } .portfolio-reports { diff --git a/styles/sections/_application_list.scss b/styles/sections/_application_list.scss index 8ab14f0a..8b5bfa94 100644 --- a/styles/sections/_application_list.scss +++ b/styles/sections/_application_list.scss @@ -37,28 +37,4 @@ left: 4px; } } - - table { - thead { - td { - font-weight: bold; - font-size: 1.4rem; - border-top: 0; - } - } - - tbody { - th { - font-weight: bold; - font-size: 1.6rem; - } - - td { - font-size: 1.6rem; - border-bottom: 1px solid $color-gray-lightest; - border-top: 0; - padding: (3 * $gap) (2 * $gap); - } - } - } } diff --git a/styles/sections/_reports.scss b/styles/sections/_reports.scss index 27a1564e..a53e2842 100644 --- a/styles/sections/_reports.scss +++ b/styles/sections/_reports.scss @@ -212,7 +212,6 @@ table { th, td { font-weight: bold; - border-bottom: 1px solid $color-gray-lightest; } } diff --git a/templates/applications/settings.html b/templates/applications/settings.html index 6eaf3bbe..b3a79081 100644 --- a/templates/applications/settings.html +++ b/templates/applications/settings.html @@ -27,8 +27,7 @@ {% else %} - -
+

{{ "fragments.edit_application_form.explain" | translate }}

From 83967e6ed9fa84989a4336c53ee66d2b9384aa31 Mon Sep 17 00:00:00 2001 From: leigh-mil Date: Tue, 22 Oct 2019 14:30:34 -0400 Subject: [PATCH 9/9] Delete unused component and macro --- js/components/forms/multi_step_modal_form.js | 2 - js/components/selector.js | 117 ------------------ js/index.js | 2 - templates/components/selector.html | 98 --------------- .../portfolios/fragments/change_ppoc.html | 1 - 5 files changed, 220 deletions(-) delete mode 100644 js/components/selector.js delete mode 100644 templates/components/selector.html diff --git a/js/components/forms/multi_step_modal_form.js b/js/components/forms/multi_step_modal_form.js index 3ef31b81..968e20cb 100644 --- a/js/components/forms/multi_step_modal_form.js +++ b/js/components/forms/multi_step_modal_form.js @@ -2,7 +2,6 @@ import FormMixin from '../../mixins/form' import textinput from '../text_input' import optionsinput from '../options_input' import checkboxinput from '../checkbox_input' -import Selector from '../selector' import Modal from '../../mixins/modal' import toggler from '../toggler' @@ -14,7 +13,6 @@ export default { components: { toggler, Modal, - Selector, textinput, optionsinput, checkboxinput, diff --git a/js/components/selector.js b/js/components/selector.js deleted file mode 100644 index 06c1bc63..00000000 --- a/js/components/selector.js +++ /dev/null @@ -1,117 +0,0 @@ -import { VPopover } from 'v-tooltip' - -const SelectorInput = { - name: 'SelectorInput', - props: { - name: String, - value: String, - label: String, - description: String, - selected: Boolean, - handleChange: Function, - handleEnter: Function, - handleEsc: Function, - }, - - computed: { - id: function() { - return `${this.name}_${this.value}` - }, - }, - - methods: { - onChange: function(e) { - this.handleChange(this.value) - }, - - onEnter: function(e) { - this.handleEnter() - }, - - onEsc: function(e) { - this.handleEsc() - }, - }, -} - -export default { - name: 'selector', - - components: { - VPopover, - SelectorInput, - }, - - props: { - choices: Array, - defaultLabel: String, - initialErrors: Array, - initialChoice: { - type: String, - default: null, - }, - }, - - data: function() { - return { - value: this.initialChoice || null, - currentChoice: this.initialChoice || null, - showError: (this.initialErrors && this.initialErrors.length) || false, - usingKeyboard: false, - } - }, - - computed: { - label: function() { - if (this.value) { - const selectedChoice = this.choices.find(choice => { - return this.value === choice[0] - })[1] - return selectedChoice.name - } else { - return this.defaultLabel - } - }, - }, - - methods: { - change: function(value) { - this.value = value - this.showError = false - }, - - onShow: function() { - setTimeout(() => { - // timeout is a hack to make focus work in Chrome - const selected = this.$refs.choices.find(choice => choice.selected) - if (selected) { - selected.$refs.input[0].focus() - } else { - this.$refs.choices[0].$refs.input[0].focus() - } - }, 100) - }, - - enter: function() { - this.$refs.popover.hide() - }, - - esc: function() { - this.value = this.currentChoice - this.usingKeyboard = false - this.$refs.popover.hide() - }, - - handleEnterOption: function(e) { - this.change(e.target.value) - this.currentChoice = e.target.value - this.usingKeyboard = false - this.$refs.popover.hide() - }, - - handleButtonArrowDown: function(e) { - this.usingKeyboard = true - this.$refs.popover.show() - }, - }, -} diff --git a/js/index.js b/js/index.js index 575006d4..b1fbca9f 100644 --- a/js/index.js +++ b/js/index.js @@ -19,7 +19,6 @@ import ApplicationEnvironments from './components/forms/new_application/environm import MultiStepModalForm from './components/forms/multi_step_modal_form' import uploadinput from './components/upload_input' import Modal from './mixins/modal' -import selector from './components/selector' import BudgetChart from './components/charts/budget_chart' import SpendTable from './components/tables/spend_table' import LocalDatetime from './components/local_datetime' @@ -52,7 +51,6 @@ const app = new Vue({ poc, ApplicationNameAndDescription, ApplicationEnvironments, - selector, BudgetChart, SpendTable, LocalDatetime, diff --git a/templates/components/selector.html b/templates/components/selector.html deleted file mode 100644 index 1b0181a3..00000000 --- a/templates/components/selector.html +++ /dev/null @@ -1,98 +0,0 @@ -{% from "components/icon.html" import Icon %} - -{# expects a wtforms SelectField instance #} -{% macro Selector(field, default_label='Select an option') -%} - - - -
- - -
{{ field.label | striptags }}
- - {% if field.description %} -

- {{ field.description | safe }} -

- {% endif %} - - {{ Icon('alert',classes="icon-validation") }} - - - - - {{ Icon('alert',classes="icon-validation") }} - - - - - - - -
- - -{%- endmacro %} diff --git a/templates/portfolios/fragments/change_ppoc.html b/templates/portfolios/fragments/change_ppoc.html index eef989cc..7500e20d 100644 --- a/templates/portfolios/fragments/change_ppoc.html +++ b/templates/portfolios/fragments/change_ppoc.html @@ -1,5 +1,4 @@ {% from "components/icon.html" import Icon %} -{% from "components/selector.html" import Selector %} {% from "components/text_input.html" import TextInput %} {% from "components/multi_step_modal_form.html" import MultiStepModalForm %} {% from "components/alert.html" import Alert %}