diff --git a/src/components/pages/PanelAdministrator.vue b/src/components/pages/PanelAdministrator.vue
index 23fe4b7c9a877c1054417e6abe866499bb94ee4a..81099204ad4b7f6df67424a0d821c96357cd3db6 100644
--- a/src/components/pages/PanelAdministrator.vue
+++ b/src/components/pages/PanelAdministrator.vue
@@ -7,7 +7,10 @@
<b-card no-body>
<b-tabs pills vertical card>
<b-tab title="Entri Komentar" disabled/>
- <b-tab title="Pendapatan" active>
+ <b-tab
+ v-for="item in urusan"
+ :key=item.judul
+ v-bind:title="item.judul">
<b-tabs content-class="mt-3">
<b-tab title="Belum dibalas" active>
<comments replyable/>
@@ -17,62 +20,72 @@
</b-tab>
</b-tabs>
</b-tab>
- <b-tab title="Pembiayaan">
- <b-tabs content-class="mt-3">
- <b-tab title="Belum dibalas" active>
- <comments replyable/>
- </b-tab>
- <b-tab title="Semua">
- <comments replyable/>
- </b-tab>
- </b-tabs>
- </b-tab>
- <b-tab title="Biaya Langsung">
- <b-tabs content-class="mt-3">
- <b-tab title="Belum dibalas" active>
- <comments replyable/>
- </b-tab>
- <b-tab title="Semua">
- <comments replyable/>
- </b-tab>
- </b-tabs>
- </b-tab>
- <b-tab title="Biaya Tidak Langsung">
- <comments replyable/>
- </b-tab>
</b-tabs>
</b-card>
</b-tab>
<b-tab title="Pengaturan Admin">
- <b-form-group label="Urutkan berdasarkan">
- <b-form-radio-group id="radio-group-2" v-model="selected" name="radio-sub-component">
- <b-form-radio value="urusan">Urusan</b-form-radio>
- <b-form-radio value="admin">Administrator</b-form-radio>
- </b-form-radio-group>
- </b-form-group>
- <b-table striped hover :items="items" :fields="fields">
+ <b-pagination
+ v-model="currentPage"
+ :total-rows="totalRows"
+ :per-page="perPage"
+ align="center"
+ />
+ <b-form-input
+ v-model="filter"
+ placeholder="Ketik untuk menyaring urusan/admin..."
+ class="mb-3"
+ />
+ <b-table
+ show-empty
+ striped
+ hover
+ stacked="sm"
+ :items="items"
+ :fields="fields"
+ :current-page="currentPage"
+ :per-page="perPage"
+ :filter="filter"
+ @filtered="filterTrigger"
+ >
<template slot="aksi" slot-scope="row">
- <div v-if="row.item.penanggungjawab === 'Kosong'">
- <b-button variant="primary" size="sm" @click="row.toggleDetails" class="mr-2">
+ <div v-if="row.item.admin === '-'">
+ <b-button variant="primary" size="sm" @click="switchToggleDetails(row)" class="mr-2">
Pasangkan Admin
</b-button>
</div>
<div v-else>
- <b-button variant="primary" size="sm" @click="row.toggleDetails" class="mr-2">
+ <b-button variant="primary" size="sm" @click="switchToggleDetails(row)" class="mr-2">
Ganti Admin
</b-button>
- <b-button variant="danger" size="sm" @click=";" class="mr-2">
+ <b-button variant="danger" size="sm" @click="clearAdmin(row)" class="mr-2">
Kosongkan Admin
</b-button>
</div>
</template>
<template slot="row-details" slot-scope="row">
- <b-form-select v-model="row.item" :options="options" size="sm"></b-form-select>
- <b-button variant="primary" size="sm" @click="print(row)" class="float-right mr-2">
- Pilih Admin
- </b-button>
+ <b-card
+ bg-variant="light"
+ >
+ <small><b>Mohon pilih Admin dari daftar di bawah ini:</b></small>
+ <b-form-select v-model="selected" :options="options" size="sm"></b-form-select>
+ <b-button variant="primary" size="sm" @click="assignAdmin(row)" class="float-right mt-2">
+ Pilih Admin
+ </b-button>
+ </b-card>
+ </template>
+ <template slot="empty">
+ <div align="center">Tidak ada data untuk ditampilkan</div>
+ </template>
+ <template slot="emptyfiltered">
+ <div align="center">Data tidak ditemukan</div>
</template>
</b-table>
+ <b-pagination
+ v-model="currentPage"
+ :total-rows="totalRows"
+ :per-page="perPage"
+ align="center"
+ />
</b-tab>
</b-tabs>
</b-card>
@@ -90,29 +103,81 @@ export default {
},
data() {
return {
+ currentRow: null,
+ totalRows: 1,
+ currentPage: 1,
+ perPage: 15,
+ filter: null,
selected: 'urusan',
- fields: ['urusan', 'penanggungjawab', 'aksi'],
+ fields: ['urusan', 'admin', 'aksi'],
+ urusan : [
+ { judul: "Pendapatan", url: "" },
+ { judul: "Pembiayaan", url: "" },
+ { judul: "Biaya Langsung", url: "" },
+ { judul: "Biaya Tidak Langsung", url: "" },
+ ],
items : [
- { urusan: 'Pendapatan', penanggungjawab: 'Rifo Ahmad Genadi'},
- { urusan: 'Pembiayaan', penanggungjawab: 'David Timothy Panjaitan'},
- { urusan: 'Biaya Langsung', penanggungjawab: 'Kosong'},
- { urusan: 'Biaya Tidak Langsung', penanggungjawab: 'Kosong'}
+ { urusan: 'A', admin: 'Rifo Ahmad Genadi'},
+ { urusan: 'B', admin: 'David Timothy Panjaitan'},
+ { urusan: 'C', admin: '-'},
+ { urusan: 'D', admin: '-'},
+ { urusan: 'E', admin: 'Rifo Ahmad Genadi'},
+ { urusan: 'F', admin: 'David Timothy Panjaitan'},
+ { urusan: 'G', admin: '-'},
+ { urusan: 'H', admin: '-'},
+ { urusan: 'I', admin: 'Rifo Ahmad Genadi'},
+ { urusan: 'J', admin: 'David Timothy Panjaitan'},
+ { urusan: 'K', admin: '-'},
+ { urusan: 'L', admin: '-'},
+ { urusan: 'M', admin: 'Rifo Ahmad Genadi'},
+ { urusan: 'N', admin: 'David Timothy Panjaitan'},
+ { urusan: 'O', admin: '-'},
+ { urusan: 'P', admin: '-'},
+ { urusan: 'Q', admin: 'Rifo Ahmad Genadi'},
+ { urusan: 'R', admin: 'David Timothy Panjaitan'},
+ { urusan: 'S', admin: '-'},
+ { urusan: 'T', admin: '-'},
+ { urusan: 'U', admin: 'Rifo Ahmad Genadi'},
+ { urusan: 'V', admin: 'David Timothy Panjaitan'},
+ { urusan: 'W', admin: '-'},
+ { urusan: 'X', admin: '-'},
+ { urusan: 'Y', admin: 'Rifo Ahmad Genadi'},
+ { urusan: 'Z', admin: 'David Timothy Panjaitan'},
],
options: [
- { value: null, text: 'Mohon pilih satu orang untuk dipasangkan dengan status \'Admin\'', disabled: true },
- { value: 'a', text: 'Rifo Ahmad Genadi' },
- { value: 'b', text: 'David Timothy Panjaitan' },
- { value: 'c', text: 'William Rukmansa' },
- { value: 'd', text: 'Ricky Kennedy' }
- ]
+ { value: '0', text: 'Rifo Ahmad Genadi' },
+ { value: '1', text: 'David Timothy Panjaitan' },
+ { value: '2', text: 'William Rukmansa' },
+ { value: '3', text: 'Ricky Kennedy' }
+ ],
}
},
created : function() {
+ this.totalRows = this.items.length
this.$store.commit('changed','Jenis Anggaran')
},
methods: {
- print : function(item) {
- console.log(item)
+ assignAdmin : function(row) {
+ row.item.admin = this.options[this.selected].text
+ this.switchToggleDetails(null)
+ },
+ clearAdmin : function(row) {
+ row.item.admin = "-"
+ this.switchToggleDetails(null)
+ },
+ switchToggleDetails : function(newRow) {
+ if (this.currentRow) {
+ this.currentRow.toggleDetails()
+ }
+ if (newRow) {
+ newRow.toggleDetails()
+ }
+ this.currentRow = newRow
+ this.selected = null
+ },
+ filterTrigger(item) {
+ this.totalRows = item.length
+ this.currentPage = 1
}
}
}