feat: Implement initial pedido (order) management, product catalog, and TI configuration features.

apps/web/src/routes/(dashboard)/ti/+page.svelte

@@ -367,6 +367,15 @@
 			palette: 'accent',
 			icon: 'building'
 		},
+		{
+			title: 'Configurações Gerais',
+			description:
+				'Configure opções gerais do sistema, incluindo setor de compras e outras configurações administrativas.',
+			ctaLabel: 'Configurar',
+			href: '/(dashboard)/ti/configuracoes',
+			palette: 'secondary',
+			icon: 'control'
+		},
 		{
 			title: 'Documentação',
 			description:

apps/web/src/routes/(dashboard)/ti/configuracoes/+page.svelte

@@ -0,0 +1,94 @@
+<script lang="ts">
+	import { useQuery, useConvexClient } from 'convex-svelte';
+	import { api } from '@sgse-app/backend/convex/_generated/api';
+	import type { Id } from '@sgse-app/backend/convex/_generated/dataModel';
+
+	const client = useConvexClient();
+
+	// Reactive queries
+	const setoresQuery = useQuery(api.setores.list, {});
+	const configQuery = useQuery(api.config.getComprasSetor, {});
+
+	const setores = $derived(setoresQuery.data || []);
+	const config = $derived(configQuery.data);
+	const loading = $derived(setoresQuery.isLoading || configQuery.isLoading);
+
+	// Initialize selected setor from config - using boxed $state to avoid reactivity warning
+	let selectedSetorId = $state('');
+
+	// Update selectedSetorId when config changes
+	$effect(() => {
+		if (config?.comprasSetorId && !selectedSetorId) {
+			selectedSetorId = config.comprasSetorId;
+		}
+	});
+
+	let saving = $state(false);
+	let error: string | null = $state(null);
+	let success: string | null = $state(null);
+
+	async function saveConfig() {
+		saving = true;
+		error = null;
+		success = null;
+		try {
+			await client.mutation(api.config.updateComprasSetor, {
+				setorId: selectedSetorId as Id<'setores'>
+			});
+			success = 'Configuração salva com sucesso!';
+		} catch (e) {
+			error = (e as Error).message;
+		} finally {
+			saving = false;
+		}
+	}
+</script>
+
+<div class="container mx-auto p-6">
+	<h1 class="mb-6 text-2xl font-bold">Configurações Gerais</h1>
+
+	{#if loading}
+		<p>Carregando...</p>
+	{:else}
+		<div class="max-w-md rounded-lg bg-white p-6 shadow-md">
+			<h2 class="mb-4 text-xl font-semibold">Setor de Compras</h2>
+			<p class="mb-4 text-sm text-gray-600">
+				Selecione o setor responsável por receber e aprovar pedidos de compra.
+			</p>
+
+			{#if error}
+				<div class="mb-4 rounded border border-red-400 bg-red-100 px-4 py-3 text-red-700">
+					{error}
+				</div>
+			{/if}
+
+			{#if success}
+				<div class="mb-4 rounded border border-green-400 bg-green-100 px-4 py-3 text-green-700">
+					{success}
+				</div>
+			{/if}
+
+			<div class="mb-4">
+				<label for="setor" class="mb-1 block text-sm font-medium text-gray-700"> Setor </label>
+				<select
+					id="setor"
+					bind:value={selectedSetorId}
+					class="w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500"
+				>
+					<option value="">Selecione um setor...</option>
+					{#each setores as setor (setor._id)}
+						<option value={setor._id}>{setor.nome} ({setor.sigla})</option>
+					{/each}
+				</select>
+			</div>
+
+			<button
+				onclick={saveConfig}
+				disabled={saving || !selectedSetorId}
+				class="w-full rounded-md bg-blue-600 px-4 py-2 text-white transition-colors hover:bg-blue-700 disabled:cursor-not-allowed disabled:opacity-50"
+			>
+				{saving ? 'Salvando...' : 'Salvar Configuração'}
+			</button>
+		</div>
+	{/if}
+</div>