import VueSelect from '/Components/Common/VueSelect.js?v=3.9'
import InputSearch from '/Components/Common/InputSearch.js?v=3.9'
import InputText from "/Components/Common/InputText.js?v=3.9"
import { getLabelText } from '/Components/Common/utils.js?v=3.9'
import Loading from "/Components/Common/Loading.js?v=3.9"

export default {
    props: {

        readOnly: { type: Boolean, required: true },

    },
    components: {
        VueSelect,
        InputSearch,
        InputText,
        Loading
    },
    data() {
        return {
            isLoading: true,
            searchContainerDivClass: "col-md-3 col-sm-6 col-xs-12",
            headerText: this.getLabelText('strAddVNet'),

            ddlCustomers: {},
            ddlServers: {},
            headerTextType: '',
            selectedCustomerId: '',
            selectedServerId: '',
            selectedCustomerText: '',
            selectedServerText: '',

        }
    },
    methods: {

        getLabelText,
        customerChangeHandler: async function (obj) {
            this.selectedCustomerId = obj.selectedValue;
            this.selectedCustomerText = obj.selectedText;

            await this.fillServers();
        },
        serversChangeHandler: function (obj) {
            this.selectedServerId = obj.selectedValue;
            this.selectedServerText = obj.selectedText;

        },
        fillCustomers: async function () {
            var vm = this;

            await fetch("/PCC/VPS/SDN/AddVNet.aspx/FillCustomers", fetchGet)
                .then(response => response.json()).then((data) => {

                    vm.ddlCustomers = JSON.parse(data.d);

                    //**** Avoid to set default value when in edit mode ****//
                    if (vm.ddlCustomers && vm.ddlCustomers.items.length > 0) {
                        vm.selectedCustomerId = vm.ddlCustomers.items[0].value;
                        vm.selectedCustomerText = vm.ddlCustomers.items[0].text;
                    }
                });
        },
        fillServers: async function () {
            var vm = this;

            await fetch("/PCC/VPS/SDN/AddVNet.aspx/FillServers?CustomerId=" + vm.selectedCustomerId, fetchGet)
                .then(response => response.json()).then((data) => {

                    vm.ddlServers = JSON.parse(data.d);

                    if (vm.ddlServers.items.length > 0) {
                        vm.selectedServerId = vm.ddlServers.items[0].value;
                        vm.selectedServerText = vm.ddlServers.items[0].text;
                    }
                });
        },
        cancelRecord: function () {
            clearAllMsgs();

            window.location.href = '/PCC/VPS/SDN/SDN.aspx?TI=2';
        },
        saveRecord: async function (e) {
            clearAllMsgs();
            //console.log(this.recordDTO);
            //return;
            // Get the value of the disabled attribute
            const disabledValue = e.target.getAttribute('disabled');

            if (disabledValue === 'true' || disabledValue === true)
                return false;

            this.isLoading = true;
            var vm = this;

            if (vm.selectedCustomerId === '-1') {
                displayErrorMsg(Error(this.getLabelText('strRequiredFieldsError')));
                this.isLoading = false;
                return false;
            }
            if (vm.selectedServerId === '-1') {
                displayErrorMsg(Error(this.getLabelText('strRequiredFieldsError')));
                this.isLoading = false;
                return false;
            }

            var vm = this;

            let postRequest = { ...fetchPost };
            let params = {
                'CustomerId': vm.selectedCustomerId,
                'CustomerName': vm.selectedCustomerText,
                'ServerId': vm.selectedServerId,
                'ServerName': vm.selectedServerText,

            };
            postRequest.body = JSON.stringify(params);

            await fetch("/PCC/VPS/SDN/AddVNet.aspx/SaveVNet", postRequest)
                .then(response => response.json()).then((data) => {

                    window.location.href = '/PCC/VPS/SDN/SDN.aspx?M=1&TI=2';
                }).catch(function (e) {
                    displayErrorMsg(e);
                });

            this.isLoading = false;
        },
    },
    created: async function () {

        var vm = this;

        await this.fillCustomers().then(vm.fillServers).catch(function (e) {

            vm.isLoading = false;
            displayErrorMsg(e);
        });

    },
    updated: function () {
        updateSelectInterface();
        //AdminBSBThemeChanges();
    },
    template: '#addvnet-template',
}
