/**
 * 获取规则设置组件的 HTML 内容
 */
export function getRulesSettingsComponentContent(): string {
  return `
    <div class="rules-settings">
      <h3 class="settings-section-title">规则设置</h3>

      <div class="settings-section">
        <div class="settings-item">
          <div class="settings-item-header">
            <label class="settings-item-label">启用自定义规则</label>
            <span class="settings-item-description">使用自定义规则来控制 AI 行为</span>
          </div>
          <label class="settings-switch">
            <input type="checkbox" id="enableCustomRulesCheckbox" checked>
            <span class="settings-switch-slider"></span>
          </label>
        </div>
      </div>

      <div class="settings-section">
        <h4 class="settings-subsection-title">系统规则</h4>
        <div class="rules-textarea-container">
          <textarea
            class="rules-textarea"
            id="systemRulesTextarea"
            placeholder="在此输入系统规则，例如：&#10;- 始终使用中文回复&#10;- 代码注释要详细&#10;- 遵循项目编码规范"
            rows="8"
          ></textarea>
          <div class="rules-textarea-hint">
            系统规则会在每次对话开始时应用
          </div>
        </div>
      </div>

      <div class="settings-section">
        <h4 class="settings-subsection-title">代码生成规则</h4>
        <div class="rules-textarea-container">
          <textarea
            class="rules-textarea"
            id="codeRulesTextarea"
            placeholder="在此输入代码生成规则，例如：&#10;- 使用 TypeScript 严格模式&#10;- 函数命名使用驼峰命名法&#10;- 添加必要的错误处理"
            rows="8"
          ></textarea>
          <div class="rules-textarea-hint">
            这些规则会在生成代码时应用
          </div>
        </div>
      </div>

      <div class="settings-section">
        <h4 class="settings-subsection-title">Verilog 规则</h4>
        <div class="rules-textarea-container">
          <textarea
            class="rules-textarea"
            id="verilogRulesTextarea"
            placeholder="在此输入 Verilog 代码规则，例如：&#10;- 使用非阻塞赋值 (<=) 在时序逻辑中&#10;- 模块命名使用小写加下划线&#10;- 添加详细的端口注释"
            rows="8"
          ></textarea>
          <div class="rules-textarea-hint">
            这些规则会在生成 Verilog 代码时应用
          </div>
        </div>
      </div>

      <div class="settings-actions">
        <button class="settings-button settings-button-primary" onclick="saveRulesSettings()">
          保存规则
        </button>
        <button class="settings-button settings-button-secondary" onclick="resetRulesSettings()">
          重置为默认
        </button>
      </div>
    </div>
  `;
}

/**
 * 获取规则设置组件的 CSS 样式
 */
export function getRulesSettingsComponentStyles(): string {
  return `
    .rules-settings {
      max-width: 700px;
    }

    .rules-textarea-container {
      margin-top: 8px;
    }

    .rules-textarea {
      width: 100%;
      padding: 12px;
      background: var(--vscode-input-background);
      color: var(--vscode-input-foreground);
      border: 1px solid var(--vscode-input-border);
      border-radius: 4px;
      font-size: 13px;
      font-family: var(--vscode-editor-font-family);
      line-height: 1.5;
      resize: vertical;
      outline: none;
      box-sizing: border-box;
    }

    .rules-textarea:focus {
      border-color: var(--vscode-focusBorder);
    }

    .rules-textarea::placeholder {
      color: var(--vscode-input-placeholderForeground);
      opacity: 0.6;
    }

    .rules-textarea-hint {
      margin-top: 8px;
      font-size: 12px;
      color: var(--vscode-descriptionForeground);
      font-style: italic;
    }
  `;
}

/**
 * 获取规则设置组件的 JavaScript 脚本
 */
export function getRulesSettingsComponentScript(): string {
  return `
    // 保存规则设置
    function saveRulesSettings() {
      const settings = {
        enableCustomRules: document.getElementById('enableCustomRulesCheckbox').checked,
        systemRules: document.getElementById('systemRulesTextarea').value,
        codeRules: document.getElementById('codeRulesTextarea').value,
        verilogRules: document.getElementById('verilogRulesTextarea').value,
      };

      // 发送消息到扩展
      vscode.postMessage({
        command: 'saveRulesSettings',
        settings: settings
      });

      // 显示保存成功提示
      console.log('规则设置已保存', settings);
    }

    // 重置规则设置
    function resetRulesSettings() {
      document.getElementById('enableCustomRulesCheckbox').checked = true;
      document.getElementById('systemRulesTextarea').value = '';
      document.getElementById('codeRulesTextarea').value = '';
      document.getElementById('verilogRulesTextarea').value = '';

      console.log('规则设置已重置为默认值');
    }

    // 加载规则设置
    function loadRulesSettings(settings) {
      if (!settings) return;

      if (settings.enableCustomRules !== undefined) {
        document.getElementById('enableCustomRulesCheckbox').checked = settings.enableCustomRules;
      }
      if (settings.systemRules) {
        document.getElementById('systemRulesTextarea').value = settings.systemRules;
      }
      if (settings.codeRules) {
        document.getElementById('codeRulesTextarea').value = settings.codeRules;
      }
      if (settings.verilogRules) {
        document.getElementById('verilogRulesTextarea').value = settings.verilogRules;
      }
    }
  `;
}
