Seenginx/Seenginx/Components/FilesWithEditor.razor

107 lines
4.0 KiB
Plaintext

@typeparam CFile
<div class="filesWithEditor">
<div class="filterFiles">
<div class="field has-addons">
<div class="control has-icons-left is-expanded">
<input formnovalidate @oninput="e => SearchInputChanged(e.Value.ToString())" class="input is-rounded is-small neoInput" type="text" placeholder="Search...">
<span class="icon is-small is-left has-text-dark">
<i class="mdi mdi-search-web"></i>
</span>
</div>
<div class="control has-icons-left">
<div class="select is-small is-rounded">
<select class="neoInput" @onchange="e => OnFilterClick(e.Value.ToString())">
@foreach (var filter in Filters)
{
<option value="@filter">@filter</option>
}
</select>
</div>
<span class="icon is-small is-left has-text-dark">
<i class="mdi mdi-folder-cog-outline"></i>
</span>
</div>
</div>
</div>
<div class="fileTitle">
@if (IsAnyFileSelected)
{
<div class="field is-grouped">
<div class="control is-expanded borderRBig neoInput has-text-centered">
<input class="input is-5 is-rounded is-small neoInput" type="text" placeholder="Search..." value="@SelectedFile.Name" disabled>
</div>
<div class="control">
<button class="button is-small is-rounded neoBtn" @onclick="OnFileCloseClick">
<span class="icon is-medium">
<i class="mdi mdi-close"></i>
</span>
</button>
</div>
</div>
}
else
{
<div class="field">
<div class="control is-expanded borderRBig neoInput has-text-centered"><span>...</span></div>
</div>
}
</div>
<div class="files neomorphInsetSmall borderR">
<div class="filesList">
@foreach (var file in Files)
{
<div @onclick="e => OnFileClick(e,file)" @key="file" class="confFile borderRSmall isFinger neoFile @file.IsVisible @file.IsSelected">
<p class="is-7">@file.Folder</p>
<p class="has-text-weight-bold @(file.CanBeDeleted ? null : "has-text-danger")">@file.Name</p>
</div>
}
</div>
</div>
<div class="codeEditor neomorphInsetSmall borderR">
<pre id="editor" class="borderR @(IsAnyFileSelected ? string.Empty : "is-hidden")">
</pre>
<div class="stripe borderR @(IsAnyFileSelected ? "is-hidden" : string.Empty)">
<div class="stripe_inner">Select a file</div>
</div>
</div>
<div class="filesActions">
<div class="buttons is-centered">
<button class="button is-rounded neoBtn is-small noBottomMargin" @onclick="OnAddDialog">
<span class="icon is-small has-text-success">
<i class="mdi mdi-plus-box-outline"></i>
</span>
<span>Add</span>
</button>
<button class="button is-rounded neoBtn is-small noBottomMargin @IsSelectedFileDeletable" @onclick="OnDeleteDialog">
<span class="icon is-small has-text-danger">
<i class="mdi mdi-minus-box-outline"></i>
</span>
<span>Delete</span>
</button>
</div>
</div>
<div class="editorActions">
@if (IsAnyFileSelected)
{
<div class="buttons is-centered">
<button @onclick="OnSaveDraft" class="button is-rounded neoBtn is-small has-icon-left noBottomMargin"><span class="icon is-left has-text-light"><i class="mdi mdi-content-save-outline"></i></span> <span>Save draft</span></button>
<button @onclick="OnUndoChanges" class="button is-rounded neoBtn is-small has-icon-left noBottomMargin"><span class="icon is-left has-text-dark"><i class="mdi mdi-undo-variant"></i></span> <span>Undo changes</span></button>
<button @onclick="OnSave" class="button is-rounded neoBtn is-small has-icon-left noBottomMargin"><span class="icon is-left has-text-success"><i class="mdi mdi-content-save-all-outline"></i></span> <span>Save</span></button>
<button @onclick="OnTest" class="button is-rounded neoBtn is-small has-icon-left noBottomMargin"><span class="icon is-left has-text-danger"><i class="mdi mdi-alert-outline"></i></span> <span>Test</span></button>
</div>
}
else
{
<span></span>
}
</div>
</div>