Merge pull request #853 from dod-ccpo/nav-changes
Portfolio navigation changes
This commit is contained in:
richard-dds
GitHub
commit
783281fade
13
static/icons/applications.svg
Normal file
13
static/icons/applications.svg
Normal file
@ -0,0 +1,13 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="30px" height="30px" viewBox="0 0 30 30" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<!-- Generator: Sketch 55.1 (78136) - https://sketchapp.com -->
|
||||
<title>Combined Shape</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="Portfolio-Nav-/-Applications" transform="translate(-26.000000, 0.000000)" fill="#0071BC">
|
||||
<g id="Group-4">
|
||||
<path d="M41,30 C32.7157288,30 26,23.2842712 26,15 C26,6.71572875 32.7157288,0 41,0 C49.2842712,0 56,6.71572875 56,15 C56,23.2842712 49.2842712,30 41,30 Z M38.7142901,17.9107118 C38.7142901,17.5262247 38.4023478,17.2142824 38.0178607,17.2142824 L35.6964294,17.2142824 C35.3119423,17.2142824 35,17.5262247 35,17.9107118 L35,19.3035706 C35,19.6880577 35.3119423,20 35.6964294,20 L38.0178607,20 C38.4023478,20 38.7142901,19.6880577 38.7142901,19.3035706 L38.7142901,17.9107118 Z M38.7142901,14.1964217 C38.7142901,13.8119346 38.4023478,13.4999923 38.0178607,13.4999923 L35.6964294,13.4999923 C35.3119423,13.4999923 35,13.8119346 35,14.1964217 L35,15.5892805 C35,15.9737675 35.3119423,16.2857099 35.6964294,16.2857099 L38.0178607,16.2857099 C38.4023478,16.2857099 38.7142901,15.9737675 38.7142901,15.5892805 L38.7142901,14.1964217 Z M48.0000155,17.9107118 C48.0000155,17.5262247 47.6880732,17.2142824 47.3035861,17.2142824 L40.3392921,17.2142824 C39.954805,17.2142824 39.6428627,17.5262247 39.6428627,17.9107118 L39.6428627,19.3035706 C39.6428627,19.6880577 39.954805,20 40.3392921,20 L47.3035861,20 C47.6880732,20 48.0000155,19.6880577 48.0000155,19.3035706 L48.0000155,17.9107118 Z M38.7142901,10.4821315 C38.7142901,10.0976444 38.4023478,9.78570211 38.0178607,9.78570211 L35.6964294,9.78570211 C35.3119423,9.78570211 35,10.0976444 35,10.4821315 L35,11.8749903 C35,12.2594774 35.3119423,12.5714197 35.6964294,12.5714197 L38.0178607,12.5714197 C38.4023478,12.5714197 38.7142901,12.2594774 38.7142901,11.8749903 L38.7142901,10.4821315 Z M48.0000155,14.1964217 C48.0000155,13.8119346 47.6880732,13.4999923 47.3035861,13.4999923 L40.3392921,13.4999923 C39.954805,13.4999923 39.6428627,13.8119346 39.6428627,14.1964217 L39.6428627,15.5892805 C39.6428627,15.9737675 39.954805,16.2857099 40.3392921,16.2857099 L47.3035861,16.2857099 C47.6880732,16.2857099 48.0000155,15.9737675 48.0000155,15.5892805 L48.0000155,14.1964217 Z M48.0000155,10.4821315 C48.0000155,10.0976444 47.6880732,9.78570211 47.3035861,9.78570211 L40.3392921,9.78570211 C39.954805,9.78570211 39.6428627,10.0976444 39.6428627,10.4821315 L39.6428627,11.8749903 C39.6428627,12.2594774 39.954805,12.5714197 40.3392921,12.5714197 L47.3035861,12.5714197 C47.6880732,12.5714197 48.0000155,12.2594774 48.0000155,11.8749903 L48.0000155,10.4821315 Z" id="Combined-Shape"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.9 KiB |
13
static/icons/funding.svg
Normal file
13
static/icons/funding.svg
Normal file
@ -0,0 +1,13 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="30px" height="30px" viewBox="0 0 30 30" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<!-- Generator: Sketch 55.1 (78136) - https://sketchapp.com -->
|
||||
<title>Shape</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="Portfolio-Nav-/-Funding" transform="translate(-12.000000, 0.000000)" fill="#0071BC" fill-rule="nonzero">
|
||||
<g id="Group">
|
||||
<path d="M27,0 C18.7333333,0 12,6.73333333 12,15 C12,23.2666667 18.7333333,30 27,30 C35.2666667,30 42,23.2666667 42,15 C42,6.73333333 35.2666667,0 27,0 Z M29.5138284,20.9349809 C28.9570383,21.2107813 28.2731789,21.325742 27.589873,21.4089879 L27.5500151,23.6924464 C27.5406042,24.2315964 27.0789776,24.6359554 26.559629,24.6268901 C26.0078211,24.6172583 25.5936005,24.1658869 25.6024578,23.6584517 L25.6428693,21.3432785 C24.6718585,21.1677076 23.7360749,20.8341298 22.9664629,20.281382 C22.5175686,19.9563029 22.4307088,19.3520238 22.7624983,18.9453985 C23.0948413,18.5070584 23.7132286,18.4226793 24.1296635,18.7471919 C25.3157105,19.6244522 27.3903371,19.8192868 28.6343082,19.2382375 C29.354502,18.9018405 29.6890593,18.3366417 29.7028989,17.5437741 C29.7167384,16.7509066 28.910792,16.4195951 26.6463919,15.9359287 C24.5437347,15.48681 21.6967281,14.8978011 21.7459969,12.0751927 C21.7731225,10.5211723 22.5737351,9.29789683 24.0135691,8.65681758 C24.5698056,8.41273181 25.1893,8.2649233 25.839593,8.21282548 L25.8683793,6.563661 C25.8777902,6.02451107 26.3394168,5.62015206 26.8587654,5.62921732 C27.4105733,5.63884917 27.8247939,6.09022051 27.8159366,6.59765574 L27.7860432,8.31024962 C28.8544318,8.48752024 29.8534732,8.9173753 30.6544374,9.53411911 C31.0708723,9.85863165 31.1252729,10.4623441 30.7929298,10.9006842 C30.4611404,11.3073095 29.8427531,11.3916886 29.3944125,11.0348948 C28.3074041,10.06419 26.1695197,9.77307822 24.86063,10.3529944 C24.107977,10.6888248 23.7409603,11.253457 23.7265672,12.0780393 C23.7071918,13.1880538 24.7722589,13.5556127 27.0691183,14.0398456 C29.1393163,14.4883978 31.6952964,15.008878 31.6510098,17.5460542 C31.6568972,19.0689264 30.8892974,20.2610537 29.5138284,20.9349809 Z" id="Shape"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.3 KiB |
@ -14,57 +14,13 @@
|
||||
}
|
||||
}
|
||||
|
||||
.portfolio-breadcrumbs {
|
||||
margin-bottom: $gap * 2;
|
||||
color: $color-gray-dark;
|
||||
font-size: $h5-font-size;
|
||||
|
||||
.icon-link {
|
||||
color: $color-blue;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.icon--tiny {
|
||||
padding: $gap 0;
|
||||
}
|
||||
|
||||
.icon {
|
||||
@include icon-color($color-blue);
|
||||
margin: 0 ($gap * 0.5) 0 0;
|
||||
}
|
||||
|
||||
.portfolio-breadcrumbs__home {
|
||||
&.icon-link--disabled {
|
||||
color: $color-gray-dark;
|
||||
opacity: 1;
|
||||
.icon {
|
||||
@include icon-color($color-gray-dark);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.portfolio-breadcrumbs__crumb {
|
||||
.icon {
|
||||
@include icon-color($color-gray-medium);
|
||||
}
|
||||
|
||||
.icon-link {
|
||||
color: $color-gray-medium;
|
||||
pointer-events: none;
|
||||
&.icon-link--disabled {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.portfolio-header {
|
||||
flex-direction: column;
|
||||
@include media($small-screen) {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
margin: 2 * $gap;
|
||||
margin-bottom: $gap * 4;
|
||||
|
||||
.col--grow {
|
||||
overflow: inherit;
|
||||
@ -72,6 +28,10 @@
|
||||
|
||||
.portfolio-header__name {
|
||||
@include h1;
|
||||
h1 {
|
||||
margin: ($gap * 2) $gap ($gap * 2) $gap;
|
||||
font-size: 3.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.portfolio-header__budget {
|
||||
@ -98,12 +58,20 @@
|
||||
font-size: $small-font-size;
|
||||
|
||||
.icon-link {
|
||||
padding: 0.8rem 1.2rem;
|
||||
&.active {
|
||||
padding: 0.8rem 1.6rem;
|
||||
|
||||
color: $color-gray;
|
||||
opacity: 0.3;
|
||||
.icon {
|
||||
@include icon-color($color-gray);
|
||||
}
|
||||
|
||||
&.active {
|
||||
opacity: 1;
|
||||
color: $color-blue;
|
||||
.icon {
|
||||
@include icon-color($color-blue);
|
||||
}
|
||||
}
|
||||
|
||||
.icon-link--icon {
|
||||
|
||||
@ -4,8 +4,6 @@
|
||||
{% from "components/text_input.html" import TextInput %}
|
||||
{% from 'components/save_button.html' import SaveButton %}
|
||||
|
||||
{% set secondary_breadcrumb = "navigation.portfolio_navigation.portfolio_admin" | translate %}
|
||||
|
||||
{% block portfolio_content %}
|
||||
|
||||
<div v-cloak class="portfolio-admin portfolio-content">
|
||||
|
||||
@ -4,10 +4,6 @@
|
||||
|
||||
<div class='portfolio-panel-container'>
|
||||
<div class='col col--grow'>
|
||||
{% block portfolio_breadcrumbs %}
|
||||
{% include "portfolios/breadcrumbs.html" %}
|
||||
{% endblock %}
|
||||
<div class='line'></div>
|
||||
{% block portfolio_header %}
|
||||
{% include "portfolios/header.html" %}
|
||||
{% endblock %}
|
||||
|
||||
@ -1,19 +0,0 @@
|
||||
{% from "components/icon.html" import Icon %}
|
||||
|
||||
<div class="row portfolio-breadcrumbs">
|
||||
<a class="icon-link portfolio-breadcrumbs__home {{ 'icon-link--disabled' if not secondary_breadcrumb }}" href="{{ url_for("applications.portfolio_applications", portfolio_id=portfolio.id) }}">
|
||||
{{ Icon("home") }}
|
||||
<span>
|
||||
{{ portfolio.name }} Portfolio
|
||||
</span>
|
||||
</a>
|
||||
<div class="portfolio-breadcrumbs__crumb">
|
||||
{% if secondary_breadcrumb %}
|
||||
{{ Icon("caret_right", classes="icon--tiny") }}
|
||||
<div class="icon-link icon-link--disabled">
|
||||
{{ secondary_breadcrumb }}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div
|
||||
>
|
||||
@ -2,7 +2,7 @@
|
||||
{% from "components/tooltip.html" import Tooltip %}
|
||||
|
||||
{% macro Link(icon, text, url, active=False) %}
|
||||
<a class='icon-link {{ "active icon-link--disabled" if active }}' href='{{ url }}'>
|
||||
<a class='icon-link {{ "active" if active }}' href='{{ url }}'>
|
||||
<div class='col'>
|
||||
<div class='icon-link--icon'>{{ Icon(icon) }}</div>
|
||||
<div class='icon-link--name'>{{ text }}</div>
|
||||
@ -13,24 +13,7 @@
|
||||
<div class='portfolio-header row'>
|
||||
<div class='col col--grow'>
|
||||
<div class='portfolio-header__name'>
|
||||
{{ secondary_breadcrumb or portfolio.name }}
|
||||
</div>
|
||||
<div class='portfolio-header__budget row'>
|
||||
<div class='column-left'>
|
||||
<span>Available budget</span>
|
||||
{{
|
||||
Tooltip(
|
||||
('portfolios.task_orders.available_budget_help_description' | translate),
|
||||
title=''
|
||||
)
|
||||
}}
|
||||
</div>
|
||||
<div class='portfolio-header__budget--amount'>
|
||||
<span class='portfolio-header__budget--dollars'>
|
||||
</span>
|
||||
<span class='portfolio-header__budget--cents'>
|
||||
</span>
|
||||
</div>
|
||||
<h1>{{ portfolio.name }}</h1>
|
||||
</div>
|
||||
<div class='row'>
|
||||
<div class='column-left'></div>
|
||||
@ -40,6 +23,18 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class='row links'>
|
||||
{{ Link(
|
||||
icon='funding',
|
||||
text='navigation.portfolio_navigation.breadcrumbs.funding' | translate,
|
||||
url=url_for("task_orders.portfolio_funding", portfolio_id=portfolio.id),
|
||||
active=request.url_rule.endpoint == "task_orders.portfolio_funding",
|
||||
) }}
|
||||
{{ Link(
|
||||
icon='applications',
|
||||
text='navigation.portfolio_navigation.breadcrumbs.applications' | translate,
|
||||
url=url_for("applications.portfolio_applications", portfolio_id=portfolio.id),
|
||||
active=request.url_rule.endpoint == "applications.portfolio_applications",
|
||||
) }}
|
||||
{% if user_can(permissions.VIEW_PORTFOLIO_REPORTS) %}
|
||||
{{ Link(
|
||||
icon='chart-pie',
|
||||
@ -48,12 +43,6 @@
|
||||
active=request.url_rule.endpoint == "portfolios.reports",
|
||||
) }}
|
||||
{% endif %}
|
||||
{{ Link(
|
||||
icon='dollar-sign',
|
||||
text='navigation.portfolio_navigation.breadcrumbs.funding' | translate,
|
||||
url=url_for("task_orders.portfolio_funding", portfolio_id=portfolio.id),
|
||||
active=request.url_rule.endpoint == "task_orders.portfolio_funding",
|
||||
) }}
|
||||
{% if user_can(permissions.VIEW_PORTFOLIO_ADMIN) %}
|
||||
{{ Link(
|
||||
icon='cog',
|
||||
|
||||
@ -3,8 +3,6 @@
|
||||
{% from "components/icon.html" import Icon %}
|
||||
{% from "components/empty_state.html" import EmptyState %}
|
||||
|
||||
{% set secondary_breadcrumb = "navigation.portfolio_navigation.breadcrumbs.reports" | translate %}
|
||||
|
||||
{% block portfolio_content %}
|
||||
|
||||
<div class='portfolio-reports'>
|
||||
|
||||
@ -4,8 +4,6 @@
|
||||
|
||||
{% extends "portfolios/base.html" %}
|
||||
|
||||
{% set secondary_breadcrumb = "navigation.portfolio_navigation.breadcrumbs.funding" | translate %}
|
||||
|
||||
{% block portfolio_content %}
|
||||
|
||||
{% macro ViewLink(task_order) %}
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
from flask import url_for
|
||||
from unittest.mock import Mock
|
||||
|
||||
from atst.domain.permission_sets import PermissionSets
|
||||
from atst.domain.portfolio_roles import PortfolioRoles
|
||||
@ -110,7 +111,7 @@ def test_no_update_member_permissions_without_edit_access(client, user_session):
|
||||
|
||||
|
||||
def test_rerender_admin_page_if_member_perms_form_does_not_validate(
|
||||
client, user_session
|
||||
client, user_session, monkeypatch
|
||||
):
|
||||
portfolio = PortfolioFactory.create()
|
||||
user = UserFactory.create()
|
||||
@ -128,13 +129,12 @@ def test_rerender_admin_page_if_member_perms_form_does_not_validate(
|
||||
"members_permissions-0-perms_portfolio_mgmt": "view_portfolio_admin",
|
||||
}
|
||||
|
||||
response = client.post(
|
||||
url_for("portfolios.edit_members", portfolio_id=portfolio.id),
|
||||
data=form_data,
|
||||
follow_redirects=True,
|
||||
mock_route = Mock()
|
||||
monkeypatch.setattr("atst.routes.portfolios.admin.render_admin_page", mock_route)
|
||||
client.post(
|
||||
url_for("portfolios.edit_members", portfolio_id=portfolio.id), data=form_data
|
||||
)
|
||||
assert response.status_code == 200
|
||||
assert "Portfolio Administration" in response.data.decode()
|
||||
mock_route.assert_called()
|
||||
|
||||
|
||||
def test_cannot_update_portfolio_ppoc_perms(client, user_session):
|
||||
|
||||
@ -394,6 +394,7 @@ navigation:
|
||||
admin: Admin
|
||||
funding: Funding
|
||||
reports: Reports
|
||||
applications: Applications
|
||||
budget_report: Budget Report
|
||||
portfolio_admin: Portfolio Administration
|
||||
portfolio_funding: Funding
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user