Added support for File descriptions, Folder capacity and image sizes. Added image resizing capability using ImageSharp - implemented in user profile. Added parameter to disable image preview in FileManager component. Overhauled Pager component and added Columns parameter for Grid mode. Populated PageState.User.IsAuthenticated in SiteRouter. Added support for zero price commercial extentions.

2021-09-15 08:02:55 -04:00
parent ba7524b754
commit 898b908c1b
26 changed files with 525 additions and 241 deletions
--- a/Oqtane.Client/Modules/Controls/FileManager.razor
+++ b/Oqtane.Client/Modules/Controls/FileManager.razor
@ -59,7 +59,7 @@
                    </div>
                }
            </div>
-            @if (_image != string.Empty)
+            @if (_image != string.Empty && ShowImage)
            {
                <div class="col-auto">
                    @((MarkupString) _image)
@ -110,6 +110,9 @@
    [Parameter]
    public bool ShowFolders { get; set; } = true; // optional - for indicating whether a list of folders should be displayed - default is true

+    [Parameter]
+    public bool ShowImage { get; set; } = true; // optional - for indicating whether an image thumbnail should be displayed - default is true
+
    [Parameter]
    public int FileId { get; set; } = -1; // optional - for setting a specific file by default

--- a/Oqtane.Client/Modules/Controls/Pager.razor
+++ b/Oqtane.Client/Modules/Controls/Pager.razor
@ -2,68 +2,57 @@
@inherits ModuleControlBase
@typeparam TableItem

-<p>
-    @if (Toolbar == "Top")
+@if (ItemList != null)
+{
+    @if (Toolbar == "Top" && _pages > 0 && Items.Count() > _maxItems)
    {
        <ul class="pagination justify-content-center my-2">
-            @if (_endPage > 1)
+            <li class="page-item@((_page > 1) ? "" : " disabled")">
+                <a class="page-link" @onclick=@(async () => UpdateList(1))><span class="oi oi-media-step-backward" title="start" aria-hidden="true"></span></a>
+            </li>
+            @if (_pages > _displayPages)
            {
-                <li class="page-item">
-                    <a class="page-link" @onclick=@(async () => UpdateList(1))><span class="oi oi-media-step-backward" title="first" aria-hidden="true"></span></a>
+                <li class="page-item@((_page > _displayPages) ? "" : " disabled")">
+                    <a class="page-link" @onclick=@(async () => SkipPages("back"))><span class="oi oi-media-skip-backward" title="skip back" aria-hidden="true"></span></a>
                </li>
            }
-            @if (_page > _maxPages)
+            <li class="page-item@((_page > 1) ? "" : " disabled")">
+                <a class="page-link" @onclick=@(async () => NavigateToPage("previous"))><span class="oi oi-chevron-left" title="previous" aria-hidden="true"></span></a>
+            </li>
+            @for (int i = _startPage; i <= _endPage; i++)
            {
-                <li class="page-item">
-                    <a class="page-link" @onclick=@(async () => SetPagerSize("back"))><span class="oi oi-media-skip-backward" title="back" aria-hidden="true"></span></a>
-                </li>
-            }
-            @if (_endPage > 1)
-            {
-                <li class="page-item">
-                    <a class="page-link" @onclick=@(async () => NavigateToPage("previous"))><span class="oi oi-chevron-left" title="previous" aria-hidden="true"></span></a>
-                </li>
-                @for (int i = _startPage; i <= _endPage; i++)
+                var pager = i;
+                if (pager == _page)
                {
-                    var pager = i;
-                    if (pager == _page)
-                    {
-                        <li class="page-item active">
-                            <a class="page-link" @onclick=@(async () => UpdateList(pager))>@pager</a>
-                        </li>
-                    }
-                    else
-                    {
-                        <li class="page-item">
-                            <a class="page-link" @onclick=@(async () => UpdateList(pager))>@pager</a>
-                        </li>
-                    }
+                    <li class="page-item active">
+                        <a class="page-link" @onclick=@(async () => UpdateList(pager))>@pager</a>
+                    </li>
+                }
+                else
+                {
+                    <li class="page-item">
+                        <a class="page-link" @onclick=@(async () => UpdateList(pager))>@pager</a>
+                    </li>
                }
-                <li class="page-item">
-                    <a class="page-link" @onclick=@(async () => NavigateToPage("next"))><span class="oi oi-chevron-right" title="next" aria-hidden="true"></span></a>
-                </li>
            }
-            @if (_endPage < _pages)
+            <li class="page-item@((_page < _pages) ? "" : " disabled")">
+                <a class="page-link" @onclick=@(async () => NavigateToPage("next"))><span class="oi oi-chevron-right" title="next" aria-hidden="true"></span></a>
+            </li>
+            @if (_pages > _displayPages)
            {
-                <li class="page-item">
-                    <a class="page-link" @onclick=@(async () => SetPagerSize("forward"))><span class="oi oi-media-skip-forward" title="forward" aria-hidden="true"></span></a>
-                </li>
-            }
-            @if (_endPage > 1)
-            {
-                <li class="page-item">
-                    <a class="page-link" @onclick=@(async () => UpdateList(_pages))><span class="oi oi-media-step-forward" title="last" aria-hidden="true"></span></a>
-                </li>
-            }
-            @if (_endPage > 1)
-            {
-                <li class="page-item disabled">
-                    <a class="page-link">Page @_page of @_pages</a>
+                <li class="page-item@((_endPage < _pages) ? "" : " disabled")">
+                    <a class="page-link" @onclick=@(async () => SkipPages("forward"))><span class="oi oi-media-skip-forward" title="skip forward" aria-hidden="true"></span></a>
                </li>
            }
+            <li class="page-item@((_page < _pages) ? "" : " disabled")">
+                <a class="page-link" @onclick=@(async () => UpdateList(_pages))><span class="oi oi-media-step-forward" title="end" aria-hidden="true"></span></a>
+            </li>
+            <li class="page-item disabled">
+                <a class="page-link">Page @_page of @_pages</a>
+            </li>
        </ul>
    }
-    @if (Format == "Table")
+    @if (Format == "Table" && Row != null)
    {
        <table class="@Class">
            <thead>
@ -81,113 +70,125 @@
            </tbody>
        </table>
    }
-    @if (Format == "Grid")
+    @if (Format == "Grid" && Row != null)
    {
+        int count = 0;
+        if (ItemList != null)
+        {
+            count = (int)Math.Ceiling(ItemList.Count() / (decimal)_columns) * _columns;
+        }
        <div class="@Class">
-            <div class="row">@Header</div>
-            @foreach (var item in ItemList)
+            @if (Header != null)
            {
-                <div class="row">@Row(item)</div>
-                @if (Detail != null)
-                {
-                    <div class="row">@Detail(item)</div>
-                }
+                <div class="row"><div class="col">@Header</div></div>
+            }
+            @for (int row = 0; row < (count / _columns); row++)
+            {
+                <div class="row">
+                    @for (int col = 0; col < _columns; col++)
+                    {
+                        int index = (row * _columns) + col;
+                        if (index < ItemList.Count())
+                        {
+                            <div class="col">@Row(ItemList.ElementAt(index))</div>
+                        }
+                        else
+                        {
+                            <div class="col">&nbsp;</div>
+                        }
+                    }
+                </div>
            }
        </div>
    }
-    @if (Toolbar == "Bottom")
+    @if (Toolbar == "Bottom" && _pages > 0 && Items.Count() > _maxItems)
    {
        <ul class="pagination justify-content-center my-2">
-            @if (_endPage > 1)
+            <li class="page-item@((_page > 1) ? "" : " disabled")">
+                <a class="page-link" @onclick=@(async () => UpdateList(1))><span class="oi oi-media-step-backward" title="start" aria-hidden="true"></span></a>
+            </li>
+            @if (_pages > _displayPages)
            {
-                <li class="page-item">
-                    <a class="page-link" @onclick=@(async () => UpdateList(1))><span class="oi oi-media-step-backward" title="first" aria-hidden="true"></span></a>
+                <li class="page-item@((_page > _displayPages) ? "" : " disabled")">
+                    <a class="page-link" @onclick=@(async () => SkipPages("back"))><span class="oi oi-media-skip-backward" title="skip back" aria-hidden="true"></span></a>
                </li>
            }
-            @if (_page > _maxPages)
+            <li class="page-item@((_page > 1) ? "" : " disabled")">
+                <a class="page-link" @onclick=@(async () => NavigateToPage("previous"))><span class="oi oi-chevron-left" title="previous" aria-hidden="true"></span></a>
+            </li>
+            @for (int i = _startPage; i <= _endPage; i++)
            {
-                <li class="page-item">
-                    <a class="page-link" @onclick=@(async () => SetPagerSize("back"))><span class="oi oi-media-skip-backward" title="back" aria-hidden="true"></span></a>
-                </li>
-            }
-            @if (_endPage > 1)
-            {
-                <li class="page-item">
-                    <a class="page-link" @onclick=@(async () => NavigateToPage("previous"))><span class="oi oi-chevron-left" title="previous" aria-hidden="true"></span></a>
-                </li>
-                @for (int i = _startPage; i <= _endPage; i++)
+                var pager = i;
+                if (pager == _page)
                {
-                    var pager = i;
-                    if (pager == _page)
-                    {
-                        <li class="page-item active">
-                            <a class="page-link" @onclick=@(async () => UpdateList(pager))>@pager</a>
-                        </li>
-                    }
-                    else
-                    {
-                        <li class="page-item">
-                            <a class="page-link" @onclick=@(async () => UpdateList(pager))>@pager</a>
-                        </li>
-                    }
+                    <li class="page-item active">
+                        <a class="page-link" @onclick=@(async () => UpdateList(pager))>@pager</a>
+                    </li>
+                }
+                else
+                {
+                    <li class="page-item">
+                        <a class="page-link" @onclick=@(async () => UpdateList(pager))>@pager</a>
+                    </li>
                }
-                <li class="page-item">
-                    <a class="page-link" @onclick=@(async () => NavigateToPage("next"))><span class="oi oi-chevron-right" title="next" aria-hidden="true"></span></a>
-                </li>
            }
-            @if (_endPage < _pages)
+            <li class="page-item@((_page < _pages) ? "" : " disabled")">
+                <a class="page-link" @onclick=@(async () => NavigateToPage("next"))><span class="oi oi-chevron-right" title="next" aria-hidden="true"></span></a>
+            </li>
+            @if (_pages > _displayPages)
            {
-                <li class="page-item">
-                    <a class="page-link" @onclick=@(async () => SetPagerSize("forward"))><span class="oi oi-media-skip-forward" title="forward" aria-hidden="true"></span></a>
-                </li>
-            }
-            @if (_endPage > 1)
-            {
-                <li class="page-item">
-                    <a class="page-link" @onclick=@(async () => UpdateList(_pages))><span class="oi oi-media-step-forward" title="last" aria-hidden="true"></span></a>
-                </li>
-            }
-            @if (_endPage > 1)
-            {
-                <li class="page-item disabled">
-                    <a class="page-link">Page @_page of @_pages</a>
+                <li class="page-item@((_endPage < _pages) ? "" : " disabled")">
+                    <a class="page-link" @onclick=@(async () => SkipPages("forward"))><span class="oi oi-media-skip-forward" title="skip forward" aria-hidden="true"></span></a>
                </li>
            }
+            <li class="page-item@((_page < _pages) ? "" : " disabled")">
+                <a class="page-link" @onclick=@(async () => UpdateList(_pages))><span class="oi oi-media-step-forward" title="end" aria-hidden="true"></span></a>
+            </li>
+            <li class="page-item disabled">
+                <a class="page-link">Page @_page of @_pages</a>
+            </li>
        </ul>
    }
-</p>
+}

@code {
    private int _pages = 0;
    private int _page = 1;
    private int _maxItems = 10;
-    private int _maxPages = 5;
+    private int _displayPages = 5;
    private int _startPage = 0;
    private int _endPage = 0;
+    private int _columns = 1;

    [Parameter]
-    public string Format { get; set; }
+    public string Format { get; set; } // Table or Grid

    [Parameter]
-    public string Toolbar { get; set; }
+    public string Toolbar { get; set; } // Top or Bottom

    [Parameter]
-    public RenderFragment Header { get; set; }
+    public RenderFragment Header { get; set; } = null;

    [Parameter]
-    public RenderFragment<TableItem> Row { get; set; }
+    public RenderFragment<TableItem> Row { get; set; } = null;

    [Parameter]
-    public RenderFragment<TableItem> Detail { get; set; }
+    public RenderFragment<TableItem> Detail { get; set; } = null; // only applicable to Table layouts

    [Parameter]
-    public IEnumerable<TableItem> Items { get; set; }
+    public IEnumerable<TableItem> Items { get; set; } // the IEnumerable data source

    [Parameter]
-    public string PageSize { get; set; }
+    public string PageSize { get; set; } // number of items to display on a page

    [Parameter]
-    public string DisplayPages { get; set; }
+    public string Columns { get; set; } // only applicable to Grid layouts
+
+    [Parameter]
+    public string CurrentPage { get; set; } // optional property to set the initial page to display
+
+    [Parameter]
+    public string DisplayPages { get; set; } // maximum number of page numbers to display for user selection

    [Parameter]
    public string Class { get; set; }
@ -223,86 +224,89 @@
            _maxItems = int.Parse(PageSize);
        }

-        if (!string.IsNullOrEmpty(DisplayPages))
+        if (!string.IsNullOrEmpty(Columns))
        {
-            _maxPages = int.Parse(DisplayPages);
+            _columns = int.Parse(Columns);
+        }
+
+        if (!string.IsNullOrEmpty(DisplayPages))
+        {
+            _displayPages = int.Parse(DisplayPages);
+        }
+
+        if (!string.IsNullOrEmpty(CurrentPage))
+        {
+            _page = int.Parse(CurrentPage);
+        }
+        else
+        {
+            _page = 1;
        }

-        _page = 1;
        _startPage = 0;
        _endPage = 0;

        if (Items != null)
        {
-            ItemList = Items.Skip((_page - 1) * _maxItems).Take(_maxItems);
            _pages = (int)Math.Ceiling(Items.Count() / (decimal)_maxItems);
+            if (_page > _pages)
+            {
+                _page = _pages;
+            }
+            ItemList = Items.Skip((_page - 1) * _maxItems).Take(_maxItems);
+            SetPagerSize();
        }
-
-        SetPagerSize("forward");
    }

-    public void UpdateList(int currentPage)
+    public void SetPagerSize()
    {
-        ItemList = Items.Skip((currentPage - 1) * _maxItems).Take(_maxItems);
-        _page = currentPage;
-
+        _startPage = ((_page - 1) / _displayPages) * _displayPages + 1;
+        _endPage = _startPage + _displayPages - 1;
+        if (_endPage > _pages)
+        {
+            _endPage = _pages;
+        }
        StateHasChanged();
    }

-    public void SetPagerSize(string direction)
+    public void UpdateList(int page)
    {
-        if (direction == "forward")
-        {
-            if (_endPage + 1 < _pages)
-            {
-                _startPage = _endPage + 1;
-            }
-            else
-            {
-                _startPage = 1;
-            }
+        ItemList = Items.Skip((page - 1) * _maxItems).Take(_maxItems);
+        _page = page;
+        SetPagerSize();
+    }

-            if (_endPage + _maxPages < _pages)
-            {
-                _endPage = _startPage + _maxPages - 1;
-            }
-            else
-            {
-                _endPage = _pages;
-            }
-
-            StateHasChanged();
-        }
-        else if (direction == "back")
+    public void SkipPages(string direction)
+    {
+        switch (direction)
        {
-            _endPage = _startPage - 1;
-            _startPage = _startPage - _maxPages;
+            case "forward":
+                _page = _endPage + 1;
+                break;
+            case "back":
+                _page = _startPage - 1;
+                break;
        }
+
+        SetPagerSize();
    }

    public void NavigateToPage(string direction)
    {
-        if (direction == "next")
+        switch (direction)
        {
-            if (_page < _pages)
-            {
-                if (_page == _endPage)
+            case "next":
+                if (_page < _pages)
                {
-                    SetPagerSize("forward");
+                    _page += 1;
                }
-                _page += 1;
-            }
-        }
-        else if (direction == "previous")
-        {
-            if (_page > 1)
-            {
-                if (_page == _startPage)
+                break;
+            case "previous":
+                if (_page > 1)
                {
-                    SetPagerSize("back");
+                    _page -= 1;
                }
-                _page -= 1;
-            }
+                break;
        }

        UpdateList(_page);