HyperCube/Pages/Desktop.razor

@page "/desktop"
@*@page "/desktop/{docID:int}"*@
@attribute [Authorize]

<div class="blocks">
    <div class="first-block">
        <div class="top__block">
            <div class="header-block header-block_first">
                <div class="header-block__text">Календарь событий</div>
                <div class="header-block__span">
                    <span></span>
                    <span></span>
                    <span></span>
                </div>
            </div>
            <div class="slider">
                <div class="slider__item">
                    Тема: Цифровой двойник синтеза метанола <br>
                    Организатор: ООО«ПроК» <br>
                    Дата проведения: с 1 дек. по 30 дек. 2021 года <br>
                    Формат: Цифровой хакатон <br>
                    Статус: Открыта регистрация <br>
                    ID: Dh001<br>
                </div>
            </div>
            <div class="footer-block">
                <div class="footer-block__left__button">
                    <img src="img/left_button.svg" alt="">
                    <p>Влево</p>
                </div>
                <div class="footer-block__right__button">
                    <p>Вправо</p>
                    <img src="img/right_button.svg" alt="">
                </div>
            </div>
        </div>
        <div class="bottom__block">
            <div class="first-block__inforamtion__box">
                <div class="header-block header-block_first">
                    <div class="header-block__text">Описание мероприятия</div>
                    <div class="header-block__span">
                        <span></span>
                        <span></span>
                        <span></span>
                    </div>
                </div>
                <div class="first-block__inforamtion">
                    <p>
                        Цели хакатона <a class="first-block__inforamtion__item" href="">Почитать про формат</a><br>
                        Создание экспертного сообщества по теме разработки математической модели<br>
                    </p>
                    <p>Создание библиотеки знаний <a class="first-block__inforamtion__item" href="">Посмотреть библиотеку</a> по синтезу метанола в нефтехимической промышленности</p>
                    <p>Обучение работы с цифровыми решениями 2DH: <br>-с большими массивами данных и информации<br>-извлечения ценных знаний из неструктурированных данных и информации</p>
                    <a class="first-block__inforamtion__item" href="">Почитать правила</a>
                    <p>
                        Бюджет: 1 200 2dh <br>
                        Рейтинг прохождения: +250mmr
                    </p>
                    <p>Зарегистрировалось 24 пользователя</p>
                </div>
            </div>
            <div class="first-block__inforamtion__button">
                <button class="btn_grey">Подать заявку</button>
                <button class="btn_grey">Сохранить</button>
                <button class="btn_grey">Поделиться</button>
            </div>
        </div>
    </div>
    <div class="second-block">
        <div class="header-block header-block_second">
            <div class="header-block__text">Рабочий стол</div>
            <div class="header-block__span" @onclick="@(() => WidgetMenuClick(".block__dropbox", "desktop_menu"))">
                <span></span>
                <span></span>
                <span></span>
            </div>
        </div>
        <div class="block__dropbox" id="desktop_menu">
            <p class="block__dropbox__header__text">Выбрать действие</p>            
            <a class="block__dropbox__search" style="cursor:pointer" @onclick="NewDocument">Новый документ</a>
        </div>
        <div class="second-block__button">
            <button class=@_uploadButtonClass @onclick="(() => SwitchDesktopTab(0))">Загрузка</button>
            <button class=@_verifyButtonClass @onclick="(() => SwitchDesktopTab(1))">Верифицировать</button>
            <button class=@_otherButtonClass @onclick="(() => SwitchDesktopTab(2))">Другое</button>
        </div>
        <div class=@_uploadTabClass>
            <EditForm Model="@_article">
                <p>Загрузка материала</p>
                <label class="upload__label">
                    <select class="form-control upload__input">
                        <option value="">Выберете мероприятие</option>
                        <option selected value="hackathon22_01">Хакатон 2022</option>
                    </select>
                </label>
                <label class="upload__label">
                    <InputText type="text" placeholder="Наименование статьи" class="form-control upload__input" @bind-Value="_article.Name" />
                </label>
                <label class="upload__label">
                    <InputDate type="date" placeholder="Дата издания" class="form-control upload__input" @bind-Value="_article.PublishDate" />
                </label>
                <label class="upload__label">
                    <InputText type="text" placeholder="Автор" class="form-control upload__input" @bind-Value="_article.Authors" />
                    <div class="upload__input-descr">+ Добавить автора. Указывать имена авторов через запятую</div>
                </label>
                <label class="upload__label">
                    <InputTextArea placeholder="Аннотация" class="form-control upload__textarea" @bind-Value="_article.Annotation" />
                </label>
                <label class="upload__label">
                    <input type="text" placeholder="Ссылка на статью" class="form-control upload__input">
                </label>
                <label class="upload__label">
                    <InputText type="text" placeholder="Ключевые слова" class="form-control upload__input" @bind-Value="_article.Keywords" />
                    <div class="upload__input-descr">Status: @_status</div>
                </label>
                <div class="second-block__input__file__label__box">
                    <InputFile class="second-block__input__file" id="input_file" OnChange="@HandleUpload"
                               accept="application/pdf, application/msword, application/vnd.openxmlformats-officedocument.wordprocessingml.document,
                                    text/html, text/plain, application/rtf" />
                    <label for="input_file" class="second-block__input__file__label" id="file_label">
                        <span>+</span>
                        <p>Прикрепить файл</p>
                    </label>
                </div>
                <div class="second-block__form__button">
                    <button class="btn_grey" @onclick="SendToVerify_OnClick">Отправить на верификацию</button>
                    <button class="btn_grey" @onclick="(() => SaveDocument_OnClick(Models.ArticleStatus.Saved))">Сохранить</button>
                </div>
            </EditForm>
        </div>
        <div class=@_verifyTabClass>
            <p>Валидация материала</p>
            <label class="upload__label upload__label_mb">
                <select class="form-control upload__input" @onchange="DocSelect_OnChange">
                    <option value="">Выберите материал</option>
                    @foreach (var article in AppData.Articles)
                    {
                        if (article.Value.ID == _article.ID)
                            _articleDropdownOption = $"<option selected value={article.Value.ID}>{article.Value.Name}</option>";

                        else
                            _articleDropdownOption = $"<option value={article.Value.ID}>{article.Value.Name}</option>";

                        @((MarkupString)_articleDropdownOption)
                    }
                </select>
            </label>
            <input type="checkbox" class="checkbox__input" name="verify" id="radio">
            <label class="сheckbox__label" for="radio">
                Материал сформирован не по правилам
            </label>
            <input type="checkbox" class="checkbox__input" name="verify" id="radio2">
            <label class="сheckbox__label" for="radio2">
                Не являюсь экспертом в этой теме
            </label>
            <input type="checkbox" class="checkbox__input" name="verify" id="radio3">
            <label class="сheckbox__label" for="radio3">
                Требуется дополнительная экспертиза
            </label>
            <input type="checkbox" class="checkbox__input" name="verify" id="radio5">
            <label class="сheckbox__label" for="radio5">
                Отклонить, указать причину
            </label>
            <label class="upload__label">
                <textarea placeholder="Причина" class="form-control upload__textarea"></textarea>
            </label>
            <label class="upload__label">
                <textarea placeholder="Теги" class="form-control upload__textarea"></textarea>
                <div class="upload__input-descr">+ Добавить тэг. Указывать тэги через запятую</div>
            </label>
            <div class="second-block__form__button">
                <button class="btn_grey" @onclick="Verify_OnClick">Валидация</button>
                <button class="btn_grey" @onclick="(() => SaveDocument_OnClick(Models.ArticleStatus.Verifying))">Сохранить</button>
            </div>
        </div>
    </div>
    <div class="third-block">
        <div class="header-block header-block_third">
            <div class="header-block__text">Библиотека</div>
            <div class="header-block__span" @onclick="@(() => WidgetMenuClick(".block__dropbox", "library_menu"))">
                <span></span>
                <span></span>
                <span></span>
            </div>
        </div>
        <div class="block__dropbox" id="library_menu">
            <p class="block__dropbox__header__text">Сортировка</p>
            <p class="block__dropbox__search">Выбрать</p>
            <select name="" id="" class="block__dropbox__select">
                <option value="Верифицированные">Верифицированные</option>
                <option value="На верификации">На верификации</option>
                <option value="Отклоненные">Отклоненные</option>
            </select>
            <label for="" class="block__dropbox__search">
                Найти по номеру
                <input type="text">
            </label>
            <label for="" class="block__dropbox__search">
                Найти по мероприятию
                <input type="text">
            </label>
            <label for="" class="block__dropbox__search"></label>
        </div>
        <div class="third-block__info">
            <ul class="third-block__info__ul" style="cursor:pointer">
                @foreach (var article in AppData.Articles)
                {
                    <li class="third-block__info__li" @onclick="(() => LoadDocument(article.Key))" >@(_counter++) | @article.Value.Name<br>@GetDisplayName(article.Value.Status)</li>
                }
            </ul>
        </div>
    </div>

    <ModalInfo @ref="_modalInfo_error">
        <Title>Ошибка</Title>
        <Body>
        </Body>
    </ModalInfo>
    <ModalLoading @ref="_modalLoading">
        <Body>
        </Body>
    </ModalLoading>

</div>
<div style="margin-left:10px ; margin-top: 10px">
    <p>Имя файла: @_report.FileName</p>
    <p>Размер: @_report.FileSize байт</p>
    <p>Формат: @_report.FileFormat</p>

    <Collapsible LabelText="Noun groups:"
                 Collapsed="true">
        <ChildContent>
            <div style="margin-left:50px">
                <Collapsible LabelText="Grouped&Sorted"
                             Collapsed="true">
                    <ChildContent>
                        @((MarkupString)_report.NounGroupsSorted)
                    </ChildContent>
                </Collapsible>
            </div>
            @((MarkupString)_article.NounGroups)
        </ChildContent>
    </Collapsible>

    <Collapsible LabelText="Entities:"
                 Collapsed="true">
        <ChildContent>
            @((MarkupString)_article.Entities)
        </ChildContent>
    </Collapsible>

    <Collapsible LabelText="Morph:"
                 Collapsed="true">
        <ChildContent>
            @((MarkupString)_article.Morph)
        </ChildContent>
    </Collapsible>

    <Collapsible LabelText="Keywords1:"
                 Collapsed="true">
        <ChildContent>
            @((MarkupString)_article.Keywords1)
        </ChildContent>
    </Collapsible>

    <Collapsible LabelText="Keywords2:"
                 Collapsed="true">
        <ChildContent>
            @((MarkupString)_article.Keywords2)
        </ChildContent>
    </Collapsible>
</div>