moodle-local_treestudyplan/amd/src/page-view-plan.js

/*eslint no-var: "error" */
/*eslint no-unused-vars: "off" */
/*eslint linebreak-style: "off" */
/*eslint no-trailing-spaces: "off" */
/*eslint-env es6*/
// Put this file in path/to/plugin/amd/src
// You can call it anything you like

import {call} from 'core/ajax';
import notification from 'core/notification';
import Vue from './vue';

import Debugger from './debugger';
import {load_strings} from './string-helper';
import {ProcessStudyplan, fixLineWrappers} from './studyplan-processor';

import TSComponents from './treestudyplan-components';
Vue.use(TSComponents);

import RVComponents from './report-viewer-components';
Vue.use(RVComponents);
import ModalComponents from './modedit-modal';
Vue.use(ModalComponents);

import PortalVue from './portal-vue';
Vue.use(PortalVue);
import BootstrapVue from './bootstrap-vue';
Vue.use(BootstrapVue);


let debug = new Debugger("treestudyplanviewer");
debug.enable();

let strings = load_strings({
    studyplan: {
        studyplan_select_placeholder: 'studyplan_select_placeholder',
    },
});

/**
 * Initialize the Page
 * @param {int} contextid The context we should attempt to work in (1:1 related to the category)
 * @param {int} categoryid The category we shoud attempt to work in (1:1 related to the context)
 */
 export function init(contextid,categoryid) {
    // Make sure the id's are numeric and integer
    if(undefined === contextid || !Number.isInteger(contextid) || contextid < 1 ){ contextid = 1;}
    if(undefined === categoryid || !Number.isInteger(categoryid)){ categoryid = 0;}

    const in_systemcontext = (contextid <= 1);

    window.addEventListener('resize',fixLineWrappers); 
    let app = new Vue({
        el: '#root',
        data: {
            displayedstudyplan: null,
            activestudyplan: null,
            associatedstudents: [],
            selectedstudent: null,
            studentstudyplan: null,
            loadingstudyplan: false,
            studyplans: [],
            text: strings.studyplan,
            toolbox: {
                right: true,
            },
            usedcontexts: [],
        },
        async created() {
            this.$root.$on('redrawLines',()=>{
                // Ugly hack, but currently the only way to properly fix scrollablility in the lines
                fixLineWrappers();
            });
        },
        updated() {
            // Ugly hack, but currently the only way to properly fix scrollablility in the lines
            setTimeout(fixLineWrappers, 50);
        },
        async mounted() {
            fixLineWrappers();
            call([{
                methodname: 'local_treestudyplan_list_studyplans',
                args: {context_id: contextid}
            }])[0].done(function(response){
                const timingval = { present: 0, past: 1, future: 2};
                response.sort((a,b) => {
                    const timinga = TSComponents.studyplanTiming(a);
                    const timingb = TSComponents.studyplanTiming(b);

                    const t = timingval[timinga] - timingval[timingb];
                    if(t == 0){
                        // sort by name if timing is equal
                        return a.name.localeCompare(b.name);
                    }
                    else {
                        return t;
                    }
                });
                app.studyplans = response;
                // load studyplan from hash if applicable
                const hash = location.hash.replace('#','');
                const parts = hash.split("-");
                
                if(!!parts && parts.length > 0){
                    for(let idx in app.studyplans){
                        if(app.studyplans[idx].id == parts[0]){
                            app.selectStudyplan(app.studyplans[idx],parts[1]);
                            break;
                        }
                    }
                }
            }).fail(notification.exception);
            call([{
                methodname: 'local_treestudyplan_list_used_categories',
                args: { operation: 'view'}
            }])[0].done(function(response){
                const contexts = [];
                for(const ix in response){
                    if(response[ix].studyplancount >0){
                        contexts.push(response[ix]);
                    }
                }
                app.usedcontexts = contexts;
            }).fail(notification.exception);   
        },
        computed: {
            dropdown_title(){
                if(this.activestudyplan && this.activestudyplan.name){
                    return this.activestudyplan.name;
                }
                else{
                    return this.text.studyplan_select_placeholder;
                }
            },
            contextid(){
                return contextid;
            }
        },
        methods: {
            switchContext(ctx){
                const params = new URLSearchParams(location.search);
                params.set('categoryid', ctx.id);
                window.location.search = params.toString();
                
            },
            closeStudyplan() {
                app.activestudyplan = null;
                app.associatedstudents = [];
                app.studentstudyplan = [];
                app.displayedstudyplan = null;
            },         
            
            selectStudyplan(studyplan,studentid){
                // fetch studyplan
                app.loadingstudyplan = true;
                app.activestudyplan = null;
                app.associatedstudents = [];
                app.selectedstudent = null;
                app.studentstudyplan = null;
                call([{
                    methodname: 'local_treestudyplan_get_studyplan_map',
                    args: { id: studyplan.id}
                }])[0].done(function(response){
                    app.activestudyplan = ProcessStudyplan(response,true);
                    app.displayedstudyplan = app.activestudyplan;
                    app.loadingstudyplan = false;
                    location.hash = app.activestudyplan.id;
                    call([{
                        methodname: 'local_treestudyplan_all_associated',
                        args: { studyplan_id: studyplan.id}
                    }])[0].done(function(response){
                        app.associatedstudents = response;
                        if(studentid){
                            for(const student of app.associatedstudents){
                                if(student.id == studentid){
                                    app.showStudentView(student);
                                    break;
                                }
                            }
                        }
                    }).fail(notification.exception);                    

                }).fail(function(error){
                    notification.exception(error);
                    app.loadingstudyplan = false;
                });
            },
            showStudentView(student){
                app.selectedstudent = student;
                app.studentstudyplan = null;
                app.loadingstudyplan = true;
                call([{
                    methodname: 'local_treestudyplan_get_user_studyplan',
                    args: { userid: student.id, studyplanid: app.activestudyplan.id}
                }])[0].done(function(response){
                    app.studentstudyplan = ProcessStudyplan(response,false);
                    app.displayedstudyplan = app.studentstudyplan;
                    app.loadingstudyplan = false;
                    location.hash = app.activestudyplan.id + "-" + student.id;
                }).fail(function(error){
                    notification.exception(error);
                    app.loadingstudyplan = false;
                });


            },
            showOverview(){
                app.selectedstudent = null;
                app.studentstudyplan = null;
                app.displayedstudyplan = app.activestudyplan;
            }
            
        },
    });
}