zydronium/manage.get.gov
1
0
Fork 0
mirror of https://github.com/cisagov/manage.get.gov.git synced 2025-05-19 10:59:21 +02:00
Code Issues Projects Releases Packages Wiki Activity

Show more/less for status auditlogs

Browse source
This commit is contained in:
Rachid Mrad 2024-05-03 13:34:57 -04:00
parent 914795efaf
commit 63f8c865d2
No known key found for this signature in database
5 changed files with 98 additions and 49 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/registrar/admin.py
View file

@ -1013,7 +1013,7 @@ class DomainInformationAdmin(ListHeaderAdmin):
( (
"Show details", "Show details",
{ {
"classes": ["collapse--dotgov"], "classes": ["collapse--dgfieldset"],
"description": "Extends type of organization", "description": "Extends type of organization",
"fields": [ "fields": [
"federal_type", "federal_type",
@ -1039,7 +1039,7 @@ class DomainInformationAdmin(ListHeaderAdmin):
( (
"Show details", "Show details",
{ {
"classes": ["collapse--dotgov"], "classes": ["collapse--dgfieldset"],
"description": "Extends organization name and mailing address", "description": "Extends organization name and mailing address",
"fields": [ "fields": [
"address_line1", "address_line1",
@ -1266,7 +1266,7 @@ class DomainRequestAdmin(ListHeaderAdmin):
( (
"Show details", "Show details",
{ {
"classes": ["collapse--dotgov"], "classes": ["collapse--dgfieldset"],
"description": "Extends type of organization", "description": "Extends type of organization",
"fields": [ "fields": [
"federal_type", "federal_type",
@ -1292,7 +1292,7 @@ class DomainRequestAdmin(ListHeaderAdmin):
( (
"Show details", "Show details",
{ {
"classes": ["collapse--dotgov"], "classes": ["collapse--dgfieldset"],
"description": "Extends organization name and mailing address", "description": "Extends organization name and mailing address",
"fields": [ "fields": [
"address_line1", "address_line1",

39
src/registrar/assets/js/dja-collapse.js
View file

@ -4,19 +4,18 @@
* Works with our fieldset override * Works with our fieldset override
*/ */
/*global gettext*/
'use strict'; 'use strict';
{ {
window.addEventListener('load', function() { window.addEventListener('load', function() {
// Add anchor tag for Show/Hide link // Add anchor tag for Show/Hide link
const fieldsets = document.querySelectorAll('fieldset.collapse--dotgov'); const fieldsets = document.querySelectorAll('fieldset.collapse--dgfieldset');
for (const [i, elem] of fieldsets.entries()) { for (const [i, elem] of fieldsets.entries()) {
// Don't hide if fields in this fieldset have errors // Don't hide if fields in this fieldset have errors
if (elem.querySelectorAll('div.errors, ul.errorlist').length === 0) { if (elem.querySelectorAll('div.errors, ul.errorlist').length === 0) {
elem.classList.add('collapsed'); elem.classList.add('collapsed');
const button = elem.querySelector('button'); const button = elem.querySelector('button');
button.id = 'fieldsetcollapser' + i; button.id = 'fieldsetcollapser' + i;
button.className = 'collapse-toggle--dotgov usa-button usa-button--unstyled'; button.className = 'collapse-toggle--dgfieldset usa-button usa-button--unstyled';
} }
} }
// Add toggle to hide/show anchor tag // Add toggle to hide/show anchor tag
@ -38,8 +37,40 @@
fieldset.classList.add('collapsed'); fieldset.classList.add('collapsed');
} }
}; };
document.querySelectorAll('.collapse-toggle--dotgov').forEach(function(el) { document.querySelectorAll('.collapse-toggle--dgfieldset').forEach(function(el) {
el.addEventListener('click', toggleFuncDotgov); el.addEventListener('click', toggleFuncDotgov);
}); });
}); });
} }
'use strict';
{
window.addEventListener('load', function() {
// Add anchor tag for Show/Hide link
const collapsibleContent = document.querySelectorAll('fieldset.collapse--dgsimple');
for (const [i, elem] of collapsibleContent.entries()) {
const button = elem.closest('div').querySelector('button');
button.id = 'simplecollapser' + i;
}
// Add toggle to hide/show anchor tag
const toggleFuncDotgovSimple = function(e) {
const fieldset = this.closest('div').querySelector('.collapse--dgsimple');
const spanElement = this.querySelector('span');
const useElement = this.querySelector('use');
if (fieldset.classList.contains('collapsed')) {
// Show
spanElement.textContent = 'Hide details';
useElement.setAttribute('xlink:href', '/public/img/sprite.svg#expand_less');
fieldset.classList.remove('collapsed');
} else {
// Hide
spanElement.textContent = 'Show details';
useElement.setAttribute('xlink:href', '/public/img/sprite.svg#expand_more');
fieldset.classList.add('collapsed');
}
};
document.querySelectorAll('.collapse-toggle--dgsimple').forEach(function(el) {
el.addEventListener('click', toggleFuncDotgovSimple);
});
});
}

44
src/registrar/assets/sass/_theme/_admin.scss
View file

@ -243,7 +243,7 @@ div#content > h2 {
// in the future // in the future
.object-tools li a, .object-tools li a,
.object-tools p a { .object-tools p a {
font-family: "Source Sans Pro Web", "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-family: family('sans');
text-transform: none!important; text-transform: none!important;
font-size: 14px!important; font-size: 14px!important;
} }
@ -293,7 +293,7 @@ div#content > h2 {
.messagelist_content-list--unstyled { .messagelist_content-list--unstyled {
padding-left: 0; padding-left: 0;
li { li {
font-family: "Source Sans Pro Web", "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-family: family('sans');
font-size: 13.92px!important; font-size: 13.92px!important;
background: none!important; background: none!important;
padding: 0!important; padding: 0!important;
@ -542,32 +542,42 @@ address.dja-address-contact-list {
} }
// Collapse button styles for fieldsets // Collapse button styles for fieldsets
.module.collapse--dotgov { .module.collapse--dgfieldset {
margin-top: -35px; margin-top: -35px;
padding-top: 0; padding-top: 0;
border: none; border: none;
button { }
background: none; .collapse-toggle--dgsimple,
text-transform: none; .module.collapse--dgfieldset button {
background: none;
text-transform: none;
color: var(--link-fg);
margin-top: 8px;
margin-left: 10px;
span {
text-decoration: underline;
font-size: 13px;
font-feature-settings: "kern";
font-kerning: normal;
line-height: 13px;
font-family: family('sans');
}
&:hover {
color: var(--link-fg); color: var(--link-fg);
margin-top: 8px; svg {
margin-left: 10px; color: var(--link-fg);
span {
text-decoration: underline;
font-size: 13px;
font-feature-settings: "kern";
font-kerning: normal;
line-height: 13px;
font-family: -apple-system, "system-ui", "Segoe UI", system-ui, Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
} }
} }
} }
.collapse--dotgov.collapsed .collapse-toggle--dotgov { .collapse--dgfieldset.collapsed .collapse-toggle--dgfieldset {
display: inline-block!important; display: inline-block!important;
* { * {
display: inline-block; display: inline-block;
} }
} }
.collapse--dgsimple.collapsed {
display: none;
}
.dja-status-list { .dja-status-list {
border-top: solid 1px var(--border-color); border-top: solid 1px var(--border-color);
@ -576,7 +586,7 @@ address.dja-address-contact-list {
padding-top: 10px; padding-top: 10px;
li { li {
line-height: 1.5; line-height: 1.5;
font-family: "Source Sans Pro Web", "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif !important; font-family: family('sans');
padding-top: 0; padding-top: 0;
padding-bottom: 0; padding-bottom: 0;
} }

4
src/registrar/templates/admin/fieldset.html
View file

@ -8,7 +8,7 @@ https://github.com/django/django/blob/main/django/contrib/admin/templates/admin/
<fieldset class="module aligned {{ fieldset.classes }}"> <fieldset class="module aligned {{ fieldset.classes }}">
{% if fieldset.name %} {% if fieldset.name %}
{# Customize the markup for the collapse toggle #} {# Customize the markup for the collapse toggle #}
{% if 'collapse--dotgov' in fieldset.classes %} {% if 'collapse--dgfieldset' in fieldset.classes %}
<button type="button"> <button type="button">
<span>{{ fieldset.name }}</span> <span>{{ fieldset.name }}</span>
<svg class="usa-icon" aria-hidden="true" focusable="false" role="img" width="24" height="24"> <svg class="usa-icon" aria-hidden="true" focusable="false" role="img" width="24" height="24">
@ -22,7 +22,7 @@ https://github.com/django/django/blob/main/django/contrib/admin/templates/admin/
{% endif %} {% endif %}
{# Customize the markup for the collapse toggle: Do not show a description for the collapse fieldsets, instead we're using the description as a screen reader only legend #} {# Customize the markup for the collapse toggle: Do not show a description for the collapse fieldsets, instead we're using the description as a screen reader only legend #}
{% if fieldset.description and 'collapse--dotgov' not in fieldset.classes %} {% if fieldset.description and 'collapse--dgfieldset' not in fieldset.classes %}
<div class="description">{{ fieldset.description|safe }}</div> <div class="description">{{ fieldset.description|safe }}</div>
{% endif %} {% endif %}

52
src/registrar/templates/django/admin/includes/detail_table_fieldset.html
View file

@ -70,29 +70,37 @@ This is using a custom implementation fieldset.html (see admin/fieldset.html)
{% if field.field.name == "status" and original_object.history.count > 0 %} {% if field.field.name == "status" and original_object.history.count > 0 %}
<div class="flex-container"> <div class="flex-container">
<label aria-label="Submitter contact details"></label> <label aria-label="Submitter contact details"></label>
<div class="usa-table-container--scrollable" tabindex="0"> <div>
<table class="usa-table usa-table--borderless"> <div class="usa-table-container--scrollable collapse--dgsimple" tabindex="0">
<thead> <table class="usa-table usa-table--borderless">
<tr> <thead>
<th>Status</th> <tr>
<th>User</th> <th>Status</th>
<th>Changed at</th> <th>User</th>
</tr> <th>Changed at</th>
</thead> </tr>
<tbody> </thead>
{% for log_entry in original_object.history.all %} <tbody>
{% for key, value in log_entry.changes_display_dict.items %} {% for log_entry in original_object.history.all %}
{% if key == "status" %} {% for key, value in log_entry.changes_display_dict.items %}
<tr> {% if key == "status" %}
<td>{{ value.1|default:"None" }}</td> <tr>
<td>{{ log_entry.actor|default:"None" }}</td> <td>{{ value.1|default:"None" }}</td>
<td>{{ log_entry.timestamp|default:"None" }}</td> <td>{{ log_entry.actor|default:"None" }}</td>
</tr> <td>{{ log_entry.timestamp|default:"None" }}</td>
{% endif %} </tr>
{% endif %}
{% endfor %}
{% endfor %} {% endfor %}
{% endfor %} </tbody>
</tbody> </table>
</table> </div>
<button type="button" class="collapse-toggle--dgsimple usa-button usa-button--unstyled margin-top-2 margin-bottom-1 margin-left-1">
<span>Hide details</span>
<svg class="usa-icon" aria-hidden="true" focusable="false" role="img" width="24" height="24">
<use xlink:href="/public/img/sprite.svg#expand_less"></use>
</svg>
</button>
</div> </div>
</div> </div>
{% elif field.field.name == "creator" %} {% elif field.field.name == "creator" %}