<template>
	<section class="project-calendar">
		<div class="project-view-empty">
			<ProjectCalendarEmptyGraphic
				:color="project.accentColor"
			/>
			<h2>
				Schedule your tasks
			</h2>
			<p>
				Define start and due dates for your tasks to plot them into the project calendar
			</p>
			<w-button
				bg-color="primary"
				color="white"
				@click="openTaskCreator"
			>
				Create task
				<w-icon class="right">
					mdi mdi-plus
				</w-icon>
			</w-button>
		</div>
	</section>
</template>

<script lang="ts">
import Vue from 'vue';

export default Vue.extend({
	props: {
		project: Object
	},
	
	methods: {
		openTaskCreator() {
			this.$store.commit('viewNewTaskDialog', true);
		}
	}
});
</script>