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")
@if(auth()->guard('admins')->user()->can("add module vcenter"))
<div class="card card-outline card-primary">
<form action="{{ route('package.datacenter.store') }}" method="post">
@csrf
<div class="card-body">
<x-module.v-center :model="null"/>
{{-- <livewire:module.vcenter :model="$model ?? null" />--}}
@if(auth()->guard('admins')->user()->can("add module vcenter"))
<div class="card card-outline card-primary">
<form action="{{ route('package.datacenter.store') }}" method="post">
@csrf
<div class="card-body">
<x-module.v-center :model="null" />
{{--
<livewire:module.vcenter :model="$model ?? null" />--}}
{{--Name--}}
<div class="row form-group align-items-center mb-0">
<label for="name" class="col-md-3 text-right">Name</label>
<div class="col-md-9 p-1 bg-customer">
<input type="text" id="name" name="name" placeholder="" value="" class="form-control">
{{--Name--}}
<div class="row form-group align-items-center mb-0">
<label for="name" class="col-md-3 text-right">Name</label>
<div class="col-md-9 p-1 bg-customer">
<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>
{{--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 class="card-footer">
<a href="{{ route('package.datacenter.index') }}" class="btn btn-outline-secondary">Trở về</a>
<button type="submit" class="btn btn-outline-primary">Lưu dữ liệu</button>
</div>
</div>
<div class="card-footer">
<a href="{{ route('package.datacenter.index') }}" class="btn btn-outline-secondary">Trở về</a>
<button type="submit" class="btn btn-outline-primary">Lưu dữ liệu</button>
</div>
</form>
</div>
@else
<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
</form>
</div>
@else
<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
@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")
@if(auth()->guard('admins')->user()->can("add module vcenter"))
<div class="card card-outline card-primary">
<form action="{{ route('package.datacenter.update',['id' => $datacenter->id]) }}" method="post">
@csrf
@method('put')
<div class="card-body">
<x-module.v-center :model="$datacenter" />
{{--Name--}}
<div class="row form-group align-items-center mb-0">
<label for="name" class="col-md-3 text-right">Name</label>
<div class="col-md-9 p-1 bg-customer">
<input type="text" id="name" name="name" placeholder="" value="{{$datacenter->name}}" class="form-control">
@if(auth()->guard('admins')->user()->can("add module vcenter"))
<div class="card card-outline card-primary">
<form action="{{ route('package.datacenter.update', ['id' => $datacenter->id]) }}" method="post">
@csrf
@method('put')
<div class="card-body">
<x-module.v-center :model="$datacenter" />
{{--Name--}}
<div class="row form-group align-items-center mb-0">
<label for="name" class="col-md-3 text-right">Name</label>
<div class="col-md-9 p-1 bg-customer">
<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>
{{--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 class="card-footer">
<a href="{{ route('package.datacenter.index') }}" class="btn btn-outline-secondary">Trở về</a>
<button type="submit" class="btn btn-outline-primary">Lưu dữ liệu</button>
</div>
</div>
<div class="card-footer">
<a href="{{ route('package.datacenter.index') }}" class="btn btn-outline-secondary">Trở về</a>
<button type="submit" class="btn btn-outline-primary">Lưu dữ liệu</button>
</div>
</form>
</div>
@else
<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
</form>
</div>
@else
<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
@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
@@ -4,6 +4,17 @@
<link href="{{ asset('build/plugins/select2/select2.min.css') }}" rel="stylesheet" />
@endpush
@section('breadcrumb')
@php
$breadcrumbItems = [
['label' => 'Modules'],
['label' => 'Package vCenter'],
['label' => 'Datacenter', 'active' => true],
];
@endphp
<x-breabcrumb :items="$breadcrumbItems" />
@endsection
@section('content')
@if(auth()->guard('admins')->user()->can("manager package module"))
<div class="card card-primary card-outline">
@@ -12,13 +23,13 @@
</div>
<div class="card-body p-5">
<x-datatable id="datacenterTable" ajax="{{ route('package.datacenter.datatable') }}" :columns="[
['key' => 'id', 'label' => 'ID'],
['key' => 'name', 'label' => 'Name'],
['key' => 'v_center.host', 'label' => 'vCenter Host'],
['key' => 'action', 'label' => 'Action']
]" />
</div>
['key' => 'id', 'label' => 'ID'],
['key' => 'name', 'label' => 'Name'],
['key' => 'v_center.host', 'label' => 'vCenter Host'],
['key' => 'action', 'label' => 'Action']
]" />
</div>
</div>
@else
<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
@@ -56,6 +56,7 @@
<div class="page-wrapper">
@include('administrator.layout.partials.header')
<div class="page-content">
@yield('breadcrumb')
@yield('content')
<div id="fui-toast"></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>
@push('scripts')
@push('custom-scripts')
<script>
$(document).ready(function() {
$(document).ready(function () {
// Prevent multiple initializations using namespace
if (window.vcenterComponentInitialized) {
return;
}
window.vcenterComponentInitialized = true;
initSelect2();
$('.select2').select2({
width: '100%'
});
const $vcenter = $('.vcenter_id');
const $datacenter = $('.datacenter_id');
const $host = $('.host_id');
// Disable datacenter and host initially
$datacenter.prop('disabled', true);
$host.prop('disabled', true);
// Note: In edit view these might be inputs not selects, so this logic might need adjustment if intended for cascading selects.
// 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
$vcenter.off('change.vcenterComponent').on('change.vcenterComponent', function() {
$vcenter.off('change.vcenterComponent').on('change.vcenterComponent', function () {
const vcenterId = $(this).val();
// Reset and disable datacenter and host
$datacenter.html('<option value="">--- Chọn Datacenter ---</option>').prop('disabled', true);
$host.html('<option value="">--- Chọn Host ---</option>').prop('disabled', true);
// Reset and disable datacenter and host if they are selects
if ($datacenter.is('select')) {
$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
if (vcenterId) {
$datacenter.prop('disabled', false);
if ($datacenter.is('select')) $datacenter.prop('disabled', false);
}
});
// Trigger initial state
if ($vcenter.val()) {
$datacenter.prop('disabled', false);
if ($datacenter.is('select')) $datacenter.prop('disabled', false);
}
});
</script>
</script>
@endpush