CakesTwix/Toloka2WebV2
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Added circle progress while titles is loading and fix missing images

Browse source
This commit is contained in:
CakesTwix 2024-09-24 15:14:11 +03:00
parent c740c2d72b
commit 74dfc5628e
Signed by: CakesTwix
GPG key ID: 7B11051D5CE19825
3 changed files with 69 additions and 64 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
frontend/index.html
View file

@ -2,6 +2,7 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="referrer" content="no-referrer" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" /> <link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + Vue + TS</title> <title>Vite + Vue + TS</title>

130
frontend/src/pages/index.vue
View file

@ -1,76 +1,80 @@
<template> <template>
<main v-if="titles.length > 0">
<form @submit.prevent="filterTitles"> <form @submit.prevent="filterTitles">
<div class="field large prefix round fill"> <div class="field large prefix round fill">
<i class="front">search</i> <i class="front">search</i>
<input v-model="search" type="text"> <input v-model="search" type="text">
</div>
</form>
<nav>
<a class="chip" @click="updateByCodename('')">
<i id="update_all_icon">done_all</i>
<span>Завантажити нові серії</span>
</a>
<a class="chip" @click="fetchTorrents">
<i>restart_alt</i>
<span>Оновити список</span>
</a>
<div class="max"></div>
<button class="round fill">
<span>Сортування</span>
<i>arrow_drop_down</i>
<menu id="sort-menu">
<a @click="sortTitles('name')">За назвою</a>
<a @click="sortTitles('date')">За датою</a>
<a @click="sortTitles('release')">За релізером</a>
</menu>
</button>
</nav>
<article class="no-padding" v-for="title in titles">
<div class="grid">
<div class="s12 m6 l3">
<img class="responsive " :src=title.image>
</div> </div>
<div class="s9"> </form>
<div class="padding">
<h5 class="primary-text">{{ title.torrent_name }} ({{ title.codename }})</h5>
<hr class="medium"> <nav>
<a class="chip" @click="updateByCodename('')">
<i id="update_all_icon">done_all</i>
<span>Завантажити нові серії</span>
</a>
<a class="chip" @click="fetchTorrents">
<i>restart_alt</i>
<span>Оновити список</span>
</a>
<div class="max"></div>
<button class="round fill">
<span>Сортування</span>
<i>arrow_drop_down</i>
<menu id="sort-menu">
<a @click="sortTitles('name')">За назвою</a>
<a @click="sortTitles('date')">За датою</a>
<a @click="sortTitles('release')">За релізером</a>
</menu>
</button>
</nav>
<div> <article class="no-padding" v-for="title in titles">
<a class="chip no-margin"><i>route</i><span>{{ title.download_dir }}</span></a> <div class="grid">
<a class="chip no-margin"><i>signature</i><span>{{ title.release_group }}</span></a> <div class="s12 m6 l3">
<a class="chip no-margin"><i>calendar_month</i><span>{{ title.publish_date }}</span></a> <img class="responsive " :src=title.image>
<a class="chip no-margin"><i>tag</i><span>{{ title.hash }}</span></a> </div>
</div> <div class="s9">
<div class="padding">
<h5 class="primary-text">{{ title.torrent_name }} ({{ title.codename }})</h5>
<hr class="large"> <hr class="medium">
<div> <div>
<a class="chip primary-border no-margin" :href="'https://toloka.to/' + title.guid"> <a class="chip no-margin"><i>route</i><span>{{ title.download_dir }}</span></a>
<i>link</i> <a class="chip no-margin"><i>signature</i><span>{{ title.release_group }}</span></a>
<span>Посилання</span> <a class="chip no-margin"><i>calendar_month</i><span>{{ title.publish_date }}</span></a>
</a> <a class="chip no-margin"><i>tag</i><span>{{ title.hash }}</span></a>
<a class="chip green-border no-margin" @click="updateByCodename(title.codename)"> </div>
<i>update</i>
<span>Оновити</span> <hr class="large">
</a>
<a class="chip amber-border no-margin" @click="editByCodename(title.codename)"> <div>
<i>edit</i> <a class="chip primary-border no-margin" :href="'https://toloka.to/' + title.guid">
<span>Редагувати</span> <i>link</i>
</a> <span>Посилання</span>
<a class="chip red-border no-margin" @click="deleteByCodename(title.codename)"> </a>
<i>delete</i> <a class="chip green-border no-margin" @click="updateByCodename(title.codename)">
<span>Видалити</span> <i>update</i>
</a> <span>Оновити</span>
</a>
<a class="chip amber-border no-margin" @click="editByCodename(title.codename)">
<i>edit</i>
<span>Редагувати</span>
</a>
<a class="chip red-border no-margin" @click="deleteByCodename(title.codename)">
<i>delete</i>
<span>Видалити</span>
</a>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </article>
</article> </main>
<main class="responsive middle-align center-align" v-else>
<progress class="circle extra"></progress>
</main>
<dialog :class="{ 'active': isUpdated }"> <dialog :class="{ 'active': isUpdated }">
<h5 class="primary-text">{{ update.response_code }}</h5> <h5 class="primary-text">{{ update.response_code }}</h5>

2
frontend/src/pages/settings/index.vue
View file

@ -20,7 +20,7 @@
<article class="secondary-text"> <article class="secondary-text">
<a class="row wave"><i>title</i> Toloka2Web v2 Vue Version</a> <a class="row wave"><i>title</i> Toloka2Web v2 Vue Version</a>
<hr> <hr>
<a class="row wave"><i>conversion_path</i> v1.0.3</a> <a class="row wave"><i>conversion_path</i> v1.0.4</a>
</article> </article>
</template> </template>