This commit is contained in:
pbao9
2026-01-30 15:42:32 +07:00
parent ffbd567a55
commit 69923ea016
7 changed files with 184 additions and 83 deletions
+26
View File
@@ -0,0 +1,26 @@
<?php
namespace App\View\Components;
use Closure;
use Illuminate\Contracts\View\View;
use Illuminate\View\Component;
class Breabcrumb extends Component
{
/**
* Create a new component instance.
*/
public function __construct()
{
//
}
/**
* Get the view / contents that represent the component.
*/
public function render(): View|Closure|string
{
return view('components.breabcrumb');
}
}
@@ -1,38 +1,53 @@
@extends("admin.main") @extends("administrator.layout.master")
@push('plugin-styles')
<link href="{{ asset('build/plugins/select2/select2.min.css') }}" rel="stylesheet" />
@endpush
@section("content") @section("content")
@if(auth()->guard('admins')->user()->can("add module vcenter")) @if(auth()->guard('admins')->user()->can("add module vcenter"))
<div class="card card-outline card-primary"> <div class="card card-outline card-primary">
<form action="{{ route('package.datacenter.store') }}" method="post"> <form action="{{ route('package.datacenter.store') }}" method="post">
@csrf @csrf
<div class="card-body"> <div class="card-body">
<x-module.v-center :model="null"/> <x-module.v-center :model="null" />
{{-- <livewire:module.vcenter :model="$model ?? null" />--}} {{--
<livewire:module.vcenter :model="$model ?? null" />--}}
{{--Name--}} {{--Name--}}
<div class="row form-group align-items-center mb-0"> <div class="row form-group align-items-center mb-0">
<label for="name" class="col-md-3 text-right">Name</label> <label for="name" class="col-md-3 text-right">Name</label>
<div class="col-md-9 p-1 bg-customer"> <div class="col-md-9 p-1 bg-customer">
<input type="text" id="name" name="name" placeholder="" value="" class="form-control"> <input type="text" id="name" name="name" placeholder="" value="" class="form-control">
</div>
</div>
{{--Datacenter ID--}}
<div class="row form-group align-items-center mb-0">
<label for="datacenter_id" class="col-md-3 text-right">Datacenter ID</label>
<div class="col-md-9 p-1 bg-customer">
<input type="text" id="datacenter_id" name="datacenter_id" placeholder="" value=""
class="form-control">
</div>
</div> </div>
</div> </div>
{{--Datacenter ID--}} <div class="card-footer">
<div class="row form-group align-items-center mb-0"> <a href="{{ route('package.datacenter.index') }}" class="btn btn-outline-secondary">Trở về</a>
<label for="datacenter_id" class="col-md-3 text-right">Datacenter ID</label> <button type="submit" class="btn btn-outline-primary">Lưu dữ liệu</button>
<div class="col-md-9 p-1 bg-customer">
<input type="text" id="datacenter_id" name="datacenter_id" placeholder="" value="" class="form-control">
</div>
</div> </div>
</div> </form>
<div class="card-footer"> </div>
<a href="{{ route('package.datacenter.index') }}" class="btn btn-outline-secondary">Trở về</a> @else
<button type="submit" class="btn btn-outline-primary">Lưu dữ liệu</button> <div class="alert alert-danger alert-dismissible">
</div> <h5 class="mb-0"><i class="icon fas fa-ban"></i> Access Denied - You are not assigned to any Module vCenter
</form> management department</h5>
</div> </div>
@else @endif
<div class="alert alert-danger alert-dismissible">
<h5 class="mb-0"><i class="icon fas fa-ban"></i> Access Denied - You are not assigned to any Module vCenter
management department</h5>
</div>
@endif
@endsection @endsection
@push('plugin-scripts')
<script src="{{ asset('build/plugins/jquery/jquery.min.js') }}"></script>
<script src="{{ asset('build/plugins/select2/select2.min.js') }}"></script>
<script src="{{ asset('build/plugins/datatables.net/dataTables.min.js') }}"></script>
<script src="{{ asset('build/plugins/datatables.net-bs5/dataTables.bootstrap5.min.js') }}"></script>
@endpush
@push('custom-scripts')
@endpush
@@ -1,37 +1,53 @@
@extends("admin.main") @extends("administrator.layout.master")
@push('plugin-styles')
<link href="{{ asset('build/plugins/select2/select2.min.css') }}" rel="stylesheet" />
@endpush
@section("content") @section("content")
@if(auth()->guard('admins')->user()->can("add module vcenter")) @if(auth()->guard('admins')->user()->can("add module vcenter"))
<div class="card card-outline card-primary"> <div class="card card-outline card-primary">
<form action="{{ route('package.datacenter.update',['id' => $datacenter->id]) }}" method="post"> <form action="{{ route('package.datacenter.update', ['id' => $datacenter->id]) }}" method="post">
@csrf @csrf
@method('put') @method('put')
<div class="card-body"> <div class="card-body">
<x-module.v-center :model="$datacenter" /> <x-module.v-center :model="$datacenter" />
{{--Name--}} {{--Name--}}
<div class="row form-group align-items-center mb-0"> <div class="row form-group align-items-center mb-0">
<label for="name" class="col-md-3 text-right">Name</label> <label for="name" class="col-md-3 text-right">Name</label>
<div class="col-md-9 p-1 bg-customer"> <div class="col-md-9 p-1 bg-customer">
<input type="text" id="name" name="name" placeholder="" value="{{$datacenter->name}}" class="form-control"> <input type="text" id="name" name="name" placeholder="" value="{{$datacenter->name}}"
class="form-control">
</div>
</div>
{{--Datacenter ID--}}
<div class="row form-group align-items-center mb-0">
<label for="datacenter_id" class="col-md-3 text-right">Datacenter ID</label>
<div class="col-md-9 p-1 bg-customer">
<input type="text" id="datacenter_id" name="datacenter_id" placeholder=""
value="{{$datacenter->datacenter_id}}" class="form-control">
</div>
</div> </div>
</div> </div>
{{--Datacenter ID--}} <div class="card-footer">
<div class="row form-group align-items-center mb-0"> <a href="{{ route('package.datacenter.index') }}" class="btn btn-outline-secondary">Trở về</a>
<label for="datacenter_id" class="col-md-3 text-right">Datacenter ID</label> <button type="submit" class="btn btn-outline-primary">Lưu dữ liệu</button>
<div class="col-md-9 p-1 bg-customer">
<input type="text" id="datacenter_id" name="datacenter_id" placeholder="" value="{{$datacenter->datacenter_id}}" class="form-control">
</div>
</div> </div>
</div> </form>
<div class="card-footer"> </div>
<a href="{{ route('package.datacenter.index') }}" class="btn btn-outline-secondary">Trở về</a> @else
<button type="submit" class="btn btn-outline-primary">Lưu dữ liệu</button> <div class="alert alert-danger alert-dismissible">
</div> <h5 class="mb-0"><i class="icon fas fa-ban"></i> Access Denied - You are not assigned to any Module vCenter
</form> management department</h5>
</div> </div>
@else @endif
<div class="alert alert-danger alert-dismissible"> @endsection
<h5 class="mb-0"><i class="icon fas fa-ban"></i> Access Denied - You are not assigned to any Module vCenter
management department</h5> @push('plugin-scripts')
</div> <script src="{{ asset('build/plugins/jquery/jquery.min.js') }}"></script>
@endif <script src="{{ asset('build/plugins/select2/select2.min.js') }}"></script>
@endsection <script src="{{ asset('build/plugins/datatables.net/dataTables.min.js') }}"></script>
<script src="{{ asset('build/plugins/datatables.net-bs5/dataTables.bootstrap5.min.js') }}"></script>
@endpush
@push('custom-scripts')
@endpush
@@ -4,6 +4,17 @@
<link href="{{ asset('build/plugins/select2/select2.min.css') }}" rel="stylesheet" /> <link href="{{ asset('build/plugins/select2/select2.min.css') }}" rel="stylesheet" />
@endpush @endpush
@section('breadcrumb')
@php
$breadcrumbItems = [
['label' => 'Modules'],
['label' => 'Package vCenter'],
['label' => 'Datacenter', 'active' => true],
];
@endphp
<x-breabcrumb :items="$breadcrumbItems" />
@endsection
@section('content') @section('content')
@if(auth()->guard('admins')->user()->can("manager package module")) @if(auth()->guard('admins')->user()->can("manager package module"))
<div class="card card-primary card-outline"> <div class="card card-primary card-outline">
@@ -12,13 +23,13 @@
</div> </div>
<div class="card-body p-5"> <div class="card-body p-5">
<x-datatable id="datacenterTable" ajax="{{ route('package.datacenter.datatable') }}" :columns="[ <x-datatable id="datacenterTable" ajax="{{ route('package.datacenter.datatable') }}" :columns="[
['key' => 'id', 'label' => 'ID'], ['key' => 'id', 'label' => 'ID'],
['key' => 'name', 'label' => 'Name'], ['key' => 'name', 'label' => 'Name'],
['key' => 'v_center.host', 'label' => 'vCenter Host'], ['key' => 'v_center.host', 'label' => 'vCenter Host'],
['key' => 'action', 'label' => 'Action'] ['key' => 'action', 'label' => 'Action']
]" /> ]" />
</div>
</div> </div>
</div>
@else @else
<div class="alert alert-danger alert-dismissible"> <div class="alert alert-danger alert-dismissible">
<h5 class="mb-0"><i class="icon fas fa-ban"></i> Access Denied - You are not assigned to any Module Package <h5 class="mb-0"><i class="icon fas fa-ban"></i> Access Denied - You are not assigned to any Module Package
@@ -56,6 +56,7 @@
<div class="page-wrapper"> <div class="page-wrapper">
@include('administrator.layout.partials.header') @include('administrator.layout.partials.header')
<div class="page-content"> <div class="page-content">
@yield('breadcrumb')
@yield('content') @yield('content')
<div id="fui-toast"></div> <div id="fui-toast"></div>
</div> </div>
@@ -0,0 +1,19 @@
@props(['items' => []])
<nav class="page-breadcrumb">
<ol class="breadcrumb">
@foreach($items as $item)
@if(!empty($item['active']))
<li class="breadcrumb-item active" aria-current="page">{{ $item['label'] }}</li>
@else
<li class="breadcrumb-item">
@if(isset($item['url']))
<a href="{{ $item['url'] }}">{{ $item['label'] }}</a>
@else
{{ $item['label'] }}
@endif
</li>
@endif
@endforeach
</ol>
</nav>
@@ -21,44 +21,57 @@
</div> </div>
</div> </div>
@push('scripts') @push('custom-scripts')
<script> <script>
$(document).ready(function() { $(document).ready(function () {
// Prevent multiple initializations using namespace // Prevent multiple initializations using namespace
if (window.vcenterComponentInitialized) { if (window.vcenterComponentInitialized) {
return; return;
} }
window.vcenterComponentInitialized = true; window.vcenterComponentInitialized = true;
initSelect2(); $('.select2').select2({
width: '100%'
});
const $vcenter = $('.vcenter_id'); const $vcenter = $('.vcenter_id');
const $datacenter = $('.datacenter_id'); const $datacenter = $('.datacenter_id');
const $host = $('.host_id'); const $host = $('.host_id');
// Disable datacenter and host initially // Disable datacenter and host initially
$datacenter.prop('disabled', true); // Note: In edit view these might be inputs not selects, so this logic might need adjustment if intended for cascading selects.
$host.prop('disabled', true); // For now, keeping logic but ensuring it doesn't break if elements aren't selects.
if ($datacenter.is('select')) {
$datacenter.prop('disabled', true);
}
if ($host.is('select')) {
$host.prop('disabled', true);
}
// Remove existing event handlers and bind new ones with namespace // Remove existing event handlers and bind new ones with namespace
$vcenter.off('change.vcenterComponent').on('change.vcenterComponent', function() { $vcenter.off('change.vcenterComponent').on('change.vcenterComponent', function () {
const vcenterId = $(this).val(); const vcenterId = $(this).val();
// Reset and disable datacenter and host // Reset and disable datacenter and host if they are selects
$datacenter.html('<option value="">--- Chọn Datacenter ---</option>').prop('disabled', true); if ($datacenter.is('select')) {
$host.html('<option value="">--- Chọn Host ---</option>').prop('disabled', true); $datacenter.html('<option value="">--- Chọn Datacenter ---</option>').prop('disabled', true);
}
if ($host.is('select')) {
$host.html('<option value="">--- Chọn Host ---</option>').prop('disabled', true);
}
// Enable datacenter if vcenter is selected // Enable datacenter if vcenter is selected
if (vcenterId) { if (vcenterId) {
$datacenter.prop('disabled', false); if ($datacenter.is('select')) $datacenter.prop('disabled', false);
} }
}); });
// Trigger initial state // Trigger initial state
if ($vcenter.val()) { if ($vcenter.val()) {
$datacenter.prop('disabled', false); if ($datacenter.is('select')) $datacenter.prop('disabled', false);
} }
}); });
</script> </script>
@endpush @endpush