busya/ss-tools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(datasets): add HelpTooltip ⓘ popups in mapping/docs modals

Browse Source 
Использует существующий компонент /ui/HelpTooltip.svelte
(ⓘ иконка со стилизованным попапом при наведении) — тот же
паттерн, что на Maintenance и Settings страницах.

Добавлен HelpTooltip рядом с лейблами:
- Модалка маппинга: Тип источника, База данных, SQL-запрос, XLSX-файл
- Модалка генерации docs: LLM-провайдер

Native title сохранён как fallback на самих элементах форм.
This commit is contained in:
busya
2026-05-24 09:49:59 +03:00
parent edc500c3e4
commit 8acd2666b9
1 changed files with 25 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
frontend/src/routes/datasets/+page.svelte
View File

@@ -5,6 +5,7 @@
import { fromStore } from "svelte/store";
import { t } from "$lib/i18n";
import { api } from "$lib/api.js";
import HelpTooltip from "$lib/ui/HelpTooltip.svelte";
import { debounce } from "$lib/utils/debounce.js";
import {
environmentContextStore,
@@ -351,6 +352,11 @@
<div class="bg-white rounded-lg shadow-xl p-6 max-w-md w-full" style="max-height: 90vh; overflow-y: auto;" onclick={(e) => e.stopPropagation()}>
<h3 class="text-lg font-semibold mb-4">{$t.datasets?.bulk_map_columns}</h3>
<p class="text-sm text-gray-600 mb-3">{$t.datasets?.selected_count?.replace('{count}', String(selectedIds.size))}</p>
<span class="flex items-center gap-1.5 mb-1.5">
<span class="text-sm font-medium text-gray-700">{$t.datasets?.source_type ?? 'Тип источника'}</span>
<HelpTooltip text={$t.datasets?.source_type_tip || ""} />
</span>
<select
class="w-full border rounded px-2 py-1.5 mb-3"
title={$t.datasets?.source_type_tip}
@@ -361,7 +367,10 @@
<option value="xlsx">{$t.datasets?.source_xlsx}</option>
</select>
{#if mapSourceType === "sqllab"}
<label class="text-sm font-medium mb-1 block" for="map-database-select">{$t.datasets?.source_database ?? 'База данных'}</label>
<span class="flex items-center gap-1.5 mb-1.5">
<label class="text-sm font-medium text-gray-700" for="map-database-select">{$t.datasets?.source_database ?? 'База данных'}</label>
<HelpTooltip text={$t.datasets?.database_tip || ""} />
</span>
<select
id="map-database-select"
class="w-full border rounded px-2 py-1.5 mb-3"
@@ -373,10 +382,13 @@
<option value={db.id}>{db.database_name || db.name}</option>
{/each}
</select>
<label class="text-sm font-medium mb-1 block" for="map-sql-query">
{$t.datasets?.sql_query ?? 'SQL-запрос'}
<span class="text-xs text-gray-400 font-normal ml-1">({$t.datasets?.sql_query_hint ?? 'оставьте пустым для information_schema'})</span>
</label>
<span class="flex items-center gap-1.5 mb-1.5">
<label class="text-sm font-medium text-gray-700" for="map-sql-query">
{$t.datasets?.sql_query ?? 'SQL-запрос'}
<span class="text-xs text-gray-400 font-normal ml-1">({$t.datasets?.sql_query_hint ?? 'оставьте пустым для information_schema'})</span>
</label>
<HelpTooltip text={$t.datasets?.sql_query_tip || ""} />
</span>
<textarea
id="map-sql-query"
class="w-full border rounded px-2 py-1.5 mb-4 font-mono text-xs"
@@ -386,7 +398,10 @@
bind:value={mapSqlQuery}
></textarea>
{:else}
<label class="text-sm font-medium mb-1 block" for="map-file-input">{$t.datasets?.xlsx_file ?? 'XLSX-файл'}</label>
<span class="flex items-center gap-1.5 mb-1.5">
<label class="text-sm font-medium text-gray-700" for="map-file-input">{$t.datasets?.xlsx_file ?? 'XLSX-файл'}</label>
<HelpTooltip text={$t.datasets?.file_input_tip || ""} />
</span>
<input
id="map-file-input"
type="file"
@@ -410,6 +425,10 @@
<div class="bg-white rounded-lg shadow-xl p-6 max-w-md w-full" onclick={(e) => e.stopPropagation()}>
<h3 class="text-lg font-semibold mb-4">{$t.datasets?.bulk_docs_generation}</h3>
<p class="text-sm text-gray-600 mb-3">{$t.datasets?.selected_count?.replace('{count}', String(selectedIds.size))}</p>
<span class="flex items-center gap-1.5 mb-1.5">
<span class="text-sm font-medium text-gray-700">{$t.datasets?.select_llm_provider ?? 'LLM-провайдер'}</span>
<HelpTooltip text={$t.datasets?.llm_provider_tip || ""} />
</span>
<select class="w-full border rounded px-2 py-1.5 mb-4" title={$t.datasets?.llm_provider_tip} bind:value={llmProvider}>
<option value="">{$t.datasets?.select_llm_provider_option}</option>
<option value="openai">OpenAI</option>