Compare commits

..

No commits in common. "ad3a84b0d8667e9fb19ec22dd2a4473e6e652a37" and "94e8b089a956ca0e4967b565840fa73b3d169a96" have entirely different histories.

5 changed files with 182 additions and 378 deletions

View File

@ -20,7 +20,6 @@
</div>
</template>
<script>
import AppHeader from '@/components/Header.vue';
import SidebarMenu from '@/components/SidebarMenu.vue';
@ -47,20 +46,10 @@ export default {
toggleSidebar() {
this.isSidebarOpen = !this.isSidebarOpen;
}
},
mounted() {
const content = document.querySelector('.content');
if (content) {
content.addEventListener('scroll', () => {
document.body.scrollTop = content.scrollTop;
document.documentElement.scrollTop = content.scrollTop;
});
}
}
};
</script>
<style scoped>
/* Reset default margins and set base font */
body {
@ -68,15 +57,12 @@ body {
padding: 0;
font-family: 'Yekan', 'Arial', sans-serif;
background-color: #f4f7fa;
overflow-x: hidden;
overflow-y: auto;
height: 100%;
}
/* App title styling */
.app-title {
color: #fff;
font-size: 2rem;
font-size: 2rem; /* 32px, using rem for scalability */
font-weight: 700;
margin: 0;
}
@ -86,14 +72,12 @@ body {
display: flex;
flex-direction: column;
min-height: 100vh;
overflow-y: auto;
}
/* Router view content */
router-view {
flex-grow: 1;
padding: 1.25rem;
padding: 1.25rem; /* 20px, using rem for consistency */
}
</style>
@ -106,7 +90,7 @@ router-view {
src: url('@/assets/fonts/IRANSansXFaNum-Medium.ttf') format('truetype');
font-weight: 500;
font-style: normal;
font-display: swap;
font-display: swap; /* Improves font loading performance */
}
/* Global Font Application */
@ -122,14 +106,6 @@ router-view {
flex-direction: column;
gap: 32px;
padding: 35px 80px;
height: 100vh;
overflow-y: scroll;
box-sizing: border-box;
}
.content::-webkit-scrollbar {
width: 0;
display: none;
}
/* Responsive Styles */

View File

@ -416,8 +416,6 @@ export default {
endHour: 18,
endMinute: 0,
selectedRoom: null,
space: null,
asset_bundle: null,
use_space: false,
},
participants: [],
@ -433,9 +431,8 @@ export default {
return JSON.parse(localStorage.getItem('customer') || '{}');
},
fullName() {
return this.customer.first_name && this.customer.last_name
? `${this.customer.first_name} ${this.customer.last_name}`
: 'کاربر مهمان';
const user = JSON.parse(localStorage.getItem('user') || '{}');
return user.first_name && user.last_name ? `${user.first_name} ${user.last_name}` : 'کاربر مهمان';
},
userPhone() {
return this.customer.mobile_number || 'شماره تلفن موجود نیست';
@ -517,8 +514,6 @@ export default {
},
handleRoomSelection(room) {
this.form.selectedRoom = room;
this.form.space = room.space;
this.form.asset_bundle = room.asset_bundle;
this.form.use_space = room.use_space;
this.isRoomSelectionOpen = false;
},
@ -578,8 +573,6 @@ export default {
endHour: 18,
endMinute: 0,
selectedRoom: null,
space: null,
asset_bundle: null,
use_space: false,
};
this.participants = [];
@ -600,7 +593,7 @@ export default {
this.error = 'لطفاً نام جلسه و تاریخ را وارد کنید.';
return;
}
if (!this.form.selectedRoom || this.form.space === null || this.form.asset_bundle === null) {
if (!this.form.selectedRoom) {
this.error = 'لطفاً یک اتاق برای جلسه انتخاب کنید.';
return;
}
@ -619,18 +612,16 @@ export default {
.clone()
.set({ hour: this.form.startHour, minute: this.form.startMinute, second: 0 })
.toISOString();
try {
const meetingData = {
name: this.form.title,
description: this.form.description,
date_time: startDateTime,
space: this.form.space,
asset_bundle: this.form.asset_bundle,
space: this.form.selectedRoom.id,
asset_bundle: 1,
use_space: this.form.use_space,
user_ids: [this.userId, ...this.participants.map((p) => p.id)],
};
try {
this.$emit('create-meeting', meetingData);
this.closeModalByButton();
} catch (error) {

View File

@ -1,4 +1,3 @@
<!-- RoomSelectionModal.vue -->
<template>
<div v-if="isOpen" class="modal-overlay" @click="cancel">
<div class="modal-content" @click.stop>
@ -344,7 +343,7 @@ export default {
async fetchSpaces() {
try {
const token = localStorage.getItem('token');
if (!token) throw new Error();
if (!token) throw new Error('توکن احراز هویت پیدا نشد');
const response = await axios.get(`${API_BASE_URL}/get_space`, {
headers: { Authorization: `Token ${token.trim()}` },
@ -352,7 +351,6 @@ export default {
this.rooms = response.data.spaces.map((space) => ({
id: space.id,
assetBundleRoomId: space.assetBundleRoomId?.id,
image: space.assetBundleRoomId?.img
? `${API_BASE_URL}${space.assetBundleRoomId.img}`
: DEFAULT_IMAGE,
@ -363,6 +361,7 @@ export default {
}));
} catch (error) {
if (error.response?.status === 403) {
alert('لطفاً دوباره وارد شوید');
window.location.href = '/login';
}
this.error = 'خطا در بارگذاری لیست اتاق‌ها';
@ -371,7 +370,7 @@ export default {
async fetchTemporaryRooms() {
try {
const token = localStorage.getItem('token');
if (!token) throw new Error();
if (!token) throw new Error('توکن احراز هویت پیدا نشد');
const response = await axios.get(`${API_BASE_URL}/get_assigned_assetbundle_rooms`, {
headers: { Authorization: `Token ${token.trim()}` },
@ -387,6 +386,7 @@ export default {
}));
} catch (error) {
if (error.response?.status === 403) {
alert('لطفاً دوباره وارد شوید');
window.location.href = '/login';
}
this.error = 'خطا در بارگذاری لیست اتاق‌های موقت';
@ -401,42 +401,24 @@ export default {
},
submitRoom() {
if (!this.selectedRoom) {
alert('لطفاً یک اتاق انتخاب کنید.');
return;
}
const selectedRoomDetails = [...this.rooms, ...this.temporaryRooms].find(
(room) => room.id === this.selectedRoom
);
if (!selectedRoomDetails) {
return;
}
let roomData;
if (selectedRoomDetails.isTemporary) {
roomData = {
this.$emit('submit-room', {
...selectedRoomDetails,
space: 18,
asset_bundle: selectedRoomDetails.id,
use_space: false,
};
} else {
if (!selectedRoomDetails.assetBundleRoomId) {
return;
}
roomData = {
...selectedRoomDetails,
space: selectedRoomDetails.id,
asset_bundle: selectedRoomDetails.assetBundleRoomId,
use_space: true,
};
}
this.$emit('submit-room', roomData);
id: selectedRoomDetails.isTemporary ? 12 : selectedRoomDetails.id,
use_space: !selectedRoomDetails.isTemporary,
});
this.selectedRoom = null;
},
},
};
</script>
<style scoped>
.modal-overlay {
position: fixed;

View File

@ -1,6 +1,7 @@
<template>
<div>
<!-- Top Header -->
<AppHeader pageTitle="دانلود ها" />
<!-- Description -->
<div class="section-description">
@ -73,109 +74,127 @@ export default {
<style scoped>
/* Base styles applied across all screen sizes */
.section-title {
font-weight: 700;
color: #101010;
font-size: 19px;
line-height: 26.6px;
/* .dashboard-page {
margin-right: 360px;
padding: 20px;
direction: rtl;
font-family: IRANSansXFaNum, sans-serif;
}
.section-description {
margin: 1rem 0 3rem;
.content {
background-color: #f8f9fa;
border-radius: 20px;
padding: 35px 80px;
display: flex;
flex-direction: column;
gap: 32px;
}
*/
.section-title {
font-size: 20px;
font-weight: 600;
color: #2d3748;
margin-top: 20px;
margin-bottom: 10px;
}
.section-description {
margin-bottom: 3rem;
margin-top: 1rem;
font-size: 20px;
font-weight: 600;
color: #2d3748;
margin: 1rem 0 3rem;
}
.section-description p {
line-height: 190%;
color: #4f5a69;
font-size: 15px;
color: #4F5A69;
font-size: 16px;
margin-top: 1rem;
font-weight: 500;
text-align: justify;
}
.chose-device {
margin: 1.5rem 0;
margin-top: 2rem;
margin-bottom: 2rem;
}
.cards {
display: flex;
flex-direction: column;
justify-content: right;
align-items: center;
margin-top: 1.5rem;
gap: 1rem;
margin-top: 2.5rem;
}
.card-border {
background: linear-gradient(to right, #001940, #4364F7);
padding: 2px 1px;
border-radius: 20px;
width: 287px;
height: 442px;
margin-left: 2.5rem;
}
.platform-card {
position: relative;
width: 100%;
max-width: 300px;
height: auto;
min-height: 320px;
width: 287px;
height: 442px;
border-radius: 20px;
background: white;
z-index: 0;
overflow: hidden;
margin: 0;
isolation: isolate;
margin-left: 2.5rem;
}
.platform-card::before {
content: "";
position: absolute;
inset: 0;
padding: 2px;
padding: 2.5px;
border-radius: 20px;
background: linear-gradient(to right, #001940, #4364f7);
-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
background: linear-gradient(to right, #001940, #4364F7);
-webkit-mask:
linear-gradient(#000 0 0) content-box,
linear-gradient(#000 0 0);
-webkit-mask-composite: xor;
mask-composite: exclude;
z-index: -1;
}
.card-objects {
text-align: center;
padding: 1.5rem 0;
padding: 2.5rem 0px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
height: 100%;
min-height: 320px;
gap: 1rem;
}
.card-title {
font-size: 20px;
font-size: 24px;
font-weight: 500;
}
.card-subtitle {
font-size: 15px;
font-size: 17px;
font-weight: 500;
color : #718096;
max-width: 80%;
line-height: 190%;
max-width: 220px;
}
.active-button {
position: relative;
width: 80%;
max-width: 207px;
width: 207px;
height: 46px;
border-radius: 8px;
background: white;
z-index: 0;
overflow: hidden;
color: black;
font-size: 15px;
font-size: 17px;
font-weight: 500;
display: flex;
align-items: center;
justify-content: center;
transition: background 0.8s ease, color 0.3s ease-in-out;
padding-top: 5%;
transition: background 0.8s ease, color 0.6s ease-in-out;
}
.active-button::before {
@ -184,162 +203,35 @@ export default {
inset: 0;
padding: 1px;
border-radius: 8px;
background: linear-gradient(to right, #001940, #4364f7);
-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
background: linear-gradient(to right, #001940, #4364F7);
-webkit-mask:
linear-gradient(#000 0 0) content-box,
linear-gradient(#000 0 0);
-webkit-mask-composite: xor;
mask-composite: exclude;
z-index: 0;
z-index: -1;
}
.active-button:hover {
background: linear-gradient(to right, #001940, #4364F7);
color: #fff;
background: linear-gradient(to right, #001940, #4364f7);
}
.disabled-button {
width: 80%;
max-width: 207px;
width: 207px;
height: 46px;
color: #111;
background-color: #e6e6e6;
background-color: #E6E6E6;
border-radius: 8px;
font-size: 15px;
font-size: 17px;
font-weight: 500;
display: flex;
align-items: center;
justify-content: center;
}
.instructions-text {
font-size: 14px;
font-weight: 600;
color: #4f5a69;
display: block;
text-align: center;
margin-top: 1.5rem;
}
/* Media Query for Tablets (600px < width ≤ 1024px) */
@media (min-width: 600px) and (max-width: 1024px) {
.section-description {
font-size: 20px;
margin-bottom: 3rem;
}
.section-description p {
font-size: 16px;
}
.cards {
flex-direction: row;
justify-content: center;
gap: 2rem;
}
.platform-card {
width: 287px;
height: 442px;
min-height: auto;
}
.platform-card::before {
padding: 2.5px;
}
.card-title {
font-size: 24px;
}
.card-subtitle {
font-size: 17px;
max-width: 220px;
}
.active-button,
.disabled-button {
font-size: 17px;
padding-top: 5%;
}
.instructions-text {
font-size: 15px;
}
}
/* Media Query for Small Desktops (1024px <س width ≤ 1280px) */
@media (min-width: 1024px) and (max-width: 1280px) {
.section-title {
font-size: 20px;
font-weight: 600;
color: #101010;
margin: 20px 0 10px;
}
.cards {
flex-direction: row;
justify-content: center;
gap: 2rem;
}
.platform-card {
width: 287px;
height: 442px;
margin-left: 0;
}
.platform-card::before {
padding: 2.5px;
}
.card-title {
font-size: 24px;
}
.card-subtitle {
font-size: 17px;
max-width: 220px;
}
.active-button,
.disabled-button {
font-size: 17px;
}
}
/* Media Query for Large Desktops (width > 1280px) */
@media (min-width: 1280px) {
.section-title {
font-size: 21px;
}
.cards {
flex-direction: row;
justify-content: flex-start;
gap: 2rem;
}
.platform-card {
width: 287px;
height: 442px;
margin-left: 0;
}
.platform-card::before {
padding: 2.5px;
}
.card-title {
font-size: 24px;
}
.card-subtitle {
font-size: 17px;
max-width: 220px;
}
.active-button,
.disabled-button {
font-size: 17px;
}
color: #4F5A69;
}
</style>

View File

@ -107,7 +107,6 @@
</div>
</div>
<swiper
ref="swiper"
:slides-per-view="1.4"
:space-between="10"
:loop="true"
@ -179,7 +178,6 @@
</div>
</template>
<script>
import CreateMeetingModal from '@/components/CreateMeetingModal.vue';
import { Swiper, SwiperSlide } from 'swiper/vue';
@ -194,7 +192,7 @@ export default {
components: {
Swiper,
SwiperSlide,
CreateMeetingModal,
CreateMeetingModal
},
data() {
return {
@ -202,74 +200,49 @@ export default {
activeFilter: 'future',
showModal: false,
modules: [Pagination],
meetings: [],
meetings: [
{
id: 1,
title: 'Interview room',
date: '2025-05-25T10:00:00',
image: require('@/assets/img/img.jpg'),
type: 'فضا تیم',
maxCapacity: 33,
},
{
id: 2,
title: 'جلسه بررسی پیشرفت',
date: '2025-05-18T14:00:00',
image: require('@/assets/img/img.jpg'),
type: 'مدیریتی',
maxCapacity: 8,
},
{
id: 3,
title: 'جلسه تیم فنی',
date: '2025-06-01T09:00:00',
image: require('@/assets/img/img.jpg'),
type: 'فنی',
maxCapacity: 12,
},
{
id: 4,
title: 'جلسه تیم طرای',
date: '2025-06-01T09:00:00',
image: require('@/assets/img/img.jpg'),
type: 'طراحی',
maxCapacity: 24,
},
],
filteredMeetings: [],
};
},
created() {
this.fetchMeetings();
this.filterMeetings();
},
methods: {
refreshSwiper() {
if (this.$refs.swiper && this.$refs.swiper.swiper) {
this.$refs.swiper.swiper.update();
}
},
async fetchMeetings() {
try {
let token = localStorage.getItem('token');
if (!token) throw new Error('توکن احراز هویت پیدا نشد');
const config = {
headers: {
'Content-Type': 'application/json',
Authorization: `Token ${token.trim()}`,
},
};
const response = await axios.get(`${API_BASE_URL}/get_user_meetings`, config).catch(async (error) => {
if (error.response?.status === 403) {
token = await this.refreshToken();
return axios.get(`${API_BASE_URL}/get_user_meetings`, {
headers: { ...config.headers, Authorization: `Token ${token.trim()}` },
});
}
throw error;
});
this.meetings = response.data.meetings.map((meeting) => {
const isSpaceUsed = meeting.use_space;
const imagePath = isSpaceUsed
? meeting.space_data?.assetBundleRoomId?.img
: meeting.asset_bundle_data?.img;
return {
id: meeting.id,
title: meeting.name,
date: meeting.date_time,
image: imagePath
? imagePath.startsWith('http')
? imagePath
: `${API_BASE_URL}${imagePath}`
: 'https://via.placeholder.com/150',
type: isSpaceUsed
? meeting.space_data?.name || 'جلسه'
: meeting.asset_bundle_data?.name || 'جلسه',
maxCapacity: isSpaceUsed
? meeting.space_data?.capacity || 10
: meeting.asset_bundle_data?.maxPerson || 10,
};
});
this.filterMeetings();
this.refreshSwiper();
} catch (error) {
alert(`خطایی در دریافت جلسات رخ داد: ${error.response?.data?.message || error.message}`);
}
},
filterMeetings() {
let filtered = this.meetings;
if (this.searchQuery) {
filtered = filtered.filter((meeting) =>
[meeting.title, meeting.type].some((field) =>
@ -277,11 +250,9 @@ export default {
)
);
}
if (this.activeFilter === 'future') {
filtered = filtered.filter((meeting) => new Date(meeting.date) > new Date());
}
this.filteredMeetings = filtered;
},
setFilter(filter) {
@ -314,7 +285,7 @@ export default {
},
};
await axios.post(`${API_BASE_URL}/add_meeting`, meetingData, config).catch(async (error) => {
let response = await axios.post(`${API_BASE_URL}/add_meeting`, meetingData, config).catch(async (error) => {
if (error.response?.status === 403) {
token = await this.refreshToken();
return axios.post(`${API_BASE_URL}/add_meeting`, meetingData, {
@ -324,8 +295,17 @@ export default {
throw error;
});
await new Promise((resolve) => setTimeout(resolve, 500));
await this.fetchMeetings();
const newMeeting = {
id: response.data.meeting.id,
title: response.data.meeting.name,
date: response.data.meeting.date_time,
image: 'https://via.placeholder.com/150',
type: 'جلسه',
maxCapacity: 10,
};
this.meetings.push(newMeeting);
this.filterMeetings();
this.showModal = false;
alert('جلسه با موفقیت ایجاد شد!');
} catch (error) {
@ -374,28 +354,18 @@ export default {
background-color: #ffffff;
}
.search-wrapper {
margin-top: 1rem;
position: relative;
display: inline-block;
width: 100%;
}
.search-wrapper::before {
content: '';
position: absolute;
top: -1px;
left: -1px;
right: -1px;
bottom: -1px;
padding: 1px;
padding-left: 0.7px;
padding-top: 1.4px;
border-radius: 10px;
background: linear-gradient(to right, #001940, #4364f7);
z-index: 0;
position: relative;
}
.search-input {
width: 100%;
width: 99.9%;
height: 43px;
padding: 10px;
border: none;
@ -404,13 +374,7 @@ export default {
box-sizing: border-box;
background-color: white;
display: block;
position: relative;
z-index: 1;
}
.search-button {
position: relative;
z-index: 1; /* Ensures the button stays above the pseudo-element */
margin: 0 auto;
}
.search-input::placeholder {
@ -526,7 +490,6 @@ export default {
.meeting-image {
border-radius: 10px;
object-fit: cover;
}
.swiper-meetings-list {