You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
100 lines
2.8 KiB
100 lines
2.8 KiB
import React from "react";
|
|
import ReactDOM from "react-dom";
|
|
import MainPage from "..//../pages/main";
|
|
import "./style.css";
|
|
class FullCard extends React.Component {
|
|
ui = {
|
|
name: "Имя",
|
|
category: "Категория:",
|
|
versions: "Доступные версии",
|
|
uses: " USE:",
|
|
decription: "Описание:",
|
|
site: "Сайт:",
|
|
button: {
|
|
text: "Установить"
|
|
}
|
|
};
|
|
toBack() {
|
|
ReactDOM.render(
|
|
<MainPage icons={this.props.icons} rec={this.props.PropMain} />,
|
|
document.getElementById("HomePage")
|
|
);
|
|
}
|
|
checkVersion(item) {
|
|
console.log(item.split("[U]")[1] === "");
|
|
if (item.split("[U]")[1] === "") {
|
|
return (
|
|
<li
|
|
key={item}
|
|
id={item}
|
|
style={{ background: "green", color: "#FFF", marginLeft: "5px" }}
|
|
>
|
|
{item.split("[U]")[0]}
|
|
</li>
|
|
);
|
|
} else {
|
|
return (
|
|
<li
|
|
key={item}
|
|
id={item}
|
|
style={{ background: "#F00", color: "#FFF", marginLeft: "5px" }}
|
|
>
|
|
{item.split("[M]")[0]}
|
|
</li>
|
|
);
|
|
}
|
|
}
|
|
render() {
|
|
return (
|
|
<div className="fullCard">
|
|
<div style={{ padding: "20px" }} onClick={() => this.toBack()}>
|
|
BaCk
|
|
</div>
|
|
|
|
<div className=" sCard">
|
|
<h1 className="title">{this.props.PackageName.Name.split("/")[1]}</h1>
|
|
<hr />
|
|
<img
|
|
src={this.props.icons[this.props.PackageName.Name.split("/")[1]]}
|
|
style={{ width: "128px", height: "128px" }}
|
|
/>
|
|
<div style={{}}>
|
|
<span>
|
|
{" "}
|
|
<b>{this.ui.category}</b>{" "}
|
|
{this.props.PackageName.Name.split("/")[0]}
|
|
</span>
|
|
<ul className="cVer">
|
|
<b>{this.ui.versions}</b>
|
|
{this.props.PackageName.version.map((v) => this.checkVersion(v))}
|
|
</ul>
|
|
<div className="sUse">
|
|
<b>{this.ui.uses}</b>
|
|
{this.props.PackageName.USE.map((u) => (
|
|
<span key={u} id={u}>
|
|
{u}
|
|
</span>
|
|
))}
|
|
</div>
|
|
<div> </div>
|
|
|
|
<p>
|
|
<b>{this.ui.decription}</b> {this.props.PackageName.Description}
|
|
</p>
|
|
<a href={this.props.PackageName.Home_page}>{this.ui.site} </a>
|
|
|
|
<div className="Btm">
|
|
<strong>
|
|
<span className="btn right" id={this.props.PackageName.Name}>
|
|
{this.ui.button.text}
|
|
</span>
|
|
</strong>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
export default FullCard;
|