kayashov73/moovie-downloader
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

правки ошибок и внешнего вида

Browse Source
This commit is contained in:
Kayashov.SM
2025-09-10 23:14:49 +04:00
parent 39ec47c6d7
commit de8264d0e6
8 changed files with 77 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/components/CardCompact.js
View File

@@ -1,33 +1,23 @@
import React from 'react';
import {Card} from 'react-bootstrap';
const descriptionDraw = (text) => {
return (
<>
{text} <br/>
</>
)
}
const CardCompact = ({item}) => {
console.log(item);
const image = item?.images?.length > 0 ? item.images[0]?.remoteUrl : null;
const rating = item.ratings?.imdb?.value ?? null;
const status = (item.monitored || item.hasFile) ? (
item.hasFile ? "Статус: Загружен" : "Статус: Загружается"
) : null;
return (
<Card className="mb-3" style={{width: '18rem'}}>
{/*<Card.Img variant="top" src={item.remotePoster}/>*/}
<Card className="mb-auto" style={{width: '18rem'}}>
<Card.Img variant="top" src={image}/>
<Card.Body>
<Card.Title>{item.title}</Card.Title>
<Card.Text>
{descriptionDraw(`Год: ${item.year}`)}
{descriptionDraw(`Рейтинг: ${rating}`)}
{item.sizeOnDisk ? descriptionDraw(`Размер: ${(item.sizeOnDisk / 1000000000).toFixed(2)} Gb`) : null}
{status ? descriptionDraw(status) : null}
</Card.Text>
<Card.Body>
<div>Год: {item.year} <br/></div>
<div>Рейтинг: {rating} <br/></div>
{status ? <div>{status}<br/></div> : null}
{item.sizeOnDisk ? <div>Размер: {(item.sizeOnDisk / 1000000000).toFixed(2)} Gb</div> : null}
</Card.Body>
</Card.Body>
</Card>
);

29
src/components/RecommendationModal.js
View File

@@ -2,6 +2,7 @@ import React, {useEffect, useState} from 'react';
import {Button, Col, Container, FormCheck, FormSelect, Modal, Row} from 'react-bootstrap';
import axios from "axios";
import {useToast} from "../hooks/useToast";
import {radarr} from "../contexts/client";
const movieMonitor = [
{
@@ -22,24 +23,18 @@ const RecommendationModal = ({show, handleClose, item, serial, handleSave}) => {
const {addToast} = useToast();
useEffect(() => {
axios.get(`${process.env.REACT_APP_RADARR_HOST}/api/v3/qualityprofile`,
{
headers: {
'X-Api-Key': `${process.env.REACT_APP_RADARR_API_KEY}`
}
})
radarr().get("api/v3/qualityprofile")
.then((r) => {
setMovieQuality(r.data)
})
.catch(console.error);
.catch((err) => addToast(err, 'danger'));
}, []);
const handleSubmit = () => {
const request = !serial ? createMovieRequest : null;
request()
.then(res => {
axios.post(`${process.env.REACT_APP_RADARR_HOST}/api/v3/movie`, res,
{headers: {'X-Api-Key': `${process.env.REACT_APP_RADARR_API_KEY}`}})
radarr().post("api/v3/movie", res)
.then(() => handleSave(item, serial))
.catch((err) => addToast(err, 'danger'));
})
@@ -47,11 +42,11 @@ const RecommendationModal = ({show, handleClose, item, serial, handleSave}) => {
}
const createMovieRequest = async () => {
if(!monitor) {
if (!monitor) {
// eslint-disable-next-line no-throw-literal
throw 'Проверьте пункт отслеживания';
}
if(!quality) {
if (!quality) {
// eslint-disable-next-line no-throw-literal
throw 'Необходимо указать качество';
}
@@ -64,18 +59,16 @@ const RecommendationModal = ({show, handleClose, item, serial, handleSave}) => {
monitor: monitor,
searchForMovie: true
}
const folders = await axios.get(`${process.env.REACT_APP_RADARR_HOST}/api/v3/rootFolder`,
{headers: {'X-Api-Key': `${process.env.REACT_APP_RADARR_API_KEY}`}});
const folders = await radarr().get("api/v3/rootFolder");
request.rootFolderPath = folders.data.find((d) => d.path.includes(film ? "film" : "mult")).path;
const tags = await axios.get(`${process.env.REACT_APP_RADARR_HOST}/api/v3/tag`,
{headers: {'X-Api-Key': `${process.env.REACT_APP_RADARR_API_KEY}`}});
const tags = await radarr().get("api/v3/tag");
request.tags = tags.data.filter((t) => t.label === (film ? "film" : "mult")).map((t) => t.id)
return request;
}
if(!item) {
if (!item) {
return null;
}
@@ -90,7 +83,7 @@ const RecommendationModal = ({show, handleClose, item, serial, handleSave}) => {
<Col sm={{span: 3}}>
<img width="100%" className='mb-3' src={item.remotePoster} alt={item.title}/>
</Col>
<div className="col-9 container text-center">
<Col className="col-9 container text-center">
<Row>
<div className="col">
<p>{item.overview}</p>
@@ -126,7 +119,7 @@ const RecommendationModal = ({show, handleClose, item, serial, handleSave}) => {
</FormSelect>
</Col>
</Row>
</div>
</Col>
</Row>
<Button variant={'primary'} onClick={() => handleSubmit()}>Скачать</Button>

16
src/components/SceletonCompact.js
View File

@@ -1,16 +0,0 @@
export function SceletonCompact() {
return (
<div className="card" aria-hidden="true" style={{width:'18rem', height: '30rem'}}>
<div className="card-img-top" style={{background: 'grey', width: '18rem', height: '30rem'}} />
<div className="card-body">
<h5 className="card-title placeholder-glow">
<span className="placeholder col-6"></span>
</h5>
<p className="card-text placeholder-glow">
<span className="placeholder col-8"></span>
<span className="placeholder col-8"></span>
</p>
</div>
</div>
)
}

18
src/components/SkeletonCompact.js Normal file
View File

@@ -0,0 +1,18 @@
import {Card, CardBody, CardImg, CardText, CardTitle, Placeholder} from "react-bootstrap";
export function SkeletonCompact() {
return (
<Card aria-hidden="true" style={{width: '18rem', height: '30rem'}}>
<CardImg className="card-img-top" style={{background: 'grey', width: '18rem', height: '30rem'}}/>
<CardBody>
<CardTitle className="placeholder-glow">
<Placeholder className="col-6"></Placeholder>
</CardTitle>
<CardText className="placeholder-glow">
<Placeholder className="col-8"></Placeholder>
<Placeholder className="col-8"></Placeholder>
</CardText>
</CardBody>
</Card>
)
}

23
src/contexts/client.js Normal file
View File

@@ -0,0 +1,23 @@
import axios from "axios";
const host = "192.168.1.100:30011";
// const host = "tracker.kayashov.keenetic.pro";
export const radarr = () => {
const res = axios;
// res.defaults.baseURL = `${window.location.protocol}//${host}/radarr/`;
res.defaults.baseURL = `${window.location.protocol}//${host}/`;
res.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
res.defaults.headers.common['X-Api-Key'] = process.env.REACT_APP_RADARR_API_KEY;
res.defaults.headers.common['Accept'] = 'application/json';
return res;
}
export const sonarr = () => {
const res = axios;
res.defaults.baseURL = `${window.location.protocol}//${host}/sonarr/`;
res.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
res.defaults.headers.common['X-Api-Key'] = process.env.REACT_APP_RADARR_API_KEY;
res.defaults.headers.common['Accept'] = 'application/json';
return res;
}

9
src/pages/HomePage.js
View File

@@ -1,9 +1,9 @@
import React, {useEffect, useState} from 'react';
import {Accordion, Badge, Col, Container, Row} from "react-bootstrap";
import CardCompact from "../components/CardCompact";
import axios from "axios";
import {useToast} from "../hooks/useToast";
import {SceletonCompact} from "../components/SceletonCompact";
import {SkeletonCompact} from "../components/SkeletonCompact";
import {radarr} from "../contexts/client";
const Home = () => {
const [loading, setLoading] = useState(false);
@@ -13,8 +13,7 @@ const Home = () => {
useEffect(() => {
setLoading(true);
axios.get(`${process.env.REACT_APP_RADARR_HOST}/api/v3/movie`,
{headers: {'X-Api-Key': process.env.REACT_APP_RADARR_API_KEY}})
radarr().get("api/v3/movie")
.then((r) => setMovies(r.data))
.catch((err) => addToast(err, 'alert'))
.finally(() => setLoading(false));
@@ -35,7 +34,7 @@ const Home = () => {
// Отображаем 10 скелетонов
Array.from({length: 10}, (_, index) => (
<Col key={`skeleton-${index}`}>
<SceletonCompact key={index} width={300} height={400}/>
<SkeletonCompact key={index} width={300} height={400}/>
</Col>
))
)

19
src/pages/RecommendationPage.js
View File

@@ -1,10 +1,10 @@
import React, {useEffect, useState} from 'react';
import axios from "axios";
import CardCompact from "../components/CardCompact";
import {SceletonCompact} from "../components/SceletonCompact";
import {SkeletonCompact} from "../components/SkeletonCompact";
import RecommendationModal from "../components/RecommendationModal";
import {Col, Container, Row} from "react-bootstrap";
import {useToast} from "../hooks/useToast";
import {radarr} from "../contexts/client";
export function Recommendation() {
const [recommendations, setRecommendations] = useState([]);
@@ -15,13 +15,9 @@ export function Recommendation() {
useEffect(() => {
setLoading(true);
axios.get(`${process.env.REACT_APP_RADARR_HOST}/api/v3/importlist/movie?includeRecommendations=true&includeTrending=true&includePopular=true`,
{
headers: {
'X-Api-Key': `${process.env.REACT_APP_RADARR_API_KEY}`
}
}).then((r) => setRecommendations(r.data))
.catch((err) => console.log(err))
radarr().get("api/v3/importlist/movie?includeRecommendations=true&includeTrending=true&includePopular=true")
.then((r) => setRecommendations(r.data))
.catch((err) => addToast(err, 'danger'))
.finally(() => setLoading(false));
}, []);
@@ -51,7 +47,7 @@ export function Recommendation() {
// Отображаем 10 скелетонов
Array.from({length: 10}, (_, index) => (
<Col key={`skeleton-${index}`}>
<SceletonCompact key={index} width={300} height={400}/>
<SkeletonCompact key={index} width={300} height={400}/>
</Col>
))
)
@@ -61,7 +57,8 @@ export function Recommendation() {
</Col>
))}
</Row>
<RecommendationModal show={modalView} handleClose={handleCloseModal} item={item} handleSave={handleDownload}/>
<RecommendationModal show={modalView} handleClose={handleCloseModal} item={item}
handleSave={handleDownload}/>
</Container>
);
}

16
src/pages/SearchPage.js
View File

@@ -1,9 +1,9 @@
import React, {useEffect, useMemo, useState} from 'react';
import axios from "axios";
import CardExtend from "../components/CardExtend";
import {Alert, Container, InputGroup, Row} from "react-bootstrap";
import RecommendationModal from "../components/RecommendationModal";
import {useToast} from "../hooks/useToast";
import {radarr} from "../contexts/client";
export function Search() {
const [query, setQuery] = useState('');
@@ -22,13 +22,7 @@ export function Search() {
return;
}
setLoadMovies(true);
axios.get(`${process.env.REACT_APP_RADARR_HOST}/api/v3/movie/lookup?term=${query}}`,
{
headers: {
// "Content-Type": "application/json",
'X-Api-Key': `${process.env.REACT_APP_RADARR_API_KEY}`
}
})
radarr().get(`api/v3/movie/lookup?term=${query}}`)
.then((r) => setResultMovies(r.data))
.catch((err) => setErrorMovies(err))
.finally(() => setLoadMovies(false));
@@ -89,7 +83,8 @@ export function Search() {
<div>
<h3>Результаты поиска</h3>
<Row>
{resultMovies.map(result => <CardExtend item={result} key={result.id} selectHandle={handleChange}/>)}
{resultMovies.map(result => <CardExtend item={result} key={result.id}
selectHandle={handleChange}/>)}
</Row>
</div>
)}
@@ -99,7 +94,8 @@ export function Search() {
Ничего не найдено
</Alert>
)}
<RecommendationModal item={selectItem} handleClose={handleCloseModal} show={showModal} serial={false} handleSave={handleSave}/>
<RecommendationModal item={selectItem} handleClose={handleCloseModal} show={showModal} serial={false}
handleSave={handleSave}/>
</Container>
);
}