Додан моніторінг застосунку

Додани веб компоненти карточок територій та повідомлень
This commit is contained in:
2025-12-08 00:14:56 +02:00
parent e41590546c
commit 85483b85bb
206 changed files with 2370 additions and 595 deletions

View File

@@ -27,8 +27,8 @@ const Home = {
return Home.personal.house.list;
},
setHTML: async () => {
const list = Home.personal.house.list.length > 0
? Home.personal.house.list
const list = Home.personal.house.list.length > 0
? Home.personal.house.list
: await Home.personal.house.loadAPI();
if (USER.possibilities.can_view_territory && list.length)
@@ -53,8 +53,8 @@ const Home = {
return Home.personal.homestead.list;
},
setHTML: async () => {
const list = Home.personal.homestead.list.length > 0
? Home.personal.homestead.list
const list = Home.personal.homestead.list.length > 0
? Home.personal.homestead.list
: await Home.personal.homestead.loadAPI();
if (USER.possibilities.can_view_territory && list.length)
@@ -81,8 +81,8 @@ const Home = {
return Home.group.house.list;
},
setHTML: async () => {
const list = Home.group.house.list.length > 0
? Home.group.house.list
const list = Home.group.house.list.length > 0
? Home.group.house.list
: await Home.group.house.loadAPI();
if (USER.possibilities.can_view_territory && list.length)
@@ -107,8 +107,8 @@ const Home = {
return Home.group.homestead.list;
},
setHTML: async () => {
const list = Home.group.homestead.list.length > 0
? Home.group.homestead.list
const list = Home.group.homestead.list.length > 0
? Home.group.homestead.list
: await Home.group.homestead.loadAPI();
if (USER.possibilities.can_view_territory && list.length)
@@ -124,18 +124,10 @@ const Home = {
const fragment = document.createDocumentFragment();
for (const el of list) {
const card = document.createElement("div");
card.className = "card";
card.innerHTML = `
<i style="background-image: url(${CONFIG.web}cards/${type}/${type === "house" ? "T" : "H"}${el.id}.webp);"></i>
<div class="contents">
<div class="info">
<div><p>${el.title} ${el.number}</p></div>
</div>
</div>
<a href="/territory/card/${type}/${el.id}" data-route></a>
`;
const card = document.createElement('app-territory-card');
card.image = `${CONFIG.web}cards/${type}/${type === "house" ? "T" : "H"}${el.id}.webp`;
card.address = `${el.title} ${el.number})`;
card.link = `/territory/card/${type}/${el.id}`;
fragment.appendChild(card);
}

View File

@@ -102,123 +102,6 @@
overflow-y: auto;
align-items: flex-start;
transition: .3s ease;
}
.page-home .card {
position: relative;
width: 300px;
height: 200px;
background-color: var(--ColorThemes2);
margin: 10px;
overflow: hidden;
cursor: pointer;
border-radius: calc(var(--border-radius) - 5px);
}
@media (max-width: 2300px) {
.page-home .card {
width: calc((100% / 5) - 30px);
}
}
@media (max-width: 1960px) {
.page-home .card {
width: calc((100% / 4) - 30px);
}
}
@media (max-width: 1640px) {
.page-home .card {
width: calc((100% / 3) - 30px);
}
}
@media (max-width: 1280px) {
.page-home .card {
width: calc((100% / 2) - 30px);
}
}
@media (max-width: 650px) {
.page-home .card {
width: 100%;
}
}
@media(hover: hover) {
.page-home .card:hover {
opacity: 0.8;
}
}
.page-home .card>i {
position: absolute;
width: 100%;
height: 100%;
object-fit: cover;
z-index: 1;
filter: blur(2px);
/* background-repeat: round; */
background-size: cover;
background-position: center;
background-color: var(--PrimaryColor);
border-radius: calc(var(--border-radius) - 5px);
}
.page-home .card>a {
position: absolute;
width: 100%;
height: 100%;
z-index: 10;
}
.page-home .contents {
position: absolute;
z-index: 2;
background: rgb(64 64 64 / 0.7);
width: 100%;
height: 100%;
font-size: 40px;
font-weight: 500;
color: #fff;
display: flex;
flex-direction: column;
align-items: stretch;
justify-content: space-between;
border-radius: calc(var(--border-radius) - 5px);
}
.page-home .info {
margin: 10px;
}
.page-home .info>div {
width: 100%;
height: 35px;
display: flex;
background: var(--ColorThemes0);
align-items: center;
justify-content: center;
font-size: var(--FontSize1);
color: var(--ColorThemes3);
border-radius: calc(var(--border-radius) - 5px - 4px);
position: relative;
overflow: hidden;
}
.page-home .info>div>span {
color: var(--ColorThemes3);
font-size: var(--FontSize3);
font-weight: 300;
z-index: 2;
}
.page-home .info>div>p {
color: var(--ColorThemes3);
font-size: var(--FontSize3);
font-weight: 400;
gap: 20px;
padding: 10px;
z-index: 2;
width: 100%;
text-align: center;
}