<template>
    <v-sheet tile>
        <v-row dense>

            <v-col cols="12">
                <cs-password-box 
                    :control="controls.oldpassword"
                    :errors="errorsManager.ByField('oldpassword')"

                    v-model="activeRecord.oldpassword"
                    
                    @focus="errorsManager.ResetField('oldpassword')"
                    @blur="errorsManager.Validate('oldpassword')"
                />
            </v-col>

            <v-col cols="12">
                <cs-password-box 
                    :control="controls.password"
                    :errors="errorsManager.ByField('password')"

                    v-model="activeRecord.password"
                    
                    @focus="errorsManager.ResetField('password')"
                    @blur="errorsManager.Validate('password')"
                />
            </v-col>

            <v-col cols="12">
                <cs-password-box 
                    :control="controls.password_confirmation"
                    :errors="errorsManager.ByField('password_confirmation')"

                    v-model="activeRecord.password_confirmation"
                    
                    @focus="errorsManager.ResetField('password_confirmation')"
                    @blur="errorsManager.Validate('password_confirmation')"
                />
            </v-col>
      
        </v-row>
    </v-sheet>
</template>

<script>
    export default {

        props: {
            controls: {default: () => ({})},
            activeRecord: {required: true},
            errorsManager: {required: true},
            action: {required: true},
            currentAction: {required: true},
        },

        components: {
            CsTextBox: require('@CsVueComp/controls/texts/CsTextBox').default, 
            CsPasswordBox: require('@CsVueComp/controls/texts/CsPasswordBox').default, 
            CsInfoAlert: require('@CsVueComp/sheets/CsInfoAlert').default,
            CsFileUploader: require('@CsVueComp/controls/files/CsFileUploader/CsFileUploader').default,
        },

        name: 'UserChangePasswordInput',
    }
</script>