diff --git a/resources/views/blade/box/container.blade.php b/resources/views/blade/box/container.blade.php
index 9e37d922d80b..81527e6c2a69 100644
--- a/resources/views/blade/box/container.blade.php
+++ b/resources/views/blade/box/container.blade.php
@@ -2,7 +2,6 @@
     'box_style' => 'default',
     'header' => false,
     'footer' => false,
-
 ])
 
 <!-- Start box component -->
diff --git a/resources/views/blade/bulk-menus/assets.blade.php b/resources/views/blade/bulk-menus/assets.blade.php
new file mode 100644
index 000000000000..b89ec4ad04c7
--- /dev/null
+++ b/resources/views/blade/bulk-menus/assets.blade.php
@@ -0,0 +1,49 @@
+@aware(['name'])
+
+    <form
+            method="POST"
+            action="{{ route('hardware.bulkedit.show') }}"
+            accept-charset="UTF-8"
+            class="form-inline"
+            id="{{ Illuminate\Support\Str::camel($name) }}Form"
+    >
+        @csrf
+
+        <div style="width:100% !important;">
+            {{-- The sort and order will only be used if the cookie is actually empty (like on first-use) --}}
+            <input name="sort" type="hidden" value="assets.id">
+            <input name="order" type="hidden" value="asc">
+            <label for="bulk_actions">
+            <span class="sr-only">
+                {{ trans('button.bulk_actions') }}
+            </span>
+            </label>
+            <select name="bulk_actions" class="form-control select2" aria-label="bulk_actions" style="width: 350px !important;">
+                @if ((isset($status)) && ($status == 'Deleted'))
+                    @can('delete', \App\Models\Asset::class)
+                        <option value="restore">{{trans('button.restore')}}</option>
+                    @endcan
+                @else
+
+                    @can('update', \App\Models\Asset::class)
+                        <option value="edit">{{ trans('general.bulk_edit') }}</option>
+                        <option value="maintenance">{{ trans('button.add_maintenance') }}</option>
+                    @endcan
+
+                    @if((!isset($status)) || (($status != 'Deployed') && ($status != 'Archived')))
+                        @can('checkout', \App\Models\Asset::class)
+                            <option value="checkout">{{ trans('general.bulk_checkout') }}</option>
+                        @endcan
+                    @endif
+
+                    @can('delete', \App\Models\Asset::class)
+                        <option value="delete">{{ trans('general.bulk_delete') }}</option>
+                    @endcan
+
+                    <option value="labels">{{ trans_choice('button.generate_labels', 2) }}</option>
+                @endif
+            </select>
+
+            <button class="btn btn-theme" id="{{ Illuminate\Support\Str::camel($name) }}Button" disabled>{{ trans('button.go') }}</button>
+            </div>
+    </form>
diff --git a/resources/views/blade/table.blade.php b/resources/views/blade/table.blade.php
new file mode 100644
index 000000000000..c6ecea6496f9
--- /dev/null
+++ b/resources/views/blade/table.blade.php
@@ -0,0 +1,38 @@
+@props([
+    'presenter' => null,
+    'buttons' => null,
+    'export_filename' => 'export-'.date('Y-m-d'),
+    'api_url' => null,
+    'show_column_search' => false,
+    'show_advanced_search' => false,
+])
+
+@aware(['name'])
+
+<table
+    role="table"
+    class="table table-striped snipe-table"
+    data-cookie-id-table="{{ $name }}ListingTable"
+    data-id-table="{{ $name }}ListingTable"
+    data-sort-order="asc"
+    data-toolbar="#{{ Illuminate\Support\Str::camel($name) }}Toolbar"
+    data-bulk-button-id="#{{ Illuminate\Support\Str::camel($name) }}Button"
+    data-bulk-form-id="#{{ Illuminate\Support\Str::camel($name) }}Form"
+    id="{{ $name }}ListingTable"
+    data-show-columns-search="{{ $show_column_search }}"
+    data-show-advanced-search="{{ $show_advanced_search }}"
+    @if ($presenter)
+        data-columns="{{ $presenter }}"
+    @endif
+    @if ($buttons)
+        data-buttons="{{ $buttons }}"
+    @endif
+    @if ($api_url)
+        data-side-pagination="server"
+        data-url="{{ $api_url }}"
+    @endif
+    data-export-options='{
+      "fileName": "{{ $export_filename }}",
+      "ignoreColumn": ["actions","image","change","checkbox","checkincheckout","icon"]
+}'>
+</table>
\ No newline at end of file
diff --git a/resources/views/blade/tabs/index.blade.php b/resources/views/blade/tabs/index.blade.php
new file mode 100644
index 000000000000..d4e5437ab9e0
--- /dev/null
+++ b/resources/views/blade/tabs/index.blade.php
@@ -0,0 +1,14 @@
+<!-- start tab container -->
+<div class="nav-tabs-custom">
+
+    <ul class="nav nav-tabs hidden-print">
+            {{ $tabnav }}
+    </ul>
+
+    <div class="tab-content">
+         {{ $tabpanes }}
+    </div>
+
+
+</div>
+<!-- end tab container -->
\ No newline at end of file
diff --git a/resources/views/blade/tabs/nav-item-upload.blade.php b/resources/views/blade/tabs/nav-item-upload.blade.php
new file mode 100644
index 000000000000..096b2ecca2f9
--- /dev/null
+++ b/resources/views/blade/tabs/nav-item-upload.blade.php
@@ -0,0 +1,6 @@
+<li class="pull-right">
+    <a href="#" data-toggle="modal" data-target="#uploadFileModal">
+        <x-icon type="paperclip" />
+        {{ trans('button.upload') }}
+    </a>
+</li>
\ No newline at end of file
diff --git a/resources/views/blade/tabs/nav-item.blade.php b/resources/views/blade/tabs/nav-item.blade.php
new file mode 100644
index 000000000000..66df072c6559
--- /dev/null
+++ b/resources/views/blade/tabs/nav-item.blade.php
@@ -0,0 +1,27 @@
+@props([
+    'name' => false,
+    'label' => false,
+    'count' => 0,
+    'icon' => false,
+    'icon_style' => false,
+    'tooltip' => false,
+])
+<!-- start tab nav item -->
+<li {{ $attributes->merge(['class' => '']) }}>
+    <a href="#{{ $name ?? 'info' }}" data-toggle="tab"{!! ($tooltip) ? ' data-tooltip="true" title="'.$tooltip.'"' : '' !!}>
+
+        @if ($icon)
+            <i class="{{ $icon }}" style="font-size: 17px" aria-hidden="true"></i>
+        @endif
+
+        <span class="sr-only">
+            {{ $label }}
+        </span>
+
+        @if ($count > 0)
+            <span class="badge">{{ number_format($count) }} </span>
+        @endif
+
+    </a>
+</li>
+<!-- end tab nav item -->
\ No newline at end of file
diff --git a/resources/views/blade/tabs/pane.blade.php b/resources/views/blade/tabs/pane.blade.php
new file mode 100644
index 000000000000..9a9542a36055
--- /dev/null
+++ b/resources/views/blade/tabs/pane.blade.php
@@ -0,0 +1,23 @@
+@props([
+    'name' => 'default',
+])
+
+<!-- tab-pane -->
+<div id="{{ $name }}" {{ $attributes->merge(['class' => 'tab-pane']) }}>
+
+    @if (isset($header))
+        <h2 class="box-title{{ (!isset($bulkactions)) ? 'pull-left' : '' }}">
+            {{ $header }}
+        </h2>
+
+    @endif
+
+    @if (isset($bulkactions))
+        <div id="{{ Illuminate\Support\Str::camel($name) }}ToolBar" class="pull-left" style="min-width:500px !important; padding-top: 10px;">
+            {{ $bulkactions }}
+        </div>
+    @endif
+
+    {{ $content }}
+</div>
+<!-- /.tab-pane -->
\ No newline at end of file
diff --git a/resources/views/locations/view.blade.php b/resources/views/locations/view.blade.php
index c4511adfeecf..5e9db988e555 100644
--- a/resources/views/locations/view.blade.php
+++ b/resources/views/locations/view.blade.php
@@ -9,455 +9,376 @@
 @parent
 @stop
 
-@section('header_right')
-<a href="{{ route('locations.index') }}" class="btn btn-primary" style="margin-right: 10px;">
-    {{ trans('general.back') }}</a>
-@endsection
 {{-- Page content --}}
 @section('content')
+    <x-container columns="2">
+        <x-page-column class="col-md-9">
+          <x-tabs>
+
+              <x-slot:tabnav>
+                  @can('view', \App\Models\User::class)
+                      <x-tabs.nav-item
+                              class="active"
+                              name="users"
+                              icon="fa-solid fa-house-user fa-fw"
+                              icon_style="font-size: 17px"
+                              label="{{ trans('general.users') }}"
+                              count="{{ $location->users()->count() }}"
+                              tooltip="{{ trans('general.users') }}"
+                      />
+                  @endcan
 
-<div class="row">
+                  @can('view', \App\Models\Asset::class)
+
+                      <x-tabs.nav-item
+                              name="assets"
+                              icon="fa-solid fa-house-laptop fa-fw"
+                              icon_style="font-size: 17px"
+                              label="{{ trans('general.users') }}"
+                              count="{{ $location->assets()->AssetsForShow()->count() }}"
+                              tooltip="{{ trans('admin/locations/message.current_location') }}"
+                      />
+
+                      <x-tabs.nav-item
+                              name="rtd_assets"
+                              icon="fa-solid fa-house-flag fa-fw"
+                              icon_style="font-size: 17px"
+                              label="{{ trans('admin/hardware/form.default_location') }}"
+                              count="{{ $location->rtd_assets()->AssetsForShow()->count() }}"
+                              tooltip="{{ trans('admin/hardware/form.default_location') }}"
+                      />
+
+                      <x-tabs.nav-item
+                              name="assets_assigned"
+                              icon="fas fa-barcode fa-fw"
+                              icon_style="font-size: 17px"
+                              label="{{ trans('admin/locations/message.assigned_assets') }}"
+                              count="{{ $location->assignedAssets()->AssetsForShow()->count() }}"
+                              tooltip="{{ trans('admin/locations/message.assigned_assets') }}"
+                      />
 
-    @if ($location->deleted_at!='')
-        <div class="col-md-12">
-            <div class="callout callout-warning">
-                <x-icon type="warning" />
-                {{ trans('admin/locations/message.deleted_warning') }}
-            </div>
-        </div>
-    @endif
+                  @endcan
 
+                  @can('view', \App\Models\Accessory::class)
 
-  <div class="col-md-9">
+                      <x-tabs.nav-item
+                              name="accessories"
+                              icon="far fa-keyboard fa-fw"
+                              icon_style="font-size: 17px"
+                              label="{{ trans('general.accessories') }}"
+                              count="{{ $location->accessories()->count() }}"
+                              tooltip="{{ trans('general.accessories') }}"
+                      />
+
+                      <x-tabs.nav-item
+                              name="accessories_assigned"
+                              icon="fas fa-keyboard fa-fw"
+                              icon_style="font-size: 17px"
+                              label="{{ trans('general.accessories_assigned') }}"
+                              count="{{ $location->assignedAccessories()->count() }}"
+                              tooltip="{{ trans('general.accessories_assigned') }}"
+                      />
 
+                  @endcan
 
 
-      <div class="nav-tabs-custom">
-          <ul class="nav nav-tabs hidden-print">
+                  @can('view', \App\Models\Consumable::class)
 
-              @can('view', \App\Models\User::class)
-                      <li class="active">
-                          <a href="#users" data-toggle="tab">
-                              <i class="fa-solid fa-house-user fa-fw" style="font-size: 17px" aria-hidden="true"></i>
-                              <span class="sr-only">
-                            {{ trans('general.users') }}
-                              </span>
-                              {!! ($location->users()->count() > 0) ? '<span class="badge">'.number_format($location->users()->count()).'</span>' : '' !!}
-                          </a>
-                      </li>
-              @endcan
+                      <x-tabs.nav-item
+                              name="consumables"
+                              icon="fas fa-tint fa-fw"
+                              icon_style="font-size: 17px"
+                              label="{{ trans('general.consumables') }}"
+                              count="{{ $location->consumables()->count() }}"
+                              tooltip="{{ trans('general.consumables') }}"
+                      />
 
-              @can('view', \App\Models\Asset::class)
-                      <li>
-                          <a href="#assets" data-toggle="tab" data-tooltip="true" title="{{ trans('admin/locations/message.current_location') }}">
-                              <i class="fa-solid fa-house-laptop fa-fw" style="font-size: 17px" aria-hidden="true"></i>
-                              {!! ($location->assets()->AssetsForShow()->count() > 0) ? '<span class="badge">'.number_format($location->assets()->AssetsForShow()->count()).'</span>' : '' !!}
-                              <span class="sr-only">
-                          {{ trans('admin/locations/message.current_location') }}
-                      </span>
-                          </a>
-                      </li>
+                  @endcan
 
-                      <li>
-                          <a href="#rtd_assets" data-toggle="tab" data-tooltip="true" title="{{ trans('admin/hardware/form.default_location') }}">
-                              <i class="fa-solid fa-house-flag fa-fw" style="font-size: 17px" aria-hidden="true"></i>
-                              {!! ($location->rtd_assets()->AssetsForShow()->count() > 0) ? '<span class="badge">'.number_format($location->rtd_assets()->AssetsForShow()->count()).'</span>' : '' !!}
-                              <span class="sr-only">
-                          {{ trans('admin/hardware/form.default_location') }}
-                      </span>
-                          </a>
-                      </li>
+                  @can('view', \App\Models\Component::class)
 
-                      <li>
-                          <a href="#assets_assigned" data-toggle="tab" data-tooltip="true" title="{{ trans('admin/locations/message.assigned_assets') }}">
-                              <i class="fas fa-barcode fa-fw" style="font-size: 17px" aria-hidden="true"></i>
-                              {!! ($location->assignedAssets()->AssetsForShow()->count() > 0) ? '<span class="badge">'.number_format($location->assignedAssets()->AssetsForShow()->count()).'</span>' : '' !!}
-                              <span class="sr-only">
-                          {{ trans('admin/locations/message.assigned_assets') }}
-                      </span>
-                          </a>
-                      </li>
-              @endcan
+                      <x-tabs.nav-item
+                              name="components"
+                              icon="fas fa-hdd fa-fw"
+                              icon_style="font-size: 17px"
+                              label="{{ trans('general.components') }}"
+                              count="{{ $location->components->count() }}"
+                              tooltip="{{ trans('general.components') }}"
+                      />
 
-                  @can('view', \App\Models\Accessory::class)
-                          <li>
-                              <a href="#accessories" data-toggle="tab" data-tooltip="true" title="{{ trans('general.accessories') }}">
-                                  <i class="far fa-keyboard fa-fw" style="font-size: 17px" aria-hidden="true"></i>
-                                  {!! ($location->accessories()->count() > 0) ? '<span class="badge">'.number_format($location->accessories()->count()).'</span>' : '' !!}
-                                  <span class="sr-only">
-                                    {{ trans('general.accessories') }}
-                                  </span>
-                              </a>
-                          </li>
-
-                          <li>
-                              <a href="#accessories_assigned" data-toggle="tab" data-tooltip="true" title="{{ trans('general.accessories_assigned') }}">
-                                  <i class="fas fa-keyboard fa-fw" style="font-size: 17px" aria-hidden="true"></i>
-                                  {!! ($location->assignedAccessories()->count() > 0) ? '<span class="badge">'.number_format($location->assignedAccessories()->count()).'</span>' : '' !!}
-                                  <span class="sr-only">
-                                      {{ trans('general.accessories_assigned') }}
-                                  </span>
-                              </a>
-                          </li>
                   @endcan
 
 
-              @can('view', \App\Models\Consumable::class)
-                          <li>
-                              <a href="#consumables" data-toggle="tab" data-tooltip="true" title="{{ trans('general.consumables') }}">
-                                  <i class="fas fa-tint fa-fw" style="font-size: 17px" aria-hidden="true"></i>
-                                  {!! ($location->consumables()->count() > 0) ? '<span class="badge">'.number_format($location->consumables->count()).'</span>' : '' !!}
-                                  <span class="sr-only">
-                              {{ trans('general.consumables') }}
-                          </span>
-                              </a>
-                          </li>
+                  <x-tabs.nav-item
+                          name="child_locations"
+                          icon="fa-solid fa-city fa-fw"
+                          icon_style="font-size: 17px"
+                          label="{{ trans('general.child_locations') }}"
+                          count="{{ $location->children()->count() }}"
+                          tooltip="{{ trans('general.child_locations') }}"
+                  />
+
+                  <x-tabs.nav-item
+                          name="files"
+                          icon="fa-solid fa-file-contract fa-fw"
+                          icon_style="font-size: 17px"
+                          label="{{ trans('general.files') }}"
+                          count="{{ $location->uploads()->count() }}"
+                          tooltip="{{ trans('general.files') }}"
+                  />
+
+                  <x-tabs.nav-item
+                          name="history"
+                          icon="fa-solid fa-clock-rotate-left fa-fw"
+                          icon_style="font-size: 17px"
+                          label="{{ trans('general.history') }}"
+                          tooltip="{{ trans('general.history') }}"
+                  />
+
+                  @can('update', $location)
+                      <x-tabs.nav-item-upload />
                   @endcan
 
-                  @can('view', \App\Models\Component::class)
-                          <li>
-                              <a href="#components" data-toggle="tab" data-tooltip="true" title="{{ trans('general.components') }}">
-                                  <i class="fas fa-hdd fa-fw" style="font-size: 17px" aria-hidden="true"></i>
-                                  {!! ($location->components->count() > 0) ? '<span class="badge">'.number_format($location->components()->count()).'</span>' : '' !!}
-                                  <span class="sr-only">
-                                    {{ trans('general.components') }}
-                                  </span>
-                              </a>
-                          </li>
-                  @endcan
-
-                  <li>
-                      <a href="#child_locations" data-toggle="tab" data-tooltip="true" title="{{ trans('general.child_locations') }}">
-                          <span class="hidden-xs hidden-sm">
-                               <i class="fa-solid fa-city fa-fw" style="font-size: 17px" aria-hidden="true"></i>
-                          <span class="sr-only">
-                            {{ trans('general.child_locations') }}
-                          </span>
-                          {!! ($location->children()->count() > 0 ) ? '<span class="badge">'.number_format($location->children()->count()).'</span>' : '' !!}
-                      </span>
-                      </a>
-                  </li>
+              </x-slot:tabnav>
 
-              <li>
-                  <a href="#files" data-toggle="tab" data-tooltip="true" title="{{ trans('general.files') }}">
+              <x-slot:tabpanes>
 
-                    <span class="hidden-lg hidden-md">
-                      <i class="fas fa-barcode fa-2x"></i>
-                    </span>
-                      <span class="hidden-xs hidden-sm">
-                          <i class="fa-solid fa-file-contract fa-fw" style="font-size: 17px" aria-hidden="true"></i>
-                          <span class="sr-only">
-                            {{ trans('general.files') }}
-                          </span>
-                          {!! ($location->uploads()->count() > 0 ) ? '<span class="badge">'.number_format($location->uploads()->count()).'</span>' : '' !!}
-                      </span>
-                  </a>
-              </li>
+                  <!-- start users tab pane -->
+                  @can('view', \App\Models\User::class)
+                  <x-tabs.pane name="users" class="active">
+                      <x-slot:header>
+                          {{ trans('general.users') }}
+                      </x-slot:header>
 
+                      <x-slot:bulkactions>
+                      @include('partials.users-bulk-actions')
+                      </x-slot:bulkactions>
+
+                      <x-slot:content>
+                          <x-table
+                            show_column_search="true"
+                            show_advanced_search="true"
+                            name="users"
+                            buttons="userButtons"
+                            toolbar_id="userBulkEditToolbar"
+                            api_url="{{ route('api.users.index', ['location_id' => $location->id])}}"
+                            :presenter="\App\Presenters\UserPresenter::dataTableLayout()"
+                            export_filename="export-locations-{{ str_slug($location->name) }}-users-{{ date('Y-m-d') }}"
+                          />
+                      </x-slot:content>
+
+                  </x-tabs.pane>
+                  @endcan
+                  <!-- end users tab pane -->
 
+                  <!-- start assets tab pane -->
+                  @can('view', \App\Models\Asset::class)
+                  <x-tabs.pane name="assets">
+                      <x-slot:header>
+                          {{ trans('admin/locations/message.current_location') }}
+                      </x-slot:header>
 
+                      <x-slot:bulkactions>
+                         <x-bulk-menus.assets />
+                      </x-slot:bulkactions>
 
+                      <x-slot:content>
+                          <x-table
+                              show_column_search="true"
+                              show_advanced_search="true"
+                              buttons="assetButtons"
+                              api_url="{{ route('api.assets.index', ['location_id' => $location->id]) }}"
+                              :presenter="\App\Presenters\AssetPresenter::dataTableLayout()"
+                              export_filename="export-locations-{{ str_slug($location->name) }}-assets-{{ date('Y-m-d') }}"
+                          />
+                      </x-slot:content>
 
-              <li>
-                  <a href="#history" data-toggle="tab" data-tooltip="true" title="{{ trans('general.history') }}">
-                      <i class="fa-solid fa-clock-rotate-left fa-fw" style="font-size: 17px" aria-hidden="true"></i>
-                      <span class="sr-only">
-                          {{ trans('general.history') }}
-                    </span>
-                  </a>
-              </li>
+                  </x-tabs.pane>
+                  <!-- end assets tab pane -->
 
-              @can('update', $location)
-              <li class="pull-right">
-                  <a href="#" data-toggle="modal" data-target="#uploadFileModal">
-                      <x-icon type="paperclip" />
-                      {{ trans('button.upload') }}
-                  </a>
-              </li>
-              @endcan
-          </ul>
 
+                  <!-- start assigned assets tab pane -->
 
-          <div class="tab-content">
-              @can('view', \App\Models\User::class)
-                    <div id="users" @class(['tab-pane','active']) >
-              @endcan
-                  <h2 class="box-title">{{ trans('general.users') }}</h2>
-                      @include('partials.users-bulk-actions')
-                      <table
-                              data-columns="{{ \App\Presenters\UserPresenter::dataTableLayout() }}"
-                              data-cookie-id-table="usersTable"
-                              data-id-table="usersTable"
-                              data-side-pagination="server"
-                              data-sort-order="asc"
-                              data-toolbar="#userBulkEditToolbar"
-                              data-bulk-button-id="#bulkUserEditButton"
-                              data-bulk-form-id="#usersBulkForm"
-                              id="usersTable"
-                              data-buttons="userButtons"
-                              class="table table-striped snipe-table"
-                              data-url="{{route('api.users.index', ['location_id' => $location->id])}}"
-                              data-export-options='{
-                              "fileName": "export-locations-{{ str_slug($location->name) }}-users-{{ date('Y-m-d') }}",
-                              "ignoreColumn": ["actions","image","change","checkbox","checkincheckout","icon"]
-                              }'>
-                      </table>
-                    </div><!-- /.tab-pane -->
-                <div id="assets" @class(['tab-pane']) >
-
-                  <h2 class="box-title">{{ trans('admin/locations/message.current_location') }}</h2>
-
-                      @include('partials.asset-bulk-actions')
-                      <table
-                              data-columns="{{ \App\Presenters\AssetPresenter::dataTableLayout() }}"
-                              data-show-columns-search="true"
-                              data-cookie-id-table="assetsListingTable"
-                              data-id-table="assetsListingTable"
-                              data-side-pagination="server"
-                              data-sort-order="asc"
-                              data-toolbar="#assetsBulkEditToolbar"
-                              data-bulk-button-id="#bulkAssetEditButton"
-                              data-bulk-form-id="#assetsBulkForm"
-                              id="assetsListingTable"
-                              data-buttons="assetButtons"
-                              class="table table-striped snipe-table"
-                              data-url="{{route('api.assets.index', ['location_id' => $location->id]) }}"
-                              data-export-options='{
-                              "fileName": "export-locations-{{ str_slug($location->name) }}-assets-{{ date('Y-m-d') }}",
-                              "ignoreColumn": ["actions","image","change","checkbox","checkincheckout","icon"]
-                              }'>
-                      </table>
-              </div><!-- /.tab-pane -->
-
-              <div class="tab-pane" id="assets_assigned">
-                  <h2 class="box-title">
-                      {{ trans('admin/locations/message.assigned_assets') }}
-                  </h2>
-
-                      @include('partials.asset-bulk-actions', ['id_divname' => 'AssignedAssetsBulkEditToolbar', 'id_formname' => 'assignedAssetsBulkForm', 'id_button' => 'AssignedbulkAssetEditButton'])
-                      <table
-                              role="table"
-                              data-columns="{{ \App\Presenters\AssetPresenter::dataTableLayout() }}"
-                              data-show-columns-search="true"
-                              data-cookie-id-table="assetsAssignedListingTable"
-                              data-id-table="assetsAssignedListingTable"
-                              data-side-pagination="server"
-                              data-sort-order="asc"
-                              data-toolbar="#AssignedAssetsBulkEditToolbar"
-                              data-bulk-button-id="#AssignedbulkAssetEditButton"
-                              data-bulk-form-id="#assignedAssetsBulkForm"
-                              id="assetsAssignedListingTable"
-                              data-buttons="assetButtons"
-                              class="table table-striped snipe-table"
-                              data-url="{{route('api.assets.index', ['assigned_to' => $location->id, 'assigned_type' => 'App\Models\Location']) }}"
-                              data-export-options='{
-                              "fileName": "export-locations-{{ str_slug($location->name) }}-assets-{{ date('Y-m-d') }}",
-                              "ignoreColumn": ["actions","image","change","checkbox","checkincheckout","icon"]
-                              }'>
-                      </table>
-              </div><!-- /.tab-pane -->
-
-              <div class="tab-pane" id="rtd_assets">
-                  <h2 class="box-title">{{ trans('admin/hardware/form.default_location') }}</h2>
-
-                      @include('partials.asset-bulk-actions', ['id_divname' => 'RTDassetsBulkEditToolbar', 'id_formname' => 'RTDassets', 'id_button' => 'RTDbulkAssetEditButton'])
-                      <table
-                              role="table"
-                              data-columns="{{ \App\Presenters\AssetPresenter::dataTableLayout() }}"
-                              data-show-columns-search="true"
-                              data-cookie-id-table="RTDassetsListingTable"
-                              data-id-table="RTDassetsListingTable"
-                              data-side-pagination="server"
-                              data-sort-order="asc"
-                              data-toolbar="#RTDassetsBulkEditToolbar"
-                              data-bulk-button-id="#RTDbulkAssetEditButton"
-                              data-bulk-form-id="#RTDassetsBulkEditToolbar"
-                              id="RTDassetsListingTable"
-                              data-buttons="assetButtons"
-                              class="table table-striped snipe-table"
-                              data-url="{{route('api.assets.index', ['rtd_location_id' => $location->id]) }}"
-                              data-export-options='{
-                              "fileName": "export-rtd-locations-{{ str_slug($location->name) }}-assets-{{ date('Y-m-d') }}",
-                              "ignoreColumn": ["actions","image","change","checkbox","checkincheckout","icon"]
-                              }'>
-                      </table>
-              </div><!-- /.tab-pane -->
-              
-
-
-              <div class="tab-pane" id="accessories">
-                  <h2 class="box-title">{{ trans('general.accessories') }}</h2>
-                      <table
-                              role="table"
-                              data-columns="{{ \App\Presenters\AccessoryPresenter::dataTableLayout() }}"
-                              data-cookie-id-table="accessoriesListingTable"
-                              data-id-table="accessoriesListingTable"
-                              data-side-pagination="server"
-                              data-sort-order="asc"
-                              id="accessoriesListingTable"
-                              data-buttons="accessoryButtons"
-                              class="table table-striped snipe-table"
-                              data-url="{{route('api.accessories.index', ['location_id' => $location->id]) }}"
-                              data-export-options='{
-                              "fileName": "export-locations-{{ str_slug($location->name) }}-accessories-{{ date('Y-m-d') }}",
-                              "ignoreColumn": ["actions","image","change","checkbox","checkincheckout","icon"]
-                              }'>
-                      </table>
-              </div><!-- /.tab-pane -->
-
-              <div class="tab-pane" id="accessories_assigned">
-                      <h2 class="box-title" style="float:left">
-                          {{ trans('general.accessories_assigned') }}
-                      </h2>
-
-                      <table
-                              role="table"
-                              data-columns="{{ \App\Presenters\LocationPresenter::assignedAccessoriesDataTableLayout() }}"
-                              data-cookie-id-table="accessoriesAssignedListingTable"
-                              data-id-table="accessoriesAssignedListingTable"
-                              data-side-pagination="server"
-                              data-sort-order="asc"
-                              id="accessoriesAssignedListingTable"
-                              data-buttons="accessoryButtons"
-                              class="table table-striped snipe-table"
-                              data-url="{{ route('api.locations.assigned_accessories', ['location' => $location]) }}"
-                              data-export-options='{
-                              "fileName": "export-locations-{{ str_slug($location->name) }}-accessories-{{ date('Y-m-d') }}",
-                              "ignoreColumn": ["actions","image","change","checkbox","checkincheckout","icon"]
-                              }'>
-                      </table>
-              </div><!-- /.tab-pane -->
-
-
-              <div class="tab-pane" id="consumables">
-                  <h2 class="box-title">{{ trans('general.consumables') }}</h2>
-                          <table
-                                  role="table"
-                                  data-columns="{{ \App\Presenters\ConsumablePresenter::dataTableLayout() }}"
-                                  data-cookie-id-table="consumablesListingTable"
-                                  data-id-table="consumablesListingTable"
-                                  data-side-pagination="server"
-                                  data-sort-order="asc"
-                                  id="consumablesListingTable"
-                                  data-buttons="consumableButtons"
-                                  class="table table-striped snipe-table"
-                                  data-url="{{route('api.consumables.index', ['location_id' => $location->id]) }}"
-                                  data-export-options='{
-                              "fileName": "export-locations-{{ str_slug($location->name) }}-consumables-{{ date('Y-m-d') }}",
-                              "ignoreColumn": ["actions","image","change","checkbox","checkincheckout","icon"]
-                              }'>
-                          </table>
-              </div><!-- /.tab-pane -->
-
-              <div class="tab-pane" id="components">
-                  <h2 class="box-title">{{ trans('general.components') }}</h2>
-                          <table
-                                  role="table"
-                                  data-columns="{{ \App\Presenters\ComponentPresenter::dataTableLayout() }}"
-                                  data-cookie-id-table="componentsTable"
-                                  data-id-table="componentsTable"
-                                  data-side-pagination="server"
-                                  data-sort-order="asc"
-                                  id="componentsTable"
-                                  data-buttons="componentButtons"
-                                  class="table table-striped snipe-table"
-                                  data-url="{{route('api.components.index', ['location_id' => $location->id])}}"
-                                  data-export-options='{
-                              "fileName": "export-locations-{{ str_slug($location->name) }}-components-{{ date('Y-m-d') }}",
-                              "ignoreColumn": ["actions","image","change","checkbox","checkincheckout","icon"]
-                              }'>
-                          </table>
-              </div><!-- /.tab-pane -->
-
-
-                      <div class="tab-pane" id="child_locations">
-                          <h2 class="box-title">
-                              {{ trans('general.child_locations') }}
-                          </h2>
-                          <table
-                                  role="table"
-                                  data-columns="{{ \App\Presenters\LocationPresenter::dataTableLayout() }}"
-                                  data-cookie-id-table="childrenListingTable"
-                                  data-id-table="childrenListingTable"
-                                  data-side-pagination="server"
-                                  data-sort-order="asc"
-                                  id="childrenListingTable"
-                                  data-buttons="childrenListingTable"
-                                  class="table table-striped snipe-table"
-                                  data-url="{{route('api.locations.index', ['parent_id' => $location->id]) }}"
-                                  data-export-options='{
-                              "fileName": "export-children-locations-{{ str_slug($location->name) }}-{{ date('Y-m-d') }}",
-                              "ignoreColumn": ["actions","image","change","checkbox","checkincheckout","icon"]
-                              }'>
-                          </table>
-                      </div><!-- /.tab-pane -->
-
-                  <div class="tab-pane fade" id="files">
-                      <h2 class="box-title">
-                          {{ trans('general.child_locations') }}
-                      </h2>
 
-                      <div class="row">
-                          <div class="col-md-12">
-                              <x-filestable object_type="locations" :object="$location" />
-                          </div> <!-- /.col-md-12 -->
-                      </div> <!-- /.row -->
-                  </div>
+                  <x-tabs.pane name="assets_assigned">
+                      <x-slot:header>
+                          {{ trans('admin/locations/message.assigned_assets') }}
+                      </x-slot:header>
+
+                      <x-slot:bulkactions>
+                          <x-bulk-menus.assets />
+                      </x-slot:bulkactions>
+
+                      <x-slot:content>
+                          <x-table
+                                  show_column_search="true"
+                                  show_advanced_search="true"
+                                  buttons="assetButtons"
+                                  :api_url="route('api.assets.index', ['assigned_to' => $location->id, 'assigned_type' => 'App\Models\Location'])"
+                                  :presenter="\App\Presenters\AssetPresenter::dataTableLayout()"
+                                  export_filename="export-locations-{{ str_slug($location->name) }}-assets-{{ date('Y-m-d') }}"
+                          />
+                      </x-slot:content>
+                  </x-tabs.pane>
+                 <!-- end assigned assets tab pane -->
+
+
+
+                  <!-- start rtd assets tab pane -->
+                  <x-tabs.pane name="rtd_assets">
+                      <x-slot:header>
+                          {{ trans('admin/hardware/form.default_location') }}
+                      </x-slot:header>
+
+                      <x-slot:bulkactions>
+                          <x-bulk-menus.assets />
+                      </x-slot:bulkactions>
+
+                      <x-slot:content>
+                          <x-table
+                            buttons="assetButtons"
+                            api_url="{{ route('api.assets.index', ['rtd_location_id' => $location->id]) }}"
+                            :presenter="\App\Presenters\AssetPresenter::dataTableLayout()"
+                            export_filename="export-rtd-locations-{{ str_slug($location->name) }}-assets-{{ date('Y-m-d') }}"
+                          />
+                      </x-slot:content>
+
+                  </x-tabs.pane>
+                  @endcan
+                  <!-- end rtd assets tab pane -->
 
 
-                  <div class="tab-pane" id="accessories_assigned">
-                      <h2 class="box-title" style="float:left">
+                  <!-- start accessories tab pane -->
+                  @can('view', \App\Models\Accessory::class)
+                  <x-tabs.pane name="accessories">
+                      <x-slot:header>
+                          {{ trans('general.accessories') }}
+                      </x-slot:header>
+
+                      <x-slot:content>
+                          <x-table
+                            name="accessories"
+                            buttons="accessoryButtons"
+                            api_url="{{ route('api.accessories.index', ['location_id' => $location->id]) }}"
+                            :presenter="\App\Presenters\AccessoryPresenter::dataTableLayout()"
+                            export_filename="export-locations-{{ str_slug($location->name) }}-accessories-{{ date('Y-m-d') }}"
+                          />
+                      </x-slot:content>
+
+                  </x-tabs.pane>
+                  <!-- end accessories tab pane -->
+
+                  <!-- start assigned accessories tab pane -->
+                  <x-tabs.pane name="accessories_assigned">
+                      <x-slot:header>
                           {{ trans('general.accessories_assigned') }}
-                      </h2>
-
-                      <table
-                              role="table"
-                              data-columns="{{ \App\Presenters\LocationPresenter::assignedAccessoriesDataTableLayout() }}"
-                              data-cookie-id-table="accessoriesAssignedListingTable"
-                              data-id-table="accessoriesAssignedListingTable"
-                              data-side-pagination="server"
-                              data-sort-order="asc"
-                              id="accessoriesAssignedListingTable"
-                              data-buttons="accessoryButtons"
-                              class="table table-striped snipe-table"
-                              data-url="{{ route('api.locations.assigned_accessories', ['location' => $location]) }}"
-                              data-export-options='{
-                              "fileName": "export-locations-{{ str_slug($location->name) }}-accessories-{{ date('Y-m-d') }}",
-                              "ignoreColumn": ["actions","image","change","checkbox","checkincheckout","icon"]
-                              }'>
-                      </table>
-                  </div><!-- /.tab-pane -->
-
-                <div class="tab-pane" id="history">
-                    <h2 class="box-title">{{ trans('general.history') }}</h2>
-                    <!-- checked out assets table -->
-                    <div class="row">
-                        <div class="col-md-12">
-                            <table
-                                    data-columns="{{ \App\Presenters\HistoryPresenter::dataTableLayout() }}"
-                                    class="table table-striped snipe-table"
-                                    id="locationHistory"
-                                    data-id-table="locationHistory"
-                                    data-side-pagination="server"
-                                    data-sort-order="desc"
-                                    data-sort-name="created_at"
-                                    data-export-options='{
-                                        "fileName": "export-location-asset-{{  $location->id }}-history",
-                                        "ignoreColumn": ["actions","image","change","checkbox","checkincheckout","icon"]
-                                    }'
-                                    data-url="{{ route('api.activity.index', ['target_id' => $location->id, 'target_type' => 'location']) }}"
-                                    data-cookie-id-table="locationHistory"
-                                    data-cookie="true">
-                            </table>
-                        </div>
-                    </div> <!-- /.row -->
-                </div> <!-- /.tab-pane history -->
-
-          </div><!--/.col-md-9-->
-      </div><!--/.col-md-9-->
-  </div><!--/.col-md-9-->
-
-  <div class="col-md-3">
+                      </x-slot:header>
+
+                      <x-slot:content>
+                          <x-table
+                                  name="accessoriesAssigned"
+                                  buttons="accessoryButtons"
+                                  api_url="{{ route('api.locations.assigned_accessories', ['location' => $location]) }}"
+                                  :presenter="\App\Presenters\AccessoryPresenter::dataTableLayout()"
+                                  export_filename="export-locations-{{ str_slug($location->name) }}-accessories-{{ date('Y-m-d') }}"
+                          />
+                      </x-slot:content>
+
+                  </x-tabs.pane>
+                  @endcan
+                  <!-- end assigned accessories tab pane -->
+
+
+                  <!-- start consumables tab pane -->
+                  @can('view', \App\Models\Consumable::class)
+                  <x-tabs.pane name="consumables">
+                      <x-slot:header>
+                          {{ trans('general.consumables') }}
+                      </x-slot:header>
+
+                      <x-slot:content>
+                          <x-table
+                                  name="consumables"
+                                  buttons="consumableButtons"
+                                  api_url="{{ route('api.consumables.index', ['location_id' => $location->id]) }}"
+                                  :presenter="\App\Presenters\ConsumablePresenter::dataTableLayout()"
+                                  export_filename="export-locations-{{ str_slug($location->name) }}-consumables-{{ date('Y-m-d') }}"
+                          />
+                      </x-slot:content>
+
+                  </x-tabs.pane>
+                  @endcan
+                  <!-- end consumables tab pane -->
+
+                  <!-- start components tab pane -->
+                  @can('view', \App\Models\Component::class)
+                  <x-tabs.pane name="components">
+                      <x-slot:header>
+                          {{ trans('general.components') }}
+                      </x-slot:header>
+                      <x-slot:content>
+                          <x-table
+                                  name="components"
+                                  buttons="componentButtons"
+                                  api_url="{{ route('api.components.index', ['location_id' => $location->id]) }}"
+                                  :presenter="\App\Presenters\ComponentPresenter::dataTableLayout()"
+                                  export_filename="export-locations-{{ str_slug($location->name) }}-consumables-{{ date('Y-m-d') }}"
+                          />
+                      </x-slot:content>
+                  </x-tabs.pane>
+                  @endcan
+                  <!-- end components tab pane -->
+
+                  <!-- start child locations tab pane -->
+                  <x-tabs.pane name="child_locations">
+                      <x-slot:header>
+                          {{ trans('general.child_locations') }}
+                      </x-slot:header>
+                      <x-slot:content>
+                          <x-table
+                                  name="childrenListingTable"
+                                  buttons="locationButtons"
+                                  api_url="{{ route('api.locations.index', ['parent_id' => $location->id]) }}"
+                                  :presenter="\App\Presenters\LocationPresenter::dataTableLayout()"
+                                  export_filename="export-children-locations-{{ str_slug($location->name) }}-{{ date('Y-m-d') }}"
+                          />
+                      </x-slot:content>
+                  </x-tabs.pane>
+                  <!-- end components tab pane -->
+
+
+                  <!-- start files tab pane -->
+                  <x-tabs.pane name="files">
+                      <x-slot:header>
+                          {{ trans('general.files') }}
+                      </x-slot:header>
+                      <x-slot:content>
+                          <x-filestable object_type="locations" :object="$location" />
+                      </x-slot:content>
+                  </x-tabs.pane>
+                  <!-- end files tab pane -->
+
+                  <!-- start history tab pane -->
+                  <x-tabs.pane name="history">
+                      <x-slot:header>
+                          {{ trans('general.history') }}
+                      </x-slot:header>
+                      <x-slot:content>
+                          <x-table
+                                  name="locationHistory"
+                                  api_url="{{ route('api.activity.index', ['target_id' => $location->id, 'target_type' => 'location']) }}"
+                                  :presenter="\App\Presenters\HistoryPresenter::dataTableLayout()"
+                                  export_filename="export-children-locations-{{ str_slug($location->name) }}-{{ date('Y-m-d') }}"
+                          />
+                      </x-slot:content>
+                  </x-tabs.pane>
+                  <!-- end history tab pane -->
+
+              </x-slot:tabpanes>
+      </x-tabs>
+
+        </x-page-column>
+        <x-page-column class="col-md-3">
 
       @if ($location->image!='')
           <div class="col-md-12 text-center" style="padding-bottom: 17px;">
@@ -586,24 +507,20 @@ class="table table-striped snipe-table"
               </div>
     @endcan
 
-
-
-</div>
-</div>
-
+        </x-page-column>
+    </x-container>
 
 @stop
 
-@section('moar_scripts')
-
-    @can('update', Location::class)
-        @include ('modals.upload-file', ['item_type' => 'locations', 'item_id' => $location->id])
-    @endcan
-
+@can('update', Location::class)
+    @section('moar_scripts')
+       @include ('modals.upload-file', ['item_type' => 'locations', 'item_id' => $location->id])
+    @endsection
+@endcan
 
 @include ('partials.bootstrap-table', [
 'exportFile' => 'locations-export',
 'search' => true
 ])
 
-@stop
+