mirror of
https://github.com/BookStackApp/BookStack.git
synced 2024-11-24 20:02:35 +01:00
Converted breadcrumb-listing to new component system
This commit is contained in:
parent
e408067b10
commit
33e35c9a8a
@ -1,17 +1,14 @@
|
||||
|
||||
|
||||
class BreadcrumbListing {
|
||||
|
||||
constructor(elem) {
|
||||
this.elem = elem;
|
||||
this.searchInput = elem.querySelector('input');
|
||||
this.loadingElem = elem.querySelector('.loading-container');
|
||||
this.entityListElem = elem.querySelector('.breadcrumb-listing-entity-list');
|
||||
setup() {
|
||||
this.elem = this.$el;
|
||||
this.searchInput = this.$refs.searchInput;
|
||||
this.loadingElem = this.$refs.loading;
|
||||
this.entityListElem = this.$refs.entityList;
|
||||
|
||||
// this.loadingElem.style.display = 'none';
|
||||
const entityDescriptor = elem.getAttribute('breadcrumb-listing').split(':');
|
||||
this.entityType = entityDescriptor[0];
|
||||
this.entityId = Number(entityDescriptor[1]);
|
||||
this.entityType = this.$opts.entityType;
|
||||
this.entityId = Number(this.$opts.entityId);
|
||||
|
||||
this.elem.addEventListener('show', this.onShow.bind(this));
|
||||
this.searchInput.addEventListener('input', this.onSearch.bind(this));
|
||||
|
@ -4,11 +4,16 @@
|
||||
|
||||
<p class="mb-none">{{ trans('entities.permissions_intro') }}</p>
|
||||
|
||||
<div class="form-group">
|
||||
@include('form.checkbox', [
|
||||
'name' => 'restricted',
|
||||
'label' => trans('entities.permissions_enable'),
|
||||
])
|
||||
<div class="grid half">
|
||||
<div class="form-group">
|
||||
@include('form.checkbox', [
|
||||
'name' => 'restricted',
|
||||
'label' => trans('entities.permissions_enable'),
|
||||
])
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="owner">Owner</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<table permissions-table class="table permissions-table toggle-switch-list" style="{{ !$model->restricted ? 'display: none' : '' }}">
|
||||
|
@ -1,4 +1,7 @@
|
||||
<div class="breadcrumb-listing" component="dropdown" breadcrumb-listing="{{ $entity->getType() }}:{{ $entity->id }}">
|
||||
<div class="breadcrumb-listing" components="dropdown breadcrumb-listing"
|
||||
option:breadcrumb-listing:entity-type="{{ $entity->getType() }}"
|
||||
option:breadcrumb-listing:entity-id="{{ $entity->id }}"
|
||||
breadcrumb-listing="{{ $entity->getType() }}:{{ $entity->id }}">
|
||||
<div class="breadcrumb-listing-toggle" refs="dropdown@toggle"
|
||||
aria-haspopup="true" aria-expanded="false" tabindex="0">
|
||||
<div class="separator">@icon('chevron-right')</div>
|
||||
@ -6,9 +9,16 @@
|
||||
<div refs="dropdown@menu" class="breadcrumb-listing-dropdown card" role="menu">
|
||||
<div class="breadcrumb-listing-search">
|
||||
@icon('search')
|
||||
<input autocomplete="off" type="text" name="entity-search" placeholder="{{ trans('common.search') }}" aria-label="{{ trans('common.search') }}">
|
||||
<input refs="breadcrumb-listing@searchInput"
|
||||
aria-label="{{ trans('common.search') }}"
|
||||
autocomplete="off"
|
||||
name="entity-search"
|
||||
placeholder="{{ trans('common.search') }}"
|
||||
type="text">
|
||||
</div>
|
||||
@include('partials.loading-icon')
|
||||
<div class="breadcrumb-listing-entity-list px-m"></div>
|
||||
<div refs="breadcrumb-listing@loading">
|
||||
@include('partials.loading-icon')
|
||||
</div>
|
||||
<div refs="breadcrumb-listing@entityList" class="breadcrumb-listing-entity-list px-m"></div>
|
||||
</div>
|
||||
</div>
|
Loading…
Reference in New Issue
Block a user