chore: optimize cms startup, refactor scripts and implement real-time dev mode
This commit is contained in:
@@ -193,15 +193,69 @@
|
||||
</div>
|
||||
</div>
|
||||
</v-drawer>
|
||||
|
||||
<!-- Drawer: Quick Add Company -->
|
||||
<v-drawer
|
||||
v-model="quickAddCompanyActive"
|
||||
title="Firma schnell anlegen"
|
||||
icon="business"
|
||||
@cancel="quickAddCompanyActive = false"
|
||||
>
|
||||
<div class="drawer-content">
|
||||
<div class="form-section">
|
||||
<div class="field">
|
||||
<span class="label">Firmenname</span>
|
||||
<v-input v-model="quickCompanyForm.name" placeholder="z.B. Schmidt GmbH" autofocus />
|
||||
</div>
|
||||
<div class="field">
|
||||
<span class="label">Domain / Website</span>
|
||||
<v-input v-model="quickCompanyForm.domain" placeholder="example.com" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="drawer-actions">
|
||||
<v-button primary block :loading="savingQuick" @click="saveQuickCompany">Firma speichern</v-button>
|
||||
</div>
|
||||
</div>
|
||||
</v-drawer>
|
||||
|
||||
<!-- Drawer: Quick Add Person -->
|
||||
<v-drawer
|
||||
v-model="quickAddPersonActive"
|
||||
title="Person schnell anlegen"
|
||||
icon="person"
|
||||
@cancel="quickAddPersonActive = false"
|
||||
>
|
||||
<div class="drawer-content">
|
||||
<div class="form-section">
|
||||
<div class="field">
|
||||
<span class="label">Vorname</span>
|
||||
<v-input v-model="quickPersonForm.first_name" placeholder="Vorname" autofocus />
|
||||
</div>
|
||||
<div class="field">
|
||||
<span class="label">Nachname</span>
|
||||
<v-input v-model="quickPersonForm.last_name" placeholder="Nachname" />
|
||||
</div>
|
||||
<div class="field">
|
||||
<span class="label">E-Mail</span>
|
||||
<v-input v-model="quickPersonForm.email" placeholder="email@example.com" type="email" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="drawer-actions">
|
||||
<v-button primary block :loading="savingQuick" @click="saveQuickPerson">Person speichern</v-button>
|
||||
</div>
|
||||
</div>
|
||||
</v-drawer>
|
||||
</MintelManagerLayout>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, nextTick, computed } from 'vue';
|
||||
import { ref, onMounted, nextTick, computed, watch } from 'vue';
|
||||
import { useApi } from '@directus/extensions-sdk';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { MintelManagerLayout, MintelSelect } from '@mintel/directus-extension-toolkit';
|
||||
|
||||
const api = useApi();
|
||||
const route = useRoute();
|
||||
|
||||
const items = ref<any[]>([]);
|
||||
const selectedItem = ref<any>(null);
|
||||
@@ -222,6 +276,12 @@ const drawerUserActive = ref(false);
|
||||
const isEditingUser = ref(false);
|
||||
const userForm = ref({ id: '', first_name: '', last_name: '', email: '', person: null, temporary_password: '' });
|
||||
|
||||
const quickAddCompanyActive = ref(false);
|
||||
const quickAddPersonActive = ref(false);
|
||||
const savingQuick = ref(false);
|
||||
const quickCompanyForm = ref({ name: '', domain: '' });
|
||||
const quickPersonForm = ref({ first_name: '', last_name: '', email: '' });
|
||||
|
||||
const tableHeaders = [
|
||||
{ text: 'Name', value: 'name', sortable: true },
|
||||
{ text: 'E-Mail', value: 'email', sortable: true },
|
||||
@@ -284,7 +344,10 @@ function openEditDrawer() {
|
||||
}
|
||||
|
||||
async function saveItem() {
|
||||
if (!form.value.company) return;
|
||||
if (!form.value.company) {
|
||||
notice.value = { type: 'danger', message: 'Bitte wählen Sie eine Firma aus.' };
|
||||
return;
|
||||
}
|
||||
saving.value = true;
|
||||
try {
|
||||
if (isEditing.value) {
|
||||
@@ -301,7 +364,10 @@ async function saveItem() {
|
||||
if (updated) selectItem(updated);
|
||||
}
|
||||
} catch (e: any) {
|
||||
notice.value = { type: 'danger', message: e.message };
|
||||
notice.value = {
|
||||
type: 'danger',
|
||||
message: e.response?.data?.errors?.[0]?.message || e.message || 'Speichern fehlgeschlagen'
|
||||
};
|
||||
} finally {
|
||||
saving.value = false;
|
||||
}
|
||||
@@ -365,9 +431,45 @@ async function inviteUser(user: any) {
|
||||
}
|
||||
|
||||
function openQuickAdd(type: 'company' | 'person') {
|
||||
// Quick add logic can involve opening another drawer or navigating
|
||||
// For now, we'll just show a notice
|
||||
notice.value = { type: 'info', message: `${type === 'company' ? 'Firma' : 'Person'} im jeweiligen Manager anlegen.` };
|
||||
if (type === 'company') {
|
||||
quickCompanyForm.value = { name: '', domain: '' };
|
||||
quickAddCompanyActive.value = true;
|
||||
} else {
|
||||
quickPersonForm.value = { first_name: '', last_name: '', email: '' };
|
||||
quickAddPersonActive.value = true;
|
||||
}
|
||||
}
|
||||
|
||||
async function saveQuickCompany() {
|
||||
if (!quickCompanyForm.value.name) return;
|
||||
savingQuick.value = true;
|
||||
try {
|
||||
const res = await api.post('/items/companies', quickCompanyForm.value);
|
||||
await fetchData();
|
||||
form.value.company = res.data.data.id;
|
||||
quickAddCompanyActive.value = false;
|
||||
notice.value = { type: 'success', message: 'Firma angelegt und ausgewählt.' };
|
||||
} catch (e: any) {
|
||||
notice.value = { type: 'danger', message: e.message };
|
||||
} finally {
|
||||
savingQuick.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
async function saveQuickPerson() {
|
||||
if (!quickPersonForm.value.first_name || !quickPersonForm.value.last_name) return;
|
||||
savingQuick.value = true;
|
||||
try {
|
||||
const res = await api.post('/items/people', quickPersonForm.value);
|
||||
await fetchData();
|
||||
form.value.contact_person = res.data.data.id;
|
||||
quickAddPersonActive.value = false;
|
||||
notice.value = { type: 'success', message: 'Person angelegt und ausgewählt.' };
|
||||
} catch (e: any) {
|
||||
notice.value = { type: 'danger', message: e.message };
|
||||
} finally {
|
||||
savingQuick.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
function formatDate(dateStr: string) {
|
||||
@@ -377,7 +479,30 @@ function formatDate(dateStr: string) {
|
||||
});
|
||||
}
|
||||
|
||||
onMounted(fetchData);
|
||||
function handleDeepLink() {
|
||||
if (route.query.create === 'true') {
|
||||
// Only open if not already open to avoid resetting form if user is already typing
|
||||
if (!drawerActive.value) {
|
||||
openCreateDrawer();
|
||||
}
|
||||
|
||||
if (route.query.company) {
|
||||
form.value.company = route.query.company as any;
|
||||
}
|
||||
if (route.query.contact_person) {
|
||||
form.value.contact_person = route.query.contact_person as any;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
watch(() => route.query.create, (newVal) => {
|
||||
if (newVal === 'true') handleDeepLink();
|
||||
});
|
||||
|
||||
onMounted(async () => {
|
||||
await fetchData();
|
||||
handleDeepLink();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
Reference in New Issue
Block a user