Improve user experience

master
John Montagu, the 4th Earl of Sandvich 2024-11-24 15:45:42 -08:00
parent eee3241cae
commit 8bef735756
Signed by: sandvich
GPG Key ID: 9A39BE37E602B22D
3 changed files with 17 additions and 8 deletions

View File

@ -37,11 +37,11 @@ function onClick() {
rosterStore.selectPlayerForRole(undefined, props.roleTitle); rosterStore.selectPlayerForRole(undefined, props.roleTitle);
} else { } else {
if (props.isRinger) { if (props.isRinger) {
const ringerPlayer: PlayerTeamRole = { const ringerPlayer: PlayerTeamRoleFlat = {
steamId: -1, steamId: "0",
name: "Ringer", name: "Ringer",
role: props.roleTitle, role: props.roleTitle ?? "",
main: false, isMain: false,
availability: 1, availability: 1,
playtime: -1, playtime: -1,
}; };

View File

@ -59,6 +59,10 @@ function updateRoles() {
teamsStore.updateRoles(props.team.id, props.player.steamId, updatedRoles.value); teamsStore.updateRoles(props.team.id, props.player.steamId, updatedRoles.value);
} }
function cancelEdit() {
isEditing.value = false;
}
const isUnavailable = computed(() => { const isUnavailable = computed(() => {
return props.player?.availability[0] == 0 && return props.player?.availability[0] == 0 &&
props.player?.availability[1] == 0; props.player?.availability[1] == 0;
@ -126,7 +130,7 @@ const rightIndicator = computed(() => {
<svg-icon v-if="player.isTeamLeader" type="mdi" :path="mdiCrown" /> <svg-icon v-if="player.isTeamLeader" type="mdi" :path="mdiCrown" />
</div> </div>
</td> </td>
<td> <td :colspan="isEditing ? 2 : 1">
<div class="role-icons flex-middle"> <div class="role-icons flex-middle">
<div class="role-buttons" v-if="isEditing"> <div class="role-buttons" v-if="isEditing">
<RoleTag <RoleTag
@ -155,17 +159,20 @@ const rightIndicator = computed(() => {
</span> </span>
</div> </div>
</td> </td>
<td> <td v-if="!isEditing">
<span :class="{ 'aside': player.playtime == 0}"> <span :class="{ 'aside': player.playtime == 0}">
{{ player.playtime.toFixed(1) }} hours {{ player.playtime.toFixed(1) }} hours
</span> </span>
</td> </td>
<td> <!--td>
{{ new Date(player.createdAt).toLocaleString() }} {{ new Date(player.createdAt).toLocaleString() }}
</td> </td-->
<td> <td>
<div class="edit-group"> <div class="edit-group">
<template v-if="isEditing"> <template v-if="isEditing">
<button class="editing" @click="cancelEdit()">
<i class="bi bi-x-lg" />
</button>
<button class="editing" @click="updateRoles()"> <button class="editing" @click="updateRoles()">
<i class="bi bi-check-lg" /> <i class="bi bi-check-lg" />
</button> </button>

View File

@ -15,6 +15,7 @@ describe("Schedule store", () => {
id: 0, id: 0,
tzTimezone: "Asia/Kolkata", tzTimezone: "Asia/Kolkata",
minuteOffset: 10, minuteOffset: 10,
createdAt: "",
}); });
expect(test1.get("minutes")).toEqual(40); expect(test1.get("minutes")).toEqual(40);
@ -24,6 +25,7 @@ describe("Schedule store", () => {
id: 0, id: 0,
tzTimezone: "America/New_York", tzTimezone: "America/New_York",
minuteOffset: 30, minuteOffset: 30,
createdAt: "",
}); });
expect(test2.get("minutes")).toEqual(30); expect(test2.get("minutes")).toEqual(30);