捣鼓了一晚上，做了一个论文改写的DEMO

李仁炜 · 发表于前天 13:38

捣鼓了一晚上，做了一个论文改写的DEMO
前端代码如下：
<!DOCTYPE html><html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>三合一文本改写系统</title>
<style>
      body { font-family: Arial, sans-serif; max-width: 800px; margin: 0 auto; padding: 20px; }
      .container { background: #fff; padding: 30px; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); }
      textarea { width: 100%; min-height: 200px; padding: 10px; margin: 10px 0; border: 1px solid #ddd; border-radius: 4px; }
      .button-group { display: flex; gap: 10px; margin-bottom: 15px; }
      button { color: white; border: none; padding: 12px 20px; border-radius: 4px; cursor: pointer; font-size: 16px; flex: 1; }
      #normalBtn { background: #3498db; } /* 蓝色-普通改写 */
      #academicBtn { background: #2ecc71; } /* 绿色-学术改写 */
      #powerBtn { background: #e74c3c; } /* 红色-强力改写 */
      #correctBtn { background: #9b59b6; } /* 紫色-校对 */
      #result { margin-top: 20px; padding: 15px; background: #f9f9f9; border-radius: 4px; }
      .error { color: #e74c3c; }
      .version-list { padding-left: 20px; }
</style>
</head>
<body>
<div class="container">
      <h1>文本改写系统</h1>
      <form id="paraphraseForm">
         <textarea name="text" placeholder="请输入要改写的文本..." required></textarea>
         <div class="button-group">
            <button type="button" id="normalBtn">普通改写</button>
            <button type="button" id="academicBtn">学术改写</button>
            <button type="button" id="powerBtn">强力改写</button>
            <button type="button" id="correctBtn">校对</button> 
         </div>
      </form>
      <div id="result"></div>
</div>

<script>
document.addEventListener('DOMContentLoaded', function() {
      const normalBtn = document.getElementById('normalBtn');
      const academicBtn = document.getElementById('academicBtn');
      const powerBtn = document.getElementById('powerBtn');
      const correctBtn = document.getElementById('correctBtn'); // 新增校对按钮
      const resultDiv = document.getElementById('result');

      // 普通改写
      normalBtn.addEventListener('click', () => handleRewrite('normal'));

      // 学术改写
      academicBtn.addEventListener('click', () => handleRewrite('academic'));

      // 强力改写
      powerBtn.addEventListener('click', () => handleRewrite('power'));

      // 校对功能
      correctBtn.addEventListener('click', handleCorrect); // 新增校对功能

      async function handleRewrite(type) {
         const form = document.getElementById('paraphraseForm');
         const formData = new FormData(form);
         formData.append('rewrite_type', type);

         resultDiv.innerHTML = '<p>处理中...</p>';

         try {
            const response = await fetch('Rewrite.php', {
                  method: 'POST',
                  body: formData
            });

            const data = await response.json();

            if (data.success) {
                  resultDiv.innerHTML = `
                     <h3>${
                        type === 'normal' ? '普通' :
                        type === 'academic' ? '学术' : '强力'
                     }改写结果：</h3>
                     <p>${data.result}</p>
                     ${data.alternatives && data.alternatives.length ? `
                     <h4>其他版本：</h4>
                     <ul class="version-list">
                        ${data.alternatives.map(v => `<li>${v}</li>`).join('')}
                     </ul>
                     ` : ''}
                  `;
            } else {
                  resultDiv.innerHTML = `<p class="error">错误：${data.error || '未知错误'}</p>`;
            }
         } catch (error) {
            resultDiv.innerHTML = `<p class="error">请求失败：${error.message}</p>`;
         }
      }

      async function handleCorrect() {
         const form = document.getElementById('paraphraseForm');
         const formData = new FormData(form);

         resultDiv.innerHTML = '<p>校对中...</p>';

         try {
            const response = await fetch('Rewrite.php?action=correct', {
                  method: 'POST',
                  body: formData
            });

            const data = await response.json();

            if (data.success) {
                  if (data.errors && data.errors.length) {
                     resultDiv.innerHTML = `
                        <h3>校对结果：</h3>
                        <ul class="error-list">
                              ${data.errors.map(error => `
                                 <li>
                                    位置：${error.position}，错误：${error.error_desc_zh}，建议修改为：${error.correction}
                                 </li>
                              `).join('')}
                        </ul>
                     `;
                  } else {
                     resultDiv.innerHTML = '<p>没有发现错误。</p>';
                  }
            } else {
                  resultDiv.innerHTML = `<p class="error">错误：${data.error || '未知错误'}</p>`;
            }
         } catch (error) {
            resultDiv.innerHTML = `<p class="error">请求失败：${error.message}</p>`;
         }
      }
});
</script>
</body>
</html>

涤尘 · 发表于前天 19:17

感谢分享

		自动登录	找回密码
密码			注册

[分享] 捣鼓了一晚上，做了一个论文改写的DEMO

浏览过的版块