<template lang="pug">
h3 RECRUITER
p {{question}}
DynamicTagList(:tags="skills" :placeholder="'skill'")
w-button.ma1.grow(@click="handleSubmit") NEXT
</template>
<script>
import DynamicTagList from '../DynamicTagList.vue'
export default {
    name: 'Skills',
    components:{
        DynamicTagList
    },
    props: {
        currentStep:{
            required: true,
            type: Number,
            default: 0
        }
    },
    emits: ['go-to-step', 'update-answers'],
    data: () => ({
        question: 'What are some skills you are looking for at your company?',
        skills: []
    }),
    methods: {
        handleSubmit(){
            let payload = {
                key: 'Skills',
                question: this.question,
                answer: this.skills
            }
            this.$emit('update-answers', payload)
            this.$emit('go-to-step', this.currentStep + 1)
        }
    }
}
</script>