How Work Database and how use Eloquent laravel

[arashdeveloper1380]

Hello, how can I install illuminate/database laravel and then master it? For example, I wrote this:

public User $user;

public function handleRequest(){
$name = $this->name;
$phone = $this->phone;
$user->name = $name;
$user->phone = $phone;
$user->save();
$this->reset();
}

But it doesn't work, please reply

[ivanvoitovych]

Hi @arashdeveloper1380 , thank you for the question

Please use our https://discord.gg/8DThE456wg chat to get help more quickly.

can you please provide the whole example so I can provide help?

From what I understand right now, you are using Eloquent User model with DB access.
Unfortunately, browser does not have access to your backend and can not perform save or reset operations.
Also your User should be obtained through HttpClient and is considered a JSON data (means it's raw object without methods like save or reset)
In order to do so you need to send your data to the server with HttpClient https://viewi.net/docs/data-fetching

In Viewi v2 we will not allow using classes, functions or any other code declared outside of Viewi app source code and will throw an Error.

In short: your Viewi logic should be isolated from the rest of the application to avoid any confusions.
Need Eloquent model? - create Viewi model and map to it before you send the response OR use an anonymous object (argument without a type)

small example here:
Viewi component
https://github.com/ivanvoitovych/viewi-laravel-demo/blob/master/viewi-app/Components/Views/Posts/PostsPage.php
Laravel API:
https://github.com/ivanvoitovych/viewi-laravel-demo/blob/master/routes/api.php

Editing user:

Viewi model

<?php

namespace Components\Models;

class UserModel
{
    public int $id;
    public ?string $name = null;
    public ?string $email = null;
}

component

<?php

namespace Components\Views\Users;

use Components\Models\UserModel;
use Components\Services\SessionInterceptor;
use Viewi\BaseComponent;
use Viewi\Common\HttpClient;
use Viewi\DOM\Events\DOMEvent;

class EditUserPage extends BaseComponent
{
    private HttpClient $http;
    private SessionInterceptor $session;
    public int $id;
    public ?UserModel $user = null;
    public string $error = '';
    public string $message = '';

    public function __init(HttpClient $http, SessionInterceptor $session, int $id)
    {
        $this->http = $http;
        $this->session = $session;
        $this->id = $id;
        $this->load();
    }

    public function load()
    {
        $this->http->get("/api/users/{$this->id}")->then(
            function ($response) {
                $this->user = new UserModel();
                $this->user->id = $response->id;
                $this->user->name = $response->name;
                $this->user->email = $response->email;
            },
            function ($error) {
                echo $error;
            }
        );
    }

    function onSubmit(DOMEvent $event)
    {
        $event->preventDefault();
        $this->error = '';
        $this->message = '';
        $this->http
            ->with([$this->session, 'csrfTokenInterceptor'])
            ->post("/api/users/{$this->id}", $this->user)
            ->then(function ($response) {
                if ($response['success']) {
                    $this->message = 'User saved successfully';
                }
            }, function ($error) {
                $this->error = 'Failed to save the user, please check the form.';
            });
    }
}

template

<AuthenticatedLayout title="Users">
    <div class="py-12">
        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
            <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg p-4">
                <div class="flex justify-between">
                    <h1
                        class="mb-4 text-4xl font-extrabold tracking-tight leading-none text-gray-900 md:text-5xl lg:text-6xl dark:text-white">
                        Users</h1>
                    <div>
                        <a href="/users"
                            class="text-white bg-gray-700 hover:bg-gray-800 focus:ring-4 focus:outline-none focus:ring-gray-300 font-medium rounded-lg text-sm w-full sm:w-auto px-5 py-2.5 text-center dark:bg-gray-600 dark:hover:bg-gray-700 dark:focus:ring-gray-800">
                            Back
                        </a>
                    </div>
                </div>
                <form class="mt-4" (submit)="onSubmit($event)">
                    <div if="$user">

                        <div>
                            Id: {$user->id}
                        </div>
                        <div>
                            Name: {$user->name}
                        </div>
                        <div>
                            Email: {$user->email}
                        </div>
                        <div class="grid gap-6 mb-6 md:grid-cols-2">
                            <div>
                                <label for="name"
                                    class="block mb-2 text-sm font-medium text-gray-900 dark:text-gray-300">Name</label>
                                <input type="text" id="name"
                                    class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
                                    placeholder="Your name" required model="{$user->name}">
                            </div>
                            <div>
                                <label for="email"
                                    class="block mb-2 text-sm font-medium text-gray-900 dark:text-gray-300">Email</label>
                                <input type="email" id="email"
                                    class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
                                    placeholder="Email" required model="{$user->email}">
                            </div>
                        </div>
                    </div>
                    <div else>
                        Loading..
                    </div>
                    <button type="submit"
                        class="text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm w-full sm:w-auto px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">Save</button>

                    <div if="$message"
                        class="p-4 my-4 text-sm text-green-700 bg-green-100 rounded-lg dark:bg-green-200 dark:text-green-800"
                        role="alert">
                        $message
                    </div>

                    <div if="$error"
                        class="p-4 my-4 text-sm text-red-700 bg-red-100 rounded-lg dark:bg-red-200 dark:text-red-800"
                        role="alert">
                        $error
                    </div>
                </form>
            </div>
        </div>
    </div>
</AuthenticatedLayout>

Laravel Controller

<?php

namespace App\Http\Controllers;

use App\Models\User;
use Illuminate\Http\Request;

class UsersController extends Controller
{

    public function getList()
    {
        // !! paginate won't work due to inconsistency between data structure on server and browser sides.
        return User::take(15)->get();
    }

    public function get($id)
    {
        return User::find($id) ?? null;
    }

    public function save($id, Request $request)
    {
        $user = User::find($id);
        if ($user) {
            $user->name = $request->name;
            $user->email = $request->email;
            $user->save();
            ['success' => false];
        }
        return ['success' => true];
    }
}

[arashdeveloper1380]

Thank you very much for your guide :)

[ivanvoitovych]

Any time :)