<template>
    <li class="order-item" :class="active" @click="click">
        <span class="order-name">{{txt}}</span>
    </li>
</template>
<script>
export default {
    props: ['txt', 'val'],
    computed: {
        active: function() {
            if (this.val === this.$parent.val) {
                return 'active';
            }
        }
    },
    methods: {
        click: function() {
            this.$parent.val = this.val;
        }
    }
};
</script>