Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <template>
- <div class="dashboard-contents">
- <div class="row">
- <div class="col-xl-6">
- <h2 style="padding:15px; margin-top:10px;">Jurnal</h2>
- </div>
- <div class="col-xl-6" style="padding-top: 15px;">
- <div class="row">
- <div class="col-xl-4">
- <div class="btn-group" style="border-radius: 5px;">
- <button type="button" class="btn" style="width: 100px; height: 45px; background-color: white; color: #4d4f5c; border: 1px solid #0059aa; border-top-left-radius: 5px; border-bottom-left-radius: 5px; padding-left: 5px;">Semua Cabang</button>
- <button type="button" class="btn dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" style="width: 32px; height: 45px; background-color: white; border: 1px solid #0059aa; border-top-right-radius: 5px; border-bottom-right-radius: 5px;">
- <img src="@/assets/images/small-down.png" alt="Alternate Text" />
- </button>
- <div class="dropdown-menu" style="position:absolute; top:83px; padding:15px; border-radius: 5px;">
- <div>
- <p><a href="#" style="color: black;">Semua Cabang</a></p>
- </div>
- <div>
- <p><a href="#" style="color: black;">Cabang A</a></p>
- </div>
- <div>
- <p><a href="#" style="color: black;">Cabang B</a></p>
- </div>
- </div>
- </div>
- </div>
- <div class="col-xl-4">.
- <download-excel class="btn waves-effect waves-circle waves-float pull-right"
- style="width: 132px; height: 45px; background-color: #0059aa; color:white; border-radius: 5px;"
- worksheet = "Daftar Jurnal"
- name = "data_journals.xls"
- :data = "exportData">
- <img src="@/assets/images/file-text.png" alt="Alternate Text" /> Export
- </download-excel>
- </div>
- <div class="col-xl-4">
- <router-link :to="{name: 'JournalManagement.create'}" type="button" class="btn waves-effect waves-circle waves-float pull-right" style="width: 132px; height: 45px; background-color: #20c197; color:white; border-radius: 5px;">
- <img src="@/assets/images/plus-circle.png" alt="Alternate Text" /> Tambah
- </router-link>
- </div>
- </div>
- </div>
- </div>
- <div class="row">
- <select v-model="toggleMenu">
- <option value="kasBesar">Kas besar</option>
- <option value="kaskecil">Kas kecil</option>
- </select>
- </div>
- <div class="row" v-if="toggleMenu == 'kasBesar'">
- <table class="table table-hover table-striped">
- <thead style="text-align:center;">
- <tr>
- <th style="text-align:center; border-right: 1px solid rgba(240, 237, 237, 1)">
- <div style="margin-bottom: 10px;">
- Tanggal <img src="@/assets/images/Down arrow small.png" alt="Alternate Text" />
- </div>
- <div>
- <input type="text" ng-model="query.createdDate" value="" style="margin-bottom: 10px; border: 1px solid rgba(184, 55, 62, 0.5); background-color: #F0eded; border-radius: 5px; padding: 5px;" />
- </div>
- </th>
- <th style="text-align:center; border-right: 1px solid rgba(240, 237, 237, 1)">
- <div style="margin-bottom: 10px;">
- Kode Akun <img src="@/assets/images/Down arrow small.png" alt="Alternate Text" />
- </div>
- <div>
- <input type="text" ng-model="query.createdDate" value="" style="margin-bottom: 10px; border: 1px solid rgba(184, 55, 62, 0.5); background-color: #F0eded; border-radius: 5px; padding: 5px;" />
- </div>
- </th>
- <th style="text-align:center; border-right: 1px solid rgba(240, 237, 237, 1)">
- <div style="margin-bottom: 10px;">
- Deskripsi <img src="@/assets/images/Down arrow small.png" alt="Alternate Text" />
- </div>
- <div>
- <input type="text" ng-model="query.createdDate" value="" style="margin-bottom: 10px; border: 1px solid rgba(184, 55, 62, 0.5); background-color: #F0eded; border-radius: 5px; padding: 5px;" />
- </div>
- </th>
- <th style="text-align:center; border-right: 1px solid rgba(240, 237, 237, 1)">
- <div style="margin-bottom: 10px;">
- Debit <img src="@/assets/images/Down arrow small.png" alt="Alternate Text" />
- </div>
- <div>
- <input type="text" ng-model="query.createdDate" value="" style="margin-bottom: 10px; border: 1px solid rgba(184, 55, 62, 0.5); background-color: #F0eded; border-radius: 5px; padding: 5px;" />
- </div>
- </th>
- <th style="text-align:center; border-right: 1px solid rgba(240, 237, 237, 1)">
- <div style="margin-bottom: 10px;">
- Kredit <img src="@/assets/images/Down arrow small.png" alt="Alternate Text" />
- </div>
- <div>
- <input type="text" ng-model="query.createdDate" value="" style="margin-bottom: 10px; border: 1px solid rgba(184, 55, 62, 0.5); background-color: #F0eded; border-radius: 5px; padding: 5px;" />
- </div>
- </th>
- <th style="text-align:center; border-right: 1px solid rgba(240, 237, 237, 1)">
- <div style="margin-bottom: 10px;">
- Saldo <img src="@/assets/images/Down arrow small.png" alt="Alternate Text" />
- </div>
- <div>
- <input type="text" ng-model="query.createdDate" value="" style="margin-bottom: 10px; border: 1px solid rgba(184, 55, 62, 0.5); background-color: #F0eded; border-radius: 5px; padding: 5px;" />
- </div>
- </th>
- <th style="text-align:center; border-right: 1px solid rgba(240, 237, 237, 1)">
- <div style="margin-bottom: 10px;">
- Posisi Saldo <img src="@/assets/images/Down arrow small.png" alt="Alternate Text" />
- </div>
- <div>
- <input type="text" ng-model="query.createdDate" value="" style="margin-bottom: 10px; border: 1px solid rgba(184, 55, 62, 0.5); background-color: #F0eded; border-radius: 5px; padding: 5px;" />
- </div>
- </th>
- </tr>
- </thead>
- <tbody>
- <tr v-for="item in journals" :key="item.Id">
- <td style="border-right: 1px solid rgba(240, 237, 237, 1); padding-top: 18px;">
- <router-link :to="{name: 'JournalManagement.detail', params: { id: item.Id }}">{{ item.created_at | moment('DD MMMM YYYY') }}</router-link></td>
- <td style="border-right: 1px solid rgba(240, 237, 237, 1); padding-top: 18px;">{{ item.AccountId }}</td>
- <td style="border-right: 1px solid rgba(240, 237, 237, 1); padding-top: 18px;">{{ item.DebitDescription }}</td>
- <td style="border-right: 1px solid rgba(240, 237, 237, 1); padding-top: 18px;">{{ item.Debit }}</td>
- <td style="border-right: 1px solid rgba(240, 237, 237, 1); padding-top: 18px;">{{ item.Credit }}</td>
- <td style="border-right: 1px solid rgba(240, 237, 237, 1); padding-top: 18px;">{{ item.Total }}</td>
- <td style="border-right: 1px solid rgba(240, 237, 237, 1); padding-top: 18px;">{{ item.Total }}</td>
- </tr>
- </tbody>
- </table>
- </div>
- </div>
- </template>
- <script>
- import moment from 'moment'
- import $ from 'jquery'
- import DownloadExcel from 'vue-json-excel'
- import LegalEntities from '@/services/Companies/LegalEntities'
- import Branches from '@/services/Companies/Branches'
- import Journals from '@/services/Accounting/Journal'
- export default {
- name: 'JournalManagement.index',
- components: {
- DownloadExcel
- },
- data () {
- return {
- exportData: [],
- userData: {},
- legalEntity: [],
- branch: [],
- journals: [],
- toggleMenu: 'kasBesar'
- }
- },
- created: function () {
- this.init()
- },
- mounted: function () {
- window.$ = $
- if(localStorage.userData !== undefined) {
- this.userData = JSON.parse(localStorage.userData)
- } else {
- this.$router.push({ name: 'home' })
- location.reload()
- }
- },
- methods: {
- init: async function () {
- let result = await Journals.index()
- let legalEntity = await LegalEntities.index()
- let branch = await Branches.index()
- this.journals = result.data
- this.legalEntity = this.itemLookup(legalEntity.data)
- this.branch = this.itemLookup(branch.data)
- },
- itemLookup: function (json) {
- let data = []
- for(var i = 0; i< json.length; i++) {
- data[json[i].Id] = json[i]
- }
- return data
- },
- formatDate(time) {
- var formattedTime = moment(time).format('DD MMMM YYYY HH:mm')
- if(formattedTime == 'Invalid date') {
- formattedTime = '-'
- }
- return formattedTime
- },
- del: async function (id) {
- let result = await Journals.delete(id)
- if(result.status == 200) {
- alert(result.data.message)
- this.$router.push({ name: 'JournalManagement.index' })
- location.reload()
- } else {
- alert("Delete Gagal")
- location.reload()
- }
- }
- }
- }
- </script>
- <style>
- .table-div {
- margin-left: 15px;
- overflow-x: auto;
- overflow-y: auto;
- }
- </style>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement