175 lines
5.1 KiB
HTML
175 lines
5.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>AI 写作助手 Pro</title>
|
|
<link rel="stylesheet" href="/static/style.css">
|
|
</head>
|
|
<body>
|
|
<div class="app">
|
|
|
|
<header>
|
|
<h1>🌙 AI 写作助手 Pro</h1>
|
|
<div class="time" id="time">当前时间：<span id="currentTime"></span></div>
|
|
</header>
|
|
|
|
<section class="card">
|
|
<textarea id="inputText" placeholder="请输入文本..."></textarea>
|
|
|
|
<div class="controls">
|
|
<select id="scene">
|
|
<option value="general">通用写作</option>
|
|
<option value="media">自媒体</option>
|
|
<option value="script">剧本</option>
|
|
<option value="essay">作文</option>
|
|
<option value="academic_scene">学术</option>
|
|
</select>
|
|
|
|
<select id="mode" onchange="updateOptions()">
|
|
<option value="polish">润色</option>
|
|
<option value="expand">扩写</option>
|
|
<option value="summary">总结</option>
|
|
<option value="simple">简化</option>
|
|
<option value="academic">学术改写</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div id="extraOptions" class="extra-options"></div>
|
|
<button onclick="rewriteText()">🚀 生成</button>
|
|
</section>
|
|
|
|
<section class="card">
|
|
<h2>✍️ AI 输出（点击选择版本）</h2>
|
|
<div id="versions"></div>
|
|
</section>
|
|
|
|
<section class="card">
|
|
<h2>🔍 修改原因</h2>
|
|
<div id="revisionReason"></div>
|
|
</section>
|
|
|
|
<section class="card">
|
|
<h2>📚 文学参考</h2>
|
|
<div id="literaryBox" class="literary-box"></div>
|
|
</section>
|
|
|
|
<section class="card">
|
|
<h2>😊 情感分析</h2>
|
|
<button onclick="analyzeSentiment()">分析情感</button>
|
|
<pre id="sentimentBox"></pre>
|
|
</section>
|
|
|
|
</div>
|
|
|
|
<script>
|
|
function updateOptions(){
|
|
const mode=document.getElementById("mode").value;
|
|
const box=document.getElementById("extraOptions");
|
|
box.innerHTML="";
|
|
if(mode==="polish"){
|
|
box.innerHTML=`<label>风格：</label>
|
|
<select id="style">
|
|
<option value="formal">正式</option>
|
|
<option value="literary">文学</option>
|
|
<option value="spoken">口语</option>
|
|
<option value="business">商务</option>
|
|
<option value="internet">网络</option>
|
|
</select>`;
|
|
}
|
|
if(mode==="expand"){
|
|
box.innerHTML=`<label>目标字数：</label><input type="number" id="target_length" value="300">`;
|
|
}
|
|
if(mode==="summary" || mode==="simple"){
|
|
box.innerHTML=`<label>不超过字数：</label><input type="number" id="max_length" value="100">`;
|
|
}
|
|
}
|
|
updateOptions();
|
|
|
|
// -------------------
|
|
// 时间显示
|
|
// -------------------
|
|
function updateTime(){
|
|
const now=new Date();
|
|
document.getElementById("currentTime").innerText=now.toLocaleTimeString();
|
|
}
|
|
setInterval(updateTime,1000);
|
|
|
|
// -------------------
|
|
// 生成文本 + 多版本
|
|
// -------------------
|
|
let lastInput="";
|
|
|
|
function rewriteText(){
|
|
lastInput=document.getElementById("inputText").value;
|
|
const data={
|
|
text:lastInput,
|
|
mode:document.getElementById("mode").value,
|
|
scene:document.getElementById("scene").value
|
|
};
|
|
if(data.mode==="polish") data.style=document.getElementById("style").value;
|
|
if(data.mode==="expand") data.target_length=document.getElementById("target_length").value;
|
|
|
|
fetch("/rewrite",{
|
|
method:"POST",
|
|
headers:{"Content-Type":"application/json"},
|
|
body:JSON.stringify(data)
|
|
}).then(r=>r.json()).then(d=>{
|
|
const vbox=document.getElementById("versions");
|
|
vbox.innerHTML="";
|
|
const lines=d.result.split("\n");
|
|
lines.forEach((line)=>{
|
|
if(line.trim().length>0){
|
|
const div=document.createElement("div");
|
|
div.className="version";
|
|
div.innerText=line;
|
|
div.onclick=()=>{selectVersion(line)};
|
|
vbox.appendChild(div);
|
|
}
|
|
});
|
|
});
|
|
|
|
// 文学参考
|
|
fetch("/literary",{
|
|
method:"POST",
|
|
headers:{"Content-Type":"application/json"},
|
|
body:JSON.stringify({text:lastInput})
|
|
}).then(r=>r.json()).then(d=>{
|
|
document.getElementById("literaryBox").innerText=d.reference;
|
|
});
|
|
}
|
|
|
|
// -------------------
|
|
// 选择版本继续优化 + 显示修改原因
|
|
// -------------------
|
|
function selectVersion(text){
|
|
fetch("/revision_reason",{
|
|
method:"POST",
|
|
headers:{"Content-Type":"application/json"},
|
|
body:JSON.stringify({original:lastInput,revised:text})
|
|
}).then(r=>r.json()).then(d=>{
|
|
document.getElementById("revisionReason").innerText=d.reason;
|
|
});
|
|
|
|
document.getElementById("inputText").value=text;
|
|
lastInput=text;
|
|
}
|
|
|
|
// -------------------
|
|
// 情感分析
|
|
// -------------------
|
|
function analyzeSentiment(){
|
|
const text=document.getElementById("inputText").value;
|
|
fetch("/sentiment",{
|
|
method:"POST",
|
|
headers:{"Content-Type":"application/json"},
|
|
body:JSON.stringify({text:text})
|
|
}).then(r=>r.json()).then(d=>{
|
|
const s=d.result;
|
|
document.getElementById("sentimentBox").innerText=
|
|
`积极: ${s.positive}%\n中立: ${s.neutral}%\n消极: ${s.negative}%`;
|
|
});
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|