mirror of
https://github.com/Dadechin/XRoomDashboardFront.git
synced 2025-07-02 00:04:35 +00:00
fix edits
This commit is contained in:
Diyar Akhgar
parent
f851bd5794
commit
d8a0da9986
|
|
@ -111,19 +111,20 @@ router-view {
|
|||
/* Responsive Styles */
|
||||
@media (max-width: 520px) {
|
||||
.dashboard-page {
|
||||
padding: 15px 5px;
|
||||
padding: 0;
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 5px 15px !important;
|
||||
gap: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 521px) and (max-width: 780px) {
|
||||
.dashboard-page {
|
||||
padding: 15px;
|
||||
padding: 0;
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
|
|
@ -131,6 +132,7 @@ router-view {
|
|||
padding: 0px 15px !important;
|
||||
padding-bottom: 45px !important;
|
||||
gap: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
BIN
xroom-dashboard/src/assets/img/3d-icon.jpg
Normal file
BIN
xroom-dashboard/src/assets/img/3d-icon.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 14 KiB |
BIN
xroom-dashboard/src/assets/img/Logins-logo.png
Normal file
BIN
xroom-dashboard/src/assets/img/Logins-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.0 KiB |
|
|
@ -118,7 +118,7 @@
|
|||
d="M15 12.5L10 7.5L5 12.5"
|
||||
stroke="#3A57E8"
|
||||
stroke-width="2"
|
||||
stroke-linecap prištede="round"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
|
|
@ -292,7 +292,7 @@
|
|||
</div>
|
||||
<div class="participants-objects">
|
||||
<h2>شرکت کنندگان</h2>
|
||||
<p><span style="color: #101010;font-weight: 600;">کاربران</span> یا <span style="color: #101010;font-weight: 600;">مهمانان تیم</span> را با پر کردن آدرس ایمیل آنها دعوت کنید.</p>
|
||||
<p><span style="color: #101010;font-weight: 600;">کاربران</span> یا <span style="color: #101010;font-weight: 600;">مهمانان تیم</span> را با پر کردن شماره تلفن آنها دعوت کنید.</p>
|
||||
<span class="participants-guide">
|
||||
می‌توانید به مجری اجازه بدهید تا ابزارهایی برای مدیریت این جلسه و همچنین ابزارهایی برای مدیریت مجوزها در طول جلسه به او بدهد.
|
||||
</span>
|
||||
|
|
@ -304,23 +304,23 @@
|
|||
</div>
|
||||
<div class="user-info">
|
||||
<p class="user-name">{{ fullName }}</p>
|
||||
<span>{{ userEmail || 'ایمیل موجود نیست' }}</span>
|
||||
<span>{{ userPhone || 'شماره تلفن موجود نیست' }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<p class="presenter-role">{{ userRole }}</p>
|
||||
</div>
|
||||
<div class="presenter" v-for="participant in participants" :key="participant.email">
|
||||
<div class="presenter" v-for="participant in participants" :key="participant.phone">
|
||||
<div style="display: flex;align-items: center;height: 100%;">
|
||||
<div class="avatar-wrapper">
|
||||
<img class="user-avatar" :src="participant.profile_img || defaultProfileIcon" />
|
||||
</div>
|
||||
<div class="user-info">
|
||||
<p class="user-name">{{ participant.name || 'کاربر مهمان' }}</p>
|
||||
<span>{{ participant.email }}</span>
|
||||
<span>{{ participant.phone }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<p class="presenter-role">{{ participant.role }}</p>
|
||||
<button @click="removeParticipant(participant.email)">
|
||||
<button @click="removeParticipant(participant.phone)">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="35" height="35" viewBox="0 0 32 32" fill="none">
|
||||
<rect x="0.5" y="0.5" width="31" height="31" rx="7.5" fill="white"/>
|
||||
<rect x="0.5" y="0.5" width="31" height="31" rx="7.5" stroke="#E2DEE9"/>
|
||||
|
|
@ -330,13 +330,13 @@
|
|||
</button>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="participantEmail">اضافه کردن شرکت کننده</label>
|
||||
<label for="participantPhone">اضافه کردن شرکت کننده</label>
|
||||
<div class="participant-input">
|
||||
<input
|
||||
type="email"
|
||||
id="participantEmail"
|
||||
v-model="newParticipantEmail"
|
||||
placeholder="لطفا ایمیل شرکت کننده را وارد کنید ..."
|
||||
type="tel"
|
||||
id="participantPhone"
|
||||
v-model="newParticipantPhone"
|
||||
placeholder="لطفا شماره تلفن شرکت کننده را وارد کنید"
|
||||
@keyup.enter="addParticipant"
|
||||
/>
|
||||
<button type="button" @click="addParticipant">
|
||||
|
|
@ -349,7 +349,7 @@
|
|||
</div>
|
||||
</form>
|
||||
<span class="last-span">
|
||||
شرکت کنندگان را اضافه کنید برای شرکت کنندگانی که به این جلسه اضافه شده اند ایمیلی حاوی کد جلسه، عنوان، توضیحات و زمان ارسال می شود.
|
||||
شرکت کنندگان را اضافه کنید برای شرکت کنندگانی که به این جلسه اضافه شده اند پیامکی حاوی کد جلسه، عنوان، توضیحات و زمان ارسال می‌شود.
|
||||
</span>
|
||||
</div>
|
||||
<div class="form-actions">
|
||||
|
|
@ -358,11 +358,11 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<RoomSelectionModal
|
||||
:is-open="isRoomSelectionOpen"
|
||||
@close="isRoomSelectionOpen = false"
|
||||
@submit-rooms="handleRoomSelection"
|
||||
/>
|
||||
<RoomSelectionModal
|
||||
:is-open="isRoomSelectionOpen"
|
||||
@close="isRoomSelectionOpen = false"
|
||||
@submit-rooms="handleRoomSelection"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
@ -395,7 +395,7 @@ export default {
|
|||
selectedRooms: [],
|
||||
},
|
||||
participants: [],
|
||||
newParticipantEmail: '',
|
||||
newParticipantPhone: '',
|
||||
defaultProfileIcon: 'https://c.animaapp.com/m9nvumalUMfQbN/img/frame.svg',
|
||||
error: null,
|
||||
isRoomSelectionOpen: false,
|
||||
|
|
@ -408,8 +408,8 @@ export default {
|
|||
? `${user.first_name} ${user.last_name}`
|
||||
: 'کاربر مهمان';
|
||||
},
|
||||
userEmail() {
|
||||
return 'diyar.akhgar@gmail.com';
|
||||
userPhone() {
|
||||
return '09123456789'; // شماره تلفن کاربر اصلی (می‌توانید از localStorage یا منبع دیگری بگیرید)
|
||||
},
|
||||
userRole() {
|
||||
return 'مجری';
|
||||
|
|
@ -419,8 +419,7 @@ export default {
|
|||
return customer.profile_img || this.defaultProfileIcon;
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
// نظارت بر باز و بسته شدن پاپ‌آپ اصلی
|
||||
watch: {
|
||||
isOpen(newVal) {
|
||||
if (newVal) {
|
||||
document.body.style.overflow = 'hidden';
|
||||
|
|
@ -428,7 +427,6 @@ export default {
|
|||
document.body.style.overflow = '';
|
||||
}
|
||||
},
|
||||
// نظارت بر باز و بسته شدن پاپ‌آپ انتخاب اتاق
|
||||
isRoomSelectionOpen(newVal) {
|
||||
if (newVal) {
|
||||
document.body.style.overflow = 'hidden';
|
||||
|
|
@ -438,10 +436,9 @@ export default {
|
|||
},
|
||||
},
|
||||
methods: {
|
||||
beforeDestroy() {
|
||||
// اطمینان از فعال شدن اسکرول هنگام حذف کامپوننت
|
||||
document.body.style.overflow = '';
|
||||
},
|
||||
beforeDestroy() {
|
||||
document.body.style.overflow = '';
|
||||
},
|
||||
openRoomSelection() {
|
||||
this.isRoomSelectionOpen = true;
|
||||
},
|
||||
|
|
@ -450,31 +447,32 @@ export default {
|
|||
this.isRoomSelectionOpen = false;
|
||||
},
|
||||
addParticipant() {
|
||||
if (!this.newParticipantEmail || !this.validateEmail(this.newParticipantEmail)) {
|
||||
this.error = 'لطفاً ایمیل معتبر وارد کنید';
|
||||
if (!this.newParticipantPhone || !this.validatePhone(this.newParticipantPhone)) {
|
||||
this.error = 'لطفاً شماره تلفن معتبر وارد کنید (مثال: 09123456789)';
|
||||
return;
|
||||
}
|
||||
if (
|
||||
this.participants.some((p) => p.email === this.newParticipantEmail) ||
|
||||
this.newParticipantEmail === this.userEmail
|
||||
this.participants.some((p) => p.phone === this.newParticipantPhone) ||
|
||||
this.newParticipantPhone === this.userPhone
|
||||
) {
|
||||
this.error = 'این ایمیل قبلاً اضافه شده است';
|
||||
this.error = 'این شماره تلفن قبلاً اضافه شده است';
|
||||
return;
|
||||
}
|
||||
this.participants.push({
|
||||
email: this.newParticipantEmail,
|
||||
phone: this.newParticipantPhone,
|
||||
name: 'کاربر مهمان',
|
||||
role: 'شرکت‌کننده',
|
||||
profile_img: this.defaultProfileIcon,
|
||||
});
|
||||
this.newParticipantEmail = '';
|
||||
this.newParticipantPhone = '';
|
||||
this.error = null;
|
||||
},
|
||||
removeParticipant(email) {
|
||||
this.participants = this.participants.filter((p) => p.email !== email);
|
||||
removeParticipant(phone) {
|
||||
this.participants = this.participants.filter((p) => p.phone !== phone);
|
||||
},
|
||||
validateEmail(email) {
|
||||
return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);
|
||||
validatePhone(phone) {
|
||||
// اعتبارسنجی شماره تلفن (مثال: فرمت شماره تلفن ایرانی)
|
||||
return /^09[0-9]{9}$/.test(phone); // فرمت: 09XXXXXXXXX (11 رقم، شروع با 09)
|
||||
},
|
||||
closeModal() {
|
||||
this.$emit('close');
|
||||
|
|
@ -492,7 +490,7 @@ export default {
|
|||
selectedRooms: [],
|
||||
};
|
||||
this.participants = [];
|
||||
this.newParticipantEmail = '';
|
||||
this.newParticipantPhone = '';
|
||||
this.error = null;
|
||||
this.isRoomSelectionOpen = false;
|
||||
},
|
||||
|
|
@ -557,9 +555,9 @@ export default {
|
|||
endDateTime,
|
||||
rooms: this.form.selectedRooms,
|
||||
participants: [
|
||||
...(this.userEmail ? [{ email: this.userEmail, role: this.userRole }] : []),
|
||||
...(this.userPhone ? [{ phone: this.userPhone, role: this.userRole }] : []),
|
||||
...this.participants.map((p) => ({
|
||||
email: p.email,
|
||||
phone: p.phone,
|
||||
role: p.role,
|
||||
})),
|
||||
],
|
||||
|
|
@ -904,12 +902,17 @@ export default {
|
|||
|
||||
.participant-input button {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 11px;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
}
|
||||
|
||||
#participantPhone::placeholder {
|
||||
text-align: right;
|
||||
padding-right: 1.5rem;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<style>
|
||||
|
|
|
|||
|
|
@ -42,9 +42,9 @@
|
|||
</svg>
|
||||
</span>
|
||||
</button>
|
||||
<button class="green-button">
|
||||
<button class="green-button" @click="goToBuySubscription">
|
||||
<img :src="require('@/assets/img/shopIcon.png')" alt="Icon" class="button-icon" />
|
||||
<span>خرید اشتراک </span>
|
||||
<span>خرید اشتراک</span>
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -95,6 +95,9 @@ export default {
|
|||
},
|
||||
toggleSidebar() {
|
||||
this.$emit('toggle-sidebar');
|
||||
},
|
||||
goToBuySubscription() {
|
||||
this.$router.push({ path: '/dashboard/teams', query: { tab: 'buy-subscription' } });
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
|
|
|||
|
|
@ -350,6 +350,17 @@ export default {
|
|||
.group {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.clip-path-group-wrapper {
|
||||
width: 150px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.clip-path-group {
|
||||
width: 150px;
|
||||
height: 40px;
|
||||
object-fit: contain;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 520px) and (max-width: 780px) {
|
||||
|
|
@ -368,6 +379,17 @@ export default {
|
|||
.group {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.clip-path-group-wrapper {
|
||||
width: 150px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.clip-path-group {
|
||||
width: 150px;
|
||||
height: 40px;
|
||||
object-fit: contain;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 780px) and (max-width: 1280px) {
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<div class="signup-page">
|
||||
<div class="signup-form">
|
||||
<h2 class="title">
|
||||
<img :src="require('@/assets/img/logo.png')" alt="Logo" style="max-width: 150px;" />
|
||||
<img :src="require('@/assets/img/Logins-logo.png')" alt="Logo" style="max-width: 150px;" />
|
||||
</h2>
|
||||
<h3 class="subtitle">ورود به حساب کاربری</h3>
|
||||
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<div class="signup-page">
|
||||
<div class="signup-form">
|
||||
<h2 class="title">
|
||||
<img :src="require('@/assets/img/logo.png')" alt="Logo" style="max-width: 150px;" />
|
||||
<img :src="require('@/assets/img/Logins-logo.png')" alt="Logo" style="max-width: 150px;" />
|
||||
</h2>
|
||||
<h3 class="subtitle">فراموشی رمز عبور</h3>
|
||||
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<div class="signup-page">
|
||||
<div class="signup-form">
|
||||
<h2 class="title">
|
||||
<img :src="require('@/assets/img/logo.png')" alt="Logo" />
|
||||
<img :src="require('@/assets/img/Logins-logo.png')" alt="Logo" />
|
||||
</h2>
|
||||
<h3 class="subtitle">ساخت حساب کاربری</h3>
|
||||
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<div class="signup-page">
|
||||
<div class="signup-form">
|
||||
<h2 class="title">
|
||||
<img :src="require('@/assets/img/logo.png')" alt="Logo" style="max-width: 150px;" />
|
||||
<img :src="require('@/assets/img/Logins-logo.png')" alt="Logo" style="max-width: 150px;" />
|
||||
</h2>
|
||||
<h3 class="subtitle"> تایید شماره موبایل </h3>
|
||||
|
||||
|
|
|
|||
|
|
@ -249,39 +249,39 @@ export default {
|
|||
},
|
||||
computed: {
|
||||
filteredFileSections() {
|
||||
let sections = this.fileSections;
|
||||
let sections = this.fileSections;
|
||||
|
||||
if (this.activeFilter === 'all-files' || this.activeFilter === 'recent-files') {
|
||||
sections = this.fileSections.filter(section => {
|
||||
const files = this.filteredFiles(section.type);
|
||||
return files.length > 0;
|
||||
});
|
||||
} else {
|
||||
const filterTypeMap = {
|
||||
images: 'image',
|
||||
pdfs: 'pdf',
|
||||
videos: 'video',
|
||||
glbs: 'glb',
|
||||
others: 'other',
|
||||
};
|
||||
const filterType = filterTypeMap[this.activeFilter];
|
||||
sections = filterType
|
||||
? this.fileSections.filter(section => {
|
||||
const files = this.filteredFiles(section.type);
|
||||
return section.type === filterType && files.length > 0;
|
||||
})
|
||||
: [];
|
||||
}
|
||||
if (this.activeFilter === 'all-files' || this.activeFilter === 'recent-files') {
|
||||
sections = this.fileSections.filter(section => {
|
||||
const files = this.filteredFiles(section.type);
|
||||
return files.length > 0;
|
||||
});
|
||||
} else {
|
||||
const filterTypeMap = {
|
||||
images: 'image',
|
||||
pdfs: 'pdf',
|
||||
videos: 'video',
|
||||
glbs: 'glb',
|
||||
others: 'other',
|
||||
};
|
||||
const filterType = filterTypeMap[this.activeFilter];
|
||||
sections = filterType
|
||||
? this.fileSections.filter(section => {
|
||||
const files = this.filteredFiles(section.type);
|
||||
return section.type === filterType && files.length > 0;
|
||||
})
|
||||
: [];
|
||||
}
|
||||
|
||||
return sections;
|
||||
},
|
||||
hasRecentFiles() {
|
||||
const sevenDaysAgo = new Date();
|
||||
sevenDaysAgo.setDate(sevenDaysAgo.getDate() - 7);
|
||||
return ['images', 'pdfs', 'videos', 'glbs', 'others'].some(type =>
|
||||
this.userData[type].some(file => new Date(file.created_at) >= sevenDaysAgo)
|
||||
);
|
||||
},
|
||||
return sections;
|
||||
},
|
||||
hasRecentFiles() {
|
||||
const oneDayAgo = new Date();
|
||||
oneDayAgo.setHours(oneDayAgo.getHours() - 24);
|
||||
return ['images', 'pdfs', 'videos', 'glbs', 'others'].some(type =>
|
||||
this.userData[type].some(file => new Date(file.created_at) >= oneDayAgo)
|
||||
);
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.fetchUserData();
|
||||
|
|
@ -305,13 +305,13 @@ export default {
|
|||
if (!files) return [];
|
||||
|
||||
if (this.activeFilter === 'recent-files') {
|
||||
const sevenDaysAgo = new Date();
|
||||
sevenDaysAgo.setDate(sevenDaysAgo.getDate() - 7);
|
||||
return files.filter(file => new Date(file.created_at) >= sevenDaysAgo);
|
||||
const oneDayAgo = new Date();
|
||||
oneDayAgo.setHours(oneDayAgo.getHours() - 24);
|
||||
return files.filter(file => new Date(file.created_at) >= oneDayAgo);
|
||||
}
|
||||
|
||||
const filterTypeMap = {
|
||||
images: 'image',
|
||||
images: 'image',
|
||||
pdfs: 'pdf',
|
||||
videos: 'video',
|
||||
glbs: 'glb',
|
||||
|
|
@ -332,7 +332,7 @@ export default {
|
|||
case 'video':
|
||||
return 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTfQ1L9b8tFaGXBQxOdCCaq-AcYkmawPtRVZA&s';
|
||||
case 'glb':
|
||||
return require('@/assets/img/3d icon.jpg');
|
||||
return require('@/assets/img/3d-icon.jpg');
|
||||
case 'other':
|
||||
return 'https://cdn-icons-png.flaticon.com/512/186/186159.png';
|
||||
default:
|
||||
|
|
@ -395,6 +395,7 @@ export default {
|
|||
};
|
||||
</script>
|
||||
|
||||
|
||||
<style scoped>
|
||||
/* General Styles */
|
||||
.file-manager {
|
||||
|
|
|
|||
|
|
@ -56,13 +56,15 @@
|
|||
/>
|
||||
<img
|
||||
src="https://c.animaapp.com/m9nvumalUMfQbN/img/frame-19.svg"
|
||||
alt="Tutorial"
|
||||
alt="Downloads"
|
||||
class="tutorial-item"
|
||||
@click="goToDownloads"
|
||||
/>
|
||||
<img
|
||||
src="https://c.animaapp.com/m9nvumalUMfQbN/img/frame-21.svg"
|
||||
alt="Tutorial"
|
||||
alt="Teams"
|
||||
class="tutorial-item"
|
||||
@click="goToTeams"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -104,25 +106,35 @@
|
|||
:breakpoints="{
|
||||
768: { slidesPerView: 3.4, spaceBetween: 15 },
|
||||
1024: { slidesPerView: 2.8, spaceBetween: 25 },
|
||||
1280: { slidesPerView: 3.8, spaceBetween: 30 },
|
||||
1280: { slidesPerView: 4.4, spaceBetween: 30 },
|
||||
}"
|
||||
:modules="modules"
|
||||
class="last-files-swiper"
|
||||
>
|
||||
<swiper-slide v-for="(meeting, index) in meetings" :key="index" class="meeting-card">
|
||||
<swiper-slide v-for="(file, index) in recentFiles" :key="index" class="meeting-card">
|
||||
<div
|
||||
class="card-image"
|
||||
:style="{ backgroundImage: `url(${meeting.image})` }"
|
||||
:class="[
|
||||
{
|
||||
'file-image': file.type === 'image',
|
||||
'file-pdf': file.type === 'pdf',
|
||||
'file-video': file.type === 'video',
|
||||
'file-glb': file.type === 'glb',
|
||||
'file-other': file.type === 'other',
|
||||
}
|
||||
]"
|
||||
:style="{ backgroundImage: `url(${getFilePreviewImage(file.type, file)})` }"
|
||||
@click="openPreviewDialog(file.type, index, getFullFileUrl(file[file.type]), file.id)"
|
||||
></div>
|
||||
<div class="card-content">
|
||||
<h3>{{ meeting.title }}</h3>
|
||||
<h3>{{ file.name }}</h3>
|
||||
<div class="meeting-date">
|
||||
<img
|
||||
src="https://c.animaapp.com/m9nvumalUMfQbN/img/frame-1.svg"
|
||||
alt="Calendar Icon"
|
||||
class="date-icon"
|
||||
/>
|
||||
<span>{{ meeting.date }}</span>
|
||||
<span>{{ formatDate(file.created_at) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</swiper-slide>
|
||||
|
|
@ -147,6 +159,16 @@
|
|||
@close="closeDialog"
|
||||
@upload-success="fetchUserData"
|
||||
/>
|
||||
<FilePreviewDialog
|
||||
:is-open="isPreviewDialogOpen"
|
||||
:preview-url="previewUrl"
|
||||
:preview-type="currentPreviewType"
|
||||
:preview-index="currentPreviewIndex"
|
||||
:base-url="baseUrl"
|
||||
:video-options="videoOptions"
|
||||
@close="closePreviewDialog"
|
||||
@delete-success="fetchUserData"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -154,9 +176,11 @@
|
|||
import CreateMeetingModal from '@/components/CreateMeetingModal.vue';
|
||||
import TutorialShowModal from '@/components/TutorialShowModal.vue';
|
||||
import NewFileDialog from '@/components/NewFileDialog.vue';
|
||||
import FilePreviewDialog from '@/components/FilePreviewDialog.vue';
|
||||
import { Swiper, SwiperSlide } from 'swiper/vue';
|
||||
import 'swiper/css';
|
||||
import { Pagination } from 'swiper/modules';
|
||||
import axios from 'axios';
|
||||
|
||||
export default {
|
||||
name: 'DashboardPage',
|
||||
|
|
@ -164,6 +188,7 @@ export default {
|
|||
CreateMeetingModal,
|
||||
TutorialShowModal,
|
||||
NewFileDialog,
|
||||
FilePreviewDialog,
|
||||
Swiper,
|
||||
SwiperSlide,
|
||||
},
|
||||
|
|
@ -173,48 +198,85 @@ export default {
|
|||
showModal: false,
|
||||
tutorialShowModal: false,
|
||||
isNewFileDialogOpen: false,
|
||||
isPreviewDialogOpen: false,
|
||||
currentUploadType: 'image',
|
||||
currentPreviewType: null,
|
||||
currentPreviewIndex: null,
|
||||
previewUrl: '',
|
||||
baseUrl: 'http://194.62.43.230:8000',
|
||||
meetings: [
|
||||
{
|
||||
title: 'Pico Control',
|
||||
date: '24 تیر 1403',
|
||||
image: 'https://c.animaapp.com/m9nvumalUMfQbN/img/frame-23-1.png',
|
||||
},
|
||||
{
|
||||
title: 'Flash Back',
|
||||
date: '24 تیر 1403',
|
||||
image: 'https://c.animaapp.com/m9nvumalUMfQbN/img/frame-23-4.png',
|
||||
},
|
||||
{
|
||||
title: 'Fakor Sanat Tehran',
|
||||
date: '24 تیر 1403',
|
||||
image: 'https://c.animaapp.com/m9nvumalUMfQbN/img/frame-23-2.png',
|
||||
},
|
||||
{
|
||||
title: 'Design Artist',
|
||||
date: '24 تیر 1403',
|
||||
image: 'https://c.animaapp.com/m9nvumalUMfQbN/img/frame-23-3.png',
|
||||
},
|
||||
{
|
||||
title: 'Fakor Sanat Tehran',
|
||||
date: '24 تیر 1403',
|
||||
image: 'https://c.animaapp.com/m9nvumalUMfQbN/img/frame-23-2.png',
|
||||
},
|
||||
{
|
||||
title: 'Design Artist',
|
||||
date: '24 تیر 1403',
|
||||
image: 'https://c.animaapp.com/m9nvumalUMfQbN/img/frame-23-3.png',
|
||||
},
|
||||
{
|
||||
title: 'Flash Back',
|
||||
date: '24 تیر 1403',
|
||||
image: 'https://c.animaapp.com/m9nvumalUMfQbN/img/frame-23-4.png',
|
||||
},
|
||||
],
|
||||
videoOptions: {
|
||||
autoplay: false,
|
||||
controls: true,
|
||||
sources: [{ type: 'video/mp4', src: '' }],
|
||||
},
|
||||
userData: {
|
||||
images: [],
|
||||
pdfs: [],
|
||||
videos: [],
|
||||
glbs: [],
|
||||
others: [],
|
||||
},
|
||||
recentFiles: [],
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.fetchUserData();
|
||||
},
|
||||
methods: {
|
||||
async fetchUserData() {
|
||||
try {
|
||||
const token = localStorage.getItem('token');
|
||||
const response = await axios.get(`${this.baseUrl}/getInfo`, {
|
||||
headers: {
|
||||
Authorization: `Token ${token}`,
|
||||
},
|
||||
});
|
||||
|
||||
this.userData = {
|
||||
...response.data.data,
|
||||
others: response.data.data.others || [],
|
||||
};
|
||||
|
||||
// فیلتر فایل‌های اخیر (24 ساعت گذشته)
|
||||
const oneDayAgo = new Date();
|
||||
oneDayAgo.setHours(oneDayAgo.getHours() - 24);
|
||||
this.recentFiles = [
|
||||
...this.userData.images.map(file => ({ ...file, type: 'image' })),
|
||||
...this.userData.pdfs.map(file => ({ ...file, type: 'pdf' })),
|
||||
...this.userData.videos.map(file => ({ ...file, type: 'video' })),
|
||||
...this.userData.glbs.map(file => ({ ...file, type: 'glb' })),
|
||||
...this.userData.others.map(file => ({ ...file, type: 'other' })),
|
||||
].filter(file => new Date(file.created_at) >= oneDayAgo);
|
||||
} catch (error) {
|
||||
console.error('Error fetching user data:', error);
|
||||
this.recentFiles = [];
|
||||
}
|
||||
},
|
||||
getFilePreviewImage(type, file) {
|
||||
switch (type) {
|
||||
case 'image':
|
||||
return this.getFullFileUrl(file.image);
|
||||
case 'pdf':
|
||||
return 'https://cdn-icons-png.flaticon.com/512/337/337946.png';
|
||||
case 'video':
|
||||
return 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTfQ1L9b8tFaGXBQxOdCCaq-AcYkmawPtRVZA&s';
|
||||
case 'glb':
|
||||
return 'https://images.freeimages.com/clg/istock/previews/1024/102424081-icon-3d-modeling.jpg'; // URL ثابت برای مدل سه‌بعدی
|
||||
case 'other':
|
||||
return 'https://cdn-icons-png.flaticon.com/512/186/186159.png';
|
||||
default:
|
||||
return '';
|
||||
}
|
||||
},
|
||||
getFullFileUrl(relativePath) {
|
||||
if (!relativePath) return '';
|
||||
return `${this.baseUrl}${relativePath}`;
|
||||
},
|
||||
formatDate(dateString) {
|
||||
if (!dateString) return '';
|
||||
const date = new Date(dateString);
|
||||
return date.toLocaleDateString('fa-IR');
|
||||
},
|
||||
createNewMeeting(meetingData) {
|
||||
this.meetings.push({
|
||||
title: meetingData.title,
|
||||
|
|
@ -232,8 +294,28 @@ export default {
|
|||
closeDialog() {
|
||||
this.isNewFileDialogOpen = false;
|
||||
},
|
||||
fetchUserData() {
|
||||
console.log('Fetching user data');
|
||||
openPreviewDialog(type, index, url, id) {
|
||||
this.currentPreviewType = type;
|
||||
this.currentPreviewIndex = id;
|
||||
this.previewUrl = url;
|
||||
|
||||
if (type === 'video') {
|
||||
this.videoOptions.sources[0].src = url;
|
||||
}
|
||||
|
||||
this.isPreviewDialogOpen = true;
|
||||
},
|
||||
closePreviewDialog() {
|
||||
this.isPreviewDialogOpen = false;
|
||||
this.previewUrl = '';
|
||||
this.currentPreviewIndex = null;
|
||||
this.currentPreviewType = null;
|
||||
},
|
||||
goToDownloads() {
|
||||
this.$router.push('/dashboard/download');
|
||||
},
|
||||
goToTeams() {
|
||||
this.$router.push('/dashboard/teams');
|
||||
},
|
||||
},
|
||||
};
|
||||
|
|
@ -348,12 +430,22 @@ export default {
|
|||
|
||||
.card-image {
|
||||
width: 100%;
|
||||
height: 120px;
|
||||
height: 172px;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
border-radius: 14px 14px 0 0;
|
||||
}
|
||||
|
||||
.file-pdf,.file-video,.file-glb {
|
||||
background-size: contain !important;
|
||||
background-repeat: no-repeat;
|
||||
margin-top: 0.8rem;
|
||||
height: 160px;
|
||||
width: 8rem !important;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.card-content {
|
||||
padding: 12px 10px 8px;
|
||||
}
|
||||
|
|
@ -499,6 +591,16 @@ export default {
|
|||
height: 172px;
|
||||
}
|
||||
|
||||
.file-pdf,.file-video,.file-glb {
|
||||
background-size: contain !important;
|
||||
background-repeat: no-repeat;
|
||||
margin-top: 0.8rem;
|
||||
height: 160px;
|
||||
width: 8rem !important;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.card-content {
|
||||
padding: 8px 16px 16px;
|
||||
}
|
||||
|
|
@ -564,17 +666,32 @@ export default {
|
|||
height: 172px;
|
||||
}
|
||||
|
||||
.file-pdf,.file-video,.file-glb {
|
||||
background-size: contain !important;
|
||||
background-repeat: no-repeat;
|
||||
margin-top: 0.8rem;
|
||||
height: 160px;
|
||||
width: 8rem !important;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.card-content {
|
||||
padding: 8px 16px 16px;
|
||||
}
|
||||
|
||||
.card-content h3 {
|
||||
font-size: 15px;
|
||||
font-size: 20px;
|
||||
line-height: 190%;
|
||||
}
|
||||
|
||||
.date-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
}
|
||||
|
||||
.meeting-date span {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.file-buttons {
|
||||
|
|
@ -630,17 +747,32 @@ export default {
|
|||
height: 172px;
|
||||
}
|
||||
|
||||
.file-pdf,.file-video,.file-glb {
|
||||
background-size: contain !important;
|
||||
background-repeat: no-repeat;
|
||||
margin-top: 0.8rem;
|
||||
height: 160px;
|
||||
width: 8rem !important;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.card-content {
|
||||
padding: 8px 16px 16px;
|
||||
}
|
||||
|
||||
.card-content h3 {
|
||||
font-size: 15px;
|
||||
font-size: 20px;
|
||||
line-height: 190%;
|
||||
}
|
||||
|
||||
.date-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
}
|
||||
|
||||
.meeting-date span {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.file-buttons {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,3 @@
|
|||
<!-- DashboardPage.vue -->
|
||||
<template>
|
||||
<div>
|
||||
<!-- Description -->
|
||||
|
|
@ -153,6 +152,10 @@ export default {
|
|||
created() {
|
||||
this.fetchUserData();
|
||||
this.fetchTeamMemberInfo();
|
||||
const tab = this.$route.query.tab;
|
||||
if (tab) {
|
||||
this.activeTab = tab;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
changeTab(tabName) {
|
||||
|
|
@ -468,6 +471,13 @@ export default {
|
|||
}
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
'$route.query.tab'(newTab) {
|
||||
if (newTab) {
|
||||
this.activeTab = newTab;
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user