Probindo/freekake_web
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

placing box content

Browse Source
This commit is contained in:
='fauz 2025-10-24 14:12:47 +07:00
parent 22224c8003
commit 82e6bc6087
6 changed files with 38 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/pages/Findwords.vue
View File

@ -14,10 +14,10 @@
<!-- Breadcrumb / Path --> <!-- Breadcrumb / Path -->
<div class="text-sm text-gray-600"> <div class="text-sm text-gray-600">
<span class="text-emerald-600 font-medium cursor-pointer hover:underline" @click="goEntertainment">Entertainment</span> <!-- <span class="text-emerald-600 font-medium cursor-pointer hover:underline" @click="goEntertainment">Entertainment</span>
<span class="mx-2">›</span> <span class="mx-2">›</span>
<span class="text-emerald-600 font-medium cursor-pointer hover:underline" @click="goBack">Mini Games</span> <span class="text-emerald-600 font-medium cursor-pointer hover:underline" @click="goBack">Mini Games</span>
<span class="mx-2">›</span> <span class="mx-2">›</span> -->
<span class="text-gray-700 font-semibold">Find Words</span> <span class="text-gray-700 font-semibold">Find Words</span>
</div> </div>
</div> </div>
@ -216,9 +216,9 @@ function resetGame() {
generateGrid(); generateGrid();
} }
function goEntertainment(){ // function goEntertainment(){
window.history.back('/entertainment'); // window.history.back('/entertainment');
} // }
function goBack(){ function goBack(){
window.history.back('/entertainment/mini-games'); window.history.back('/entertainment/mini-games');

4
src/pages/Flipcard.vue
View File

@ -14,10 +14,10 @@
<!-- Breadcrumb / Path --> <!-- Breadcrumb / Path -->
<div class="text-sm text-gray-600"> <div class="text-sm text-gray-600">
<span class="text-emerald-600 font-medium cursor-pointer hover:underline" @click="goEntertainment">Entertainment</span> <!-- <span class="text-emerald-600 font-medium cursor-pointer hover:underline" @click="goEntertainment">Entertainment</span>
<span class="mx-2">›</span> <span class="mx-2">›</span>
<span class="text-emerald-600 font-medium cursor-pointer hover:underline" @click="goBack">Mini Games</span> <span class="text-emerald-600 font-medium cursor-pointer hover:underline" @click="goBack">Mini Games</span>
<span class="mx-2">›</span> <span class="mx-2">›</span> -->
<span class="text-gray-700 font-semibold">Pasangan Gambar</span> <span class="text-gray-700 font-semibold">Pasangan Gambar</span>
</div> </div>
</div> </div>

13
src/pages/Home.vue
View File

@ -257,8 +257,8 @@
</div> </div>
<div v-else> <div v-else>
<div <div
class="w-full max-w-md flex flex-col items-center bg-white-grey py-[0px] mx-2.5 md:mx-5 class="w-full max-w-md flex flex-col items-center bg-white-grey py-[0px] mx-2.5 md:mx-1
transform transition-transform duration-300 hover:scale-105" transform transition-transform duration-300 hover:scale-105 ms-[-5px]"
> >
<div <div
class="relative rounded-3xl p-6 shadow-2xl-soft flex items-start gap-4 w-full py-[10px] my-[20px] overflow-hidden bg-white hover:scale-105" class="relative rounded-3xl p-6 shadow-2xl-soft flex items-start gap-4 w-full py-[10px] my-[20px] overflow-hidden bg-white hover:scale-105"
@ -279,7 +279,7 @@
<div class="flex-1 relative z-10"> <div class="flex-1 relative z-10">
<h2 class="text-xl font-bold text-gray-800">{{ 'Mission Draft' }}</h2> <h2 class="text-xl font-bold text-gray-800">{{ 'Mission Draft' }}</h2>
<p class="text-sm text-gray-600 mb-2">{{ '-----------------------------------------------------------' }}</p> <p class="text-sm text-gray-600 mb-2">{{ '-------------------------------------------' }}</p>
<p <p
class="text-xs font-semibold border-b pb-2 text-gray-500" class="text-xs font-semibold border-b pb-2 text-gray-500"
@ -513,8 +513,8 @@ export default {
const points = await getUserPoint(); const points = await getUserPoint();
console.log(points) console.log(points)
this.points = points.myPoints; this.points = points.myPoints;
this.totalTask = points.taskCount; this.totalTask = points.activeTaskCount;
this.totalDone = points.myTaskCount; this.totalDone = points.myActiveTaskCompleteCount;
}, },
async getMission() { async getMission() {
const res = await getMissions(); const res = await getMissions();
@ -559,13 +559,12 @@ export default {
} }
}, },
timeLeft3(dateValidFrom,dateValidTo, timeValidFrom, timeToValid) { timeLeft3(dateValidFrom,dateValidTo, timeValidFrom, timeToValid) {
console.log(dateValidFrom,timeValidFrom,timeValidFrom,timeToValid)
if (!dateValidFrom || !timeValidFrom || !dateValidFrom || !timeToValid) return "—"; if (!dateValidFrom || !timeValidFrom || !dateValidFrom || !timeToValid) return "—";
const validDate = new Date(`${dateValidFrom}T${timeValidFrom}`); const validDate = new Date(`${dateValidFrom}T${timeValidFrom}`);
const target = new Date(`${dateValidTo}T${timeToValid}`); const target = new Date(`${dateValidTo}T${timeToValid}`);
const diffMs = target - validDate; const diffMs = target - validDate;
console.log("Sisa Waktu:" + diffMs)
if (diffMs <= 0) return "Waktu habis"; if (diffMs <= 0) return "Waktu habis";
const totalSeconds = Math.floor(diffMs / 1000); const totalSeconds = Math.floor(diffMs / 1000);

10
src/pages/Pointhistory.vue
View File

@ -26,9 +26,9 @@
</div> </div>
<!-- Summary Card --> <!-- Summary Card -->
<div class="p-4 flex justify-center"> <div class="p-4 flex justify-center">
<div class="bg-gradient-to-b from-gray-400 to-slate-500 rounded-2xl p-6 text-center w-full max-w-sm shadow-lg backdrop-blur-md animate-[pulse_3s_infinite]"> <div class="bg-gradient-to-b from-green-100 to-green-200 bg-opacity-5 rounded-2xl p-6 text-center w-full max-w-sm shadow-lg backdrop-blur-md">
<p class="text-md text-black font-bold">Total Poin </p> <p class="text-md text-black font-bold">Total Poin </p>
<h2 class="text-4xl font-bold text-yellow-300">{{ myTotalPoint }}</h2> <h2 class="text-4xl font-bold text-yellow-300 animate-[pulse_3s_infinite]">{{ myTotalPoint }}</h2>
</div> </div>
</div> </div>
@ -51,12 +51,12 @@
<main class="flex-1 overflow-y-auto px-4 pb-6"> <main class="flex-1 overflow-y-auto px-4 pb-6">
<transition-group name="fade" tag="div" class="space-y-3 max-w-xl mx-auto"> <transition-group name="fade" tag="div" class="space-y-3 max-w-xl mx-auto">
<div <div
v-for="(entry, index) in filteredHistory" v-for="(entry) in filteredHistory"
:key="entry.id" :key="entry.id"
class="flex justify-between items-center bg-white bg-opacity-15 backdrop-blur-md rounded-xl p-4 shadow hover:bg-opacity-25 transition-all" class="flex justify-between items-center bg-white bg-opacity-15 backdrop-blur-md rounded-xl p-4 shadow hover:bg-opacity-25 transition-all"
> >
<div> <div>
<h3 class="font-semibold text-black">{{ entry.mission?.name || 'Unknown Mission'}} {{ index }}</h3> <h3 class="font-semibold text-black">{{ entry.mission?.name || 'Unknown Mission'}} </h3>
<p class="text-sm text-black">{{ entry.mission?.category }}</p> <p class="text-sm text-black">{{ entry.mission?.category }}</p>
<p class="text-xs text-black">{{ entry.completed_at }}</p> <p class="text-xs text-black">{{ entry.completed_at }}</p>
</div> </div>
@ -114,7 +114,7 @@ export default{
const filteredHistory = computed(() => { const filteredHistory = computed(() => {
if (selectedCategory.value === "Semua") return pointHistory.value; if (selectedCategory.value === "Semua") return pointHistory.value;
return pointHistory.value.filter( return pointHistory.value.filter(
e => e.category.toLowerCase() === selectedCategory.value.toLowerCase() e => e.mission?.category.toLowerCase() === selectedCategory.value.toLowerCase()
); );
}); });

10
src/pages/Wordspells.vue
View File

@ -10,10 +10,10 @@
<span class="font-semibold">Kembali</span> <span class="font-semibold">Kembali</span>
</button> </button>
<div class="text-sm text-gray-600"> <div class="text-sm text-gray-600">
<span class="text-emerald-600 font-medium cursor-pointer hover:underline" @click="goEntertainment">Entertainment</span> <!-- <span class="text-emerald-600 font-medium cursor-pointer hover:underline" @click="goEntertainment">Entertainment</span>
<span class="mx-2">›</span> <span class="mx-2">›</span>
<span class="text-emerald-600 font-medium cursor-pointer hover:underline" @click="goBack">Mini Games</span> <span class="text-emerald-600 font-medium cursor-pointer hover:underline" @click="goBack">Mini Games</span>
<span class="mx-2">›</span> <span class="mx-2">›</span> -->
<span class="text-gray-700 font-semibold">Temukan Kata</span> <span class="text-gray-700 font-semibold">Temukan Kata</span>
</div> </div>
</div> </div>
@ -255,9 +255,9 @@
initGame(); initGame();
} }
function goEntertainment(){ // function goEntertainment(){
window.history.back('/entertainment'); // window.history.back('/entertainment');
} // }
function goBack(){ function goBack(){
window.history.back('/entertainment/mini-games'); window.history.back('/entertainment/mini-games');

22
src/services/missions.js
View File

@ -27,7 +27,6 @@ export const getMissionLogs = async () => {
export const createMissionLog = async (data = {}) => { export const createMissionLog = async (data = {}) => {
const timestp = new Date().toISOString(); const timestp = new Date().toISOString();
console.log(data);
return await api.post('mission/mission-logs',{ return await api.post('mission/mission-logs',{
mission: data.mission, mission: data.mission,
user_id: data.user_id, user_id: data.user_id,
@ -52,7 +51,9 @@ export const getUserPoint = async() =>{
const user = auth.user const user = auth.user
const [missions, missionLogs] = await Promise.all([getMissions(), getMissionLogs()]); const [missions, missionLogs] = await Promise.all([getMissions(), getMissionLogs()]);
const userLogs = missionLogs.results.filter((mlog) => mlog.user_id === user.id); const userLogs = missionLogs.results.filter((mlog) => mlog.user_id === user.id);
const activeTask = missions.results.filter((mission) => mission.date_time_from_valid <= timestp && timestp <= mission.date_time_to_valid);
console.log("active missions:" + activeTask.length)
const combine = userLogs.map( const combine = userLogs.map(
log => { log => {
const missionDetail = missions.allMissions.find((mission) => mission.id === log.mission); const missionDetail = missions.allMissions.find((mission) => mission.id === log.mission);
@ -63,16 +64,23 @@ export const getUserPoint = async() =>{
} }
} }
); );
// all points
const timestp = new Date().toISOString();
const myPoints = combine.reduce((total, log) => total + log.point, 0); const myPoints = combine.reduce((total, log) => total + log.point, 0);
const activeMissions = missions.activeMissions || []; const mytaskActiveComplete = combine.filter((c) =>{
const taskCount = activeMissions.length; const inRange = c.mission.date_time_from_valid <= timestp && timestp <= c.date_time_to_valid
return inRange && c.status === 'completed'
});
return { return {
task: activeMissions, task: missions, // all missions
taskCount: taskCount, taskCount: missions.allMissions.length, // count all
activeTask: activeTask, // task active ()
activeTaskCount: activeTask.length, // count active
myTask: combine, myTask: combine,
myTaskCount: combine.length, myTaskCount: combine.length,
myPoints, myActiveTaskComplete: mytaskActiveComplete,// active mission
myActiveTaskCompleteCount: mytaskActiveComplete.length,
myPoints : myPoints,
}; };
} }