Skip to content

Commit 8241524

Browse files
authored
Use modal for mission show (#394)
1 parent 8d051dc commit 8241524

File tree

12 files changed

+58
-49
lines changed

12 files changed

+58
-49
lines changed

assets/js/_planning-missions.js

Lines changed: 18 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ function setSlotMisssion(mission, $slot) {
1212

1313
missionsText += $('<span class="badge badge-secondary">').text(mission.type ? mission.type.name : 'mission')[0].outerHTML;
1414
missionsText += ' ';
15-
missionsText += $(`<button type="button" class="btn btn-link" data-toggle="modal" data-target="#modal-mission" data-mission-id="${mission.id}">`).text(mission.name)[0].outerHTML;
15+
missionsText += $(`<button type="button" class="btn btn-link" data-toggle="modal" data-target="#modal-ajax" data-mission-id="${mission.id}">`).text(mission.name)[0].outerHTML;
1616

1717
$slot.addClass('mission').data('mission-text', missionsText);
1818
}
@@ -137,48 +137,42 @@ export function fetchMissions() {
137137
});
138138
}
139139

140-
export function initMissionsEvents() {
141-
$('#modal-mission')
140+
export function initMissionsPlanningEvents() {
141+
$('#modal-add-mission')
142142
.on('show.bs.modal', function (event) {
143143
const $modal = $(this);
144144
const $link = $(event.relatedTarget);
145-
const missionId = $link.data('mission-id');
145+
const url = $link.data('href');
146146

147-
displayMissionModal($modal, missionId);
147+
displayAjaxModal($modal, url);
148148
})
149149
.on('hidden.bs.modal', function () {
150150
const $modal = $(this);
151151
$modal.find('.loading').show();
152152
$modal.find('.content').html('');
153153
});
154154

155-
$('#modal-add-mission')
155+
$(document).on('click', '.mission-choose', function () {
156+
addUserToMission($(this).data('href'));
157+
});
158+
}
159+
160+
export function initMissionsEvents() {
161+
$('#modal-ajax')
156162
.on('show.bs.modal', function (event) {
157163
const $modal = $(this);
158164
const $link = $(event.relatedTarget);
159-
const url = $link.data('href');
165+
const missionId = $link.data('mission-id');
160166

161-
displayAjaxModal($modal, url);
167+
if (!missionId) {
168+
return;
169+
}
170+
171+
displayMissionModal($modal, missionId);
162172
})
163173
.on('hidden.bs.modal', function () {
164174
const $modal = $(this);
165175
$modal.find('.loading').show();
166176
$modal.find('.content').html('');
167177
});
168-
169-
$(document).on('click', '.mission-choose', function () {
170-
addUserToMission($(this).data('href'));
171-
});
172-
173-
// Allow modals stacking
174-
$(document).on('show.bs.modal', '.modal', function () {
175-
const zIndex = 1040 + 10 * $('.modal:visible').length;
176-
$(this).css('z-index', zIndex);
177-
setTimeout(function () {
178-
$('.modal-backdrop')
179-
.not('.modal-stack')
180-
.css('z-index', zIndex - 1)
181-
.addClass('modal-stack');
182-
});
183-
});
184178
}

assets/js/app.js

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@ import '../css/planning.scss';
66
import '../css/availability-table.scss';
77
import './_delete-item-modal';
88

9+
import { initMissionsEvents } from './_planning-missions';
10+
911
const $ = require('jquery');
1012
require('util');
1113
require('popper.js');
@@ -22,3 +24,19 @@ $.fn.selectpicker.Constructor.DEFAULTS.doneButtonText = 'Fermer';
2224
$.fn.selectpicker.Constructor.DEFAULTS.mobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent);
2325

2426
browserUpdate({ required: { e: -2, f: -2, o: -2, s: -2, c: -10 }, insecure: true, unsupported: true, api: 2020.04 });
27+
28+
$(document).ready(function () {
29+
// Allow modals stacking
30+
$(document).on('show.bs.modal', '.modal', function () {
31+
const zIndex = 1040 + 10 * $('.modal:visible').length;
32+
$(this).css('z-index', zIndex);
33+
setTimeout(function () {
34+
$('.modal-backdrop')
35+
.not('.modal-stack')
36+
.css('z-index', zIndex - 1)
37+
.addClass('modal-stack');
38+
});
39+
});
40+
41+
initMissionsEvents();
42+
});

assets/js/availability-form.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { addPopovers } from './_planning';
2-
import { fetchMissions, initMissionsEvents } from './_planning-missions';
2+
import { fetchMissions } from './_planning-missions';
33

44
const $ = require('jquery');
55

@@ -58,6 +58,5 @@ $(document).ready(function () {
5858
});
5959

6060
addPopovers($table);
61-
initMissionsEvents();
6261
fetchMissions();
6362
});

assets/js/planning.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { initDatesRange } from './_helpers';
2-
import { fetchMissions, initMissionsEvents } from './_planning-missions';
32
import { addPopovers } from './_planning';
43
import { initUpdateEvents } from './_planning-update';
4+
import { fetchMissions, initMissionsPlanningEvents } from './_planning-missions';
55

66
const $ = require('jquery');
77

@@ -56,7 +56,7 @@ $(document).ready(function () {
5656
addPopovers($planning);
5757

5858
initUpdateEvents();
59-
initMissionsEvents();
59+
initMissionsPlanningEvents();
6060
fetchMissions();
6161

6262
$('#hideUsers').on('change', hideUselessFilters);

templates/availability/_mission_modal.html.twig

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<div class="modal fade" id="modal-mission" tabindex="-1" role="dialog">
1+
<div class="modal fade" id="modal-ajax" tabindex="-1" role="dialog">
22
<div class="modal-dialog modal-lg" role="document">
33
<div class="modal-content">
44
<div class="modal-header">

templates/availability/_table.html.twig

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -88,8 +88,6 @@
8888
<li><span class="availability-legend locked"></span> <em>{{ 'organization.asset.locked'|trans }}</em></li>
8989
</ul>
9090

91-
{% include 'availability/_mission_modal.html.twig' %}
92-
9391
<div class="modal fade" id="modal-confirm" tabindex="-1" role="dialog">
9492
<div class="modal-dialog" role="document">
9593
<div class="modal-content">

templates/organization/base.html.twig

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -68,6 +68,7 @@
6868
{% include '_footer.html.twig' %}
6969

7070
{% include 'organization/_delete_modal.html.twig' %}
71+
{% include 'availability/_mission_modal.html.twig' %}
7172

7273
{% block javascripts %}
7374
{{ encore_entry_script_tags('app') }}

templates/organization/mission/_list.html.twig

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -55,9 +55,7 @@
5555
{% endif %}
5656

5757
{% if modalLinks is not defined or modalLinks %}
58-
<button type="button" class="btn btn-outline-primary" data-toggle="modal" data-target="#modal-mission" data-mission-id="{{ mission.id }}">{{ 'action.show' | trans }}</button>
59-
{% else %}
60-
<a class="btn btn-primary" href="{{ path('app_organization_mission_show', {'id': mission.id}) }}">{{ 'action.show' | trans }}</a>
58+
<button type="button" class="btn btn-outline-primary" data-toggle="modal" data-target="#modal-ajax" data-mission-id="{{ mission.id }}">{{ 'action.show' | trans }}</button>
6159
{% endif %}
6260

6361
{% if showActions is not defined or showActions %}

templates/organization/mission/_list_full.html.twig

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@
2222
<tr class="table-primary">
2323
<td>
2424
<span class="badge badge-secondary">{{ mission.type.name | default('') }}</span>
25-
<a href="{{ path('app_organization_mission_show', {'id': mission.id}) }}">{{ mission.name }}</a>
25+
<button type="button" class="btn btn-link" data-toggle="modal" data-target="#modal-ajax" data-mission-id="{{ mission.id }}">{{ mission.name }}</button>
2626
</td>
2727
<td>
2828
{{ missionMacro.missionDates(mission, 'date') }}

templates/organization/planning/_availabilities_users.html.twig

Lines changed: 14 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -31,17 +31,19 @@
3131
<td class="item-data">{{ item.entity.drivingLicence ? 'common.yes' | trans : '-' }}</td>
3232
<td class="item-data">{{ item.entity.vulnerable ? 'common.yes' | trans : '-' }}</td>
3333
<td>
34-
<button
35-
class="btn btn-sm btn-block btn-outline-light engaged trigger-add-mission nowrap"
36-
data-toggle="modal"
37-
data-target="#modal-add-mission"
38-
data-href="{{ path('app_organization_user_add_to_mission_modal', {
39-
from: periodCalculator.from | date('Y-m-d\\T00:00:00'),
40-
to: periodCalculator.to | date_modify('- 1 minute') | date('Y-m-d\\T00:00:00'),
41-
organization: item.entity.organization.id,
42-
userToAdd: item.entity.id
43-
}) }}"
44-
title="{{ 'organization.asset.engage' | trans }}"
45-
><span class="fa fa-plus"></span> {{ 'organization.mission.title' | trans }}</button>
34+
{% if displayActions %}
35+
<button
36+
class="btn btn-sm btn-block btn-outline-light engaged trigger-add-mission nowrap"
37+
data-toggle="modal"
38+
data-target="#modal-add-mission"
39+
data-href="{{ path('app_organization_user_add_to_mission_modal', {
40+
from: periodCalculator.from | date('Y-m-d\\T00:00:00'),
41+
to: periodCalculator.to | date_modify('- 1 minute') | date('Y-m-d\\T00:00:00'),
42+
organization: item.entity.organization.id,
43+
userToAdd: item.entity.id
44+
}) }}"
45+
title="{{ 'organization.asset.engage' | trans }}"
46+
><span class="fa fa-plus"></span> {{ 'organization.mission.title' | trans }}</button>
47+
{% endif %}
4648
</td>
4749
{% endblock itemDataDetails %}

0 commit comments

Comments
 (0)