720 lines
26 KiB
PHP
720 lines
26 KiB
PHP
<?php
|
|
$sub_menu = '710300';
|
|
include_once('./_common.php');
|
|
|
|
auth_check_menu($auth, $sub_menu, "w");
|
|
|
|
$st_id = isset($_GET['st_id']) ? (int)$_GET['st_id'] : 0;
|
|
$is_edit = $st_id > 0;
|
|
|
|
$template = array(
|
|
'st_name' => '',
|
|
'st_description' => '',
|
|
'st_category' => '고객서비스',
|
|
'st_is_public' => 1
|
|
);
|
|
|
|
$questions = array();
|
|
|
|
if ($is_edit) {
|
|
$template = sql_fetch("SELECT * FROM survey_templates WHERE st_id = '$st_id'");
|
|
if (!$template) {
|
|
alert('존재하지 않는 템플릿입니다.', 'template_list.php');
|
|
}
|
|
|
|
// 템플릿 질문들 가져오기
|
|
$question_sql = "SELECT * FROM survey_template_questions WHERE st_id = '$st_id' ORDER BY stq_order ASC";
|
|
$question_result = sql_query($question_sql);
|
|
while ($question = sql_fetch_array($question_result)) {
|
|
$questions[] = $question;
|
|
}
|
|
|
|
$g5['title'] = '템플릿 수정';
|
|
} else {
|
|
$g5['title'] = '새 템플릿 만들기';
|
|
}
|
|
|
|
include_once(G5_ADMIN_PATH.'/admin.head.php');
|
|
?>
|
|
|
|
<style>
|
|
.template-form-container {
|
|
max-width: 1000px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.form-header {
|
|
background: linear-gradient(135deg, #AA20FF 0%, #8A1ACC 100%);
|
|
color: white;
|
|
padding: 30px;
|
|
border-radius: 8px 8px 0 0;
|
|
text-align: center;
|
|
}
|
|
|
|
.form-content {
|
|
background: white;
|
|
padding: 30px;
|
|
border-radius: 0 0 8px 8px;
|
|
box-shadow: 0 4px 20px rgba(0,0,0,0.1);
|
|
}
|
|
|
|
.form-section {
|
|
margin-bottom: 40px;
|
|
padding-bottom: 30px;
|
|
border-bottom: 1px solid #e9ecef;
|
|
}
|
|
|
|
.form-section:last-child {
|
|
border-bottom: none;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.section-title {
|
|
font-size: 1.3em;
|
|
font-weight: 600;
|
|
color: #333;
|
|
margin-bottom: 20px;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.section-title i {
|
|
margin-right: 10px;
|
|
color: #AA20FF;
|
|
}
|
|
|
|
.form-group {
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.form-label {
|
|
display: block;
|
|
font-weight: 600;
|
|
color: #333;
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
.form-label.required::after {
|
|
content: ' *';
|
|
color: #dc3545;
|
|
}
|
|
|
|
.form-control {
|
|
width: 100%;
|
|
padding: 12px 15px;
|
|
border: 1px solid #ddd;
|
|
border-radius: 6px;
|
|
font-size: 1em;
|
|
transition: border-color 0.3s;
|
|
}
|
|
|
|
.form-control:focus {
|
|
outline: none;
|
|
border-color: #AA20FF;
|
|
box-shadow: 0 0 0 3px rgba(170, 32, 255, 0.1);
|
|
}
|
|
|
|
.form-select {
|
|
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
|
|
background-position: right 12px center;
|
|
background-repeat: no-repeat;
|
|
background-size: 16px 12px;
|
|
padding-right: 40px;
|
|
height: 43px !important;
|
|
line-height: 41px !important;
|
|
}
|
|
|
|
.questions-container {
|
|
border: 2px dashed #ddd;
|
|
border-radius: 8px;
|
|
padding: 20px;
|
|
min-height: 200px;
|
|
}
|
|
|
|
.question-item {
|
|
background: #fff;
|
|
border: 1px solid #e9ecef;
|
|
border-radius: 8px;
|
|
padding: 20px;
|
|
margin-bottom: 20px;
|
|
position: relative;
|
|
}
|
|
|
|
.question-header {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
.question-number {
|
|
background: #AA20FF;
|
|
color: white;
|
|
width: 30px;
|
|
height: 30px;
|
|
border-radius: 50%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-weight: 600;
|
|
margin-right: 15px;
|
|
font-size: 0.9em;
|
|
}
|
|
|
|
.question-actions {
|
|
margin-left: auto;
|
|
display: flex;
|
|
gap: 10px;
|
|
}
|
|
|
|
.btn-sm {
|
|
padding: 6px 12px;
|
|
font-size: 0.85em;
|
|
border-radius: 4px;
|
|
border: none;
|
|
cursor: pointer;
|
|
transition: all 0.3s;
|
|
}
|
|
|
|
.btn-danger {
|
|
background: #dc3545;
|
|
color: white;
|
|
}
|
|
|
|
.btn-danger:hover {
|
|
background: #c82333;
|
|
}
|
|
|
|
.btn-secondary {
|
|
background: #6c757d;
|
|
color: white;
|
|
}
|
|
|
|
.btn-secondary:hover {
|
|
background: #545b62;
|
|
}
|
|
|
|
.form-row {
|
|
display: flex;
|
|
gap: 15px;
|
|
align-items: end;
|
|
}
|
|
|
|
.form-row .form-group {
|
|
flex: 1;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.options-container {
|
|
margin-top: 15px;
|
|
}
|
|
|
|
.option-item {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: 10px;
|
|
gap: 10px;
|
|
}
|
|
|
|
.option-input {
|
|
flex: 1;
|
|
}
|
|
|
|
.btn-add-option {
|
|
background: #28a745;
|
|
color: white;
|
|
border: none;
|
|
padding: 8px 15px;
|
|
border-radius: 4px;
|
|
cursor: pointer;
|
|
font-size: 0.9em;
|
|
}
|
|
|
|
.btn-add-option:hover {
|
|
background: #218838;
|
|
}
|
|
|
|
.btn-add-question {
|
|
width: 100%;
|
|
padding: 15px;
|
|
background: #AA20FF;
|
|
color: white;
|
|
border: none;
|
|
border-radius: 6px;
|
|
font-size: 1em;
|
|
font-weight: 500;
|
|
cursor: pointer;
|
|
transition: background 0.3s;
|
|
}
|
|
|
|
.btn-add-question:hover {
|
|
background: #8A1ACC;
|
|
}
|
|
|
|
.form-actions {
|
|
text-align: center;
|
|
padding-top: 30px;
|
|
border-top: 1px solid #e9ecef;
|
|
margin-top: 30px;
|
|
}
|
|
|
|
.btn-primary {
|
|
background: #AA20FF;
|
|
color: white;
|
|
padding: 12px 30px;
|
|
border: none;
|
|
border-radius: 6px;
|
|
font-size: 1em;
|
|
font-weight: 500;
|
|
cursor: pointer;
|
|
margin: 0 10px;
|
|
transition: background 0.3s;
|
|
}
|
|
|
|
.btn-primary:hover {
|
|
background: #8A1ACC;
|
|
}
|
|
|
|
.btn-outline {
|
|
background: transparent;
|
|
color: #6c757d;
|
|
border: 1px solid #6c757d;
|
|
}
|
|
|
|
.btn-outline:hover {
|
|
background: #6c757d;
|
|
color: white;
|
|
}
|
|
|
|
.empty-questions {
|
|
text-align: center;
|
|
color: #666;
|
|
padding: 40px 20px;
|
|
}
|
|
|
|
.empty-questions i {
|
|
font-size: 3em;
|
|
margin-bottom: 15px;
|
|
opacity: 0.3;
|
|
}
|
|
|
|
/* 반응형 */
|
|
@media (max-width: 768px) {
|
|
.template-form-container {
|
|
margin: 10px;
|
|
}
|
|
|
|
.form-content {
|
|
padding: 20px;
|
|
}
|
|
|
|
.form-row {
|
|
flex-direction: column;
|
|
gap: 0;
|
|
}
|
|
|
|
.form-row .form-group {
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
.question-header {
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 10px;
|
|
}
|
|
|
|
.question-actions {
|
|
margin-left: 0;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<div class="template-form-container">
|
|
<div class="form-header">
|
|
<h1><i class="fa fa-magic"></i> <?php echo $is_edit ? '템플릿 수정' : '새 템플릿 만들기'; ?></h1>
|
|
<p>설문 템플릿을 만들어 다른 사용자들과 공유하세요</p>
|
|
</div>
|
|
|
|
<div class="form-content">
|
|
<form name="templateForm" method="post" action="template_form_update.php">
|
|
<?php if ($is_edit): ?>
|
|
<input type="hidden" name="st_id" value="<?php echo $st_id; ?>">
|
|
<input type="hidden" name="mode" value="update">
|
|
<?php else: ?>
|
|
<input type="hidden" name="mode" value="insert">
|
|
<?php endif; ?>
|
|
|
|
<div class="form-section">
|
|
<h2 class="section-title">
|
|
<i class="fa fa-info-circle"></i> 기본 정보
|
|
</h2>
|
|
|
|
<div class="form-group">
|
|
<label class="form-label required">템플릿 이름</label>
|
|
<input type="text" name="st_name" class="form-control"
|
|
value="<?php echo htmlspecialchars($template['st_name']); ?>"
|
|
placeholder="템플릿 이름을 입력하세요" required>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="form-label">템플릿 설명</label>
|
|
<textarea name="st_description" class="form-control" rows="3"
|
|
placeholder="템플릿에 대한 설명을 입력하세요"><?php echo htmlspecialchars($template['st_description']); ?></textarea>
|
|
</div>
|
|
|
|
<div class="form-row">
|
|
<div class="form-group">
|
|
<label class="form-label required">카테고리</label>
|
|
<select name="st_category" class="form-control form-select" required>
|
|
<option value="고객서비스"<?php echo $template['st_category'] == '고객서비스' ? ' selected' : ''; ?>>고객서비스</option>
|
|
<option value="마케팅"<?php echo $template['st_category'] == '마케팅' ? ' selected' : ''; ?>>마케팅</option>
|
|
<option value="제품개발"<?php echo $template['st_category'] == '제품개발' ? ' selected' : ''; ?>>제품개발</option>
|
|
<option value="인사관리"<?php echo $template['st_category'] == '인사관리' ? ' selected' : ''; ?>>인사관리</option>
|
|
<option value="기타"<?php echo $template['st_category'] == '기타' ? ' selected' : ''; ?>>기타</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="form-label">공개 설정</label>
|
|
<select name="st_is_public" class="form-control form-select">
|
|
<option value="1"<?php echo $template['st_is_public'] == 1 ? ' selected' : ''; ?>>공개</option>
|
|
<option value="0"<?php echo $template['st_is_public'] == 0 ? ' selected' : ''; ?>>비공개</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-section">
|
|
<h2 class="section-title">
|
|
<i class="fa fa-question-circle"></i> 질문 구성
|
|
</h2>
|
|
|
|
<div class="questions-container" id="questionsContainer">
|
|
<?php if (count($questions) > 0): ?>
|
|
<?php foreach ($questions as $index => $question): ?>
|
|
<div class="question-item" data-index="<?php echo $index; ?>">
|
|
<div class="question-header">
|
|
<div class="question-number"><?php echo $index + 1; ?></div>
|
|
<div style="flex: 1;">질문 <?php echo $index + 1; ?></div>
|
|
<div class="question-actions">
|
|
<button type="button" class="btn-sm btn-secondary" onclick="moveQuestion(<?php echo $index; ?>, 'up')">
|
|
<i class="fa fa-arrow-up"></i>
|
|
</button>
|
|
<button type="button" class="btn-sm btn-secondary" onclick="moveQuestion(<?php echo $index; ?>, 'down')">
|
|
<i class="fa fa-arrow-down"></i>
|
|
</button>
|
|
<button type="button" class="btn-sm btn-danger" onclick="removeQuestion(<?php echo $index; ?>)">
|
|
<i class="fa fa-trash"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<input type="hidden" name="questions[<?php echo $index; ?>][stq_id]" value="<?php echo $question['stq_id']; ?>">
|
|
|
|
<div class="form-row">
|
|
<div class="form-group">
|
|
<label class="form-label">질문 제목</label>
|
|
<input type="text" name="questions[<?php echo $index; ?>][stq_title]" class="form-control"
|
|
value="<?php echo htmlspecialchars($question['stq_title']); ?>"
|
|
placeholder="질문을 입력하세요" required>
|
|
</div>
|
|
|
|
<div class="form-group" style="min-width: 150px;">
|
|
<label class="form-label">질문 유형</label>
|
|
<select name="questions[<?php echo $index; ?>][stq_type]" class="form-control form-select question-type-select"
|
|
onchange="toggleOptions(<?php echo $index; ?>)">
|
|
<option value="text"<?php echo $question['stq_type'] == 'text' ? ' selected' : ''; ?>>단답형</option>
|
|
<option value="textarea"<?php echo $question['stq_type'] == 'textarea' ? ' selected' : ''; ?>>장문형</option>
|
|
<option value="radio"<?php echo $question['stq_type'] == 'radio' ? ' selected' : ''; ?>>객관식(단일)</option>
|
|
<option value="checkbox"<?php echo $question['stq_type'] == 'checkbox' ? ' selected' : ''; ?>>객관식(다중)</option>
|
|
<option value="select"<?php echo $question['stq_type'] == 'select' ? ' selected' : ''; ?>>드롭다운</option>
|
|
<option value="rating"<?php echo $question['stq_type'] == 'rating' ? ' selected' : ''; ?>>평점</option>
|
|
<option value="date"<?php echo $question['stq_type'] == 'date' ? ' selected' : ''; ?>>날짜</option>
|
|
<option value="email"<?php echo $question['stq_type'] == 'email' ? ' selected' : ''; ?>>이메일</option>
|
|
<option value="number"<?php echo $question['stq_type'] == 'number' ? ' selected' : ''; ?>>숫자</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="form-label">질문 설명 (선택사항)</label>
|
|
<textarea name="questions[<?php echo $index; ?>][stq_description]" class="form-control" rows="2"
|
|
placeholder="질문에 대한 추가 설명"><?php echo htmlspecialchars($question['stq_description']); ?></textarea>
|
|
</div>
|
|
|
|
<div class="form-row">
|
|
<div class="form-group">
|
|
<label>
|
|
<input type="checkbox" name="questions[<?php echo $index; ?>][stq_required]" value="1"
|
|
<?php echo $question['stq_required'] ? 'checked' : ''; ?>>
|
|
필수 질문
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<?php if (in_array($question['stq_type'], ['radio', 'checkbox', 'select'])): ?>
|
|
<div class="options-container" id="optionsContainer<?php echo $index; ?>">
|
|
<label class="form-label">선택 옵션</label>
|
|
<?php
|
|
$options = json_decode($question['stq_options'], true);
|
|
if (is_array($options)):
|
|
foreach ($options as $opt_index => $option):
|
|
?>
|
|
<div class="option-item">
|
|
<input type="text" name="questions[<?php echo $index; ?>][options][]"
|
|
class="form-control option-input"
|
|
value="<?php echo htmlspecialchars($option); ?>"
|
|
placeholder="옵션을 입력하세요">
|
|
<button type="button" class="btn-sm btn-danger" onclick="removeOption(this)">
|
|
<i class="fa fa-times"></i>
|
|
</button>
|
|
</div>
|
|
<?php
|
|
endforeach;
|
|
endif;
|
|
?>
|
|
<button type="button" class="btn-add-option" onclick="addOption(<?php echo $index; ?>)">
|
|
<i class="fa fa-plus"></i> 옵션 추가
|
|
</button>
|
|
</div>
|
|
<?php endif; ?>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
<?php else: ?>
|
|
<div class="empty-questions" id="emptyQuestions">
|
|
<i class="fa fa-question-circle"></i>
|
|
<h3>질문을 추가해주세요</h3>
|
|
<p>아래 버튼을 클릭하여 첫 번째 질문을 만들어보세요.</p>
|
|
</div>
|
|
<?php endif; ?>
|
|
</div>
|
|
|
|
<button type="button" class="btn-add-question" onclick="addQuestion()">
|
|
<i class="fa fa-plus"></i> 질문 추가
|
|
</button>
|
|
</div>
|
|
|
|
<div class="form-actions">
|
|
<button type="submit" class="btn-primary">
|
|
<i class="fa fa-save"></i> <?php echo $is_edit ? '템플릿 수정' : '템플릿 저장'; ?>
|
|
</button>
|
|
<a href="template_list.php" class="btn-primary btn-outline">
|
|
<i class="fa fa-times"></i> 취소
|
|
</a>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
let questionIndex = <?php echo count($questions); ?>;
|
|
|
|
function addQuestion() {
|
|
const container = document.getElementById('questionsContainer');
|
|
const emptyState = document.getElementById('emptyQuestions');
|
|
|
|
if (emptyState) {
|
|
emptyState.remove();
|
|
}
|
|
|
|
const questionHtml = `
|
|
<div class="question-item" data-index="${questionIndex}">
|
|
<div class="question-header">
|
|
<div class="question-number">${questionIndex + 1}</div>
|
|
<div style="flex: 1;">질문 ${questionIndex + 1}</div>
|
|
<div class="question-actions">
|
|
<button type="button" class="btn-sm btn-secondary" onclick="moveQuestion(${questionIndex}, 'up')">
|
|
<i class="fa fa-arrow-up"></i>
|
|
</button>
|
|
<button type="button" class="btn-sm btn-secondary" onclick="moveQuestion(${questionIndex}, 'down')">
|
|
<i class="fa fa-arrow-down"></i>
|
|
</button>
|
|
<button type="button" class="btn-sm btn-danger" onclick="removeQuestion(${questionIndex})">
|
|
<i class="fa fa-trash"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-row">
|
|
<div class="form-group">
|
|
<label class="form-label">질문 제목</label>
|
|
<input type="text" name="questions[${questionIndex}][stq_title]" class="form-control"
|
|
placeholder="질문을 입력하세요" required>
|
|
</div>
|
|
|
|
<div class="form-group" style="min-width: 150px;">
|
|
<label class="form-label">질문 유형</label>
|
|
<select name="questions[${questionIndex}][stq_type]" class="form-control form-select question-type-select"
|
|
onchange="toggleOptions(${questionIndex})">
|
|
<option value="text">단답형</option>
|
|
<option value="textarea">장문형</option>
|
|
<option value="radio">객관식(단일)</option>
|
|
<option value="checkbox">객관식(다중)</option>
|
|
<option value="select">드롭다운</option>
|
|
<option value="rating">평점</option>
|
|
<option value="date">날짜</option>
|
|
<option value="email">이메일</option>
|
|
<option value="number">숫자</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="form-label">질문 설명 (선택사항)</label>
|
|
<textarea name="questions[${questionIndex}][stq_description]" class="form-control" rows="2"
|
|
placeholder="질문에 대한 추가 설명"></textarea>
|
|
</div>
|
|
|
|
<div class="form-row">
|
|
<div class="form-group">
|
|
<label>
|
|
<input type="checkbox" name="questions[${questionIndex}][stq_required]" value="1">
|
|
필수 질문
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
container.insertAdjacentHTML('beforeend', questionHtml);
|
|
questionIndex++;
|
|
updateQuestionNumbers();
|
|
}
|
|
|
|
function removeQuestion(index) {
|
|
if (confirm('이 질문을 삭제하시겠습니까?')) {
|
|
const questionItem = document.querySelector(`[data-index="${index}"]`);
|
|
questionItem.remove();
|
|
|
|
const remainingQuestions = document.querySelectorAll('.question-item');
|
|
if (remainingQuestions.length === 0) {
|
|
const container = document.getElementById('questionsContainer');
|
|
container.innerHTML = `
|
|
<div class="empty-questions" id="emptyQuestions">
|
|
<i class="fa fa-question-circle"></i>
|
|
<h3>질문을 추가해주세요</h3>
|
|
<p>아래 버튼을 클릭하여 첫 번째 질문을 만들어보세요.</p>
|
|
</div>
|
|
`;
|
|
} else {
|
|
updateQuestionNumbers();
|
|
}
|
|
}
|
|
}
|
|
|
|
function moveQuestion(index, direction) {
|
|
const questionItem = document.querySelector(`[data-index="${index}"]`);
|
|
const container = document.getElementById('questionsContainer');
|
|
|
|
if (direction === 'up' && questionItem.previousElementSibling) {
|
|
container.insertBefore(questionItem, questionItem.previousElementSibling);
|
|
} else if (direction === 'down' && questionItem.nextElementSibling) {
|
|
container.insertBefore(questionItem.nextElementSibling, questionItem);
|
|
}
|
|
|
|
updateQuestionNumbers();
|
|
}
|
|
|
|
function updateQuestionNumbers() {
|
|
const questions = document.querySelectorAll('.question-item');
|
|
questions.forEach((question, index) => {
|
|
const numberElement = question.querySelector('.question-number');
|
|
const titleElement = question.querySelector('.question-header > div:nth-child(2)');
|
|
|
|
numberElement.textContent = index + 1;
|
|
titleElement.textContent = `질문 ${index + 1}`;
|
|
});
|
|
}
|
|
|
|
function toggleOptions(index) {
|
|
const questionItem = document.querySelector(`[data-index="${index}"]`);
|
|
const typeSelect = questionItem.querySelector('.question-type-select');
|
|
const selectedType = typeSelect.value;
|
|
|
|
// 기존 옵션 컨테이너 제거
|
|
const existingOptions = questionItem.querySelector('.options-container');
|
|
if (existingOptions) {
|
|
existingOptions.remove();
|
|
}
|
|
|
|
// 객관식 질문인 경우 옵션 컨테이너 추가
|
|
if (['radio', 'checkbox', 'select'].includes(selectedType)) {
|
|
const optionsHtml = `
|
|
<div class="options-container" id="optionsContainer${index}">
|
|
<label class="form-label">선택 옵션</label>
|
|
<div class="option-item">
|
|
<input type="text" name="questions[${index}][options][]"
|
|
class="form-control option-input"
|
|
placeholder="옵션을 입력하세요">
|
|
<button type="button" class="btn-sm btn-danger" onclick="removeOption(this)">
|
|
<i class="fa fa-times"></i>
|
|
</button>
|
|
</div>
|
|
<button type="button" class="btn-add-option" onclick="addOption(${index})">
|
|
<i class="fa fa-plus"></i> 옵션 추가
|
|
</button>
|
|
</div>
|
|
`;
|
|
|
|
questionItem.insertAdjacentHTML('beforeend', optionsHtml);
|
|
}
|
|
}
|
|
|
|
function addOption(questionIndex) {
|
|
const container = document.getElementById(`optionsContainer${questionIndex}`);
|
|
const addButton = container.querySelector('.btn-add-option');
|
|
|
|
const optionHtml = `
|
|
<div class="option-item">
|
|
<input type="text" name="questions[${questionIndex}][options][]"
|
|
class="form-control option-input"
|
|
placeholder="옵션을 입력하세요">
|
|
<button type="button" class="btn-sm btn-danger" onclick="removeOption(this)">
|
|
<i class="fa fa-times"></i>
|
|
</button>
|
|
</div>
|
|
`;
|
|
|
|
addButton.insertAdjacentHTML('beforebegin', optionHtml);
|
|
}
|
|
|
|
function removeOption(button) {
|
|
button.parentElement.remove();
|
|
}
|
|
|
|
// 폼 제출 전 검증
|
|
document.querySelector('form[name="templateForm"]').addEventListener('submit', function(e) {
|
|
const templateName = document.querySelector('input[name="st_name"]').value.trim();
|
|
if (!templateName) {
|
|
alert('템플릿 이름을 입력해주세요.');
|
|
e.preventDefault();
|
|
return;
|
|
}
|
|
|
|
const questions = document.querySelectorAll('.question-item');
|
|
if (questions.length === 0) {
|
|
alert('최소 1개 이상의 질문을 추가해주세요.');
|
|
e.preventDefault();
|
|
return;
|
|
}
|
|
|
|
// 각 질문의 제목 검증
|
|
let hasEmptyTitle = false;
|
|
questions.forEach((question, index) => {
|
|
const titleInput = question.querySelector('input[name*="[stq_title]"]');
|
|
if (!titleInput.value.trim()) {
|
|
alert(`질문 ${index + 1}의 제목을 입력해주세요.`);
|
|
hasEmptyTitle = true;
|
|
return;
|
|
}
|
|
});
|
|
|
|
if (hasEmptyTitle) {
|
|
e.preventDefault();
|
|
return;
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<?php
|
|
include_once(G5_ADMIN_PATH.'/admin.tail.php');
|
|
?>
|