/**
 *
 * SETTINGS AND EXTERNAL VALUES
 *
 */

Vue.prototype.$secure_code = secure_code;


/**
 *
 * MIXINS
 *
 */

var componentsFuncs = {
    mixins: [mainFuncs],
    methods: {
        getReqPath: function (action) {
            return '/bitrix/sprod_dsync_diagnostics_ajax.php?action=' + action + '&sc=' + this.$secure_code;
        },
        blockSaveData: function (code, callback) {
            this.state.active = false;
            this.ajaxReq(code + '_save', 'post', {
                fields: this.fields,
            }, (response) => {
                this.state.active = true;
                // All blocks update
                this.$emit('block_update', code);
            }, (response) => {
            }, (response) => {
                // Callback success
                if (typeof callback === 'function') {
                    callback(response);
                }
            });
        },
    },
    mounted() {
    },
};


/**
 *
 * COMPONENTS
 *
 */

// Display table
Vue.component('info-table', {
    props: ['blocks'],
    data: function () {
        return {
        }
    },
    template: `
<div>
    <b-card v-for="block in blocks" :title="block.title">
        <b-table hover :items="block.list">
            <template #cell(value)="data">
                <span v-html="data.value"></span>
            </template>
        </b-table>
    </b-card>
</div>
`,
    mixins: [utilFuncs, componentsFuncs],
});

// File log
Vue.component('status-filelog', {
    props: ['fields'],
    data: function () {
        return {
            code: 'filelog',
            state: {
                display: true,
                active: true,
            },
            reset_btn: {
                active: true,
            },
        }
    },
    methods: {
        clearLog: function (status) {
            this.reset_btn.active = false;
            this.ajaxReq('filelog_reset', 'get', false, (response) => {
                // All blocks update
                this.$emit('block_update', this.code);
            }, (response) => {}, (response) => {
                this.reset_btn.active = true;
            });
        }
    },
    template: `
<div class="card" v-bind:class="{ \'block-disabled\': state.active == false }" v-if="state.display">
    <div class="card-body">
        <div class="checkbox checkbox-info mb-3">
            <input id="status_filelog_active" type="checkbox" v-model="fields.active" @change="blockSaveData(code)">
            <label for="status_filelog_active">{{ $t("page.SP_DS_DIAGNOSTICS_FILELOG_ACTIVE") }}</label>
        </div>
        <div class="file-link" v-if="fields.info">
            <label>{{ $t("page.SP_DS_DIAGNOSTICS_FILELOG_LINK") }}</label>
            <p><a :href="fields.link" target="_blank">{{fields.link}}</a> <b-badge variant="light">{{fields.info.size_f}}</b-badge></p>
            <b-button variant="danger" size="sm" :disabled="!reset_btn.active" @click="clearLog">{{ $t("page.SP_DS_DIAGNOSTICS_FILELOG_CLEAR") }}</b-button>
        </div>
    </div> <!-- end card-body -->
</div> <!-- end card -->
`,
    mixins: [utilFuncs, componentsFuncs],
});


/**
 *
 * VUE APP
 *
 */

const i18n = new VueI18n({
    locale: 'ru',
    messages,
});

var app = new Vue({
    el: '#app',
    i18n,
    mixins: [utilFuncs, mainFuncs, componentsFuncs],
    data: {
        info: [],
        options: [],
        profiles: [],
        store_fields: [],
        crm_fields: [],
        handlers: [],
        filelog: [],
        errors: [],
        warnings: [],
    },
    methods: {
        // Blocks update
        updateBlocks: function (calling_block) {
            this.startLoadingInfo();
            this.ajaxReq('get_all_info', 'get', {}, (response) => {
                this.stopLoadingInfo();
                // Get data
                this.info = response.data.info;
                this.options = response.data.options;
                this.profiles = response.data.profiles;
                this.store_fields = response.data.store_fields;
                this.crm_fields = response.data.crm_fields;
                this.handlers = response.data.handlers;
                this.filelog = response.data.filelog;
            }, (response) => {
                this.stopLoadingInfo();
                // Get data
                this.info = response.data.info;
                this.options = response.data.options;
                this.profiles = response.data.profiles;
                this.store_fields = response.data.store_fields;
                this.crm_fields = response.data.crm_fields;
                this.handlers = response.data.handlers;
                this.filelog = response.data.filelog;
                // Display error
                this.errors.push({message: response.data.message});
            });
        },
    },
    mounted() {
        this.updateBlocks();
    },
});