<template>
    <nb-container>
        <Header
            title="Редактировать"
            :navigation="this.props.navigation"
            :left-button="{
                show: true,
                icon: 'md-arrow-back',
                action: () => this.props.navigation.goBack()
            }"
            :right-button="{
                show: false
            }"
            :right-second-button="{
                show: false
            }"
        />

        <nb-content>
            <nb-form>
                <nb-separator bordered>
                    <nb-text>Информация о предмете</nb-text>
                </nb-separator>

                <nb-content padder>
                    <nb-item :disabled="setNull" stackedLabel>
                        <nb-label>Название предмета</nb-label>
                        <nb-input :disabled="setNull" v-model="lesson.name" />
                    </nb-item>
                </nb-content>

                <nb-content padder>
                    <nb-item :disabled="setNull" stackedLabel>
                        <nb-label>Номер аудитории</nb-label>
                        <nb-input :disabled="setNull" v-model="lesson.audience" />
                    </nb-item>
                </nb-content>

                <nb-list-item
                    class="checkbox-wrapper"
                    last
                    :onPress="() => setNull = !setNull"
                >
                    <nb-left>
                        <nb-text>Нет занятия</nb-text>
                    </nb-left>

                    <nb-right>
                        <nb-checkbox
                            class="checkbox"
                            :checked="setNull"
                        />
                    </nb-right>
                </nb-list-item>
            </nb-form>

            <nb-content padder>
                <nb-button
                        class="button"
                        block
                        primary
                        :onPress="editLesson"
                >
                    <nb-spinner v-if="loading" color="#fff"></nb-spinner>
                    <nb-text v-if="!loading">Сохранить</nb-text>
                </nb-button>
            </nb-content>
        </nb-content>
    </nb-container>
</template>

<script>
    import { Toast } from "native-base";

    import Header from "../../components/Header";

    import store from "../../store";

    export default {
        name: "EditLesson",
        components: {
            Header
        },
        props: {
            navigation: Object,
        },
        data() {
            return {
                lesson: {
                    name: '',
                    audience: ''
                },
                editableLesson: Object,
                setNull: false,
                loading: false
            }
        },
        mounted() {
            this.editableLesson = this.navigation.getParam('editableLesson');

            this.lesson.name = this.editableLesson.name;
            this.lesson.audience = this.editableLesson.audience;

            if (this.editableLesson.name === 'Нет занятия') this.setNull = true;
        },
        methods: {
            toggleNullableLesson() {
                this.setNull = !this.setNull;

                this.lesson.name = (this.setNull) ? 'Нет занятия' : '';
                this.lesson.audience = '';
            },
            async editLesson() {
                this.loading = false;

                let response = await this.$plugins.f(
                    `lesson/${this.editableLesson.id}`,
                    'PATCH',
                    store.state.userObj.api_token,
                    JSON.stringify(this.lesson),
                    true
                );

                console.log(response)

                if (response.body.status) {
                    Toast.show({
                        text: "Предмет успешно изменен",
                        buttonText: "ОК",
                        type: "success",
                        duration: 3000
                    });
                } else {
                    Toast.show({
                        text: "Произошла ошибка, проверьте правильность заполнения полей!",
                        buttonText: "Закрыть",
                        type: "danger",
                        duration: 3000
                    });
                }

                this.loading = false;
            }
        }
    }
</script>

<style scoped>

</style>