Функция поиска

app/Http/Controllers/WorkspaceController.php

@@ -4,6 +4,7 @@ namespace App\Http\Controllers;
 
 use App\Models\DocumentTemplate;
 use Illuminate\Http\Request;
+use Illuminate\Support\Str;
 use Inertia\Inertia;
 
 class WorkspaceController extends Controller
@@ -16,4 +17,21 @@ class WorkspaceController extends Controller
             'templates' => $activeTemplates
         ]);
     }
+
+    public function searchTemplates(Request $request)
+    {
+        $data = $request->validate([
+            'search' => 'nullable|string'
+        ]);
+
+        if (!empty($data['search'])) {
+            $templates = DocumentTemplate::whereLike('name', "{$data['search']}%")->get();
+        } else {
+            $templates = DocumentTemplate::all();
+        }
+
+        return response()->json([
+            'templates' => $templates
+        ]);
+    }
 }

resources/js/Pages/Index.vue

@@ -6,9 +6,9 @@ import List from "../Components/List/List.vue";
 import ListItem from "../Components/List/ListItem.vue";
 import PageBody from "../Components/Page/PageBody.vue";
 import Badge from "../Components/Badge/Badge.vue";
-import {Link} from "@inertiajs/vue3"
+import {Link, router} from "@inertiajs/vue3"
 import AnimateSearch from "../Components/Input/Search/AnimateSearch.vue";
-import {ref} from "vue";
+import {ref, watch} from "vue";
 import Button from "../Components/Button/Button.vue";
 import ImportDocumentModal from "./Parts/ImportDocumentModal.vue";
 import EditDocumentModal from "./Parts/EditDocumentModal.vue";
@@ -20,12 +20,21 @@ const props = defineProps({
     }
 })
 
+const workTemplates = ref([...props.templates])
 const searchValue = ref()
 const showModalImport = ref(false)
 const showModalEdit = ref(false)
 const editTemplateId = ref(null)
 const vertical = ref(true)
 
+watch(() => searchValue.value, (search) => {
+    axios.post('/api/templates/search', {
+        search
+    }).then(res => {
+        workTemplates.value = res.data.templates
+    })
+})
+
 const onChangeLayoutList = () => {
     vertical.value = !vertical.value
 }
@@ -96,7 +105,7 @@ const onCloseModalEdit = () => {
                         </Button>
                     </div>
                     <List :vertical="vertical" class="h-[calc(100vh-224px)] overflow-y-auto pr-1">
-                        <div v-for="template in templates"
+                        <div v-for="template in workTemplates"
                              :key="template.id"
                              class="relative"
                         >

routes/api.php

@@ -10,3 +10,6 @@ Route::get('/user', function (Request $request) {
 Route::post('/import/variables', [\App\Http\Controllers\DocImportController::class, 'previewVariables']);
 
 Route::get('/templates/{id}', [\App\Http\Controllers\DocImportController::class, 'show']);
+
+Route::post('/templates/search', [\App\Http\Controllers\WorkspaceController::class, 'searchTemplates'])
+    ->name('workspace.search-templates');