{"version":3,"sources":["webpack:///./src/views/management/StaffDetail.vue","webpack:///./src/types/StaffModel.ts","webpack:///./src/views/management/StaffDetail.vue?efe3","webpack:///./src/views/management/StaffDetail.vue?6d4a","webpack:///./src/views/management/StaffDetail.vue?66d4","webpack:///./src/types/AddressModel.ts"],"names":["class","staffId","staffDetail","id","model","ref","for","placeholder","type","types","label","value","key","name","disabled","staff_id","prop","first_name","last_name","position","acceptPhoneNumber","phone","email","birth_date","format","address","address1","style","address2","city","state","zipcode","start_date","memo","rows","fileList","length","data","border","stripe","moment","scope","row","create_date","width","size","downloadFile","file_name","deleteSavedFile","on-change","addFileData","on-remove","removeFileData","action","limit","on-exceed","handleExceed","auto-upload","trigger","tip","is_active","backToList","submit","deleteStaff","this","components","route","params","formRef","submitButton","uploadFileList","getFiles","Promise","resolve","reject","ApiService","setHeader","get","then","catch","response","Error","errors","getStaffTypes","getStaff","Object","assign","setAttribute","formData","FormData","map","file","append","raw","JSON","stringify","setFormDataHeader","post","fire","text","icon","buttonsStyling","confirmButtonText","customClass","confirmButton","router","push","console","log","finally","removeAttribute","update","CommonService","getPhoneNumber","filter","x","uid","a","document","createElement","event","MouseEvent","download","href","url","dispatchEvent","error","confirm","delete","statusCode","go","render","__scopeId","Address"],"mappings":"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","file":"js/chunk-5158ed55.371c5cb4.js","sourcesContent":["<template>\r\n  <div class=\"card mb-5 mb-xl-10\">\r\n    <div class=\"card-header p-8 pb-0\">\r\n        <h2 v-if=\"staffId===0\">Create Staff</h2>\r\n        <h2 v-else>Staff details</h2>\r\n    </div>\r\n    <div class=\"card-body pt-9 pb-0\" v-if=\"staffDetail.address\">\r\n        <el-form\r\n            id=\"modal_agent_detail_form\"\r\n            class=\"form\"\r\n            :model=\"staffDetail\"\r\n            ref=\"formRef\"\r\n        >\r\n            <div class=\"modal-body py-lg-10 px-lg-10\">\r\n                <div class=\"row mb-6\">\r\n                    <label for=\"staff_type\" class=\"col-lg-3 col-form-label fw-bold fs-6\">\r\n                        <span>Type</span>\r\n                    </label>\r\n                    <div class=\"col-lg-9 fv-row\">\r\n                        <el-select\r\n                            class=\"form-select-solid w-100\"\r\n                            placeholder=\"Select staff type\"\r\n                            v-model=\"staffDetail.type\">\r\n                            <el-option v-for=\"type in types\" \r\n                                :label=\"type\"   \r\n                                :value=\"type\" \r\n                                :key=\"type\">\r\n                                {{type}}\r\n                            </el-option>\r\n                        </el-select>\r\n                    </div>\r\n                </div>\r\n                <div class=\"row mb-6\" v-if=\"staffId!=0\">\r\n                    <label for=\"staff_type\" class=\"col-lg-3 col-form-label fw-bold fs-6\">\r\n                        <span>Staff ID</span>\r\n                    </label>\r\n                    <div class=\"col-lg-9 fv-row\">\r\n                        <input\r\n                            type=\"text\"\r\n                            name=\"fname\"\r\n                            class=\"form-control form-control-lg form-control-solid mb-3 mb-lg-0\"\r\n                            disabled\r\n                            v-model=\"staffDetail.staff_id\"\r\n                        />\r\n                    </div>\r\n                </div>\r\n                <div class=\"row mb-6\">\r\n                    <label for=\"staffname\" class=\"col-lg-3 col-form-label fw-bold fs-6\">\r\n                        <span class=\"required\">Name</span>\r\n                    </label>\r\n                    <div class=\"col-lg-9 fv-row\">\r\n                        <div class=\"row\">\r\n                        <div class=\"col-lg-6 fv-row\">\r\n                            <el-form-item prop=\"first_name\">\r\n                                <input\r\n                                    type=\"text\"\r\n                                    name=\"fname\"\r\n                                    class=\"form-control form-control-lg form-control-solid mb-3 mb-lg-0\"\r\n                                    placeholder=\"First name\"\r\n                                    v-model=\"staffDetail.first_name\"\r\n                                />\r\n                            </el-form-item>\r\n                        </div>\r\n                        <div class=\"col-lg-6 fv-row\">\r\n                            <el-form-item prop=\"last_name\">\r\n                                <input\r\n                                    type=\"text\"\r\n                                    name=\"lname\"\r\n                                    class=\"form-control form-control-lg form-control-solid\"\r\n                                    placeholder=\"Last name\"\r\n                                    v-model=\"staffDetail.last_name\"\r\n                                />\r\n                            </el-form-item>\r\n                        </div>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n                <div class=\"row mb-6\">\r\n                    <label for=\"staffPosition\" class=\"col-lg-3 col-form-label fw-bold fs-6\">\r\n                        <span>Position</span>\r\n                    </label>\r\n                    <div class=\"col-lg-9 fv-row\">\r\n                        <div class=\"row\">\r\n                            <div class=\"col-lg-6 fv-row\">\r\n                                <el-form-item prop=\"position\">\r\n                                    <input\r\n                                        type=\"text\"\r\n                                        name=\"fname\"\r\n                                        class=\"form-control form-control-lg form-control-solid mb-3 mb-lg-0\"\r\n                                        placeholder=\"Position\"\r\n                                        v-model=\"staffDetail.position\"\r\n                                    />\r\n                                </el-form-item>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n                <div class=\"row mb-6\">\r\n                    <label for=\"agent_phone\" class=\"col-lg-3 col-form-label fw-bold fs-6\">\r\n                        <span>Phone</span>\r\n                    </label>\r\n                    <div class=\"col-lg-9 fv-row\">\r\n                        <el-form-item prop=\"phone\">\r\n                            <input \r\n                                type=\"tel\" \r\n                                class=\"form-control form-control-solid\" \r\n                                name=\"phone\" \r\n                                placeholder=\"Phone\"\r\n                                v-model=\"staffDetail.phone\"\r\n                                @input=\"acceptPhoneNumber\" />\r\n                        </el-form-item>\r\n                    </div>\r\n                </div>\r\n                <div class=\"row mb-6\">\r\n                    <label for=\"agent_email\" class=\"col-lg-3 col-form-label fw-bold fs-6\">\r\n                        <span class=\"required\">Email</span>\r\n                    </label>\r\n                    <div class=\"col-lg-9 fv-row\">\r\n                        <el-form-item prop=\"email\">\r\n                            <input \r\n                                type=\"email\" \r\n                                name=\"email\" \r\n                                class=\"form-control form-control-solid\" \r\n                                placeholder=\"Email\" \r\n                                v-model=\"staffDetail.email\"/>\r\n                        </el-form-item>\r\n                    </div>\r\n                </div>\r\n                <div class=\"row mb-6\">\r\n                    <label class=\"col-lg-3 col-form-label fw-bold fs-6\">\r\n                    Date of Birth\r\n                    </label>\r\n                    <div class=\"col-lg-9 fv-row\">\r\n                    <el-form-item prop=\"birth_date\">\r\n                        <el-date-picker\r\n                            v-model=\"staffDetail.birth_date\"\r\n                            type=\"date\"\r\n                            placeholder=\"Date of birth\"\r\n                            format=\"MM/DD/YYYY\"\r\n                        />\r\n                    </el-form-item>\r\n                    </div>\r\n                </div>\r\n                <div class=\"row mb-6\">\r\n                    <label class=\"col-lg-3 col-form-label fw-bold fs-6\">\r\n                        Address\r\n                    </label>\r\n\r\n                    <div class=\"col-lg-9 fv-row\">\r\n                        <div class=\"row\">\r\n                            <div class=\"col-lg-12 fv-row\">\r\n                            <el-form-item prop=\"address1\">\r\n                            <input\r\n                                type=\"text\"\r\n                                name=\"address1\"\r\n                                class=\"form-control form-control-lg form-control-solid\"\r\n                                placeholder=\"Address1\"\r\n                                v-model=\"staffDetail.address.address1\"\r\n                            />\r\n                            </el-form-item>\r\n                            </div>\r\n                            <div class=\"col-lg-12 fv-row\">\r\n                            <el-form-item prop=\"address2\">\r\n                            <input\r\n                                type=\"text\"\r\n                                name=\"address2\"\r\n                                class=\"form-control form-control-lg form-control-solid\"\r\n                                placeholder=\"Address2\"\r\n                                style=\"margin-top:5px;margin-bottom:5px;\"\r\n                                v-model=\"staffDetail.address.address2\"\r\n                            />\r\n                            </el-form-item>\r\n                            </div>\r\n                            <div class=\"col-lg-4 fv-row\">\r\n                            <el-form-item prop=\"city\">\r\n                                <input\r\n                                type=\"text\"\r\n                                name=\"city\"\r\n                                class=\"form-control form-control-lg form-control-solid mb-3 mb-lg-0\"\r\n                                placeholder=\"City\"\r\n                                v-model=\"staffDetail.address.city\"\r\n                                />\r\n                            </el-form-item>\r\n                            </div>\r\n                            <div class=\"col-lg-4 fv-row\">\r\n                            <el-form-item prop=\"state\">\r\n                                <input\r\n                                type=\"text\"\r\n                                name=\"State\"\r\n                                class=\"form-control form-control-lg form-control-solid mb-3 mb-lg-0\"\r\n                                placeholder=\"State\"\r\n                                v-model=\"staffDetail.address.state\"\r\n                                />\r\n                            </el-form-item>\r\n                            </div>\r\n                            <div class=\"col-lg-4 fv-row\">\r\n                            <el-form-item prop=\"zipcode\">\r\n                                <input\r\n                                type=\"text\"\r\n                                name=\"zipcode\"\r\n                                class=\"form-control form-control-lg form-control-solid mb-3 mb-lg-0\"\r\n                                placeholder=\"Zip Code\"\r\n                                v-model=\"staffDetail.address.zipcode\"\r\n                                />\r\n                            </el-form-item>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n                <div class=\"row mb-6\">\r\n                    <label class=\"col-lg-3 col-form-label fw-bold fs-6\">\r\n                    Start Date\r\n                    </label>\r\n\r\n                    <div class=\"col-lg-9 fv-row\">\r\n                    <el-form-item prop=\"start_date\">\r\n                        <el-date-picker\r\n                            v-model=\"staffDetail.start_date\"\r\n                            type=\"date\"\r\n                            placeholder=\"Start Date\"\r\n                        />\r\n                    </el-form-item>\r\n                    </div>\r\n                </div>\r\n                <div class=\"row mb-6\">\r\n                    <label class=\"col-lg-3 col-form-label fw-bold fs-6\">\r\n                        Remark\r\n                    </label>\r\n\r\n                    <div class=\"col-lg-9 fv-row\">\r\n                    <el-form-item prop=\"memo\">\r\n                        <el-input\r\n                            v-model=\"staffDetail.memo\"\r\n                            type=\"textarea\"\r\n                            rows=\"3\"\r\n                            placeholder=\"Remark\"\r\n                            style=\"width:100%\"\r\n                        />\r\n                    </el-form-item>\r\n                    </div>\r\n                </div>\r\n                <div class=\"row mb-6\">\r\n                    <label class=\"col-lg-3 col-form-label fw-bold fs-6\">\r\n                        Files\r\n                    </label>\r\n                    <div class=\"col-lg-9 fv-row\">\r\n                        <el-table class=\"down\" v-if=\"fileList.length > 0\" :data=\"fileList\" border stripe style=\"width: 100%;margin-bottom: 20px;\">\r\n                            <el-table-column prop=\"file_name\" label=\"File name\"></el-table-column>\r\n                            <el-table-column prop=\"create_date\" label=\"Upload time\">\r\n                            <template v-slot=\"scope\">\r\n                                {{moment(scope.row.create_date).format('MM/DD/YYYY')}} \r\n                            </template>\r\n                            </el-table-column>\r\n                            <el-table-column width=\"150px\" label=\"operation\">\r\n                                <template v-slot=\"scope\">\r\n                                    <el-button size=\"small\" type=\"text\">\r\n                                        <a @click=\"downloadFile(scope.row.id,scope.row.file_name)\">download</a>\r\n                                    </el-button>\r\n                                    <el-button size=\"small\" type=\"text\" @click=\"deleteSavedFile(scope.row)\">delete</el-button>\r\n                                </template>\r\n                            </el-table-column>\r\n                        </el-table>\r\n                        <el-upload\r\n                            ref=\"upload\"\r\n                            class=\"upload-demo\"\r\n                            :on-change=\"addFileData\"\r\n                            :on-remove=\"removeFileData\"\r\n                            action=\"#\"\r\n                            :limit=\"3\"\r\n                            :on-exceed=\"handleExceed\"\r\n                            :auto-upload=\"false\"\r\n                        >\r\n                            <template #trigger>\r\n                                <el-button type=\"primary\">select file</el-button>\r\n                            </template>\r\n                            <el-input\r\n                                placeholder=\"Enter file description\"\r\n                                class=\"col-md-8\"\r\n                                style=\"margin-left:10px;margin-right:10px;display:none;\"/>\r\n                            <template #tip>\r\n                                <div class=\"el-upload__tip\" style=\"color: red\">\r\n                                    limit 3 Files, new file will cover the old file\r\n                                </div>\r\n                            </template>\r\n                        </el-upload>\r\n                    </div>\r\n                </div>\r\n                <div class=\"row mb-6\">\r\n                    <label class=\"col-lg-3 col-form-label fw-bold fs-6\">\r\n                        Active\r\n                    </label>\r\n                    <div class=\"col-lg-9 d-flex align-items-center\">\r\n                        <div class=\"form-check form-check-solid form-switch fv-row\">\r\n                            <el-form-item prop=\"isActive\">\r\n                                <input class=\"form-check-input w-45px h-30px\" name=\"isActive\" type=\"checkbox\" id=\"isActive\" v-model=\"staffDetail.is_active\" />\r\n                                <label class=\"form-check-label\" for=\"isActive\"></label>\r\n                            </el-form-item>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </el-form>\r\n        <div class=\"modal-footer flex-center\">\r\n            <a\r\n                @click=\"backToList\"\r\n                class=\"btn btn-lg btn-light-primary fw-bolder\"\r\n            >\r\n                Back to list\r\n            </a>\r\n            <button\r\n              type=\"button\"\r\n              id=\"modal_agent_detail_submit\"\r\n              class=\"btn btn-primary\"\r\n              ref=\"submitButton\"\r\n              @click=\"submit\"\r\n            >\r\n              <span class=\"indicator-label\"> Save </span>\r\n              <span class=\"indicator-progress\">\r\n                Please wait...\r\n                <span\r\n                  class=\"spinner-border spinner-border-sm align-middle ms-2\"\r\n                ></span>\r\n              </span>\r\n            </button>\r\n            <button\r\n              type=\"button\"\r\n              class=\"btn btn-danger\"\r\n              ref=\"sdeleteButton\"\r\n              @click=\"deleteStaff\"\r\n              v-if=\"staffId!=0\"\r\n            >\r\n              <span class=\"indicator-label\"> Delete </span>\r\n            </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n</template>\r\n\r\n<script lang=\"ts\">\r\nimport { defineComponent, ref, reactive, onBeforeMount, onMounted } from \"vue\";\r\nimport Swal from \"sweetalert2/dist/sweetalert2.min.js\";\r\nimport { useRoute } from 'vue-router'\r\nimport ApiService from \"@/core/services/ApiService\";\r\nimport router from \"@/router\";\r\nimport { setCurrentPageBreadcrumbs } from \"@/core/helpers/breadcrumb\";\r\nimport { Address } from \"@/types/AddressModel\";\r\nimport { StaffDetails } from \"@/types/StaffModel\";\r\nimport CommonService from \"@/core/services/CommonService\";\r\nimport { ElMessageBox } from \"element-plus\";\r\nimport moment from \"moment\";\r\n\r\nexport default defineComponent({\r\n    name: \"agent-detail-modal\",\r\n    components: {\r\n    },\r\n    setup() {\r\n        const route = useRoute();\r\n        const staffId = +route.params.id; \r\n        const formRef = ref<null | HTMLFormElement>(null);\r\n        const submitButton = ref<HTMLElement | null>(null);\r\n        const staffDetail = reactive({} as any);\r\n        const types = ref([]);\r\n        const fileList = ref([]);\r\n        const uploadFileList = ref([] as any);\r\n\r\n        const getFiles = () =>{\r\n            if(staffId != 0){\r\n                return new Promise((resolve, reject) => {           \r\n                    ApiService.setHeader(); \r\n                    ApiService.get(\"file/staff/\"+staffId)\r\n                        .then(({ data }) => {\r\n                            fileList.value = data.data;\r\n                            resolve(data.data);\r\n                        })\r\n                        .catch(({ response }) => {\r\n                            reject(new Error ('getStaffTypes => '+response.data.errors));\r\n                        });\r\n                });\r\n            }\r\n        }\r\n        const getStaffTypes = async() =>{\r\n            await new Promise((resolve, reject) => {           \r\n                ApiService.setHeader(); \r\n                ApiService.get(\"staff/types\")\r\n                    .then(({ data }) => {\r\n                        types.value = data.data;\r\n                        resolve(data.data);\r\n                    })\r\n                    .catch(({ response }) => {\r\n                        reject(new Error ('getStaffTypes => '+response.data.errors));\r\n                    });\r\n            });\r\n        }\r\n\r\n        const getStaff = () => {\r\n            if(staffId == 0) {\r\n                Object.assign(staffDetail,new StaffDetails());\r\n            }\r\n            else {\r\n                return new Promise((resolve, reject) => { \r\n                    ApiService.setHeader();           \r\n                    ApiService.get(\"staff/\"+staffId)\r\n                        .then(({ data }) => {\r\n                            if(data.data){\r\n                                if(!data.data.address){\r\n                                    data.data.address = new Address();\r\n                                }\r\n                                Object.assign(staffDetail,data.data);\r\n                            }\r\n\r\n                            resolve(data.data);\r\n                        })\r\n                        .catch(({ response }) => {\r\n                            reject(new Error ('getStaff error => '+response.data.errors));\r\n                        });\r\n                });\r\n            }\r\n        }\r\n\r\n        const submit = () => {\r\n            submitButton.value?.setAttribute(\"data-kt-indicator\", \"on\");\r\n\r\n            var formData = new FormData();\r\n            uploadFileList.value.map(file=>{\r\n                formData.append('files', file.raw, file.name);\r\n            });\r\n            formData.append(\"document\", JSON.stringify(staffDetail));\r\n            ApiService.setHeader();\r\n            ApiService.setFormDataHeader();\r\n\r\n            if(staffId === 0){\r\n                ApiService.post(\"staff\", formData as any)\r\n                    .then(() => {\r\n                        Swal.fire({\r\n                        text: \"Staff information has been successfully saved!\",\r\n                        icon: \"success\",\r\n                        buttonsStyling: false,\r\n                        confirmButtonText: \"Ok, got it!\",\r\n                        customClass: {\r\n                            confirmButton: \"btn fw-bold btn-light-primary\",\r\n                            },\r\n                        }).then(() => {\r\n                            router.push({ name: \"staff\"});\r\n                        });\r\n                    })\r\n                    .catch(({ response }) => {\r\n                        console.log(response);\r\n                        Swal.fire({\r\n                        text: \"Failed to create the new staff\",\r\n                        icon: \"error\",\r\n                        buttonsStyling: false,\r\n                        confirmButtonText: \"Ok, got it!\",\r\n                        customClass: {\r\n                            confirmButton: \"btn btn-primary\",\r\n                        },\r\n                        });\r\n                    })\r\n                    .finally(() =>{\r\n                        submitButton.value?.removeAttribute(\"data-kt-indicator\");\r\n                    });\r\n            }\r\n            else\r\n            {\r\n                ApiService.update(\"staff\", staffId, formData as any)\r\n                    .then(() => {\r\n                        Swal.fire({\r\n                            text: \"Staff is updated successfully\",\r\n                            icon: \"success\",\r\n                            buttonsStyling: false,  \r\n                            confirmButtonText: \"Ok, got it!\",\r\n                            customClass: {\r\n                                confirmButton: \"btn btn-primary\",\r\n                            },\r\n                            })\r\n                            .then(() => {\r\n                                router.push({ name: \"staff\"});\r\n                            });\r\n                    })\r\n                    .catch(({ response }) => {\r\n                        console.log(response);\r\n                        Swal.fire({\r\n                        text: \"Failed to update the staff\",\r\n                        icon: \"error\",\r\n                        buttonsStyling: false,\r\n                        confirmButtonText: \"Ok, got it!\",\r\n                        customClass: {\r\n                            confirmButton: \"btn btn-primary\",\r\n                        },\r\n                        });\r\n                    });\r\n            }\r\n        };\r\n\r\n        const acceptPhoneNumber = () => {\r\n            staffDetail.phone = CommonService.getPhoneNumber(staffDetail.phone);\r\n        }\r\n\r\n        const addFileData = (file) => {\r\n            uploadFileList.value.push(file);\r\n            return false;\r\n        }\r\n\r\n        const removeFileData = (file) =>{\r\n            uploadFileList.value = uploadFileList.value.filter(x=>x.uid != file.uid);\r\n        }\r\n\r\n        const downloadFile = (id,name) => {\r\n            ApiService.setHeader();\r\n            ApiService.get(\"file/url/\"+id)\r\n            .then(({ data }) => {\r\n            var a = document.createElement('a');\r\n            var event = new MouseEvent('click');\r\n            a.download = name;\r\n            a.href = data.url;\r\n            a.dispatchEvent(event);\r\n            })\r\n            .catch((error)=>{\r\n                console.log('downloadFile error => '+error);\r\n            })\r\n        }\r\n\r\n        const deleteSavedFile = (row) =>{\r\n            ElMessageBox.confirm('Are you sure to delete this file?')\r\n                .then(() => {\r\n                ApiService.setHeader();\r\n                ApiService.delete(\"file/\"+row.id)\r\n                .then(({ data }) => {\r\n                    if(data.statusCode != 200){\r\n                    Swal.fire({\r\n                            text: \"Deleting file error\",\r\n                            icon: \"error\",\r\n                            buttonsStyling: false,\r\n                            confirmButtonText: \"Please try again\",\r\n                            customClass: {\r\n                            confirmButton: \"btn btn-primary\",\r\n                            },\r\n                        });\r\n                    }\r\n                    else{\r\n                    Swal.fire({\r\n                            text: \"Deleted successfully\",\r\n                            icon: \"success\",\r\n                            buttonsStyling: false,\r\n                            confirmButtonText: \"Ok, got it!\",\r\n                            customClass: {\r\n                            confirmButton: \"btn btn-primary\",\r\n                            },\r\n                        }).then(() => {\r\n                            getFiles();\r\n                        });\r\n                    }\r\n                })\r\n                .catch((error)=>{\r\n                    console.log('deleteSavedFile error => '+error);\r\n                });\r\n            });\r\n        }\r\n\r\n        const deleteStaff = () =>{\r\n            ElMessageBox.confirm('Are you sure to delete this staff?')\r\n                .then(() => {\r\n                    ApiService.delete(\"staff/\"+staffId)\r\n                        .then(() => {\r\n                            Swal.fire({\r\n                                text: \"Staff is deleted successfully\",\r\n                                icon: \"success\",\r\n                                buttonsStyling: false,  \r\n                                confirmButtonText: \"Ok, got it!\",\r\n                                customClass: {\r\n                                    confirmButton: \"btn btn-primary\",\r\n                                },\r\n                                })\r\n                                .then(() => {\r\n                                    router.push({ name: \"staff\"});\r\n                                });\r\n                        })\r\n                        .catch(({ response }) => {\r\n                            console.log(response);\r\n                            Swal.fire({\r\n                            text: \"Failed to delete the staff\",\r\n                            icon: \"error\",\r\n                            buttonsStyling: false,\r\n                            confirmButtonText: \"Ok, got it!\",\r\n                            customClass: {\r\n                                confirmButton: \"btn btn-primary\",\r\n                            },\r\n                            });\r\n                        })\r\n                        .finally(() =>{\r\n                            submitButton.value?.removeAttribute(\"data-kt-indicator\");\r\n                        });\r\n                });\r\n        }\r\n\r\n        const backToList = () =>{\r\n            router.go(-1);\r\n        }\r\n\r\n        onBeforeMount(() => {\r\n            getStaffTypes();\r\n            getStaff();\r\n            getFiles();\r\n        })\r\n\r\n        onMounted(() => {\r\n            setCurrentPageBreadcrumbs(staffId != 0 ? \"Staff Detail\": \"Create staff\", [\"Management\", \"Faculty/Staff\"]);\r\n        });\r\n\r\n        return {\r\n            submit,\r\n            formRef,\r\n            staffDetail,\r\n            staffId,\r\n            types,\r\n            acceptPhoneNumber,\r\n            addFileData,\r\n            fileList,\r\n            deleteSavedFile,\r\n            downloadFile,\r\n            moment,\r\n            removeFileData,\r\n            deleteStaff,\r\n            backToList\r\n        };\r\n    },\r\n});\r\n</script>\r\n\r\n<style scoped>\r\n*>>> .el-table td, .el-table th {\r\n    padding:5px 0;\r\n}\r\n</style>","import { Address } from \"./AddressModel\";\r\n\r\nexport class StaffDetails {\r\n  constructor (){\r\n    this.address = new Address();\r\n  }\r\n\r\n  id: number;\r\n  first_name: string;\r\n  last_name: string;\r\n  position: string;\r\n  staff_id : string;\r\n  phone: string;\r\n  email: string;\r\n  address : Address;\r\n  birth_date: Date;\r\n  start_date: Date;\r\n  memo : string;\r\n  is_active : boolean;\r\n  user_id : number;\r\n}","\r\nimport { defineComponent, ref, reactive, onBeforeMount, onMounted } from \"vue\";\r\nimport Swal from \"sweetalert2/dist/sweetalert2.min.js\";\r\nimport { useRoute } from 'vue-router'\r\nimport ApiService from \"@/core/services/ApiService\";\r\nimport router from \"@/router\";\r\nimport { setCurrentPageBreadcrumbs } from \"@/core/helpers/breadcrumb\";\r\nimport { Address } from \"@/types/AddressModel\";\r\nimport { StaffDetails } from \"@/types/StaffModel\";\r\nimport CommonService from \"@/core/services/CommonService\";\r\nimport { ElMessageBox } from \"element-plus\";\r\nimport moment from \"moment\";\r\n\r\nexport default defineComponent({\r\n    name: \"agent-detail-modal\",\r\n    components: {\r\n    },\r\n    setup() {\r\n        const route = useRoute();\r\n        const staffId = +route.params.id; \r\n        const formRef = ref<null | HTMLFormElement>(null);\r\n        const submitButton = ref<HTMLElement | null>(null);\r\n        const staffDetail = reactive({} as any);\r\n        const types = ref([]);\r\n        const fileList = ref([]);\r\n        const uploadFileList = ref([] as any);\r\n\r\n        const getFiles = () =>{\r\n            if(staffId != 0){\r\n                return new Promise((resolve, reject) => {           \r\n                    ApiService.setHeader(); \r\n                    ApiService.get(\"file/staff/\"+staffId)\r\n                        .then(({ data }) => {\r\n                            fileList.value = data.data;\r\n                            resolve(data.data);\r\n                        })\r\n                        .catch(({ response }) => {\r\n                            reject(new Error ('getStaffTypes => '+response.data.errors));\r\n                        });\r\n                });\r\n            }\r\n        }\r\n        const getStaffTypes = async() =>{\r\n            await new Promise((resolve, reject) => {           \r\n                ApiService.setHeader(); \r\n                ApiService.get(\"staff/types\")\r\n                    .then(({ data }) => {\r\n                        types.value = data.data;\r\n                        resolve(data.data);\r\n                    })\r\n                    .catch(({ response }) => {\r\n                        reject(new Error ('getStaffTypes => '+response.data.errors));\r\n                    });\r\n            });\r\n        }\r\n\r\n        const getStaff = () => {\r\n            if(staffId == 0) {\r\n                Object.assign(staffDetail,new StaffDetails());\r\n            }\r\n            else {\r\n                return new Promise((resolve, reject) => { \r\n                    ApiService.setHeader();           \r\n                    ApiService.get(\"staff/\"+staffId)\r\n                        .then(({ data }) => {\r\n                            if(data.data){\r\n                                if(!data.data.address){\r\n                                    data.data.address = new Address();\r\n                                }\r\n                                Object.assign(staffDetail,data.data);\r\n                            }\r\n\r\n                            resolve(data.data);\r\n                        })\r\n                        .catch(({ response }) => {\r\n                            reject(new Error ('getStaff error => '+response.data.errors));\r\n                        });\r\n                });\r\n            }\r\n        }\r\n\r\n        const submit = () => {\r\n            submitButton.value?.setAttribute(\"data-kt-indicator\", \"on\");\r\n\r\n            var formData = new FormData();\r\n            uploadFileList.value.map(file=>{\r\n                formData.append('files', file.raw, file.name);\r\n            });\r\n            formData.append(\"document\", JSON.stringify(staffDetail));\r\n            ApiService.setHeader();\r\n            ApiService.setFormDataHeader();\r\n\r\n            if(staffId === 0){\r\n                ApiService.post(\"staff\", formData as any)\r\n                    .then(() => {\r\n                        Swal.fire({\r\n                        text: \"Staff information has been successfully saved!\",\r\n                        icon: \"success\",\r\n                        buttonsStyling: false,\r\n                        confirmButtonText: \"Ok, got it!\",\r\n                        customClass: {\r\n                            confirmButton: \"btn fw-bold btn-light-primary\",\r\n                            },\r\n                        }).then(() => {\r\n                            router.push({ name: \"staff\"});\r\n                        });\r\n                    })\r\n                    .catch(({ response }) => {\r\n                        console.log(response);\r\n                        Swal.fire({\r\n                        text: \"Failed to create the new staff\",\r\n                        icon: \"error\",\r\n                        buttonsStyling: false,\r\n                        confirmButtonText: \"Ok, got it!\",\r\n                        customClass: {\r\n                            confirmButton: \"btn btn-primary\",\r\n                        },\r\n                        });\r\n                    })\r\n                    .finally(() =>{\r\n                        submitButton.value?.removeAttribute(\"data-kt-indicator\");\r\n                    });\r\n            }\r\n            else\r\n            {\r\n                ApiService.update(\"staff\", staffId, formData as any)\r\n                    .then(() => {\r\n                        Swal.fire({\r\n                            text: \"Staff is updated successfully\",\r\n                            icon: \"success\",\r\n                            buttonsStyling: false,  \r\n                            confirmButtonText: \"Ok, got it!\",\r\n                            customClass: {\r\n                                confirmButton: \"btn btn-primary\",\r\n                            },\r\n                            })\r\n                            .then(() => {\r\n                                router.push({ name: \"staff\"});\r\n                            });\r\n                    })\r\n                    .catch(({ response }) => {\r\n                        console.log(response);\r\n                        Swal.fire({\r\n                        text: \"Failed to update the staff\",\r\n                        icon: \"error\",\r\n                        buttonsStyling: false,\r\n                        confirmButtonText: \"Ok, got it!\",\r\n                        customClass: {\r\n                            confirmButton: \"btn btn-primary\",\r\n                        },\r\n                        });\r\n                    });\r\n            }\r\n        };\r\n\r\n        const acceptPhoneNumber = () => {\r\n            staffDetail.phone = CommonService.getPhoneNumber(staffDetail.phone);\r\n        }\r\n\r\n        const addFileData = (file) => {\r\n            uploadFileList.value.push(file);\r\n            return false;\r\n        }\r\n\r\n        const removeFileData = (file) =>{\r\n            uploadFileList.value = uploadFileList.value.filter(x=>x.uid != file.uid);\r\n        }\r\n\r\n        const downloadFile = (id,name) => {\r\n            ApiService.setHeader();\r\n            ApiService.get(\"file/url/\"+id)\r\n            .then(({ data }) => {\r\n            var a = document.createElement('a');\r\n            var event = new MouseEvent('click');\r\n            a.download = name;\r\n            a.href = data.url;\r\n            a.dispatchEvent(event);\r\n            })\r\n            .catch((error)=>{\r\n                console.log('downloadFile error => '+error);\r\n            })\r\n        }\r\n\r\n        const deleteSavedFile = (row) =>{\r\n            ElMessageBox.confirm('Are you sure to delete this file?')\r\n                .then(() => {\r\n                ApiService.setHeader();\r\n                ApiService.delete(\"file/\"+row.id)\r\n                .then(({ data }) => {\r\n                    if(data.statusCode != 200){\r\n                    Swal.fire({\r\n                            text: \"Deleting file error\",\r\n                            icon: \"error\",\r\n                            buttonsStyling: false,\r\n                            confirmButtonText: \"Please try again\",\r\n                            customClass: {\r\n                            confirmButton: \"btn btn-primary\",\r\n                            },\r\n                        });\r\n                    }\r\n                    else{\r\n                    Swal.fire({\r\n                            text: \"Deleted successfully\",\r\n                            icon: \"success\",\r\n                            buttonsStyling: false,\r\n                            confirmButtonText: \"Ok, got it!\",\r\n                            customClass: {\r\n                            confirmButton: \"btn btn-primary\",\r\n                            },\r\n                        }).then(() => {\r\n                            getFiles();\r\n                        });\r\n                    }\r\n                })\r\n                .catch((error)=>{\r\n                    console.log('deleteSavedFile error => '+error);\r\n                });\r\n            });\r\n        }\r\n\r\n        const deleteStaff = () =>{\r\n            ElMessageBox.confirm('Are you sure to delete this staff?')\r\n                .then(() => {\r\n                    ApiService.delete(\"staff/\"+staffId)\r\n                        .then(() => {\r\n                            Swal.fire({\r\n                                text: \"Staff is deleted successfully\",\r\n                                icon: \"success\",\r\n                                buttonsStyling: false,  \r\n                                confirmButtonText: \"Ok, got it!\",\r\n                                customClass: {\r\n                                    confirmButton: \"btn btn-primary\",\r\n                                },\r\n                                })\r\n                                .then(() => {\r\n                                    router.push({ name: \"staff\"});\r\n                                });\r\n                        })\r\n                        .catch(({ response }) => {\r\n                            console.log(response);\r\n                            Swal.fire({\r\n                            text: \"Failed to delete the staff\",\r\n                            icon: \"error\",\r\n                            buttonsStyling: false,\r\n                            confirmButtonText: \"Ok, got it!\",\r\n                            customClass: {\r\n                                confirmButton: \"btn btn-primary\",\r\n                            },\r\n                            });\r\n                        })\r\n                        .finally(() =>{\r\n                            submitButton.value?.removeAttribute(\"data-kt-indicator\");\r\n                        });\r\n                });\r\n        }\r\n\r\n        const backToList = () =>{\r\n            router.go(-1);\r\n        }\r\n\r\n        onBeforeMount(() => {\r\n            getStaffTypes();\r\n            getStaff();\r\n            getFiles();\r\n        })\r\n\r\n        onMounted(() => {\r\n            setCurrentPageBreadcrumbs(staffId != 0 ? \"Staff Detail\": \"Create staff\", [\"Management\", \"Faculty/Staff\"]);\r\n        });\r\n\r\n        return {\r\n            submit,\r\n            formRef,\r\n            staffDetail,\r\n            staffId,\r\n            types,\r\n            acceptPhoneNumber,\r\n            addFileData,\r\n            fileList,\r\n            deleteSavedFile,\r\n            downloadFile,\r\n            moment,\r\n            removeFileData,\r\n            deleteStaff,\r\n            backToList\r\n        };\r\n    },\r\n});\r\n","import { render } from \"./StaffDetail.vue?vue&type=template&id=6cd71a4a&scoped=true\"\nimport script from \"./StaffDetail.vue?vue&type=script&lang=ts\"\nexport * from \"./StaffDetail.vue?vue&type=script&lang=ts\"\n\nimport \"./StaffDetail.vue?vue&type=style&index=0&id=6cd71a4a&scoped=true&lang=css\"\nscript.render = render\nscript.__scopeId = \"data-v-6cd71a4a\"\n\nexport default script","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../node_modules/@vue/cli-service/node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../../node_modules/vue-loader-v16/dist/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader-v16/dist/index.js??ref--0-1!./StaffDetail.vue?vue&type=style&index=0&id=6cd71a4a&scoped=true&lang=css\"","export class Address {\r\n    id : number;\r\n    address1 : string;\r\n    address2 : string;\r\n    city : string;\r\n    state : string;\r\n    zipcode : string;\r\n  }"],"sourceRoot":""}