baoshuo/S2OJ
baoshuo/S2OJ
1
1
Fork 0
mirror of https://github.com/renbaoshuo/S2OJ.git synced 2024-11-22 06:58:41 +00:00
Code Issues Actions Packages Releases Activity

refactor(submission): two columns layout

Browse Source
This commit is contained in:
Baoshuo Ren 2023-02-17 10:56:29 +08:00
parent 2ed4d368ce
commit 496b87d0a4
Signed by: baoshuo
GPG Key ID: 00CB9680AB29F51A
4 changed files with 325 additions and 137 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

269
web/app/controllers/submission.php
View File

@ -40,14 +40,14 @@ if ($can_see_minor) {
$tid = DB::insert_id(); $tid = DB::insert_id();
redirectTo(UOJSubmission::cur()->getUriForNewTID($tid)); redirectTo(UOJSubmission::cur()->getUriForNewTID($tid));
}; };
$minor_rejudge_form->config['submit_button']['class'] = 'btn btn-sm btn-primary'; $minor_rejudge_form->config['submit_button']['class'] = 'list-group-item list-group-item-action border-start-0 border-end-0 list-group-item-secondary';
$minor_rejudge_form->config['submit_button']['text'] = '偷偷重新测试'; $minor_rejudge_form->config['submit_button']['text'] = '偷偷重新测试';
$minor_rejudge_form->config['submit_container']['class'] = 'd-inline-block text-end'; $minor_rejudge_form->config['submit_container']['class'] = '';
$minor_rejudge_form->runAtServer(); $minor_rejudge_form->runAtServer();
} }
if (UOJSubmission::cur()->isLatest()) { if (UOJSubmission::cur()->isLatest()) {
if (UOJSubmission::cur()->preHackCheck()) { if (UOJSubmission::cur()->preHackCheck() && ($perm['content'] || $perm['manager_view'])) {
$hack_form = new UOJForm('hack'); $hack_form = new UOJForm('hack');
$hack_form->addTextFileInput('input', ['filename' => 'input.txt']); $hack_form->addTextFileInput('input', ['filename' => 'input.txt']);
$hack_form->addCheckBox('use_formatter', [ $hack_form->addCheckBox('use_formatter', [
@ -93,9 +93,9 @@ if (UOJSubmission::cur()->isLatest()) {
$rejudge_form->handle = function () { $rejudge_form->handle = function () {
UOJSubmission::rejudgeById(UOJSubmission::info('id')); UOJSubmission::rejudgeById(UOJSubmission::info('id'));
}; };
$rejudge_form->config['submit_button']['class'] = 'btn btn-sm btn-primary'; $rejudge_form->config['submit_button']['class'] = 'list-group-item list-group-item-action border-start-0 border-end-0 list-group-item-secondary';
$rejudge_form->config['submit_button']['text'] = '重新测试'; $rejudge_form->config['submit_button']['text'] = '重新测试';
$rejudge_form->config['submit_container']['class'] = 'text-end d-inline-block'; $rejudge_form->config['submit_container']['class'] = '';
$rejudge_form->runAtServer(); $rejudge_form->runAtServer();
} }
@ -104,10 +104,10 @@ if (UOJSubmission::cur()->isLatest()) {
$delete_form->handle = function () { $delete_form->handle = function () {
UOJSubmission::cur()->delete(); UOJSubmission::cur()->delete();
}; };
$delete_form->config['submit_button']['class'] = 'btn btn-sm btn-danger'; $delete_form->config['submit_button']['class'] = 'list-group-item list-group-item-action border-start-0 border-end-0 list-group-item-danger';
$delete_form->config['submit_button']['text'] = '删除此提交记录'; $delete_form->config['submit_button']['text'] = '删除此提交记录';
$delete_form->config['submit_container']['class'] = 'text-end d-inline-block'; $delete_form->config['submit_container']['class'] = '';
$delete_form->config['confirm']['smart'] = true; $delete_form->config['confirm']['text'] = '你真的要删除这条提交记录吗？';
$delete_form->succ_href = "/submissions"; $delete_form->succ_href = "/submissions";
$delete_form->runAtServer(); $delete_form->runAtServer();
} }
@ -117,37 +117,90 @@ if (UOJSubmission::cur()->isLatest()) {
$delete_form->handle = function () { $delete_form->handle = function () {
UOJSubmission::cur()->deleteThisMinorVersion(); UOJSubmission::cur()->deleteThisMinorVersion();
}; };
$delete_form->config['submit_button']['class'] = 'btn btn-sm btn-danger'; $delete_form->config['submit_button']['class'] = 'list-group-item list-group-item-action border-start-0 border-end-0 list-group-item-danger';
$delete_form->config['submit_button']['text'] = '删除当前历史记录（保留其他历史记录）'; $delete_form->config['submit_button']['text'] = '删除当前历史记录（保留其他历史记录）';
$delete_form->config['submit_container']['class'] = 'text-end d-inline-block'; $delete_form->config['submit_container']['class'] = '';
$delete_form->config['confirm']['smart'] = true; $delete_form->config['confirm']['text'] = '你真的要删除这条历史记录吗？删除这条历史记录不会影响其他的历史记录。';
$delete_form->succ_href = UOJSubmission::cur()->getUriForLatest(); $delete_form->succ_href = UOJSubmission::cur()->getUriForLatest();
$delete_form->runAtServer(); $delete_form->runAtServer();
} }
} }
?>
<script>
var problem_id = parseInt('<?= $submission['problem_id'] ?>');
</script>
<?php echoUOJPageHeader(UOJLocale::get('problems::submission') . ' #' . $submission['id']) ?>
<h1> $tabs = [];
<?= UOJLocale::get('problems::submission') . ' #' . $submission['id'] ?>
</h1>
<?php UOJSubmission::cur()->echoStatusTable(['show_actual_score' => $perm['score'], 'id_hidden' => true], Auth::user()) ?> if (UOJSubmission::cur()->hasJudged()) {
if ($perm['high_level_details']) {
<?php $tabs['details'] = [
if ($perm['score']) { 'name' => '详细信息',
HTML::echoPanel('mb-3', '测评历史', function () { 'card_body' => false,
UOJSubmissionHistory::cur()->echoTimeline(); 'displayer' => function () use ($perm, $submission_result) {
}); echo '<div class="card-body p-0">';
$styler = new SubmissionDetailsStyler();
if (!$perm['low_level_details']) {
$styler->fade_all_details = true;
$styler->show_small_tip = false;
}
echoJudgmentDetails($submission_result['details'], $styler, 'details');
echo '</div>';
}
];
if ($perm['manager_view'] && !$perm['low_level_details']) {
$tabs['all-details'] = [
'name' => '详细信息（管理员）',
'displayer' => function () use ($submission_result) {
echo '<div class="card-body p-0">';
echoSubmissionDetails($submission_result['details'], 'all_details');
echo '</div>';
},
'card_body' => false,
];
}
} else if ($perm['manager_view']) {
$tabs['manager-details'] = [
'name' => '详细信息（管理员）',
'displayer' => function () use ($submission_result) {
echo '<div class="card-body p-0">';
echoSubmissionDetails($submission_result['details'], 'details');
echo '</div>';
},
'card_body' => false,
];
} else {
// TODO: 您当前无法查看详细信息
}
if ($perm['manager_view'] && isset($submission_result['final_result'])) {
$tabs['final-details'] = [
'name' => '终测结果预测（管理员）',
'displayer' => function () use ($submission_result) {
echo '<div class="card-body p-0">';
echoSubmissionDetails($submission_result['final_result']['details'], 'final_details');
echo '</div>';
},
'card_body' => false,
];
}
} else {
// TODO: move judge_status from UOJSubmission::echoStatusCard() to here
}
if ($perm['content'] || $perm['manager_view']) {
$tabs['source'] = [
'name' => '源代码',
'displayer' => function () {
echo '<div class="list-group list-group-flush">';
UOJSubmission::cur()->echoContent(['list_group' => true]);
echo '</div>';
},
'card_body' => false,
];
} }
?>
<?php
if ($perm['manager_view']) { if ($perm['manager_view']) {
HTML::echoPanel('mb-3', '测评机信息（管理员可见）', function () { $tabs['judger'] = [
'name' => '测评机信息',
'displayer' => function () {
if (empty(UOJSubmission::info('judger'))) { if (empty(UOJSubmission::info('judger'))) {
echo '暂无'; echo '暂无';
} else { } else {
@ -163,69 +216,116 @@ if ($perm['manager_view']) {
echo '<strong>', $judger['display_name'], ': </strong>', $judger['description']; echo '<strong>', $judger['display_name'], ': </strong>', $judger['description'];
} }
} }
}); },
];
}
if (isset($hack_form)) {
$tabs['hack'] = [
'name' => 'Hack!',
'displayer' => function () use (&$hack_form) {
echo <<<EOD
<div class="small text-danger mb-3">
Hack 功能是给大家互相查错用的。请勿故意提交错误代码，然后自己 Hack 自己、贼喊捉贼哦（故意贼喊捉贼会予以封禁处理）。
</div>
EOD;
$hack_form->printHTML();
},
];
} }
?> ?>
<?php if ($perm['content'] || $perm['manager_view']) : ?> <?php echoUOJPageHeader(UOJLocale::get('problems::submission') . ' #' . $submission['id'], [
<div class="copy-button-container"> 'PageContainerClass' => 'container-xxl',
<?php UOJSubmission::cur()->echoContent() ?> ]) ?>
<h1>
<?= UOJLocale::get('problems::submission') . ' #' . $submission['id'] ?>
</h1>
<style>
.submission-layout {
/* display: grid; */
grid-template-columns: minmax(0, calc(100% - 25% - var(--bs-gutter-x))) auto;
grid-template-rows: auto 1fr;
}
.submission-left-col {
grid-column: 1;
grid-row: 1 / span 2;
}
.submission-right-col {
grid-column: 2;
grid-row: 1;
}
.submission-right-control-panel {
grid-column: 2;
grid-row: 2;
}
</style>
<div class="row mt-3 submission-layout d-md-grid">
<div class="submission-right-col">
<?php UOJSubmission::cur()->echoStatusCard(['show_actual_score' => $perm['score'], 'id_hidden' => true], Auth::user()) ?>
</div> </div>
<?php if (isset($hack_form)) : ?> <div class="submission-left-col">
<p class="text-center">
这程序好像有点 Bug，我给组数据试试？ <button id="button-display-hack" type="button" class="btn btn-danger btn-xs">Hack!</button>
</p>
<div class="card mb-3" id="div-form-hack" style="display: none">
<div class="card-header">提交 Hack</div>
<div class="card-body">
<?php $hack_form->printHTML() ?>
</div>
<div class="card-footer bg-transparent small text-center text-danger">
Hack 功能是给大家互相查错用的。请勿故意提交错误代码，然后自己 Hack 自己、贼喊捉贼哦（故意贼喊捉贼会予以封禁处理）
</div>
</div>
<script type="text/javascript">
$(document).ready(function() {
$('#button-display-hack').click(function() {
$('#div-form-hack').toggle('fast');
});
});
</script>
<?php endif ?>
<?php endif ?>
<?php <?php
if (UOJSubmission::cur()->hasJudged()) { if ($perm['score']) {
if ($perm['high_level_details']) { HTML::echoPanel('mb-3', '测评历史', function () {
HTML::echoPanel(['card' => 'mb-3', 'body' => 'p-0'], UOJLocale::get('details'), function () use ($perm, $submission_result) { UOJSubmissionHistory::cur()->echoTimeline();
$styler = new SubmissionDetailsStyler();
if (!$perm['low_level_details']) {
$styler->fade_all_details = true;
$styler->show_small_tip = false;
}
echoJudgmentDetails($submission_result['details'], $styler, 'details');
if ($perm['manager_view'] && !$perm['low_level_details']) {
echo '<hr />';
echo '<h4 class="text-info">全部详细信息（管理员可见）</h4>';
echoSubmissionDetails($submission_result['details'], 'all_details');
}
}); });
} else if ($perm['manager_view']) {
HTML::echoPanel(['card' => 'mb-3', 'body' => 'p-0'], '详细（管理员可见）', function () use ($submission_result) {
echoSubmissionDetails($submission_result['details'], 'details');
});
}
if ($perm['manager_view'] && isset($submission_result['final_result'])) {
HTML::echoPanel(['card' => 'mb-3', 'body' => 'p-0'], '终测结果预测（管理员可见）', function () use ($submission_result) {
echoSubmissionDetails($submission_result['final_result']['details'], 'final_details');
});
}
} }
?> ?>
<div class="d-flex gap-2 justify-content-end"> <div class="card mb-3">
<div class="card-header">
<ul class="nav nav-tabs card-header-tabs" role="tablist">
<?php $idx = 0; ?>
<?php foreach ($tabs as $id => $tab) : ?>
<li class="nav-item">
<a class="nav-link <?php if ($idx++ == 0) : ?>active<?php endif ?>" href="#<?= $id ?>" data-bs-toggle="tab" data-bs-target="#<?= $id ?>">
<?= $tab['name'] ?>
</a>
</li>
<?php endforeach ?>
</ul>
</div>
<div class="tab-content">
<?php $idx = 0; ?>
<?php foreach ($tabs as $id => $tab) : ?>
<div class="tab-pane fade <?php if ($idx++ == 0) : ?>active show<?php endif ?>" id="<?= $id ?>" role="tabpanel">
<?php if (!isset($tab['card_body']) || $tab['card_body']) : ?>
<div class="card-body">
<?php endif ?>
<?php $tab['displayer']() ?>
<?php if (!isset($tab['card_body']) || $tab['card_body']) : ?>
</div>
<?php endif ?>
</div>
<?php endforeach ?>
</div>
</div>
</div>
<div class="submission-right-control-panel">
<?php if (
isset($minor_rejudge_form) ||
isset($rejudge_form) ||
isset($delete_form)
) : ?>
<div class="card mb-3">
<div class="card-header fw-bold">
操作
</div>
<div class="list-group list-group-flush">
<?php if (isset($minor_rejudge_form)) : ?> <?php if (isset($minor_rejudge_form)) : ?>
<?php $minor_rejudge_form->printHTML() ?> <?php $minor_rejudge_form->printHTML() ?>
<?php endif ?> <?php endif ?>
@ -238,5 +338,10 @@ if (UOJSubmission::cur()->hasJudged()) {
<?php $delete_form->printHTML() ?> <?php $delete_form->printHTML() ?>
<?php endif ?> <?php endif ?>
</div> </div>
</div>
<?php endif ?>
</div>
</div>
<?php echoUOJPageFooter() ?> <?php echoUOJPageFooter() ?>

8
web/app/libs/uoj-html-lib.php
View File

@ -484,7 +484,7 @@ class JudgmentDetailsPrinter {
echo '<div class="col-sm-2">'; echo '<div class="col-sm-2">';
echo '<i class="bi bi-clipboard-check"></i> ', $subtask_score, ' pts'; echo '<i class="bi bi-clipboard-check"></i> ', $subtask_score, ' pts';
echo '</div>'; echo '</div>';
echo '<div class="col-sm-2 uoj-status-text">'; echo '<div class="col-sm uoj-status-text">';
echo $this->styler->getTestInfoIcon($subtask_info); echo $this->styler->getTestInfoIcon($subtask_info);
echo htmlspecialchars($subtask_info); echo htmlspecialchars($subtask_info);
echo '</div>'; echo '</div>';
@ -561,12 +561,12 @@ class JudgmentDetailsPrinter {
echo '<div class="col-sm-2">'; echo '<div class="col-sm-2">';
echo '<i class="bi bi-clipboard-check"></i> ', $test_score, ' pts'; echo '<i class="bi bi-clipboard-check"></i> ', $test_score, ' pts';
echo '</div>'; echo '</div>';
echo '<div class="col-sm-2 uoj-status-text">'; echo '<div class="col-sm uoj-status-text">';
echo $this->styler->getTestInfoIcon($test_info); echo $this->styler->getTestInfoIcon($test_info);
echo htmlspecialchars($test_info); echo htmlspecialchars($test_info);
echo '</div>'; echo '</div>';
} else { } else {
echo '<div class="col-sm-4 uoj-status-text">'; echo '<div class="col-sm uoj-status-text">';
echo $this->styler->getTestInfoIcon($test_info); echo $this->styler->getTestInfoIcon($test_info);
echo htmlspecialchars($test_info); echo htmlspecialchars($test_info);
echo '</div>'; echo '</div>';
@ -624,7 +624,7 @@ class JudgmentDetailsPrinter {
echo '<h4 class="card-title">', 'Custom Test', '</h4>'; echo '<h4 class="card-title">', 'Custom Test', '</h4>';
echo '</div>'; echo '</div>';
echo '<div class="col-sm-4 uoj-status-text">'; echo '<div class="col-sm uoj-status-text">';
echo $this->styler->getTestInfoIcon($test_info); echo $this->styler->getTestInfoIcon($test_info);
echo htmlspecialchars($test_info); echo htmlspecialchars($test_info);
echo '</div>'; echo '</div>';

67
web/app/models/UOJSubmission.php
View File

@ -536,7 +536,7 @@ class UOJSubmission {
} }
echo '</tr>'; echo '</tr>';
if ($show_status_details) { if ($show_status_details) {
echo '<tr id="', "status_details_{$this->info['id']}", '" class="info">'; echo '<tr id="', "status_details_{$this->info['id']}", '" class="">';
echo $this->getStatusDetailsHTML(); echo $this->getStatusDetailsHTML();
echo '</tr>'; echo '</tr>';
echo '<script type="text/javascript">update_judgement_status_details(' . $this->info['id'] . ')</script>'; echo '<script type="text/javascript">update_judgement_status_details(' . $this->info['id'] . ')</script>';
@ -583,6 +583,71 @@ class UOJSubmission {
echo '</div>'; echo '</div>';
} }
public function echoStatusCard(array $cfg, array $viewer = null) {
if (!isset($cfg['show_actual_score'])) {
$cfg['show_actual_score'] = $this->viewerCanSeeScore($viewer);
}
$show_status_details = $this->viewerCanSeeStatusDetailsHTML($viewer);
$rows = [
'id' => 'ID',
'submitter' => UOJLocale::get('problems::submitter'),
'problem' => UOJLocale::get('problems::problem'),
'result' => UOJLocale::get('problems::result'),
'used_time' => UOJLocale::get('problems::used time'),
'used_memory' => UOJLocale::get('problems::used memory'),
'language' => UOJLocale::get('problems::language'),
'tot_size' => UOJLocale::get('problems::file size'),
'submit_time' => UOJLocale::get('problems::submit time'),
'judge_time' => UOJLocale::get('problems::judge time'),
];
echo '<div class="card mb-3">';
echo '<div class="card-body vstack gap-2">';
foreach ($rows as $id => $name) {
if (!isset($cfg["{$id}_hidden"])) {
switch ($id) {
case 'submitter':
$submitter = UOJUser::query($this->info['submitter']);
echo '<div class="pb-2">';
echo HTML::empty_tag('img', [
'src' => HTML::avatar_addr($submitter, 64),
'class' => 'uoj-user-avatar rounded me-2',
'style' => 'width: 2rem; height: 2rem;',
]);
echo UOJUser::getLink($submitter);
echo '</div>';
break;
default:
echo '<div class="d-flex justify-content-between align-items-center">';
echo '<span class="flex-shrink-0">', $name, '</span>';
echo '<span class="text-end">', $this->echoStatusBarTD($id, $cfg), '</span>';
echo '</div>';
break;
}
}
}
echo '</div>';
echo '</div>';
if ($show_status_details) {
echo '<div class="card">';
echo '<table>';
echo '<tr id="', "status_details_{$this->info['id']}", '" class="">';
echo $this->getStatusDetailsHTML();
echo '</tr>';
echo '<script type="text/javascript">update_judgement_status_details(' . $this->info['id'] . ')</script>';
echo '</table>';
echo '</div>';
}
}
public function delete() { public function delete() {
unlink(UOJContext::storagePath() . $this->getContent('file_name')); unlink(UOJContext::storagePath() . $this->getContent('file_name'));
DB::delete([ DB::delete([

50
web/app/models/UOJSubmissionLikeTrait.php
View File

@ -136,20 +136,38 @@ trait UOJSubmissionLikeTrait {
return isset($content[$key]) ? $content[$key] : null; return isset($content[$key]) ? $content[$key] : null;
} }
public function echoContent() { public function echoContent($cfg = []) {
$cfg += [
'list_group' => false,
];
$content = $this->getContent(); $content = $this->getContent();
if (!$content) { if (!$content) {
return false; return false;
} }
$card_class = 'card mb-3';
$card_header_class = 'card-header fw-bold';
$card_body_class = 'card-body';
$card_footer_class = 'card-footer';
if ($cfg['list_group']) {
$card_class = 'list-group-item';
$card_header_class = 'fw-bold mb-2';
$card_body_class = '';
$card_footer_class = 'text-end mt-2';
}
if ($content['remote_submission_id']) { if ($content['remote_submission_id']) {
echo <<<EOD echo <<<EOD
<div class="card mb-3"> <div class="{$card_class}">
<div class="card-header fw-bold"> <div class="{$card_header_class}">
远程提交 远程提交
</div> </div>
<div class="card-body"> <div class="{$card_body_class}">
远程提交 ID：{$content['remote_submission_id']} 远程提交 ID: {$content['remote_submission_id']}
<br>
源代码请在「详细信息」选项卡查看。
</div> </div>
</div> </div>
EOD; EOD;
@ -160,11 +178,11 @@ trait UOJSubmissionLikeTrait {
$zip_file = new ZipArchive(); $zip_file = new ZipArchive();
if ($zip_file->open(UOJContext::storagePath() . $content['file_name'], ZipArchive::RDONLY) !== true) { if ($zip_file->open(UOJContext::storagePath() . $content['file_name'], ZipArchive::RDONLY) !== true) {
echo <<<EOD echo <<<EOD
<div class="card mb-3"> <div class="{$card_class}">
<div class="card-header text-bg-danger fw-bold"> <div class="{$card_header_class}">
提交内容 提交内容
</div> </div>
<div class="card-body"> <div class="{$card_body_class} text-danger">
木有 木有
</div> </div>
</div> </div>
@ -195,14 +213,14 @@ trait UOJSubmissionLikeTrait {
$footer_text .= UOJLang::getLanguageDisplayName($file_language); $footer_text .= UOJLang::getLanguageDisplayName($file_language);
$sh_class = UOJLang::getLanguagesCSSClass($file_language); $sh_class = UOJLang::getLanguagesCSSClass($file_language);
echo <<<EOD echo <<<EOD
<div class="card mb-3"> <div class="{$card_class}">
<div class="card-header fw-bold"> <div class="{$card_header_class}">
{$req['name']} {$req['name']}
</div> </div>
<div class="card-body"> <div class="{$card_body_class} copy-button-container">
<pre class="mb-0"><code class="$sh_class bg-light rounded p-3">{$file_content}\n</code></pre> <pre class="mb-0"><code class="$sh_class bg-light rounded p-3">{$file_content}\n</code></pre>
</div> </div>
<div class="card-footer">$footer_text</div> <div class="{$card_footer_class}">$footer_text</div>
</div> </div>
EOD; EOD;
} elseif ($req['type'] == "text") { } elseif ($req['type'] == "text") {
@ -215,14 +233,14 @@ trait UOJSubmissionLikeTrait {
$file_content = uojTextEncode($file_content, array('allow_CR' => true, 'html_escape' => true)); $file_content = uojTextEncode($file_content, array('allow_CR' => true, 'html_escape' => true));
$footer_text = UOJLocale::get('problems::text file'); $footer_text = UOJLocale::get('problems::text file');
echo <<<EOD echo <<<EOD
<div class="card mb-3"> <div class="{$card_class}">
<div class="card-header"> <div class="{$card_header_class}">
{$req['file_name']} {$req['file_name']}
</div> </div>
<div class="card-body"> <div class="{$card_body_class}">
<pre class="mb-0 bg-light rounded p-3">\n{$file_content}\n</pre> <pre class="mb-0 bg-light rounded p-3">\n{$file_content}\n</pre>
</div> </div>
<div class="card-footer">$footer_text</div> <div class="{$card_footer_class}">{$footer_text}</div>
</div> </div>
EOD; EOD;
} }