JandL_gitea/jandl-taskmanager-app
1
0 Fork 0
mirror of https://bitbucket.org/studiotem/jandl-taskmanager-app.git synced 2026-10-21 14:29:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

edit-team-modal + male zmeny

Browse Source
This commit is contained in:
romankko2 committed 2022-11-30 13:59:52 +01:00
1 parent 29c0ea970b
commit 8d082b806f
7 files changed
+263 -62
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

app/src/plugins/app/_components/a-team-modal.vue → app/src/plugins/app/_components/a-create-team-modal.vue
+1 -1
View File
@@ -42,7 +42,7 @@
> --> > -->
<v-autocomplete <v-autocomplete
class="modal-input" class="modal-input"
label="Vyhladat" label="Vyhľadať"
variant="outlined" variant="outlined"
:items="employeesOptions" :items="employeesOptions"
v-model="selectedEmployee" v-model="selectedEmployee"
app/src/plugins/app/_components/a-delete-team-modal.vue
+1 -1
View File
@@ -46,7 +46,7 @@ export default {
computed: { computed: {
show: { show: {
get() { get() {
return this.visible; return this.visible
}, },
set(value) { set(value) {
app/src/plugins/app/_components/a-edit-team-modal.vue
+165
View File
@@ -0,0 +1,165 @@
<template>
<v-dialog v-model="show" max-width="650" max-height="90%" height="700px">
<!-- <W-loadable :content="employees" class="h-100"> -->
<v-card height="100%" class="d-flex flex-column">
<div class="d-flex justify-space-between align-center modal-header">
<h1>Editovať tím</h1>
<v-icon
@click.stop="show = false"
icon="mdi-close"
size="large"
></v-icon>
</div>
<v-card-actions class="d-flex flex-column modal-content">
<v-text-field
class="modal-input"
label='teams.name'
variant="outlined"
></v-text-field>
<div class="employee-position w-100" v-for="(employee, index) in selectedEmployees" :key="employee.id">
<v-text-field
class="modal-input"
disabled
label="Zamestanec"
variant="outlined"
v-model="selectedEmployees[index].surname"
>
</v-text-field>
<v-icon
class="remove-input"
@click="removeInput(index)"
icon="mdi-close"
size="small"
></v-icon
>
</div>
<v-autocomplete
class="modal-input"
label="Vyhľadať"
variant="outlined"
:items="employeesOptions"
v-model="selectedEmployee"
></v-autocomplete>
</v-card-actions>
<v-btn class="create-btn" @click="editTeam()">ULOŽIŤ</v-btn>
</v-card>
<!-- </W-loadable> -->
</v-dialog>
</template>
<script>
export default {
props: [
'visible'
],
data() {
return {
// teams: null,
// selectedEmployee: "",
// selectedEmployees: [],
// currentEmployees: null,
}
},
// async created() {
// try {
// this.currentEmployees = await this.$axios.get_auth_data("v1/employees");
// } catch (error) {
// console.log(error)
// }
// },
methods: {
// removeInput(index) {
// this.selectedEmployees.splice(index, 1)
// },
// async editTeam(id) {
// try{
// this.teams = await this.$axios.get_auth_data(`v1/teams/${id}`)
// this.$router.push({ name: 'Overview - Teams' })
// this.show = false
// } catch (error) {
// this.$toast.error(error.response.data.error)
// }
// }
},
computed: {
// employeesOptions() {
// const selectedEmployeesIds = this.selectedEmployees.map(
// (employee) => employee.id
// );
// const currentEmployees = this.currentEmployees.filter(
// (employee) => !selectedEmployeesIds.includes(employee.id)
// );
// return currentEmployees.map(
// (employee) => `${employee.name} ${employee.surname}`
// );
// },
show: {
get() {
return this.visible;
},
set(value) {
if (!value) this.$emit('close')
},
},
},
// watch: {
// selectedEmployee() {
// const selectedEmployee = this.selectedEmployee.split(" ");
// const employee = this.currentEmployees.find(
// (e) =>
// e.name == selectedEmployee[0] &&
// e.surname == selectedEmployee[1]
// );
// this.currentEmployees.push(JSON.parse(JSON.stringify(employee)));
// // this.selectedEmployee = ''
// },
// },
};
</script>
<style lang="sass" scoped>
.modal-input
width: 100%
flex: 0 0 auto
.modal-header
flex: 0 0 auto
.modal-content
flex: 1 1 100%
margin: 10px 0
overflow-y: scroll
.create-btn
height: 50px
width: 100%
flex: 0 0 auto
background: #7f39fb
border-radius: 4px
color: #fff
.remove-input
pointer-events: auto
opacity: 2
position: absolute
left: 92%
top: 25%
.employee-position
position: relative
</style>
app/src/plugins/app/_config/router.ts
+3 -2
View File
@@ -61,12 +61,13 @@ const routes: Array<RouteRecordRaw> = [
{ {
path: '/app/overview/unscheduled', path: '/app/overview/unscheduled',
name: 'Overview - Unscheduled tasks', name: 'Overview - Unscheduled tasks',
component: () => import('@/plugins/tm@overview/tasks-ongoing/tasks-ongoing.vue') component: () => import('@/plugins/tm@overview/tasks-unscheduled/tasks-unscheduled.vue')
}, },
{ {
path: '/app/overview/ongoing', path: '/app/overview/ongoing',
name: 'Overview - Ongoing tasks', name: 'Overview - Ongoing tasks',
component: () => import('@/plugins/tm@overview/tasks-unscheduled/tasks-unscheduled.vue') component: () => import('@/plugins/tm@overview/tasks-ongoing/tasks-ongoing.vue')
}, },
{ {
path: '/app/overview/teams', path: '/app/overview/teams',
app/src/plugins/app/_layout/app/_components/a-header.vue
+26 -22
View File
@@ -8,14 +8,14 @@
<div class="d-flex justify-center align-center"> <div class="d-flex justify-center align-center">
<div class="d-flex justify-center align-center pos-col"> <div class="d-flex justify-center align-center pos-col">
<img <img
class="search-icon mx-3" class="search-icon"
:src=" :src="
require('@/plugins/app/_layout/app/_img/search-icon.svg') require('@/plugins/app/_layout/app/_img/search-icon.svg')
" "
alt="search-icon" alt="search-icon"
/> />
<input <input
class="search-input mx-2" class="search-input"
type="text" type="text"
placeholder="Vyhľadávanie" placeholder="Vyhľadávanie"
/> />
@@ -37,7 +37,7 @@
</v-list-item> </v-list-item>
<v-list-item class="dropdown-hover" @click.stop="dialog=true" > <v-list-item class="dropdown-hover" @click.stop="dialog=true" >
TÍM TÍM
<A-team-modal :visible="dialog" @close="dialog=false" /> <A-create-team-modal :visible="dialog" @close="dialog=false" />
</v-list-item> </v-list-item>
<v-list-item class="dropdown-hover"> <v-list-item class="dropdown-hover">
BLOKER BLOKER
@@ -56,27 +56,29 @@
<div class="text-center"> <div class="text-center">
<v-menu open-on-hover> <v-menu open-on-hover>
<template v-slot:activator="{ props }"> <template v-slot:activator="{ props }">
<v-btn <div>
class="text-transform" <v-btn
v-if="user" class="text-transform"
v-bind="props" v-if="user"
> v-bind="props"
{{ >
`${user.user.name} ${user.user.surname}` {{
}} `${user.user.name} ${user.user.surname}`
<v-icon }}
class="pl-5" <v-icon
icon="mdi-chevron-down" class="pl-5"
size="x-small" icon="mdi-chevron-down"
></v-icon> size="x-small"
</v-btn> ></v-icon>
</v-btn>
</div>
</template> </template>
<v-list class="text-center"> <v-list class="text-center">
<v-list-item class="dropdown-hover"> <v-list-item class="dropdown-hover">
Working hours Working hours
</v-list-item> </v-list-item>
<v-list-item> <v-list-item class="dropdown-hover">
<v-btn class="logout-btn" <v-btn class="logout-btn"
>Odhlásiť sa</v-btn >Odhlásiť sa</v-btn
> >
@@ -92,11 +94,11 @@
</template> </template>
<script> <script>
import ATeamModal from '../../../_components/a-team-modal.vue' import ACreateTeamModal from '../../../_components/a-create-team-modal.vue'
export default { export default {
components: { components: {
ATeamModal ACreateTeamModal
}, },
data() { data() {
@@ -108,7 +110,7 @@ export default {
async created() { async created() {
try { try {
this.user = await this.$axios.get_auth_data("v1/auth/info"); this.user = await this.$axios.get_auth_data("v1/auth/info")
} catch (error) { } catch (error) {
console.log(error) console.log(error)
} }
@@ -134,6 +136,7 @@ export default {
background: #7f39fb background: #7f39fb
border-radius: 4px border-radius: 4px
color: #fff color: #fff
margin-right: 30px
.logout-btn .logout-btn
background: #7f39fb background: #7f39fb
@@ -145,6 +148,8 @@ export default {
.search-input .search-input
outline: none outline: none
margin-left: 10px
margin-right: 5px
.search-icon .search-icon
border: 2px solid #e0e0e0 border: 2px solid #e0e0e0
@@ -187,5 +192,4 @@ export default {
&:hover &:hover
background: #F2E7FE background: #F2E7FE
font-weight: bolder
</style> </style>
app/src/plugins/app/_layout/app/_components/a-sidemenu.vue
+60 -34
View File
@@ -1,12 +1,28 @@
<template> <template>
<ion-menu ref="menu" content-id="main-content"> <ion-menu ref="menu" content-id="main-content">
<ion-content> <ion-content>
<img class="logo" :src="require('@/plugins/app/_layout/_img/jandl-logo.svg')" alt="jandl-logo" /> <img
class="logo"
:src="require('@/plugins/app/_layout/_img/jandl-logo.svg')"
alt="jandl-logo"
/>
<ion-list lines="none" id="labels-list"> <ion-list lines="none" id="labels-list">
<ion-item v-for="page in pages" :key="page.pageName" :class="{active: isActive(page.pageName)}" <ion-item
@click="$router.push({name: page.pageName}); closeMenu()"> v-for="page in pages"
{{ page.title }}<span v-if="page.pageName == 'Overview - Unscheduled tasks'" class="mx-1 unfinished-tasks">13</span> :key="page.pageName"
:class="{ active: isActive(page.pageName) }"
@click="
$router.push({ name: page.pageName });
closeMenu()
"
>
{{ page.title
}}<span
v-if="page.pageName == 'Overview - Unscheduled tasks'"
class="mx-1 unfinished-tasks"
>{{ unscheduledTasksLength }}</span
>
</ion-item> </ion-item>
</ion-list> </ion-list>
</ion-content> </ion-content>
@@ -17,39 +33,48 @@
export default { export default {
data() { data() {
return { return {
pages: [{ unscheduledTasksLength: null,
title: 'Úlohy', pages: [
pageName: 'Dashboard - Tasks' {
}, title: "Úlohy",
{ pageName: "Dashboard - Tasks",
title: 'Tímove zobrazenie', },
pageName: 'Dashboard - Teams' {
}, title: "Tímove zobrazenie",
{ pageName: "Dashboard - Teams",
title: 'Projektové zobrazenie', },
pageName: 'Dashboard - Projects' {
}, title: "Projektové zobrazenie",
{ pageName: "Dashboard - Projects",
title: 'Nenaplánované úlohy', },
pageName: 'Overview - Unscheduled tasks' {
}, title: "Nenaplánované úlohy",
{ pageName: "Overview - Unscheduled tasks",
title: 'Ongoing tasky', },
pageName: 'Overview - Ongoing tasks' {
}, title: "Ongoing tasky",
{ pageName: "Overview - Ongoing tasks",
title: 'Tímy', },
pageName: 'Overview - Teams' {
}] title: "Tímy",
pageName: "Overview - Teams",
},
],
} }
}, },
created() { created() {
this.eventBus.on('close-menu', () => this.closeMenu()) this.eventBus.on("close-menu", () => this.closeMenu())
this.eventBus.on('toggle-menu', () => this.toggleMenu()) this.eventBus.on("toggle-menu", () => this.toggleMenu())
this.unscheduledTasks()
}, },
methods: { methods: {
async unscheduledTasks() {
let x = await this.$axios.get_auth_data('v1/overview/unscheduled-tasks')
this.unscheduledTasksLength = x.length
},
isActive(pageName) { isActive(pageName) {
return this.$route.name == pageName return this.$route.name == pageName
}, },
@@ -60,9 +85,9 @@ export default {
toggleMenu() { toggleMenu() {
this.$refs.menu.$el.toggle() this.$refs.menu.$el.toggle()
} },
}, },
}; }
</script> </script>
<style lang="sass" scoped> <style lang="sass" scoped>
@@ -101,7 +126,8 @@ ion-item
color: #fff color: #fff
background: #B00020 background: #B00020
border-radius: 50% border-radius: 50%
padding: 0 4px
margin-bottom: 15px margin-bottom: 15px
width: fit-content height: 25px
width: 25px
text-align: center
</style> </style>
app/src/plugins/tm@overview/teams/_components/a-teams-table.vue
+7 -2
View File
@@ -18,7 +18,9 @@
require('@/plugins/tm@overview/_img/pencil-icon.svg') require('@/plugins/tm@overview/_img/pencil-icon.svg')
" "
alt="pencil-icon" alt="pencil-icon"
@click.stop="editTeam=true"
/> />
<A-edit-team-modal :visible="editTeam" @close="editTeam=false" />
<img <img
class="trash-icon" class="trash-icon"
:src=" :src="
@@ -37,15 +39,18 @@
<script> <script>
import ADeleteTeamModal from '../../../app/_components/a-delete-team-modal.vue' import ADeleteTeamModal from '../../../app/_components/a-delete-team-modal.vue'
import AEditTeamModal from '../../../app/_components/a-edit-team-modal.vue'
export default { export default {
components: { components: {
ADeleteTeamModal ADeleteTeamModal,
AEditTeamModal
}, },
data() { data() {
return { return {
dialog: false dialog: false,
editTeam: false
} }
}, },