{extends "[shared]/window.tpl"}

{block tabs}
    {windowTab id='flapInfoPanel'}
{/block}

{block tabsContent}
   <div id="flapInfoPanel" class="tab-pane fade active in boxFlex">
      <div class="row wpj-form-group-flex">
         <div class="col-xs-6">
            <div class="wpj-form-group">
               <label for="data[name]">{'info_panel_name'|translate}
                  <a class="help-tip" data-toggle="tooltip"
                     title="{'info_panel_name_tooltip'|translate}">
                     <i class="bi bi-question-circle"></i>
                  </a>
               </label>
               <input type="text" class="form-control" name="data[name]" size="50" value="{$body.data.name}">
            </div>
         </div>
         <div class="col-xs-6">
            <div class="wpj-form-group">
               <label for="data[type]">{'info_panel_type'|translate}</label>
               <select name="data[type]" class="selecter">
                   <option value="">Nevybráno</option>
                   {foreach $body.info_panel_types as $panelType}
                      <option value="{$panelType['type']}"
                              {if $panelType['type'] == $body.data.type}selected{/if}>{$panelType['descr']}</option>
                   {/foreach}
               </select>
            </div>
         </div>
      </div>
      <div class="row">
         <div class="col-xs-12">
            <div class="wpj-form-group">
               {print_toggle nameRaw="data[active]" value=$body.data.active}
               <label>{'info_panel_active'|translate}</label>
               {include "utils/translations.figure.tpl"
                  figureData=$body.info_panelTranslationsFigure
                  parentFigure=$body.data.active inputPrefix="data"
                  parentFigureInput='[name="data[active]"]'
               }
            </div>
         </div>
      </div>
      <div class="row">
         <div class="col-xs-3">
            <div class="wpj-form-group">
               <label for="data[date_from]">{'info_panel_date_from'|translate}</label>
               <div class="input-group">
                  <input type="text" class="form-control" name="data[date_from]" id="showFromDate"
                         value="{$body.data.date_from|format_datetime:"admin"}" maxlength="19" autocomplete="off"/>
                   {insert_calendar selector="#showFromDate" format='datetime'}
                  <label for="showFromDate" class="input-group-addon">
                     <span class="bi bi-calendar-week"></span>
                  </label>
               </div>
            </div>
         </div>
         <div class="col-xs-3">
            <div class="wpj-form-group">
               <label for="data[date_to]">{'info_panel_date_to'|translate}</label>
               <div class="input-group">
                  <input type="text" class="form-control" name="data[date_to]" id="showToDate"
                         value="{$body.data.date_to|format_datetime:"admin"}" maxlength="19" autocomplete="off"/>
                   {insert_calendar selector="#showToDate" format='datetime'}
                  <label for="showToDate" class="input-group-addon">
                     <span class="bi bi-calendar-week"></span>
                  </label>
               </div>
            </div>
         </div>
      </div>
      <div class="row wpj-form-group-flex">
         <div class="wpj-form-group">
            <div class="col-xs-12">
               <label class="d-flex justify-content-between">
                  {'info_panel_body'|translate}
                  {insert_llm_button type='info_panel' target="data[body]"}
               </label>
                  <textarea name="data[body]" class="form-control">
                     {$body.data.body}
                  </textarea>
               {insert_wysiwyg target="data[body]" type="email" config="forcePasteAsPlainText: true"}
            </div>
         </div>
      </div>
      <br>
      <div class="row">
         <div class="col-xs-4">
            <div class="wpj-form-group">
               <label for="data[data][color]">{'info_panel_background_color'|translate}</label>
               {if $body.data.data != NULL}
                   {$data = json_decode($body.data.data, true)}
               {/if}
               <select name="data[data][color]" class="selecter">
                   <option value="">Nevybráno</option>
                   {foreach $body.info_panel_colors as $color}
                      <option value="{$color['type']}"
                              {if $color['type'] == $data.color}selected{/if}>{$color['descr']}</option>
                   {/foreach}
               </select>
            </div>
         </div>
         <div class="col-xs-1 hidden">
            <div class="wpj-form-group">
               <label for="data[version]">{'info_panel_version'|translate}</label>
               <input type="number" class="form-control" name="data[version]" size="50" value="{$body.data.version}">
            </div>
         </div>
      </div>
   </div>
{/block}
