RanchiMall/ribc
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added option assign multiple interns at once

Browse Source
This commit is contained in:
sairaj mote 2022-10-16 22:11:55 +05:30
parent 1a9bfd24b1
commit 0c0fd6bc31
4 changed files with 69 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
css/main.css
View File

@ -1181,6 +1181,7 @@ ul {
} }
.intern-card { .intern-card {
display: flex;
padding: 1rem; padding: 1rem;
margin: 0.2rem; margin: 0.2rem;
border-radius: 0.5rem; border-radius: 0.5rem;
@ -1189,13 +1190,20 @@ ul {
user-select: none; user-select: none;
padding: 0.8rem 1rem; padding: 0.8rem 1rem;
gap: 0.8rem; gap: 0.8rem;
grid-template-columns: auto 1fr auto; cursor: pointer;
}
.intern-card input {
height: 1.3em;
width: 1.3em;
} }
.intern-card .icon { .intern-card .icon {
height: 1rem; height: 1rem;
width: 1rem; width: 1rem;
margin-left: 0.2rem; margin-left: 0.2rem;
} }
.intern-card__name {
flex: 1;
}
.intern-card__initials { .intern-card__initials {
display: flex; display: flex;

2
css/main.min.css vendored
View File

File diff suppressed because one or more lines are too long

10
css/main.scss
View File

@ -1186,18 +1186,26 @@ ul {
} }
.intern-card { .intern-card {
display: flex;
padding: 1rem; padding: 1rem;
margin: 0.2rem; margin: 0.2rem;
border-radius: 0.5rem; border-radius: 0.5rem;
user-select: none; user-select: none;
padding: 0.8rem 1rem; padding: 0.8rem 1rem;
gap: 0.8rem; gap: 0.8rem;
grid-template-columns: auto 1fr auto; cursor: pointer;
input {
height: 1.3em;
width: 1.3em;
}
.icon { .icon {
height: 1rem; height: 1rem;
width: 1rem; width: 1rem;
margin-left: 0.2rem; margin-left: 0.2rem;
} }
&__name {
flex: 1;
}
} }
.intern-card__initials { .intern-card__initials {

102
index.html
View File

@ -786,7 +786,9 @@
d="M12 10.586l4.95-4.95 1.414 1.414-4.95 4.95 4.95 4.95-1.414 1.414-4.95-4.95-4.95 4.95-1.414-1.414 4.95-4.95-4.95-4.95L7.05 5.636z" /> d="M12 10.586l4.95-4.95 1.414 1.414-4.95 4.95 4.95 4.95-1.414 1.414-4.95-4.95-4.95 4.95-1.414-1.414 4.95-4.95-4.95-4.95L7.05 5.636z" />
</svg> </svg>
</button> </button>
<h3 class="medium-block-0-5">Choose an intern</h3> <h3 class="medium-block-0-5">Select interns</h3>
<button id="assign_interns_button" class="button button--primary" onclick="assignSelectedInterns()"
disabled>Assign</button>
</header> </header>
<sm-input id="intern_search_field" placeholder="Search for interns" type="search" autofocus> <sm-input id="intern_search_field" placeholder="Search for interns" type="search" autofocus>
<svg slot="icon" class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"> <svg slot="icon" class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
@ -795,7 +797,7 @@
d="M18.031 16.617l4.283 4.282-1.415 1.415-4.282-4.283A8.96 8.96 0 0 1 11 20c-4.968 0-9-4.032-9-9s4.032-9 9-9 9 4.032 9 9a8.96 8.96 0 0 1-1.969 5.617zm-2.006-.742A6.977 6.977 0 0 0 18 11c0-3.868-3.133-7-7-7-3.868 0-7 3.132-7 7 0 3.867 3.132 7 7 7a6.977 6.977 0 0 0 4.875-1.975l.15-.15z" /> d="M18.031 16.617l4.283 4.282-1.415 1.415-4.282-4.283A8.96 8.96 0 0 1 11 20c-4.968 0-9-4.032-9-9s4.032-9 9-9 9 4.032 9 9a8.96 8.96 0 0 1-1.969 5.617zm-2.006-.742A6.977 6.977 0 0 0 18 11c0-3.868-3.133-7-7-7-3.868 0-7 3.132-7 7 0 3.867 3.132 7 7 7a6.977 6.977 0 0 0 4.875-1.975l.15-.15z" />
</svg> </svg>
</sm-input> </sm-input>
<ul id="intern_list_container" class="observe-empty-state"></ul> <div id="intern_list_container" class="observe-empty-state"></div>
<h4 class="empty-state">No intern found</h4> <h4 class="empty-state">No intern found</h4>
</sm-popup> </sm-popup>
@ -1279,6 +1281,7 @@
getRef('intern_apply__task').textContent = RIBC.getAllTasks()[floGlobals.tempUserTaskRequest].title getRef('intern_apply__task').textContent = RIBC.getAllTasks()[floGlobals.tempUserTaskRequest].title
openPopup('apply_for_task_popup', true) openPopup('apply_for_task_popup', true)
} else if (typeOfUser === 'intern') { } else if (typeOfUser === 'intern') {
const taskRequests = RIBC.getTaskRequests();
const hasApplied = [...taskRequests, ...sessionTaskRequests].find(({ projectCode, branch, task }) => { const hasApplied = [...taskRequests, ...sessionTaskRequests].find(({ projectCode, branch, task }) => {
return floGlobals.tempUserTaskRequest === `${projectCode}_${branch}_${task}` return floGlobals.tempUserTaskRequest === `${projectCode}_${branch}_${task}`
}) })
@ -1849,7 +1852,7 @@
return `${appState.params.id}_${appState.params.branch}_${task}` === `${projectCode}_${branch}_${taskId}` return `${appState.params.id}_${appState.params.branch}_${task}` === `${projectCode}_${branch}_${taskId}`
}) })
applyButton = html` applyButton = html`
<button class="button button--primary apply-button" .dataset=${{ taskId: `${appState.params.id}_${branch}_${task}` }} ?disabled=${hasApplied}> <button class="button button--primary apply-button" .dataset=${{ taskId: `${appState.params.id}_${appState.params.branch}_${task}` }} ?disabled=${hasApplied}>
${hasApplied ? 'Applied' : 'Apply'} ${hasApplied ? 'Applied' : 'Apply'}
</button>`; </button>`;
} }
@ -1871,17 +1874,20 @@
</div> </div>
`; `;
}, },
internCard(internName, internFloId, internPoints) { internCard(internFloId, { selectable = false } = {}) {
const internName = RIBC.getInternList()[internFloId]
const internPoints = RIBC.getInternRating(internFloId)
const initials = internName.split(' ').map(v => v.charAt(0)).join(''); const initials = internName.split(' ').map(v => v.charAt(0)).join('');
return html` return html`
<li class="intern-card grid align-center interact" .dataset=${{ internFloId }} title="Intern Information"> <label class="intern-card align-center interact" .dataset=${{ internFloId }} title="Intern Information">
${selectable ? html`<input type="checkbox" class="intern-card__checkbox" value=${internFloId}>` : ''}
<div class="intern-card__initials" style=${`--color: var(${getInternColor(internFloId)})`}>${initials}</div> <div class="intern-card__initials" style=${`--color: var(${getInternColor(internFloId)})`}>${initials}</div>
<div class="intern-card__name capitalize">${internName}</div> <div class="intern-card__name capitalize">${internName}</div>
<div class="intern-card__score-wrapper flex align-center"> <div class="intern-card__score-wrapper flex align-center">
<h4 class="intern-card__score">${internPoints}</h4> <h4 class="intern-card__score">${internPoints}</h4>
<svg class="icon icon--star" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"> <path fill="none" d="M0 0h24v24H0z" /> <path d="M12 18.26l-7.053 3.948 1.575-7.928L.587 8.792l8.027-.952L12 .5l3.386 7.34 8.027.952-5.935 5.488 1.575 7.928z" /> </svg> <svg class="icon icon--star" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"> <path fill="none" d="M0 0h24v24H0z" /> <path d="M12 18.26l-7.053 3.948 1.575-7.928L.587 8.792l8.027-.952L12 .5l3.386 7.34 8.027.952-5.935 5.488 1.575 7.928z" /> </svg>
</div> </div>
</li>`; </label>`;
}, },
internUpdateCard(update) { internUpdateCard(update) {
const { floID, time, note, update: { projectCode, branch, task, description, link } } = update const { floID, time, note, update: { projectCode, branch, task, description, link } } = update
@ -2210,9 +2216,6 @@
getRef('task_category_selector').addEventListener('change', (e) => { getRef('task_category_selector').addEventListener('change', (e) => {
window.location.hash = `#/landing?category=${e.target.value}`; window.location.hash = `#/landing?category=${e.target.value}`;
}) })
let allInternsList = [];
let highPerformingInterns = [];
let pinnedProjects = []; let pinnedProjects = [];
let currentIntern; let currentIntern;
let currentTaskId; let currentTaskId;
@ -2552,24 +2555,29 @@
function removeThisTask() { function removeThisTask() {
getConfirmation("Are you sure to delete this task?", { confirmText: 'Delete' }).then((result) => { getConfirmation("Are you sure to delete this task?", { confirmText: 'Delete' }).then((result) => {
if (result) { if (result) {
console.log(appState.params.id, appState.params.branch, currentTask.dataset.taskId)
RIBC.admin.deleteTaskInMap(appState.params.id, appState.params.branch, currentTask.dataset.taskId) RIBC.admin.deleteTaskInMap(appState.params.id, appState.params.branch, currentTask.dataset.taskId)
renderBranchTasks() renderBranchTasks()
} }
}) })
} }
delegate(getRef('intern_list_container'), 'click', '.intern-card', (e) => { floGlobals.selectedInterns = new Set()
delegate(getRef('intern_list_container'), 'change', '.intern-card', (e) => {
const floId = e.target.closest('.intern-card').dataset.internFloId; const floId = e.target.closest('.intern-card').dataset.internFloId;
const internName = RIBC.getInternList()[floId] if (e.target.checked) {
const { projectName } = RIBC.getProjectDetails(appState.params.id) floGlobals.selectedInterns.add(floId)
if (RIBC.admin.assignInternToTask(floId, appState.params.id, appState.params.branch, currentTask.dataset.taskId)) {
notify(`${internName} assigned to ${projectName}`, 'success')
renderBranchTasks()
} else { } else {
notify('intern already assigned', 'error') floGlobals.selectedInterns.delete(floId)
} }
closePopup() getRef('assign_interns_button').disabled = !floGlobals.selectedInterns.size
}) })
function assignSelectedInterns() {
floGlobals.selectedInterns.forEach(floId => {
RIBC.admin.assignInternToTask(floId, appState.params.id, appState.params.branch, currentTask.dataset.taskId)
renderBranchTasks()
})
notify(`Assigned task`, 'success')
closePopup()
}
function renderAllInterns() { function renderAllInterns() {
renderElem(getRef('all_interns_list'), filterInterns('', { sortByRating: true })) renderElem(getRef('all_interns_list'), filterInterns('', { sortByRating: true }))
@ -2787,6 +2795,8 @@
case 'intern_list_popup': case 'intern_list_popup':
renderElem(getRef('intern_list_container'), html``) renderElem(getRef('intern_list_container'), html``)
getRef('intern_search_field').value = '' getRef('intern_search_field').value = ''
floGlobals.selectedInterns.clear()
getRef('assign_interns_button').disabled = true
break; break;
} }
}) })
@ -2802,23 +2812,10 @@
pinnedProjects = localStorage.getItem(`${myFloID}_pinned_projects`) ? localStorage.getItem(`${myFloID}_pinned_projects`).split(',') : [] pinnedProjects = localStorage.getItem(`${myFloID}_pinned_projects`) ? localStorage.getItem(`${myFloID}_pinned_projects`).split(',') : []
//creates cards for highest performing interns
//sort interns earned points
allInternsList = RIBC.getInternList();
highPerformingInterns = [];
for (let intern in allInternsList) {
highPerformingInterns.push({
floId: intern,
internName: allInternsList[intern],
rating: RIBC.getInternRating(intern)
})
}
highPerformingInterns.sort((a, b) => b.rating - a.rating);
// Intern's view // Intern's view
floGlobals.assignedProjectsList = new Set(); floGlobals.assignedProjectsList = new Set();
if (allInternsList[myFloID] && !floGlobals.subAdmins.includes(myFloID)) { if (RIBC.getInternList()[myFloID] && !floGlobals.subAdmins.includes(myFloID)) {
typeOfUser = 'intern'; typeOfUser = 'intern';
document.querySelectorAll('.intern-option').forEach((option) => { document.querySelectorAll('.intern-option').forEach((option) => {
option.classList.remove('hidden') option.classList.remove('hidden')
@ -2947,7 +2944,7 @@
} }
// General only view for non admin and non intern // General only view for non admin and non intern
if (!allInternsList[myFloID] && !floGlobals.subAdmins.includes(myFloID)) { if (!RIBC.getInternList()[myFloID] && !floGlobals.subAdmins.includes(myFloID)) {
document.querySelectorAll('.general-only').forEach((elem) => { document.querySelectorAll('.general-only').forEach((elem) => {
elem.classList.remove('hidden') elem.classList.remove('hidden')
}) })
@ -2975,11 +2972,12 @@
// getRef('application_card').classList.add('hidden') // getRef('application_card').classList.add('hidden')
// } // }
// } // }
//creates cards for highest performing interns
renderElem(getRef('top_interns'), html`${highPerformingInterns.slice(0, 4).map((intern) => { //sort interns earned points
const { internName, floId, rating } = intern const highPerformingInterns = Object.keys(RIBC.getInternList()).sort((a, b) => {
return render.internCard(internName, floId, rating) return RIBC.getInternRating(b) - RIBC.getInternRating(a)
})}`); });
renderElem(getRef('top_interns'), html`${highPerformingInterns.slice(0, 4).map((floId) => render.internCard(floId))}`);
if (typeOfUser === 'intern') { if (typeOfUser === 'intern') {
render.projectList(getRef('my_projects'), [...floGlobals.assignedProjectsList]) render.projectList(getRef('my_projects'), [...floGlobals.assignedProjectsList])
@ -3028,25 +3026,25 @@
availableInternsOnly = false availableInternsOnly = false
} = options } = options
let filtered = []; let filtered = [];
const allInterns = RIBC.getInternList() const allInterns = RIBC.getInternList();
let arrayOfInterns = [] const highPerformingInterns = Object.keys(allInterns).sort((a, b) => {
for (const intern in allInterns) { return RIBC.getInternRating(b) - RIBC.getInternRating(a)
arrayOfInterns.push({ });
floId: intern, let arrayOfInterns = Object.keys(allInterns).sort((a, b) => {
internName: allInternsList[intern] return allInterns[a].toLowerCase().localeCompare(allInterns[b].toLowerCase())
}) })
}
arrayOfInterns.sort((a, b) => a.internName.toLowerCase().localeCompare(b.internName.toLowerCase()))
if (availableInternsOnly) { if (availableInternsOnly) {
arrayOfInterns = arrayOfInterns.filter(intern => !RIBC.getAssignedInterns(appState.params.id, appState.params.branch, currentTask.dataset.taskId).includes(intern.floId)) arrayOfInterns = arrayOfInterns.filter(intern => !RIBC.getAssignedInterns(appState.params.id, appState.params.branch, currentTask.dataset.taskId)?.includes(intern))
} }
if (searchKey === '') { if (searchKey === '') {
filtered = (sortByRating ? highPerformingInterns : arrayOfInterns).map(({ internName, floId }) => { filtered = (sortByRating ? highPerformingInterns : arrayOfInterns).map(floId => {
return render.internCard(internName, floId, RIBC.getInternRating(floId)) return render.internCard(floId, { selectable: availableInternsOnly })
}) })
} else { } else {
filtered = arrayOfInterns.filter(({ internName }) => internName.toLowerCase().includes(searchKey.toLowerCase())).map(({ internName, floId }) => { filtered = filteredMap(arrayOfInterns, (floId) => {
return render.internCard(internName, floId, RIBC.getInternRating(floId)) if (allInterns[floId].toLowerCase().includes(searchKey.toLowerCase())) {
return render.internCard(floId, { selectable: availableInternsOnly })
}
}) })
} }
return html`${filtered}` return html`${filtered}`