Doctrine-Check/templates/step4.html

{% extends "base.html" %}

{% block content %}
<div class="step-container">
    <div class="progress-bar">
        <div class="progress-step completed">1</div>
        <div class="progress-line"></div>
        <div class="progress-step completed">2</div>
        <div class="progress-line"></div>
        <div class="progress-step completed">3</div>
        <div class="progress-line"></div>
        <div class="progress-step active">4</div>
        <div class="progress-line"></div>
        <div class="progress-step">5</div>
    </div>
    
    <h2>4단계: 이단 상세 점검</h2>
    <p class="cult-name">출신 이단: <strong>{{ cult_name }}</strong></p>
    
    <form id="step4Form" class="form-container">
        {% for question in questions %}
        <div class="doctrine-section">
            <div class="form-group">
                <label>{{ question }}</label>
                {% if '기타의견란' in question or '기타의견' in question %}
                <p class="help-text">※ 이 문항은 아래 "기타의견"란에 "{{ loop.index }}번: "으로 시작하여 답변해주세요.</p>
                {% else %}
                {% set q_key = 'q' ~ loop.index %}
                <div class="radio-group">
                    <label><input type="radio" name="q{{ loop.index }}" value="예" {% if specific_cult_doctrine.get(q_key) == '예' %}checked{% endif %} required> 예</label>
                    <label><input type="radio" name="q{{ loop.index }}" value="아니오" {% if specific_cult_doctrine.get(q_key) == '아니오' %}checked{% endif %}> 아니오</label>
                    <label><input type="radio" name="q{{ loop.index }}" value="모르겠습니다" {% if specific_cult_doctrine.get(q_key) == '모르겠습니다' %}checked{% endif %}> 모르겠습니다</label>
                </div>
                {% endif %}
            </div>
        </div>
        {% endfor %}
        
        <div class="doctrine-section">
            <div class="form-group">
                <label for="other_opinions">기타의견</label>
                <textarea id="other_opinions" name="other_opinions" rows="5" placeholder="기타의견란에 작성해야 하는 문항 답변 및 기타 의견을 작성해주세요. (예: 3번: ... 또는 8번: ...)">{{ specific_cult_doctrine.get('other_opinions', '') }}</textarea>
            </div>
        </div>
        
        <div class="form-actions">
            <button type="button" class="btn btn-secondary" onclick="window.location.href='/step3'">이전</button>
            <button type="submit" class="btn btn-primary">다음 단계</button>
        </div>
    </form>
</div>
{% endblock %}

{% block scripts %}
<script>
document.getElementById('step4Form').addEventListener('submit', async function(e) {
    e.preventDefault();
    
    const formData = new FormData(this);
    const data = Object.fromEntries(formData);
    
    // 기타의견란에 작성해야 하는 문항 번호 찾기
    const requiredQuestions = [];
    const questionLabels = document.querySelectorAll('.doctrine-section .form-group label');
    questionLabels.forEach((label, index) => {
        const questionText = label.textContent.trim();
        if (questionText.includes('기타의견란') || questionText.includes('기타의견')) {
            // 문항 번호 추출 (예: "3. 예수님이..." -> 3)
            const match = questionText.match(/^(\d+)\./);
            if (match) {
                requiredQuestions.push(parseInt(match[1]));
            }
        }
    });
    
    // 기타의견란 검증
    if (requiredQuestions.length > 0) {
        const otherOpinions = data.other_opinions || '';
        if (!otherOpinions.trim()) {
            const questionNums = requiredQuestions.map(n => n + '번').join(', ');
            alert(`${questionNums} 문항은 기타의견란에 작성해주세요.`);
            document.getElementById('other_opinions').focus();
            return;
        }
        
        // 각 필수 문항 번호가 기타의견란에 포함되어 있는지 확인
        const missingQuestions = [];
        for (const qNum of requiredQuestions) {
            if (!otherOpinions.includes(qNum + '번:')) {
                missingQuestions.push(qNum);
            }
        }
        
        if (missingQuestions.length > 0) {
            const questionNums = missingQuestions.map(n => n + '번').join(', ');
            const questionFormats = missingQuestions.map(n => n + '번:').join(', ');
            alert(`${questionNums} 문항은 기타의견란에 "${questionFormats}"으로 시작하여 답변해주세요.`);
            document.getElementById('other_opinions').focus();
            return;
        }
    }
    
    try {
        const response = await fetch('/step4', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
            },
            body: JSON.stringify(data)
        });
        
        const result = await response.json();
        if (result.success) {
            window.location.href = result.next_step;
        } else {
            alert('오류가 발생했습니다: ' + (result.message || '알 수 없는 오류'));
        }
    } catch (error) {
        alert('오류가 발생했습니다: ' + error.message);
    }
});
</script>
{% endblock %}