feat(cloner): add cloner-library and finalize pdf-library rename

packages/people-manager/src/module.vue

@@ -64,8 +64,8 @@
 
 				<div class="details-grid">
 					<div class="detail-item">
-						<span class="label">Organisation</span>
-						<p class="value">{{ selectedPerson.company || '---' }}</p>
+						<span class="label">Organisation / Firma</span>
+						<p class="value">{{ getCompanyName(selectedPerson) }}</p>
 					</div>
 					<div class="detail-item">
 						<span class="label">Telefon</span>
@@ -98,8 +98,16 @@
 							<v-input v-model="form.email" placeholder="email@beispiel.de" type="email" />
 						</div>
 						<div class="field">
-							<span class="label">Organisation / Firma</span>
-							<v-input v-model="form.company" placeholder="z.B. Mintel" />
+							<span class="label">Zentrale Firma</span>
+							<v-select
+								v-model="form.company"
+								:items="companyOptions"
+								placeholder="Bestehende Firma auswählen..."
+							/>
+						</div>
+						<div class="field">
+							<span class="label">Firma (Legacy / Neu)</span>
+							<v-input v-model="form.company_name" placeholder="z.B. Mintel" />
 						</div>
 						<div class="field">
 							<span class="label">Telefon</span>
@@ -119,11 +127,12 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted } from 'vue';
+import { ref, onMounted, computed } from 'vue';
 import { useApi } from '@directus/extensions-sdk';
 
 const api = useApi();
 const people = ref([]);
+const companies = ref([]);
 const selectedPerson = ref(null);
 const feedback = ref(null);
 const saving = ref(false);
@@ -135,18 +144,43 @@ const form = ref({
 	first_name: '',
 	last_name: '',
 	email: '',
-	company: '',
+	company: null,
+	company_name: '',
 	phone: ''
 });
 
-async function fetchPeople() {
+const companyOptions = computed(() => 
+	companies.value.map(c => ({
+		text: c.name,
+		value: c.id
+	}))
+);
+
+function getCompanyName(person: any) {
+	if (!person) return '---';
+	if (person.company) {
+		return typeof person.company === 'object' ? person.company.name : (companies.value.find(c => c.id === person.company)?.name || person.company_name);
+	}
+	return person.company_name || '---';
+}
+
+async function fetchData() {
 	try {
-		const response = await api.get('/items/people', {
-			params: { sort: 'last_name' }
-		});
-		people.ref = response.data.data;
+		const [peopleResp, companiesResp] = await Promise.all([
+			api.get('/items/people', {
+				params: { 
+					sort: 'last_name',
+					fields: '*.*'
+				}
+			}),
+			api.get('/items/companies', {
+				params: { sort: 'name' }
+			})
+		]);
+		people.value = peopleResp.data.data;
+		companies.value = companiesResp.data.data;
 	} catch (error) {
-		console.error('Failed to fetch people:', error);
+		console.error('Failed to fetch data:', error);
 	}
 }
 
@@ -156,13 +190,39 @@ function selectPerson(person) {
 
 function openCreateDrawer() {
 	isEditing.value = false;
-	form.value = { id: null, first_name: '', last_name: '', email: '', company: '', phone: '' };
+	form.value = { 
+		id: null, 
+		first_name: '', 
+		last_name: '', 
+		email: '', 
+		company: null, 
+		company_name: '',
+		phone: '' 
+	};
 	drawerActive.value = true;
 }
 
 function openEditDrawer() {
 	isEditing.value = true;
-	form.value = { ...selectedPerson.value };
+	const person = selectedPerson.value;
+	let companyId = null;
+	let companyName = person.company_name || '';
+
+	if (person.company) {
+		if (typeof person.company === 'object') {
+			companyId = person.company.id;
+		} else if (person.company.length === 36) { // Assume UUID
+			companyId = person.company;
+		} else {
+			companyName = person.company;
+		}
+	}
+
+	form.value = { 
+		...person,
+		company: companyId,
+		company_name: companyName
+	};
 	drawerActive.value = true;
 }
 
@@ -182,9 +242,9 @@ async function savePerson() {
 			feedback.value = { type: 'success', message: 'Person angelegt!' };
 		}
 		drawerActive.value = false;
-		await fetchPeople();
+		await fetchData();
 		if (isEditing.value) {
-			selectedPerson.value = form.value;
+			selectedPerson.value = people.value.find(p => p.id === form.value.id);
 		}
 	} catch (error) {
 		feedback.value = { type: 'danger', message: error.message };
@@ -200,13 +260,13 @@ async function deletePerson() {
 		await api.delete(`/items/people/${selectedPerson.value.id}`);
 		feedback.value = { type: 'success', message: 'Person gelöscht.' };
 		selectedPerson.value = null;
-		await fetchPeople();
+		await fetchData();
 	} catch (error) {
 		feedback.value = { type: 'danger', message: error.message };
 	}
 }
 
-onMounted(fetchPeople);
+onMounted(fetchData);
 </script>
 
 <style scoped>