{% extends "admin/change_form.html" %}
{% load static %}

{% block extrahead %}
{{ block.super }}
<script src="{% static 'admin/js/vendor/jquery/jquery.min.js' %}"></script>
<script>
(function($) {
    $(document).ready(function() {
        function updatePreview() {
            var formData = {
                'url_front': $('#id_url_front').val(),
                'url_mid': $('#id_url_mid').val(),
                'url_suffix': $('#id_url_suffix').val(),
                'random_length': $('#id_random_length').val(),
                'custom_slug': $('#id_custom_slug').val(),
                'custom_article': $('#id_custom_article').val()
            };
            
            $.get("{% url 'admin:preview_url' %}", formData, function(data) {
                $('#list_url').text(data.list_url);
                $('#detail_url').text(data.detail_url);
            });
        }
        
        // 监听所有相关字段的变化
        $('#id_url_front, #id_url_mid, #id_url_suffix, #id_random_length, #id_custom_slug, #id_custom_article').on('change input', function() {
            updatePreview();
        });
        
        // 初始化时显示预览
        updatePreview();
    });
})(django.jQuery);
(function($) {
    $(document).ready(function() {
        function toggleFieldsets() {
            var frontType = $('#id_url_front').val();
            
            // 控制随机字符配置fieldset
            $('fieldset.random-config').toggle(frontType === 'random');
            
            // 控制自定义路径配置fieldset
            $('fieldset.custom-config').toggle(frontType === 'custom');
        }

        // 初始化隐藏
        toggleFieldsets();
        
        // 绑定change事件
        $('#id_url_front').change(function() {
            toggleFieldsets();
        });
    });
})(django.jQuery);
</script>
{% endblock %}
