danak/dlearn-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

api / tickets

Browse Source
This commit is contained in:
HAM!DREZA
2024-05-29 22:31:05 +03:30
parent 1e132b97db
commit fd5b06c2d7
20 changed files with 810 additions and 179 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/courses-page/Courses-list.vue
+15 -51
View File
@@ -9,8 +9,7 @@
class="text-[0.741vw] text-[#383E43] flex items-center gap-[0.5vw] pb-[0.681vw]"
>
<svg
class="w-[6.154vw] md:w-[1.25vw] h-[6.154vw] md:h-[1.302vw]"
class="w-[6.154vw] md:w-[1.25vw] h-[6.154vw] md:h-[1.302vw]"
viewBox="0 0 24 25"
fill="none"
xmlns="http://www.w3.org/2000/svg"
@@ -42,9 +41,7 @@
>
</span>
<ul class="gap-x-[1vw] items-center hidden md:flex">
<li
class="relative pb-[0.681vw] text-primaryGreen active"
>
<li class="relative pb-[0.681vw] text-primaryGreen active">
همه دوره ها
</li>
<li class="pb-[0.681vw]">دوره های رایگان</li>
@@ -52,50 +49,20 @@
<li class="pb-[0.681vw]">گران ترین</li>
</ul>
</div>
<div v-if="loading"
<div
class="mt-[4.051vw] md:mt-[2.1vw] grid gap-[4vw] md:gap-[1.25vw] grid-cols-1 md:grid-cols-4"
v-for="(course, index) in data.data.value"
:key="index"
>
<Card />
<Card />
<Card />
<Card />
<Card />
<Card />
<Card />
<Card />
<Card />
<Card />
<Card />
<Card />
<Card />
<Card />
<Card />
<Card />
<Card />
</div>
<div v-else
class="mt-[4.051vw] md:mt-[2.1vw] grid gap-[4vw] md:gap-[1.25vw] grid-cols-1 md:grid-cols-4"
>
<Loading />
<Loading />
<Loading />
<Loading />
<Loading />
<Loading />
<Loading />
<Loading />
<Loading />
<Loading />
<Loading />
<Loading />
</div>
<Card :course="course" />
</div>
</div>
</template>
<script setup>
// const pages = 17 / 16
// console.log(Math.ceil(pages));
const data = await useFetch("/api/course");
const openSortOptions = () => {
if (process.client) {
document
@@ -108,22 +75,19 @@ const openSortOptions = () => {
"brightness(90%)";
}
};
const loading = ref(false)
console.log(loading.value);
const loading = ref(false);
onMounted(() => {
setTimeout(() => {
loading.value = true
console.log(loading.value);
}, 5000);
})
loading.value = true;
}, 2000);
});
</script>
<style>
.active::before{
content: '';
.active::before {
content: "";
position: absolute;
background-color: #0D3F40;
background-color: #0d3f40;
width: 100%;
height: 0.01vw;
top: 2vw;