diff --git a/package-lock.json b/package-lock.json
index 48f47d2a68c7625508106ca651eeac7650da8e24..6ab5819ad4921d0e9ded6be35466dfb3c1dd23c9 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -15,7 +15,8 @@
"jquery": "^3.6.0",
"vue": "^3.0.0",
"vue-router": "^4.0.12",
- "vue-select": "^4.0.0-beta.3"
+ "vue-select": "^4.0.0-beta.3",
+ "vue3-click-away": "^1.2.4"
},
"devDependencies": {
"@vue/cli-plugin-babel": "~4.5.0",
@@ -14050,6 +14051,11 @@
"integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==",
"dev": true
},
+ "node_modules/vue3-click-away": {
+ "version": "1.2.4",
+ "resolved": "https://registry.npmjs.org/vue3-click-away/-/vue3-click-away-1.2.4.tgz",
+ "integrity": "sha512-O9Z2KlvIhJT8OxaFy04eiZE9rc1Mk/bp+70dLok68ko3Kr8AW5dU+j8avSk4GDQu94FllSr4m5ul4BpzlKOw1A=="
+ },
"node_modules/watchpack": {
"version": "1.7.5",
"resolved": "https://registry.npmmirror.com/watchpack/-/watchpack-1.7.5.tgz",
@@ -26646,6 +26652,11 @@
"integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==",
"dev": true
},
+ "vue3-click-away": {
+ "version": "1.2.4",
+ "resolved": "https://registry.npmjs.org/vue3-click-away/-/vue3-click-away-1.2.4.tgz",
+ "integrity": "sha512-O9Z2KlvIhJT8OxaFy04eiZE9rc1Mk/bp+70dLok68ko3Kr8AW5dU+j8avSk4GDQu94FllSr4m5ul4BpzlKOw1A=="
+ },
"watchpack": {
"version": "1.7.5",
"resolved": "https://registry.npmmirror.com/watchpack/-/watchpack-1.7.5.tgz",
diff --git a/package.json b/package.json
index 997dd32021d8e81eb96b522b3de7b263fbd17f2d..64277b37aad127db8078cf44410d0302be922e99 100644
--- a/package.json
+++ b/package.json
@@ -15,7 +15,8 @@
"jquery": "^3.6.0",
"vue": "^3.0.0",
"vue-router": "^4.0.12",
- "vue-select": "^4.0.0-beta.3"
+ "vue-select": "^4.0.0-beta.3",
+ "vue3-click-away": "^1.2.4"
},
"devDependencies": {
"@vue/cli-plugin-babel": "~4.5.0",
diff --git a/src/components/dropdown.vue b/src/components/dropdown.vue
new file mode 100644
index 0000000000000000000000000000000000000000..814abf6eacb9711a1149c6f46f01ef50359d456f
--- /dev/null
+++ b/src/components/dropdown.vue
@@ -0,0 +1,114 @@
+<template>
+ <div class="relative">
+ <div id="start-button">
+ <button
+ href="#"
+ class="ms-1"
+ style="border: none; background-color:transparent"
+ @click="toggleVisibility"
+
+ >
+ <slot name="start-button-item"> Start-button-content</slot>
+ </button>
+ </div>
+ <Transition name="fade">
+ <div class="item-container">
+ <ul v-if="isVisible" class="item-parent" :style="topMargin">
+ <li class="item" style="margin-right:var(--right-margin)">
+ <slot name="item-1"></slot>
+ </li>
+ <li class="item" style="margin-right:var(--left-margin)">
+ <slot name="item-2"></slot>
+ </li>
+ </ul>
+ </div>
+
+ </Transition>
+ </div>
+</template>
+
+<script>
+//import { mixin as VueClickAway } from "vue3-click-away";
+
+export default{
+ //mixins: [VueClickAway],
+ props:['type'],
+ data(){
+ return{
+ isVisible: false,
+ top: 0,
+ right: 0,
+ left: 0,
+ // bgColor: 'transparent',
+ }
+ },
+ methods: {
+ toggleVisibility(){
+ this.isVisible = !this.isVisible
+ },
+ hideDropdown(){
+ this.isVisible = false
+ },
+ defineCSS(){
+ if (this.type === "dropdownUser"){
+ this.top = 2.08;
+ this.right = 7.5;
+ // this.bgColor = "white";
+ }
+ else if (this.type === "addUser"){
+ this.top = 10.25;
+ this.right = 3;
+ this.left = -4.5;
+ }
+ }
+ },
+ computed: {
+ topMargin(){
+ this.defineCSS();
+ return{
+ '--top-margin': (this.top) + "rem",
+ '--right-margin': (this.right) + "em",
+ '--left-margin': (this.left) + "em"
+ // '--bg-color': (this.bgColor)
+ }
+ }
+ }
+}
+</script>
+
+
+<style scoped>
+ .fade-enter-active,
+ .fade-leave-active {
+ transition: all 0.1s ease-in-out;
+ }
+
+ .fade-enter-from,
+ .fade-leave-to {
+ opacity: 0;
+ transform: translateX(12px);
+ }
+ .item-parent {
+ position: absolute;
+ display: flex;
+ flex-direction: row-reverse;
+ flex-wrap: nowrap;
+ justify-content: space-between;
+ align-items: baseline;
+ top: var(--top-margin);
+ /* border: 1px;
+ border-color: black; */
+
+ }
+ .item {
+ position: absolute;
+ list-style:none;
+ width: 150px;
+ /* background-color: var(--bg-color); */
+ }
+ /* .item-container {
+ display: flex;
+ border-color: black;
+ border-style: solid;
+ } */
+</style>
\ No newline at end of file
diff --git a/src/components/header.vue b/src/components/header.vue
index b97c460eee5cb115d2150a5fc01b9dc0aefc3b76..4a94102e9a34d2485e8bc57798064b84152068d7 100644
--- a/src/components/header.vue
+++ b/src/components/header.vue
@@ -3,6 +3,8 @@
<div class="container-fluid" >
<div class="row justify-content-between">
<div class="col align-self-center">
+ <button hidden="hidden" id="toggleSidebar" data-bs-target="#sidebar"
+ data-bs-toggle="collapse"> </button>
<button
@click="onclick"
v-if="nav_active"
@@ -28,15 +30,28 @@
<div class="col">
<div
class="d-flex flex-row-reverse justify-content-start align-items-center illustration"
- >
- <button @click="showModal()" class="profile-btn">
- <i
- class="icon ion-ios-person-outline text-red"
- style="font-size: 65px"
+ >
+ <Dropdown type="dropdownUser">
+ <template v-slot:start-button-item>
+ <i @click="onDisplayName"
+ class="icon ion-ios-person-outline text-red"
+ style="font-size: 65px"
></i>
- </button>
- <!-- <Name :name="this.name"/> -->
- <h2 class="text-red" style="text-align: right">Hello, {{name}}</h2>
+ </template>
+ <template v-slot:item-1>
+ <button class="btn-blue" @click="toProfile">
+ <svg fill="white" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path class="heroicon-ui" d="M12 12a5 5 0 1 1 0-10 5 5 0 0 1 0 10zm0-2a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm9 11a1 1 0 0 1-2 0v-2a3 3 0 0 0-3-3H8a3 3 0 0 0-3 3v2a1 1 0 0 1-2 0v-2a5 5 0 0 1 5-5h8a5 5 0 0 1 5 5v2z"></path></svg>
+ <span class="ms-1" style="color: white; weight: lighter">Profil</span>
+ </button>
+ </template>
+ <template v-slot:item-2>
+ <button class="btn-red" @click="toLogout">
+ <svg fill="white" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M0 0h24v24H0z" fill="none"></path><path d="M10.09 15.59L11.5 17l5-5-5-5-1.41 1.41L12.67 11H3v2h9.67l-2.58 2.59zM19 3H5c-1.11 0-2 .9-2 2v4h2V5h14v14H5v-4H3v4c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path></svg>
+ <span class="ms-1" style="color: white; weight: lighter">Keluar</span>
+ </button>
+ </template>
+ </Dropdown>
+ <Name v-if="isNameDisplayed" :value="this.name"></Name>
</div>
</div>
</div>
@@ -44,37 +59,28 @@
<hr style="border: 1px solid red" />
</div>
- <Modal class="profile-modal"
- v-show="isModalVisible"
- @close="closeModal"
- >
- <template v-slot:header>Menu Pilihan</template>
- <template v-slot:body>
- <!-- warna biru, link ke halaman profil -->
- <button class="btn-blue mb-2 ms-2" @click="toProfile">Lihat Profil</button>
- <!-- warna merah -->
- <button class="btn-red ms-4" @click="toLogout">Keluar</button>
- </template>
-
- </Modal>
</template>
<script>
-import Modal from "../components/modal";
+import Dropdown from "../components/dropdown";
+import Name from "../components/name"
import { HTTP } from '../http-common'
export default {
name: "Header",
components: {
- Modal
+ Dropdown,
+ Name
},
data() {
return {
- nav_active: true,
+ nav_active: JSON.parse(localStorage.getItem('navActive')),
isModalVisible: false,
profile_employee:[],
profile_admin:[],
+ isNameDisplayed: true,
name:"",
+ helloName:"",
id: null,
user_id: null,
is_admin: false,
@@ -84,13 +90,11 @@ export default {
onclick() {
this.nav_active = !this.nav_active
document.getElementById("toggleNav").click()
+ localStorage.setItem("navActive", this.nav_active)
+ },
+ onDisplayName(){
+ this.isNameDisplayed = !this.isNameDisplayed;
},
- showModal(){
- this.isModalVisible = true;
- },
- closeModal(){
- this.isModalVisible = false;
- },
toProfile(){
if (this.is_admin){
this.$router.push({ name: "profil-admin", params: { id: this.id }});
@@ -102,11 +106,7 @@ export default {
toLogout(e){
e.preventDefault();
console.log("logout")
- this.$router.push('login')
- // var a = localStorage.getItem("token");
- // console.log(a)
- // var b = localStorage.removeItem("token");
- // console.log(b)
+ this.$router.push({ path: '/login' })
localStorage.removeItem("token");
console.log('token removed')
window.location.reload()
@@ -126,10 +126,14 @@ export default {
this.user_id = this.profile_employee.user_id
}
}})
+ // console.log(this.isNameDisplayed)
},
},
mounted(){
this.getProfile();
+ if (!this.nav_active){
+ document.getElementById("toggleSidebar").click()
+ }
},
};
</script>
@@ -155,24 +159,13 @@ export default {
.logo{
width: 100px;
}
-.profile-btn{
- text-decoration: none;
- border: none;
- background-color: transparent;
-}
-/* butuh buat akses class di dalem class modal */
-.profile-modal{
- width: 20em;
- height: 35em;
- /* transform: translate(150%, -80%); */
-}
.btn-red {
- background: #f4476b;
- border-radius: 15px;
- color: white;
- border: none;
- padding: 4% 15% 4% 15%;
+background: #f4476b;
+border-radius: 15px;
+color: white;
+border: none;
+padding: 2% 13% 2% 10%;
}
.btn-blue {
@@ -180,7 +173,7 @@ export default {
border-radius: 15px;
color: white;
border: none;
- padding: 4% 15% 4% 15%;
+ padding: 2% 13% 2% 10%;
}
</style>
diff --git a/src/components/name.vue b/src/components/name.vue
index 018d6746694830a4c4f7f1fa811bef344154ee05..be2315632ff3171e8927d53718c36d0582835d5a 100644
--- a/src/components/name.vue
+++ b/src/components/name.vue
@@ -1,11 +1,11 @@
<template>
- <h2 class="text-red" style="text-align: right">Hello, {{name}}</h2>
+ <h2 class="text-red" style="text-align: right">Hello, {{value}}</h2>
</template>
<script>
export default {
name: "Name",
- props:{name: String},
+ props:{value: String},
};
</script>
\ No newline at end of file
diff --git a/src/components/sidebar.vue b/src/components/sidebar.vue
index db93e776a59205349f6fd18d48dcc459eb369881..abc506db42a1d2ae8ed5de0c4681bf11f082f655 100644
--- a/src/components/sidebar.vue
+++ b/src/components/sidebar.vue
@@ -90,15 +90,11 @@ export default {
"KPI Bawahan": "ManagerkpiIndex",
Bawahan: "ManagerkaryawanIndex",
},
- isActive: true,
isAdmin: false,
isEmp: false,
};
},
methods: {
- setActive() {
- this.isActive = !this.isActive;
- },
checkAdmin(){
HTTP.get("users/profile").then((res)=>{
this.isAdmin = res.data.data.is_admin
@@ -110,7 +106,7 @@ export default {
},
created(){
this.checkAdmin()
- }
+ },
};
</script>
@@ -136,7 +132,7 @@ export default {
position: fixed;
margin-left: -300px;
background-color: #f1f7fc;
- transition: 0.4s;
+ /* transition: 0.4s; */
}
.nav-link {
@@ -165,13 +161,13 @@ export default {
.active_cont {
margin-left: 250px;
visibility: hidden;
- transition: 0.4s;
+ /* transition: 0.4s; */
}
.btn {
background-color: #6992b4;
color: #f1f7fc;
- transition: 0.4s;
+ /* transition: 0.4s; */
align-content: left;
}
diff --git a/src/components/table-response.vue b/src/components/table-response.vue
index 9d0b8322124fa2c89ebd9f3f250efc7e767bd122..329b6039a82f6399aa552923d45edd55591d68ae 100644
--- a/src/components/table-response.vue
+++ b/src/components/table-response.vue
@@ -34,7 +34,7 @@
</td>
</template>
<td v-if="c.name=='Bukti'" >
- <a :href="e[c.data][0].image">link</a>
+ <a :href="e[c.data][0].image">{{e[c.data][0].name}}</a>
</td>
</template>
diff --git a/src/router/index.js b/src/router/index.js
index 832bff200f952167d6b061554df04aca263c582c..ded9c880ce6dfef1278adb81b6d6d14bf9b07fb9 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -1,4 +1,4 @@
-import { createRouter, createWebHistory } from "vue-router";
+import { createRouter, createWebHashHistory } from "vue-router";
//import Home from "../views/Home.vue";
import ProfilUser from "../views/ProfilUser.vue";
import ProfilAdmin from "../views/ProfilAdmin.vue";
@@ -158,7 +158,8 @@ const routes = [
];
const router = createRouter({
- history: createWebHistory(process.env.BASE_URL),
+ // history: createWebHistory(process.env.BASE_URL),
+ history: createWebHashHistory(),
routes,
});
diff --git a/src/views/AdminEdit.vue b/src/views/AdminEdit.vue
index f580e370318edf1ae952fda9a8f911569af37406..b3bdf87b382c2c79a5676804a5c2fc5bbcbfffe2 100644
--- a/src/views/AdminEdit.vue
+++ b/src/views/AdminEdit.vue
@@ -69,7 +69,7 @@ export default {
username: "",
email: "",
password: "",
- nav_active : true,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
}
},
methods: {
diff --git a/src/views/AdminIndex.vue b/src/views/AdminIndex.vue
index 7362cadd9f5f6e305b66b705fd503f8f1d9d9646..5244b9735ab3677ed49c8ee0449d5591450b5adb 100644
--- a/src/views/AdminIndex.vue
+++ b/src/views/AdminIndex.vue
@@ -100,7 +100,7 @@ export default {
},
filter: "",
- nav_active : true,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
};
},
methods: {
diff --git a/src/views/AdminInsert.vue b/src/views/AdminInsert.vue
index 98c5a1b0d211cb936761cdc8277bcfd8a70c817d..1719eb392e4d2459a6541b9f850fa576b5fc216f 100644
--- a/src/views/AdminInsert.vue
+++ b/src/views/AdminInsert.vue
@@ -69,7 +69,7 @@ export default {
username: "",
email: "",
password: "",
- nav_active : true,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
}
},
methods: {
diff --git a/src/views/ChangePass.vue b/src/views/ChangePass.vue
index 3507d5fd03635fc362128a9c150b8f69ced613e8..f7db0dae52709611ab53e15c998958e5595e2d33 100644
--- a/src/views/ChangePass.vue
+++ b/src/views/ChangePass.vue
@@ -48,7 +48,7 @@ export default {
current_password: "",
new_password:"",
new_password_confirmation:"",
- nav_active : true,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
}
},
methods: {
diff --git a/src/views/DepartemenIndex.vue b/src/views/DepartemenIndex.vue
index 8442c4bc9f497359dc583178c8af2e1b02442c36..7de2dad62d9ff95f83932a7b3c23414bc6f045dc 100644
--- a/src/views/DepartemenIndex.vue
+++ b/src/views/DepartemenIndex.vue
@@ -59,14 +59,9 @@
v-show="isModalVisible"
@close="closeModal"
>
-
- <!-- <div v-if="type === 'addDept'"> -->
-
<template v-slot:header>
<template v-if="type === 'addDept'"> Tambah Departemen </template>
<template v-if="type === 'editDept'"> Edit Departemen </template>
-
-
</template>
<template v-slot:body>
@@ -114,21 +109,8 @@ export default {
isModalVisible: false,
deptnameadd:"",
deptnameedit:"",
+ curr_id:"",
dept: [],
- temp_dept: [
- {
- id: 1,
- nama: "Keuangan",
- },
- {
- id: 2,
- nama: "Marketing",
- },
- {
- id: 3,
- nama: "Operasional",
- },
- ],
columns: {
Id : {
name : "Id",
@@ -150,7 +132,7 @@ export default {
},
},
filter: "",
- nav_active : true,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
};
},
props:{},
@@ -168,20 +150,31 @@ export default {
},
closeModal(){
this.isModalVisible = false;
- //console.log(this.isModalVisible)
},
insert(e){
e.preventDefault();
+
let formValue = this.deptnameadd
- console.log(formValue)
- alert("Dept berhasil ditambahkan")
- document.getElementById("formAddDept").reset();
+
+ let data = {
+ name: formValue
+ }
+ console.log(data.name)
+
+ HTTP.post("departments", data, {
+ headers:{
+ 'Content-Type': 'application/json'
+ }
+ }).then((res)=>{
+ if (res.status == 200){
+ alert("Departemen berhasil ditambahkan")
+ this.closeModal()
+ }
+ }).catch(()=>{
+ alert("Gagal menambahkan Departemen")
+ })
},
- // addDept(data){
- // console.log(data);
- // },
getDept() {
- // di sini ambil data admin dari database
HTTP.get("departments").then((res)=>{
if (res.data.success == true){
this.dept = res.data.data
@@ -191,56 +184,54 @@ export default {
console.log(id);
},
deleteDept(id) {
- console.log(id);
+ if (confirm("Yakin akan menghapus Departemen?")){
+ HTTP.delete(`departments/${id}`).then((res) =>{
+ if (res.status == 200){
+ alert("Berhasil menghapus Departemen")
+ this.getDept()
+ }
+ }).catch( () => {
+ alert("Gagal Menghapus Departemen")
+ }
+ )
+ }
},
edit(e){
e.preventDefault();
-
- //let prevDept = this.temp_dept[parseInt(id)-1]
- //console.log(prevDept.nama)
-
//get data from form
let formValue = this.deptnameedit
- console.log(formValue)
- console.log(typeof formValue) //udah jalan sampe sini
- //console.log(id) //id undefined
- //console.log(this.id) //undefined
-
- //this.temp_dept[parseInt(this.id)-1].nama = formValue
-
- // methods: {
- // // ...
- // fillData(selected){
- // this.datacollection.datasets[0].label = selected;
- // },
-
-
- // let prevDept = this.temp_dept[parseInt(id)-1].nama
- // prevDept = formValue
- // console.log(prevDept)
- alert("Dept berhasil diedit")
+ let data = {
+ name: formValue
+ }
+ HTTP.put(`departments/${this.curr_id}`, data, {
+ headers: {
+ 'Content-Type': 'application/json'
+ }
+ }).then((res)=>{
+ if (res.status == 200){
+ alert("Departemen berhasil diedit")
+ this.closeModal()
+ }
+ }).catch(() => alert("Gagal mengedit Departemen"))
- document.getElementById("formEditDept").reset();
+ ;
},
editDept(id) {
- //console.log(id);
+ console.log(id);
this.showModal("editDept");
//get data
- let dept = this.temp_dept[parseInt(id)-1]
- this.deptnameedit = dept.nama
- //console.log(this.deptnameedit)
-
- //change data
-
-
+ HTTP.get(`departments/${id}`).then((res)=>{
+ if (res.status == 200){
+ this.deptnameedit = res.data.data.name
+ }
+ }
+ )
+ this.curr_id = id;
},
- // updateDept(event){
- // console.log(event);
- // }
},
mounted() {
this.getDept();
diff --git a/src/views/KaryawanDetail.vue b/src/views/KaryawanDetail.vue
index 56d6afd5208e7129399192c0e5f8960e6a5ce69a..064b16a1d2ba9f6e2f75212a88ba6950e6ed7d30 100644
--- a/src/views/KaryawanDetail.vue
+++ b/src/views/KaryawanDetail.vue
@@ -46,7 +46,7 @@
</div>
<div class="mb-3 me-3">
<label for="atasanInput" class="text-blue"> Atasan </label>
- <input v-model="employee.manager" list="atasan" id="atasanInput" class="form-control">
+ <input v-model="employee.manager" list="atasan" id="atasanInput" class="form-control" readonly>
<datalist id="atasan">
<option v-for="a in this.atasan" :key="a.id" :value="a.name"></option>
</datalist>
@@ -61,10 +61,6 @@
<label for="emailInput" class="text-blue"> Email </label>
<input v-model="employee.user.email" type="email" id="emailInput" class="form-control" readonly>
</div>
- <div class="mb-3">
- <label for="passwordInput" class="text-blue"> Kata Sandi </label>
- <input v-model="password" type="password" id="passwordInput" class="form-control">
- </div>
</div>
</div>
</form>
@@ -184,7 +180,7 @@ export default {
},
],
dept_last_page : 1,
- nav_active : true,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
}
},
methods: {
diff --git a/src/views/KaryawanEdit.vue b/src/views/KaryawanEdit.vue
index bd91509f14b82243f8a4236e96167e6717bd19dd..06c91903b9bc6dcf0eb229b0ce06668288adf7ce 100644
--- a/src/views/KaryawanEdit.vue
+++ b/src/views/KaryawanEdit.vue
@@ -188,7 +188,7 @@ export default {
},
],
dept_last_page : 1,
- nav_active : true,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
}
},
methods: {
diff --git a/src/views/KaryawanInsert.vue b/src/views/KaryawanInsert.vue
index fd2213b1c122481a4b8535aa005f0d86c7940730..dbaa8914b34daf787045ac528219d16dcbf98c11 100644
--- a/src/views/KaryawanInsert.vue
+++ b/src/views/KaryawanInsert.vue
@@ -35,6 +35,20 @@
<datalist id="dept">
<option v-for="d in this.dept" :key="d" :value="d.name"></option>
</datalist>
+ <!-- <v-select v-model="dept_in"
+ :options="this.dept"
+ label="name"
+ @closed="()=>(getAtasan())"
+ >
+ <template #search="{attributes, events}">
+ <input
+ class="vs__search"
+ :required="!dept_in"
+ v-bind="attributes"
+ v-on="events"
+ />
+ </template> -->
+ <!-- </v-select> -->
</div>
<div class="mb-3 me-3">
<label for="jabatanInput" class="text-blue"> Jabatan </label>
@@ -83,13 +97,15 @@
import Header from "../components/header"
import Sidebar from "../components/sidebar"
import { HTTP } from "../http-common";
+// import vSelect from 'vue-select'
export default {
name: "KaryawanInsert",
components: {
Header,
- Sidebar
+ Sidebar,
+ // vSelect
},
data() {
return{
@@ -108,17 +124,25 @@ export default {
temp_dept: ["Keuangan", "Marketing", "Operasional"],
temp_atasan: ["Yusuf", "Budi"],
temp_jabatan: ["Manager", "Staf"],
- nav_active : true,
+ dept_last_page: 1,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
}
},
methods: {
getDept(){
- HTTP.get("departments").then((res)=>{
- if (res.data.success == true){
- console.log(res.data.data)
- this.dept = res.data.data
- }})
- },
+ HTTP.get("departments?page=1").then((res)=>{
+ if (res.data.success == true){
+ this.dept= res.data.data.data
+ this.dept_last_page = res.data.data.last_page
+ for (let i=2;i<=this.dept_last_page;i++){
+ HTTP.get(`departments?page=${i}`).then((res)=>{
+ if (res.data.success == true){
+ this.dept = this.dept.concat(res.data.data.data)
+ }})
+ }
+
+ }})
+ },
getJabatan(){
this.jabatan = this.temp_jabatan
},
@@ -137,6 +161,15 @@ export default {
})
}
})
+ // console.log("in")
+ // HTTP.get(`departments/${this.dept_in.id}/employees`).then((res)=>{
+ // if (res.data.success == true){
+ // this.atasan = []
+ // res.data.data.forEach((a) => {
+ // this.atasan.push({name: a.name, id: a.id})
+ // })
+ // }
+ // })
},
insert(e){
e.preventDefault();
diff --git a/src/views/KpiCreate.vue b/src/views/KpiCreate.vue
index 3c0b414f7252747bc6f3e645e878243f0ea7b437..417f110a84180eb080e4373546c07dd6a3ef5b80 100644
--- a/src/views/KpiCreate.vue
+++ b/src/views/KpiCreate.vue
@@ -115,7 +115,7 @@ export default {
period_type: "Daily",
deadline: null,
deadline_time: "",
- nav_active : true,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
}
},
methods: {
diff --git a/src/views/KpiDetail.vue b/src/views/KpiDetail.vue
index 51d5b69720da502cd34d09a20cdf011222af1dd7..e69b38d1a6093160fb8912162fe855a9b870fe86 100644
--- a/src/views/KpiDetail.vue
+++ b/src/views/KpiDetail.vue
@@ -87,7 +87,7 @@
<div class="row p-3">
<h1 class="text-blue">Buat Response</h1>
<hr class="my-2">
- <form @submit="insert" autocomplete="off">
+ <form id="formResponse" @submit="insert" autocomplete="off">
<div class="mb-3 me-3">
<label class="text-blue"> Nilai Aktual </label>
<input v-model="response.actual" type="number" min="0" class="form-control" required>
@@ -136,7 +136,7 @@ export default {
date : "",
images:[]
},
- nav_active : true,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
}
},
methods: {
@@ -160,6 +160,7 @@ export default {
formData.append("images[0]", this.response.images[0]);
HTTP.post("kpi-responses", formData).then(()=>{
alert("Berhasil Membuat Response")
+ document.getElementById("formResponse").reset();
}).catch((e)=>{
console.log(e.response.data)
alert("Gagal Membuat Response")
diff --git a/src/views/KpiIndex.vue b/src/views/KpiIndex.vue
index 71d39c92d60d0e239fe61cf5f8949b674c47445b..40365a0622210f53d2f3bbbd8a019914ebe9644f 100644
--- a/src/views/KpiIndex.vue
+++ b/src/views/KpiIndex.vue
@@ -89,7 +89,7 @@ export default {
page_num : 0,
entry_per_page: 10,
pagination: [],
- nav_active : true,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
}
},
methods: {
diff --git a/src/views/KpiManagerDetail.vue b/src/views/KpiManagerDetail.vue
index 18d2d28c413d05f014f1aadf912f4b057dcb314c..94b889b7b750c57331102aaa10f44b0e93f0981d 100644
--- a/src/views/KpiManagerDetail.vue
+++ b/src/views/KpiManagerDetail.vue
@@ -199,7 +199,7 @@ export default {
name: "Hadi",
},
],
- nav_active : true,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
}
},
methods: {
diff --git a/src/views/Login.vue b/src/views/Login.vue
index f1fbac30b58f2bfac806949d26d737abe483a4b3..7b40a19a4bd8deab139549d4d04a04126c660d4f 100644
--- a/src/views/Login.vue
+++ b/src/views/Login.vue
@@ -109,13 +109,18 @@ export default {
})
.then((response) => {
localStorage.setItem("token", response.data.token)
+ localStorage.setItem("navActive", true)
if (response.data.success) {
window.location.reload()
}
})
.catch(() => alert("username atau password salah"));
},
+
},
+ mounted(){
+ document.getElementById("app").style.padding = "0"
+ }
};
</script>
diff --git a/src/views/ManagerKaryawanDetail.vue b/src/views/ManagerKaryawanDetail.vue
index 6452deafd4772c523f67fc3892e9c7c516d4b588..0c4bf5ea325b94e762d3b2d0714fbf6601e78e9d 100644
--- a/src/views/ManagerKaryawanDetail.vue
+++ b/src/views/ManagerKaryawanDetail.vue
@@ -126,7 +126,7 @@ export default {
endpoint:"",
startReport : "",
endReport:"",
- nav_active : true,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
}
},
created(){
@@ -137,14 +137,34 @@ export default {
openResponses(idKpi){
this.$router.push({ name: "ResponseIndex", params: { kpiId: idKpi, empId:this.slug}});
},
- report(){
+ report(e){
+ e.preventDefault()
//download report
+ HTTP.get(`report/${this.emp.slug}?before=${this.endReport}&after=${this.startReport}`, {responseType: 'arraybuffer',
+ headers: {
+ 'Content-Type': 'application/json',
+ 'Accept': 'application/pdf'
+ }
+ }).then((res)=>{
+ // console.log(res.data.data)
+ const url = window.URL.createObjectURL(new Blob([res.data]))
+ const link = document.createElement('a')
+ link.href = url
+ link.setAttribute('download', `KPI-Report-${this.emp.name}.pdf`)
+ document.body.appendChild(link)
+ link.click()
+ }).catch((e)=>{
+ console.log(e.response.data)
+ alert("Gagal Membuat Report")
+ })
+ // HTTP.get(`report/${this.emp.slug}?before=${this.endReport}`).then((res)=>{
+ // console.log(res.data.data)
+ // }).catch((e)=>{console.log(e.response.data)})
},
getEmp(){
HTTP.get(`employees/${this.slug}`).then((res)=>{
this.emp = res.data.data
this.endpoint = `kpis/assigned/${this.emp.id}`
- console.log(this.emp)
}).catch(()=> {alert("Error loading page")})
}
}
diff --git a/src/views/ManagerKaryawanIndex.vue b/src/views/ManagerKaryawanIndex.vue
index 862f75718fe20d03dfc151d42b3f85de748cd6a8..1382ed6f7b7e71fbed22bd76b6d30d931966983e 100644
--- a/src/views/ManagerKaryawanIndex.vue
+++ b/src/views/ManagerKaryawanIndex.vue
@@ -67,7 +67,7 @@ export default {
clickable : false
},
},
- nav_active : true,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
}
},
methods: {
diff --git a/src/views/ManagerKpiIndex.vue b/src/views/ManagerKpiIndex.vue
index 4c0af268c5a2c5bb143555c2014cb2016aa0a1b9..1a303747d00995d4cab9c709261735ff23b6d8d3 100644
--- a/src/views/ManagerKpiIndex.vue
+++ b/src/views/ManagerKpiIndex.vue
@@ -97,7 +97,7 @@ export default {
data: "custom"},
],
componentKey : 1,
- nav_active : true,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
}
},
methods: {
diff --git a/src/views/ProfilAdmin.vue b/src/views/ProfilAdmin.vue
index a4791f78a9402dc3f3b27f9b07be0679593a6342..beb5a3b9ee8f2dd7dec9f0be44f301e8a19b6ec6 100644
--- a/src/views/ProfilAdmin.vue
+++ b/src/views/ProfilAdmin.vue
@@ -53,7 +53,7 @@ export default {
return{
username:"",
email:"",
- nav_active : true,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
}
},
methods:{
diff --git a/src/views/ProfilUser.vue b/src/views/ProfilUser.vue
index 7cd3c9d2a312c437f24b167cfb7627ab85e74cfe..ffccd29d9d606d8782019d3de81e330a73baf788 100644
--- a/src/views/ProfilUser.vue
+++ b/src/views/ProfilUser.vue
@@ -79,7 +79,7 @@ export default {
atasan_name:null,
username:"",
email:"",
- nav_active : true,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
};
},
diff --git a/src/views/ResponseDetail.vue b/src/views/ResponseDetail.vue
index 301e1c80a07990337c4a2ef4d7687fea394ea9e9..27c2395a00d5ce9eee0f9d15f9ee58edeec5ab40 100644
--- a/src/views/ResponseDetail.vue
+++ b/src/views/ResponseDetail.vue
@@ -48,13 +48,13 @@
</div>
<div class="mb-3 me-3">
<label for="NameInput" class="text-blue"> Bukti: </label>
- <a class="mx-2" :href="response.images[0].image">link</a>
+ <a class="mx-2" :href="response.images[0].image">{{response.images[0].name}}</a>
</div>
<div v-if="response.status == 'pending'" class="col">
<!-- <div class="col"> -->
<button @click="reject" class="btn-reject float-end mx-2">Reject</button>
<button @click="adjust" class="btn-blue float-end mx-2">Adjust</button>
- <button @click="Reject" class="btn-green float-end mx-2">Approve</button>
+ <button @click="approve" class="btn-green float-end mx-2">Approve</button>
</div>
</div>
<hr class="m-2">
@@ -149,9 +149,8 @@ export default {
target: 20
},
emp: {},
- responseAdj:{},
newComment:"",
- nav_active : true,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
}
},
created(){
@@ -189,13 +188,13 @@ export default {
changeStatus(id, status){
let response = {
"kpi_id": this.response.kpi_id,
- "actual" : this.responseId.actual,
- "description" : this.responseId.description,
+ "actual" : this.response.actual,
+ "description" : this.response.description,
"status" : status,
- "date" : this.responseId.date
+ "date" : this.response.date
}
HTTP.put(`kpi-responses/${id}`, response).then(()=>{
- this.refresh = !this.refresh
+ window.location.reload()
}).catch(()=> {alert("Gagal Mengubah Status")})
},
approve(){
@@ -208,8 +207,15 @@ export default {
document.getElementById("modalButton").click()
},
saveAdj(){
- HTTP.put(`kpi-responses/${this.responseId}`, this.responseAdj).then(()=>{
- this.refresh = !this.refresh
+ let response = {
+ "kpi_id": this.response.kpi_id,
+ "actual" : this.response.actual,
+ "description" : this.response.description,
+ "status" : "approved",
+ "date" : this.response.date
+ }
+ HTTP.put(`kpi-responses/${this.responseId}`, response).then(()=>{
+ window.location.reload()
}).catch(()=> {alert("Gagal Mengubah Nilai")})
},
postComment(){
diff --git a/src/views/ResponseEmployee.vue b/src/views/ResponseEmployee.vue
index 3e1b9d6d44bc363b8f5c38277d21db9986e3a8de..ec061ca14af919bdc2eabf49bd659cc4bb96f1ec 100644
--- a/src/views/ResponseEmployee.vue
+++ b/src/views/ResponseEmployee.vue
@@ -125,7 +125,7 @@ export default {
emp: {},
responseAdj:{},
newComment:"",
- nav_active : true,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
}
},
created(){
diff --git a/src/views/ResponseIndex.vue b/src/views/ResponseIndex.vue
index bd631b8e827720c36d04175025c01e55ef7df3c8..4b1bf977acc677df0a47ee58950481dd41567dce 100644
--- a/src/views/ResponseIndex.vue
+++ b/src/views/ResponseIndex.vue
@@ -204,7 +204,7 @@ export default {
showModal : false,
responseAdj : {actual : 0},
responseId : -1,
- nav_active : true,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
}
},
created(){
diff --git a/src/views/UserIndex.vue b/src/views/UserIndex.vue
index 8b7af354ce51ba078fd4c821531a7c0efd3cc5fa..dc493273e6b8000a62419f8727140788880b29ff 100644
--- a/src/views/UserIndex.vue
+++ b/src/views/UserIndex.vue
@@ -159,7 +159,7 @@ export default {
selected_filter: "",
dept_last_page: 1,
jabatan: [],
- nav_active : true,
+ nav_active : JSON.parse(localStorage.getItem('navActive')),
};
},
methods: {