|
180 | 180 | <hr> |
181 | 181 | <div class="card card-default collapsed-card"> |
182 | 182 | <div class="card-header with-border"> |
183 | | - <h4 class="card-title"><a class="clickable" data-widget="collapse">'.tr('Creazione manuale').'...</a></h4> |
| 183 | + <h4 class="card-title"><a class="clickable" data-card-widget="collapse">'.tr('Creazione manuale').'...</a></h4> |
184 | 184 | <div class="card-tools pull-right"> |
185 | | - <button type="button" class="btn btn-tool" data-widget="collapse"><i class="fa fa-plus"></i></button> |
| 185 | + <button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fa fa-plus"></i></button> |
186 | 186 | </div> |
187 | 187 | </div> |
188 | 188 | <div class="card-body"> |
|
245 | 245 | echo ' |
246 | 246 | <script> |
247 | 247 | $(document).ready(function(){ |
248 | | - $("#smartwizard").smartWizard({ |
249 | | - useURLhash: false, |
250 | | - showStepURLhash: false, |
251 | | - theme: "default", |
252 | | - transitionEffect: "fade", |
253 | | - toolbarSettings: { |
254 | | - toolbarPosition: "bottom", |
255 | | - toolbarButtonPosition: "right", |
256 | | - showNextButton: true, |
257 | | - showPreviousButton: true |
258 | | - }, |
259 | | - anchorSettings: { |
260 | | - anchorClickable: true, |
261 | | - enableAllAnchors: true, |
262 | | - markDoneStep: true, |
263 | | - markAllPreviousStepsAsDone: true |
264 | | - }, |
265 | | - lang: { |
266 | | - next: "'.tr('Successivo').'", |
267 | | - previous: "'.tr('Precedente').'", |
268 | | - } |
269 | | - }); |
270 | | -
|
271 | 248 | // Custom tab navigation |
272 | | - $(".config-wizard-tabs li a").click(function(e) { |
273 | | - e.preventDefault(); |
274 | | - var targetStep = $(this).attr("href").replace("#", ""); |
| 249 | + function navigateToStep(stepNumber) { |
| 250 | + var targetStep = "step-" + stepNumber; |
275 | 251 |
|
276 | 252 | // Remove active class from all tabs |
277 | 253 | $(".config-wizard-tabs li").removeClass("active"); |
278 | 254 |
|
279 | 255 | // Add active class to current tab |
280 | | - $(this).parent().addClass("active"); |
| 256 | + $(".config-wizard-tabs li").eq(stepNumber - 1).addClass("active"); |
281 | 257 |
|
282 | 258 | // Hide all steps |
283 | | - $("#steps > div[id^=\'step-\']").hide(); |
| 259 | + $(".config-wizard-content > div[id^=\"step-\"]").hide(); |
284 | 260 |
|
285 | 261 | // Show target step |
286 | 262 | $("#" + targetStep).show(); |
287 | 263 |
|
288 | 264 | // Scroll to top of steps |
289 | 265 | $("html, body").animate({ scrollTop: $("#steps").offset().top }, 500); |
| 266 | +
|
| 267 | + // Update button states |
| 268 | + updateNavigationButtons(stepNumber); |
| 269 | + } |
| 270 | +
|
| 271 | + function updateNavigationButtons(currentStep) { |
| 272 | + var totalSteps = $(".config-wizard-tabs li").length; |
| 273 | +
|
| 274 | + // Disable/enable previous button |
| 275 | + if (currentStep === 1) { |
| 276 | + $(".btn-previous").addClass("disabled").prop("disabled", true); |
| 277 | + } else { |
| 278 | + $(".btn-previous").removeClass("disabled").prop("disabled", false); |
| 279 | + } |
| 280 | +
|
| 281 | + // Disable/enable next button |
| 282 | + if (currentStep === totalSteps) { |
| 283 | + $(".btn-next").addClass("disabled").prop("disabled", true); |
| 284 | + } else { |
| 285 | + $(".btn-next").removeClass("disabled").prop("disabled", false); |
| 286 | + } |
| 287 | + } |
| 288 | +
|
| 289 | + $(document).on("click", ".config-wizard-tabs li a", function(e) { |
| 290 | + e.preventDefault(); |
| 291 | + var targetStep = $(this).attr("href").replace("#", ""); |
| 292 | + var stepNumber = parseInt(targetStep.replace("step-", "")); |
| 293 | +
|
| 294 | + navigateToStep(stepNumber); |
290 | 295 | }); |
291 | 296 |
|
292 | | - // Set first tab as active by default |
293 | | - $(".config-wizard-tabs li:first").addClass("active"); |
294 | | - $("#steps > div[id^=\'step-\']").hide(); |
295 | | - $("#step-1").show(); |
| 297 | + // Previous button handler |
| 298 | + $(document).on("click", ".btn-previous", function(e) { |
| 299 | + e.preventDefault(); |
| 300 | + var currentStep = $(".config-wizard-tabs li.active").index() + 1; |
| 301 | + if (currentStep > 1) { |
| 302 | + navigateToStep(currentStep - 1); |
| 303 | + } |
| 304 | + }); |
296 | 305 |
|
297 | | - // Original leaveStep handler |
298 | | - $("#smartwizard").on("leaveStep", function(e, anchorObject, stepNumber, stepDirection) { |
299 | | - result = true; |
300 | | - if(stepDirection == "forward" && $("#step-" + (stepNumber + 1) + " form").length){ |
301 | | - result = $("#step-" + (stepNumber + 1) + " form").parsley().validate(); |
| 306 | + // Next button handler |
| 307 | + $(document).on("click", ".btn-next", function(e) { |
| 308 | + e.preventDefault(); |
| 309 | + var currentStep = $(".config-wizard-tabs li.active").index() + 1; |
| 310 | + var totalSteps = $(".config-wizard-tabs li").length; |
| 311 | +
|
| 312 | + // Validazione per step 2 (licenza) |
| 313 | + if (currentStep === 2) { |
| 314 | + if (!$("#agree").is(":checked")) { |
| 315 | + swal("'.tr('Impossibile procedere').'", "'.tr('Devi accettare la licenza per proseguire!').'", "error"); |
| 316 | + return false; |
| 317 | + } |
302 | 318 | } |
303 | 319 |
|
304 | | - if(!result){ |
305 | | - swal("'.tr('Impossibile procedere').'", "'.tr('Prima di proseguire devi completare i campi obbligatori!').'", "error"); |
| 320 | + if (currentStep <= totalSteps) { |
| 321 | + navigateToStep(currentStep + 1); |
306 | 322 | } |
| 323 | + }); |
307 | 324 |
|
308 | | - $("html, body").animate({ scrollTop: $("#steps").offset().top }, 500); |
| 325 | + // Set first tab as active by default |
| 326 | + $(".config-wizard-tabs li:first").addClass("active"); |
| 327 | + $(".config-wizard-content > div[id^=\"step-\"]").hide(); |
| 328 | + $("#step-1").show(); |
| 329 | + updateNavigationButtons(1); |
309 | 330 |
|
310 | | - return result; |
| 331 | + // Inizializza il widget collapse per le card |
| 332 | + $(document).on("click", "[data-card-widget=\"collapse\"]", function(e) { |
| 333 | + e.preventDefault(); |
| 334 | + var card = $(this).closest(".card"); |
| 335 | +
|
| 336 | + if (card.hasClass("collapsed-card")) { |
| 337 | + card.removeClass("collapsed-card"); |
| 338 | + card.find(".card-body").slideDown(300); |
| 339 | + $(this).find("i").removeClass("fa-plus").addClass("fa-minus"); |
| 340 | + } else { |
| 341 | + card.addClass("collapsed-card"); |
| 342 | + card.find(".card-body").slideUp(300); |
| 343 | + $(this).find("i").removeClass("fa-minus").addClass("fa-plus"); |
| 344 | + } |
311 | 345 | }); |
312 | 346 |
|
313 | 347 | $("#install").on("click", function(){ |
@@ -650,6 +684,15 @@ class: "img-flag", |
650 | 684 | </div> |
651 | 685 |
|
652 | 686 | </div> |
| 687 | +
|
| 688 | + <div class="config-wizard-navigation" style="padding: 20px; text-align: center; border-top: 1px solid #ddd; margin-top: 20px;"> |
| 689 | + <button type="button" class="btn btn-default btn-previous" style="margin-right: 10px;"> |
| 690 | + <i class="fa fa-arrow-left"></i> '.tr('Precedente').' |
| 691 | + </button> |
| 692 | + <button type="button" class="btn btn-primary btn-next"> |
| 693 | + '.tr('Successivo').' <i class="fa fa-arrow-right"></i> |
| 694 | + </button> |
| 695 | + </div> |
653 | 696 | </div> |
654 | 697 | </div>'; |
655 | 698 | } |
|
0 commit comments