anasayfaya takvim ekleme deneme.
This commit is contained in:
+3
-2
@@ -17,14 +17,15 @@ async function render() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
let currentBg =
|
let currentBg =
|
||||||
localStorage.getItem("selected_bg") ||
|
user.selected_bg ||
|
||||||
"https://images.unsplash.com/photo-1618005182384-a83a8bd57fbe?q=80&w=1920";
|
"https://images.unsplash.com/photo-1618005182384-a83a8bd57fbe?q=80&w=1920";
|
||||||
|
|
||||||
// Sayfayı Yükle
|
// Sayfayı Yükle
|
||||||
let currentPage;
|
let currentPage;
|
||||||
if (activeTab === "settings") {
|
if (activeTab === "settings") {
|
||||||
currentPage = await renderSettings(pb, currentBg, (newBg) => {
|
currentPage = await renderSettings(pb, currentBg, (newBg) => {
|
||||||
localStorage.setItem("selected_bg", newBg);
|
// Veritabanı güncellendiğinde yerel kullanıcı modelini tazeleyip render ediyoruz
|
||||||
|
pb.authStore.model.selected_bg = newBg;
|
||||||
render();
|
render();
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
|
|||||||
+13
-12
@@ -15,19 +15,11 @@ export async function renderSettings(pb, currentBg, onBgSelect) {
|
|||||||
const html = `
|
const html = `
|
||||||
<div class="bg-slate-900/60 backdrop-blur-2xl border border-white/10 p-8 rounded-3xl shadow-2xl max-w-4xl w-full h-[80vh] flex flex-col">
|
<div class="bg-slate-900/60 backdrop-blur-2xl border border-white/10 p-8 rounded-3xl shadow-2xl max-w-4xl w-full h-[80vh] flex flex-col">
|
||||||
<h2 class="text-2xl font-bold text-white mb-2">⚙️ Sistem Ayarları</h2>
|
<h2 class="text-2xl font-bold text-white mb-2">⚙️ Sistem Ayarları</h2>
|
||||||
<p class="text-slate-400 text-sm mb-6">PocketBase sunucundaki duvar kağıtlarından birini seçerek arka planı özelleştir.</p>
|
<p class="text-slate-400 text-sm mb-6">Seçtiğin duvar kağıdı doğrudan PocketBase hesabına kaydedilir.</p>
|
||||||
|
|
||||||
<div class="flex-1 overflow-y-auto pr-2">
|
<div class="flex-1 overflow-y-auto pr-2">
|
||||||
<h3 class="text-sm font-semibold text-slate-300 mb-4">Arka Plan Galerisi (${bgList.length})</h3>
|
<h3 class="text-sm font-semibold text-slate-300 mb-4">Arka Plan Galerisi (${bgList.length})</h3>
|
||||||
|
|
||||||
${
|
|
||||||
bgList.length === 0
|
|
||||||
? `
|
|
||||||
<div class="text-center py-12 border border-dashed border-white/10 rounded-2xl text-slate-500">
|
|
||||||
PocketBase 'backgrounds' koleksiyonunda henüz görsel bulunamadı.
|
|
||||||
</div>
|
|
||||||
`
|
|
||||||
: `
|
|
||||||
<div class="grid grid-cols-2 md:grid-cols-3 gap-4">
|
<div class="grid grid-cols-2 md:grid-cols-3 gap-4">
|
||||||
${bgList
|
${bgList
|
||||||
.map(
|
.map(
|
||||||
@@ -42,8 +34,6 @@ export async function renderSettings(pb, currentBg, onBgSelect) {
|
|||||||
)
|
)
|
||||||
.join("")}
|
.join("")}
|
||||||
</div>
|
</div>
|
||||||
`
|
|
||||||
}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
@@ -52,9 +42,20 @@ export async function renderSettings(pb, currentBg, onBgSelect) {
|
|||||||
html,
|
html,
|
||||||
initEvents: (container) => {
|
initEvents: (container) => {
|
||||||
container.querySelectorAll(".bg-card").forEach((card) => {
|
container.querySelectorAll(".bg-card").forEach((card) => {
|
||||||
card.addEventListener("click", () => {
|
card.addEventListener("click", async () => {
|
||||||
const selectedUrl = card.getAttribute("data-url");
|
const selectedUrl = card.getAttribute("data-url");
|
||||||
|
|
||||||
|
try {
|
||||||
|
// PocketBase'deki aktif kullanıcının 'selected_bg' alanını güncelliyoruz
|
||||||
|
await pb.collection("users").update(pb.authStore.model.id, {
|
||||||
|
selected_bg: selectedUrl,
|
||||||
|
});
|
||||||
|
|
||||||
|
// Ekranı yeni ayarla güncelle
|
||||||
onBgSelect(selectedUrl);
|
onBgSelect(selectedUrl);
|
||||||
|
} catch (err) {
|
||||||
|
console.error("Ayar kaydedilemedi:", err);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|||||||
Reference in New Issue
Block a user