Skip to content

Commit

Permalink
Merge pull request #35739 from dimagi/ay/lock-case-grouping-overflow-…
Browse files Browse the repository at this point in the history 
…issue

Fix text overflow issue in button of Case Clustering Page
  • Loading branch information
@ajeety4
ajeety4 authored Feb 7, 2025
2 parents 9fe973a + da477b7 commit 38b8c2f
Showing 1 changed file with 73 additions and 47 deletions.
120 changes: 73 additions & 47 deletions corehq/apps/geospatial/templates/geospatial/case_grouping_map.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,47 +4,62 @@
{% load hq_shared_tags %}

{% block reportcontent %}
{% include 'geospatial/partials/index_alert.html' %}
<div class="row panel">
<div class="col col-md-2">
<span id="lock-groups-controls">
<div class="controls">
<button id="gtm-lock-case-grouping-btn" data-bind="visible: !groupsLocked(), click: toggleGroupLock" class="btn-default form-control">
<i class="fa fa-lock"></i>
{% trans "Lock Case Clustering Map for Me" %}
</button>
<button data-bind="visible: groupsLocked(), click: toggleGroupLock" class="btn-primary form-control">
<i class="fa fa-unlock"></i>
{% trans "Unlock Case Clustering Map for Me" %}
</button>
</div>
</span>
</div>
<div class="col col-md-2">
<span id="export-controls">
<div class="controls">
<button id="gtm-export-groups-btn" class="btn-default form-control" data-bind="click: downloadCSV, disable: !groupsReady()">
{% trans "Export Groups" %}
</button>
</div>
</span>
{% include 'geospatial/partials/index_alert.html' %}
<div class="row panel">
<div class="col col-md-3 col-lg-2">
<span id="lock-groups-controls">
<div class="controls">
<button
id="gtm-lock-case-grouping-btn"
data-bind="visible: !groupsLocked(), click: toggleGroupLock"
class="btn btn-default form-control"
>
<i class="fa fa-lock"></i>
{% trans "Lock Map" %}
</button>
<button
data-bind="visible: groupsLocked(), click: toggleGroupLock"
class="btn btn-primary form-control"
>
<i class="fa fa-unlock"></i>
{% trans "Unlock Map" %}
</button>
</div>
</span>
</div>
<div class="col col-md-2">
<span id="export-controls">
<div class="controls">
<button
id="gtm-export-groups-btn"
class="btn btn-default form-control"
data-bind="click: downloadCSV, disable: !groupsReady()"
>
{% trans "Export Groups" %}
</button>
</div>
</span>
</div>
</div>
</div>

{% include 'geospatial/partials/saved_polygon_filter.html' with uses_disbursement='false' %}
<div id="case-grouping-map" style="height: 500px"></div>
{% include 'geospatial/partials/saved_polygon_filter.html' with uses_disbursement='false' %}
<div id="case-grouping-map" style="height: 500px"></div>

<div class="panel-body-datatable">
<div class="panel-body-datatable">
{% block reporttable %}
{% if report.needs_filters %}
{% include 'reports/partials/bootstrap3/description.html' %}
{% else %}
<table id="report_table_{{ report.slug }}" class="table table-striped datatable" width="100%" {% if pagination.filter %} data-filter="true"{% endif %}>
</table>
<table
id="report_table_{{ report.slug }}"
class="table table-striped datatable"
width="100%"
{% if pagination.filter %}data-filter="true"{% endif %}
></table>
{% endif %}
{% endblock reporttable %}
</div>
<div class="row">
</div>
<div class="row">
<div class="col-sm-6" id="clusterStats">
<table class="table table-striped table-bordered">
<thead>
Expand Down Expand Up @@ -75,10 +90,15 @@
</thead>
<tbody data-bind="foreach: caseGroupsForTable">
<tr>
<td data-bind="event: {mouseover: $parent.highlightGroup, mouseout: $parent.restoreMarkerOpacity}">
<td
data-bind="event: {mouseover: $parent.highlightGroup, mouseout: $parent.restoreMarkerOpacity}"
>
<div class="checkbox">
<label>
<input type="checkbox" data-bind="checked: $parent.visibleGroupIDs, checkedValue: groupId" />
<input
type="checkbox"
data-bind="checked: $parent.visibleGroupIDs, checkedValue: groupId"
/>
<span data-bind="text: name"></span>
<span data-bind="style: {color: color}">■</span>
</label>
Expand All @@ -90,29 +110,35 @@
</div>
<div class="row">
<div class="col col-md-6">
<button class="btn-default form-control" data-bind="click: showSelectedGroups(), disable: !groupsReady()">
<button
class="btn btn-default form-control"
data-bind="click: showSelectedGroups(), disable: !groupsReady()"
>
{% trans "Show Only Selected Groups on Map" %}
</button>
</div>
<div class="col col-md-6">
<button class="btn-default form-control" data-bind="click: showAllGroups(), disable: !groupsReady()">
<button
class="btn btn-default form-control"
data-bind="click: showAllGroups(), disable: !groupsReady()"
>
{% trans "Show All Groups" %}
</button>
</div>
</div>
</div>
</div>
</div>
</div>

<script type="text/html" id="select-case">
<div class="d-flex flex-row">
<label data-bind="attr: {for: selectCssId}, text: title"></label>
<select class="form-control" data-bind="attr: {id: selectCssId},
options: groupsOptions, optionsText: 'name', optionsValue: 'groupId', value: selectedGroup">
</select>
</div>
<div data-bind="html: $data.itemData.caseLink"></div>
</script>

<script type="text/html" id="select-case">
<div class="d-flex flex-row">
<label data-bind="attr: {for: selectCssId}, text: title"></label>
<select
class="form-control"
data-bind="attr: {id: selectCssId},
options: groupsOptions, optionsText: 'name', optionsValue: 'groupId', value: selectedGroup"
></select>
</div>
<div data-bind="html: $data.itemData.caseLink"></div>
</script>
{% endblock %}

0 comments on commit 38b8c2f

Please sign in to comment.