antv
116 lines
4.9 KiB
PHP
116 lines
4.9 KiB
PHP
@props(['mode', 'user' => null])
|
|
|
|
@php
|
|
$isCreate = $mode === 'create';
|
|
$isEdit = $mode === 'edit';
|
|
$isDelete = $mode === 'delete';
|
|
$isSelf = $mode === 'self';
|
|
|
|
$actionUrl = match($mode) {
|
|
'create' => route('admin.users.store'),
|
|
'edit' => route('admin.users.update', $user?->msnv),
|
|
'delete' => route('admin.users.destroy', $user?->msnv),
|
|
'self' => route('user.update_profile'),
|
|
default => null,
|
|
};
|
|
|
|
$method = match($mode) {
|
|
'edit' => 'PUT',
|
|
'delete' => 'DELETE',
|
|
default => 'POST',
|
|
};
|
|
@endphp
|
|
|
|
<div class="bg-white rounded-[24px] shadow-[0_10px_30px_rgba(15,23,42,0.05)] border border-white overflow-hidden flex flex-col justify-between">
|
|
@if($mode !== 'edit')
|
|
<div class="bg-gradient-to-r from-blue-50/70 via-indigo-50/50 to-purple-50/30 px-6 py-6 sm:px-8 border-b border-gray-100">
|
|
<h3 class="text-[17px] font-extrabold text-[#1a2b49] leading-tight flex items-center gap-2">
|
|
<span>{{ match($mode) {
|
|
'create' => '👥 Thêm User Mới',
|
|
'delete' => '⚠️ Xác nhận nghỉ việc: ' . ($user?->msnv),
|
|
'self' => '👤 Thông tin cá nhân: ' . ($user?->msnv),
|
|
} }}</span>
|
|
</h3>
|
|
</div>
|
|
@endif
|
|
|
|
@if(!$isCreate && $user && !$isEdit && !$isSelf)
|
|
<div class="p-6 sm:p-8 pb-0">
|
|
<div class="mb-2 p-5 rounded-2xl bg-gradient-to-br from-slate-50 to-gray-50 border border-gray-100 flex items-center gap-4 shadow-sm">
|
|
<div class="w-12 h-12 rounded-full bg-blue-50 text-[#3462f7] flex items-center justify-center font-extrabold text-lg shadow-inner flex-shrink-0">
|
|
{{ strtoupper(substr($user->name ?? $user->msnv, 0, 2)) }}
|
|
</div>
|
|
<div class="flex-1 min-w-0">
|
|
<h4 class="font-extrabold text-[#1a2b49] text-base truncate">{{ $user->name }}</h4>
|
|
<p class="text-xs text-gray-500 font-medium truncate mb-1">{{ $user->mail }}</p>
|
|
<div class="flex items-center gap-2">
|
|
<span class="px-2 py-0.5 text-[10px] font-bold rounded-full bg-blue-50 text-blue-700 border border-blue-100">
|
|
{{ $user->role == config('constants.ROLE_ADMIN') ? 'Admin' : 'Member' }}
|
|
</span>
|
|
<span class="text-xs text-gray-300 font-semibold">•</span>
|
|
<span class="text-xs font-bold text-gray-600">Thẻ: <span class="text-orange-500 font-extrabold text-sm">{{ $user->card }}</span></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endif
|
|
|
|
@if($actionUrl)
|
|
<form action="{{ $actionUrl }}" method="POST" enctype="multipart/form-data" class="flex flex-col flex-1 justify-between">
|
|
@csrf
|
|
@if($method !== 'POST')
|
|
@method($method)
|
|
@endif
|
|
@endif
|
|
|
|
<div class="p-6 sm:p-8 {{ !$isCreate && !$isEdit && !$isSelf ? 'pt-0' : '' }} space-y-5">
|
|
@if($isDelete && $user)
|
|
<p class="text-sm text-red-600 leading-relaxed font-semibold">
|
|
Bạn có chắc chắn muốn cho nhân viên {{ $user->msnv }} nghỉ việc không? Tài khoản này sẽ không thể đăng nhập hoặc thực hiện các giao dịch thẻ sau khi xác nhận.
|
|
</p>
|
|
@else
|
|
<!-- 2. User Basic Information Section -->
|
|
<x-user-basic-info :mode="$mode" :user="$user" />
|
|
|
|
<!-- 3. User Security Section -->
|
|
<x-user-security-section :mode="$mode" :user="$user" />
|
|
|
|
<!-- 4. User Administration Fields Section -->
|
|
<x-user-admin-section :mode="$mode" :user="$user" />
|
|
@endif
|
|
</div>
|
|
|
|
<x-action-panel :mode="$mode" :user="$user" />
|
|
|
|
@if($actionUrl)
|
|
</form>
|
|
@endif
|
|
</div>
|
|
|
|
@if($isCreate || $isEdit)
|
|
@push('scripts')
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
if (document.getElementById('departments') && typeof TomSelect === 'function') {
|
|
new TomSelect("#departments", {
|
|
create: false,
|
|
sortField: {
|
|
field: "text",
|
|
direction: "asc"
|
|
},
|
|
placeholder: "Tìm phòng ban...",
|
|
render: {
|
|
item: function(data, escape) {
|
|
return '<div class="item" title="' + escape(data.text) + '">' + escape(data.text) + '</div>';
|
|
},
|
|
no_results: function(data, escape) {
|
|
return '<div class="no-results p-3 text-gray-500">Không tìm thấy phòng ban nào</div>';
|
|
}
|
|
}
|
|
});
|
|
}
|
|
});
|
|
</script>
|
|
@endpush
|
|
@endif
|