feat(user): sync user dengan outlet saat crud dan menampilkan outlet di tabel

app/Livewire/Datatable/Studio/Master/UsersTable.php

@@ -11,6 +11,7 @@
 use Illuminate\Support\Facades\Blade;
 use Rappasoft\LaravelLivewireTables\DataTableComponent;
 use Rappasoft\LaravelLivewireTables\Views\Column;
+use Rappasoft\LaravelLivewireTables\Views\Columns\ArrayColumn;
 use Rappasoft\LaravelLivewireTables\Views\Filters\MultiSelectFilter;
 
 class UsersTable extends DataTableComponent
@@ -80,6 +81,11 @@ public function columns(): array
 
             Column::make('Alamat', 'address')->searchable(),
 
+            ArrayColumn::make('Outlet')
+                ->data(fn ($value, $row) => $row->user->outlets->pluck('name')->toArray())
+                ->outputFormat(fn ($index, $value) => Blade::render('<span class="text-xs text-gray-400 border border-gray-400 rounded px-1">'.$value.'</span>'))
+                ->flexRow(['class' => 'gap-2 flex-wrap']),
+
             Column::make('Tanggal')
                 ->label(function ($row) {
                     $birthdate = formatDate($row->birthdate);
@@ -162,6 +168,7 @@ public function builder(): Builder
             ->with([
                 'user',
                 'user.referralCode',
+                'user.outlets',
             ]);
     }
 

app/Livewire/Forms/Studio/Master/UserForm.php

@@ -38,6 +38,8 @@ class UserForm extends Form
 
     public string $status = '1';
 
+    public array $outlet_ids = [];
+
     public function rules(): array
     {
         return [
@@ -51,6 +53,8 @@ public function rules(): array
             'address' => ['required', 'string'],
             'gender' => ['required', Rule::in(Gender::cases())],
             'status' => ['required', Rule::in(UserStatus::cases())],
+            'outlet_ids' => ['required', 'array', 'min:1'],
+            'outlet_ids.*' => Rule::exists('outlets', 'id'),
         ];
     }
 
@@ -65,11 +69,14 @@ public function validationAttributes(): array
             'hire_date' => 'tanggal bergabung',
             'address' => 'alamat',
             'gender' => 'jenis kelamin',
+            'outlet_ids' => 'outlet',
         ];
     }
 
     public function setUser(User $user)
     {
+        $user->load(['employee', 'outlets']);
+
         $this->user = $user;
         $employee = $user->employee;
 
@@ -83,6 +90,7 @@ public function setUser(User $user)
         $this->address = $employee->address;
         $this->gender = $employee->gender->value;
         $this->status = $user->status->value;
+        $this->outlet_ids = $user->outlets->pluck('id')->toArray();
     }
 
     public function store()
@@ -116,6 +124,8 @@ public function store()
                 'address' => $data['address'],
                 'gender' => $data['gender'],
             ]);
+
+            $user->outlets()->attach($this->outlet_ids);
         });
     }
 
@@ -147,6 +157,8 @@ public function update()
                 'address' => $data['address'],
                 'gender' => $data['gender'],
             ]);
+
+            $this->user->outlets()->sync($this->outlet_ids);
         });
     }
 }

app/Livewire/Studio/Master/User/Create.php

@@ -3,7 +3,9 @@
 namespace App\Livewire\Studio\Master\User;
 
 use App\Livewire\Forms\Studio\Master\UserForm;
+use App\Models\Outlet;
 use App\Traits\WithAuthorization;
+use App\Traits\WithOutletSelector;
 use App\Traits\WithToast;
 use App\Traits\WithUpdatedData;
 use Livewire\Attributes\Title;
@@ -12,10 +14,17 @@
 #[Title('Tambah Pegawai')]
 class Create extends Component
 {
-    use WithAuthorization, WithToast, WithUpdatedData;
+    use WithAuthorization, WithOutletSelector, WithToast, WithUpdatedData;
 
     public UserForm $form;
 
+    public array $outlets = [];
+
+    public function mount()
+    {
+        $this->outlets = Outlet::pluck('name', 'id')->toArray();
+    }
+
     public function save()
     {
         $this->canOrAbort('create user');

app/Livewire/Studio/Master/User/Edit.php

@@ -3,8 +3,10 @@
 namespace App\Livewire\Studio\Master\User;
 
 use App\Livewire\Forms\Studio\Master\UserForm;
+use App\Models\Outlet;
 use App\Models\User;
 use App\Traits\WithAuthorization;
+use App\Traits\WithOutletSelector;
 use App\Traits\WithToast;
 use App\Traits\WithUpdatedData;
 use Livewire\Attributes\Title;
@@ -13,13 +15,16 @@
 #[Title('Ubah Pegawai')]
 class Edit extends Component
 {
-    use WithAuthorization, WithToast, WithUpdatedData;
+    use WithAuthorization, WithOutletSelector, WithToast, WithUpdatedData;
 
     public UserForm $form;
 
+    public array $outlets = [];
+
     public function mount(User $user)
     {
         $this->form->setUser($user);
+        $this->outlets = Outlet::pluck('name', 'id')->toArray();
     }
 
     public function save()

resources/views/livewire/studio/master/user/form.blade.php

@@ -119,6 +119,24 @@
                             <flux:error name="form.status" />
                         </flux:field>
                     </flux:card>
+
+                    <flux:card class="space-y-6 p-6">
+                        <flux:field>
+                            <flux:label>Outlet <span class="text-red-500 ms-1">*</span></flux:label>
+                            <flux:select variant="listbox" multiple searchable placeholder="Pilih Outlet"
+                                wire:model.live.debounce.500ms="form.outlet_ids">
+                                <flux:select.option wire:click="selectAllOutlets" wire:ignore>Pilih Semua
+                                </flux:select.option>
+                                <flux:select.option wire:click="deselectAllOutlets" wire:ignore>Hapus Semua
+                                </flux:select.option>
+                                @foreach ($outlets as $key => $value)
+                                    <flux:select.option value="{{ $key }}">{{ $value }}
+                                    </flux:select.option>
+                                @endforeach
+                            </flux:select>
+                            <flux:error name="form.outlet_ids" />
+                        </flux:field>
+                    </flux:card>
                 </div>
             </div>