From b3113238a2851b9871c55a8f2f82e86b439b1f49 Mon Sep 17 00:00:00 2001
From: Baoshuo <i@baoshuo.ren>
Date: Sun, 5 Feb 2023 15:37:08 +0800
Subject: [PATCH] feat(problem/manage/data): problem.conf preview

---
 .../controllers/problem_data_configure.php    | 32 +++++++++++++-
 web/app/models/UOJProblemConfigure.php        | 15 +++++--
 web/js/uoj.js                                 | 44 +++++++++++++++++--
 3 files changed, 83 insertions(+), 8 deletions(-)

diff --git a/web/app/controllers/problem_data_configure.php b/web/app/controllers/problem_data_configure.php
index e78f9b2..83a96c7 100644
--- a/web/app/controllers/problem_data_configure.php
+++ b/web/app/controllers/problem_data_configure.php
@@ -9,6 +9,19 @@ UOJProblem::cur()->userCanManage(Auth::user()) || UOJResponse::page403();
 
 $problem_configure = new UOJProblemConfigure(UOJProblem::cur());
 $problem_configure->runAtServer();
+$problem_conf_str = '';
+
+foreach ($problem_configure->problem_conf->conf as $key => $val) {
+	if ($key == 'use_builtin_judger' && $val == 'off') {
+		continue;
+	}
+
+	if ($key == 'use_builtin_checker' && $val == 'ownchk') {
+		continue;
+	}
+
+	$problem_conf_str .= "{$key} {$val}\n";
+}
 ?>
 
 <?php echoUOJPageHeader('数据配置 - ' . HTML::stripTags(UOJProblem::cur()->getTitle(['with' => 'id']))) ?>
@@ -17,6 +30,23 @@ $problem_configure->runAtServer();
 	<?= UOJProblem::cur()->getTitle(['with' => 'id']) ?> 数据配置
 </h1>
 
-<?php $problem_configure->printHTML() ?>
+<div class="row mt-3">
+	<div class="col-12 col-md-4">
+		<div class="card">
+			<div class="card-header fw-bold">problem.conf 预览</div>
+
+			<div class="card-body p-0" id="problem-conf-preview">
+				<pre class="bg-light mb-0 p-3"><code><?= $problem_conf_str ?></code></pre>
+			</div>
+
+			<div class="card-footer bg-transparent small text-muted">
+				此处显示的 <code>problem.conf</code> 为根据右侧填写的配置信息生成的内容预览，并非题目当前实际配置文件。
+			</div>
+		</div>
+	</div>
+	<div class="col-12 col-md-8 mt-3 mt-md-0">
+		<?php $problem_configure->printHTML() ?>
+	</div>
+</div>
 
 <?php echoUOJPageFooter() ?>
diff --git a/web/app/models/UOJProblemConfigure.php b/web/app/models/UOJProblemConfigure.php
index 4d61ca1..ca3d82b 100644
--- a/web/app/models/UOJProblemConfigure.php
+++ b/web/app/models/UOJProblemConfigure.php
@@ -81,7 +81,7 @@ class UOJProblemConfigure {
 		$this->simple_form->appendHTML(static::getCardHeader('数据配置'));
 		$this->addNumberInput($this->simple_form, 'n_tests', '数据点个数', 10);
 		$this->addNumberInput($this->simple_form, 'n_ex_tests', '额外数据点个数', 0);
-		$this->addNumberInput($this->simple_form, 'n_sample_tests', '样例数据点个数', 0, ['help' => '样例数据点为额外数据点的前 x 个数据点。']);
+		$this->addNumberInput($this->simple_form, 'n_sample_tests', '样例数据点个数', 0, ['help' => '样例数据点为额外数据点中的前 x 个数据点。']);
 		$this->simple_form->appendHTML(static::getCardFooter());
 
 		$this->simple_form->appendHTML(static::getCardHeader('文件配置'));
@@ -99,7 +99,10 @@ class UOJProblemConfigure {
 
 		$this->simple_form->appendHTML(static::getCardHeader('测试点分值', ''));
 		$this->simple_form->appendHTML(<<<EOD
-			<div id="div-point-score-container" class="row gy-3"></div>
+			<details>
+				<summary>展开/收起全部</summary>
+				<div id="div-point-score-container" class="row g-3 mt-0"></div>
+			</details>
 		EOD);
 		$this->simple_form->appendHTML(static::getCardFooter());
 		$this->simple_form->appendHTML(<<<EOD
@@ -121,7 +124,7 @@ class UOJProblemConfigure {
 		EOD);
 
 		$this->simple_form->succ_href = $this->href;
-		$this->simple_form->config['form']['class'] = 'row gy-3 mt-2';
+		$this->simple_form->config['form']['class'] = 'row gy-3';
 		$this->simple_form->config['submit_container']['class'] = 'col-12 text-center mt-3';
 		$this->simple_form->config['back_button']['href'] = $this->href;
 		$this->simple_form->config['back_button']['class'] = 'btn btn-secondary me-2';
@@ -143,6 +146,7 @@ class UOJProblemConfigure {
 		<script>
 			$('#input-{$key}').change(function() {
 				problem_conf['{$key}'] = $(this).val();
+				$('#problem-conf-preview').problem_conf_preview(problem_conf);
 			});
 		</script>
 		EOD);
@@ -165,6 +169,7 @@ class UOJProblemConfigure {
 		<script>
 			$('#input-{$key}').change(function() {
 				problem_conf['{$key}'] = $(this).val();
+				$('#problem-conf-preview').problem_conf_preview(problem_conf);
 			});
 		</script>
 		EOD);
@@ -194,6 +199,7 @@ class UOJProblemConfigure {
 		<script>
 			$('#input-{$key}').change(function() {
 				problem_conf['{$key}'] = $(this).val();
+				$('#problem-conf-preview').problem_conf_preview(problem_conf);
 			});
 		</script>
 		EOD);
@@ -215,6 +221,7 @@ class UOJProblemConfigure {
 		<script>
 			$('#input-{$key}').change(function() {
 				problem_conf['{$key}'] = $(this).val();
+				$('#problem-conf-preview').problem_conf_preview(problem_conf);
 			});
 		</script>
 		EOD);
@@ -250,6 +257,8 @@ class UOJProblemConfigure {
 			} else {
 				if ($val !== '') {
 					$conf[$key] = $val;
+				} else if (isset($conf[$key])) {
+					unset($conf[$key]);
 				}
 			}
 		}
diff --git a/web/js/uoj.js b/web/js/uoj.js
index f53677c..7345e94 100644
--- a/web/js/uoj.js
+++ b/web/js/uoj.js
@@ -1177,6 +1177,35 @@ $.fn.remote_submit_type_group = function(oj, pid, url, submit_type) {
 	});
 }
 
+// problem_configure: print problem.conf
+$.fn.problem_conf_preview = function(problem_conf) {
+	return $(this).each(function() {
+		var keys = Object.keys(problem_conf);
+		var res = '';
+
+		for (var i = 0; i < keys.length; i++) {
+			var key = keys[i];
+			var value = problem_conf[key];
+
+			if (!value) {
+				continue;
+			}
+
+			if (key == 'use_builtin_judger' && value == 'off') {
+				continue;
+			}
+
+			if (key == 'use_builtin_checker' && value == 'ownchk') {
+				continue;
+			}
+
+			res += key + ' ' + value + '\n';
+		}
+
+		$(this).html('<pre class="bg-light mb-0 p-3"><code>' + res + '</code></pre>');
+	});
+}
+
 // problem_configure: point scores
 $.fn.problem_configure_point_scores = function(problem_conf) {
 	return $(this).each(function() {
@@ -1190,17 +1219,24 @@ $.fn.problem_configure_point_scores = function(problem_conf) {
 		}
 
 		for (var i = 1; i <= n_tests; i++) {
-			var input_point_score = $('<input class="form-control uoj-problem-configure-point-score-input" type="number" name="point_score_' + i + '" id="input-point_score_' + i + '" />');
+			var input_point_score = $('<input class="form-control form-control-sm uoj-problem-configure-point-score-input" type="number" name="point_score_' + i + '" id="input-point_score_' + i + '" />');
 
 			if (problem_conf['point_score_' + i]) {
 				input_point_score.val(problem_conf['point_score_' + i]);
 			}
 
+			(function(i){
+				input_point_score.change(function() {
+					problem_conf['point_score_' + i] = $(this).val();
+					$('#problem-conf-preview').problem_conf_preview(problem_conf);
+				});
+			})(i);
+
 			$(this).append(
 				$('<div class="col-sm-6" />').append(
-					$('<div class="row" />')
-						.append($('<div class="col-5" />').append('<label for="input-point_score_' + i + '" class="col-form-label">测试点 #' + i + '</label>'))
-						.append($('<div class="col-7 col-sm-6" />').append(input_point_score))
+					$('<div class="row gx-1" />')
+						.append($('<div class="col-7" />').append('<label for="input-point_score_' + i + '" class="col-form-label col-form-label-sm">测试点 #' + i + '</label>'))
+						.append($('<div class="col-5" />').append(input_point_score))
 				)
 			);
 		}