ri-st/project
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Create routes and views for customers and their addresses.

Browse Source
This commit is contained in:
Christian Steinle
2024-12-10 21:09:12 +01:00
parent 9d2eddbcf1
commit 679a067506
16 changed files with 797 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

102
resources/views/customer/index.blade.php Normal file
View File

@@ -0,0 +1,102 @@
<x-app-layout>
<x-slot name="header">
<h2 class="font-semibold text-xl text-gray-800 dark:text-gray-200 leading-tight">
{{ __('customer.Customers') }}
</h2>
</x-slot>
<div class="py-12">
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8 space-y-6">
<div class="p-4 sm:p-8 bg-white dark:bg-gray-800 shadow sm:rounded-lg">
<div class="max-w-xl">
<section>
<header>
<h2 class="text-lg font-medium text-gray-900 dark:text-gray-100">
{{ __('customer.Add new customer') }}
</h2>
<p class="mt-1 text-sm text-gray-600 dark:text-gray-400">
{{ __("customer.Add new customer by clicking add") }}
</p>
</header>
<a class="mt-6 inline-block" href="{{ route('customer.create') }}"><x-primary-button>{{ __('form.Add') }}</x-primary-button></a>
</section>
</div>
</div>
<div class="p-4 sm:p-8 bg-white dark:bg-gray-800 shadow sm:rounded-lg">
<div class="max-w" x-data="{ customers: []}"
x-init="customers = await fetchCustomers().then((data) => data );">
<section>
<header>
<h2 class="text-lg font-medium text-gray-900 dark:text-gray-100">
{{ __('customer.Existing customers') }}
</h2>
</header>
<summary class="cursor-pointer grid grid-cols-3 mt-4">
<div class="font-bold border-b-2">Name</div>
<div class="font-bold border-b-2">Email</div>
<div class="font-bold border-b-2">Erstellt am</div>
</summary>
<template x-for="customer in customers">
<details class=" even:bg-gray-100 odd:bg-white">
<summary class="cursor-pointer grid grid-cols-3">
<div x-text="customer.name"></div>
<div x-text="customer.email"></div>
<div x-text="customer.created"></div>
</summary>
<div class="flex flex-row">
<template x-if="customer.address">
<div class="flex flex-col p-8 w-1/3">
<div class="text-lg font-medium text-gray-900 dark:text-gray-100">{{ __('customer.Invoice Address') }}</div>
<div x-text="customer.address.name"></div>
<div x-text="customer.address.address"></div>
<div x-text="customer.address.zip +' ' + customer.address.city"></div>
<div x-text="customer.address.phone"></div>
<div x-text="customer.address.email"></div>
</div>
</template>
<template x-if="customer.delivery">
<div class="flex flex-col p-8 w-1/3">
<div class="text-lg font-medium text-gray-900 dark:text-gray-100">{{ __('customer.Delivery Address') }}</div>
<div x-text="customer.delivery.name"></div>
<div x-text="customer.delivery.address"></div>
<div x-text="customer.delivery.zip +' ' + customer.delivery.city"></div>
<div x-text="customer.delivery.phone"></div>
<div x-text="customer.delivery.email"></div>
</div>
</template>
</div>
<div>
<a class="ml-8 mb-8 inline-block" x-bind:href="'/customer/' + customer.id + '/edit'"><x-primary-button>{{ __('form.Edit') }}</x-primary-button></a>
</div>
</details>
</template>
</section>
</div>
</div>
</div>
</div>
</x-app-layout>
<script>
let fetchCustomers = async () => {
return await new Promise((resolve, reject) => {
axios.get('/customer')
.then(function (response) {
resolve(response.data);
})
.catch(function (error) {
console.log(error);
})
});
}
</script>