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

<template>
	<div>
		<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" @click.stop="editTeam(team)" />
							<img class="trash-icon" :src="require('@/plugins/tm@overview/_img/trash-icon.svg')" alt="trash-icon" @click.stop="deleteModal = { team }" />
						</div>
					</td>
				</tr>
			</tbody>
		</v-table>

		<Z-team-modal ref="z-team-modal" />
		<Z-delete-team-modal 	v-if="deleteModal" 	:visible="deleteModal ? true : false" 	:team="deleteModal.team" 	@close="(deleteModal = null)" />
	</div>
</template>

<script>
import ZDeleteTeamModal from '@/plugins/tm@modal/team/z-delete-team-modal.vue'
import ZTeamModal		from '@/plugins/tm@modal/team/z-team-modal.vue'

export default {
	components: {
		ZDeleteTeamModal,
		ZTeamModal
	},

	props: {
		teams: {
			type: Array,
			required: true
		}
	},

	data() {
		return {
			deleteModal: null
		}
	},

	methods: {
		editTeam(team) {
			this.$refs['z-team-modal'].create(team)
		}
	}
}
</script>

<style lang="sass" scoped>
v-table, th, td
	border: thin solid rgba(var(--v-border-color), var(--v-border-opacity))
</style>