class SubmissionFormTeamMemberDialog extends EICDialogContent {

    actions = [
        {
            label: 'Cancel',
            onclick: this.cancel.bind(this),
            severity: 'secondary',
            role: 'cancel'
        },
        {
            label: 'Save',
            onclick: this.save.bind(this),
            severity: 'primary',
            role: 'save',
            disabled: false
        },
    ]

    DOMContentLoaded(options) {
        this.mode = options.mode ? options.mode: 'create';
        this.model = options.model;
        this.member = options.member;
        this.pic = options.pic;
        this.number = options.number;
        let components = ui.eicfy(this.el);

        let position = this.find('select[name="position"]');
        app.meta.toOptions('organisation-functions', null, true).forEach(item => position.append(item));
        
        position.addEventListener('change', this.onPositionChanged.bind(this));

        this.form = new Form(this.el);
        if(this.member) this.form.fill(components,this.member);
    }

    onPositionChanged(event) {
        let value = event.currentTarget.value;

        if(value.indexOf('CEO') == 0) {
            this.find('input[name="email"]').classList.add('required')
        } else {
            this.find('input[name="email"]').classList.remove('required')
        }
    }

    save(event) {                
        
        if(this.form.validate()) {
            this.actions.find(o => o.role == 'save').button.loading = true;
            this.actions.find(o => o.role == 'cancel').button.disabled = true;
            
            if(this.mode == 'create') {
                this.model.create(this.pic, this.number, this.form.value)
                .then(async payload => {
                    this.find('[name="id"]').value = payload.id
                    this.commit(this.form.value);
                    this.actions.find(o => o.role == 'save').button.loading = false;
                    this.actions.find(o => o.role == 'cancel').button.disabled = false;
                },
                failed => {
                    this.actions.find(o => o.role == 'save').button.loading = false;
                    this.actions.find(o => o.role == 'cancel').button.disabled = false;
                    this.abort();
                })    
            } 
            if(this.mode == 'update') {
                this.model.update(this.pic, this.number, this.form.value)
                .then(async payload => {
                    this.commit(this.form.value)
                    this.actions.find(o => o.role == 'save').button.loading = false;
                    this.actions.find(o => o.role == 'cancel').button.disabled = false;
                },
                failed => {
                    this.actions.find(o => o.role == 'save').button.loading = false;
                    this.actions.find(o => o.role == 'cancel').button.disabled = false;
                    this.abort();
                })    
            } 
        }
        
    }

    

}

app.registerClass('SubmissionFormTeamMemberDialog', SubmissionFormTeamMemberDialog);