sql.php

<?php include('header.php'); ?>

<h1><i class="fas fa-code"></i> SQL Formatter</h1>

<style>
.form-row {
  display: flex;
  gap: 1rem;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 1.5rem;
}
</style>
<div class="tool-container">
  <div class="tool-section">
    <p>Форматирование SQL запросов с поддержкой различных диалектов</p>

    <div class="form-group">
      <label for="src">Вставьте «сырое» SQL-выражение:</label>
      <textarea id="src" class="form-control" placeholder="SELECT * FROM b_crm_deal WHERE STAGE_ID='WON';"></textarea>
    </div>

    <div class="form-row">
      <button id="run" class="btn">Форматировать</button>
      <label>Диалект:
        <select id="lang" class="form-select">
          <option value="postgresql">PostgreSQL</option>
          <option value="mysql">MySQL</option>
          <option value="sqlite">SQLite</option>
          <option value="sql">Standard SQL</option>
        </select>
      </label>
      <button id="copy" class="btn btn-sm">Скопировать ⧉</button>
    </div>

    <div class="output-section">
      <h4>Результат:</h4>
      <textarea id="dst" class="form-control" readonly placeholder="Отформатированный SQL появится здесь..."></textarea>
    </div>
  </div>
</div>

<!-- Библиотека sql-formatter из CDN -->
<script src="https://cdn.jsdelivr.net/npm/sql-formatter@12.2.2/dist/sql-formatter.min.js"></script>
<script>
  const src   = document.getElementById('src');
  const dst   = document.getElementById('dst');
  const lang  = document.getElementById('lang');
  const run   = document.getElementById('run');
  const copy  = document.getElementById('copy');

  function formatSQL() {
    const sqlText = src.value.trim();
    
    if (!sqlText) {
      dst.value = '';
      return;
    }

    try {
      const formatted = sqlFormatter.format(sqlText, {
        language: lang.value,
        tabWidth: 2,
        keywordCase: 'upper',
        linesBetweenQueries: 2
      });
      
      dst.value = formatted;
      localStorage.setItem('sqlFormatter:last', sqlText);
      
      // Show success feedback
      run.textContent = '✓ Отформатировано';
      setTimeout(() => run.textContent = 'Форматировать', 1500);
      
    } catch (error) {
      dst.value = `-- Ошибка форматирования SQL --
-- ${error.message}
-- Проверьте синтаксис SQL запроса

${sqlText}`;
      
      // Show error feedback
      run.textContent = '⚠ Ошибка';
      setTimeout(() => run.textContent = 'Форматировать', 2000);
    }
  }

  run.addEventListener('click', formatSQL);
  
  // Auto-format on language change
  lang.addEventListener('change', formatSQL);
  
  // Auto-format with debounce on input
  let formatTimeout;
  src.addEventListener('input', () => {
    clearTimeout(formatTimeout);
    formatTimeout = setTimeout(formatSQL, 500);
  });

  copy.addEventListener('click', async () => {
    if (!dst.value.trim()) {
      copy.textContent = '⚠ Нет данных';
      setTimeout(() => copy.textContent = 'Скопировать ⧉', 1500);
      return;
    }
    
    try {
      await navigator.clipboard.writeText(dst.value);
      copy.textContent = '✓ Скопировано';
      setTimeout(() => copy.textContent = 'Скопировать ⧉', 1500);
    } catch (error) {
      copy.textContent = '⚠ Ошибка';
      setTimeout(() => copy.textContent = 'Скопировать ⧉', 1500);
    }
  });

  // Load last query from localStorage
  if (localStorage.getItem('sqlFormatter:last')) {
    src.value = localStorage.getItem('sqlFormatter:last');
    formatSQL();
  } else {
    // Set example SQL
    src.value = `SELECT u.id, u.name, u.email, p.title as profile_title FROM users u LEFT JOIN profiles p ON u.id = p.user_id WHERE u.active = 1 AND u.created_at > '2023-01-01' ORDER BY u.created_at DESC LIMIT 100;`;
    formatSQL();
  }
</script>

<?php include('footer.php'); ?>