team table, create team modal, delete team modal

app/src/plugins/tm@overview/tasks-ongoing/_components/a-ongoing-table.vue

@@ -39,23 +39,9 @@ export default {
 </script>
 
 <style lang="sass" scoped>
-.task-action
-	.trash-icon
-		height: 25px
-		background: rgba(0, 0, 0, 0.04)
-		margin-left: 12px
-		border-radius: 50%
-		cursor: pointer
-	.pencil-icon
-		height: 25px
-		background: rgba(0, 0, 0, 0.04)
-		border-radius: 50%
-		cursor: pointer
-
 v-table, th, td
 	border: thin solid rgba(var(--v-border-color), var(--v-border-opacity))
 
-
 @media screen and (max-width: 496px)
 	.task-action
 		div
@@ -65,4 +51,5 @@ v-table, th, td
 			.pencil-icon, .trash-icon
 				border-radius: 50%
 				margin: 6px
+				padding: 6px
 </style>

app/src/plugins/tm@overview/tasks-unscheduled/_components/a-unscheduled-table.vue

@@ -37,24 +37,10 @@ export default {
 </script>
 
 <style lang="sass" scoped>
-.task-action
-	.trash-icon
-		height: 25px
-		background: rgba(0, 0, 0, 0.04)
-		margin-left: 12px
-		border-radius: 50%
-		cursor: pointer
-	.pencil-icon
-		height: 25px
-		background: rgba(0, 0, 0, 0.04)
-		border-radius: 50%
-		cursor: pointer
-
 v-table, th, td
 	border: thin solid rgba(var(--v-border-color), var(--v-border-opacity))
 
-
-@media screen and (max-width: 496px)
+@media screen and (max-width: 379px)
 	.task-action
 		div
 			display: flex
@@ -63,4 +49,5 @@ v-table, th, td
 			.pencil-icon, .trash-icon
 				border-radius: 50%
 				margin: 6px
+				padding: 6px
 </style>

app/src/plugins/tm@overview/teams/_components/a-teams-table.vue

@@ -0,0 +1,64 @@
+<template>
+	<v-table>
+		<thead>
+			<tr>
+				<th class="text-left">Názov</th>
+				<th class="text-left">Akcia</th>
+			</tr>
+		</thead>
+
+		<tbody>
+			<tr v-for="team in teams" :key="team.id">
+				<td>{{ team.name }}</td>
+				<td class="task-action">
+					<div class="d-flex justify-start">
+						<img
+							class="pencil-icon"
+							:src="
+								require('@/plugins/tm@overview/_img/pencil-icon.svg')
+							"
+							alt="pencil-icon"
+						/>
+						<img
+							class="trash-icon"
+							:src="
+								require('@/plugins/tm@overview/_img/trash-icon.svg')
+							"
+							alt="trash-icon"
+							@click.stop="dialog=true"
+						/>
+						<A-delete-team-modal :visible="dialog" @close="dialog=false" />
+					</div>
+				</td>
+			</tr>
+		</tbody>
+	</v-table>
+</template>
+
+<script>
+import ADeleteTeamModal from '../../../app/_components/a-delete-team-modal.vue'
+
+export default {
+	components: {
+		ADeleteTeamModal
+	},
+
+	data() {
+		return {
+			dialog: false
+		}
+	},
+
+	props: {
+		teams: {
+			type: Array,
+			required: true,
+		},
+	}
+}
+</script>
+
+<style lang="sass" scoped>
+v-table, th, td
+	border: thin solid rgba(var(--v-border-color), var(--v-border-opacity))
+</style>

app/src/plugins/tm@overview/teams/teams.vue

@@ -1,9 +1,29 @@
 <template>
-	<div></div>
+	<W-loadable :content="teams">
+		<A-teams-table :teams="teams" />
+	</W-loadable>
 </template>
 
 <script>
-export default {
+import ATeamsTable from './_components/a-teams-table.vue'
 
+export default {
+	components: {
+		ATeamsTable
+	},
+
+	data() {
+		return {
+			teams: null
+		}
+	},
+
+	async created() {
+		try {
+			this.teams = await this.$axios.get_auth_data('v1/teams')
+		} catch (error) {
+			console.error(error)
+		}
+	}
 }
 </script>