<template>
    <v-select
        dense
        hide-details
        outlined
        :items="options"
        v-model="myvalue"
    >
    </v-select>
</template>

<script>
    // import Control from '@CsClasses/Controls/Control';

    export default {
        props: {
            app: {required: true},
            column: {required: true},
            rowvalues: {required: true},
        },

        data: () => ({
            control: null,
            myvalue: null,
        }),

        computed: {
            options() {
                if( ! this.column.props )
                {
                    return [];
                }
                if( ! _.has(this.column.props, 'options') )
                {
                    return [];
                }
                return this.column.props.options;
            }
        },

        watch: {
            rowvalues: {
                deep: true,
                handler: function() {
                    this.myvalue = this.rowvalues['col-' + this.column.id];
                },
            },

            myvalue: function(value) {
                let r = {...this.rowvalues};
                r['col-' + this.column.id]  = value;
                this.$emit('update-values', r);
            },
        },

        created() {
            this.myvalue = this.rowvalues['col-' + this.column.id];
        },

        components: {
            CsTextBox: require('@CsVueComp/controls/texts/CsTextBox').default,
        },
        
        name: 'RegistruRowInputOptionsbox',
    }
</script>