feat: Refactor addon management to use AddonType and AddonInputType enums, update the database schema, and implement a grouped datatable display for addons.
This commit is contained in:
pbao9
@@ -0,0 +1,28 @@
|
||||
<?php
|
||||
|
||||
namespace App\Enums;
|
||||
|
||||
enum AddonInputType: string
|
||||
{
|
||||
case NUMBER = 'number';
|
||||
case SLIDER = 'slider';
|
||||
case SELECT = 'select';
|
||||
|
||||
public function label(): string
|
||||
{
|
||||
return match ($this) {
|
||||
self::NUMBER => 'Số',
|
||||
self::SLIDER => 'Thanh trượt',
|
||||
self::SELECT => 'Chọn',
|
||||
};
|
||||
}
|
||||
|
||||
public static function getOptions(): array
|
||||
{
|
||||
return [
|
||||
self::NUMBER->value => self::NUMBER->label(),
|
||||
self::SLIDER->value => self::SLIDER->label(),
|
||||
self::SELECT->value => self::SELECT->label(),
|
||||
];
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,33 @@
|
||||
<?php
|
||||
|
||||
namespace App\Enums;
|
||||
|
||||
enum AddonType: string
|
||||
{
|
||||
case VPS = 'vps';
|
||||
case HOSTING = 'hosting';
|
||||
case DOMAIN = 'domain';
|
||||
|
||||
public function label(): string
|
||||
{
|
||||
return match ($this) {
|
||||
self::VPS => 'VPS',
|
||||
self::HOSTING => 'Hosting',
|
||||
self::DOMAIN => 'Domain',
|
||||
};
|
||||
}
|
||||
|
||||
public static function getOptions(): array
|
||||
{
|
||||
return [
|
||||
self::VPS->value => self::VPS->label(),
|
||||
self::HOSTING->value => self::HOSTING->label(),
|
||||
self::DOMAIN->value => self::DOMAIN->label(),
|
||||
];
|
||||
}
|
||||
|
||||
public static function values(): array
|
||||
{
|
||||
return array_column(self::cases(), 'value');
|
||||
}
|
||||
}
|
||||
@@ -2,6 +2,7 @@
|
||||
|
||||
namespace App\Http\Controllers\admin;
|
||||
|
||||
use App\Enums\AddonType;
|
||||
use App\Http\Controllers\Controller;
|
||||
use App\Http\Requests\AddOnRequest;
|
||||
use App\Models\Addon;
|
||||
@@ -102,22 +103,58 @@ class AddonController extends Controller
|
||||
|
||||
public function datatable(Request $request)
|
||||
{
|
||||
$query = $this->addonRepository->filter(
|
||||
$request->all(),
|
||||
[],
|
||||
[],
|
||||
['*'],
|
||||
true
|
||||
);
|
||||
$addons = Addon::orderBy('sort_order')->get();
|
||||
|
||||
return DataTables::eloquent($query)
|
||||
->addColumn(
|
||||
'action',
|
||||
function ($d) {
|
||||
return view('administrator.pages.addon.datatable.action', ['row' => $d])->render();
|
||||
$grouped = $addons->groupBy(function ($item) {
|
||||
return $item->type instanceof AddonType
|
||||
? $item->type->value
|
||||
: $item->type;
|
||||
});
|
||||
|
||||
$types = AddonType::values();
|
||||
$data = [];
|
||||
|
||||
foreach ($types as $type) {
|
||||
$typeEnum = AddonType::tryFrom($type);
|
||||
$typeLabel = $typeEnum ? $typeEnum->label() : $type;
|
||||
$typeAddons = $grouped->get($type, collect());
|
||||
|
||||
$childrenHtml = view('administrator.pages.addon.datatable.children', [
|
||||
'children' => $typeAddons
|
||||
])->render();
|
||||
|
||||
$data[] = [
|
||||
'id' => $type,
|
||||
'type' => $type,
|
||||
'name' => $typeLabel,
|
||||
'code' => $type,
|
||||
'children' => $typeAddons->toArray(),
|
||||
'children_html' => $childrenHtml,
|
||||
'status' => true,
|
||||
];
|
||||
}
|
||||
|
||||
return DataTables::of(collect($data))
|
||||
->addColumn('details_control', function ($d) {
|
||||
$hasChildren = !empty($d['children']) && count($d['children']) > 0;
|
||||
if ($hasChildren) {
|
||||
return '<i data-lucide="plus-circle" class="cursor-pointer text-success mx-auto" style="width:15px; height:15px"></i>';
|
||||
}
|
||||
)
|
||||
->rawColumns(['status', 'action'])
|
||||
return '';
|
||||
})
|
||||
->addColumn('name', function ($d) {
|
||||
return $d['name'];
|
||||
})
|
||||
->addColumn('slug', function ($d) {
|
||||
return $d['code'];
|
||||
})
|
||||
->addColumn('is_active', function ($d) {
|
||||
return '<span class="badge bg-success">Active</span>';
|
||||
})
|
||||
->addColumn('action', function ($d) {
|
||||
return '';
|
||||
})
|
||||
->rawColumns(['details_control', 'is_active', 'children_html'])
|
||||
->make(true);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2,6 +2,7 @@
|
||||
|
||||
namespace App\Models;
|
||||
|
||||
use App\Enums\AddonType;
|
||||
use Illuminate\Database\Eloquent\Factories\HasFactory;
|
||||
use Illuminate\Database\Eloquent\Model;
|
||||
|
||||
@@ -12,7 +13,7 @@ class Addon extends Model
|
||||
protected $table = 'product_addon';
|
||||
|
||||
protected $fillable = [
|
||||
'type_id',
|
||||
'type',
|
||||
'code',
|
||||
'name',
|
||||
'price',
|
||||
@@ -20,7 +21,13 @@ class Addon extends Model
|
||||
'max',
|
||||
'step',
|
||||
'prefix',
|
||||
'input_type',
|
||||
'status',
|
||||
'sort_order'
|
||||
];
|
||||
|
||||
protected $casts = [
|
||||
'type' => AddonType::class,
|
||||
'status' => 'boolean',
|
||||
];
|
||||
}
|
||||
|
||||
+22
@@ -0,0 +1,22 @@
|
||||
<?php
|
||||
|
||||
use Illuminate\Database\Migrations\Migration;
|
||||
use Illuminate\Database\Schema\Blueprint;
|
||||
use Illuminate\Support\Facades\Schema;
|
||||
|
||||
return new class extends Migration
|
||||
{
|
||||
public function up(): void
|
||||
{
|
||||
Schema::table('product_addon', function (Blueprint $table) {
|
||||
$table->renameColumn('type_id', 'type');
|
||||
});
|
||||
}
|
||||
|
||||
public function down(): void
|
||||
{
|
||||
Schema::table('product_addon', function (Blueprint $table) {
|
||||
$table->renameColumn('type', 'type_id');
|
||||
});
|
||||
}
|
||||
};
|
||||
@@ -10,42 +10,139 @@ class AddonSeeder extends Seeder
|
||||
public function run(): void
|
||||
{
|
||||
$addons = [
|
||||
// VPS Addons
|
||||
[
|
||||
'type_id' => 'vps',
|
||||
'type' => 'vps',
|
||||
'code' => 'cpu',
|
||||
'name' => 'CPU',
|
||||
'price' => 100000,
|
||||
'min' => 0,
|
||||
'max' => 30,
|
||||
'price' => 20000,
|
||||
'min' => 1,
|
||||
'max' => 32,
|
||||
'step' => 1,
|
||||
'prefix' => 'vCore',
|
||||
'input_type' => 'number',
|
||||
'status' => true,
|
||||
'sort_order' => 0,
|
||||
],
|
||||
[
|
||||
'type_id' => 'vps',
|
||||
'type' => 'vps',
|
||||
'code' => 'ram',
|
||||
'name' => 'RAM',
|
||||
'price' => 50000,
|
||||
'min' => 0,
|
||||
'max' => 32,
|
||||
'price' => 100000,
|
||||
'min' => 1,
|
||||
'max' => 64,
|
||||
'step' => 1,
|
||||
'prefix' => 'GB',
|
||||
'input_type' => 'number',
|
||||
'status' => true,
|
||||
'sort_order' => 1,
|
||||
],
|
||||
[
|
||||
'type_id' => 'vps',
|
||||
'type' => 'vps',
|
||||
'code' => 'disk',
|
||||
'name' => 'SSD',
|
||||
'price' => 4000,
|
||||
'min' => 0,
|
||||
'max' => 1500,
|
||||
'step' => 10,
|
||||
'min' => 25,
|
||||
'max' => 2000,
|
||||
'step' => 25,
|
||||
'prefix' => 'GB',
|
||||
'input_type' => 'number',
|
||||
'status' => true,
|
||||
'sort_order' => 2,
|
||||
],
|
||||
[
|
||||
'type' => 'vps',
|
||||
'code' => 'gpu',
|
||||
'name' => 'GPU',
|
||||
'price' => 500000,
|
||||
'min' => 0,
|
||||
'max' => 4,
|
||||
'step' => 1,
|
||||
'prefix' => 'GB',
|
||||
'input_type' => 'select',
|
||||
'status' => true,
|
||||
'sort_order' => 3,
|
||||
],
|
||||
[
|
||||
'type' => 'vps',
|
||||
'code' => 'bandwidth',
|
||||
'name' => 'Bandwidth',
|
||||
'price' => 50000,
|
||||
'min' => 100,
|
||||
'max' => 10000,
|
||||
'step' => 100,
|
||||
'prefix' => 'Mbps',
|
||||
'input_type' => 'slider',
|
||||
'status' => true,
|
||||
'sort_order' => 4,
|
||||
],
|
||||
|
||||
// Hosting Addons
|
||||
[
|
||||
'type' => 'hosting',
|
||||
'code' => 'hosting_cpu',
|
||||
'name' => 'CPU',
|
||||
'price' => 15000,
|
||||
'min' => 1,
|
||||
'max' => 8,
|
||||
'step' => 1,
|
||||
'prefix' => 'Core',
|
||||
'input_type' => 'number',
|
||||
'status' => true,
|
||||
'sort_order' => 10,
|
||||
],
|
||||
[
|
||||
'type' => 'hosting',
|
||||
'code' => 'hosting_ram',
|
||||
'name' => 'RAM',
|
||||
'price' => 25000,
|
||||
'min' => 512,
|
||||
'max' => 16384,
|
||||
'step' => 512,
|
||||
'prefix' => 'MB',
|
||||
'input_type' => 'number',
|
||||
'status' => true,
|
||||
'sort_order' => 11,
|
||||
],
|
||||
[
|
||||
'type' => 'hosting',
|
||||
'code' => 'hosting_disk',
|
||||
'name' => 'Disk',
|
||||
'price' => 2000,
|
||||
'min' => 5,
|
||||
'max' => 500,
|
||||
'step' => 5,
|
||||
'prefix' => 'GB',
|
||||
'input_type' => 'number',
|
||||
'status' => true,
|
||||
'sort_order' => 12,
|
||||
],
|
||||
[
|
||||
'type' => 'hosting',
|
||||
'code' => 'hosting_bandwidth',
|
||||
'name' => 'Bandwidth',
|
||||
'price' => 10000,
|
||||
'min' => 10,
|
||||
'max' => 1000,
|
||||
'step' => 10,
|
||||
'prefix' => 'GB',
|
||||
'input_type' => 'slider',
|
||||
'status' => true,
|
||||
'sort_order' => 13,
|
||||
],
|
||||
[
|
||||
'type' => 'hosting',
|
||||
'code' => 'hosting_ip',
|
||||
'name' => 'IP Address',
|
||||
'price' => 30000,
|
||||
'min' => 0,
|
||||
'max' => 5,
|
||||
'step' => 1,
|
||||
'prefix' => 'IP',
|
||||
'input_type' => 'number',
|
||||
'status' => true,
|
||||
'sort_order' => 14,
|
||||
],
|
||||
];
|
||||
|
||||
Addon::upsert($addons, ['code']);
|
||||
|
||||
@@ -17,7 +17,7 @@ class OsSeeder extends Seeder
|
||||
[
|
||||
'name' => 'Ubuntu',
|
||||
'thumbnail' => 'ubuntu.png',
|
||||
'module_host_id' => 1,
|
||||
'module_host_id' => null,
|
||||
'status' => 1,
|
||||
'versions' => [
|
||||
'20.04 LTS',
|
||||
@@ -28,7 +28,7 @@ class OsSeeder extends Seeder
|
||||
[
|
||||
'name' => 'CentOS',
|
||||
'thumbnail' => 'centos.png',
|
||||
'module_host_id' => 1,
|
||||
'module_host_id' => null,
|
||||
'status' => 1,
|
||||
'versions' => [
|
||||
'7',
|
||||
@@ -38,7 +38,7 @@ class OsSeeder extends Seeder
|
||||
[
|
||||
'name' => 'Debian',
|
||||
'thumbnail' => 'debian.png',
|
||||
'module_host_id' => 1,
|
||||
'module_host_id' => null,
|
||||
'status' => 1,
|
||||
'versions' => [
|
||||
'10',
|
||||
@@ -49,7 +49,7 @@ class OsSeeder extends Seeder
|
||||
[
|
||||
'name' => 'Windows Server',
|
||||
'thumbnail' => 'windows.png',
|
||||
'module_host_id' => 1,
|
||||
'module_host_id' => null,
|
||||
'status' => 1,
|
||||
'versions' => [
|
||||
'2016',
|
||||
|
||||
@@ -7,124 +7,171 @@
|
||||
|
||||
@section('breadcrumb')
|
||||
@php
|
||||
$breadcrumbItems = [
|
||||
['label' => 'Product'],
|
||||
['label' => 'Product Addons'],
|
||||
['label' => 'Product Addons List', 'url' => route('addon.index')],
|
||||
['label' => 'Add new addon', 'active' => true],
|
||||
];
|
||||
$breadcrumbItems = [
|
||||
['label' => 'Product'],
|
||||
['label' => 'Product Addons', 'url' => route('addon.index')],
|
||||
['label' => 'Add New Addon', 'active' => true],
|
||||
];
|
||||
@endphp
|
||||
<x-admin-breadcrumb :items="$breadcrumbItems" />
|
||||
@endsection
|
||||
|
||||
@php
|
||||
use App\Enums\Status;
|
||||
use App\Enums\Status;
|
||||
use App\Enums\AddonType;
|
||||
use App\Enums\AddonInputType;
|
||||
@endphp
|
||||
|
||||
@section('content')
|
||||
@if (auth()->guard('admins')->user()->can('manager product'))
|
||||
<div class="card card-outline card-primary">
|
||||
<div class="card-header">
|
||||
Create New Addon
|
||||
<form action="{{ route('addon.store') }}" method="post">
|
||||
@csrf
|
||||
<div class="row align-items-start">
|
||||
<div class="col-md-8">
|
||||
<div class="card card-primary card-outline">
|
||||
<div class="card-header">
|
||||
<h5 class="card-title m-0">Add New Addon</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-4">
|
||||
<h5 class="text-primary border-bottom mb-3 pb-2">Basic Information</h5>
|
||||
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label for="type">Type <span class="text-danger">*</span></label>
|
||||
<select name="type" id="type" class="form-control select2">
|
||||
@foreach (AddonType::getOptions() as $value => $label)
|
||||
<option value="{{ $value }}">{{ $label }}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label for="sort_order">Sort Order</label>
|
||||
<input type="number" name="sort_order" id="sort_order"
|
||||
value="{{ old('sort_order', 0) }}" class="form-control" placeholder="0">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label for="name">Name <span class="text-danger">*</span></label>
|
||||
<input type="text" name="name" id="name"
|
||||
value="{{ old('name') }}" class="form-control" placeholder="CPU, RAM, Disk...">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label for="code">Code <span class="text-danger">*</span></label>
|
||||
<input type="text" name="code" id="code"
|
||||
value="{{ old('code') }}" class="form-control" placeholder="cpu, ram, disk...">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group mb-3">
|
||||
<label for="prefix">Prefix</label>
|
||||
<input type="text" name="prefix" id="prefix"
|
||||
value="{{ old('prefix') }}" class="form-control" placeholder="vCore, GB, Mbps...">
|
||||
<small class="text-muted">Đơn vị hiển thị (VD: GB, vCore, Mbps)</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<h5 class="text-primary border-bottom mb-3 pb-2">Configuration</h5>
|
||||
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="min">Min Value</label>
|
||||
<input type="number" name="min" id="min"
|
||||
value="{{ old('min', 0) }}" class="form-control" placeholder="1">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="max">Max Value</label>
|
||||
<input type="number" name="max" id="max"
|
||||
value="{{ old('max') }}" class="form-control" placeholder="32">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="step">Step</label>
|
||||
<input type="number" name="step" id="step"
|
||||
value="{{ old('step', 1) }}" class="form-control" placeholder="1">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<small class="text-muted d-block mb-3">Step là bước nhảy: VD RAM step=1 nhảy 1GB, step=512 nhảy 512MB</small>
|
||||
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label for="price">Price / Step <span class="text-danger">*</span></label>
|
||||
<div class="input-group">
|
||||
<input type="number" name="price" id="price"
|
||||
value="{{ old('price', 0) }}" class="form-control" placeholder="20000">
|
||||
<div class="input-group-append">
|
||||
<span class="input-group-text">VND</span>
|
||||
</div>
|
||||
</div>
|
||||
<small class="text-muted">Giá cho mỗi step (VD: 1 Core = 20,000đ)</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label for="input_type">Input Type</label>
|
||||
<select name="input_type" id="input_type" class="form-control select2">
|
||||
@foreach (AddonInputType::getOptions() as $value => $label)
|
||||
<option value="{{ $value }}">{{ $label }}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<div class="card card-primary card-outline">
|
||||
<div class="card-header">
|
||||
<h5 class="card-title m-0">Publish</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="form-group mb-3">
|
||||
<label for="status">Status</label>
|
||||
<select name="status" id="status" class="form-control select2">
|
||||
@foreach (Status::getOptions() as $value => $label)
|
||||
<option value="{{ $value }}">{{ $label }}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<form action="{{ route('addon.store') }}" method="post">
|
||||
@csrf
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
{{-- 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 bg-customer p-1">
|
||||
<input type="text" id="name" name="name" placeholder="CPU, RAM, Disk..."
|
||||
value="{{ old('name') }}" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Code --}}
|
||||
<div class="row form-group align-items-center mb-0">
|
||||
<label for="code" class="col-md-3 text-right">Code</label>
|
||||
<div class="col-md-9 bg-customer p-1">
|
||||
<input type="text" id="code" name="code" placeholder="cpu, ram, disk..."
|
||||
value="{{ old('code') }}" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Price --}}
|
||||
<div class="row form-group align-items-center mb-0">
|
||||
<label for="price" class="col-md-3 text-right">Price</label>
|
||||
<div class="col-md-9 bg-customer p-1">
|
||||
<input type="number" id="price" name="price" placeholder="100000"
|
||||
value="{{ old('price') ?? 0 }}" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Min --}}
|
||||
<div class="row form-group align-items-center mb-0">
|
||||
<label for="min" class="col-md-3 text-right">Min</label>
|
||||
<div class="col-md-9 bg-customer p-1">
|
||||
<input type="number" id="min" name="min" placeholder="0"
|
||||
value="{{ old('min') }}" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Max --}}
|
||||
<div class="row form-group align-items-center mb-0">
|
||||
<label for="max" class="col-md-3 text-right">Max</label>
|
||||
<div class="col-md-9 bg-customer p-1">
|
||||
<input type="number" id="max" name="max" placeholder="100000"
|
||||
value="{{ old('max') }}" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Step --}}
|
||||
<div class="row form-group align-items-center mb-0">
|
||||
<label for="step" class="col-md-3 text-right">Step</label>
|
||||
<div class="col-md-9 bg-customer p-1">
|
||||
<input type="number" id="step" name="step" placeholder="1"
|
||||
value="{{ old('step') }}" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Prefix --}}
|
||||
<div class="row form-group align-items-center mb-0">
|
||||
<label for="prefix" class="col-md-3 text-right">Prefix</label>
|
||||
<div class="col-md-9 bg-customer p-1">
|
||||
<input type="text" id="prefix" name="prefix" placeholder="vCore, GB..."
|
||||
value="{{ old('prefix') }}" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
{{-- Status --}}
|
||||
<div class="row form-group align-items-center mb-0">
|
||||
<label for="status" class="col-md-3 text-right">Status</label>
|
||||
<div class="col-md-9 bg-customer p-1">
|
||||
<select class="select2 single__select" id="status" name="status">
|
||||
@foreach (Status::getOptions() as $value => $label)
|
||||
<option value="{{ $value }}">
|
||||
{{ $label }}
|
||||
</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<x-fixed-action-bar>
|
||||
<x-button-crm type="button" variant="secondary" size="sm" icon="arrow-left"
|
||||
route="addon.index">Cancel</x-button-crm>
|
||||
<x-button-crm type="submit" variant="primary" size="sm" icon="plus-circle">Create
|
||||
Addon</x-button-crm>
|
||||
</x-fixed-action-bar>
|
||||
</form>
|
||||
</div>
|
||||
<x-fixed-action-bar>
|
||||
<x-button-crm type="button" variant="secondary" size="sm" icon="arrow-left"
|
||||
route="addon.index">Cancel</x-button-crm>
|
||||
<x-button-crm type="submit" variant="primary" size="sm" icon="plus-circle" class="float-right">
|
||||
Create Addon</x-button-crm>
|
||||
</x-fixed-action-bar>
|
||||
</form>
|
||||
@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 Product
|
||||
management department</h5>
|
||||
<h5 class="mb-0"><i class="icon fas fa-ban"></i> Access Denied - You are not assigned to any Product management department</h5>
|
||||
</div>
|
||||
@endif
|
||||
@endsection
|
||||
|
||||
@push('plugin-scripts')
|
||||
@foreach (config('assets.datatable.js') as $datatable)
|
||||
<script src="{{ asset($datatable) }}"></script>
|
||||
@@ -134,4 +181,4 @@ use App\Enums\Status;
|
||||
$('.select2').select2();
|
||||
});
|
||||
</script>
|
||||
@endpush
|
||||
@endpush
|
||||
|
||||
@@ -0,0 +1,51 @@
|
||||
<table class="table table-bordered table-striped table-hover mb-0 bg-light">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Prefix</th>
|
||||
<th>Min</th>
|
||||
<th>Max</th>
|
||||
<th>Step</th>
|
||||
<th>Price</th>
|
||||
<th>Status</th>
|
||||
<th>Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@forelse($children as $child)
|
||||
<tr>
|
||||
<td>{{ $child['name'] }}</td>
|
||||
<td>{{ $child['prefix'] }}</td>
|
||||
<td>{{ $child['min'] }}</td>
|
||||
<td>{{ $child['max'] }}</td>
|
||||
<td>{{ $child['step'] }}</td>
|
||||
<td>{{ number_format($child['price']) }} VND</td>
|
||||
<td>
|
||||
@if($child['status'])
|
||||
<span class="badge bg-success">Active</span>
|
||||
@else
|
||||
<span class="badge bg-danger">Inactive</span>
|
||||
@endif
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex gap-1">
|
||||
<a href="{{ route('addon.edit', ['id' => $child['id']]) }}" class="btn btn-sm btn-outline-primary">
|
||||
<i data-lucide="pencil" style="width:14px;height:14px"></i>
|
||||
</a>
|
||||
<form action="{{ route('addon.destroy', ['id' => $child['id']]) }}" method="POST" class="d-inline">
|
||||
@csrf
|
||||
@method('DELETE')
|
||||
<button type="submit" class="btn btn-sm btn-outline-danger" onclick="return confirm('Are you sure?')">
|
||||
<i data-lucide="trash" style="width:14px;height:14px"></i>
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
@empty
|
||||
<tr>
|
||||
<td colspan="8" class="text-center text-muted">No addons in this group</td>
|
||||
</tr>
|
||||
@endforelse
|
||||
</tbody>
|
||||
</table>
|
||||
@@ -9,9 +9,8 @@
|
||||
@php
|
||||
$breadcrumbItems = [
|
||||
['label' => 'Product'],
|
||||
['label' => 'Product Addons'],
|
||||
['label' => 'Product Addons List', 'url' => route('addon.index')],
|
||||
['label' => 'Edit addon', 'active' => true],
|
||||
['label' => 'Product Addons', 'url' => route('addon.index')],
|
||||
['label' => 'Edit Addon', 'active' => true],
|
||||
];
|
||||
@endphp
|
||||
<x-admin-breadcrumb :items="$breadcrumbItems" />
|
||||
@@ -19,89 +18,176 @@
|
||||
|
||||
@php
|
||||
use App\Enums\Status;
|
||||
use App\Enums\AddonType;
|
||||
use App\Enums\AddonInputType;
|
||||
@endphp
|
||||
|
||||
@section("content")
|
||||
<div class="card card-outline card-primary">
|
||||
<form action="{{ route('addon.update', ['id' => $addon->id]) }}" method="post">
|
||||
@csrf
|
||||
@method('put')
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
{{--Product name--}}
|
||||
<div class="form-group row">
|
||||
<label class="col-md-4" for="name">Name</label>
|
||||
<div class="col-md-8">
|
||||
<input type="text" id="name" name="name" placeholder=".com,.vn,..."
|
||||
value="{{ old('name') ?? $addon->name }}" class="form-control">
|
||||
@section('content')
|
||||
<form action="{{ route('addon.update', ['id' => $addon->id]) }}" method="post">
|
||||
@csrf
|
||||
@method('put')
|
||||
<div class="row align-items-start">
|
||||
<div class="col-md-8">
|
||||
<div class="card card-primary card-outline">
|
||||
<div class="card-header">
|
||||
<h5 class="card-title m-0">Edit Addon: {{ $addon->name }}</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-4">
|
||||
<h5 class="text-primary border-bottom mb-3 pb-2">Basic Information</h5>
|
||||
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label for="type">Type <span class="text-danger">*</span></label>
|
||||
<select name="type" id="type" class="form-control select2">
|
||||
@foreach (AddonType::getOptions() as $value => $label)
|
||||
<option value="{{ $value }}"
|
||||
{{ $addon->type == $value ? 'selected' : '' }}>
|
||||
{{ $label }}
|
||||
</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label for="sort_order">Sort Order</label>
|
||||
<input type="number" name="sort_order" id="sort_order"
|
||||
value="{{ old('sort_order', $addon->sort_order) }}" class="form-control"
|
||||
placeholder="0">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label for="name">Name <span class="text-danger">*</span></label>
|
||||
<input type="text" name="name" id="name"
|
||||
value="{{ old('name', $addon->name) }}" class="form-control"
|
||||
placeholder="CPU, RAM, Disk...">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label for="code">Code <span class="text-danger">*</span></label>
|
||||
<input type="text" name="code" id="code"
|
||||
value="{{ old('code', $addon->code) }}" class="form-control"
|
||||
placeholder="cpu, ram, disk...">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group mb-3">
|
||||
<label for="prefix">Prefix</label>
|
||||
<input type="text" name="prefix" id="prefix"
|
||||
value="{{ old('prefix', $addon->prefix) }}" class="form-control"
|
||||
placeholder="vCore, GB, Mbps...">
|
||||
<small class="text-muted">Đơn vị hiển thị (VD: GB, vCore, Mbps)</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{--Price--}}
|
||||
<div class="form-group row">
|
||||
<label class="col-md-4" for="price">Price</label>
|
||||
<div class="col-md-8">
|
||||
<input type="number" id="price" name="price" placeholder="100000"
|
||||
value="{{ old('price') ?? $addon->price }}" class="form-control">
|
||||
<div class="mb-4">
|
||||
<h5 class="text-primary border-bottom mb-3 pb-2">Configuration</h5>
|
||||
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="min">Min Value</label>
|
||||
<input type="number" name="min" id="min"
|
||||
value="{{ old('min', $addon->min) }}" class="form-control" placeholder="1">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="max">Max Value</label>
|
||||
<input type="number" name="max" id="max"
|
||||
value="{{ old('max', $addon->max) }}" class="form-control" placeholder="32">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="step">Step</label>
|
||||
<input type="number" name="step" id="step"
|
||||
value="{{ old('step', $addon->step) }}" class="form-control" placeholder="1">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<small class="text-muted d-block mb-3">Step là bước nhảy: VD RAM step=1 nhảy 1GB, step=512 nhảy
|
||||
512MB</small>
|
||||
|
||||
{{--Price Sales--}}
|
||||
<div class="form-group row">
|
||||
<label class="col-md-4" for="min">Min</label>
|
||||
<div class="col-md-8">
|
||||
<input type="number" id="min" name="min" placeholder="0"
|
||||
value="{{ old('min') ?? $addon->min }}" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{--Renewal--}}
|
||||
<div class="form-group row">
|
||||
<label class="col-md-4" for="max">Max</label>
|
||||
<div class="col-md-8">
|
||||
<input type="number" id="max" name="max" placeholder="100000"
|
||||
value="{{ old('max') ?? $addon->max }}" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{--Transfer--}}
|
||||
<div class="form-group row">
|
||||
<label class="col-md-4" for="step">Step</label>
|
||||
<div class="col-md-8">
|
||||
<input type="number" id="step" name="step" placeholder="1"
|
||||
value="{{ old('step') ?? $addon->step }}" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{{--Transfer--}}
|
||||
<div class="form-group row">
|
||||
<label class="col-md-4" for="prefix">Prefix</label>
|
||||
<div class="col-md-8">
|
||||
<input type="text" id="prefix" name="prefix" placeholder="vCore"
|
||||
value="{{ old('prefix') ?? $addon->prefix }}" class="form-control">
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label for="price">Price / Step <span class="text-danger">*</span></label>
|
||||
<div class="input-group">
|
||||
<input type="number" name="price" id="price"
|
||||
value="{{ old('price', $addon->price) }}" class="form-control"
|
||||
placeholder="20000">
|
||||
<div class="input-group-append">
|
||||
<span class="input-group-text">VND</span>
|
||||
</div>
|
||||
</div>
|
||||
<small class="text-muted">Giá cho mỗi step (VD: 1 Core = 20,000đ)</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label for="input_type">Input Type</label>
|
||||
<select name="input_type" id="input_type" class="form-control select2">
|
||||
@foreach (AddonInputType::getOptions() as $value => $label)
|
||||
<option value="{{ $value }}"
|
||||
{{ $addon->input_type == $value ? 'selected' : '' }}>
|
||||
{{ $label }}
|
||||
</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<x-fixed-action-bar>
|
||||
<x-button-crm type="button" variant="secondary" size="sm" icon="arrow-left"
|
||||
route="addon.index">Cancel</x-button-crm>
|
||||
<x-button-crm type="submit" variant="primary" size="sm" icon="pencil">Edit
|
||||
Addon</x-button-crm>
|
||||
</x-fixed-action-bar>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<div class="card card-primary card-outline">
|
||||
<div class="card-header">
|
||||
<h5 class="card-title m-0">Publish</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="form-group mb-3">
|
||||
<label for="status">Status</label>
|
||||
<select name="status" id="status" class="form-control select2">
|
||||
@foreach (Status::getOptions() as $value => $label)
|
||||
<option value="{{ $value }}" {{ $addon->status == $value ? 'selected' : '' }}>
|
||||
{{ $label }}
|
||||
</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<x-fixed-action-bar>
|
||||
<x-button-crm type="button" variant="secondary" size="sm" icon="arrow-left"
|
||||
route="addon.index">Cancel</x-button-crm>
|
||||
<x-button-crm type="submit" variant="primary" size="sm" icon="pencil" class="float-right">
|
||||
Update Addon</x-button-crm>
|
||||
</x-fixed-action-bar>
|
||||
</form>
|
||||
@endsection
|
||||
|
||||
@push('plugin-scripts')
|
||||
@foreach (config('assets.datatable.js') as $datatable)
|
||||
<script src="{{ asset($datatable) }}"></script>
|
||||
@endforeach
|
||||
<script>
|
||||
$(document).ready(function () {
|
||||
$(document).ready(function() {
|
||||
$('.select2').select2();
|
||||
});
|
||||
</script>
|
||||
@endpush
|
||||
@endpush
|
||||
|
||||
@@ -15,35 +15,95 @@
|
||||
@endphp
|
||||
<x-admin-breadcrumb :items="$breadcrumbItems" />
|
||||
@endsection
|
||||
|
||||
@php
|
||||
use App\Enums\AddonType;
|
||||
@endphp
|
||||
|
||||
@section("content")
|
||||
@if (auth()->guard('admins')->user()->can('manager product'))
|
||||
<div class="card card-primary card-outline">
|
||||
<div class="card-header d-flex justify-content-end gap-2">
|
||||
@include('administrator.pages.block.addon.btn')
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="card-body p-0">
|
||||
<x-datatable id="addonTable" ajax="{{ route('addon.datatable') }}" :columns="[
|
||||
['key' => 'name', 'label' => 'Addon Name'],
|
||||
['key' => 'prefix', 'label' => 'Prefix'],
|
||||
['key' => 'min', 'label' => 'Min'],
|
||||
['key' => 'max', 'label' => 'Max'],
|
||||
['key' => 'step', 'label' => 'Step'],
|
||||
['key' => 'price', 'label' => 'Price'],
|
||||
['key' => 'status', 'label' => 'Status'],
|
||||
['key' => 'action', 'label' => 'Action'],
|
||||
['key' => 'details_control', 'label' => '', 'orderable' => false, 'searchable' => false, 'className' => 'details-control text-center cursor-pointer'],
|
||||
['key' => 'name', 'label' => 'Group'],
|
||||
['key' => 'slug', 'label' => 'Slug'],
|
||||
['key' => 'is_active', 'label' => 'Status'],
|
||||
['key' => 'action', 'label' => 'Action', 'searchable' => false],
|
||||
]" />
|
||||
</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 Product
|
||||
management department</h5>
|
||||
<h5 class="mb-0"><i class="icon fas fa-ban"></i> Access Denied - You are not assigned to any Product management
|
||||
department</h5>
|
||||
</div>
|
||||
@endif
|
||||
@endsection
|
||||
|
||||
@push('plugin-scripts')
|
||||
@foreach (config('assets.datatable.js') as $datatable)
|
||||
<script src="{{ asset($datatable) }}"></script>
|
||||
@endforeach
|
||||
@endpush
|
||||
@endpush
|
||||
|
||||
@push('custom-styles')
|
||||
<style>
|
||||
td.details-control {
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
@endpush
|
||||
|
||||
@push('custom-scripts')
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
var tableId = '#addonTable';
|
||||
|
||||
$('#addonTable').on('draw.dt', function () {
|
||||
setTimeout(function () {
|
||||
if (typeof lucide !== 'undefined') {
|
||||
lucide.createIcons();
|
||||
}
|
||||
}, 100);
|
||||
});
|
||||
|
||||
$(tableId + ' tbody').on('click', 'td.details-control', function () {
|
||||
var tr = $(this).closest('tr');
|
||||
var table = $(tableId).DataTable();
|
||||
var row = table.row(tr);
|
||||
var cell = $(this);
|
||||
|
||||
if (row.child.isShown()) {
|
||||
row.child.hide();
|
||||
tr.removeClass('shown');
|
||||
cell.html('<i data-lucide="plus-circle" class="cursor-pointer text-success mx-auto" style="width:15px; height:15px"></i>');
|
||||
} else {
|
||||
if (row.data().children && row.data().children.length > 0) {
|
||||
row.child(format(row.data())).show();
|
||||
tr.addClass('shown');
|
||||
cell.html('<i data-lucide="minus-circle" class="cursor-pointer text-danger mx-auto" style="width:15px; height:15px"></i>');
|
||||
|
||||
if (typeof lucide !== 'undefined') {
|
||||
lucide.createIcons();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (typeof lucide !== 'undefined') {
|
||||
lucide.createIcons();
|
||||
}
|
||||
});
|
||||
|
||||
function format(d) {
|
||||
return d.children_html;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
@endpush
|
||||
|
||||
|
||||
Reference in New Issue
Block a user