{extend name="common/base" /}

{block name="content"}
<!--
================================================================================
前台表单模板（表单模型，访问地址 /form/表单模型ID）
================================================================================
  cms:form   输出 <form> 并把表单数据放进变量（默认 $item），参考 HkCms form 标签
--------------------------------------------------------------------------------
标签参数：
  catid   栏目ID（表单型栏目，自动取其绑定的表单模型）
  model   表单模型ID（与 catid 二选一；都不写时取当前路由 /form/<id> 的 id）
  id      变量名，默认 item
  attr    原样输出到 <form> 上的额外属性（里面用单引号），如 attr="class='site-form' id='frm'"
  method  提交方式，默认 post

变量 $item 可用（下面用 $item[...] 表示，模板里写成花括号取值即可）：
  $item['action']        提交地址（默认 /index/form/submit，无需手写）
  $item['method']        提交方式
  $item['model_id']      表单模型ID
  $item['model']['name'] 表单名称（模型信息）
  $item['category']      栏目信息（使用 catid 调用时才有）
  $item['field']['name'] 字段名（手动写控件时用，如 name 取该值）
  $item['all']           字段明细列表（id/name/title/type/placeholder/tip/required/rules）
  $item['fields_html']   自动渲染好的字段控件（用 |raw 输出）
  $item['captcha']       验证码：[show] 是否有、[input] 输入框、[btn] 图片/按钮
================================================================================
-->
<nav class="crumb">
    <a href="{cms:url type='home'}">{:__('Home')}</a>
    <span class="sep">/</span>
    <span>{:__('OnlineForm')}</span>
</nav>

{cms:form attr="class='site-form' id='cms-front-form'"}
<section class="block form-block">
    <div class="block-head">
        <h2>{$item['model']['name']}</h2>
    </div>
    {if condition="!empty($item['model']['description'])"}
    <p class="block-desc">{$item['model']['description']}</p>
    {/if}

    <!--
    --------------------------------------------------------------------------------
    字段控件区：后台「模型字段」勾选「前台显示」的字段会自动全部渲染出来
    $item['fields_html'] 由 Form::renderFields() 生成，含必填、占位、下拉/单选/多选等
    --------------------------------------------------------------------------------
    -->
    {$item['fields_html']|raw}

    <!--
    --------------------------------------------------------------------------------
    验证码区：仅在后台「系统设置 → 表单验证码」开启时出现
    $item['captcha']['input'] 是输入框，$item['captcha']['btn'] 是图片（点击刷新）
    --------------------------------------------------------------------------------
    -->
    {if condition="$item['captcha']['show']"}
    <div class="form-item">
        <label class="form-label">{:__('Captcha')} <em>*</em></label>
        <div class="form-control captcha-control">
            {$item['captcha']['input']|raw}
            {$item['captcha']['btn']|raw}
            <a href="javascript:;" class="captcha-refresh" data-captcha-refresh="1">{:__('CaptchaRefresh')}</a>
        </div>
    </div>
    {/if}

    <div class="form-actions">
        <button type="submit" class="btn btn-primary">{:__('Submit')}</button>
        <button type="reset" class="btn btn-ghost">{:__('Reset')}</button>
    </div>

    <p class="form-msg" aria-live="polite"></p>
</section>
{/cms:form}
{/block}