266 lines
11 KiB
PHP
266 lines
11 KiB
PHP
<?php
|
|
$llm_guidance = isset($llm_guidance) && is_array($llm_guidance)
|
|
? $llm_guidance
|
|
: array('mode' => 'hidden', 'level' => 'none', 'score' => 0, 'auto_fetch' => false);
|
|
$llm_guidance_visible = $llm_guidance['mode'] !== 'hidden';
|
|
$llm_guidance_auto_fetch = isset($llm_guidance_auto_fetch)
|
|
? !!$llm_guidance_auto_fetch
|
|
: !empty($llm_guidance['auto_fetch']);
|
|
$llm_guidance_label = llm_guidance_mode_label($llm_guidance['mode']);
|
|
$llm_guidance_level = isset($llm_guidance['level']) ? $llm_guidance['level'] : 'none';
|
|
$llm_guidance_level_labels = array(
|
|
'low' => '需要补全',
|
|
'medium' => '已有有效尝试',
|
|
'high' => '结构基本完整',
|
|
'none' => '待分析',
|
|
);
|
|
$llm_guidance_level_label = isset($llm_guidance_level_labels[$llm_guidance_level])
|
|
? $llm_guidance_level_labels[$llm_guidance_level]
|
|
: $llm_guidance_level_labels['none'];
|
|
?>
|
|
|
|
<?php if ($llm_guidance_visible): ?>
|
|
<style>
|
|
#llm-section {
|
|
margin-top: 20px;
|
|
margin-bottom: 18px;
|
|
border-left: 4px solid #2185d0;
|
|
}
|
|
#llm-section .llm-section-header {
|
|
display: flex;
|
|
align-items: center;
|
|
transition: background-color 0.15s;
|
|
padding: 4px 8px;
|
|
margin: -4px -8px 0;
|
|
border-radius: 4px;
|
|
}
|
|
#llm-section .llm-section-header:hover { background-color: rgba(33,150,243,0.06); }
|
|
#llm-section .llm-toggle-icon { margin-left: auto !important; transition: transform 0.2s; color: #888; }
|
|
#llm-section .llm-guidance-meta { margin: 10px 0 4px; }
|
|
#llm-section .llm-guidance-meta .label { margin-bottom: 4px; }
|
|
#llm-review-result { word-break: break-word; }
|
|
#llm-review-content > :first-child { margin-top: 0; }
|
|
#llm-review-content > :last-child { margin-bottom: 0; }
|
|
</style>
|
|
|
|
<div class="ui raised segment" id="llm-section"
|
|
data-guidance-mode="<?php echo htmlspecialchars($llm_guidance['mode'], ENT_QUOTES, 'UTF-8'); ?>"
|
|
data-completion-level="<?php echo htmlspecialchars($llm_guidance_level, ENT_QUOTES, 'UTF-8'); ?>">
|
|
<h3 class="ui header llm-section-header" id="llm-toggle" style="cursor:pointer; user-select:none;">
|
|
<i class="magic icon"></i>
|
|
<div class="content">
|
|
AI 指导
|
|
<div class="sub header" id="llm-mode-description"><?php echo htmlspecialchars($llm_guidance_label, ENT_QUOTES, 'UTF-8'); ?></div>
|
|
</div>
|
|
<i class="dropdown icon llm-toggle-icon"></i>
|
|
</h3>
|
|
|
|
<div id="llm-section-body">
|
|
<div class="ui tiny labels llm-guidance-meta">
|
|
<span class="ui blue basic label" id="llm-mode-label"><?php echo htmlspecialchars($llm_guidance_label, ENT_QUOTES, 'UTF-8'); ?></span>
|
|
<span class="ui basic label" id="llm-progress-label"><?php echo htmlspecialchars($llm_guidance_level_label, ENT_QUOTES, 'UTF-8'); ?></span>
|
|
</div>
|
|
|
|
<div id="llm-review-loading" class="ui active inline text loader" style="margin:12px 0;">
|
|
正在定位最值得检查的一处...
|
|
</div>
|
|
<div id="llm-review-result" style="display:none; margin-top:12px;">
|
|
<div class="ui existing segment" id="llm-review-content"></div>
|
|
</div>
|
|
<div id="llm-review-error" style="display:none; margin-top:12px;">
|
|
<div class="ui negative message">
|
|
<p id="llm-review-error-msg"></p>
|
|
<button type="button" class="ui small button" id="llm-review-retry">重新获取</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
(function(){
|
|
var section = document.getElementById('llm-section');
|
|
var header = document.getElementById('llm-toggle');
|
|
var body = document.getElementById('llm-section-body');
|
|
var icon = header ? header.querySelector('.llm-toggle-icon') : null;
|
|
var started = false;
|
|
var finished = false;
|
|
var currentEvent = '';
|
|
|
|
if (!section || !header || !body) return;
|
|
|
|
function setCollapsed(collapsed) {
|
|
body.style.display = collapsed ? 'none' : '';
|
|
if (icon) icon.style.transform = collapsed ? 'rotate(-90deg)' : 'rotate(0deg)';
|
|
}
|
|
|
|
header.addEventListener('click', function(){
|
|
setCollapsed(body.style.display !== 'none');
|
|
});
|
|
|
|
function modeLabel(mode) {
|
|
var labels = {
|
|
flowchart: '流程图引导',
|
|
focused_hint: '聚焦排错',
|
|
output_diff: '输出差异定位',
|
|
judge_output: '评测输出定位',
|
|
compile_location: '编译错误定位'
|
|
};
|
|
return labels[mode] || 'AI 指导';
|
|
}
|
|
|
|
function progressLabel(level) {
|
|
var labels = {
|
|
low: '需要补全',
|
|
medium: '已有有效尝试',
|
|
high: '结构基本完整',
|
|
none: '待分析'
|
|
};
|
|
return labels[level] || labels.none;
|
|
}
|
|
|
|
function applyMeta(data) {
|
|
if (!data) return;
|
|
var label = modeLabel(data.mode);
|
|
var level = data.completion_band || section.getAttribute('data-completion-level') || 'none';
|
|
section.setAttribute('data-guidance-mode', data.mode || '');
|
|
section.setAttribute('data-completion-level', level);
|
|
document.getElementById('llm-mode-label').textContent = label;
|
|
document.getElementById('llm-mode-description').textContent = label;
|
|
document.getElementById('llm-progress-label').textContent = progressLabel(level);
|
|
|
|
var diff = document.getElementById('diff-section');
|
|
if (diff && data.show_output_diff) diff.classList.add('guidance-diff-open');
|
|
}
|
|
|
|
function renderResult(fullText) {
|
|
if (finished) return;
|
|
finished = true;
|
|
var container = document.getElementById('llm-review-content');
|
|
var result = document.getElementById('llm-review-result');
|
|
document.getElementById('llm-review-loading').style.display = 'none';
|
|
container.textContent = fullText;
|
|
result.style.display = 'block';
|
|
if (fullText && typeof HustOJVditor !== 'undefined' && HustOJVditor.renderMarkdownBlocks) {
|
|
HustOJVditor.renderMarkdownBlocks('#llm-review-content', {
|
|
useTextContent: true,
|
|
previewOptions: { markdown: { sanitize: true } }
|
|
}).catch(function(error){
|
|
console.error('Failed to render AI guidance.', error);
|
|
});
|
|
}
|
|
}
|
|
|
|
function showError(message) {
|
|
if (finished) return;
|
|
started = false;
|
|
document.getElementById('llm-review-loading').style.display = 'none';
|
|
document.getElementById('llm-review-error-msg').textContent = message || '获取指导失败';
|
|
document.getElementById('llm-review-error').style.display = 'block';
|
|
}
|
|
|
|
function fetchGuidance() {
|
|
if (started) return;
|
|
started = true;
|
|
finished = false;
|
|
currentEvent = '';
|
|
setCollapsed(false);
|
|
document.getElementById('llm-review-loading').style.display = '';
|
|
document.getElementById('llm-review-error').style.display = 'none';
|
|
document.getElementById('llm-review-result').style.display = 'none';
|
|
|
|
var fullText = '';
|
|
var sseBuffer = '';
|
|
var decoder = null;
|
|
|
|
function processSSE(text) {
|
|
sseBuffer += text;
|
|
var lines = sseBuffer.split('\n');
|
|
sseBuffer = lines.pop();
|
|
for (var i = 0; i < lines.length; i++) {
|
|
var line = lines[i].replace(/\r$/, '');
|
|
if (line.indexOf('event: ') === 0) {
|
|
currentEvent = line.substring(7);
|
|
} else if (line.indexOf('data: ') === 0) {
|
|
try {
|
|
var data = JSON.parse(line.substring(6));
|
|
if (currentEvent === 'meta') {
|
|
applyMeta(data);
|
|
} else if (currentEvent === 'chunk') {
|
|
fullText += data.text || '';
|
|
} else if (currentEvent === 'cached') {
|
|
fullText = data.text || '';
|
|
} else if (currentEvent === 'done') {
|
|
renderResult(fullText);
|
|
} else if (currentEvent === 'error') {
|
|
showError(data.message || '获取指导失败');
|
|
}
|
|
} catch (error) {
|
|
console.warn('Invalid AI guidance event.', error);
|
|
}
|
|
currentEvent = '';
|
|
}
|
|
}
|
|
}
|
|
|
|
if (typeof fetch === 'undefined' || typeof TextDecoder === 'undefined') {
|
|
showError('浏览器版本过旧，请升级后重试');
|
|
return;
|
|
}
|
|
decoder = new TextDecoder();
|
|
|
|
fetch('llm-review.php?sid=<?php echo intval($id); ?><?php
|
|
if (isset($llm_guidance_has_output_diff)) {
|
|
echo '&structured_diff=' . ($llm_guidance_has_output_diff ? '1' : '0');
|
|
}
|
|
?>', { credentials: 'same-origin' })
|
|
.then(function(response){
|
|
if (!response.ok) {
|
|
return response.text().then(function(text){
|
|
var message = '请求失败 (HTTP ' + response.status + ')';
|
|
try {
|
|
var data = JSON.parse(text);
|
|
if (data && data.error) message = data.error;
|
|
} catch (ignore) {}
|
|
throw new Error(message);
|
|
});
|
|
}
|
|
if (!response.body || !response.body.getReader) throw new Error('浏览器不支持流式响应');
|
|
var reader = response.body.getReader();
|
|
|
|
function readNext() {
|
|
return reader.read().then(function(result){
|
|
if (result.done) {
|
|
var tail = decoder.decode();
|
|
if (tail || sseBuffer) processSSE(tail + '\n');
|
|
if (!finished && fullText) {
|
|
renderResult(fullText);
|
|
} else if (!finished) {
|
|
showError('响应提前结束，请重试');
|
|
}
|
|
return;
|
|
}
|
|
processSSE(decoder.decode(result.value, { stream: true }));
|
|
return readNext();
|
|
});
|
|
}
|
|
return readNext();
|
|
})
|
|
.catch(function(error){ showError(error.message || '网络请求失败'); });
|
|
}
|
|
|
|
document.getElementById('llm-review-retry').addEventListener('click', fetchGuidance);
|
|
window.fetchLLMReview = fetchGuidance;
|
|
|
|
<?php if ($llm_guidance_auto_fetch): ?>
|
|
if (document.readyState === 'loading') {
|
|
document.addEventListener('DOMContentLoaded', fetchGuidance, { once: true });
|
|
} else {
|
|
fetchGuidance();
|
|
}
|
|
<?php else: ?>
|
|
document.getElementById('llm-review-loading').style.display = 'none';
|
|
<?php endif; ?>
|
|
})();
|
|
</script>
|
|
<?php endif; ?>
|