freeleaps_product/freeleaps_frontend
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Test passed for local zoom call making

Browse Source
This commit is contained in:
jetli 2024-09-06 08:21:12 -07:00
parent 0ea55d7e44
commit 2f73d454bb
16 changed files with 299 additions and 234 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
Dockerfile
View File

@ -2,6 +2,10 @@
FROM node:lts-alpine as build-stage
ARG CONTAINER_APP_ROOT="/app"
ARG FRONTEND_PORT=8080
# TODO: further testing before turning on
# ARG ZOOM_CLIENT_ID
# ARG ZOOM_REDIRECT_URI
# ARG ZOOM_SCOPE
RUN npm update npm -g
RUN npm config set "@fortawesome:registry" https://npm.fontawesome.com/
RUN npm config set "//npm.fontawesome.com/:_authToken" 58624E90-2685-43C6-BF0F-0BFECCE11CD2
@ -17,6 +21,11 @@ COPY frontend/*.html ./
COPY frontend/src ./src
COPY frontend/public ./public
# TODO: further testing before turning on
# RUN echo "VUE_APP_ZOOM_CLIENT_ID=${ZOOM_CLIENT_ID}" >> .env
# RUN echo "VUE_APP_ZOOM_REDIRECT_URI=${ZOOM_REDIRECT_URI}" >> .env
# RUN echo "VUE_APP_ZOOM_SCOPE=${ZOOM_SCOPE}" >> .env
RUN npm run build
# production stage

1
frontend/frontend Symbolic link
View File

@ -0,0 +1 @@
../freeleaps2-frontend/frontend

8
frontend/src/components/EmptyContent.vue
View File

@ -1,7 +1,7 @@
<template>
<div v-if="loading || empty" class="empty-content-container" :class="{autoFit : 'auto-fit'}">
<img v-if="loading" src="@/assets/images/loading.gif" class="loading-big" alt="">
<img v-if="empty && !loading" src="@/assets/images/no_content.jpg" class="empty-img" alt="">
<div v-if="loading || empty" class="empty-content-container" :class="{ autoFit: 'auto-fit' }">
<img v-if="loading" src="@/assets/images/loading.gif" class="loading-big" alt="" />
<img v-if="empty && !loading" src="@/assets/images/no_content.jpg" class="empty-img" alt="" />
<span v-if="empty && !loading" class="empty-text">{{ $t('No content yet') }}</span>
</div>
</template>
@ -34,11 +34,13 @@ export default {
width: 188px;
height: 188px;
}
.empty-img {
width: 188px;
height: 188px;
margin-bottom: 15px;
}
.empty-text {
font-size: 26px;
color: #6e7387;

4
frontend/src/headers/HeaderUser.vue
View File

@ -45,8 +45,8 @@
</div>
<div class="profile-container">
<img alt="freeleaps logo" data-bs-toggle="dropdown" aria-expanded="false" id="accountButton" :src="userProfile?.account?.basic?.photo?.base64
? userProfile?.account?.basic?.photo?.base64
: profileUrl
? userProfile?.account?.basic?.photo?.base64
: profileUrl
" />
<ul class="dropdown-menu" aria-labelledby="accountButton">
<li>

4
frontend/src/lang/en.js
View File

@ -215,7 +215,7 @@ export default {
Goal: 'Goal',
Message: 'Message',
'Upload attachment': 'Upload attachment',
'Didn\'t get the email? Check junk folder or': 'Didn\'t get the email? Check junk folder or ',
"Didn't get the email? Check junk folder or": "Didn't get the email? Check junk folder or ",
'send again': 'send again',
'No content yet': 'No content yet',
'No content yet': 'No content yet'
}

2
frontend/src/lang/zh.js
View File

@ -213,7 +213,7 @@ export default {
'Lines of code per week': '每周代码产量',
Message: '消息',
'Upload attachment': '上传附件',
'Didn\'t get the email? Check junk folder or': '没收到邮件？检查垃圾文件夹或',
"Didn't get the email? Check junk folder or": '没收到邮件？检查垃圾文件夹或',
'send again': '重新发送',
'No content yet': '暂无内容',
OUTSTANDING: '进行中',

24
frontend/src/pages/guest/SigninWithEmailAndCode.vue
View File

@ -9,8 +9,14 @@
<div class="form-group">
<div class="input-group-container">
<div class="form-floating">
<input class="input-email" id="inputCode" type="text" :placeholder="'Code sent to your email'"
v-model="code" @focus="inputFocus" />
<input
class="input-email"
id="inputCode"
type="text"
:placeholder="'Code sent to your email'"
v-model="code"
@focus="inputFocus"
/>
<label for="inputCode">{{ $t('Authenticaion Code Sent To Your Email') }}</label>
</div>
<button type="submit" class="btn-start">{{ $t('SIGN IN') }}</button>
@ -18,9 +24,15 @@
</div>
<p class="error-msg" v-if="message != null">{{ message }}</p>
<p class="error-msg msg-center" v-if="!message">
<span>{{ $t('Didn\'t get the email? Check junk folder or') }}</span>
<button class="btn btn-link resend-btn" :disabled="countdown !== 0" type="button"
@click="trySigninWithEmail">{{ $t('send again') }}</button>
<span>{{ $t("Didn't get the email? Check junk folder or") }}</span>
<button
class="btn btn-link resend-btn"
:disabled="countdown !== 0"
type="button"
@click="trySigninWithEmail"
>
{{ $t('send again') }}
</button>
<span v-if="countdown !== 0" class="countdown">({{ countdown }})</span>
</p>
</div>
@ -52,7 +64,7 @@ export default {
}
},
created() { },
created() {},
mounted() {
if (this.mnx_IsKeepUserSignedIn() && this.mnx_isUserAuthenticated()) {
this.mnx_navAfterSignedin()

12
frontend/src/pages/public/About.vue
View File

@ -1,10 +1,7 @@
<template>
<div class="directories_containter">
<div class="directory_container" v-for="(directory, index) in directories" :key="index">
<div
class="directory_cover_image"
:style="{ 'background-image': `url(${directory.cover_picture})` }"
/>
<div class="directory_cover_image" :style="{ 'background-image': `url(${directory.cover_picture})` }" />
<p class="directory-title">{{ directory.title_text }}</p>
<p class="directory-subtitle">{{ directory.summary_text }}</p>
<button class="btn btn-link directory-btn" @click="view_link(directory)">
@ -33,10 +30,8 @@ export default {
})
},
view_link(directory) {
if (directory.content_id)
this.mnx_navToPdfContentViewer(directory.content_id)
else if (directory.content_link)
this.mnx_navToLinkContentViewer(btoa(directory.content_link))
if (directory.content_id) this.mnx_navToPdfContentViewer(directory.content_id)
else if (directory.content_link) this.mnx_navToLinkContentViewer(btoa(directory.content_link))
}
},
data() {
@ -87,6 +82,7 @@ export default {
color: #666666;
margin-bottom: 5px;
}
.directory-btn {
font-weight: 600;
}

13
frontend/src/pages/public/Blogs.vue
View File

@ -1,11 +1,6 @@
<template>
<div v-if="blogs" class="blogs_containter">
<div
class="blog_containter"
v-for="(blog, index) in blogs"
:key="index"
@click="view_blog(blog)"
>
<div class="blog_containter" v-for="(blog, index) in blogs" :key="index" @click="view_blog(blog)">
<h2>{{ blog.blog_name }}</h2>
<div class="blog_cover_image" :style="{ 'background-image': `url(${blog.cover_picture})` }" />
<p v-text="retrieve_summary(blog)"></p>
@ -32,10 +27,8 @@ export default {
})
},
view_blog(blog) {
if (blog.content_id)
this.mnx_navToPdfContentViewer(blog.content_id)
else if (blog.content_link)
this.mnx_navToLinkContentViewer(btoa(blog.content_link))
if (blog.content_id) this.mnx_navToPdfContentViewer(blog.content_id)
else if (blog.content_link) this.mnx_navToLinkContentViewer(btoa(blog.content_link))
},
retrieve_summary(blog) {
return blog.summary_text

6
frontend/src/pages/public/Career.vue
View File

@ -28,10 +28,8 @@ export default {
})
},
view_link(directory) {
if (directory.content_id)
this.mnx_navToPdfContentViewer(directory.content_id)
else if (directory.content_link)
this.mnx_navToLinkContentViewer(btoa(directory.content_link))
if (directory.content_id) this.mnx_navToPdfContentViewer(directory.content_id)
else if (directory.content_link) this.mnx_navToLinkContentViewer(btoa(directory.content_link))
}
},
data() {

20
frontend/src/pages/user/messages/Home.vue
View File

@ -6,7 +6,8 @@
<div v-for="(conversation, index) in conversations" :key="index" class="conversation-container" :class="{
selected: selConversation?.id === conversation?.id
}" @click="selectConversation(conversation)">
<img class="participant-portrait" alt="user portrait" :src="conversation?.photo?.base64?conversation.photo.base64:profileUrl" />
<img class="participant-portrait" alt="user portrait"
:src="conversation?.photo?.base64 ? conversation.photo.base64 : profileUrl" />
<div class="conversation-summary-container">
<div class="conversation-summary-header-container">
<span class="participant-fullname">
@ -32,7 +33,8 @@
<div v-for="(item, index) in messages" :key="index" class="message-item-container"
:class="item.sender_id == userIdentityNote ? 'me' : ''">
<div class="message-item-header-container">
<img class="message-item-sender-portrait" alt="user portrait" :src="conversation?.sender_photo?.base64?conversation.sender_photo.base64:profileUrl" />
<img class="message-item-sender-portrait" alt="user portrait" :src="conversation?.sender_photo?.base64 ? conversation.sender_photo.base64 : profileUrl
" />
<span class="message-item-sender-fullname">
{{ item.sender_firstname }}
{{ item.sender_lastname }}
@ -130,7 +132,7 @@ export default {
.then((response) => {
this.messages = response?.data || []
console.log('Received message for conversation:', conversation_id)
this.scrollToNewestMessageThread();
this.scrollToNewestMessageThread()
})
.catch((error) => {
this.mnx_backendErrorHandler(error)
@ -171,8 +173,8 @@ export default {
this.writtenMessage = null
// Scroll to the newest message
this.scrollToNewestMessage();
this.scrollToNewestMessageThread();
this.scrollToNewestMessage()
this.scrollToNewestMessageThread()
})
.catch((error) => {
this.mnx_backendErrorHandler(error)
@ -194,17 +196,17 @@ export default {
},
scrollToNewestMessage() {
this.$nextTick(() => {
const messagesContainer = this.$refs.messagesContainer;
const messagesContainer = this.$refs.messagesContainer
messagesContainer.scrollTop = messagesContainer.scrollHeight
});
})
},
scrollToNewestMessageThread() {
this.$nextTick(() => {
const messageThreadContainer = this.$refs.messageThreadContainer;
const messageThreadContainer = this.$refs.messageThreadContainer
if (messageThreadContainer != null) {
messageThreadContainer.scrollTop = messageThreadContainer.scrollHeight
}
});
})
}
}
}

12
frontend/src/pages/user/providers/Home.vue
View File

@ -185,17 +185,15 @@
$t('Action panel')
}}</label>
<div class="invite-to-request-container">
<label class="invite-to-request-content-label" for="invite-to-request-content">{{ $t('Invite')
}}
<label class="invite-to-request-content-label" for="invite-to-request-content">{{ $t('Invite') }}
<span class="invite-to-request-name-span">{{ provider.user_profile.first_name }}
{{ provider.user_profile.last_name }}</span>
{{ $t('to my open requests') }}</label>
<div class="invite-to-request-content-container" id="invite-to-request-content">
<div class="form-check" v-for="(request, index) in requests" :key="index">
<input class="form-check-input" type="checkbox" :value="request.id"
:id="'check' + request.id" v-model="checkedRequests" @change="
checkRequest($event, request.id, provider.user_profile.user_id)
" />
<input class="form-check-input" type="checkbox" :value="request.id" :id="'check' + request.id"
v-model="checkedRequests"
@change="checkRequest($event, request.id, provider.user_profile.user_id)" />
<label class="form-check-label" :for="'check' + request.id">{{
request.title
}}</label>
@ -418,7 +416,7 @@ export default {
}
.marb-10 {
margin-bottom: 10px !important
margin-bottom: 10px !important;
}
.self-intro-content-container {

147
frontend/src/pages/user/requests/Home.vue
View File

@ -1,39 +1,20 @@
<template>
<empty-content :loading="loading" :empty="requestGroups?.length === 0" />
<div class="request-hub">
<div
v-for="(group, index) in requestGroups"
:key="index"
class="request-invitations"
:id="group.name"
>
<div v-for="(group, index) in requestGroups" :key="index" class="request-invitations" :id="group.name">
<div v-if="group.data" id="request-invitation-container">
<div
class="accordion accordion-list"
v-for="(request, index) in group.data"
:key="index"
:id="request.id"
>
<div class="accordion accordion-list" v-for="(request, index) in group.data" :key="index" :id="request.id">
<div class="accordion-item my-3">
<h2 class="accordion-header">
<button
class="accordion-button collapsed"
type="button"
data-bs-toggle="collapse"
:data-bs-target="'#collapse' + index"
aria-expanded="false"
:aria-controls="'collapse' + index"
>
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
:data-bs-target="'#collapse' + index" aria-expanded="false" :aria-controls="'collapse' + index">
<div class="dashed-container request-content-container">
<div class="request-content-issuer-container">
<label class="request-content-label" for="request-content-issuer-box">{{
$t('Issuer')
}}</label>
<label class="request-content-label" for="request-content-issuer-box">{{ $t('Issuer') }}</label>
<div class="request-content-box" id="request-content-issuer-box">
<span class="request-content-issuer-text">
{{ request.issuer_profile.first_name }}
{{ request.issuer_profile.last_name }}</span
>
{{ request.issuer_profile.last_name }}</span>
</div>
</div>
<div class="request-content-title-container">
@ -67,11 +48,8 @@
</div>
</button>
</h2>
<div
:id="'collapse' + index"
class="accordion-collapse collapse"
data-bs-parent="#request-invitation-container"
>
<div :id="'collapse' + index" class="accordion-collapse collapse"
data-bs-parent="#request-invitation-container">
<div class="accordion-body">
<div class="request-description-container">
<button class="make-proposal-button" type="button" @click="Propose(request)">
@ -81,23 +59,13 @@
{{ $t('Message') }}
</button>
<div class="request-description-content" v-html="request.content"></div>
<div
class="pdf-actions"
v-for="(file, index) in request.attached_files"
:key="index"
>
<button
class="btn btn-link"
data-bs-toggle="modal"
data-bs-target="#pdf-viewer"
@click="previewAttachedFile(request.id, file.document_id, file.file_name)"
>
<div class="pdf-actions" v-for="(file, index) in request.attached_files" :key="index">
<button class="btn btn-link" data-bs-toggle="modal" data-bs-target="#pdf-viewer"
@click="previewAttachedFile(request.id, file.document_id, file.file_name)">
{{ $t('Preview') }}{{ file.file_name }}
</button>
<button
class="btn btn-link"
@click="downloadAttachedFile(request.id, file.document_id, file.file_name)"
>
<button class="btn btn-link"
@click="downloadAttachedFile(request.id, file.document_id, file.file_name)">
{{ $t('Download') }}{{ file.file_name }}
</button>
</div>
@ -108,82 +76,45 @@
> -->
<div class="issuer-achievement-container" id="issuer-achievement-container">
<div class="issuer-achievement-isssuer-container">
<label
class="issuer-achievement-label"
for="issuer-achievement-isssuer-content-div"
>{{ $t('Name') }}</label
>
<div
class="issuer-achievement-content-container"
id="issuer-achievement-isssuer-content-div"
>
<label class="issuer-achievement-label" for="issuer-achievement-isssuer-content-div">{{ $t('Name')
}}</label>
<div class="issuer-achievement-content-container" id="issuer-achievement-isssuer-content-div">
<span class="issuer-achievement-issuer-text">
{{ request.issuer_profile.first_name }}
{{ request.issuer_profile.last_name }}</span
>
{{ request.issuer_profile.last_name }}</span>
</div>
</div>
<div class="issuer-achievement-stay-container">
<label
class="issuer-achievement-label"
for="issuer-achievement-stay-content-div"
>{{ $t('Stay on Freeleaps') }}</label
>
<div
class="issuer-achievement-content-container"
id="issuer-achievement-stay-content-div"
>
<label class="issuer-achievement-label" for="issuer-achievement-stay-content-div">{{ $t('Stay on Freeleaps') }} </label>
<div class="issuer-achievement-content-container" id="issuer-achievement-stay-content-div">
<span class="issuer-achievement-stay-content-text">
{{ request.issuer_achievement.activeness.days_of_staying_on }}
{{ $t('day(s)') }}</span
>
{{ $t('day(s)') }}</span>
</div>
</div>
<div class="issuer-achievement-paid-container">
<label
class="issuer-achievement-label"
for="issuer-achievement-paid-content-div"
>{{ $t('Total payment') }}</label
>
<div
class="issuer-achievement-content-container"
id="issuer-achievement-stay-content-div"
>
<label class="issuer-achievement-label" for="issuer-achievement-paid-content-div">{{ $t('Total payment') }}</label>
<div class="issuer-achievement-content-container" id="issuer-achievement-stay-content-div">
<span class="issuer-achievement-paid-content-text">
{{ request.issuer_achievement.issuer.spending.total }}
{{ request.issuer_achievement.issuer.spending.currency }}</span
>
{{ request.issuer_achievement.issuer.spending.currency }}</span>
</div>
</div>
<div class="issuer-achievement-deposit-container">
<label
class="issuer-achievement-label"
for="issuer-achievement-deposit-content-div"
>{{ $t('Deposit') }}</label
>
<div
class="issuer-achievement-content-container"
id="issuer-achievement-deposit-content-div"
>
<label class="issuer-achievement-label" for="issuer-achievement-deposit-content-div">{{
$t('Deposit') }}</label>
<div class="issuer-achievement-content-container" id="issuer-achievement-deposit-content-div">
<span class="issuer-achievement-deposit-content-text">
{{ request.issuer_achievement.issuer.deposit.available }}
{{ request.issuer_achievement.issuer.deposit.currency }}</span
>
{{ request.issuer_achievement.issuer.deposit.currency }}</span>
</div>
</div>
<div class="issuer-achievement-credit-container">
<label
class="issuer-achievement-label"
for="issuer-achievement-credit-content-div"
>{{ $t('Credit') }}</label
>
<div
class="issuer-achievement-content-container"
id="issuer-achievement-credit-content-div"
>
<label class="issuer-achievement-label" for="issuer-achievement-credit-content-div">{{
$t('Credit') }}</label>
<div class="issuer-achievement-content-container" id="issuer-achievement-credit-content-div">
<span class="issuer-achievement-credit-content-text">
{{ request.issuer_achievement.activeness.credit }}</span
>
{{ request.issuer_achievement.activeness.credit }}</span>
</div>
</div>
</div>
@ -195,23 +126,12 @@
</div>
</div>
</div>
<div
class="modal fade"
id="pdf-viewer"
tabindex="-1"
aria-labelledby="pdf-viewer-label"
aria-hidden="true"
>
<div class="modal fade" id="pdf-viewer" tabindex="-1" aria-labelledby="pdf-viewer-label" aria-hidden="true">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="pdf-viewer-label">{{ pdfDocument.title }}</h1>
<button
type="button"
class="btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<PDFReader :doc="pdfDocument.doc" />
@ -279,7 +199,6 @@ export default {
})
},
downloadAttachedFile(request_id, document_id, file_name) {
// window.open(`http://${window.location.host}/api/workspace/request/fetch-attached-file-as-download?request_id=${request_id}&document_id=${document_id}`)
// const link = document.createElement('a')

240
frontend/src/pages/user/workspace/Home.vue
View File

@ -2,13 +2,22 @@
<empty-content :loading="loading" :empty="projects?.length === 0" />
<div v-if="projects && projects.length > 0" class="workspace-container">
<div class="workspace-body">
<div class="accordion accordion-list" v-for="(project, project_index) in projects" :key="project_index"
:id="project.id">
<div
class="accordion accordion-list"
v-for="(project, project_index) in projects"
:key="project_index"
:id="project.id"
>
<div class="accordion-item">
<h2 class="accordion-header">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
:data-bs-target="'#collapse-' + project_index" aria-expanded="false"
:aria-controls="'collapse-' + project_index">
<button
class="accordion-button collapsed"
type="button"
data-bs-toggle="collapse"
:data-bs-target="'#collapse-' + project_index"
aria-expanded="false"
:aria-controls="'collapse-' + project_index"
>
<div class="workspace-item-bar dashed-container">
<div class="workspace-item-bar-left">
<div class="project-item-title-container">
@ -17,7 +26,9 @@
</div>
<div class="project-item-status-container">
<label class="project-item-label">{{ $t('Status') }}</label>
<p class="project-item-text">{{ $t(fromIntToProjectStatus(project.status)) }}</p>
<p class="project-item-text">
{{ $t(fromIntToProjectStatus(project.status)) }}
</p>
</div>
<div class="project-item-date-container">
<label class="project-item-label">{{ $t('Update') }}</label>
@ -29,8 +40,9 @@
<div class="workspace-item-bar-right">
<div class="project-item-inform-container">
<label class="project-item-label">{{ $t('Issuer') }}</label>
<p class="project-item-text">{{ project?.issuer?.first_name }}
{{ project?.issuer?.last_name }}</p>
<p class="project-item-text">
{{ project?.issuer?.first_name }} {{ project?.issuer?.last_name }}
</p>
</div>
</div>
<!-- <div class="workspace-item-bar-right">
@ -42,7 +54,11 @@
</div>
</button>
</h2>
<div :id="'collapse-' + project_index" class="accordion-collapse collapse" :data-bs-parent="'#' + project.id">
<div
:id="'collapse-' + project_index"
class="accordion-collapse collapse"
:data-bs-parent="'#' + project.id"
>
<div class="accordion-body" v-if="isOpenRequest(project)">
<div class="float-action-container">
<button class="request-action-withdraw" @click="withdrawAndEditRequest(project)">
@ -50,17 +66,30 @@
</button>
</div>
<div class="project-request-container">
<div class="project-request-content" v-html="project.request.content" @keyup="textAreaAdjust($event)"
contenteditable="false"></div>
<div
class="project-request-content"
v-html="project.request.content"
@keyup="textAreaAdjust($event)"
contenteditable="false"
></div>
</div>
<div class="project-request-proposals-container">
<div class="accordion" v-for="(proposal, proposal_index) in project.proposals" :key="proposal_index"
:id="proposal.id">
<div
class="accordion"
v-for="(proposal, proposal_index) in project.proposals"
:key="proposal_index"
:id="proposal.id"
>
<div class="accordion-item">
<h2 class="accordion-header">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
:data-bs-target="'#collapse-request-proposal' + proposal_index" aria-expanded="false"
:aria-controls="'collapse-request-proposal' + proposal_index">
<button
class="accordion-button collapsed"
type="button"
data-bs-toggle="collapse"
:data-bs-target="'#collapse-request-proposal' + proposal_index"
aria-expanded="false"
:aria-controls="'collapse-request-proposal' + proposal_index"
>
<div class="project-request-proposal-bar-container">
<div class="project-request-proposal-quote-container">
<label class="project-item-label">{{ $t('Quote') }}</label>
@ -95,16 +124,23 @@
</div>
</button>
</h2>
<div :id="'collapse-request-proposal' + proposal_index" class="accordion-collapse collapse"
:data-bs-parent="'#' + proposal.id">
<div
:id="'collapse-request-proposal' + proposal_index"
class="accordion-collapse collapse"
:data-bs-parent="'#' + proposal.id"
>
<div class="accordion-body">
<div class="request-proposal-action-container">
<button class="request-proposal-action-reject"
@click="rejectProposal(project, proposal_index)">
<button
class="request-proposal-action-reject"
@click="rejectProposal(project, proposal_index)"
>
{{ $t('reject') }}
</button>
<button class="request-proposal-action-accept"
@click="acceptProposal(project, proposal_index)">
<button
class="request-proposal-action-accept"
@click="acceptProposal(project, proposal_index)"
>
{{ $t('accept') }}
</button>
</div>
@ -112,9 +148,12 @@
<div class="request-proposal-content" v-html="proposal.content" />
</div>
<div class="request-proposal-payment-plan">
<div class="request-proposal-payment-plan-stage-container"
v-for="(stage, stage_index) in proposal.payment_plan.stages" :key="stage_index"
:id="'payment-stage-' + stage_index">
<div
class="request-proposal-payment-plan-stage-container"
v-for="(stage, stage_index) in proposal.payment_plan.stages"
:key="stage_index"
:id="'payment-stage-' + stage_index"
>
<div class="project-request-proposal-stage-payment-container">
<label class="project-item-label">{{ $t('Payment') }}</label>
<p class="project-item-text">
@ -149,9 +188,12 @@
<div class="request-proposal-content" v-html="project.proposal.content" />
</div>
<div class="request-proposal-payment-plan">
<div class="request-proposal-payment-plan-stage-container"
v-for="(stage, stage_index) in project.proposal.payment_plan.stages" :key="stage_index"
:id="'payment-stage-' + stage_index">
<div
class="request-proposal-payment-plan-stage-container"
v-for="(stage, stage_index) in project.proposal.payment_plan.stages"
:key="stage_index"
:id="'payment-stage-' + stage_index"
>
<div class="project-request-proposal-stage-payment-container">
<label class="project-item-label">{{ $t('Payment') }}</label>
<p class="project-item-text">{{ stage.amount }} {{ stage.currency }}</p>
@ -169,24 +211,40 @@
</div>
</div>
<div class="project-request-container">
<div class="project-request-content" v-html="project.request.content" @keyup="textAreaAdjust($event)"
contenteditable="false"></div>
<div
class="project-request-content"
v-html="project.request.content"
@keyup="textAreaAdjust($event)"
contenteditable="false"
></div>
</div>
</div>
<div class="accordion-body inline-accordion-body" v-if="isOngoingProject(project)">
<div class="project-invite-collaborator-containter">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
data-bs-target="#collapse-project-invite-collaborator" aria-expanded="false"
aria-controls="collapse-project-invite-collaborator">
<button
class="accordion-button collapsed"
type="button"
data-bs-toggle="collapse"
data-bs-target="#collapse-project-invite-collaborator"
aria-expanded="false"
aria-controls="collapse-project-invite-collaborator"
>
<div class="project-invite-collaborator">+ {{ $t('Invite') }}</div>
</button>
<div id="collapse-project-invite-collaborator" class="accordion-collapse collapse"
data-bs-parent="#collapse-project-invite-collaborator">
<div
id="collapse-project-invite-collaborator"
class="accordion-collapse collapse"
data-bs-parent="#collapse-project-invite-collaborator"
>
<div class="project-invite-collaborator-form-container">
<input type="text" v-model="newInviteCollaborator[project_index]"
:placeholder="$t('Input E-mail to invite other')" @keydown.enter="
<input
type="text"
v-model="newInviteCollaborator[project_index]"
:placeholder="$t('Input E-mail to invite other')"
@keydown.enter="
inviteCollaborator(project.project_id, newInviteCollaborator[project_index])
" />
"
/>
<svg-icon icon="msg-enter" class-name="project-invite-enter" />
</div>
</div>
@ -194,9 +252,14 @@
<div class="accordion" id="workspace-project-accordion">
<div class="accordion-item">
<h2 class="accordion-header">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
data-bs-target="#collapse-project-milestone" aria-expanded="false"
aria-controls="collapse-project-milestone">
<button
class="accordion-button collapsed"
type="button"
data-bs-toggle="collapse"
data-bs-target="#collapse-project-milestone"
aria-expanded="false"
aria-controls="collapse-project-milestone"
>
<div class="project-milestone-bar-container dashed-container">
<div class="project-milestone-bar-progress">
<label class="project-item-label">{{ $t('Progress') }}</label>
@ -210,9 +273,7 @@
<div class="project-milestone-bar-status">
<label class="project-item-label">{{ $t('Status') }}</label>
<p class="project-item-text">
{{
$t(fromIntToMilestoneStatus(project.status))
}}
{{ $t(fromIntToMilestoneStatus(project.status)) }}
</p>
</div>
<div class="project-milestone-bar-paid">
@ -232,11 +293,17 @@
</div>
</button>
</h2>
<div id="collapse-project-milestone" class="accordion-collapse collapse"
data-bs-parent="#collapse-project-milestone">
<div
id="collapse-project-milestone"
class="accordion-collapse collapse"
data-bs-parent="#collapse-project-milestone"
>
<table class="project-milestones-table">
<tbody v-for="milestone in project.project.progress.milestones" :key="milestone.index"
:id="'project-milestone-' + milestone.index">
<tbody
v-for="milestone in project.project.progress.milestones"
:key="milestone.index"
:id="'project-milestone-' + milestone.index"
>
<tr>
<td>
<div class="project-milestones-table-content">
@ -291,9 +358,14 @@
<td>
<div class="project-milestones-table-content">
<span class="project-milestones-table-label">{{ $t('Action') }}</span>
<button class="project-milestones-table-btn" :disabled="isMilestoneActionButtonDisabled(project.project, milestone)
" :hidden="isMilestoneActionButtonHidden(project.project, milestone)"
@click="handleMilestoneAction(project.project, milestone)">
<button
class="project-milestones-table-btn"
:disabled="
isMilestoneActionButtonDisabled(project.project, milestone)
"
:hidden="isMilestoneActionButtonHidden(project.project, milestone)"
@click="handleMilestoneAction(project.project, milestone)"
>
{{ fetchMilestoneActionButtonText(project.project, milestone) }}
</button>
<!-- <span class="project-milestones-table-span">{{ getDateFromFulltimeString(milestone.update_time) }}</span> -->
@ -304,8 +376,10 @@
<td colspan="6">
<div class="project-milestones-qrcode-content">
<img :src="this.qrCode.imageUrl" alt="freeleaps" />
<button class="project-milestones-qrcode-button"
@click="handlePaymentAction(project.project, milestone)">
<button
class="project-milestones-qrcode-button"
@click="handlePaymentAction(project.project, milestone)"
>
{{ $t('Mark As Paid') }}
</button>
</div>
@ -317,9 +391,14 @@
</div>
<div class="accordion-item">
<h2 class="accordion-header">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
data-bs-target="#collapse-project-code" aria-expanded="false"
aria-controls="collapse-project-code">
<button
class="accordion-button collapsed"
type="button"
data-bs-toggle="collapse"
data-bs-target="#collapse-project-code"
aria-expanded="false"
aria-controls="collapse-project-code"
>
<div class="project-code-bar-container dashed-container">
<div class="project-code-git-status">
<label class="project-item-label">{{ $t('Code Depot') }}</label>
@ -342,13 +421,22 @@
</div>
</button>
</h2>
<div id="collapse-project-code" class="accordion-collapse collapse"
data-bs-parent="#collapse-project-code">
<div
id="collapse-project-code"
class="accordion-collapse collapse"
data-bs-parent="#collapse-project-code"
>
<div class="project-code-details-container">
<div class="project-code-git-url-container">
<button v-if="project.project.code?.git_url" class="project-code-copy-git-url"
@click="copyCodeGit(project)" v-tooltip title="Copied" trigger="click"
delay='{"show":"500", "hide":"100"}'>
<button
v-if="project.project.code?.git_url"
class="project-code-copy-git-url"
@click="copyCodeGit(project)"
v-tooltip
title="Copied"
trigger="click"
delay='{"show":"500", "hide":"100"}'
>
{{ $t('copy git url') }}
</button>
</div>
@ -364,9 +452,14 @@
</div>
<div class="accordion-item">
<h2 class="accordion-header">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
data-bs-target="#collapse-project-issue" aria-expanded="false"
aria-controls="collapse-project-issue">
<button
class="accordion-button collapsed"
type="button"
data-bs-toggle="collapse"
data-bs-target="#collapse-project-issue"
aria-expanded="false"
aria-controls="collapse-project-issue"
>
<div class="project-issue-bar-container dashed-container">
<div class="project-issue-open-issues">
<label class="project-item-label">{{ $t('Open issues') }}</label>
@ -389,8 +482,11 @@
</div>
</button>
</h2>
<div id="collapse-project-issue" class="accordion-collapse collapse"
data-bs-parent="#collapse-project-issue">
<div
id="collapse-project-issue"
class="accordion-collapse collapse"
data-bs-parent="#collapse-project-issue"
>
<div class="project-code-git-url-container">
<button class="project-code-copy-git-url" @click="gotoIssueManage(project)">
{{ $t('Issues management') }}
@ -571,6 +667,16 @@ export default {
},
methods: {
// To be called with initiating zoom call
redirectToZoomOAuth() {
const clientId = "YwetcrCFTzS_fHELZjkhPw"
const redirectUri = "http://localhost:5173/api/messages/oauth/zoom/callback"
const zoomOAuthUrl = `https://zoom.us/oauth/authorize?response_type=code&client_id=${clientId}&redirect_uri=${redirectUri}&scope=meeting:write:meeting`
// Redirect the user to Zoom's OAuth 2.0 consent page
window.location.href = zoomOAuthUrl
},
// You can use this function on a button click to start the OAuth process,
fetchView() {
WorksapceApi.fetchWorkspaceView()
.then((response) => {
@ -988,7 +1094,7 @@ export default {
// padding: 32px;
padding-top: 12px;
margin-top: -12px;
border-top: 1px solid #e1e1e1
border-top: 1px solid #e1e1e1;
}
.float-action-container {

4
frontend/src/types/projectUtils.js
View File

@ -56,7 +56,9 @@ const convertIntoToMilestoneStatus = function (i) {
return p
}
}
return Object.keys(milestoneStatusEnum).find(key => milestoneStatusEnum[key] === milestoneStatusEnum.DONE)
return Object.keys(milestoneStatusEnum).find(
(key) => milestoneStatusEnum[key] === milestoneStatusEnum.DONE
)
}
const convertIntoToProjectIssueStatus = function (i) {

27
frontend/src/utils/backend/workspace.js
View File

@ -81,6 +81,33 @@ class WorksapceApi {
return request
}
static createZoomCall(zoom_access_token) {
let jwt = userUtils.getJwtToken() // Assuming you have a method to fetch the JWT token
// Make the POST request using backendAxios, with the Authorization header
try {
// Make the POST request using backendAxios, with the Authorization header
const response = backendAxios.post(
'/api/messages/trigger-video-call', // Your backend API for creating Zoom calls
{
token: zoom_access_token,
participants: ['freeleaps@gmail.com'] // Sending participants as an array of email addresses
},
{
headers: { Authorization: `Bearer ${jwt}` }
}
)
// Handle the response and update the meeting link
const result = response.data // Axios puts the response data in 'data'
document.getElementById('meeting-link').textContent =
`Join Zoom meeting: ${result.meeting_url}`
} catch (error) {
console.error('Failed to create Zoom call:', error)
document.getElementById('meeting-link').textContent = 'Failed to create Zoom meeting.'
}
}
static fetchProject(project_id) {
let jwt = userUtils.getJwtToken()
const request = backendAxios.post(