{if isset($title)}
        <div class="ibox-title notselect">
            <h5>{$title}</h5>
           
        </div>
        {/if}
        <div class="ibox-content">
        {if isset($alert)}
        <div class="alert alert-{$alert['type']} alert-dismissible" role="alert" style="border-radius:0">
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
            {if isset($alert['title'])}<p style="font-size:18px;padding-bottom:10px">{$alert['title']}</p>{/if}
            {if isset($alert['content'])}<p style="font-size:14px">{$alert['content']}</p>{/if}
        </div>
        {/if}
<form  action="{php echo self()}" data-auto="true" method="post" class='form-horizontal layui-form' style='padding:20px'>

    <div class="form-group">
        <label class="col-sm-2 control-label label-required">Storage <span class="nowrap">(存储引擎)</span></label>
        <div class='col-sm-8'>
        <!-- {php $type=array('本地服务器','FTP服务器','阿里云oss','七牛云储存','腾讯云储存')} -->
            <!-- {loop $type $k $v} -->
                <label class="think-radio">
                   
                    <input type="radio" name="type" value="{$k}" title="本地服务器" lay-ignore {if $vo['type']==$k}checked{/if}>
                     {$v}
                </label>
            <!-- {/loop} -->
            <div class="help-block" data-storage-type="0">
                文件将存储在本地服务器，请确保服务器的 ./attchment 目录有写入权限
            </div>
            <div class="help-block" data-storage-type="1">
                请填写FTP信息，如不明白请不要尝试，以免图片上传失败.
            </div>
            <div class="help-block" data-storage-type="3">
                若还没有七牛云帐号，请点击
                <a target="_blank" href="https://portal.qiniu.com/signup?code=3lhz6nmnwbple">免费申请10G存储空间</a>,
                请认证检查配置，否则可能上传文件失败。
            </div>
            <div class="help-block" data-storage-type="2">
                若还没有AliOSS存储账号, 请点击 <a target="_blank" href="https://oss.console.aliyun.com">创建AliOSS存储空间</a>,
                请认证检查配置，否则可能上传文件失败。
            </div>
            <div class="help-block" data-storage-type="4">
                若还没有腾讯云存储账号, 请点击 <a target="_blank" href="https://cloud.tencent.com">创建腾讯云存储空间</a>，请认证检查配置，否则可能上传文件失败。
            </div>
        </div>
    </div>
  
    <div data-storage-type='1'>

        <div class="form-group">
            <label class="col-sm-2 control-label label-required">启用SSL连接</label>
            <div class='col-sm-10'>
                <label class="think-radio">
                    <input type="radio" name="ftp[ssl]" value="1" lay-ignore {if $vo['ftp']['ssl']==1}checked{/if}>是
                </label>
                <label class="think-radio">
                    <input type="radio" name="ftp[ssl]" value="0" lay-ignore {if $vo['ftp']['ssl']==0}checked{/if}>否
                </label>
            </div>
            <div class="help-block">
                注意：选择是后，FTP 服务器必须开启了 SSL，一般情况选择否即可
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-2 control-label">FTP服务器地址</label>
            <div class='col-sm-10'>
                <input type="text" name="ftp[host]" required="required" placeholder="请输入FTP服务器地址" value="{$vo['ftp']['host']}" class="layui-input">
                <div class="help-block">
                    可以是 FTP 服务器的 IP 地址或域名
                </div>
            </div>
            
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label">FTP服务器端口</label>
            <div class='col-sm-10'>
                <input type="text" name="ftp[port]" required="required" placeholder="请输入FTP服务器端口" value="{$vo['ftp']['port']}" class="layui-input">
                <div class="help-block">
                    默认为21
                </div>
            </div>
            
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label label-required">FTP帐号</label>
            <div class='col-sm-10'>
                <input type="text" name="ftp[username]" required="required" placeholder="请输入FTP帐号" value="{$vo['ftp']['username']}" class="layui-input">
                <div class="help-block">
                    该帐号必须具有以下权限：读取文件、写入文件、删除文件、创建目录、子目录继承
                </div>
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-2 control-label label-required">FTP密码</label>
            <div class='col-sm-10'>
                <input type="text" name="ftp[password]" required="required" placeholder="请输入FTP密码" value="{$vo['ftp']['password']}" class="layui-input">
                <div class="help-block">
                    基于安全考虑将只显示 FTP 密码为***
                </div>
            </div>
        </div>
        
        <div class="form-group">
            <label class="col-sm-2 control-label label-required">被动模式(pasv)连接</label>
            <div class='col-sm-10'>
               <label class="think-radio">
                    <input type="radio" name="ftp[pasv]" value="1" lay-ignore {if $vo['ftp']['pasv']==1}checked{/if}>是
                </label>
                <label class="think-radio">
                    <input type="radio" name="ftp[pasv]" value="0" lay-ignore {if $vo['ftp']['pasv']==0}checked{/if}>否
                </label>
                <div class="help-block">
                    一般情况下非被动模式即可，如果存在上传失败问题，可尝试打开此设置
                </div>
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-2 control-label label-required">远程附件目录</label>
            <div class='col-sm-10'>
                <input type="text" name="ftp[dir]" required="required" placeholder="请输入远程附件目录" value="{$vo['ftp']['dir']}" class="layui-input">
                <div class="help-block">
                    远程附件目录的绝对路径或相对于 FTP 主目录的相对路径，结尾不要加斜杠 "/" , 例如：/attachment
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label label-required">远程访问URL</label>
            <div class='col-sm-10'>
                <input type="text" name="ftp[url]" required="required" placeholder="请输入远程访问URL" value="{$vo['ftp']['url']}" class="layui-input">
                <div class="help-block">
                   支持 HTTP 和 FTP 协议，结尾不要加斜杠 "/" ; 例如：http://mydomin.com/attachment 如果使用 FTP 协议，FTP 服务器必须支持 PASV 模式，为了安全起见， 使用 FTP 连接的帐号不要设置可写权限和列表权限
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label label-required">FTP传输超时时间</label>
            <div class='col-sm-10'>
                <input type="text" name="ftp[overtime]" required="required" placeholder="请输入FTP传输超时时间" value="{$vo['ftp']['overtime']}" class="layui-input">
                <div class="help-block">
                    单位：秒，0为服务器默认
                </div>
            </div>
        </div>


    </div>
      

    <div data-storage-type='2'>
        <div class="form-group">
            <label class="col-sm-2 control-label label-required">内网上传</label>
            <div class='col-sm-10'>
               <label class="think-radio">
                    <input type="radio" name="alioss[internal]" value="1" lay-ignore {if $vo['alioss']['internal']==1}checked{/if}>是
                </label>
                <label class="think-radio">
                    <input type="radio" name="alioss[internal]" value="0" lay-ignore {if $vo['alioss']['internal']==0}checked{/if}>否
                </label>
                <div class="help-block">
                   如果此站点使用的是阿里云ecs服务器，并且服务器与bucket在同一地区（如：同在华北一区），您可以选择通过内网上传的方式上传附件，以加快上传速度、节省带宽。
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label label-required">Bucket选择</label>
            <div class="col-sm-10">
                <select name="alioss[bucket]">
                    <option value="aide123@@oss-cn-beijing" {if $vo['alioss']['bucket']=="aide123"}selected{/if} >aide123@@北京数据中心</option>
                    <option value="kmzy@@oss-cn-qingdao" {if $vo['alioss']['bucket']=="kmzy"}selected{/if}>kmzy@@青岛数据中心</option>
                    <option value="ywk@@oss-cn-qingdao" {if $vo['alioss']['bucket']=="ywk"}selected{/if}>ywk@@青岛数据中心</option>
                </select>
                <div class="help-block">
                   Access Key Secret是您访问阿里云API的密钥，具有该账户完全的权限，请您妥善保管。(填写完Access Key ID 和 Access Key Secret 后请选择bucket)
                </div>
            </div>
            
        </div>
        

        <div class="form-group">
            <label class="col-sm-2 control-label label-required">Access Key ID</label>
            <div class='col-sm-10'>
                <input type="text" name="alioss[key]" required="required"  value="{$vo['alioss']['key']}" class="layui-input">
                <div class="help-block">
                   Access Key ID是您访问阿里云API的密钥，具有该账户完全的权限，请您妥善保管。
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label label-required">Access Key Secret</label>
            <div class='col-sm-10'>
                <input type="text" name="alioss[secret]" required="required" value="{$vo['alioss']['secret']}" class="layui-input">
                <div class="help-block">
                   Access Key Secret是您访问阿里云API的密钥，具有该账户完全的权限，请您妥善保管。(填写完Access Key ID 和 Access Key Secret 后请选择bucket)
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label label-required">自定义URL</label>
            <div class='col-sm-10'>
                <input type="text" name="alioss[overtime]" value="{$vo['alioss']['overtime']}" class="layui-input">
                <div class="help-block">
                    阿里云oss支持用户自定义访问域名，如果自定义了URL则用自定义的URL，如果未自定义，则用系统生成出来的URL。注：自定义url开头加http://或https://结尾不加 ‘/’例：http://abc.com
                </div>
            </div>
        </div>

    </div>

    <div data-storage-type='3'>

        <div class="form-group">
            <label class="col-sm-2 control-label label-required">Accesskey</label>
            <div class='col-sm-10'>
                <input type="text" name="qiniu[accesskey]" value="{$vo['qiniu']['accesskey']}" class="layui-input">
                <div class="help-block">
                   用于签名的公钥
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label label-required">Secretkey</label>
            <div class='col-sm-10'>
                <input type="text" name="qiniu[secretkey]"  value="{$vo['qiniu']['secretkey']}" class="layui-input">
                <div class="help-block">
                   用于签名的私钥
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label label-required">Bucket</label>
            <div class='col-sm-10'>
                <input type="text" name="qiniu[backet]" value="{$vo['qiniu']['bucket']}" class="layui-input">
                <div class="help-block">
                    请保证bucket为可公共读取的
                </div>
            </div>
        </div>
         <div class="form-group">
            <label class="col-sm-2 control-label label-required">Url</label>
            <div class='col-sm-10'>
                <input type="text" name="qiniu[url]"  value="{$vo['qiniu']['url']}" class="layui-input">
                <div class="help-block">
                   七牛支持用户自定义访问域名。注：url开头加http://或https://结尾不加 ‘/’例：http://abc.com
                </div>
            </div>
        </div>

    </div>


    <div data-storage-type='4'>

        <div class="form-group">
            <label class="col-sm-2 control-label label-required">bucket所在区域</label>
            <div class="col-sm-10">
                <select name="cos[local]">
                    <option value=""   {if $vo['cos']['local']==""}selected{/if}>无</option>
                    <option value="tj" {if $vo['cos']['local']=="tj"}selected{/if}>华北</option>
                    <option value="sh" {if $vo['cos']['local']=="sh"}selected{/if}>华东</option>
                    <option value="gz" {if $vo['cos']['local']=="gz"}selected{/if}>华南</option>
                    <option value="cd" {if $vo['cos']['local']=="cd"}selected{/if}>西南</option>
                    <option value="bj" {if $vo['cos']['local']=="bj"}selected{/if}>北京</option>
                    <option value="sgp"{if $vo['cos']['local']=="sgp"}selected{/if}>新加坡</option>
                    <option value="hk" {if $vo['cos']['local']=="hk"}selected{/if}>香港</option>
                    <option value="ca" {if $vo['cos']['local']=="ca"}selected{/if}>多伦多</option>
                    <option value="ger"{if $vo['cos']['local']=="ger"}selected{/if}>法兰克福</option>
                </select>
                <div class="help-block">
                   选择bucket对应的区域，如果没有选择无
                </div>
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-2 control-label label-required">APPID</label>
            <div class='col-sm-10'>
                <input type="text" name="cos[appid]" required="required" value="{$vo['cos']['appid']}" class="layui-input">
                <div class="help-block">
                   APPID 是您项目的唯一ID
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label label-required">SecretID</label>
            <div class='col-sm-10'>
                <input type="text" name="cos[secretid]" required="required"  value="{$vo['cos']['secretid']}" class="layui-input">
                <div class="help-block">
                   SecretID 是您项目的安全秘钥，具有该账户完全的权限，请妥善保管
                </div>
            </div>
        </div>
         <div class="form-group">
            <label class="col-sm-2 control-label label-required">SecretKEY</label>
            <div class='col-sm-10'>
                <input type="text" name="cos[secretkey]" required="required"  value="{$vo['cos']['secretkey']}" class="layui-input">
                <div class="help-block">
                   SecretKEY 是您项目的安全秘钥，具有该账户完全的权限，请妥善保管
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label label-required">Bucket</label>
            <div class='col-sm-10'>
                <input type="text" name="cos[bucket]"  value="{$vo['cos']['bucket']}" class="layui-input">
                <div class="help-block">
                    请保证bucket为可公共读取的
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label label-required">Url</label>
            <div class='col-sm-10'>
                <input type="text" name="cos[url]"   value="{$vo['cos']['url']}" class="layui-input">
                <div class="help-block">
                   腾讯云支持用户自定义访问域名。注：url开头加http://或https://结尾不加 ‘/’例：http://abc.com
                </div>
            </div>
        </div>

    </div>
  
    <div class="hr-line-dashed"></div>

    <div class="col-sm-4 col-sm-offset-2">
        <div class="layui-form-item text-center">
            <button class="layui-btn" type="submit">保存配置</button>
        </div>
    </div>

 </form>
</div>
<script>
    (function () {
        window.form.render();
        buildForm('{$vo['type']}');
        $('[name=type]').on('click', function () {
            buildForm($('[name=type]:checked').val())
        });

        // 表单显示编译
        function buildForm(value) {
            var $tips = $("[data-storage-type='" + value + "']");
            $("[data-storage-type]").not($tips.show()).hide();
        }
    })();
</script>