<?php if (isset($component)) { $__componentOriginal9ac128a9029c0e4701924bd2d73d7f54 = $component; } ?>
<?php if (isset($attributes)) { $__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54 = $attributes; } ?>
<?php $component = App\View\Components\AppLayout::resolve([] + (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag ? (array) $attributes->getIterator() : [])); ?>
<?php $component->withName('app-layout'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php if (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag && $constructor = (new ReflectionClass(App\View\Components\AppLayout::class))->getConstructor()): ?>
<?php $attributes = $attributes->except(collect($constructor->getParameters())->map->getName()->all()); ?>
<?php endif; ?>
<?php $component->withAttributes([]); ?>
     <?php $__env->slot('header', null, []); ?> 
        <?php echo e(__('Departments')); ?>

     <?php $__env->endSlot(); ?>

    <div x-data class="p-6 space-y-6">
        <?php if(session('status')): ?>
            <div class="rounded-md bg-green-50 border border-green-200 px-4 py-3 text-sm text-green-800">
                <?php echo e(session('status')); ?>

            </div>
        <?php endif; ?>

        <?php if($errors->any()): ?>
            <div class="rounded-md bg-red-50 border border-red-200 px-4 py-3 text-sm text-red-800">
                <ul class="list-disc pl-5 space-y-1">
                    <?php $__currentLoopData = $errors->all(); $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $error): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                        <li><?php echo e($error); ?></li>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                </ul>
            </div>
        <?php endif; ?>

        <div class="bg-white border border-gray-200 rounded-xl shadow-sm p-5 flex items-center justify-between">
            <div>
                <h1 class="text-xl font-semibold text-gray-900">Departments</h1>
                <p class="mt-1 text-sm text-gray-600">
                    Manage organizational departments and their members for the current dealer.
                </p>
            </div>

            <a
                href="<?php echo e(route('settings.departments.create')); ?>"
                class="inline-flex items-center rounded-lg bg-red-600 px-4 py-2 text-sm font-semibold text-white shadow-sm hover:bg-red-700"
            >
                Add Department
            </a>
        </div>

        <div class="space-y-4">
            <?php $__empty_1 = true; $__currentLoopData = $departments; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $department): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
                <div
                    x-data="departmentMembersComponent(<?php echo e($department->id); ?>)"
                    class="bg-white border border-gray-200 rounded-xl shadow-sm"
                >
                    <div class="flex items-center justify-between px-4 py-3 border-b border-gray-100">
                        <div class="flex items-center gap-3">
                            <h2 class="text-sm font-semibold text-gray-900">
                                <?php echo e($department->name); ?>

                            </h2>
                            <?php if($department->is_system): ?>
                                <span class="inline-flex items-center rounded-full bg-gray-100 px-2 py-0.5 text-xs font-medium text-gray-700">
                                    System
                                </span>
                            <?php endif; ?>
                        </div>

                        <div class="flex items-center gap-2">
                            <button
                                type="button"
                                @click="openAddModal()"
                                class="inline-flex items-center rounded-md border border-gray-200 px-3 py-1.5 text-xs font-medium text-gray-700 hover:bg-gray-50"
                            >
                                Add Users
                            </button>

                            <?php if($department->users->isNotEmpty()): ?>
                                <button
                                    type="button"
                                    @click="toggleRemoveMode()"
                                    x-show="!removeMode"
                                    class="inline-flex items-center rounded-md border border-gray-200 px-3 py-1.5 text-xs font-medium text-gray-700 hover:bg-gray-50"
                                >
                                    Remove Users
                                </button>
                            <?php endif; ?>

                            <?php if(!$department->is_system): ?>
                                <a
                                    href="<?php echo e(route('settings.departments.edit', $department->id)); ?>"
                                    class="inline-flex items-center rounded-md border border-gray-200 px-3 py-1.5 text-xs font-medium text-gray-700 hover:bg-gray-50"
                                >
                                    Edit
                                </a>

                                <form
                                    method="POST"
                                    action="<?php echo e(route('settings.departments.destroy', $department->id)); ?>"
                                    id="department-delete-<?php echo e($department->id); ?>"
                                >
                                    <?php echo csrf_field(); ?>
                                    <?php echo method_field('DELETE'); ?>
                                    <button
                                        type="button"
                                        @click="$store.__confirm.openConfirm('Are you sure you want to delete this department?', 'department-delete-<?php echo e($department->id); ?>')"
                                        class="inline-flex items-center rounded-md border border-red-200 px-3 py-1.5 text-xs font-medium text-red-700 hover:bg-red-50"
                                    >
                                        Delete
                                    </button>
                                </form>
                            <?php endif; ?>
                        </div>
                    </div>

                    <div class="px-4 py-3 space-y-3">
                        <div class="flex items-center justify-between">
                            <p class="text-xs text-gray-500">
                                Members
                            </p>

                            <?php if($department->users->isNotEmpty()): ?>
                                <div class="flex items-center gap-2">
                                    <button
                                        type="submit"
                                        form="remove-form-<?php echo e($department->id); ?>"
                                        x-show="removeMode"
                                        class="inline-flex items-center rounded-md bg-red-600 px-2 py-1 text-xs font-semibold text-white hover:bg-red-700"
                                    >
                                        Remove Selected
                                    </button>

                                    <button
                                        type="button"
                                        @click="cancelRemoveMode()"
                                        x-show="removeMode"
                                        class="inline-flex items-center rounded-md border border-gray-200 px-2 py-1 text-xs text-gray-700 hover:bg-gray-50"
                                    >
                                        Cancel
                                    </button>
                                </div>
                            <?php endif; ?>
                        </div>

                        <form
                            id="remove-form-<?php echo e($department->id); ?>"
                            method="POST"
                            action="<?php echo e(route('settings.departments.members.remove', $department->id)); ?>"
                            class="space-y-2"
                        >
                            <?php echo csrf_field(); ?>

                            <?php $__empty_2 = true; $__currentLoopData = $department->users; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $member): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_2 = false; ?>
                                <div class="flex items-center justify-between rounded-md border border-gray-100 px-3 py-2">
                                    <div>
                                        <div class="text-sm font-semibold text-gray-900">
                                            <?php echo e($member->full_name); ?>

                                        </div>
                                        <?php
                                            $title = $member->primary_role_name;
                                        ?>
                                        <?php if($title): ?>
                                            <div class="text-xs text-gray-600">
                                                <?php echo e($title); ?>

                                            </div>
                                        <?php endif; ?>
                                        <div class="text-xs text-gray-500">
                                            <?php echo e($member->email); ?>

                                        </div>
                                    </div>

                                    <label
                                        class="ml-2"
                                        x-show="removeMode"
                                    >
                                        <input
                                            type="checkbox"
                                            name="user_ids[]"
                                            value="<?php echo e($member->id); ?>"
                                            class="h-4 w-4 rounded border-gray-300 text-red-600 focus:ring-red-500"
                                        >
                                    </label>
                                </div>
                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_2): ?>
                                <p class="text-xs text-gray-500">
                                    No members in this department yet.
                                </p>
                            <?php endif; ?>
                        </form>
                    </div>

                    <!-- Add Users Modal -->
                    <div
                        class="fixed inset-0 z-40 flex items-center justify-center bg-black/40"
                        x-show="addOpen"
                        x-cloak
                    >
                        <div class="bg-white rounded-xl shadow-lg max-w-lg w-full mx-4">
                            <div class="flex items-center justify-between border-b border-gray-100 px-4 py-3">
                                <h3 class="text-sm font-semibold text-gray-900">
                                    Add Users to <?php echo e($department->name); ?>

                                </h3>
                                <button
                                    type="button"
                                    @click="closeAddModal()"
                                    class="text-gray-400 hover:text-gray-600"
                                >
                                    ✕
                                </button>
                            </div>

                            <div class="px-4 py-3 space-y-3">
                                <div class="flex items-end gap-2">
                                    <div class="flex-1">
                                        <label class="block text-xs font-medium text-gray-600">Search</label>
                                        <input
                                            type="text"
                                            x-model="addQuery"
                                            @keydown.enter.prevent="fetchUsers()"
                                            class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-red-500 focus:ring-red-500 text-sm"
                                            placeholder="Name, surname, email"
                                        >
                                    </div>
                                    <button
                                        type="button"
                                        @click="fetchUsers()"
                                        class="inline-flex items-center rounded-md bg-gray-900 px-3 py-2 text-xs font-semibold text-white hover:bg-gray-800"
                                    >
                                        Search
                                    </button>
                                </div>

                                <form
                                    method="POST"
                                    :action="addActionUrl"
                                    class="max-h-64 overflow-y-auto border border-gray-100 rounded-md p-2 space-y-1"
                                >
                                    <?php echo csrf_field(); ?>

                                    <template x-if="loading">
                                        <p class="text-xs text-gray-500 px-1 py-1.5">
                                            Loading users...
                                        </p>
                                    </template>

                                    <template x-if="!loading && addResults.length === 0">
                                        <p class="text-xs text-gray-500 px-1 py-1.5">
                                            No users found.
                                        </p>
                                    </template>

                                    <template x-for="user in addResults" :key="user.id">
                                        <label class="flex items-center justify-between rounded-md px-2 py-1 hover:bg-gray-50 cursor-pointer">
                                            <div>
                                                <div class="text-sm font-medium text-gray-900" x-text="user.name + ' ' + user.surname"></div>
                                                <div class="text-xs text-gray-500" x-text="user.email"></div>
                                            </div>
                                            <input
                                                type="checkbox"
                                                name="user_ids[]"
                                                :value="user.id"
                                                class="h-4 w-4 rounded border-gray-300 text-red-600 focus:ring-red-500"
                                            >
                                        </label>
                                    </template>

                                    <div class="flex items-center justify-end gap-2 pt-3">
                                        <button
                                            type="button"
                                            @click="closeAddModal()"
                                            class="inline-flex items-center rounded-md border border-gray-200 px-3 py-1.5 text-xs text-gray-700 hover:bg-gray-50"
                                        >
                                            Cancel
                                        </button>
                                        <button
                                            type="submit"
                                            class="inline-flex items-center rounded-md bg-red-600 px-3 py-1.5 text-xs font-semibold text-white hover:bg-red-700"
                                        >
                                            Add Selected
                                        </button>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>

                </div>
            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
                <div class="bg-white border border-gray-200 rounded-xl shadow-sm px-4 py-6 text-center text-sm text-gray-500">
                    No departments found.
                </div>
            <?php endif; ?>
        </div>

        <?php if(isset($deletedDepartments) && $deletedDepartments->isNotEmpty()): ?>
            <div class="bg-white border border-gray-200 rounded-xl shadow-sm p-4 space-y-2">
                <div class="flex items-center justify-between pb-2 border-b border-gray-100">
                    <div>
                        <h2 class="text-sm font-semibold text-gray-900">Deleted Departments</h2>
                        <p class="mt-1 text-xs text-gray-500">
                            These departments have been soft deleted and are hidden from the main list.
                        </p>
                    </div>
                </div>

                <div class="divide-y divide-gray-100">
                    <?php $__currentLoopData = $deletedDepartments; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $department): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                        <div class="flex items-center justify-between px-2 py-2">
                            <div>
                                <div class="text-sm font-semibold text-gray-900">
                                    <?php echo e($department->name); ?>

                                </div>
                                <div class="text-xs text-gray-500">
                                    Code: <?php echo e($department->code); ?>

                                </div>
                            </div>
                            <form
                                method="POST"
                                action="<?php echo e(route('settings.departments.restore', $department->id)); ?>"
                            >
                                <?php echo csrf_field(); ?>
                                <?php echo method_field('PATCH'); ?>
                                <button
                                    type="submit"
                                    class="inline-flex items-center rounded-md border border-gray-200 px-3 py-1.5 text-xs font-medium text-gray-700 hover:bg-gray-50"
                                >
                                    Restore
                                </button>
                            </form>
                        </div>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                </div>
            </div>
        <?php endif; ?>
    </div>

    <script>
        window.departmentMembersComponent = function (departmentId) {
            return {
                removeMode: false,
                addOpen: false,
                addQuery: '',
                addResults: [],
                loading: false,
                get addActionUrl() {
                    return '<?php echo e(url('settings/departments')); ?>/' + departmentId + '/members/add';
                },
                toggleRemoveMode() {
                    this.removeMode = true;
                },
                cancelRemoveMode() {
                    this.removeMode = false;
                },
                openAddModal() {
                    this.addOpen = true;
                    this.addResults = [];
                    this.addQuery = '';
                    this.fetchUsers();
                },
                closeAddModal() {
                    this.addOpen = false;
                },
                fetchUsers() {
                    this.loading = true;
                    const params = new URLSearchParams();
                    if (this.addQuery) {
                        params.set('q', this.addQuery);
                    }

                    fetch('<?php echo e(url('settings/departments')); ?>/' + departmentId + '/members/search?' + params.toString(), {
                        headers: {
                            'X-Requested-With': 'XMLHttpRequest',
                            'Accept': 'application/json',
                        },
                    })
                        .then(response => response.json())
                        .then(data => {
                            this.addResults = Array.isArray(data) ? data : [];
                        })
                        .catch(() => {
                            this.addResults = [];
                        })
                        .finally(() => {
                            this.loading = false;
                        });
                },
            };
        };
    </script>
 <?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54)): ?>
<?php $attributes = $__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54; ?>
<?php unset($__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54); ?>
<?php endif; ?>
<?php if (isset($__componentOriginal9ac128a9029c0e4701924bd2d73d7f54)): ?>
<?php $component = $__componentOriginal9ac128a9029c0e4701924bd2d73d7f54; ?>
<?php unset($__componentOriginal9ac128a9029c0e4701924bd2d73d7f54); ?>
<?php endif; ?>

<?php /**PATH C:\Projects\mtt-os\resources\views\settings\departments\index.blade.php ENDPATH**/ ?>