From 6fc8eafce7b1c0e92f4c59e1d7b60ea8f1fdf8f5 Mon Sep 17 00:00:00 2001
From: Saladin21 <13519187@std.stei.itb.ac.id>
Date: Sat, 2 Apr 2022 23:06:24 +0700
Subject: [PATCH] manager kpi index finished, edit table-2
---
src/components/table-2.vue | 3 +-
src/router/index.js | 6 ++
src/views/ManagerKpiIndex.vue | 137 ++++++++++++++++++++++++++++++++++
3 files changed, 144 insertions(+), 2 deletions(-)
create mode 100644 src/views/ManagerKpiIndex.vue
diff --git a/src/components/table-2.vue b/src/components/table-2.vue
index 11a2c6b..7f2524d 100644
--- a/src/components/table-2.vue
+++ b/src/components/table-2.vue
@@ -102,7 +102,6 @@ export default {
},
watch: {
filter() {
- console.log(this.filter)
this.page = 1
this.getData()
}
@@ -113,7 +112,7 @@ export default {
if (!this.sorted.asc){
sortCol = `-${sortCol}`
}
- HTTP.get(`${this.endpoint}?page=${this.page}?sort=${sortCol}?filter[${this.filter_column}]=${this.filter}`).then((res)=>{
+ HTTP.get(`${this.endpoint}?page=${this.page}&sort=${sortCol}&filter[${this.filter_column}]=${this.filter}`).then((res)=>{
if (res.status == 200){
console.log(res.data)
this.entries = res.data.data.data
diff --git a/src/router/index.js b/src/router/index.js
index aac63d1..862b265 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -12,6 +12,7 @@ import AdminInsert from "../views/AdminInsert.vue";
import AdminEdit from "../views/AdminEdit.vue";
import KpiIndex from "../views/KpiIndex.vue";
import Test from "../views/Test.vue";
+import ManagerKpiIndex from "../views/ManagerKpiIndex.vue";
const routes = [
{
@@ -74,6 +75,11 @@ const routes = [
name: "kpiIndex",
component: KpiIndex,
},
+ {
+ path: "/manager/kpi",
+ name: "ManagerkpiIndex",
+ component: ManagerKpiIndex,
+ },
{
path: "/test",
name: "test",
diff --git a/src/views/ManagerKpiIndex.vue b/src/views/ManagerKpiIndex.vue
new file mode 100644
index 0000000..327e09d
--- /dev/null
+++ b/src/views/ManagerKpiIndex.vue
@@ -0,0 +1,137 @@
+<template>
+ <div class="container-fluid">
+ <div class="row flex-nowrap">
+ <Sidebar current_page = "About"></Sidebar>
+ <div class="col ps-md-2 pt-2">
+ <Header></Header>
+ <div class="row p-2">
+ <div class="col">
+ <h1 class="text-blue">Daftar KPI</h1>
+ </div>
+ <div class="col">
+ <!-- Ganti Path -->
+ <router-link :to="{ path: '/user/insert' }" style="text-decoration: none">
+ <button class="btn float-end">Buat KPI</button>
+ </router-link>
+ </div>
+ </div>
+ <div class="row p-2">
+ <div class="col-6 p-2">
+ <select
+ v-model="filter"
+ class="form-select"
+ aria-label="Default select example"
+ >
+ <option selected value="">Semua</option>
+ <option v-for="p in periods" :key="p" :value="p.data">{{p.name}}</option>
+ </select>
+ </div>
+ </div>
+ <Table2
+ :endpoint="'kpis'"
+ :columns="columns"
+ :filter="filter"
+ :filter_column="'period_type'"
+ @edit-entry="editKpi"
+ @delete-entry="deleteKpi"
+ @detail-entry="detailKpi"
+ ></Table2>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script>
+
+import Table2 from "../components/table-2";
+import Header from "../components/header";
+import Sidebar from "../components/sidebar";
+import { HTTP } from "../http-common";
+
+
+export default {
+ name: "ManagerKpiIndex",
+ components: {
+ Header,
+ Sidebar,
+ Table2
+ },
+ data(){
+ return{
+ filter: "",
+ columns: {
+ Id: {
+ name : "Id",
+ data : "id",
+ hidden : true,
+ clickable : false
+ },
+ Nama: {
+ name : "Nama",
+ data : "name",
+ hidden : false,
+ clickable : true
+ },
+ Periode: {
+ name : "Periode",
+ data : "period_type",
+ hidden : false,
+ clickable : false
+ },
+ },
+ periods: [
+ {name: "Harian",
+ data: "daily"},
+ {name: "Mingguan",
+ data: "weekly"},
+ {name: "Bulanan",
+ data: "monthly"},
+ {name: "Tahunan",
+ data: "yearly"},
+ {name: "Custom",
+ data: "custom"},
+ ]
+ }
+ },
+ methods: {
+ deleteKpi(id){
+ if (confirm("Yakin akan menghapus KPI?")){
+ HTTP.delete(`kpis/${id}`).catch(()=>{
+ alert("Gagal Menghapus KPI")
+ })
+ }
+ },
+ editKpi(id){
+ //routing page edit
+ console.log(id)
+ },
+ detailKpi(id){
+ //routing page detail
+ console.log(id)
+ }
+ }
+
+}
+</script>
+
+<style scoped>
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+}
+
+body {
+ min-height: 100vh;
+ background-color: #fff;
+}
+
+.btn {
+ background-color: #6992b4;
+ color: #f1f7fc;
+ border-radius: 15px;
+ padding: 7px;
+}
+
+
+</style>
\ No newline at end of file
--
GitLab