<template>
    <v-menu
        :position-x="positionX"
        :position-y="positionY"
        absolute
        offset-y
        :close-on-click="false"
        :close-on-content-click="false"
        content-class="elevation-1"
        :min-width="form.width"
        :max-width="form.width"
        v-model="form.visible"
    >
        <v-card
            :width="form.width"
            class="mx-auto"
        >
            <cs-form-card 
                :form="form"
                :messageBox="null"
                
            > 
                <team-customers-work-input 
                    :controls="controls"
                    :activeRecord="activeRecord"
                    :errorsManager="errorsManager"
                    :action="action"
                    :currentAction="currentAction"
                    :height="app.height"
                    :app="app"
                />
            </cs-form-card>
        </v-card>
    </v-menu>
</template>

<script>
    export default {
        props: {
            app: {required: true},
            form: {required: true},
        },

        computed: {
            positionX() {
                return 0.5 * (this.app.width - this.form.width);
            },

            positionY() {
                return 52 + 0.5 * (this.app.height - this.form.height);
            }
        },

        components: {
            CsFormCard: require('@CsVueComp/cards/CsFormCard').default,
        },

        mixins: [
            require('@CsVueMix/Forminput/Forminput')
        ],

        name: 'TeamCustomersWorkFormMenu',
    }
</script>