{"version":3,"sources":["webpack:///./src/pages/self-service/ToWhomItMayConcernYearsOfStudyRecord.vue","webpack:///./src/pages/self-service/ToWhomItMayConcernYearsOfStudyRecord.vue?b50a","webpack:///./src/pages/self-service/ToWhomItMayConcernYearsOfStudyRecord.vue?94eb"],"names":["class","for","to","getTitle","submittedTo","isValid","id","type","val","clearValidity","name","mode","msg","submitForm","isLoading","class-list","isOpenModal","title","closeModal","src","previewFile","formIsValid","selfService","selectedSelfService","selectedSelfServiceJson","localStorage","getItem","JSON","parse","url","this","$route","fullPath","fetchSelfService","computed","submitted_to","methods","data","$apollo","query","variables","fetchPolicy","error","console","input","validateForm","CREATE_MUTATION","error_msg","mutate","mutation","service_type","form_id","parseInt","getFormId","then","createSelfService","message","catch","$swal","fire","icon","text","result","log","removeItem","render","__scopeId"],"mappings":"qOACSA,MAAM,+B,GACFA,MAAM,4B,GACFA,MAAM,yC,GACFA,MAAM,gF,GACFA,MAAM,wC,QAEP,gCAA2B,QAArBA,MAAM,QAAO,KAAC,I,QAEpB,gCAA2B,QAArBA,MAAM,QAAO,KAAC,I,GAGnBA,MAAM,a,GAENA,MAAM,qF,QAEP,gCAA8E,SAAvEC,IAAI,eAAeD,MAAM,2BAA0B,gBAAY,I,GACjEA,MAAM,a,SAG4BA,MAAM,4B,GAM5CA,MAAM,4B,+NAzB3B,gCAqCM,MArCN,EAqCM,CApCF,gCA6BM,MA7BN,EA6BM,CA5BF,gCA2BM,MA3BN,EA2BM,CA1BF,gCASM,MATN,EASM,CARF,gCAMM,MANN,EAMM,CALF,yBAAyF,GAA5EE,GAAG,aAAaF,MAAM,gC,8BAA+B,IAAS,C,6BAAT,e,MAClE,EACA,yBAAgG,GAAnFE,GAAG,gBAAgBF,MAAM,gC,8BAA+B,IAAa,C,6BAAb,mB,MACrE,EACA,gCAA2B,yCAAlB,EAAAG,UAAQ,KAErB,gCAA2C,MAA3C,EAA2C,6BAAjB,EAAAA,UAAQ,KAEtC,gCAeU,UAfV,EAeU,CAdN,gCAUM,OAVDH,MAAK,6BAAC,qBAAoB,UAAqB,EAAAI,YAAYC,Y,CAC5D,EACA,gCAOM,MAPN,EAOM,C,4BANF,gCAAoG,SAA7FC,GAAG,eAAeC,KAAK,O,qCAAgB,EAAAH,YAAYI,IAAG,GAAG,OAAI,eAAE,EAAAC,cAAa,iB,4BAArC,EAAAL,YAAYI,OAC1D,yBAIa,iBAJDE,KAAK,OAAOC,KAAK,U,8BACzB,IAEI,CAFM,EAAAP,YAAYC,Q,iEAAtB,gCAEI,IAFJ,EAEI,6BADG,EAAAD,YAAYQ,KAAG,M,YAKlC,gCAEM,MAFN,EAEM,CADF,gCAAsL,OAAhL,QAAK,+CAAO,EAAAC,YAAA,EAAAA,cAAA,GAAU,WAAEb,MAAM,uIAAsI,kBAKjK,EAAAc,W,yBAAzB,yBAAsF,G,MAAlDP,KAAK,OAAOQ,aAAW,U,uCAC3D,yBAIa,iBAJDL,KAAK,OAAOC,KAAK,U,8BACzB,IAEkB,CAFK,EAAAK,a,yBAAvB,yBAEkB,G,MAFkBC,MAAM,2CAA4C,QAAO,EAAAC,Y,8BACzF,IAAqD,CAArD,gCAAqD,UAA5CC,IAAK,EAAAC,YAAapB,MAAM,Y,kGAQlC,GACXU,KAAM,+CACN,OACI,MAAO,CACHN,YAAa,CACTI,IAAK,GACLH,SAAS,EACTO,IAAK,IAETS,aAAa,EACbP,WAAW,EACXE,aAAa,EACbI,YAAa,GACbE,YAAa,GACbC,oBAAqB,OAG7B,UACI,MAAMC,EAA0BC,aAAaC,QAAQ,uBACrD,GAAIF,EAAyB,CACzB,MAAMD,EAAsBI,KAAKC,MAAMJ,GACnCD,EAAoBM,MAAQC,KAAKC,OAAOC,SACxCF,KAAKP,oBAAsBA,EAE3BO,KAAKG,wBAGTH,KAAKG,oBAGbC,SAAU,CACN,WACI,OAAIJ,KAAKP,oBACEO,KAAKP,oBAAoBN,MAEzBa,KAAKR,YAAYL,OAGhC,kBACI,OAAIa,KAAKP,oBACEO,KAAKP,oBAAoBY,aAEzBL,KAAKR,YAAYa,cAGhC,YACI,OAAIL,KAAKP,oBACEO,KAAKP,oBAAoBjB,GAEzBwB,KAAKR,YAAYhB,KAIpC8B,QAAS,CACL,yBACI,IACI,MAAM,KAAEC,SAAeP,KAAKQ,QAAQC,MAAM,CACtCA,MAAO,MAAG;;;;;;;sBAQVC,UAAW,CACPX,IAAK,+DAETY,YAAa,iBAEjBX,KAAKR,YAAce,EAAKf,YAC1B,MAAOoB,GACLC,QAAQD,MAAMA,KAGtB,cAAcE,GACVd,KAAKc,GAAOvC,SAAU,EACtByB,KAAKc,GAAOhC,IAAM,IAEtB,eACIkB,KAAKT,aAAc,EAEU,KAAzBS,KAAK1B,YAAYI,MACjBsB,KAAK1B,YAAYC,SAAU,EAC3ByB,KAAK1B,YAAYQ,IAAM,4BACvBkB,KAAKT,aAAc,IAI3B,mBAGI,GAFAS,KAAKe,gBAEAf,KAAKT,YACN,OAGJ,MAAMyB,EAAkB,MAAG;;;;;;;;;cAW3BhB,KAAKhB,WAAY,EACjB,IAAIiC,EAAY,GAEhB,UACUjB,KAAKQ,QAAQU,OAAO,CACtBC,SAAUH,EACVN,UAAW,CACPU,aAAc,+CACdf,aAAcL,KAAK1B,YAAYI,IAC/B2C,QAASC,SAAStB,KAAKuB,cAE5BC,KAAMjB,IACDA,EAAKA,KAAKkB,kBAAkBb,MAC5BK,EAAYV,EAAKA,KAAKkB,kBAAkBC,QAExC1B,KAAKV,YAAc,mCAAiCiB,EAAKA,KAAKkB,kBAAkB1B,MAErF4B,MAAOf,IACNK,EAAYL,IAGlB,MAAOA,GACLK,EAAYL,EAAMc,SAAW,qCAGjC1B,KAAKhB,WAAY,EAEbiC,EACAjB,KAAK4B,MAAMC,KAAK,CACZC,KAAM,QACN3C,MAAO,UACP4C,KAAMd,IACPO,KAAMQ,IACLnB,QAAQoB,IAAID,KAGhBhC,KAAKd,aAAc,GAK3B,aACIc,KAAKd,aAAc,EACnBc,KAAKV,YAAc,KAG3B,gBACIK,aAAauC,WAAW,uBACxBlC,KAAKP,oBAAsB,O,UCjMnC,EAAO0C,OAASA,EAChB,EAAOC,UAAY,kBAEJ,gB,yDCRf","file":"js/chunk-cbcef0f2.0feedee3.js","sourcesContent":["<template>\n    <div class=\"h-full w-full flex flex-col\">\n        <div class=\"h-full container mx-auto\">\n            <div class=\"px-8 flex flex-col h-full w-full py-8\">\n                <div class=\"w-full bg-white rounded-2xl border shadow-lg px-6 md:px-8 py-4 flex flex-col\">\n                    <div class=\"flex items-center text-sm font-light\">\n                        <router-link to=\"/dashboard\" class=\"opacity-50 hover:opacity-100\">Dashboard</router-link>\n                        <span class=\"mx-2\">/</span>\n                        <router-link to=\"/self-service\" class=\"opacity-50 hover:opacity-100\">Self Services</router-link>\n                        <span class=\"mx-2\">/</span>\n                        <span>{{ getTitle }}</span>\n                    </div>\n                    <div class=\"font-bold\">{{ getTitle }}</div>\n                </div>\n                <section class=\"mt-8 h-full w-full flex flex-col bg-white rounded-2xl border shadow-lg p-6 md:p-8\">\n                    <div class=\"flex justify-start\" :class=\"{ invalid: !submittedTo.isValid }\">\n                        <label for=\"submitted-to\" class=\"flex-shrink-0 mr-4 mt-2\">Submitted To</label>\n                        <div class=\"flex-grow\">\n                            <input id=\"submitted-to\" type=\"text\" v-model=\"submittedTo.val\" @blur=\"clearValidity('submittedTo')\">\n                            <transition name=\"fade\" mode=\"out-in\">\n                                <p v-if=\"!submittedTo.isValid\" class=\"h-4 text-xs text-red-600\">\n                                    {{ submittedTo.msg }}\n                                </p>\n                            </transition>\n                        </div>\n                    </div>\n                    <div class=\"flex justify-center mt-8\">\n                        <div @click.stop=\"submitForm\" class=\"flex items-center bg-ternary hover:bg-white border-ternary border px-4 py-2 rounded-lg cursor-pointer text-white hover:text-ternary\">Submit</div>\n                    </div>\n                </section>\n            </div>\n        </div>\n        <base-page-spinner v-if=\"isLoading\" type=\"spin\" class-list=\"h-20\"></base-page-spinner>\n        <transition name=\"fade\" mode=\"out-in\">\n            <base-full-modal v-if=\"isOpenModal\" title=\"To Whom it may concern(Continuing Study)\" @close=\"closeModal\">\n                <iframe :src=\"previewFile\" class=\"h-screen\"></iframe>\n            </base-full-modal>\n        </transition>\n    </div>\n</template>\n\n<script>\nimport gql from 'graphql-tag';\nexport default {\n    name: \"to-whom-it-may-concern-years-of-study-record\",\n    data() {\n        return {\n            submittedTo: {\n                val: \"\",\n                isValid: true,\n                msg: \"\",\n            },\n            formIsValid: true,\n            isLoading: false,\n            isOpenModal: false,\n            previewFile: \"\",\n            selfService: [],\n            selectedSelfService: null\n        };\n    },\n    created() {\n        const selectedSelfServiceJson = localStorage.getItem(\"selectedSelfService\");\n        if (selectedSelfServiceJson) {\n            const selectedSelfService = JSON.parse(selectedSelfServiceJson);\n            if (selectedSelfService.url === this.$route.fullPath) {\n                this.selectedSelfService = selectedSelfService;\n            } else {\n                this.fetchSelfService();\n            }\n        } else {\n            this.fetchSelfService();\n        }\n    },\n    computed: {\n        getTitle() {\n            if (this.selectedSelfService) {\n                return this.selectedSelfService.title;\n            } else {\n                return this.selfService.title;\n            }\n        },\n        submittedToList() {\n            if (this.selectedSelfService) {\n                return this.selectedSelfService.submitted_to;\n            } else {\n                return this.selfService.submitted_to;\n            }\n        },\n        getFormId() {\n            if (this.selectedSelfService) {\n                return this.selectedSelfService.id;\n            } else {\n                return this.selfService.id;\n            }\n        },\n    },\n    methods: {\n        async fetchSelfService() {\n            try {\n                const { data } = await this.$apollo.query({\n                    query: gql`\n                        query GetSelfServiceDetails($url: String!) {\n                            selfService(url: $url) {\n                                id\n                                title\n                            }\n                        }\n                    `,\n                    variables: {\n                        url: '%self-service/to-whom-it-may-concern-years-of-study-record%',\n                    },\n                    fetchPolicy: 'network-only',\n                });\n                this.selfService = data.selfService;\n            } catch (error) {\n                console.error(error);\n            }\n        },\n        clearValidity(input) {\n            this[input].isValid = true;\n            this[input].msg = \"\";\n        },\n        validateForm() {\n            this.formIsValid = true;\n            \n            if (this.submittedTo.val === \"\") {\n                this.submittedTo.isValid = false;\n                this.submittedTo.msg = \"You must select an option\";\n                this.formIsValid = false;\n            }\n            \n        },\n        async submitForm() {\n            this.validateForm();\n\n            if (!this.formIsValid) {\n                return;\n            }\n\n            const CREATE_MUTATION = gql`\n                mutation SelfServiceToWhomItMayConcernYearsOfStudyRecord($service_type: String!, $submitted_to: String!, $form_id: ID!) {\n                    createSelfService(service_type: $service_type, submitted_to: $submitted_to, form_id: $form_id) {\n                        error\n                        error_code\n                        message\n                        url\n                    }\n                }\n            `;\n\n            this.isLoading = true;\n            let error_msg = '';\n\n            try {\n                await this.$apollo.mutate({\n                    mutation: CREATE_MUTATION,\n                    variables: {\n                        service_type: 'to-whom-it-may-concern-years-of-study-record',\n                        submitted_to: this.submittedTo.val,\n                        form_id: parseInt(this.getFormId),\n                    }\n                }).then((data) => {\n                    if (data.data.createSelfService.error) {\n                        error_msg = data.data.createSelfService.message;\n                    } else {\n                        this.previewFile = process.env.VUE_APP_PUBLIC_URL + data.data.createSelfService.url;\n                    }\n                }).catch((error) => {\n                    error_msg = error;\n                })\n\n            } catch (error) {\n                error_msg = error.message || \"Failed to authenticate, try later.\";\n            }\n\n            this.isLoading = false;\n\n            if (error_msg) {\n                this.$swal.fire({\n                    icon: 'error',\n                    title: 'Oops...',\n                    text: error_msg,\n                }).then((result) => {\n                    console.log(result);\n                })\n            } else {\n                this.isOpenModal = true;\n            }\n\n            \n        },\n        closeModal() {\n            this.isOpenModal = false;\n            this.previewFile = \"\";\n        },\n    },\n    beforeUnmount() {\n        localStorage.removeItem(\"selectedSelfService\");\n        this.selectedSelfService = null;\n    },\n}\n</script>\n\n<style lang=\"scss\" scoped>\ninput[type=\"text\"] {\n  @apply block w-full border rounded-lg py-2 px-2;\n}\ninput[type=\"text\"]:focus {\n  outline: none;\n  border-color: #394867;\n  box-shadow: 0 0 0 1px #394867;\n}\n.fade-enter-active,\n.fade-leave-active {\n  transition: all 0.5s ease;\n}\n.fade-enter-from,\n.fade-leave-to {\n  opacity: 0;\n  height: 0px;\n}\n</style>","import { render } from \"./ToWhomItMayConcernYearsOfStudyRecord.vue?vue&type=template&id=5e3f925c&scoped=true\"\nimport script from \"./ToWhomItMayConcernYearsOfStudyRecord.vue?vue&type=script&lang=js\"\nexport * from \"./ToWhomItMayConcernYearsOfStudyRecord.vue?vue&type=script&lang=js\"\n\nimport \"./ToWhomItMayConcernYearsOfStudyRecord.vue?vue&type=style&index=0&id=5e3f925c&lang=scss&scoped=true\"\nscript.render = render\nscript.__scopeId = \"data-v-5e3f925c\"\n\nexport default script","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../node_modules/vue-loader-v16/dist/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader-v16/dist/index.js??ref--0-1!./ToWhomItMayConcernYearsOfStudyRecord.vue?vue&type=style&index=0&id=5e3f925c&lang=scss&scoped=true\""],"sourceRoot":""}