HyperCube/Pages/Desktop.razor

@page "/Desktop"
@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">
                <span></span>
                <span></span>
                <span></span>
            </div>
        </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">
                    <InputSelect type="text" placeholder="Выбрать мероприятие" class="form-control upload__input" @bind-Value="_event">
                        <option value="">Выбрать мероприятие</option>
                        <option value="hackathon22_01">Хакатон 2022</option>
                    </InputSelect>
                </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" />
                    <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">Отправить на верификацию</button>
                    <button class="btn_grey">Сохранить</button>
                </div>
            </EditForm>
        </div>
        <div class=@_verifyTabClass>
            <p>Валидация материала</p>
            <label class="upload__label upload__label_mb">
                <input type="text" placeholder="Выберите материала" class="form-control upload__input">                    
            </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="radio4">
            <label class="сheckbox__label" for="radio4">
                Требуется дополнительная экспертиза
            </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>
            </label>                
            <div class="second-block__form__button">
                <button class="btn_grey">Валидация</button>
                <button class="btn_grey">Сохранить</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" id="sort_libary">
                <span></span>
                <span></span>
                <span></span>
            </div>
        </div>
        <div class="third-block__dropbox">
            <p class="third-block__dropbox__header__text">Сортировка</p>
            <p class="third-block__dropbox__header__text">Выбрать</p>
            <select name="" id="" class="third-block__dropbox__select">
                <option value="Верифицированные">Верифицированные</option>
                <option value="На верификации">На верификации</option>
                <option value="Отклоненные">Отклоненные</option>
            </select>
            <label for="" class="third-block__dropbox__search">
                Найти по номеру
                <input type="text">
            </label>
            <label for="" class="third-block__dropbox__search">
                Найти по мераприятию
                <input type="text">
            </label>
            <label for="" class="third-block__dropbox__search"></label>
        </div>
        <div class="third-block__info">
            <ul class="third-block__info__ul">
                @foreach (var articleModel in AppData.Articles)
                {
                    <li class="third-block__info__li">@(_counter++) | <a href="@($"/docedit/{articleModel.Key}")">@articleModel.Value.Name</a></li>
                }
            </ul>
        </div>
    </div>

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

</div>