var App = Vue.createApp({
    data() {
        return {
            templateList: [],
            templateIndex: null
        }
    },
    methods: {
        EditTemplate(templateIndex)
        {
            document.location.href = `/template/${this.templateList[templateIndex].id}`;
        },
        async CreateTemplate()
        {
            await LabelApi.POST('medium', {
                name: "new template",
                width: 10,
                height: 10
            });
            
            await GetTemplateList();
        },
        async DeleteTemplate(templateIndex, finaly = false)
        {
            if (finaly) {
                $('#DeleteTemplateModal').modal('hide');
                await LabelApi.DELETE('template', {
                    templateId: this.templateList[templateIndex].id
                });
                this.templateIndex = null;
                await GetTemplateList();
            } else {
                this.templateIndex = templateIndex;
                $('#DeleteTemplateModal').modal('show');
            }
        }
    }
}).mount('main');

async function GetTemplateList() {
    let templateList = await LabelApi.GET(`templates`);
    App.templateList = templateList;

    console.log(templateList);
}

GetTemplateList();