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

Make customers searchable.

Browse Source
This commit is contained in:
Christian Steinle
2025-02-13 17:15:01 +01:00
parent ae0d99e239
commit a99ce5bec7
2 changed files with 35 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
resources/views/customer/index.blade.php
View File

@@ -29,12 +29,26 @@
<div class="p-4 sm:p-8 bg-white dark:bg-gray-800 shadow sm:rounded-lg">
<div class="max-w" x-data="customerForm()">
<section>
<header>
<header class="grid grid-cols-2">
<h2 class="text-lg font-medium text-gray-900 dark:text-gray-100">
{{ __('customer.Existing customers') }}
</h2>
<div class="flex flex-row items-center gap-8">
<x-input-label for="search_customer" :value="__('common.Search')"/>
<x-text-input id="search_customer" name="search_customer" type="text"
class="mt-1 block w-full"
x-ref="search_customer"
autofocus
placeholder="{{ __('customer.Search customer') }}"
x-on:keydown.window.prevent.slash="$refs.search_customer.focus()"
x-model="search_customer"/>
</div>
</header>
<p class="text-red-600 font-bold" x-text="message" x-show="error"></p>
<p x-show="success" x-transition
class="text-sm text-green-600 dark:text-green-400">{{ __('form.Saved') }}</p>
<div class="flex flex-row mt-4">
<div class="w-11/12 grid grid-cols-3">
<div class="font-bold border-b-2">{{ __('common.Name') }}</div>
@@ -44,7 +58,7 @@
<div class="w-1/12 border-b-2"></div>
</div>
<template x-for="(customer, index) in customers">
<template x-for="(customer, index) in getFilteredCustomers()">
<div class="even:bg-gray-100 odd:bg-white hover:bg-gray-400 flex flex-row">
<div class="w-11/12 grid grid-cols-3"
:class="(customer.deleted_at == null) ? 'cursor-pointer' : 'line-through';"
@@ -91,6 +105,7 @@
function customerForm() {
return {
customers: [],
search_customer: '',
success: false,
error: false,
@@ -109,14 +124,26 @@
},
getFilteredCustomers() {
if (this.search_customer === '') {
return this.customers;
}
return this.customers.filter((customer) => {
return customer.name
.replace(/ /g, '')
.toLowerCase()
.includes(this.search_customer.replace(/ /g, '').toLowerCase())
});
},
deleteCustomer(index) {
let vm = this;
axios.delete('/customer/' + this.customers[index].id)
let customer_key = Object.keys(this.customers).find(key => (this.customers[key].id == this.getFilteredCustomers()[index].id));
axios.delete('/customer/' + this.customers[customer_key].id)
.then(function (response) {
vm.error = false;
vm.success = true;
vm.message = '';
vm.customers[index].deleted_at = 0;
vm.customers[customer_key].deleted_at = 0;
window.setTimeout(function () {
vm.success = false;
}, 1000);
@@ -130,12 +157,13 @@
restoreCustomer(index) {
let vm = this;
axios.get('/customer/' + this.customers[index].id + '/restore')
let customer_key = Object.keys(this.customers).find(key => (this.customers[key].id == this.getFilteredCustomers()[index].id));
axios.get('/customer/' + this.customers[customer_key].id + '/restore')
.then(function (response) {
vm.error = false;
vm.success = true;
vm.message = '';
vm.customers[index].deleted_at = null;
vm.customers[customer_key].deleted_at = null;
window.setTimeout(function () {
vm.success = false;
}, 1000);