{extend name="admin/layout" /}
{block name="title"}编辑项目{/block}
{block name="main"}

<div class="row">
    <div class="col-xs-12 col-sm-8 col-lg-6" style="float: none;">
        <div class="panel panel-info">
            <div class="panel-heading">
                <h3 class="panel-title">编辑项目</h3>
            </div>
            <div class="panel-body">
                <form onsubmit="return projectEdit(this)" method="post" class="form-horizontal" role="form">
                    <input type="hidden" name="id" value="{$info.pid}"/>
                    <div class="form-group">
                        <label class="col-sm-3 control-label">分类标题</label>
                        <div class="col-sm-9">
                            <input type="text" name="name" value="{$info.name}" placeholder="请输入分类标题..." class="form-control"/>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-3 control-label">归属分类</label>
                        <div class="col-sm-9">
                            <select class="form-control" name="cid">
                                {volist name="list" id="vo"}
                                <option value="{$vo.cid}" {if $info.cid==$vo.cid}selected{/if}>{$vo.name}</option>
                                {/volist}
                            </select>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-3 control-label">项目类型</label>
                        <div class="col-sm-9">
                            <select name="type" class="form-control">
                                <option value="1" {if $info.type==1}selected{/if}>默认类型</option>
                                <option value="2" {if $info.type==2}selected{/if}>电玩类型</option>
                            </select>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-3 control-label">跳转地址</label>
                        <div class="col-sm-9">
                            <input type="text" name="link" value="{$info.link}" placeholder="请输入跳转地址..." class="form-control"/>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-3 control-label">是否弹窗</label>
                        <div class="col-sm-9">
                            <select name="popup" class="form-control">
                                <option value="0" {if $info.popup==0}selected{/if}>不弹窗</option>
                                <option value="1" {if $info.popup==1}selected{/if}>弹窗</option>
                            </select>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-3 control-label">项目图片</label>
                        <div class="col-sm-9">
                            <input type="file" name="image" id="imageInput" class="form-control" accept="image/*" onchange="previewImage(this)"/>
                            <div id="imagePreview" style="margin-top: 10px; max-width: 200px;">
                                <img id="preview" src="{$info.logo|default=''}" style="max-width: 100%; {if empty($info.logo)}display: none;{/if}" class="img-thumbnail"/>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-3 control-label">排序</label>
                        <div class="col-sm-9">
                            <input type="text" name="sort" value="{$info.sort}" placeholder="0" class="form-control"/>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-offset-3 col-sm-9">
                            <input type="submit" name="submit" value="确认修改" class="btn btn-primary btn-block"/>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

{/block}

{block name="script"}
<script src="https://s4.zstatic.net/ajax/libs/layer/3.1.1/layer.js"></script>
<script>
    function previewImage(input) {
        const preview = document.getElementById('preview');
        if (input.files && input.files[0]) {
            const reader = new FileReader();
            
            reader.onload = function(e) {
                preview.src = e.target.result;
                preview.style.display = 'block';
            }
            
            reader.readAsDataURL(input.files[0]);
        }
    }

    function projectEdit(form) {
        const formData = new FormData(form);
        
        const imageInput = form.querySelector('input[name="image"]');
        if (!imageInput.files || !imageInput.files[0]) {
            formData.delete('image');
        }
        
        $.ajax({
            url: '/admin/projectEdit',
            type: 'POST',
            data: formData,
            processData: false,
            contentType: false,
            success: function(res) {
                if (res.code === 200) {
                    layer.msg(res.message, {icon: 1});
                    setTimeout(function() {
                        window.location.href = '/admin/project';
                    }, 1500);
                } else {
                    layer.msg(res.message, {icon: 2});
                }
            },
            error: function() {
                layer.msg('服务器错误', {icon: 2});
            }
        });
        return false;
    }
</script>
{/block}