mirror of
https://github.com/Dadechin/XRoomDashboardFront.git
synced 2025-07-03 00:34:35 +00:00
add spaces API && fix APIs in Teams
This commit is contained in:
parent
d8a0da9986
commit
8f96b6a571
|
@ -1,4 +1,3 @@
|
||||||
// src/axios.js
|
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
|
|
||||||
const instance = axios.create({
|
const instance = axios.create({
|
||||||
|
|
|
@ -179,7 +179,6 @@ export default {
|
||||||
this.selectedPlan = null;
|
this.selectedPlan = null;
|
||||||
this.$emit('payment-success');
|
this.$emit('payment-success');
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('خطا در ارسال اطلاعات اشتراک:', error);
|
|
||||||
alert('خطا در ثبت اشتراک. لطفاً دوباره تلاش کنید.');
|
alert('خطا در ثبت اشتراک. لطفاً دوباره تلاش کنید.');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
|
@ -171,7 +171,7 @@
|
||||||
type="number"
|
type="number"
|
||||||
v-model.number="form.startHour"
|
v-model.number="form.startHour"
|
||||||
min="0"
|
min="0"
|
||||||
max="24"
|
max="23"
|
||||||
required
|
required
|
||||||
/>
|
/>
|
||||||
<button type="button" @click="decrementTime('startHour')">
|
<button type="button" @click="decrementTime('startHour')">
|
||||||
|
@ -259,7 +259,7 @@
|
||||||
type="number"
|
type="number"
|
||||||
v-model.number="form.endHour"
|
v-model.number="form.endHour"
|
||||||
min="0"
|
min="0"
|
||||||
max="24"
|
max="23"
|
||||||
required
|
required
|
||||||
/>
|
/>
|
||||||
<button type="button" @click="decrementTime('endHour')">
|
<button type="button" @click="decrementTime('endHour')">
|
||||||
|
@ -284,9 +284,9 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label style="font-size: 19px; font-weight: 600;">اتاقهای جلسات</label>
|
<label style="font-size: 19px; font-weight: 600;">اتاق جلسه</label>
|
||||||
<div class="rooms-selecter">
|
<div class="rooms-selecter">
|
||||||
<span>{{ form.selectedRooms.length }} انتخاب شده</span>
|
<span>{{ form.selectedRoom ? '0 اتاق انتخاب شده' : '0 اتاق انتخاب شده' }}</span>
|
||||||
<button type="button" @click="openRoomSelection" style="cursor: pointer;">انتخاب اتاق جلسه</button>
|
<button type="button" @click="openRoomSelection" style="cursor: pointer;">انتخاب اتاق جلسه</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -297,8 +297,8 @@
|
||||||
میتوانید به مجری اجازه بدهید تا ابزارهایی برای مدیریت این جلسه و همچنین ابزارهایی برای مدیریت مجوزها در طول جلسه به او بدهد.
|
میتوانید به مجری اجازه بدهید تا ابزارهایی برای مدیریت این جلسه و همچنین ابزارهایی برای مدیریت مجوزها در طول جلسه به او بدهد.
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="presenter">
|
<div class="presenter">
|
||||||
<div style="display: flex;align-items: center;height: 100%;">
|
<div style="display: flex; align-items: center; height: 100%;">
|
||||||
<div class="avatar-wrapper">
|
<div class="avatar-wrapper">
|
||||||
<img class="user-avatar" :src="profileIcon" />
|
<img class="user-avatar" :src="profileIcon" />
|
||||||
</div>
|
</div>
|
||||||
|
@ -361,7 +361,7 @@
|
||||||
<RoomSelectionModal
|
<RoomSelectionModal
|
||||||
:is-open="isRoomSelectionOpen"
|
:is-open="isRoomSelectionOpen"
|
||||||
@close="isRoomSelectionOpen = false"
|
@close="isRoomSelectionOpen = false"
|
||||||
@submit-rooms="handleRoomSelection"
|
@submit-room="handleRoomSelection"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -392,7 +392,7 @@ export default {
|
||||||
startMinute: 0,
|
startMinute: 0,
|
||||||
endHour: 18,
|
endHour: 18,
|
||||||
endMinute: 0,
|
endMinute: 0,
|
||||||
selectedRooms: [],
|
selectedRoom: null,
|
||||||
},
|
},
|
||||||
participants: [],
|
participants: [],
|
||||||
newParticipantPhone: '',
|
newParticipantPhone: '',
|
||||||
|
@ -402,6 +402,10 @@ export default {
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
customer() {
|
||||||
|
// دریافت اطلاعات کاربر از localStorage با کلید customer
|
||||||
|
return JSON.parse(localStorage.getItem('customer') || '{}');
|
||||||
|
},
|
||||||
fullName() {
|
fullName() {
|
||||||
const user = JSON.parse(localStorage.getItem('user') || '{}');
|
const user = JSON.parse(localStorage.getItem('user') || '{}');
|
||||||
return user.first_name && user.last_name
|
return user.first_name && user.last_name
|
||||||
|
@ -409,15 +413,18 @@ export default {
|
||||||
: 'کاربر مهمان';
|
: 'کاربر مهمان';
|
||||||
},
|
},
|
||||||
userPhone() {
|
userPhone() {
|
||||||
return '09123456789'; // شماره تلفن کاربر اصلی (میتوانید از localStorage یا منبع دیگری بگیرید)
|
return 3;
|
||||||
},
|
},
|
||||||
userRole() {
|
userRole() {
|
||||||
return 'مجری';
|
return this.customer.semat || 'مجری';
|
||||||
},
|
},
|
||||||
profileIcon() {
|
profileIcon() {
|
||||||
const customer = JSON.parse(localStorage.getItem('customer') || '{}');
|
return this.customer.profile_img || this.defaultProfileIcon;
|
||||||
return customer.profile_img || this.defaultProfileIcon;
|
|
||||||
},
|
},
|
||||||
|
userId() {
|
||||||
|
const customer = JSON.parse(localStorage.getItem('customer') || '{}');
|
||||||
|
return customer.id || null;
|
||||||
|
}
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
isOpen(newVal) {
|
isOpen(newVal) {
|
||||||
|
@ -442,8 +449,8 @@ export default {
|
||||||
openRoomSelection() {
|
openRoomSelection() {
|
||||||
this.isRoomSelectionOpen = true;
|
this.isRoomSelectionOpen = true;
|
||||||
},
|
},
|
||||||
handleRoomSelection(rooms) {
|
handleRoomSelection(room) {
|
||||||
this.form.selectedRooms = rooms;
|
this.form.selectedRoom = room;
|
||||||
this.isRoomSelectionOpen = false;
|
this.isRoomSelectionOpen = false;
|
||||||
},
|
},
|
||||||
addParticipant() {
|
addParticipant() {
|
||||||
|
@ -471,8 +478,7 @@ export default {
|
||||||
this.participants = this.participants.filter((p) => p.phone !== phone);
|
this.participants = this.participants.filter((p) => p.phone !== phone);
|
||||||
},
|
},
|
||||||
validatePhone(phone) {
|
validatePhone(phone) {
|
||||||
// اعتبارسنجی شماره تلفن (مثال: فرمت شماره تلفن ایرانی)
|
return /^09[0-9]{9}$/.test(phone);
|
||||||
return /^09[0-9]{9}$/.test(phone); // فرمت: 09XXXXXXXXX (11 رقم، شروع با 09)
|
|
||||||
},
|
},
|
||||||
closeModal() {
|
closeModal() {
|
||||||
this.$emit('close');
|
this.$emit('close');
|
||||||
|
@ -487,7 +493,7 @@ export default {
|
||||||
startMinute: 0,
|
startMinute: 0,
|
||||||
endHour: 18,
|
endHour: 18,
|
||||||
endMinute: 0,
|
endMinute: 0,
|
||||||
selectedRooms: [],
|
selectedRoom: null,
|
||||||
};
|
};
|
||||||
this.participants = [];
|
this.participants = [];
|
||||||
this.newParticipantPhone = '';
|
this.newParticipantPhone = '';
|
||||||
|
@ -516,7 +522,7 @@ export default {
|
||||||
this.form.endMinute--;
|
this.form.endMinute--;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
handleSubmit() {
|
async handleSubmit() {
|
||||||
if (!this.form.title || !this.form.date) {
|
if (!this.form.title || !this.form.date) {
|
||||||
this.error = 'لطفاً نام جلسه و تاریخ را وارد کنید.';
|
this.error = 'لطفاً نام جلسه و تاریخ را وارد کنید.';
|
||||||
return;
|
return;
|
||||||
|
@ -540,39 +546,36 @@ export default {
|
||||||
second: 0,
|
second: 0,
|
||||||
})
|
})
|
||||||
.toISOString();
|
.toISOString();
|
||||||
const endDateTime = momentDate
|
|
||||||
.clone()
|
try {
|
||||||
.set({
|
const userIds = [
|
||||||
hour: this.form.endHour,
|
...(this.userPhone ? [this.userPhone] : []),
|
||||||
minute: this.form.endMinute,
|
...this.participants.map((p) => p.phone),
|
||||||
second: 0,
|
];
|
||||||
})
|
|
||||||
.toISOString();
|
const meetingData = {
|
||||||
const meetingData = {
|
name: this.form.title,
|
||||||
title: this.form.title,
|
description: this.form.description,
|
||||||
description: this.form.description,
|
date_time: startDateTime,
|
||||||
startDateTime,
|
space: this.form.selectedRoom ? this.form.selectedRoom.id : null,
|
||||||
endDateTime,
|
asset_bundle: 1,
|
||||||
rooms: this.form.selectedRooms,
|
use_space: !!this.form.selectedRoom,
|
||||||
participants: [
|
user_ids: userIds,
|
||||||
...(this.userPhone ? [{ phone: this.userPhone, role: this.userRole }] : []),
|
};
|
||||||
...this.participants.map((p) => ({
|
|
||||||
phone: p.phone,
|
console.log('دادههای ارسالی به API:', JSON.stringify(meetingData, null, 2));
|
||||||
role: p.role,
|
|
||||||
})),
|
this.$emit('create-meeting', meetingData);
|
||||||
],
|
this.closeModal();
|
||||||
};
|
} catch (error) {
|
||||||
console.log('دادههای جلسه:', meetingData);
|
this.error = `خطا در آمادهسازی دادهها: ${error.message}`;
|
||||||
this.$emit('submit', meetingData);
|
console.error('خطا در handleSubmit:', error);
|
||||||
this.closeModal();
|
}
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.modal-overlay {
|
.modal-overlay {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
|
|
|
@ -208,9 +208,6 @@ export default {
|
||||||
updateBillingInfo(newBillingInfo) {
|
updateBillingInfo(newBillingInfo) {
|
||||||
this.billingInfo = { ...newBillingInfo };
|
this.billingInfo = { ...newBillingInfo };
|
||||||
},
|
},
|
||||||
manageMemberships() {
|
|
||||||
console.log('مدیریت عضویتها');
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
<div v-if="isOpen" class="modal-overlay" @click="cancel">
|
<div v-if="isOpen" class="modal-overlay" @click="cancel">
|
||||||
<div class="modal-content" @click.stop>
|
<div class="modal-content" @click.stop>
|
||||||
<div class="popUp-header">
|
<div class="popUp-header">
|
||||||
<h2>اتاقهای این جلسه را انتخاب کنید</h2>
|
<h2>اتاق این جلسه را انتخاب کنید</h2>
|
||||||
<button @click="cancel">
|
<button @click="cancel">
|
||||||
<svg
|
<svg
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
@ -32,15 +32,15 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="popUp-title">
|
<div class="popUp-title">
|
||||||
<h2>فضاها</h2>
|
<h2>فضاها</h2>
|
||||||
<span>اجازه دسترسی به این اتاقهای تیم را بدهید</span>
|
<span>یک اتاق برای این جلسه انتخاب کنید</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="rooms-list">
|
<div class="rooms-list" v-if="rooms.length > 0">
|
||||||
<div
|
<div
|
||||||
v-for="room in rooms"
|
v-for="room in rooms"
|
||||||
:key="room.id"
|
:key="room.id"
|
||||||
class="room-item"
|
class="room-item"
|
||||||
:class="{ selected: selectedRooms.includes(room.id) }"
|
:class="{ selected: selectedRoom === room.id }"
|
||||||
@click="toggleRoomSelection(room.id)"
|
@click="selectRoom(room.id)"
|
||||||
>
|
>
|
||||||
<img
|
<img
|
||||||
:src="room.image"
|
:src="room.image"
|
||||||
|
@ -48,6 +48,7 @@
|
||||||
class="room-image"
|
class="room-image"
|
||||||
width="120px"
|
width="120px"
|
||||||
height="120px"
|
height="120px"
|
||||||
|
@error="room.image = 'https://via.placeholder.com/150'"
|
||||||
/>
|
/>
|
||||||
<div class="room-details" style="margin-right: 10px;">
|
<div class="room-details" style="margin-right: 10px;">
|
||||||
<h3 class="room-title">{{ room.name }}</h3>
|
<h3 class="room-title">{{ room.name }}</h3>
|
||||||
|
@ -164,145 +165,149 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="Temporaryrooms.length > 0">
|
<div v-else>
|
||||||
<div class="popUp-title">
|
<span>هیچ فضایی یافت نشد.</span>
|
||||||
<h2>اتاقهای موقت</h2>
|
|
||||||
<span>اتاقهای موقت ایجادشده برای این جلسه</span>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="temporary-rooms-list">
|
<div v-if="temporaryRooms.length > 0">
|
||||||
<div
|
<div class="popUp-title">
|
||||||
v-for="room in Temporaryrooms"
|
<h2>اتاقهای موقت</h2>
|
||||||
:key="room.id"
|
<span>اتاقهای موقت ایجادشده برای این جلسه</span>
|
||||||
class="room-item"
|
</div>
|
||||||
:class="{ selected: selectedRooms.includes(room.id) }"
|
<div class="temporary-rooms-list">
|
||||||
@click="toggleRoomSelection(room.id)"
|
<div
|
||||||
>
|
v-for="room in temporaryRooms"
|
||||||
<img
|
:key="room.id"
|
||||||
:src="room.image"
|
class="room-item"
|
||||||
alt="Room Image"
|
:class="{ selected: selectedRoom === room.id }"
|
||||||
class="room-image"
|
@click="selectRoom(room.id)"
|
||||||
width="120px"
|
>
|
||||||
height="120px"
|
<img
|
||||||
/>
|
:src="room.image"
|
||||||
<div class="room-details" style="margin-right: 10px;">
|
alt="Room Image"
|
||||||
<h3 class="room-title">{{ room.name }}</h3>
|
class="room-image"
|
||||||
<p class="room-capacity">
|
width="120px"
|
||||||
<span style="margin-left: 4px;">
|
height="120px"
|
||||||
<svg
|
@error="room.image = 'https://via.placeholder.com/150'"
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
/>
|
||||||
width="16"
|
<div class="room-details" style="margin-right: 10px;">
|
||||||
height="17"
|
<h3 class="room-title">{{ room.name }}</h3>
|
||||||
viewBox="0 0 16 17"
|
<p class="room-capacity">
|
||||||
fill="none"
|
<span style="margin-left: 4px;">
|
||||||
>
|
<svg
|
||||||
<g clip-path="url(#clip0_622_1334)">
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
width="16"
|
||||||
|
height="17"
|
||||||
|
viewBox="0 0 16 17"
|
||||||
|
fill="none"
|
||||||
|
>
|
||||||
|
<g clip-path="url(#clip0_622_1334)">
|
||||||
|
<path
|
||||||
|
d="M3.33203 5.16667C3.33203 5.87391 3.61298 6.55219 4.11308 7.05228C4.61318 7.55238 5.29145 7.83333 5.9987 7.83333C6.70594 7.83333 7.38422 7.55238 7.88432 7.05228C8.38441 6.55219 8.66536 5.87391 8.66536 5.16667C8.66536 4.45942 8.38441 3.78115 7.88432 3.28105C7.38422 2.78095 6.70594 2.5 5.9987 2.5C5.29145 2.5 4.61318 2.78095 4.11308 3.28105C3.61298 3.78115 3.33203 4.45942 3.33203 5.16667Z"
|
||||||
|
stroke="#718096"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M2 14.5V13.1667C2 12.4594 2.28095 11.7811 2.78105 11.281C3.28115 10.781 3.95942 10.5 4.66667 10.5H7.33333C8.04058 10.5 8.71885 10.781 9.21895 11.281C9.71905 11.7811 10 12.4594 10 13.1667V14.5"
|
||||||
|
stroke="#718096"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M10.668 2.58667C11.2416 2.73354 11.75 3.06714 12.1131 3.53488C12.4761 4.00262 12.6732 5.17 12.6732 5.17C12.6732 5.76212 12.4761 6.33739 12.1131 6.80513C11.75 7.27287 11.2416 7.60647 10.668 7.75334"
|
||||||
|
stroke="#718096"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M14 14.5V13.1666C13.9966 12.5781 13.7986 12.0072 13.4368 11.5429C13.0751 11.0786 12.5699 10.7471 12 10.6"
|
||||||
|
stroke="#718096"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<clipPath id="clip0_622_1334">
|
||||||
|
<rect width="16" height="16" fill="white" transform="translate(0 0.5)" />
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
حداکثر: {{ room.capacity }} کاربر
|
||||||
|
</p>
|
||||||
|
<p class="room-type">
|
||||||
|
<span style="margin-left: 4px;">
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
width="16"
|
||||||
|
height="17"
|
||||||
|
viewBox="0 0 16 17"
|
||||||
|
fill="none"
|
||||||
|
>
|
||||||
<path
|
<path
|
||||||
d="M3.33203 5.16667C3.33203 5.87391 3.61298 6.55219 4.11308 7.05228C4.61318 7.55238 5.29145 7.83333 5.9987 7.83333C6.70594 7.83333 7.38422 7.55238 7.88432 7.05228C8.38441 6.55219 8.66536 5.87391 8.66536 5.16667C8.66536 4.45942 8.38441 3.78115 7.88432 3.28105C7.38422 2.78095 6.70594 2.5 5.9987 2.5C5.29145 2.5 4.61318 2.78095 4.11308 3.28105C3.61298 3.78115 3.33203 4.45942 3.33203 5.16667Z"
|
d="M4 15.1667V3.16671C4 2.81309 4.14048 2.47395 4.39052 2.2239C4.64057 1.97385 4.97971 1.83337 5.33333 1.83337H10.6667C11.0203 1.83337 11.3594 1.97385 11.6095 2.2239C11.8595 2.47395 12 2.81309 12 3.16671V15.1667H4Z"
|
||||||
stroke="#718096"
|
stroke="#3A57E8"
|
||||||
stroke-width="1.5"
|
stroke-width="1.25"
|
||||||
stroke-linecap="round"
|
stroke-linecap="round"
|
||||||
stroke-linejoin="round"
|
stroke-linejoin="round"
|
||||||
/>
|
/>
|
||||||
<path
|
<path
|
||||||
d="M2 14.5V13.1667C2 12.4594 2.28095 11.7811 2.78105 11.281C3.28115 10.781 3.95942 10.5 4.66667 10.5H7.33333C8.04058 10.5 8.71885 10.781 9.21895 11.281C9.71905 11.7811 10 12.4594 10 13.1667V14.5"
|
d="M3.9987 8.5H2.66536C2.31174 8.5 1.9726 8.64048 1.72256 8.89052C1.47251 9.14057 1.33203 9.47971 1.33203 9.83333V13.8333C1.33203 14.187 1.47251 14.5261 1.72256 14.7761C1.9726 15.0262 2.31174 15.1667 2.66536 15.1667H3.9987"
|
||||||
stroke="#718096"
|
stroke="#3A57E8"
|
||||||
stroke-width="1.5"
|
stroke-width="1.25"
|
||||||
stroke-linecap="round"
|
stroke-linecap="round"
|
||||||
stroke-linejoin="round"
|
stroke-linejoin="round"
|
||||||
/>
|
/>
|
||||||
<path
|
<path
|
||||||
d="M10.668 2.58667C11.2416 2.73354 11.75 3.06714 12.1131 3.53488C12.4761 4.00262 12.6732 5.17 12.6732 5.17C12.6732 5.76212 12.4761 6.33739 12.1131 6.80513C11.75 7.27287 11.2416 7.60647 10.668 7.75334"
|
d="M12 6.5H13.3333C13.687 6.5 14.0261 6.64048 14.2761 6.89052C14.5262 7.14057 14.6667 7.47971 14.6667 7.83333V13.8333C14.6667 14.187 14.5262 14.5261 14.2761 14.7761C14.0261 15.0262 13.687 15.1667 13.3333 15.1667H12"
|
||||||
stroke="#718096"
|
stroke="#3A57E8"
|
||||||
stroke-width="1.5"
|
stroke-width="1.25"
|
||||||
stroke-linecap="round"
|
stroke-linecap="round"
|
||||||
stroke-linejoin="round"
|
stroke-linejoin="round"
|
||||||
/>
|
/>
|
||||||
<path
|
<path
|
||||||
d="M14 14.5V13.1666C13.9966 12.5781 13.7986 12.0072 13.4368 11.5429C13.0751 11.0786 12.5699 10.7471 12 10.6"
|
d="M6.66797 4.5H9.33464"
|
||||||
stroke="#718096"
|
stroke="#3A57E8"
|
||||||
stroke-width="1.5"
|
stroke-width="1.25"
|
||||||
stroke-linecap="round"
|
stroke-linecap="round"
|
||||||
stroke-linejoin="round"
|
stroke-linejoin="round"
|
||||||
/>
|
/>
|
||||||
</g>
|
<path
|
||||||
<defs>
|
d="M6.66797 7.16663H9.33464"
|
||||||
<clipPath id="clip0_622_1334">
|
stroke="#3A57E8"
|
||||||
<rect width="16" height="16" fill="white" transform="translate(0 0.5)" />
|
stroke-width="1.25"
|
||||||
</clipPath>
|
stroke-linecap="round"
|
||||||
</defs>
|
stroke-linejoin="round"
|
||||||
</svg>
|
/>
|
||||||
</span>
|
<path
|
||||||
حداکثر: {{ room.capacity }} کاربر
|
d="M6.66797 9.83337H9.33464"
|
||||||
</p>
|
stroke="#3A57E8"
|
||||||
<p class="room-type">
|
stroke-width="1.25"
|
||||||
<span style="margin-left: 4px;">
|
stroke-linecap="round"
|
||||||
<svg
|
stroke-linejoin="round"
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
/>
|
||||||
width="16"
|
<path
|
||||||
height="17"
|
d="M6.66797 12.5H9.33464"
|
||||||
viewBox="0 0 16 17"
|
stroke="#3A57E8"
|
||||||
fill="none"
|
stroke-width="1.25"
|
||||||
>
|
stroke-linecap="round"
|
||||||
<path
|
stroke-linejoin="round"
|
||||||
d="M4 15.1667V3.16671C4 2.81309 4.14048 2.47395 4.39052 2.2239C4.64057 1.97385 4.97971 1.83337 5.33333 1.83337H10.6667C11.0203 1.83337 11.3594 1.97385 11.6095 2.2239C11.8595 2.47395 12 2.81309 12 3.16671V15.1667H4Z"
|
/>
|
||||||
stroke="#3A57E8"
|
</svg>
|
||||||
stroke-width="1.25"
|
</span>
|
||||||
stroke-linecap="round"
|
{{ room.type }}
|
||||||
stroke-linejoin="round"
|
</p>
|
||||||
/>
|
</div>
|
||||||
<path
|
|
||||||
d="M3.9987 8.5H2.66536C2.31174 8.5 1.9726 8.64048 1.72256 8.89052C1.47251 9.14057 1.33203 9.47971 1.33203 9.83333V13.8333C1.33203 14.187 1.47251 14.5261 1.72256 14.7761C1.9726 15.0262 2.31174 15.1667 2.66536 15.1667H3.9987"
|
|
||||||
stroke="#3A57E8"
|
|
||||||
stroke-width="1.25"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
/>
|
|
||||||
<path
|
|
||||||
d="M12 6.5H13.3333C13.687 6.5 14.0261 6.64048 14.2761 6.89052C14.5262 7.14057 14.6667 7.47971 14.6667 7.83333V13.8333C14.6667 14.187 14.5262 14.5261 14.2761 14.7761C14.0261 15.0262 13.687 15.1667 13.3333 15.1667H12"
|
|
||||||
stroke="#3A57E8"
|
|
||||||
stroke-width="1.25"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
/>
|
|
||||||
<path
|
|
||||||
d="M6.66797 4.5H9.33464"
|
|
||||||
stroke="#3A57E8"
|
|
||||||
stroke-width="1.25"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
/>
|
|
||||||
<path
|
|
||||||
d="M6.66797 7.16663H9.33464"
|
|
||||||
stroke="#3A57E8"
|
|
||||||
stroke-width="1.25"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
/>
|
|
||||||
<path
|
|
||||||
d="M6.66797 9.83337H9.33464"
|
|
||||||
stroke="#3A57E8"
|
|
||||||
stroke-width="1.25"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
/>
|
|
||||||
<path
|
|
||||||
d="M6.66797 12.5H9.33464"
|
|
||||||
stroke="#3A57E8"
|
|
||||||
stroke-width="1.25"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</span>
|
|
||||||
{{ room.type }}
|
|
||||||
</p>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
<div class="popUp-title">
|
<div class="popUp-title">
|
||||||
<h2>ایجاد اتاق موقت</h2>
|
<h2>ایجاد اتاق موقت</h2>
|
||||||
<span>اتاقهای موقت را فقط برای این جلسه ایجاد کنید</span>
|
<span>اتاق موقت را فقط برای این جلسه ایجاد کنید</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="temporary-room-form">
|
<div class="temporary-room-form">
|
||||||
<form @submit.prevent="createTemporaryRoom">
|
<form @submit.prevent="createTemporaryRoom">
|
||||||
|
@ -332,13 +337,15 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="form-actions">
|
<div class="form-actions">
|
||||||
<button type="button" class="cancel-button" @click="cancel">لغو</button>
|
<button type="button" class="cancel-button" @click="cancel">لغو</button>
|
||||||
<button type="button" class="submit-button" @click="submitRooms">تأیید</button>
|
<button type="button" class="submit-button" @click="submitRoom" :disabled="!selectedRoom">تأیید</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import axios from 'axios';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'RoomSelectionModal',
|
name: 'RoomSelectionModal',
|
||||||
props: {
|
props: {
|
||||||
|
@ -349,110 +356,77 @@ export default {
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
rooms: [
|
rooms: [],
|
||||||
{
|
temporaryRooms: [],
|
||||||
id: 1,
|
selectedRoom: null,
|
||||||
image: require('@/assets/img/img.jpg'),
|
|
||||||
name: 'Interview room 1',
|
|
||||||
capacity: 33,
|
|
||||||
type: 'فضا تیم',
|
|
||||||
isTemporary: false, // اضافه کردن ویژگی isTemporary
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 2,
|
|
||||||
image: require('@/assets/img/img.jpg'),
|
|
||||||
name: 'Interview room 2',
|
|
||||||
capacity: 24,
|
|
||||||
type: 'آموزشی',
|
|
||||||
isTemporary: false,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 3,
|
|
||||||
image: require('@/assets/img/img.jpg'),
|
|
||||||
name: 'Interview room 3',
|
|
||||||
capacity: 60,
|
|
||||||
type: 'جلسه تیمی',
|
|
||||||
isTemporary: false,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 4,
|
|
||||||
image: require('@/assets/img/img.jpg'),
|
|
||||||
name: 'Interview room 4',
|
|
||||||
capacity: 33,
|
|
||||||
type: 'فضا تیم',
|
|
||||||
isTemporary: false,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 5,
|
|
||||||
image: require('@/assets/img/img.jpg'),
|
|
||||||
name: 'Interview room 5',
|
|
||||||
capacity: 24,
|
|
||||||
type: 'آموزشی',
|
|
||||||
isTemporary: false,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 6,
|
|
||||||
image: require('@/assets/img/img.jpg'),
|
|
||||||
name: 'Interview room 6',
|
|
||||||
capacity: 60,
|
|
||||||
type: 'جلسه تیمی',
|
|
||||||
isTemporary: false,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 7,
|
|
||||||
image: require('@/assets/img/img.jpg'),
|
|
||||||
name: 'Interview room 7',
|
|
||||||
capacity: 33,
|
|
||||||
type: 'فضا تیم',
|
|
||||||
isTemporary: false,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 8,
|
|
||||||
image: require('@/assets/img/img.jpg'),
|
|
||||||
name: 'Interview room 8',
|
|
||||||
capacity: 24,
|
|
||||||
type: 'آموزشی',
|
|
||||||
isTemporary: false,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
Temporaryrooms: [],
|
|
||||||
selectedRooms: [],
|
|
||||||
newTempRoom: {
|
newTempRoom: {
|
||||||
name: '',
|
name: '',
|
||||||
capacity: 0,
|
capacity: 0,
|
||||||
type: '',
|
type: '',
|
||||||
image: null,
|
image: null,
|
||||||
},
|
},
|
||||||
|
error: null,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
created() {
|
||||||
|
this.fetchSpaces();
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
toggleRoomSelection(roomId) {
|
async fetchSpaces() {
|
||||||
if (this.selectedRooms.includes(roomId)) {
|
try {
|
||||||
this.selectedRooms = this.selectedRooms.filter((id) => id !== roomId);
|
const token = localStorage.getItem('token');
|
||||||
} else {
|
if (!token) {
|
||||||
this.selectedRooms.push(roomId);
|
this.error = 'توکن احراز هویت پیدا نشد';
|
||||||
|
console.error('توکن احراز هویت پیدا نشد');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const response = await axios.get('http://my.xroomapp.com:8000/get_space', {
|
||||||
|
headers: {
|
||||||
|
Authorization: `Token ${token.trim()}`,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
console.log('فضاها:', response.data.spaces);
|
||||||
|
this.rooms = response.data.spaces.map((space) => {
|
||||||
|
const imageUrl = space.assetBundleRoomId?.img
|
||||||
|
? `http://my.xroomapp.com:8000${space.assetBundleRoomId.img}`
|
||||||
|
: 'https://via.placeholder.com/150';
|
||||||
|
return {
|
||||||
|
id: space.id,
|
||||||
|
image: imageUrl,
|
||||||
|
name: space.name,
|
||||||
|
capacity: space.capacity,
|
||||||
|
type: space.description || 'فضا',
|
||||||
|
isTemporary: false,
|
||||||
|
};
|
||||||
|
});
|
||||||
|
} catch (error) {
|
||||||
|
console.error('خطا در دریافت فضاها:', error);
|
||||||
|
this.error = 'خطا در بارگذاری لیست اتاقها';
|
||||||
|
if (error.response && error.response.status === 403) {
|
||||||
|
alert('لطفاً دوباره وارد شوید');
|
||||||
|
window.location.href = '/login';
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
selectRoom(roomId) {
|
||||||
|
this.selectedRoom = roomId;
|
||||||
|
},
|
||||||
cancel() {
|
cancel() {
|
||||||
this.$emit('close');
|
this.$emit('close');
|
||||||
this.selectedRooms = [];
|
this.selectedRoom = null;
|
||||||
},
|
},
|
||||||
submitRooms() {
|
submitRoom() {
|
||||||
const selectedRoomDetails = [
|
if (!this.selectedRoom) {
|
||||||
...this.rooms,
|
alert('لطفاً یک اتاق انتخاب کنید.');
|
||||||
...this.Temporaryrooms,
|
return;
|
||||||
]
|
}
|
||||||
.filter((room) => this.selectedRooms.includes(room.id))
|
const selectedRoomDetails = [...this.rooms, ...this.temporaryRooms].find(
|
||||||
.map((room) => ({
|
(room) => room.id === this.selectedRoom
|
||||||
id: room.id,
|
);
|
||||||
name: room.name,
|
this.$emit('submit-room', selectedRoomDetails);
|
||||||
capacity: room.capacity,
|
this.selectedRoom = null;
|
||||||
type: room.type,
|
|
||||||
image: room.image,
|
|
||||||
isTemporary: room.isTemporary,
|
|
||||||
}));
|
|
||||||
this.$emit('submit-rooms', selectedRoomDetails);
|
|
||||||
this.selectedRooms = [];
|
|
||||||
},
|
},
|
||||||
handleImageUpload(event) {
|
handleImageUpload(event) {
|
||||||
const file = event.target.files[0];
|
const file = event.target.files[0];
|
||||||
|
@ -462,20 +436,21 @@ export default {
|
||||||
},
|
},
|
||||||
createTemporaryRoom() {
|
createTemporaryRoom() {
|
||||||
const newRoom = {
|
const newRoom = {
|
||||||
id: this.rooms.length + this.Temporaryrooms.length + 1,
|
id: this.rooms.length + this.temporaryRooms.length + 1,
|
||||||
image: this.newTempRoom.image || require('@/assets/img/img.jpg'),
|
image: this.newTempRoom.image || 'https://via.placeholder.com/150',
|
||||||
name: this.newTempRoom.name,
|
name: this.newTempRoom.name,
|
||||||
capacity: this.newTempRoom.capacity,
|
capacity: this.newTempRoom.capacity,
|
||||||
type: this.newTempRoom.type,
|
type: this.newTempRoom.type,
|
||||||
isTemporary: true,
|
isTemporary: true,
|
||||||
};
|
};
|
||||||
this.Temporaryrooms.push(newRoom);
|
this.temporaryRooms.push(newRoom);
|
||||||
this.newTempRoom = { name: '', capacity: 0, type: '', image: null };
|
this.newTempRoom = { name: '', capacity: 0, type: '', image: null };
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.modal-overlay {
|
.modal-overlay {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
|
|
|
@ -236,7 +236,6 @@ export default {
|
||||||
width: 72px;
|
width: 72px;
|
||||||
height: 72px;
|
height: 72px;
|
||||||
border-radius: 12px;
|
border-radius: 12px;
|
||||||
object-fit: none;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.profile-container {
|
.profile-container {
|
||||||
|
|
|
@ -108,6 +108,8 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import axios from 'axios';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'TeamDetails',
|
name: 'TeamDetails',
|
||||||
data() {
|
data() {
|
||||||
|
@ -116,6 +118,7 @@ export default {
|
||||||
teamName: '',
|
teamName: '',
|
||||||
companyName: '',
|
companyName: '',
|
||||||
activityType: '',
|
activityType: '',
|
||||||
|
teamId: null,
|
||||||
},
|
},
|
||||||
teamLogo: null,
|
teamLogo: null,
|
||||||
uploadedLogoFile: null,
|
uploadedLogoFile: null,
|
||||||
|
@ -124,9 +127,37 @@ export default {
|
||||||
{ path: '/img/sample-logo.png', alt: 'نمونه لوگو' },
|
{ path: '/img/sample-logo.png', alt: 'نمونه لوگو' },
|
||||||
{ path: '/img/sample-logo.png', alt: 'نمونه لوگو' },
|
{ path: '/img/sample-logo.png', alt: 'نمونه لوگو' },
|
||||||
],
|
],
|
||||||
|
baseUrl: 'http://my.xroomapp.com:8000',
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
created() {
|
||||||
|
// دریافت اطلاعات تیم در زمان ایجاد کامپوننت
|
||||||
|
this.fetchTeamData();
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
/* دریافت اطلاعات تیم از API */
|
||||||
|
async fetchTeamData() {
|
||||||
|
try {
|
||||||
|
const token = localStorage.getItem('token');
|
||||||
|
const response = await axios.get(`${this.baseUrl}/get_team`, {
|
||||||
|
headers: {
|
||||||
|
Authorization: `Token ${token}`,
|
||||||
|
'Content-Type': 'application/json',
|
||||||
|
},
|
||||||
|
});
|
||||||
|
const team = response.data.teams[0];
|
||||||
|
if (team) {
|
||||||
|
this.form.teamName = team.name || '';
|
||||||
|
this.form.activityType = team.description || '';
|
||||||
|
this.form.teamId = team.id;
|
||||||
|
} else {
|
||||||
|
alert('هیچ اطلاعاتی برای تیم یافت نشد.');
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
alert('خطا در بارگذاری اطلاعات تیم. لطفاً دوباره تلاش کنید.');
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
handleLogoUpload(event) {
|
handleLogoUpload(event) {
|
||||||
const file = event.target.files[0];
|
const file = event.target.files[0];
|
||||||
if (file) {
|
if (file) {
|
||||||
|
@ -134,8 +165,9 @@ export default {
|
||||||
this.uploadedLogoFile = file;
|
this.uploadedLogoFile = file;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
submitForm() {
|
|
||||||
// Check if there's any data to submit
|
/* ارسال فرم برای بهروزرسانی اطلاعات تیم */
|
||||||
|
async submitForm() {
|
||||||
const hasFormData = this.form.teamName || this.form.companyName || this.form.activityType;
|
const hasFormData = this.form.teamName || this.form.companyName || this.form.activityType;
|
||||||
const hasLogo = !!this.uploadedLogoFile;
|
const hasLogo = !!this.uploadedLogoFile;
|
||||||
|
|
||||||
|
@ -144,27 +176,41 @@ export default {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Prepare data to emit, including only non-empty fields
|
const formData = new FormData();
|
||||||
const formData = {};
|
if (this.form.teamName) formData.append('name', this.form.teamName);
|
||||||
if (this.form.teamName) formData.teamName = this.form.teamName;
|
if (this.form.companyName) formData.append('company_name', this.form.companyName);
|
||||||
if (this.form.companyName) formData.companyName = this.form.companyName;
|
if (this.form.activityType) formData.append('description', this.form.activityType);
|
||||||
if (this.form.activityType) formData.activityType = this.form.activityType;
|
if (this.uploadedLogoFile) formData.append('logo', this.uploadedLogoFile);
|
||||||
if (hasLogo) formData.teamLogo = this.uploadedLogoFile;
|
|
||||||
|
|
||||||
this.$emit('update:teamData', formData);
|
try {
|
||||||
|
const token = localStorage.getItem('token');
|
||||||
|
await axios.patch(`${this.baseUrl}/update_team/${this.form.teamId}/`, formData, {
|
||||||
|
headers: {
|
||||||
|
Authorization: `Token ${token}`,
|
||||||
|
'Content-Type': 'multipart/form-data',
|
||||||
|
},
|
||||||
|
});
|
||||||
|
this.$emit('update:teamData', {
|
||||||
|
teamName: this.form.teamName,
|
||||||
|
companyName: this.form.companyName,
|
||||||
|
activityType: this.form.activityType,
|
||||||
|
teamLogo: this.uploadedLogoFile,
|
||||||
|
});
|
||||||
|
alert('اطلاعات تیم با موفقیت بهروزرسانی شد');
|
||||||
|
|
||||||
// Reset form and logo
|
// ریست فرم و لوگو
|
||||||
this.form = {
|
this.form.teamName = '';
|
||||||
teamName: '',
|
this.form.companyName = '';
|
||||||
companyName: '',
|
this.form.activityType = '';
|
||||||
activityType: '',
|
this.teamLogo = null;
|
||||||
};
|
this.uploadedLogoFile = null;
|
||||||
this.teamLogo = null;
|
const fileInput = this.$refs.fileUpload;
|
||||||
this.uploadedLogoFile = null;
|
if (fileInput) {
|
||||||
// Reset file input
|
fileInput.value = '';
|
||||||
const fileInput = this.$refs.fileUpload;
|
}
|
||||||
if (fileInput) {
|
await this.fetchTeamData();
|
||||||
fileInput.value = '';
|
} catch (error) {
|
||||||
|
alert('خطا در بهروزرسانی اطلاعات تیم. لطفاً دوباره تلاش کنید.');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
|
@ -1,69 +1,156 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="card license-card">
|
<div class="card license-card">
|
||||||
<span>لایسنس های قابل استفاده : 0</span>
|
<span>لایسنسهای قابل استفاده: {{ remainingCapacity }}</span>
|
||||||
<div class="buy-subscription" @click="goToBuySubscription">
|
<div class="buy-subscription" @click="goToBuySubscription">
|
||||||
<p>خرید اشتراک</p>
|
<p>خرید اشتراک</p>
|
||||||
<span>
|
<span>
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="25" viewBox="0 0 24 25" fill="none">
|
<svg
|
||||||
<path d="M12 19.5L5 12.5L12 5.5" stroke="#48BB78" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
<path d="M19 12.5H5" stroke="#48BB78" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
width="24"
|
||||||
|
height="25"
|
||||||
|
viewBox="0 0 24 25"
|
||||||
|
fill="none"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M12 19.5L5 12.5L12 5.5"
|
||||||
|
stroke="#48BB78"
|
||||||
|
stroke-width="2"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M19 12.5H5"
|
||||||
|
stroke="#48BB78"
|
||||||
|
stroke-width="2"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="user-cards">
|
||||||
|
<div class="user-card" v-for="(user, index) in userList" :key="index">
|
||||||
|
<div class="user-card-header">
|
||||||
|
<img :src="user.avatar" class="user-avatar" alt="avatar" />
|
||||||
|
<div class="user-info-box">
|
||||||
|
<div class="user-info-tags">
|
||||||
|
<div class="user-name">{{ user.name }}</div>
|
||||||
|
<div class="user-email">{{ user.email }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="user-activity">
|
||||||
|
<div class="user-role">{{ user.role }}</div>
|
||||||
|
<div class="user-version">{{ user.version }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="user-footer">
|
||||||
|
<span>اکانت XRoom</span>
|
||||||
|
<div class="user-actions">
|
||||||
|
<button>
|
||||||
|
<i class="icon">
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
width="25"
|
||||||
|
height="25"
|
||||||
|
viewBox="0 0 20 20"
|
||||||
|
fill="none"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M16.666 5.83325H9.16602"
|
||||||
|
stroke="white"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M11.666 14.1667H4.16602"
|
||||||
|
stroke="white"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M14.166 16.6667C15.5467 16.6667 16.666 15.5475 16.666 14.1667C16.666 12.786 15.5467 11.6667 14.166 11.6667C12.7853 11.6667 11.666 12.786 11.666 14.1667C11.666 15.5475 12.7853 16.6667 14.166 16.6667Z"
|
||||||
|
stroke="white"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M5.83398 8.33325C7.2147 8.33325 8.33398 7.21396 8.33398 5.83325C8.33398 4.45254 7.2147 3.33325 5.83398 3.33325C4.45327 3.33325 3.33398 4.45254 3.33398 5.83325C3.33398 7.21396 4.45327 8.33325 5.83398 8.33325Z"
|
||||||
|
stroke="white"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</i>
|
||||||
</div>
|
</button>
|
||||||
|
<button>
|
||||||
|
<i class="icon">
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
width="25"
|
||||||
|
height="25"
|
||||||
|
viewBox="0 0 20 20"
|
||||||
|
fill="none"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M2.5 5H17.5"
|
||||||
|
stroke="white"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M15.8327 5V16.6667C15.8327 17.5 14.9993 18.3333 14.166 18.3333H5.83268C4.99935 18.3333 4.16602 17.5 4.16602 16.6667V5"
|
||||||
|
stroke="white"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M6.66602 5.00008V3.33341C6.66602 2.50008 7.49935 1.66675 8.33268 1.66675H11.666C12.4993 1.66675 13.3327 2.50008 13.3327 3.33341V5.00008"
|
||||||
|
stroke="white"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M8.33398 9.16675V14.1667"
|
||||||
|
stroke="white"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M11.666 9.16675V14.1667"
|
||||||
|
stroke="white"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</i>
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="user-card add-card" @click="openAddUserModal">
|
||||||
|
<span class="add-text">
|
||||||
|
<span style="font-size: 23px; margin-left: 0.5rem;">+</span> اضافه کردن کاربر جدید
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="user-cards">
|
<!-- Modal -->
|
||||||
<div class="user-card" v-for="(user, index) in userList" :key="index">
|
<AddUserModal
|
||||||
<div class="user-card-header">
|
:isVisible="isAddUserModalVisible"
|
||||||
<img :src="user.avatar" class="user-avatar" alt="avatar" />
|
@close="closeAddUserModal"
|
||||||
<div class="user-info-box">
|
@add-user="submitNewUser"
|
||||||
<div class="user-info-tags">
|
/>
|
||||||
<div class="user-name">{{ user.name }}</div>
|
|
||||||
<div class="user-email">{{ user.email }}</div>
|
|
||||||
</div>
|
|
||||||
<div class="user-activity">
|
|
||||||
<div class="user-role">{{ user.role }}</div>
|
|
||||||
<div class="user-version">{{ user.version }}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="user-footer">
|
|
||||||
<span>اکانت XRoom</span>
|
|
||||||
<div class="user-actions">
|
|
||||||
<button><i class="icon">
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 20 20" fill="none">
|
|
||||||
<path d="M16.666 5.83325H9.16602" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
||||||
<path d="M11.666 14.1667H4.16602" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
||||||
<path d="M14.166 16.6667C15.5467 16.6667 16.666 15.5475 16.666 14.1667C16.666 12.786 15.5467 11.6667 14.166 11.6667C12.7853 11.6667 11.666 12.786 11.666 14.1667C11.666 15.5475 12.7853 16.6667 14.166 16.6667Z" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
||||||
<path d="M5.83398 8.33325C7.2147 8.33325 8.33398 7.21396 8.33398 5.83325C8.33398 4.45254 7.2147 3.33325 5.83398 3.33325C4.45327 3.33325 3.33398 4.45254 3.33398 5.83325C3.33398 7.21396 4.45327 8.33325 5.83398 8.33325Z" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
||||||
</svg>
|
|
||||||
</i></button>
|
|
||||||
<button><i class="icon">
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 20 20" fill="none">
|
|
||||||
<path d="M2.5 5H17.5" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
||||||
<path d="M15.8327 5V16.6667C15.8327 17.5 14.9993 18.3333 14.166 18.3333H5.83268C4.99935 18.3333 4.16602 17.5 4.16602 16.6667V5" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
||||||
<path d="M6.66602 5.00008V3.33341C6.66602 2.50008 7.49935 1.66675 8.33268 1.66675H11.666C12.4993 1.66675 13.3327 2.50008 13.3327 3.33341V5.00008" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
||||||
<path d="M8.33398 9.16675V14.1667" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
||||||
<path d="M11.666 9.16675V14.1667" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
||||||
</svg>
|
|
||||||
</i></button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="user-card add-card" @click="openAddUserModal">
|
|
||||||
<span class="add-text"><span style="font-size: 23px;margin-left: 0.5rem;">+</span> اضافه کردن کاربر جدید</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Modal -->
|
|
||||||
<AddUserModal
|
|
||||||
:isVisible="isAddUserModalVisible"
|
|
||||||
@close="closeAddUserModal"
|
|
||||||
@add-user="submitNewUser"
|
|
||||||
/>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
@ -88,15 +175,15 @@ export default {
|
||||||
default: 0,
|
default: 0,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
data() {
|
computed: {
|
||||||
return {
|
remainingCapacity() {
|
||||||
isAddUserModalVisible: false,
|
const capacity = this.subscriptionCount - this.teamMemberCapacity;
|
||||||
};
|
return capacity;
|
||||||
|
},
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
openAddUserModal() {
|
openAddUserModal() {
|
||||||
const remainingCapacity = this.subscriptionCount - this.teamMemberCapacity;
|
if (this.remainingCapacity <= 0) {
|
||||||
if (remainingCapacity <= 0) {
|
|
||||||
alert('ظرفیت تیم پر شده است. لطفاً اشتراک جدیدی خریداری کنید.');
|
alert('ظرفیت تیم پر شده است. لطفاً اشتراک جدیدی خریداری کنید.');
|
||||||
this.goToBuySubscription();
|
this.goToBuySubscription();
|
||||||
return;
|
return;
|
||||||
|
@ -108,15 +195,21 @@ export default {
|
||||||
},
|
},
|
||||||
submitNewUser(user) {
|
submitNewUser(user) {
|
||||||
this.$emit('add-user', user);
|
this.$emit('add-user', user);
|
||||||
|
|
||||||
this.closeAddUserModal();
|
this.closeAddUserModal();
|
||||||
},
|
},
|
||||||
goToBuySubscription() {
|
goToBuySubscription() {
|
||||||
this.$emit('change-tab', 'buy-subscription');
|
this.$emit('change-tab', 'buy-subscription');
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
isAddUserModalVisible: false,
|
||||||
|
};
|
||||||
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
/* User Info Section */
|
/* User Info Section */
|
||||||
.user-info {
|
.user-info {
|
||||||
|
|
|
@ -1,136 +1,137 @@
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<!-- Description -->
|
<!-- Description -->
|
||||||
<div class="section-description">
|
<div class="section-description">
|
||||||
<div class="section-title">مدیریت جلسات</div>
|
<div class="section-title">مدیریت جلسات</div>
|
||||||
<p class="title-description">
|
<p class="title-description">
|
||||||
با استفاده از جلسات، میتوانید همکاران و کاربران خارجی XRoom را به تیم و اتاقهای خصوصی خود دعوت کنید. شرکتکنندگان جلسه شما میتوانند با استفاده از کد جلسه ایجاد شده در زمانهای معین به جلسه بپیوندند.
|
با استفاده از جلسات، میتوانید همکاران و کاربران خارجی XRoom را به تیم و اتاقهای خصوصی خود دعوت کنید. شرکتکنندگان جلسه شما میتوانند با استفاده از کد جلسه ایجاد شده در زمانهای معین به جلسه بپیوندند.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Meeting Section -->
|
|
||||||
<div class="meeting-section">
|
|
||||||
<div class="meeting-filters">
|
|
||||||
<div class="search-section">
|
|
||||||
<span style="font-size: 17px; font-weight: 600;">جستجو</span>
|
|
||||||
<div class="search-wrapper">
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
class="search-input"
|
|
||||||
placeholder="جستجو جلسه مدنظر ..."
|
|
||||||
v-model="searchQuery"
|
|
||||||
@input="filterMeetings"
|
|
||||||
/>
|
|
||||||
<button class="search-button">
|
|
||||||
<svg
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
width="20"
|
|
||||||
height="20"
|
|
||||||
viewBox="0 0 16 16"
|
|
||||||
fill="none"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M7.33333 12.6667C10.2789 12.6667 12.6667 10.2789 12.6667 7.33333C12.6667 4.38781 10.2789 2 7.33333 2C4.38781 2 2 4.38781 2 7.33333C2 10.2789 4.38781 12.6667 7.33333 12.6667Z"
|
|
||||||
stroke="#101010"
|
|
||||||
stroke-width="1.5"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
/>
|
|
||||||
<path
|
|
||||||
d="M13.9995 14L11.1328 11.1333"
|
|
||||||
stroke="#101010"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="filter-section">
|
|
||||||
<span style="font-size: 17px; font-weight: 600;">فیلتر</span>
|
|
||||||
<div class="filter-buttons">
|
|
||||||
<button
|
|
||||||
:class="{ 'active-filter': activeFilter === 'future', 'disable-filter': activeFilter !== 'future' }"
|
|
||||||
@click="setFilter('future')"
|
|
||||||
>
|
|
||||||
آینده
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
:class="{ 'active-filter': activeFilter === 'all', 'disable-filter': activeFilter !== 'all' }"
|
|
||||||
@click="setFilter('all')"
|
|
||||||
>
|
|
||||||
همه
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Meet Discover -->
|
|
||||||
<div :class="filteredMeetings.length === 0 ? 'meet-discover' : 'meetings-container'">
|
|
||||||
<span class="discover-result" v-if="filteredMeetings.length === 0">
|
|
||||||
هیچ جلسهای یافت نشد. با کلیک کردن، یک جلسه جدید ایجاد کنید
|
|
||||||
</span>
|
|
||||||
<div v-else class="meetings-list">
|
|
||||||
<div v-for="meeting in filteredMeetings" :key="meeting.id" class="meeting-item">
|
|
||||||
<img :src="meeting.image" alt="Meeting Image" class="meeting-image" width="120px" height="120px" />
|
|
||||||
<div class="meeting-details" style="margin-right: 10px;">
|
|
||||||
<h3 class="meet-title">{{ meeting.title }}</h3>
|
|
||||||
<p class="meet-capacity">
|
|
||||||
<span style="margin-left: 4px;">
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="17" viewBox="0 0 16 17" fill="none">
|
|
||||||
<g clip-path="url(#clip0_622_1334)">
|
|
||||||
<path d="M3.33203 5.16667C3.33203 5.87391 3.61298 6.55219 4.11308 7.05228C4.61318 7.55238 5.29145 7.83333 5.9987 7.83333C6.70594 7.83333 7.38422 7.55238 7.88432 7.05228C8.38441 6.55219 8.66536 5.87391 8.66536 5.16667C8.66536 4.45942 8.38441 3.78115 7.88432 3.28105C7.38422 2.78095 6.70594 2.5 5.9987 2.5C5.29145 2.5 4.61318 2.78095 4.11308 3.28105C3.61298 3.78115 3.33203 4.45942 3.33203 5.16667Z" stroke="#718096" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
||||||
<path d="M2 14.5V13.1667C2 12.4594 2.28095 11.7811 2.78105 11.281C3.28115 10.781 3.95942 10.5 4.66667 10.5H7.33333C8.04058 10.5 8.71885 10.781 9.21895 11.281C9.71905 11.7811 10 12.4594 10 13.1667V14.5" stroke="#718096" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
||||||
<path d="M10.668 2.58667C11.2416 2.73354 11.75 3.06714 12.1131 3.53488C12.4761 4.00262 12.6732 5.17 12.6732 5.17C12.6732 5.76212 12.4761 6.33739 12.1131 6.80513C11.75 7.27287 11.2416 7.60647 10.668 7.75334" stroke="#718096" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
||||||
<path d="M14 14.5V13.1666C13.9966 12.5781 13.7986 12.0072 13.4368 11.5429C13.0751 11.0786 12.5699 10.7471 12 10.6" stroke="#718096" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
||||||
</g>
|
|
||||||
<defs>
|
|
||||||
<clipPath id="clip0_622_1334">
|
|
||||||
<rect width="16" height="16" fill="white" transform="translate(0 0.5)"/>
|
|
||||||
</clipPath>
|
|
||||||
</defs>
|
|
||||||
</svg>
|
|
||||||
</span>
|
|
||||||
حداکثر: {{ meeting.maxCapacity }} کاربر
|
|
||||||
</p>
|
|
||||||
<p class="meet-type">
|
|
||||||
<span style="margin-left: 4px;">
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="17" viewBox="0 0 16 17" fill="none">
|
|
||||||
<path d="M4 15.1667V3.16671C4 2.81309 4.14048 2.47395 4.39052 2.2239C4.64057 1.97385 4.97971 1.83337 5.33333 1.83337H10.6667C11.0203 1.83337 11.3594 1.97385 11.6095 2.2239C11.8595 2.47395 12 2.81309 12 3.16671V15.1667H4Z" stroke="#3A57E8" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
|
|
||||||
<path d="M3.9987 8.5H2.66536C2.31174 8.5 1.9726 8.64048 1.72256 8.89052C1.47251 9.14057 1.33203 9.47971 1.33203 9.83333V13.8333C1.33203 14.187 1.47251 14.5261 1.72256 14.7761C1.9726 15.0262 2.31174 15.1667 2.66536 15.1667H3.9987" stroke="#3A57E8" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
|
|
||||||
<path d="M12 6.5H13.3333C13.687 6.5 14.0261 6.64048 14.2761 6.89052C14.5262 7.14057 14.6667 7.47971 14.6667 7.83333V13.8333C14.6667 14.187 14.5262 14.5261 14.2761 14.7761C14.0261 15.0262 13.687 15.1667 13.3333 15.1667H12" stroke="#3A57E8" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
|
|
||||||
<path d="M6.66797 4.5H9.33464" stroke="#3A57E8" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
|
|
||||||
<path d="M6.66797 7.16663H9.33464" stroke="#3A57E8" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
|
|
||||||
<path d="M6.66797 9.83337H9.33464" stroke="#3A57E8" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
|
|
||||||
<path d="M6.66797 12.5H9.33464" stroke="#3A57E8" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
|
|
||||||
</svg>
|
|
||||||
</span>
|
|
||||||
{{ meeting.type }}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<button
|
|
||||||
class="create-meet"
|
|
||||||
@click="showModal = true"
|
|
||||||
:style="{ width: filteredMeetings.length === 0 ? 'auto' : '191px', margin: filteredMeetings.length === 0 ? '0' : 'auto'}"
|
|
||||||
>
|
|
||||||
+ <span style="margin-right: 0.5rem;">ایجاد جلسه جدید</span>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Create Meeting Modal -->
|
|
||||||
<CreateMeetingModal
|
|
||||||
:is-open="showModal"
|
|
||||||
@create-meeting="createNewMeeting"
|
|
||||||
@close="showModal = false"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- Meeting Section -->
|
||||||
|
<div class="meeting-section">
|
||||||
|
<div class="meeting-filters">
|
||||||
|
<div class="search-section">
|
||||||
|
<span style="font-size: 17px; font-weight: 600;">جستجو</span>
|
||||||
|
<div class="search-wrapper">
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
class="search-input"
|
||||||
|
placeholder="جستجو جلسه مدنظر ..."
|
||||||
|
v-model="searchQuery"
|
||||||
|
@input="filterMeetings"
|
||||||
|
/>
|
||||||
|
<button class="search-button">
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
width="20"
|
||||||
|
height="20"
|
||||||
|
viewBox="0 0 16 16"
|
||||||
|
fill="none"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M7.33333 12.6667C10.2789 12.6667 12.6667 10.2789 12.6667 7.33333C12.6667 4.38781 10.2789 2 7.33333 2C4.38781 2 2 4.38781 2 7.33333C2 10.2789 4.38781 12.6667 7.33333 12.6667Z"
|
||||||
|
stroke="#101010"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M13.9995 14L11.1328 11.1333"
|
||||||
|
stroke="#101010"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="filter-section">
|
||||||
|
<span style="font-size: 17px; font-weight: 600;">فیلتر</span>
|
||||||
|
<div class="filter-buttons">
|
||||||
|
<button
|
||||||
|
:class="{ 'active-filter': activeFilter === 'future', 'disable-filter': activeFilter !== 'future' }"
|
||||||
|
@click="setFilter('future')"
|
||||||
|
>
|
||||||
|
آینده
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
:class="{ 'active-filter': activeFilter === 'all', 'disable-filter': activeFilter !== 'all' }"
|
||||||
|
@click="setFilter('all')"
|
||||||
|
>
|
||||||
|
همه
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Meet Discover -->
|
||||||
|
<div :class="filteredMeetings.length === 0 ? 'meet-discover' : 'meetings-container'">
|
||||||
|
<span class="discover-result" v-if="filteredMeetings.length === 0">
|
||||||
|
هیچ جلسهای یافت نشد. با کلیک کردن، یک جلسه جدید ایجاد کنید
|
||||||
|
</span>
|
||||||
|
<div v-else class="meetings-list">
|
||||||
|
<div v-for="meeting in filteredMeetings" :key="meeting.id" class="meeting-item">
|
||||||
|
<img :src="meeting.image" alt="Meeting Image" class="meeting-image" width="120px" height="120px" />
|
||||||
|
<div class="meeting-details" style="margin-right: 10px;">
|
||||||
|
<h3 class="meet-title">{{ meeting.title }}</h3>
|
||||||
|
<p class="meet-capacity">
|
||||||
|
<span style="margin-left: 4px;">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="17" viewBox="0 0 16 17" fill="none">
|
||||||
|
<g clip-path="url(#clip0_622_1334)">
|
||||||
|
<path d="M3.33203 5.16667C3.33203 5.87391 3.61298 6.55219 4.11308 7.05228C4.61318 7.55238 5.29145 7.83333 5.9987 7.83333C6.70594 7.83333 7.38422 7.55238 7.88432 7.05228C8.38441 6.55219 8.66536 5.87391 8.66536 5.16667C8.66536 4.45942 8.38441 3.78115 7.88432 3.28105C7.38422 2.78095 6.70594 2.5 5.9987 2.5C5.29145 2.5 4.61318 2.78095 4.11308 3.28105C3.61298 3.78115 3.33203 4.45942 3.33203 5.16667Z" stroke="#718096" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M2 14.5V13.1667C2 12.4594 2.28095 11.7811 2.78105 11.281C3.28115 10.781 3.95942 10.5 4.66667 10.5H7.33333C8.04058 10.5 8.71885 10.781 9.21895 11.281C9.71905 11.7811 10 12.4594 10 13.1667V14.5" stroke="#718096" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M10.668 2.58667C11.2416 2.73354 11.75 3.06714 12.1131 3.53488C12.4761 4.00262 12.6732 5.17 12.6732 5.17C12.6732 5.76212 12.4761 6.33739 12.1131 6.80513C11.75 7.27287 11.2416 7.60647 10.668 7.75334" stroke="#718096" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M14 14.5V13.1666C13.9966 12.5781 13.7986 12.0072 13.4368 11.5429C13.0751 11.0786 12.5699 10.7471 12 10.6" stroke="#718096" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<clipPath id="clip0_622_1334">
|
||||||
|
<rect width="16" height="16" fill="white" transform="translate(0 0.5)"/>
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
حداکثر: {{ meeting.maxCapacity }} کاربر
|
||||||
|
</p>
|
||||||
|
<p class="meet-type">
|
||||||
|
<span style="margin-left: 4px;">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="17" viewBox="0 0 16 17" fill="none">
|
||||||
|
<path d="M4 15.1667V3.16671C4 2.81309 4.14048 2.47395 4.39052 2.2239C4.64057 1.97385 4.97971 1.83337 5.33333 1.83337H10.6667C11.0203 1.83337 11.3594 1.97385 11.6095 2.2239C11.8595 2.47395 12 2.81309 12 3.16671V15.1667H4Z" stroke="#3A57E8" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M3.9987 8.5H2.66536C2.31174 8.5 1.9726 8.64048 1.72256 8.89052C1.47251 9.14057 1.33203 9.47971 1.33203 9.83333V13.8333C1.33203 14.187 1.47251 14.5261 1.72256 14.7761C1.9726 15.0262 2.31174 15.1667 2.66536 15.1667H3.9987" stroke="#3A57E8" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M12 6.5H13.3333C13.687 6.5 14.0261 6.64048 14.2761 6.89052C14.5262 7.14057 14.6667 7.47971 14.6667 7.83333V13.8333C14.6667 14.187 14.5262 14.5261 14.2761 14.7761C14.0261 15.0262 13.687 15.1667 13.3333 15.1667H12" stroke="#3A57E8" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M6.66797 4.5H9.33464" stroke="#3A57E8" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M6.66797 7.16663H9.33464" stroke="#3A57E8" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M6.66797 9.83337H9.33464" stroke="#3A57E8" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M6.66797 12.5H9.33464" stroke="#3A57E8" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
{{ meeting.type }}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<button
|
||||||
|
class="create-meet"
|
||||||
|
@click="showModal = true"
|
||||||
|
:style="{ width: filteredMeetings.length === 0 ? 'auto' : '191px', margin: filteredMeetings.length === 0 ? '0' : 'auto'}"
|
||||||
|
>
|
||||||
|
+ <span style="margin-right: 0.5rem;">ایجاد جلسه جدید</span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Create Meeting Modal -->
|
||||||
|
<CreateMeetingModal
|
||||||
|
:is-open="showModal"
|
||||||
|
@create-meeting="createNewMeeting"
|
||||||
|
@close="showModal = false"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import CreateMeetingModal from '@/components/CreateMeetingModal.vue';
|
import CreateMeetingModal from '@/components/CreateMeetingModal.vue';
|
||||||
|
import axios from 'axios';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'DashboardPage',
|
name: 'DashboardPage',
|
||||||
|
@ -194,22 +195,90 @@ export default {
|
||||||
this.activeFilter = filter;
|
this.activeFilter = filter;
|
||||||
this.filterMeetings();
|
this.filterMeetings();
|
||||||
},
|
},
|
||||||
createNewMeeting(meetingData) {
|
async refreshToken() {
|
||||||
const newMeeting = {
|
try {
|
||||||
id: this.meetings.length + 1,
|
const response = await axios.post('http://my.xroomapp.com:8000/refresh_token', {
|
||||||
title: meetingData.title,
|
refresh_token: localStorage.getItem('refresh_token'),
|
||||||
date: meetingData.date,
|
});
|
||||||
image: 'https://via.placeholder.com/150',
|
const newToken = response.data.access_token;
|
||||||
type: meetingData.type,
|
localStorage.setItem('token', newToken);
|
||||||
maxCapacity: meetingData.maxCapacity,
|
return newToken;
|
||||||
};
|
} catch (error) {
|
||||||
this.meetings.push(newMeeting);
|
console.error('خطا در refresh توکن:', error);
|
||||||
this.filterMeetings();
|
alert('لطفاً دوباره وارد شوید');
|
||||||
this.showModal = false;
|
window.location.href = '/login';
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async createNewMeeting(meetingData) {
|
||||||
|
try {
|
||||||
|
console.log('دادههای ارسالی به API:', JSON.stringify(meetingData, null, 2));
|
||||||
|
let token = localStorage.getItem('token');
|
||||||
|
console.log('توکن اولیه:', token);
|
||||||
|
if (!token) {
|
||||||
|
throw new Error('توکن احراز هویت پیدا نشد');
|
||||||
|
}
|
||||||
|
|
||||||
|
let response = await axios.post(
|
||||||
|
'http://my.xroomapp.com:8000/add_meeting',
|
||||||
|
meetingData,
|
||||||
|
{
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/json',
|
||||||
|
'Authorization': `Token ${token.trim()}`,
|
||||||
|
},
|
||||||
|
}
|
||||||
|
).catch(async (error) => {
|
||||||
|
if (error.response && error.response.status === 403) {
|
||||||
|
console.log('تلاش برای refresh توکن...');
|
||||||
|
token = await this.refreshToken();
|
||||||
|
if (token) {
|
||||||
|
return await axios.post(
|
||||||
|
'http://my.xroomapp.com:8000/add_meeting',
|
||||||
|
meetingData,
|
||||||
|
{
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/json',
|
||||||
|
'Authorization': `Token ${token.trim()}`,
|
||||||
|
},
|
||||||
|
}
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
throw error;
|
||||||
|
});
|
||||||
|
|
||||||
|
console.log('پاسخ API:', response.data);
|
||||||
|
|
||||||
|
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) {
|
||||||
|
console.error('خطا در ارسال درخواست به API:', error);
|
||||||
|
if (error.response) {
|
||||||
|
console.error('جزئیات پاسخ سرور:', error.response.data);
|
||||||
|
alert(`خطایی در ایجاد جلسه رخ داد: ${error.response.data.message || error.message}`);
|
||||||
|
} else {
|
||||||
|
alert(`خطایی در ایجاد جلسه رخ داد: ${error.message}`);
|
||||||
|
}
|
||||||
|
}
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
/* .dashboard-page {
|
/* .dashboard-page {
|
||||||
margin-right: 360px;
|
margin-right: 360px;
|
||||||
|
@ -278,7 +347,8 @@ export default {
|
||||||
|
|
||||||
.search-wrapper {
|
.search-wrapper {
|
||||||
margin-top: 1rem;
|
margin-top: 1rem;
|
||||||
padding: 1.2px;
|
padding: 1px;
|
||||||
|
padding-left: 0.7px;
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
background: linear-gradient(to right, #001940, #4364F7);
|
background: linear-gradient(to right, #001940, #4364F7);
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
|
@ -98,7 +98,11 @@
|
||||||
</router-link>
|
</router-link>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div v-if="recentFiles.length === 0" class="no-files-message">
|
||||||
|
<p>شما اخیرا فایلی آپلود نکردید</p>
|
||||||
|
</div>
|
||||||
<swiper
|
<swiper
|
||||||
|
v-else
|
||||||
:slides-per-view="2.2"
|
:slides-per-view="2.2"
|
||||||
:space-between="15"
|
:space-between="15"
|
||||||
:loop="true"
|
:loop="true"
|
||||||
|
@ -322,6 +326,14 @@ export default {
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
|
||||||
|
.no-files-message{
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 3rem;
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
.dashboard {
|
.dashboard {
|
||||||
padding: 20px 0px;
|
padding: 20px 0px;
|
||||||
font-family: 'IRANSansXFaNum-Medium', Helvetica, sans-serif;
|
font-family: 'IRANSansXFaNum-Medium', Helvetica, sans-serif;
|
||||||
|
|
|
@ -90,29 +90,7 @@ export default {
|
||||||
memberCount: 5,
|
memberCount: 5,
|
||||||
availableMemberOptions: [5, 10, 20, 100],
|
availableMemberOptions: [5, 10, 20, 100],
|
||||||
selectedPlan: null,
|
selectedPlan: null,
|
||||||
userList: [
|
userList: [],
|
||||||
{
|
|
||||||
name: 'دانیال پژوهش کیا',
|
|
||||||
email: 'aminimperator@gmail.com',
|
|
||||||
role: 'نسخه آزمایشی',
|
|
||||||
version: '',
|
|
||||||
avatar: 'https://models.readyplayer.me/681f59760bc631a87ad25172.png',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'امین رمضانی',
|
|
||||||
email: 'aminimperator@gmail.com',
|
|
||||||
role: 'مدیر',
|
|
||||||
version: 'نسخه آزمایشی',
|
|
||||||
avatar: 'https://models.readyplayer.me/681f59760bc631a87ad25172.png',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'نوید رمضانی',
|
|
||||||
email: 'aminimperator@gmail.com',
|
|
||||||
role: 'مدیر',
|
|
||||||
version: 'نسخه آزمایشی',
|
|
||||||
avatar: 'https://models.readyplayer.me/681f59760bc631a87ad25172.png',
|
|
||||||
},
|
|
||||||
],
|
|
||||||
activeTab: 'users',
|
activeTab: 'users',
|
||||||
previewUrl: '',
|
previewUrl: '',
|
||||||
currentPreviewIndex: null,
|
currentPreviewIndex: null,
|
||||||
|
@ -137,6 +115,7 @@ export default {
|
||||||
pdfs: [],
|
pdfs: [],
|
||||||
videos: [],
|
videos: [],
|
||||||
glbs: [],
|
glbs: [],
|
||||||
|
subscription: null,
|
||||||
},
|
},
|
||||||
newFileName: '',
|
newFileName: '',
|
||||||
selectedFile: null,
|
selectedFile: null,
|
||||||
|
@ -147,11 +126,13 @@ export default {
|
||||||
fileAccept: '*/*',
|
fileAccept: '*/*',
|
||||||
teamMemberCapacity: 0,
|
teamMemberCapacity: 0,
|
||||||
subscriptionCount: 0,
|
subscriptionCount: 0,
|
||||||
|
teamId: null,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
this.fetchUserData();
|
this.fetchUserData();
|
||||||
this.fetchTeamMemberInfo();
|
this.fetchTeamMemberInfo();
|
||||||
|
this.fetchTeamData();
|
||||||
const tab = this.$route.query.tab;
|
const tab = this.$route.query.tab;
|
||||||
if (tab) {
|
if (tab) {
|
||||||
this.activeTab = tab;
|
this.activeTab = tab;
|
||||||
|
@ -161,44 +142,88 @@ export default {
|
||||||
changeTab(tabName) {
|
changeTab(tabName) {
|
||||||
this.activeTab = tabName;
|
this.activeTab = tabName;
|
||||||
},
|
},
|
||||||
async handlePaymentSuccess() {
|
async fetchTeamData() {
|
||||||
await this.fetchTeamMemberInfo();
|
|
||||||
this.activeTab = 'membership';
|
|
||||||
},
|
|
||||||
async fetchTeamMemberInfo() {
|
|
||||||
try {
|
try {
|
||||||
const token = localStorage.getItem('token');
|
const token = localStorage.getItem('token');
|
||||||
const response = await axios.get(`${this.baseUrl}/get_team_member_info`, {
|
const response = await axios.get('http://my.xroomapp.com:8000/get_team', {
|
||||||
headers: {
|
headers: {
|
||||||
Authorization: `Token ${token}`,
|
Authorization: `Token ${token}`,
|
||||||
'Content-Type': 'application/json',
|
'Content-Type': 'application/json',
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
const team = response.data.teams[0];
|
||||||
this.teamMemberCapacity = response.data.data.team_member_capacity;
|
if (team) {
|
||||||
this.subscriptionCount = response.data.data.subscriptionCount;
|
this.teamId = team.id;
|
||||||
console.log('تعداد اشتراکها (subscriptionCount):', this.subscriptionCount);
|
} else {
|
||||||
|
this.teamId = null;
|
||||||
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('خطا در دریافت اطلاعات اشتراک:', error);
|
alert('خطا در بارگذاری اطلاعات تیم. لطفاً دوباره تلاش کنید.');
|
||||||
alert('خطا در بارگذاری اطلاعات اشتراک. لطفاً دوباره تلاش کنید.');
|
}
|
||||||
|
},
|
||||||
|
async handlePaymentSuccess() {
|
||||||
|
await this.fetchTeamMemberInfo();
|
||||||
|
await this.fetchUserData();
|
||||||
|
this.activeTab = 'membership';
|
||||||
|
},
|
||||||
|
async fetchTeamMemberInfo() {
|
||||||
|
try {
|
||||||
|
const token = localStorage.getItem('token');
|
||||||
|
const response = await axios.get(`${this.baseUrl}/get_all_team_members`, {
|
||||||
|
headers: {
|
||||||
|
Authorization: `Token ${token}`,
|
||||||
|
'Content-Type': 'application/json',
|
||||||
|
},
|
||||||
|
});
|
||||||
|
this.userList = response.data.members.map((member) => ({
|
||||||
|
name: `${member.first_name} ${member.last_name}`,
|
||||||
|
email: member.username,
|
||||||
|
role: 'کاربر',
|
||||||
|
version: 'نسخه آزمایشی',
|
||||||
|
avatar: 'https://models.readyplayer.me/681f59760bc631a87ad25172.png',
|
||||||
|
}));
|
||||||
|
this.teamMemberCapacity = response.data.members.length;
|
||||||
|
} catch (error) {
|
||||||
|
alert('خطا در بارگذاری اطلاعات اعضای تیم. لطفاً دوباره تلاش کنید.');
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async fetchUserData() {
|
||||||
|
try {
|
||||||
|
const token = localStorage.getItem('token');
|
||||||
|
const response = await axios.get(`${this.baseUrl}/getInfo`, {
|
||||||
|
headers: {
|
||||||
|
Authorization: `Token ${token}`,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
this.userData = response.data;
|
||||||
|
if (this.userData.data.subscription) {
|
||||||
|
this.subscriptionCount = this.userData.data.subscription || 0;
|
||||||
|
} else {
|
||||||
|
this.subscriptionCount = 0;
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
alert('خطا در بارگذاری اطلاعات کاربر. لطفاً دوباره تلاش کنید.');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
async submitNewUser(newUser) {
|
async submitNewUser(newUser) {
|
||||||
console.log('اطلاعات کاربر جدید:', newUser);
|
|
||||||
|
|
||||||
const remainingCapacity = this.subscriptionCount - this.teamMemberCapacity;
|
const remainingCapacity = this.subscriptionCount - this.teamMemberCapacity;
|
||||||
if (remainingCapacity <= 0) {
|
if (remainingCapacity <= 0) {
|
||||||
alert('ظرفیت تیم پر شده است. لطفاً اشتراک جدیدی خریداری کنید.');
|
alert('ظرفیت تیم پر شده است. لطفاً اشتراک جدیدی خریداری کنید.');
|
||||||
this.activeTab = 'buy-subscription';
|
this.activeTab = 'buy-subscription';
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
if (!this.teamId) {
|
||||||
|
alert('خطا: اطلاعات تیم یافت نشد. لطفاً دوباره تلاش کنید.');
|
||||||
|
return;
|
||||||
|
}
|
||||||
try {
|
try {
|
||||||
const token = localStorage.getItem('token');
|
const token = localStorage.getItem('token');
|
||||||
|
|
||||||
await axios.post(
|
await axios.post(
|
||||||
'http://my.xroomapp.com:8000/add_teamMember/',
|
'http://my.xroomapp.com:8000/add_teamMember/',
|
||||||
newUser,
|
{
|
||||||
|
...newUser,
|
||||||
|
teamId: this.teamId,
|
||||||
|
},
|
||||||
{
|
{
|
||||||
headers: {
|
headers: {
|
||||||
Authorization: `Token ${token}`,
|
Authorization: `Token ${token}`,
|
||||||
|
@ -206,21 +231,16 @@ export default {
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
|
||||||
this.userList.push({
|
this.userList.push({
|
||||||
...newUser,
|
...newUser,
|
||||||
avatar: 'https://models.readyplayer.me/681f59760bc631a87ad25172.png',
|
avatar: 'https://models.readyplayer.me/681f59760bc631a87ad25172.png',
|
||||||
role: newUser.role || 'کاربر',
|
role: newUser.role || 'کاربر',
|
||||||
version: newUser.version || 'نسخه آزمایشی',
|
version: newUser.version || 'نسخه آزمایشی',
|
||||||
});
|
});
|
||||||
|
|
||||||
this.teamMemberCapacity++;
|
this.teamMemberCapacity++;
|
||||||
|
|
||||||
await this.fetchTeamMemberInfo();
|
await this.fetchTeamMemberInfo();
|
||||||
|
|
||||||
alert('کاربر با موفقیت اضافه شد');
|
alert('کاربر با موفقیت اضافه شد');
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('خطا در اضافه کردن کاربر:', error);
|
|
||||||
alert('خطا در اضافه کردن کاربر. لطفاً دوباره تلاش کنید.');
|
alert('خطا در اضافه کردن کاربر. لطفاً دوباره تلاش کنید.');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -229,9 +249,6 @@ export default {
|
||||||
this.closePreviewDialog();
|
this.closePreviewDialog();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
handleTeamData(data) {
|
|
||||||
console.log('اطلاعات دریافتی : ', data);
|
|
||||||
},
|
|
||||||
openPreviewDialog(type, index, url) {
|
openPreviewDialog(type, index, url) {
|
||||||
if (type === 'video') {
|
if (type === 'video') {
|
||||||
this.videoOptions.sources[0].src = url;
|
this.videoOptions.sources[0].src = url;
|
||||||
|
@ -240,14 +257,11 @@ export default {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
if (!this.$refs.filePreviewDialog) {
|
if (!this.$refs.filePreviewDialog) {
|
||||||
console.error('Dialog element not found');
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
this.currentPreviewType = type;
|
this.currentPreviewType = type;
|
||||||
this.currentPreviewIndex = index;
|
this.currentPreviewIndex = index;
|
||||||
this.previewUrl = url;
|
this.previewUrl = url;
|
||||||
|
|
||||||
if (type === 'video') {
|
if (type === 'video') {
|
||||||
this.videoOptions.sources[0].src = url;
|
this.videoOptions.sources[0].src = url;
|
||||||
this.videoOptions.poster = this.getVideoThumbnail();
|
this.videoOptions.poster = this.getVideoThumbnail();
|
||||||
|
@ -255,11 +269,9 @@ export default {
|
||||||
} else {
|
} else {
|
||||||
this.previewUrl = url;
|
this.previewUrl = url;
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.$refs.filePreviewDialog?.showModal();
|
this.$refs.filePreviewDialog?.showModal();
|
||||||
});
|
});
|
||||||
|
|
||||||
if (type === 'image') {
|
if (type === 'image') {
|
||||||
this.previewImageUrl = url;
|
this.previewImageUrl = url;
|
||||||
this.previewPdfUrl = '';
|
this.previewPdfUrl = '';
|
||||||
|
@ -267,7 +279,6 @@ export default {
|
||||||
this.previewPdfUrl = url;
|
this.previewPdfUrl = url;
|
||||||
this.previewImageUrl = '';
|
this.previewImageUrl = '';
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$refs.filePreviewDialog.showModal();
|
this.$refs.filePreviewDialog.showModal();
|
||||||
},
|
},
|
||||||
getVideoThumbnail() {
|
getVideoThumbnail() {
|
||||||
|
@ -277,8 +288,6 @@ export default {
|
||||||
const dialog = this.$refs.filePreviewDialog;
|
const dialog = this.$refs.filePreviewDialog;
|
||||||
if (dialog && typeof dialog.close === 'function') {
|
if (dialog && typeof dialog.close === 'function') {
|
||||||
dialog.close();
|
dialog.close();
|
||||||
} else {
|
|
||||||
console.warn('Dialog reference not found or close method unavailable');
|
|
||||||
}
|
}
|
||||||
this.previewUrl = '';
|
this.previewUrl = '';
|
||||||
this.currentPreviewIndex = null;
|
this.currentPreviewIndex = null;
|
||||||
|
@ -288,38 +297,32 @@ export default {
|
||||||
const url =
|
const url =
|
||||||
this.currentPreviewType === 'image' ? this.previewImageUrl : this.previewPdfUrl;
|
this.currentPreviewType === 'image' ? this.previewImageUrl : this.previewPdfUrl;
|
||||||
if (!url) return;
|
if (!url) return;
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const response = await fetch(url);
|
const response = await fetch(url);
|
||||||
const blob = await response.blob();
|
const blob = await response.blob();
|
||||||
const downloadUrl = window.URL.createObjectURL(blob);
|
const downloadUrl = window.URL.createObjectURL(blob);
|
||||||
const a = document.createElement('a');
|
const a = document.createElement('a');
|
||||||
a.href = downloadUrl;
|
a.href = downloadUrl;
|
||||||
|
|
||||||
if (this.currentPreviewType === 'image') {
|
if (this.currentPreviewType === 'image') {
|
||||||
a.download = `image-${new Date().getTime()}.${url.split('.').pop()}`;
|
a.download = `image-${new Date().getTime()}.${url.split('.').pop()}`;
|
||||||
} else if (this.currentPreviewType === 'pdf') {
|
} else if (this.currentPreviewType === 'pdf') {
|
||||||
a.download = `document-${new Date().getTime()}.pdf`;
|
a.download = `document-${new Date().getTime()}.pdf`;
|
||||||
}
|
}
|
||||||
|
|
||||||
document.body.appendChild(a);
|
document.body.appendChild(a);
|
||||||
a.click();
|
a.click();
|
||||||
window.URL.revokeObjectURL(downloadUrl);
|
window.URL.revokeObjectURL(downloadUrl);
|
||||||
document.body.removeChild(a);
|
document.body.removeChild(a);
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('Error downloading file:', error);
|
|
||||||
alert('خطا در دانلود فایل');
|
alert('خطا در دانلود فایل');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
async deleteFile() {
|
async deleteFile() {
|
||||||
if (this.currentPreviewIndex === null || !this.currentPreviewType) return;
|
if (this.currentPreviewIndex === null || !this.currentPreviewType) return;
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const token = localStorage.getItem('token');
|
const token = localStorage.getItem('token');
|
||||||
let deleteUrl = '';
|
let deleteUrl = '';
|
||||||
let itemId = '';
|
let itemId = '';
|
||||||
let fileArray = [];
|
let fileArray = [];
|
||||||
|
|
||||||
switch (this.currentPreviewType) {
|
switch (this.currentPreviewType) {
|
||||||
case 'image':
|
case 'image':
|
||||||
fileArray = this.userData.images;
|
fileArray = this.userData.images;
|
||||||
|
@ -342,34 +345,18 @@ export default {
|
||||||
deleteUrl = `${this.baseUrl}/deleteGlb/${itemId}/`;
|
deleteUrl = `${this.baseUrl}/deleteGlb/${itemId}/`;
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
|
|
||||||
await axios.delete(deleteUrl, {
|
await axios.delete(deleteUrl, {
|
||||||
headers: {
|
headers: {
|
||||||
Authorization: `Token ${token}`,
|
Authorization: `Token ${token}`,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
this.closePreviewDialog();
|
this.closePreviewDialog();
|
||||||
await this.fetchUserData();
|
await this.fetchUserData();
|
||||||
alert('فایل با موفقیت حذف شد');
|
alert('فایل با موفقیت حذف شد');
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('Error deleting file:', error);
|
|
||||||
alert('خطا در حذف فایل');
|
alert('خطا در حذف فایل');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
async fetchUserData() {
|
|
||||||
try {
|
|
||||||
const token = localStorage.getItem('token');
|
|
||||||
const response = await axios.get(`${this.baseUrl}/getInfo`, {
|
|
||||||
headers: {
|
|
||||||
Authorization: `Token ${token}`,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
this.userData = response.data;
|
|
||||||
} catch (error) {
|
|
||||||
console.error('Error fetching user data:', error);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
getFullImageUrl(relativePath) {
|
getFullImageUrl(relativePath) {
|
||||||
if (!relativePath) return '';
|
if (!relativePath) return '';
|
||||||
return `${this.baseUrl}${relativePath}`;
|
return `${this.baseUrl}${relativePath}`;
|
||||||
|
@ -381,7 +368,6 @@ export default {
|
||||||
},
|
},
|
||||||
openDialog(type) {
|
openDialog(type) {
|
||||||
this.currentUploadType = type;
|
this.currentUploadType = type;
|
||||||
|
|
||||||
switch (type) {
|
switch (type) {
|
||||||
case 'image':
|
case 'image':
|
||||||
this.dialogTitle = 'آپلود تصویر جدید';
|
this.dialogTitle = 'آپلود تصویر جدید';
|
||||||
|
@ -400,7 +386,6 @@ export default {
|
||||||
this.fileAccept = '.glb';
|
this.fileAccept = '.glb';
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$refs.newFileDialog.showModal();
|
this.$refs.newFileDialog.showModal();
|
||||||
},
|
},
|
||||||
closeDialog() {
|
closeDialog() {
|
||||||
|
@ -412,13 +397,12 @@ export default {
|
||||||
this.selectedFile = event.target.files[0];
|
this.selectedFile = event.target.files[0];
|
||||||
},
|
},
|
||||||
async uploadFile() {
|
async uploadFile() {
|
||||||
if (!this.selectedFile) return;
|
if (!this.selectedFile) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
this.uploading = true;
|
this.uploading = true;
|
||||||
|
|
||||||
const formData = new FormData();
|
const formData = new FormData();
|
||||||
formData.append('name', this.newFileName || this.selectedFile.name);
|
formData.append('name', this.newFileName || this.selectedFile.name);
|
||||||
|
|
||||||
switch (this.currentUploadType) {
|
switch (this.currentUploadType) {
|
||||||
case 'image':
|
case 'image':
|
||||||
formData.append('image', this.selectedFile);
|
formData.append('image', this.selectedFile);
|
||||||
|
@ -433,11 +417,9 @@ export default {
|
||||||
formData.append('glb', this.selectedFile);
|
formData.append('glb', this.selectedFile);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const token = localStorage.getItem('token');
|
const token = localStorage.getItem('token');
|
||||||
let uploadUrl = '';
|
let uploadUrl = '';
|
||||||
|
|
||||||
switch (this.currentUploadType) {
|
switch (this.currentUploadType) {
|
||||||
case 'image':
|
case 'image':
|
||||||
uploadUrl = `${this.baseUrl}/uploadImage/`;
|
uploadUrl = `${this.baseUrl}/uploadImage/`;
|
||||||
|
@ -452,19 +434,16 @@ export default {
|
||||||
uploadUrl = `${this.baseUrl}/uploadGlb/`;
|
uploadUrl = `${this.baseUrl}/uploadGlb/`;
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
|
|
||||||
await axios.post(uploadUrl, formData, {
|
await axios.post(uploadUrl, formData, {
|
||||||
headers: {
|
headers: {
|
||||||
Authorization: `Token ${token}`,
|
Authorization: `Token ${token}`,
|
||||||
'Content-Type': 'multipart/form-data',
|
'Content-Type': 'multipart/form-data',
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
this.closeDialog();
|
this.closeDialog();
|
||||||
await this.fetchUserData();
|
await this.fetchUserData();
|
||||||
alert('فایل با موفقیت آپلود شد');
|
alert('فایل با موفقیت آپلود شد');
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('Error uploading file:', error);
|
|
||||||
alert('خطا در آپلود فایل');
|
alert('خطا در آپلود فایل');
|
||||||
} finally {
|
} finally {
|
||||||
this.uploading = false;
|
this.uploading = false;
|
||||||
|
@ -476,8 +455,8 @@ export default {
|
||||||
if (newTab) {
|
if (newTab) {
|
||||||
this.activeTab = newTab;
|
this.activeTab = newTab;
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue
Block a user