<div id="flapStatus" class="tab-pane fade in boxFlex active">
   {foreach $body.data.mservers as $mServerIndex => $mServer}
      {$mServerConfig=$dbcfg.pohoda.mservers.{$mServerIndex}}
      {$agends = $view->getSyncStatuses($mServerIndex)}

      <div class="m-b-2" id="#pohoda-settings{$mServerIndex}">
         <div data-target="#pohoda-settings-collapse-{$mServerIndex}">
            <div class="row">
               <div class="col-xs-12">
                  <h4>{'statusFor'|translate} {$mServer}</h4>
                   {if $mServerConfig.active == 'N'}
                      <div class="alert alert-danger">{'sychronizationOff'|translate}</div>
                   {elseif $view->isActive($mServerIndex)}
                       {$hoursDelay = $view->getSyncHoursDelay($mServerConfig.lastSuccessConnectionTime)}
                      <div class="alert alert-{if $hoursDelay > 5}danger{elseif $hoursDelay > 1}warning{else}success{/if}">{'lastSuccessCommunication'|translate} <strong>{$mServerConfig.lastSuccessConnectionTime|format_datetime:"admin"}</strong></div>
                   {else}
                      <div class="alert alert-warning">{'sychronizationStoped'|translate} ({$mServerConfig.maintenanceFrom} - {$mServerConfig.maintenanceTo})</div>
                   {/if}
               </div>
            </div>
         </div>

         <div class="wpj-panel wpj-panel-default{if $mServer@last} m-b-4{/if}" id="pohoda-settings-collapse-{$mServerIndex}">
            <div class="wpj-panel-heading">
               <div class="row">
                  <div class="col-xs-3">
                     <small>{'importExport'|translate}</small>
                  </div>
                  <div class="col-xs-3">
                     <small>{'lastSynchronizationTime'|translate}</small>
                  </div>
                  <div class="col-xs-6">
                     <small>{'status'|translate}</small>
                  </div>
               </div>
            </div>
            <div class="wpj-list-group">
                {foreach $agends as $agendName => $value}
                    {if $value.last_sync}
                       <div class="wpj-list-group-item">
                          <div class="row">
                             <div class="col-xs-3">
                                <span>
                                   <i class="bi {if $agendName|strstr:"In"}bi-arrow-down-right{else}bi-arrow-up-right{/if} m-r-1"></i>
                                   <strong>{$agendName|translate:"pohodaSettingsTab"}</strong>
                                </span>
                             </div>
                             <div class="col-xs-3">
                                <small>
                                    {$value.last_sync|format_datetime:"admin"}
                                </small>
                             </div>
                             <div class="col-xs-6">
                                 {switch $value.status}
                                 {case PohodaBoard::STATUS_ERROR}
                                    <div class="d-flex align-center">
                                       <span class="list-no bi bi-x-circle-fill" title="{'statusErrorTooltip'|translate}"></span>
                                       <small class="text-danger m-l-2">{'statusErrorTooltip'|translate}</small>
                                    </div>
                                 {/case}
                                 {case PohodaBoard::STATUS_WARNING}
                                    <div class="d-flex align-center">
                                       <span class="list-warn bi bi-exclamation-circle-fill" title="{'statusWarningTooltip'|translate}"></span>
                                       <small class="text-warning m-l-2">{'statusWarningTooltip'|translate}</small>
                                    </div>
                                 {/case}
                                 {case PohodaBoard::STATUS_OK}
                                    <span class="list-yes bi bi-check-circle-fill" title="{'statusOkTooltip'|translate}" data-toggle="tooltip"></span>
                                 {/case}
                                 {/switch}
                             </div>
                          </div>
                       </div>
                    {/if}
                {/foreach}
            </div>
         </div>
      </div>
   {/foreach}
</div>
