diff --git a/app/Exports/SiswaExport.php b/app/Exports/SiswaExport.php
index 7963e1f..ccef167 100644
--- a/app/Exports/SiswaExport.php
+++ b/app/Exports/SiswaExport.php
@@ -3,7 +3,6 @@
 namespace App\Exports;
 
 use App\Models\Siswa;
-use Maatwebsite\Excel\Concerns\FromCollection;
 use Illuminate\Contracts\View\View;
 use Maatwebsite\Excel\Concerns\FromView;
 
diff --git a/app/Exports/TabunganExport.php b/app/Exports/TabunganExport.php
new file mode 100644
index 0000000..70afc84
--- /dev/null
+++ b/app/Exports/TabunganExport.php
@@ -0,0 +1,25 @@
+<?php
+
+namespace App\Exports;
+
+use App\Models\Tabungan;
+use Illuminate\Contracts\View\View;
+use Maatwebsite\Excel\Concerns\FromView;
+
+class TabunganExport implements FromView
+{
+    /**
+    * @return \Illuminate\Support\Collection
+    */
+    public function collection()
+    {
+        return Tabungan::all();
+    }
+
+    public function view(): View
+    {
+        return view('tabungan.export', [
+            'tabungan' => $this->collection()
+        ]);
+    }
+}
diff --git a/app/Http/Controllers/SiswaController.php b/app/Http/Controllers/SiswaController.php
index 80df48f..9e798b1 100644
--- a/app/Http/Controllers/SiswaController.php
+++ b/app/Http/Controllers/SiswaController.php
@@ -9,6 +9,7 @@ use Illuminate\Support\Facades\Input;
 use Maatwebsite\Excel\Facades\Excel;
 use App\Exports\SiswaExport;
 use App\Imports\SiswaImport;
+use App\Models\Tabungan;
 
 class SiswaController extends Controller
 {
@@ -204,4 +205,24 @@ class SiswaController extends Controller
     {
         return Excel::download(new SiswaExport, 'siswa-'.now().'.xlsx');
     }
+
+    //api saldo
+    public function getSaldo(Siswa $siswa)
+    {
+        if($siswa == null){
+            return response()->json(['msg' => 'siswa tidak ditemukan'], 404);
+        }
+        if($siswa->tabungan->count() == 0){
+            return response()->json(['saldo' => '0', 'sal' => '0']);
+        }
+
+        $input = Tabungan::where('tipe','in')->where('siswa_id',$siswa->id)->sum('jumlah');
+        $output = Tabungan::where('tipe','out')->where('siswa_id',$siswa->id)->sum('jumlah');
+        $verify = Tabungan::where('siswa_id', $siswa->id)->orderBy('created_at','desc')->first()->saldo;
+        if(($input - $output) == $verify){
+            return response()->json(['saldo' => $input - $output, 'sal' => format_idr($input - $output)]);
+        }else{
+            return response()->json(['saldo' => '0', 'sal' => 'invalid '.format_idr($input - $output)]);
+        }
+    }
 }
diff --git a/app/Http/Controllers/TabunganController.php b/app/Http/Controllers/TabunganController.php
new file mode 100644
index 0000000..e80ae57
--- /dev/null
+++ b/app/Http/Controllers/TabunganController.php
@@ -0,0 +1,89 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use Illuminate\Http\Request;
+use App\Models\Tabungan;
+use App\Models\Siswa;
+use App\Models\Keuangan;
+use Illuminate\Support\Facades\DB;
+use App\Exports\TabunganExport;
+use Maatwebsite\Excel\Facades\Excel;
+
+class TabunganController extends Controller
+{
+    public function index()
+    {
+        $siswa = Siswa::orderBy('created_at','desc')->get();
+        $tabungan = Tabungan::orderBy('created_at','desc')->paginate(10);
+        return view('tabungan.index', [
+            'siswa' => $siswa,
+            'tabungan' => $tabungan,
+        ]);
+    }
+
+    //api manabung
+    public function menabung(Request $request, Siswa $siswa)
+    {
+        DB::beginTransaction();
+        $tabungan = Tabungan::where('siswa_id', $siswa->id)->orderBy('created_at','desc')->first();
+        if($tabungan != null){
+            $menabung = Tabungan::make($request->input());
+            if($request->tipe == 'in'){
+                $menabung->saldo = $request->jumlah + $tabungan->saldo;
+            }else if($request->tipe == 'out'){
+                $menabung->saldo = $tabungan->saldo - $request->jumlah;
+            }
+            if($menabung->saldo >=0 ){
+                $menabung->save();
+                $pesan = 'Berhasil melakukan transaksi';
+            }else{
+                $pesan = 'Transaksi gagal';
+            }
+        }else{
+            $menabung = Tabungan::make($request->input());
+            $menabung->saldo = $request->jumlah;
+            $menabung->save();
+            $pesan = 'Berhasil melakukan transaksi';
+        }
+
+        //tambahkan tabungan ke transaksi
+        $keuangan = Keuangan::orderBy('created_at','desc')->first();
+        if($keuangan != null){
+            if($menabung->tipe == 'in'){
+                $jumlah = $keuangan->total_kas + $menabung->jumlah;
+            }else if($request->tipe == 'out'){
+                $jumlah = $keuangan->total_kas - $menabung->jumlah;
+            }
+        }else{
+            $jumlah = $menabung->jumlah;
+        }
+        $keuangan = Keuangan::create([
+            'tabungan_id' => $menabung->id,
+            'tipe' => $menabung->tipe,
+            'jumlah' => $menabung->jumlah,
+            'total_kas' => $jumlah,
+            'keterangan' => 'Transaksi tabungan oleh '. $menabung->siswa->nama."(".$menabung->siswa->kelas->nama.")".
+                                    ( ($request->tipe == 'in') ? ' menabung' : ' melakukan penarikan tabungan').' sebesar '. $menabung->jumlah
+                                    .' pada '.$menabung->created_at.' dengan total tabungan '.$menabung->saldo.
+                                    ( (isset($menabung->keperluan)) ?  ' dengan catatan: '.$menabung->keperluan : ''),
+        ]);
+
+        if($keuangan){
+            DB::commit();
+            return response()->json(['msg' => $pesan]);
+        }else{
+            DB::rollBack();
+            return redirect()->route('tabungan.index')->with([
+                'type' => 'danger',
+                'msg' => 'terjadi kesalahan'
+            ]);
+        }
+        
+    }
+
+    public function export()
+    {
+        return Excel::download(new TabunganExport, 'mutasi_tabungan-'.now().'.xlsx');
+    }
+}
diff --git a/app/Models/Tabungan.php b/app/Models/Tabungan.php
index 6e731c5..5d20585 100644
--- a/app/Models/Tabungan.php
+++ b/app/Models/Tabungan.php
@@ -20,7 +20,7 @@ class Tabungan extends Model
     ];
 
     public function siswa(){
-        return $this->belongsTo('App\Models\Siswa','id','siswa_id');
+        return $this->belongsTo('App\Models\Siswa','siswa_id','id');
     }
 
     public function keuangan(){
diff --git a/resources/views/shared/navbar.blade.php b/resources/views/shared/navbar.blade.php
index 2489c30..eecafa3 100644
--- a/resources/views/shared/navbar.blade.php
+++ b/resources/views/shared/navbar.blade.php
@@ -14,8 +14,8 @@
                         </a>
                     </li>
                     <li class="nav-item">
-                        <a href="#!" class="nav-link">
-                            <i class="fe fe-repeat"></i> Transaksi Tabungan
+                            <a href="{{ route('tabungan.index') }}" class="nav-link {{ set_active(['tabungan.*'], 'active') }}">
+                            <i class="fe fe-repeat"></i> Tabungan
                         </a>
                     </li>
                     <li class="nav-item">
diff --git a/resources/views/tabungan/export.blade.php b/resources/views/tabungan/export.blade.php
new file mode 100644
index 0000000..eeccf47
--- /dev/null
+++ b/resources/views/tabungan/export.blade.php
@@ -0,0 +1,22 @@
+<table>
+    <thead>
+    <tr>
+        <th><b>Tanggal</b></th>
+        <th><b>Siswa</b></th>
+        <th><b>KD</b></th>
+        <th><b>Jumlah</b></th>
+        <th><b>Keterangan</b></th>
+    </tr>
+    </thead>
+    <tbody>
+    @foreach($tabungan as $item)
+        <tr>
+            <td>{{ $item->created_at->format('d-m-Y') }}</td>
+            <td>{{ $item->siswa->nama."(".$item->siswa->kelas->nama.")" }}</td>
+            <td>{{ ($item->tipe == 'in') ? 'Menabung' : 'Penarikan Uang' }}</td>
+            <td>{{ $item->jumlah }}</td>
+            <td>{{ $item->keperluan }}</td>
+        </tr>
+    @endforeach
+    </tbody>
+</table>
\ No newline at end of file
diff --git a/resources/views/tabungan/index.blade.php b/resources/views/tabungan/index.blade.php
new file mode 100644
index 0000000..bf4de18
--- /dev/null
+++ b/resources/views/tabungan/index.blade.php
@@ -0,0 +1,263 @@
+@extends('layouts.app')
+
+@section('page-name','Tabungan')
+
+@section('content')
+    <div class="page-header">
+        <h1 class="page-title">
+            @yield('page-name')
+        </h1>
+    </div>
+    <div class="row">
+        <div class="col-12">
+            <div class="card">
+                <div class="card-header">
+                    <h3 class="card-title">Transaksi</h3>
+                </div>
+                @if(session()->has('msg'))
+                <div class="card-alert alert alert-{{ session()->get('type') }}" id="message" style="border-radius: 0px !important">
+                    @if(session()->get('type') == 'success')
+                        <i class="fe fe-check mr-2" aria-hidden="true"></i>
+                    @else
+                        <i class="fe fe-alert-triangle mr-2" aria-hidden="true"></i> 
+                    @endif
+                        {{ session()->get('msg') }}
+                </div>
+                @endif
+                <div class="card-body">
+                    {{-- <form action="{{ route('tabungan.store') }}" method="post"> --}}
+                        @if($errors->any())
+                            <div class="alert alert-danger">
+                                @foreach($errors->all() as $error)
+                                    {{ $error }}<br>
+                                @endforeach
+                            </div>
+                        @endif
+                        <div class="row">
+                            <div class="col-12">
+                                @csrf
+                                <div class="form-group">
+                                    <label class="form-label">Keperluan</label>
+                                    <div class="selectgroup w-100">
+                                        <label class="selectgroup-item">
+                                        <input type="radio" name="keperluan" value="in" class="selectgroup-input">
+                                        <span class="selectgroup-button">Menabung</span>
+                                        </label>
+                                        <label class="selectgroup-item">
+                                        <input type="radio" name="keperluan" value="out" class="selectgroup-input">
+                                        <span class="selectgroup-button">Penarikan</span>
+                                        </label>
+                                    </div>
+                                </div>
+                                <div class="form-group" style="display:none" id="form-siswa">
+                                    <label class="form-label">Siswa</label>
+                                    <select id="siswa" class="form-control" name="siswa_id">
+                                        <option value="#">[-- Pilih Siswa --]</option>
+                                        @foreach($siswa as $item)
+                                            <option value="{{ $item->id }}"> {{ $item->nama.' - '.$item->kelas->nama.' - ' }} </option>
+                                        @endforeach
+                                    </select><br>
+                                    Saldo: IDR. <span id="saldo">0</span>
+                                </div>
+                                <div class="form-group" style="display:none" id="form-jumlah">
+                                    <label class="form-label">Jumlah</label>
+                                    <input type="number" name="jumlah" id="jumlah" class="form-control" min='100'>
+                                </div>
+                                <div class="form-group" style="display:none" id="form-keterangan">
+                                    <label class="form-label">Keterangan</label>
+                                    <textarea name="keperluan" id="keterangan" rows="3" class="form-control"></textarea>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="d-flex" style="display:none !important" id="form-submit">
+                            <button id="submit" class="btn btn-primary ml-auto">Simpan</button>
+                        </div>
+                    {{-- </form> --}}
+                </div>
+            </div>
+        </div>
+        <div class="col-12">
+            <div class="card">
+                <div class="card-header">
+                    <h3 class="card-title">Mutasi tabungan</h3>
+                    <div class="card-options">
+                        <a href="{{ route('tabungan.export') }}" class="btn btn-primary btn-sm ml-2" download="true">Export</a>
+                    </div>
+                </div>
+                <div class="table-responsive">
+                    <table class="table card-table table-hover table-vcenter text-wrap">
+                        <thead>
+                        <tr>
+                            <th class="w-1">No.</th>
+                            <th>Tanggal</th>
+                            <th>Nama</th>
+                            <th>KD</th>
+                            <th>Keterangan</th>
+                            <th>Jumlah</th>
+                            <th></th> 
+                        </tr>
+                        </thead>
+                        <tbody>
+                        @foreach ($tabungan as $index => $item)
+                            <tr>
+                                <td><span class="text-muted">{{ $index+1 }}</span></td>
+                                <td>{{ $item->created_at->format('d-m-Y') }}</td>
+                                <td>
+                                    {{ $item->siswa->nama }} -
+                                    {{ $item->siswa->kelas->nama }} -
+                                    {{ isset($item->siswa->kelas->periode) ? $item->siswa->kelas->periode->nama : '' }}
+                                </td>
+                                <td>
+                                    @if($item->tipe == 'in')
+                                        Menabung
+                                    @elseif($item->tipe == 'out')
+                                        Penarikan
+                                    @endif
+                                </td>
+                                <td style="max-width:150px;">{{ $item->keperluan }}</td>
+                                <td>IDR. {{ format_idr($item->jumlah) }}</td>
+                                <td class="text-center">
+                                    {{-- <a class="icon btn-delete" href="#!" data-id="{{ $item->id }}" title="delete item">
+                                        <i class="fe fe-trash"></i>
+                                    </a> --}}
+                                    <form action="{{ route('tabungan.destroy', $item->id) }}" method="POST" id="form-{{ $item->id }}">
+                                        @csrf 
+                                    </form>
+                                </td>
+                            </tr>
+                        @endforeach
+                        </tbody>
+                    </table>
+                </div>
+                <div class="card-footer">
+                    <div class="d-flex">
+                        <div class="ml-auto mb-0">
+                            {{ $tabungan->links() }}
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+@endsection
+@section('css')
+    <link href="{{ asset('assets/plugins/select2/select2.min.css') }}" rel="stylesheet" />
+    <style>
+        .select2-container--default .select2-selection--multiple .select2-selection__choice {
+            color: black;
+        }
+        .select2{
+            width: 100% !important;
+        }
+    </style>
+@endsection
+@section('js')
+<script>
+    require(['jquery', 'sweetalert','select2'], function ($, sweetalert, select2) {
+        $(document).ready(function () {
+            $('#siswa').select2({
+                placeholder: "Pilih Siswa",
+            });
+            
+            var saldo = 0;
+            var keperluan = 'in';
+            var siswa_id = 0;
+            var jumlah = 0;
+            //keperluan
+            $('.selectgroup-input').change(function(){
+                keperluan = this.value
+                console.log(this.value)
+                $('#form-siswa').show()
+            })
+            // memilih siswa
+            $('#siswa').on('change',function(){
+                if(this.value == '#'){
+                    $('#saldo').text('0')
+                    $('#form-jumlah').hide()
+                    $('#form-keterangan').hide()
+                    $('#submit').hide()
+                    return;
+                }else{
+                    siswa_id = this.value
+                }
+                $.ajax({url: "{{ route('api.getsaldo') }}/" + this.value, success: function(result){
+                    $('#saldo').text(result.sal)
+                    saldo = result.saldo
+                    $('#form-jumlah').show()
+                    $('#form-keterangan').show()
+                    $('#submit').show()
+                }, beforeSend: function(){ 
+                    $('#form-jumlah').hide()
+                    $('#form-keterangan').hide()
+                    $('#submit').hide()
+                    $('#saldo').text('tunggu, sedang mengambil saldo.....') 
+                }
+                });
+            })
+            
+            $('#jumlah').keyup(function(){
+                if(this.value <= 0){
+                    this.value = ''
+                }else{
+                    jumlah = this.value
+                }
+                $('#form-submit').show()
+            })
+            $('#submit').on('click',function(){
+                if((saldo <= 0 && keperluan == 'out')|| (saldo < jumlah && keperluan == 'out')){
+                    swal({
+                        title: 'tidak dapat melakukan penarikan, saldo ' + saldo + ', dengan jumlah ' + jumlah,
+                        dangerMode: true,
+                    })
+                }else if(jumlah <= 99 && keperluan == 'in' || jumlah == undefined || $('#jumlah').val() <= 99){
+                    swal({
+                        title: 'jumlah belum diisi',
+                        dangerMode: true,
+                    })
+                }else{
+                    $('#submit').addClass("btn-loading")
+                    $.ajax({
+                    type: "POST",
+                    url: "{{ route('api.menabung') }}/"+siswa_id,
+                    data: {
+                        tipe : keperluan,
+                        siswa_id : siswa_id,
+                        jumlah : jumlah,
+                        keperluan : $('#keterangan').val()
+                    },
+                    success: function(data){
+                        swal({title: data.msg})
+                        setTimeout(function(){
+                            window.location.reload()
+                        }, 2000)
+                    },
+                    error: function(data){
+                        console.log('Error......')
+                        console.log(data)
+                    }
+                    });
+                }
+
+            })
+            
+            $(document).on('click','.btn-delete', function(){
+                formid = $(this).attr('data-id');
+                swal({
+                    title: 'Anda yakin ingin menghapus?',
+                    text: 'mutasi yang dihapus tidak dapat dikembalikan',
+                    dangerMode: true,
+                    buttons: {
+                        cancel: true,
+                        confirm: true,
+                    },
+                }).then((result) => {
+                    if (result) {
+                        $('#form-' + formid).submit();
+                    }
+                })
+            })
+
+        });
+    });
+</script>
+@endsection
\ No newline at end of file
diff --git a/routes/api.php b/routes/api.php
index c641ca5..acf30c6 100644
--- a/routes/api.php
+++ b/routes/api.php
@@ -16,3 +16,6 @@ use Illuminate\Http\Request;
 Route::middleware('auth:api')->get('/user', function (Request $request) {
     return $request->user();
 });
+
+Route::get('saldo/{siswa?}','SiswaController@getSaldo')->name('api.getsaldo');
+Route::post('menabung/{siswa?}', 'TabunganController@menabung')->name('api.menabung');
\ No newline at end of file
diff --git a/routes/web.php b/routes/web.php
index 600473a..2647e60 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -61,6 +61,12 @@ Route::middleware(['auth:web'])->group(function(){
     Route::get('user/{user}/ubah', 'UserController@edit')->name('user.edit');
     Route::post('user/{user}/ubah','UserController@update')->name('user.update');
     Route::post('user/{user}/hapus', 'UserController@destroy')->name('user.destroy');
+
+    //Menabung
+    Route::get('tabungan', 'TabunganController@index')->name('tabungan.index');
+    Route::post('menabung', 'TabunganController@menabung')->name('tabungan.store');
+    Route::get('export-mutasi', 'TabunganController@export')->name('tabungan.export');
+    Route::post('del-tabungan','TabunganController@destroy')->name('tabungan.destroy');
 });