api / tickets
This commit is contained in:
HAM!DREZA
@@ -1,8 +1,17 @@
|
||||
<template>
|
||||
<product-pageAttended-course v-if="paidCourse" />
|
||||
<product-pageCourse-detail v-else/>
|
||||
<product-pageCourse-detail :slug="data.data" v-else/>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
const route = useRoute();
|
||||
const data = await useFetch("/api/productId", {
|
||||
method: "POST",
|
||||
body: {
|
||||
id: route.params.product,
|
||||
},
|
||||
})
|
||||
const paidCourse = useState('paidStatus', () => false)
|
||||
|
||||
|
||||
</script>
|
||||
@@ -110,5 +110,4 @@
|
||||
|
||||
<script setup>
|
||||
const { authUser } = useAuth();
|
||||
console.log('user :', authUser.value);
|
||||
</script>
|
||||
+415
-96
@@ -1,28 +1,217 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="relative">
|
||||
<tabs
|
||||
nav-item-active-class="text-primaryGreen relative"
|
||||
nav-class="scrolBar flex gap-[2vw] md:gap-[0.8vw] md:border-b border-b-[0.144vw] pb-[0.7vw] text-[3.59vw] md:text-[0.938vw] text-[#878787]"
|
||||
:options="{ useUrlFragment: false }"
|
||||
>
|
||||
<div class="flex flex-col md:flex-col-reverse">
|
||||
|
||||
<div class="flex flex-col md:flex-col-reverse">
|
||||
<div class="border-b md:border-0 py-[8vw] md:py-0">
|
||||
<p
|
||||
class="text-[4.038vw] md:text-[1.335vw] border-b border-b-[0.144vw] pb-[0.7vw]"
|
||||
>
|
||||
تیکت ها
|
||||
</p>
|
||||
|
||||
<tab :name="tab1">
|
||||
<div>
|
||||
<ul class="space-y-[0.5vw] mt-[0.5vw]">
|
||||
<li class="flex justify-between items-center">
|
||||
<p class="text-[3.59vw] md:text-[0.938vw] text-[#383E43]">
|
||||
طراحی سایت
|
||||
|
||||
<tab :name="tab1">
|
||||
<div class="flex flex-col flex-col-reverse pb-[10vw]">
|
||||
<ul
|
||||
class="space-y-[2vw] md:space-y-[0.5vw] mt-[0.5vw] border-b"
|
||||
v-for="ticket in tickets"
|
||||
:key="ticket.id"
|
||||
>
|
||||
|
||||
<li class="flex justify-between items-center pt-[1.5vw] md:pt-0">
|
||||
<p
|
||||
@click="openTicket(ticket.id)"
|
||||
class="text-[3.59vw] md:text-[0.938vw] text-[#383E43]">
|
||||
{{ ticket.subject }}
|
||||
</p>
|
||||
<p class="text-[3.19vw] md:text-[0.833vw] text-[#878787]">
|
||||
1402,09,12
|
||||
{{ ticket.createdAt }}
|
||||
</p>
|
||||
<div class="flex items-center gap-[1vw]">
|
||||
<button
|
||||
@click="openTicket(ticket.id)"
|
||||
class="hidden md:block text-[0.741vw] bg-[#F5F5F5] text-[#878787] h-[2.135vw] w-[3.646vw] rounded-[0.521vw]"
|
||||
>
|
||||
مشاوره
|
||||
</button>
|
||||
<button
|
||||
class="text-[2.518vw] md:text-[0.658vw] bg-[#2ED5731A] text-[#2ED573] h-[8.462vw] md:h-[2.135vw] w-[20.769vw] md:w-[5.625vw] rounded-[2.051vw] md:rounded-[0.521vw]"
|
||||
>
|
||||
پاسخ داده شده
|
||||
</button>
|
||||
</div>
|
||||
</li>
|
||||
<div class="chatBox">
|
||||
<div
|
||||
class=" grid justify-items-stretch w-full close"
|
||||
:id="ticket.id"
|
||||
>
|
||||
<div class="flex flex-col flex-col-reverse">
|
||||
<div v-if="loading" class="loadingText">درحال دریافت اطلاعات...</div>
|
||||
<div
|
||||
class="justify-self-start mt-[5vw] md:mt-0"
|
||||
v-for="(message, index) in ticketMessages[0]
|
||||
?.ticketMessages"
|
||||
:key="index"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
class="rounded-b-[5.128vw] md:rounded-b-[1.042vw] rounded-l-[5.128vw] md:rounded-l-[1.042vw] w-[80vw] md:w-[40vw] p-[4vw] md:p-[2vw] bg-[#F8F8F8] mb-[1vw] text-[#383E43]"
|
||||
>
|
||||
<p class="text-[3.59vw] md:text-[1.055vw]">
|
||||
{{ message.createdBy && "کاربر مهمان" }}
|
||||
</p>
|
||||
<p class="text-[#878787] text-[2.836vw] md:text-[0.741vw] mt-[0.5vw]">
|
||||
{{ message.createdAt }}
|
||||
</p>
|
||||
<p class="text-[3.19vw] md:text-[0.833vw] mt-[5vw] md:mt-[2vw]">
|
||||
{{ message.content }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div
|
||||
class="emptyText"
|
||||
v-if="ticketMessages[0]
|
||||
?.ticketMessages.length < 1">
|
||||
گفتگویی جهت نمایش وجود ندارد
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="justify-self-end flex flex-col w-full mt-[8vw] md:mt-[1vw] grid justify-items-stretch"
|
||||
>
|
||||
<textarea
|
||||
v-model="content"
|
||||
placeholder="متن تیکت خود را بنویسید..."
|
||||
class="textPlaceholer p-[4vw] md:p-[2vw] w-full bg-[#F5F5F5] rounded-[5.128vw] md:rounded-[1.042vw]"
|
||||
name="message"
|
||||
cols="30"
|
||||
rows="10"
|
||||
></textarea>
|
||||
<button
|
||||
class="greenButton text-[3.59vw] rounded-[2.564vw] md:rounded-[0.521vw] md:text-[0.833vw] w-full md:w-[10vw] float-left mt-[5vw] md:mt-[1vw] mb-[5vw] justify-self-end h-[12vw] md:h-[2.9vw]"
|
||||
@click="sendMessage(ticket.id)"
|
||||
>
|
||||
ارسال
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ul>
|
||||
</div>
|
||||
</tab>
|
||||
|
||||
<tab :name="tab2">
|
||||
<div class="flex flex-col flex-col-reverse pb-[10vw]">
|
||||
<ul
|
||||
class="space-y-[2vw] md:space-y-[0.5vw] mt-[0.5vw] border-b"
|
||||
v-for="ticket in tickets"
|
||||
:key="ticket.id"
|
||||
v-show="ticket.status === 'active'"
|
||||
>
|
||||
<li class="flex justify-between items-center pt-[1.5vw] md:pt-0">
|
||||
<p
|
||||
@click="openTicket(ticket.id)"
|
||||
class="text-[3.59vw] md:text-[0.938vw] text-[#383E43]">
|
||||
{{ ticket.subject }}
|
||||
</p>
|
||||
<p class="text-[3.19vw] md:text-[0.833vw] text-[#878787]">
|
||||
{{ ticket.createdAt }}
|
||||
</p>
|
||||
<div class="flex items-center gap-[1vw]">
|
||||
<button
|
||||
@click="openTicket(ticket.id)"
|
||||
class="hidden md:block text-[0.741vw] bg-[#F5F5F5] text-[#878787] h-[2.135vw] w-[3.646vw] rounded-[0.521vw]"
|
||||
>
|
||||
مشاوره
|
||||
</button>
|
||||
<button
|
||||
class="text-[2.518vw] md:text-[0.658vw] bg-[#2ED5731A] text-[#2ED573] h-[8.462vw] md:h-[2.135vw] w-[20.769vw] md:w-[5.625vw] rounded-[2.051vw] md:rounded-[0.521vw]"
|
||||
>
|
||||
پاسخ داده شده
|
||||
</button>
|
||||
</div>
|
||||
</li>
|
||||
<div class="chatBox">
|
||||
<div
|
||||
class="grid justify-items-stretch w-full close"
|
||||
:id="ticket.id"
|
||||
>
|
||||
<div class="flex flex-col flex-col-reverse">
|
||||
<div v-if="loading" class="loadingText">درحال دریافت اطلاعات...</div>
|
||||
<div
|
||||
class="justify-self-start mt-[5vw] md:mt-0"
|
||||
v-for="(message, index) in ticketMessages[0]
|
||||
?.ticketMessages"
|
||||
:key="index"
|
||||
>
|
||||
<div
|
||||
class="rounded-b-[5.128vw] md:rounded-b-[1.042vw] rounded-l-[5.128vw] md:rounded-l-[1.042vw] w-[80vw] md:w-[40vw] p-[4vw] md:p-[2vw] bg-[#F8F8F8] mb-[1vw] text-[#383E43]"
|
||||
>
|
||||
<p class="text-[3.59vw] md:text-[1.055vw]">
|
||||
{{ message.createdBy && "کاربر مهمان" }}
|
||||
</p>
|
||||
<p class="text-[#878787] text-[2.836vw] md:text-[0.741vw] mt-[0.5vw]">
|
||||
{{ message.createdAt }}
|
||||
</p>
|
||||
<p class="text-[3.19vw] md:text-[0.833vw] mt-[5vw] md:mt-[2vw]">
|
||||
{{ message.content }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div
|
||||
class="emptyText"
|
||||
v-if="ticketMessages[0]
|
||||
?.ticketMessages.length < 1">
|
||||
محتوایی جهت نمایش وجود ندارد
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="justify-self-end flex flex-col w-full mt-[8vw] md:mt-[1vw] grid justify-items-stretch"
|
||||
>
|
||||
<textarea
|
||||
v-model="content"
|
||||
placeholder="متن تیکت خود را بنویسید..."
|
||||
|
||||
class="p-[4vw] md:p-[2vw] w-full bg-[#F5F5F5] rounded-[5.128vw] md:rounded-[1.042vw]"
|
||||
name="message"
|
||||
cols="30"
|
||||
rows="10"
|
||||
></textarea>
|
||||
<button
|
||||
class="greenButton text-[3.59vw] rounded-[2.564vw] md:rounded-[0.521vw] md:text-[0.833vw] w-full md:w-[10vw] float-left mt-[5vw] md:mt-[1vw] mb-[5vw] justify-self-end h-[12vw] md:h-[2.9vw]"
|
||||
@click="sendMessage(ticket.id)"
|
||||
>
|
||||
ارسال
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ul>
|
||||
</div>
|
||||
</tab>
|
||||
|
||||
<tab :name="tab3">
|
||||
<div class="flex flex-col flex-col-reverse pb-[10vw]">
|
||||
<ul
|
||||
class="space-y-[2vw] md:space-y-[0.5vw] mt-[0.5vw] border-b"
|
||||
v-for="ticket in tickets"
|
||||
:key="ticket.id"
|
||||
v-show="ticket.status !== 'active'"
|
||||
>
|
||||
|
||||
<li class="flex justify-between items-center pt-[1.5vw] md:pt-0">
|
||||
|
||||
<p class="text-[3.59vw] md:text-[0.938vw] text-[#383E43]">
|
||||
{{ ticket.subject }}
|
||||
</p>
|
||||
<p class="text-[3.19vw] md:text-[0.833vw] text-[#878787]">
|
||||
{{ ticket.createdAt }}
|
||||
</p>
|
||||
<div class="flex items-center gap-[1vw]">
|
||||
<button
|
||||
@@ -37,110 +226,240 @@
|
||||
</button>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex justify-between items-center">
|
||||
<p class="text-[3.59vw] md:text-[0.938vw] text-[#383E43]">
|
||||
طراحی سایت
|
||||
</p>
|
||||
<p class="text-[3.19vw] md:text-[0.833vw] text-[#878787]">
|
||||
1402,09,12
|
||||
</p>
|
||||
<div class="flex items-center gap-[1vw]">
|
||||
<button
|
||||
class="hidden md:block text-[0.741vw] bg-[#F5F5F5] text-[#878787] h-[2.135vw] w-[3.646vw] rounded-[0.521vw]"
|
||||
<div class="chatBox">
|
||||
|
||||
<div
|
||||
class="grid justify-items-stretch w-full hidden close"
|
||||
:id="ticket.id"
|
||||
>
|
||||
<div class="flex flex-col flex-col-reverse">
|
||||
<div v-if="loading" class="loadingText">درحال دریافت اطلاعات...</div>
|
||||
<div
|
||||
class="justify-self-start mt-[5vw] md:mt-0"
|
||||
v-for="(message, index) in ticketMessages[0]
|
||||
?.ticketMessages"
|
||||
:key="index"
|
||||
>
|
||||
مشاوره
|
||||
</button>
|
||||
<button
|
||||
class="text-[2.518vw] md:text-[0.658vw] bg-[#2ED5731A] text-[#2ED573] h-[8.462vw] md:h-[2.135vw] w-[20.769vw] md:w-[5.625vw] rounded-[2.051vw] md:rounded-[0.521vw]"
|
||||
>
|
||||
پاسخ داده شده
|
||||
</button>
|
||||
<div
|
||||
class="emptyText"
|
||||
v-if="ticketMessages[0]
|
||||
?.ticketMessages.length < 1">
|
||||
محتوایی جهت نمایش وجود ندارد
|
||||
</div>
|
||||
<div
|
||||
class="rounded-b-[5.128vw] md:rounded-b-[1.042vw] rounded-l-[5.128vw] md:rounded-l-[1.042vw] w-[80vw] md:w-[40vw] p-[4vw] md:p-[2vw] bg-[#F8F8F8] mb-[1vw] text-[#383E43]"
|
||||
>
|
||||
<p class="text-[3.59vw] md:text-[1.055vw]">
|
||||
{{ message.createdBy && "کاربر مهمان" }}
|
||||
</p>
|
||||
<p class="text-[#878787] text-[2.836vw] md:text-[0.741vw] mt-[0.5vw]">
|
||||
{{ message.createdAt }}
|
||||
</p>
|
||||
<p class="text-[3.19vw] md:text-[0.833vw] mt-[5vw] md:mt-[2vw]">
|
||||
{{ message.content }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex justify-between items-center">
|
||||
<p class="text-[3.59vw] md:text-[0.938vw] text-[#383E43]">
|
||||
طراحی سایت
|
||||
</p>
|
||||
<p class="text-[3.19vw] md:text-[0.833vw] text-[#878787]">
|
||||
1402,09,12
|
||||
</p>
|
||||
<div class="flex items-center gap-[1vw]">
|
||||
<button
|
||||
class="hidden md:block text-[0.741vw] bg-[#F5F5F5] text-[#878787] h-[2.135vw] w-[3.646vw] rounded-[0.521vw]"
|
||||
<div
|
||||
class="justify-self-end flex flex-col w-full mt-[8vw] md:mt-[1vw] grid justify-items-stretch"
|
||||
>
|
||||
مشاوره
|
||||
</button>
|
||||
<button
|
||||
class="text-[2.518vw] md:text-[0.658vw] bg-[#2ED5731A] text-[#2ED573] h-[8.462vw] md:h-[2.135vw] w-[20.769vw] md:w-[5.625vw] rounded-[2.051vw] md:rounded-[0.521vw]"
|
||||
>
|
||||
پاسخ داده شده
|
||||
</button>
|
||||
<textarea
|
||||
v-model="content"
|
||||
placeholder="پاسخ"
|
||||
class="p-[4vw] md:p-[2vw] w-full bg-[#F5F5F5] rounded-[5.128vw] md:rounded-[1.042vw]"
|
||||
name="message"
|
||||
cols="30"
|
||||
rows="10"
|
||||
></textarea>
|
||||
<button
|
||||
class="greenButton text-[3.59vw] rounded-[2.564vw] md:rounded-[0.521vw] md:text-[0.833vw] w-full md:w-[10vw] float-left mt-[5vw] md:mt-[1vw] mb-[5vw] justify-self-end h-[12vw] md:h-[2.9vw]"
|
||||
@click="sendMessage(ticket.id)"
|
||||
>
|
||||
ارسال
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</div>
|
||||
</ul>
|
||||
</div>
|
||||
</tab>
|
||||
<tab :name="tab2"> محتوا دوم </tab>
|
||||
<tab :name="tab3"> محتوا سوم </tab>
|
||||
</div>
|
||||
<button
|
||||
class="flexBox items-center greenButton py-[5vw] md:py-0 my-[6vw] md:my-[3vw] rounded-[2.564vw] md:rounded-[0.781vw] text-[4.038vw] md:text-[0.938vw] w-full md:w-[15.479vw]"
|
||||
>
|
||||
<svg
|
||||
class="w-[5.641vw] md:w-[1.406vw] h-[5.641vw] md:h-[1.406vw]"
|
||||
viewBox="0 0 27 27"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M19.1196 4.5H7.86961C3.56086 4.5 2.35711 5.535 2.25586 9.5625C4.42711 9.5625 6.18211 11.3287 6.18211 13.5C6.18211 15.6712 4.42711 17.4262 2.25586 17.4375C2.35711 21.465 3.56086 22.5 7.86961 22.5H19.1196C23.6196 22.5 24.7446 21.375 24.7446 16.875V10.125C24.7446 5.625 23.6196 4.5 19.1196 4.5Z"
|
||||
stroke="white"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M10.1177 4.5V8.4375"
|
||||
stroke="white"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M10.1177 18.5625V22.5"
|
||||
stroke="white"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M16.903 10.4962L17.6005 11.9025C17.668 12.0375 17.803 12.1387 17.9493 12.1612L19.5018 12.3862C19.8843 12.4425 20.0418 12.915 19.7605 13.185L18.6355 14.2762C18.523 14.3775 18.478 14.535 18.5005 14.6925L18.7705 16.2337C18.838 16.6162 18.433 16.9087 18.0955 16.7287L16.7118 15.9975C16.5768 15.93 16.408 15.93 16.273 15.9975L14.8893 16.7287C14.5405 16.9087 14.1468 16.6162 14.2143 16.2337L14.4843 14.6925C14.5068 14.535 14.4618 14.3887 14.3493 14.2762L13.2355 13.185C12.9543 12.915 13.1118 12.4425 13.4943 12.3862L15.0468 12.1612C15.2043 12.1387 15.328 12.0487 15.3955 11.9025L16.0818 10.4962C16.2393 10.1475 16.7343 10.1475 16.903 10.4962Z"
|
||||
stroke="white"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
تیکت جدید
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="flex flex-col md:flex-row justify-between">
|
||||
<button
|
||||
@click="addTicketForm = true"
|
||||
class="flexBox items-center greenButton py-[5vw] md:py-0 my-[6vw] md:my-[3vw] rounded-[2.564vw] md:rounded-[0.781vw] text-[4.038vw] md:text-[0.938vw] w-full md:w-[15.479vw] h-[12vw] md:h-[3vw]"
|
||||
>
|
||||
<svg
|
||||
class="w-[5.641vw] md:w-[1.406vw] h-[5.641vw] md:h-[1.406vw]"
|
||||
viewBox="0 0 27 27"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M19.1196 4.5H7.86961C3.56086 4.5 2.35711 5.535 2.25586 9.5625C4.42711 9.5625 6.18211 11.3287 6.18211 13.5C6.18211 15.6712 4.42711 17.4262 2.25586 17.4375C2.35711 21.465 3.56086 22.5 7.86961 22.5H19.1196C23.6196 22.5 24.7446 21.375 24.7446 16.875V10.125C24.7446 5.625 23.6196 4.5 19.1196 4.5Z"
|
||||
stroke="white"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M10.1177 4.5V8.4375"
|
||||
stroke="white"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M10.1177 18.5625V22.5"
|
||||
stroke="white"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M16.903 10.4962L17.6005 11.9025C17.668 12.0375 17.803 12.1387 17.9493 12.1612L19.5018 12.3862C19.8843 12.4425 20.0418 12.915 19.7605 13.185L18.6355 14.2762C18.523 14.3775 18.478 14.535 18.5005 14.6925L18.7705 16.2337C18.838 16.6162 18.433 16.9087 18.0955 16.7287L16.7118 15.9975C16.5768 15.93 16.408 15.93 16.273 15.9975L14.8893 16.7287C14.5405 16.9087 14.1468 16.6162 14.2143 16.2337L14.4843 14.6925C14.5068 14.535 14.4618 14.3887 14.3493 14.2762L13.2355 13.185C12.9543 12.915 13.1118 12.4425 13.4943 12.3862L15.0468 12.1612C15.2043 12.1387 15.328 12.0487 15.3955 11.9025L16.0818 10.4962C16.2393 10.1475 16.7343 10.1475 16.903 10.4962Z"
|
||||
stroke="white"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
تیکت جدید
|
||||
</button>
|
||||
<div class="flex flex-col md:flex-row items-center gap-[0.5vw]" v-if="addTicketForm">
|
||||
<input
|
||||
v-model="subject"
|
||||
class="w-full items-center md:h-[3vw] py-[5vw] md:py-0 my-[6vw] md:my-[3vw] rounded-[2.564vw] md:rounded-[0.781vw] border text-[4.038vw] md:text-[0.938vw] ps-[3vw] md:ps-[2vw] md:pe-[10vw]"
|
||||
type="text" placeholder="موضوع تیکت را وارد کنید">
|
||||
<button
|
||||
class="h-[12vw] w-full md:w-auto md:h-[3vw] px-[1.5vw] greenButton rounded-[2.564vw] md:rounded-[0.781vw] text-[4.038vw] md:text-[0.938vw]
|
||||
"
|
||||
@click="sendTicket"
|
||||
>ثبت</button>
|
||||
<button class="mt-[1vw] md:mt-0 h-[12vw] w-full md:w-auto md:h-[3vw] px-[1.5vw] bg-red-500 md:h-[3vw] text-white rounded-[2.564vw] md:rounded-[0.781vw] text-[4.038vw] md:text-[0.938vw]
|
||||
"
|
||||
@click="addTicketForm = false"
|
||||
>انصراف</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</tabs>
|
||||
<!-- <div
|
||||
v-if="addTicketForm"
|
||||
class="backdrop-blur-xl bg-white/30 absolute px-[5vw] py-[8vw]
|
||||
w-full top-0 space-y-[5vw] md:space-y-[2vw] border rounded-[1vw] shadow-md h-[80vw] md:h-auto"
|
||||
>
|
||||
<p class="text-[3vw] md:text-[1vw] font-semibold text-primaryGreen">موضوع تیکت :</p>
|
||||
<div class="flex flex-col md:flex-row gap-[5vw] md:gap-[1vw]">
|
||||
<input
|
||||
class="h-[10vw] md:h-[3vw] rounded-[1vw] px-[1vw] md:w-[40vw] border"
|
||||
type="text"
|
||||
placeholder="موضوع تیکت را وارد کنید"
|
||||
v-model="subject"
|
||||
/>
|
||||
<button
|
||||
class="text-[3vw] md:text-[0.7vw] greenButton rounded-[1vw] px-[1.5vw] h-[10vw] md:h-[3vw]"
|
||||
@click="sendTicket"
|
||||
>
|
||||
ثبت
|
||||
</button>
|
||||
<button
|
||||
class="text-[3vw] md:text-[0.7vw] bg-red-400 rounded-[1vw] text-white px-[1vw] h-[10vw] md:h-[3vw]"
|
||||
@click="addTicketForm = false"
|
||||
>
|
||||
انصراف
|
||||
</button>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
<script setup>
|
||||
import { Tabs, Tab } from "vue3-tabs-component";
|
||||
import {Tabs, Tab} from 'vue3-tabs-component';
|
||||
import { useToast } from 'vue-toastification'
|
||||
const toast = useToast()
|
||||
|
||||
const { data: tickets, refresh: load } = await useFetch("/api/ticket");
|
||||
console.log('cli tick', tickets);
|
||||
const loading = ref(false);
|
||||
const addTicketForm = ref(false);
|
||||
const subject = ref(null);
|
||||
const content = ref(null);
|
||||
const ticketMessages = ref([]);
|
||||
const update = ref(null)
|
||||
|
||||
|
||||
const sendTicket = async () => {
|
||||
if (subject.value === null) {
|
||||
return toast.error("موضوع تیکت را وارد کنید")
|
||||
}
|
||||
const data = await useFetch("/api/ticket", {
|
||||
method: "POST",
|
||||
body: {
|
||||
subject,
|
||||
},
|
||||
});
|
||||
subject.value = '';
|
||||
addTicketForm.value = false;
|
||||
load()
|
||||
|
||||
};
|
||||
|
||||
const openTicket = async (data) => {
|
||||
loading.value = true;
|
||||
ticketMessages.value = [];
|
||||
if (process.client) {
|
||||
const slides = document.getElementsByClassName("close");
|
||||
for (let i = 0; i < slides.length; i++) {
|
||||
if (slides[i].id === data) {
|
||||
slides[i].style.maxHeight = (slides[i].scrollHeight * 2) + "px";
|
||||
} else {
|
||||
slides[i].style.maxHeight = null;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
const {data: single, refresh: reload} = await useFetch("/api/ticket/id", {
|
||||
method: "POST",
|
||||
body: {
|
||||
id: data,
|
||||
},
|
||||
});
|
||||
ticketMessages.value.push(single.value);
|
||||
reload()
|
||||
loading.value = false;
|
||||
|
||||
};
|
||||
const sendMessage = async (data, reload) => {
|
||||
if (content.value === null || '') {
|
||||
return toast.error("متن تیکت را وارد کنید")
|
||||
}
|
||||
const message = await useFetch("/api/ticket/message", {
|
||||
method: "POST",
|
||||
body: {
|
||||
content: content.value,
|
||||
ticketId: data,
|
||||
},
|
||||
});
|
||||
content.value = "";
|
||||
toast.success("تیکت جدید با موفقیت ثبت")
|
||||
openTicket().reload()
|
||||
};
|
||||
|
||||
const tab1 = `<p class="flex items-center gap-[0.5vw] p-[2vw] md:p-0 md:px-[0.6vw] rounded-[2.564vw]">
|
||||
<svg
|
||||
class="hidden md:block w-[1.406vw] h-[1.406vw]"
|
||||
viewBox="0 0 27 27" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M21.9375 14.0625C21.9375 12.51 23.1975 11.25 24.75 11.25V10.125C24.75 5.625 23.625 4.5 19.125 4.5H7.875C3.375 4.5 2.25 5.625 2.25 10.125V10.6875C3.8025 10.6875 5.0625 11.9475 5.0625 13.5C5.0625 15.0525 3.8025 16.3125 2.25 16.3125V16.875C2.25 21.375 3.375 22.5 7.875 22.5H19.125C23.625 22.5 24.75 21.375 24.75 16.875C23.1975 16.875 21.9375 15.615 21.9375 14.0625Z" stroke="#0D3F40" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M11.25 4.5L11.25 22.5" stroke="#0D3F40" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" stroke-dasharray="5 5"/>
|
||||
<path d="M21.9375 14.0625C21.9375 12.51 23.1975 11.25 24.75 11.25V10.125C24.75 5.625 23.625 4.5 19.125 4.5H7.875C3.375 4.5 2.25 5.625 2.25 10.125V10.6875C3.8025 10.6875 5.0625 11.9475 5.0625 13.5C5.0625 15.0525 3.8025 16.3125 2.25 16.3125V16.875C2.25 21.375 3.375 22.5 7.875 22.5H19.125C23.625 22.5 24.75 21.375 24.75 16.875C23.1975 16.875 21.9375 15.615 21.9375 14.0625Z" stroke="#878787" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M11.25 4.5L11.25 22.5" stroke="#878787" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" stroke-dasharray="5 5"/>
|
||||
</svg>
|
||||
|
||||
همه تیکت ها
|
||||
|
||||
Reference in New Issue
Block a user