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

update

Browse Source
This commit is contained in:
HAM!DREZA
2024-06-17 09:09:00 +03:30
parent 2886e999f1
commit 3f9e0d7615
11 changed files with 666 additions and 234 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/account/index.vue
+133 -63
View File
@@ -1,13 +1,16 @@
<template>
<div class="flex flex-col md:flex-row justify-between w-full thin pb-[25vw] md:pb-0">
<div
class="flex flex-col md:flex-row justify-between w-full thin pb-[25vw] md:pb-0"
>
<div class="w-full md:w-[36.667vw]">
<div class="grid grid-cols-2 gap-3">
<div
class="h-[18.974vw] md:h-[5.469vw] bg-[#EFFAFE] rounded-[3.846vw] md:rounded-[0.781vw] flex items-center justify-between px-[2.051vw] md:px-[1.25vw]"
>
<div class="flex flex-col leading-[6.154vw] md:leading-[1.667vw]">
<p class="text-[3.59vw] md:text-[1.055vw] font-[600] text-[#383E43]">
<p
class="text-[3.59vw] md:text-[1.055vw] font-[600] text-[#383E43]"
>
1 روز
</p>
<p
@@ -78,13 +81,15 @@
</svg>
</div>
<div
<nuxt-link to="/account/my-courses"
class="h-[18.974vw] md:h-[5.469vw] bg-[#F9F6FF] rounded-[3.846vw] md:rounded-[0.781vw] flex items-center justify-between px-2 md:px-6"
>
<div class="flex flex-col leading-[6.154vw] md:leading-[1.667vw]">
<p class="text-[3.59vw] md:text-[1.055vw] font-[600] text-[#383E43]">
3 دوره
<p
class="text-[3.59vw] md:text-[1.055vw] font-[600] text-[#383E43]"
>
{{ myCourses.data.value.course.length }}
دوره
</p>
<p
class="text-[2.836vw] md:text-[0.741vw] font-[400] text-[#383E43]"
@@ -120,13 +125,16 @@
stroke-linejoin="round"
/>
</svg>
</div>
<div
</nuxt-link>
<nuxt-link to="/account/tickets"
class="h-[18.974vw] md:h-[5.469vw] bg-[#FFF7F4] rounded-[3.846vw] md:rounded-[0.781vw] flex items-center justify-between px-2 md:px-6"
>
<div class="flex flex-col leading-[6.154vw] md:leading-[1.667vw]">
<p class="text-[3.59vw] md:text-[1.055vw] font-[600] text-[#383E43]">
1 تیکت
<p
class="text-[3.59vw] md:text-[1.055vw] font-[600] text-[#383E43]"
>
{{ tickets.data.value.length }}
تیکت
</p>
<p
class="text-[2.836vw] md:text-[0.741vw] font-[400] text-[#383E43]"
@@ -134,20 +142,38 @@
تیکت ها
</p>
</div>
<svg
class="h-[7.692vw] md:h-[2.344vw] w-[7.692vw] md:w-[2.344vw]"
viewBox="0 0 45 45" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M36.5625 23.4375C36.5625 20.85 38.6625 18.75 41.25 18.75V16.875C41.25 9.375 39.375 7.5 31.875 7.5H13.125C5.625 7.5 3.75 9.375 3.75 16.875V17.8125C6.3375 17.8125 8.4375 19.9125 8.4375 22.5C8.4375 25.0875 6.3375 27.1875 3.75 27.1875V28.125C3.75 35.625 5.625 37.5 13.125 37.5H31.875C39.375 37.5 41.25 35.625 41.25 28.125C38.6625 28.125 36.5625 26.025 36.5625 23.4375Z" stroke="#FFA766" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M18.75 7.5L18.75 37.5" stroke="#FFA766" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" stroke-dasharray="5 5"/>
</svg>
</div>
<div
<svg
class="h-[7.692vw] md:h-[2.344vw] w-[7.692vw] md:w-[2.344vw]"
viewBox="0 0 45 45"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M36.5625 23.4375C36.5625 20.85 38.6625 18.75 41.25 18.75V16.875C41.25 9.375 39.375 7.5 31.875 7.5H13.125C5.625 7.5 3.75 9.375 3.75 16.875V17.8125C6.3375 17.8125 8.4375 19.9125 8.4375 22.5C8.4375 25.0875 6.3375 27.1875 3.75 27.1875V28.125C3.75 35.625 5.625 37.5 13.125 37.5H31.875C39.375 37.5 41.25 35.625 41.25 28.125C38.6625 28.125 36.5625 26.025 36.5625 23.4375Z"
stroke="#FFA766"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M18.75 7.5L18.75 37.5"
stroke="#FFA766"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
stroke-dasharray="5 5"
/>
</svg>
</nuxt-link>
<nuxt-link to="/account/wallet"
class="h-[18.974vw] md:h-[5.469vw] bg-[#FEEFF6] rounded-[3.846vw] md:rounded-[0.781vw] flex items-center justify-between px-2 md:px-[1.25vw]"
>
<div class="flex flex-col leading-[6.154vw] md:leading-[1.667vw]">
<p class="text-[3.59vw] md:text-[1.055vw] font-[600] text-[#383E43]">
0 تومان
<p
class="text-[3.59vw] md:text-[1.055vw] font-[600] text-[#383E43]"
>
{{ numberFormat(balance.data.value) }}
تومان
</p>
<p
class="text-[2.836vw] md:text-[0.741vw] font-[400] text-[#383E43]"
@@ -156,7 +182,7 @@
</p>
</div>
<svg
class="h-[7.692vw] md:h-[2.344vw] w-[7.692vw] md:w-[2.344vw]"
class="h-[7.692vw] md:h-[2.344vw] w-[7.692vw] md:w-[2.344vw]"
viewBox="0 0 45 45"
fill="none"
xmlns="http://www.w3.org/2000/svg"
@@ -190,7 +216,7 @@
stroke-linejoin="round"
/>
</svg>
</div>
</nuxt-link>
</div>
<div class="lastTickets mt-[20vw] md:mt-[2.917vw]">
@@ -199,10 +225,13 @@
<p class="text-[4.038vw] md:text-[1.055vw] font-[500]">
آخرین تیکت ها
</p>
<p class="text-[2.836vw] md:text-[0.741vw] flex">
<nuxt-link
to="/account/tickets"
class="text-[2.836vw] md:text-[0.741vw] flex"
>
همه ی تیکت ها
<svg
class="ms-[2.051vw] w-[4.103vw] md:w-[1.042vw]"
class="ms-[1.051vw] w-[4.103vw] md:w-[1.042vw]"
viewBox="0 0 20 21"
fill="none"
xmlns="http://www.w3.org/2000/svg"
@@ -224,9 +253,27 @@
stroke-linejoin="round"
/>
</svg>
</p>
</nuxt-link>
</div>
<div class="flex justify-between items-center mt-[1.25vw] px-2">
<div
v-for="ticket in lastTickets"
:key="ticket.id"
class="flex justify-between items-center mt-[1.25vw] px-2"
>
<p class="text-[3.19vw] md:text-[0.833vw] text-[#000]">
{{ ticket.subject }}
</p>
<p class="text-[3.19vw] md:text-[0.833vw] text-[#878787]">
{{ jDate(ticket.createdAt) }}
</p>
<nuxt-link
to="/account/tickets"
class="flex justify-center items-center text-[2.518vw] md:text-[0.658vw] px-[2.564vw] md:px-[0.417vw] py-[2.051vw] md:py-[0.521vw] text-[#2ED573] bg-[#2ED5731A] rounded-[2.051vw] md:rounded-[0.521vw]"
>
مشاهده
</nuxt-link>
</div>
<!-- <div class="flex justify-between items-center mt-[0.833vw] px-2">
<p class="text-[3.19vw] md:text-[0.833vw] text-[#000]">
طراحی سایت
</p>
@@ -238,20 +285,7 @@
>
پاسخ داده شده
</p>
</div>
<div class="flex justify-between items-center mt-[0.833vw] px-2">
<p class="text-[3.19vw] md:text-[0.833vw] text-[#000]">
طراحی سایت
</p>
<p class="text-[3.19vw] md:text-[0.833vw] text-[#878787]">
1402/09/12
</p>
<p
class="flex justify-center items-center text-[2.518vw] md:text-[0.658vw] px-[2.564vw] md:px-[0.417vw] py-[2.051vw] md:py-[0.521vw] text-[#2ED573] bg-[#2ED5731A] rounded-[2.051vw] md:rounded-[0.521vw]"
>
پاسخ داده شده
</p>
</div>
</div> -->
</div>
</div>
@@ -261,7 +295,10 @@
<p class="text-[4.038vw] md:text-[1.055vw] font-[500]">
آخرین دوره ها
</p>
<p class="text-[2.836vw] md:text-[0.741vw] flex">
<nuxt-link
to="/account/my-courses"
class="text-[2.836vw] md:text-[0.741vw] flex"
>
همه ی دوره های ثبت نام شده
<svg
class="ms-2 w-[4.103vw] md:w-[1.042vw] h-[4.103vw] md:h-[1.042vw]"
@@ -286,12 +323,16 @@
stroke-linejoin="round"
/>
</svg>
</p>
</nuxt-link>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 mt-[3vw] md:mt-[1.25vw] gap-[3vw] md:gap-[1.25vw]">
<ProgressCard />
<ProgressCard />
<div
class="grid grid-cols-1 md:grid-cols-2 mt-[3vw] md:mt-[1.25vw] gap-[3vw] md:gap-[1.25vw]"
>
<div v-for="item in lastCourses" :key="item.id">
<ProgressCard :item="item" />
</div>
</div>
</div>
</div>
@@ -302,9 +343,13 @@
class="bg-white mb-[1.25vw] pinkShadow p-[5vw] md:p-[1.25vw] flex flex-col profile w-full md:w-[23.385vw] h-[108.872vw] md:h-[26.25vw] rounded-[3.846vw] md:rounded-[0.781vw] space-y-[7vw] md:space-y-[1.5vw]"
>
<div class="flex justify-between items-center">
<p class="text-[4.038vw] md:text-[0.938vw] text-[#383E43] font-semibold">پروفایل</p>
<p
class="text-[4.038vw] md:text-[0.938vw] text-[#383E43] font-semibold"
>
پروفایل
</p>
<svg
class="h-[6.154vw] md:h-[1.406vw] w-[6.154vw] md:w-[1.406vw]"
class="h-[6.154vw] md:h-[1.406vw] w-[6.154vw] md:w-[1.406vw]"
viewBox="0 0 27 27"
fill="none"
xmlns="http://www.w3.org/2000/svg"
@@ -332,10 +377,14 @@
class="h-[27.949vw] md:h-[7.24vw] w-[27.949vw] md:w-[7.24vw] rounded-full"
alt=""
/>
<p class="text-[4.038vw] md:text-[0.938vw] text-[#383E43] font-semibold mt-[1.25vw]">
<p
class="text-[4.038vw] md:text-[0.938vw] text-[#383E43] font-semibold mt-[1.25vw]"
>
علی مصلحی
</p>
<p class="font-[400] text-[3.19vw] md:text-[0.833vw] text-[#878787] mt-[0.417vw]">
<p
class="font-[400] text-[3.19vw] md:text-[0.833vw] text-[#878787] mt-[0.417vw]"
>
alimoslehi@
</p>
</div>
@@ -356,7 +405,10 @@
stroke-linejoin="round"
/>
</svg>
<span class="text-[#383E43] text-[4.038vw] md:text-[0.938vw] font-[600]">آذر</span>
<span
class="text-[#383E43] text-[4.038vw] md:text-[0.938vw] font-[600]"
>آذر</span
>
<svg
class="h-[4.615vw] md:h-[1.25vw] w-[4.615vw] md:w-[1.25vw]"
viewBox="0 0 24 24"
@@ -373,14 +425,18 @@
/>
</svg>
</div>
<div class="grid grid-cols-5 md:grid-cols-7 mt-[0.833vw] justify-center">
<div
class="grid grid-cols-5 md:grid-cols-7 mt-[0.833vw] justify-center"
>
<div class="hidden md:flex flex-col items-center">
<p
class="text-[4.038vw] md:text-[0.938vw] w-[9.744vw] md:w-[1.979vw] h-[13.59vw] md:h-[1.927vw] font-[600] flex justify-center items-center"
>
18
</p>
<p class="text-[2.836vw] md:text-[0.585vw] font-[500] text-[#878787] pt-[0.833vw]">
<p
class="text-[2.836vw] md:text-[0.585vw] font-[500] text-[#878787] pt-[0.833vw]"
>
سه شنبه
</p>
</div>
@@ -390,7 +446,9 @@
>
17
</p>
<p class="text-[2.836vw] md:text-[0.585vw] font-[500] text-[#878787] pt-[0.833vw]">
<p
class="text-[2.836vw] md:text-[0.585vw] font-[500] text-[#878787] pt-[0.833vw]"
>
دو شنبه
</p>
</div>
@@ -400,7 +458,9 @@
>
16
</p>
<p class="text-[2.836vw] md:text-[0.585vw] font-[500] text-[#878787] pt-[0.833vw]">
<p
class="text-[2.836vw] md:text-[0.585vw] font-[500] text-[#878787] pt-[0.833vw]"
>
یک شنبه
</p>
</div>
@@ -424,7 +484,9 @@
>
14
</p>
<p class="text-[2.836vw] md:text-[0.585vw] font-[500] text-[#878787] pt-[0.833vw]">
<p
class="text-[2.836vw] md:text-[0.585vw] font-[500] text-[#878787] pt-[0.833vw]"
>
جمعه
</p>
</div>
@@ -434,7 +496,9 @@
>
13
</p>
<p class="text-[2.836vw] md:text-[0.585vw] font-[500] text-[#878787] pt-[0.833vw]">
<p
class="text-[2.836vw] md:text-[0.585vw] font-[500] text-[#878787] pt-[0.833vw]"
>
پنج شنبه
</p>
</div>
@@ -444,7 +508,9 @@
>
12
</p>
<p class="text-[2.836vw] md:text-[0.585vw] font-[500] text-[#878787] pt-[0.833vw]">
<p
class="text-[2.836vw] md:text-[0.585vw] font-[500] text-[#878787] pt-[0.833vw]"
>
چهار شنبه
</p>
</div>
@@ -456,15 +522,20 @@
<script setup>
const tickets = await useFetch("/api/ticket");
const lastTickets = tickets.data.value.slice(-2);
const myCourses = await useFetch("/api/auth/me");
const lastCourses = myCourses.data.value.course.slice(-2);
const balance = await useFetch("/api/user/balance");
console.log(balance.data);
definePageMeta({
middleware: 'auth',
})
middleware: "auth",
});
</script>
<style scoped>
.activeDay {
background: linear-gradient(0deg, #0e8789 0%, rgba(34, 164, 166, 0.8) 100%);
width: 2.917vw;
@@ -482,5 +553,4 @@ definePageMeta({
padding-top: 3vw;
}
}
</style>