{extend name="layout/default" /}

{block name="content"}
<div class="panel panel-default panel-intro">
    <div class="panel-heading">
        <ul class="nav nav-tabs">
            <li class="active"><a href="#one" data-toggle="tab">平台配置</a></li>
        </ul>
    </div>
    <div class="panel-body">
        <div class="tab-content">
            <div class="tab-pane fade in active" id="one">
                <div class="row">
                    <div class="col-md-12">
                        <div class="form-group">
                            <label>选择平台配置</label>
                            <div class="platform-list">
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="panel panel-default">
                                            <div class="panel-heading">
                                                <h3 class="panel-title">
                                                    <i class="fa fa-wechat text-success"></i>
                                                    微信小程序
                                                </h3>
                                            </div>
                                            <div class="panel-body">
                                                <p class="text-muted">配置微信小程序平台信息，包括AppID、密钥、登录配置等</p>
                                                <div class="row">
                                                    <div class="col-md-6">
                                                        <span class="label label-primary">接入流程</span>
                                                        <ul class="list-unstyled" style="margin-top: 10px;">
                                                            <li><i class="fa fa-check-circle text-success"></i> 微信小程序认证</li>
                                                            <li><i class="fa fa-check-circle text-success"></i> 微信小程序配置</li>
                                                            <li><i class="fa fa-check-circle text-success"></i> 上传小程序</li>
                                                            <li><i class="fa fa-check-circle text-success"></i> 提交审核</li>
                                                        </ul>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <span class="label label-info">配置要素</span>
                                                        <ul class="list-unstyled" style="margin-top: 10px;">
                                                            <li><i class="fa fa-cog"></i> 小程序AppID</li>
                                                            <li><i class="fa fa-cog"></i> 小程序密钥</li>
                                                            <li><i class="fa fa-cog"></i> 登录配置</li>
                                                            <li><i class="fa fa-cog"></i> 支付配置</li>
                                                        </ul>
                                                    </div>
                                                </div>
                                                <div class="text-center" style="margin-top: 15px;">
                                                    <a href="{:url('platform/wechat_mini_program')}" class="btn btn-primary">
                                                        <i class="fa fa-cog"></i> 配置微信小程序
                                                    </a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    
                                    <div class="col-md-6">
                                        <div class="panel panel-default">
                                            <div class="panel-heading">
                                                <h3 class="panel-title">
                                                    <i class="fa fa-music text-info"></i>
                                                    抖音小程序
                                                </h3>
                                            </div>
                                            <div class="panel-body">
                                                <p class="text-muted">配置抖音小程序平台信息，包括AppID、密钥、登录配置等</p>
                                                <div class="row">
                                                    <div class="col-md-6">
                                                        <span class="label label-primary">接入流程</span>
                                                        <ul class="list-unstyled" style="margin-top: 10px;">
                                                            <li><i class="fa fa-check-circle text-success"></i> 抖音开发者认证</li>
                                                            <li><i class="fa fa-check-circle text-success"></i> 抖音小程序配置</li>
                                                            <li><i class="fa fa-check-circle text-success"></i> 上传小程序</li>
                                                            <li><i class="fa fa-check-circle text-success"></i> 提交审核</li>
                                                        </ul>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <span class="label label-info">配置要素</span>
                                                        <ul class="list-unstyled" style="margin-top: 10px;">
                                                            <li><i class="fa fa-cog"></i> 小程序AppID</li>
                                                            <li><i class="fa fa-cog"></i> 小程序密钥</li>
                                                            <li><i class="fa fa-cog"></i> 登录配置</li>
                                                            <li><i class="fa fa-cog"></i> 支付配置</li>
                                                        </ul>
                                                    </div>
                                                </div>
                                                <div class="text-center" style="margin-top: 15px;">
                                                    <a href="{:url('platform/douyin_mini_program')}" class="btn btn-info">
                                                        <i class="fa fa-cog"></i> 配置抖音小程序
                                                    </a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                
                                <div class="row">
                                    <div class="col-md-12">
                                        <div class="alert alert-info">
                                            <i class="fa fa-info-circle"></i>
                                            <strong>注意：</strong>
                                            <ul style="margin-top: 10px;">
                                                <li>配置平台信息前，请确保已在对应平台完成开发者认证</li>
                                                <li>AppID和密钥信息请从对应平台的开发者后台获取</li>
                                                <li>配置完成后，请测试接口调用是否正常</li>
                                                <li>配置信息会自动缓存，修改后会自动清除缓存</li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{/block}