{extend name="admin/layout" /}

{block name="main"}
<div class="panel panel-default">
    <div class="panel-heading">
        <h3 class="panel-title">编辑数据</h3>
    </div>
    <div class="panel-body">
        <form onsubmit="return submitForm(this)" method="post" class="form-horizontal" role="form">
            <input type="hidden" name="id" value="{$info.id}"/>
            <div class="form-group">
                <label class="col-sm-3 control-label">所属项目</label>
                <div class="col-sm-9">
                    <select name="pid" class="form-control" required>
                        <option value="">请选择项目</option>
                        {foreach $projects as $vo}
                        <option value="{$vo.pid}" {if $info.pid==$vo.pid}selected{/if}>{$vo.name}</option>
                        {/foreach}
                    </select>
                </div>
            </div>
            <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" required/>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">跳转链接</label>
                <div class="col-sm-9">
                    <input type="text" name="url" value="{$info.url}" placeholder="请输入跳转链接..." class="form-control" required/>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">Logo图片</label>
                <div class="col-sm-9">
                    <input type="file" name="logo" id="logoInput" class="form-control" accept="image/*" onchange="previewImage(this, 'logoPreview')"/>
                    <div id="logoPreview" style="margin-top: 10px; max-width: 200px;">
                        <img 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">
                <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>
{/block}

{block name="script"}
<script>
function previewImage(input, previewId) {
    const preview = document.getElementById(previewId);
    const img = preview.getElementsByTagName('img')[0];
    
    if (input.files && input.files[0]) {
        const reader = new FileReader();
        reader.onload = function(e) {
            img.src = e.target.result;
            img.style.display = 'block';
        }
        reader.readAsDataURL(input.files[0]);
    }
}

function submitForm(form) {
    const formData = new FormData(form);

    // 如果没有选择文件，删除对应的字段
    const logoInput = form.querySelector('input[name="logo"]');
    if (!logoInput.files || !logoInput.files[0]) {
        formData.delete('logo');
    }

    $.ajax({
        url: '/admin/projectDataEdit',
        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/projectData';
                }, 1000);
            } else {
                layer.msg(res.message, {icon: 2});
            }
        }
    });
    return false;
}
</script>
{/block}