{% extends "base.html" %}

{% block content %}
{% include 'admin_nav.html' %}

<div class="admin-container">
    <div class="admin-content">
        <div class="admin-card">
            <div class="card-header">
                <div class="header-left">
                    <i class="fas fa-shield-alt"></i>
                    <h3>权限管理</h3>
                </div>
            </div>
            
            <form onsubmit="updatePermissions(event)" class="admin-form">
                <div class="form-group">
                    <label>普通管理员权限</label>
                    <div class="permissions-grid">
                        <div class="permission-item">
                            <input type="checkbox" id="upload_permission" name="upload_permission" 
                                   {% if permissions.upload_permission %}checked{% endif %}>
                            <label for="upload_permission">上传图片权限</label>
                        </div>
                        <div class="permission-item">
                            <input type="checkbox" id="delete_permission" name="delete_permission"
                                   {% if permissions.delete_permission %}checked{% endif %}>
                            <label for="delete_permission">删除应用权限</label>
                        </div>
                    </div>
                </div>
                <button type="submit" class="btn-primary">
                    <i class="fas fa-save"></i> 保存设置
                </button>
            </form>
        </div>
    </div>
</div>

<script>
function updatePermissions(event) {
    event.preventDefault();
    const formData = new FormData(event.target);
    
    fetch('{{ url_for("admin_update_permissions") }}', {
        method: 'POST',
        body: JSON.stringify({
            upload_permission: formData.get('upload_permission') === 'on',
            delete_permission: formData.get('delete_permission') === 'on'
        }),
        headers: {
            'Content-Type': 'application/json'
        }
    })
    .then(response => response.json())
    .then(data => {
        if (data.success) {
            showNotification(data.message, 'success');
        } else {
            showNotification(data.error, 'error');
        }
    })
    .catch(error => {
        showNotification('更新权限失败，请重试', 'error');
        console.error('Error:', error);
    });
}
</script>

<style>
.permissions-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    margin-top: 10px;
}

.permission-item {
    display: flex;
    align-items: center;
    gap: 10px;
}

.permission-item input[type="checkbox"] {
    width: 18px;
    height: 18px;
}

.permission-item label {
    font-size: 14px;
    color: #1d1d1f;
    cursor: pointer;
}
</style>
{% endblock %}