diff --git a/app/Http/Controllers/Admins/Dashboard/DounatController.php b/app/Http/Controllers/Admins/Dashboard/DounatController.php
new file mode 100644
index 0000000..1ab872e
--- /dev/null
+++ b/app/Http/Controllers/Admins/Dashboard/DounatController.php
@@ -0,0 +1,54 @@
+<?php
+
+namespace App\Http\Controllers\Admins\Dashboard;
+
+use App\Helpers\ResponseFormatter;
+use App\Http\Controllers\Controller;
+use App\Models\KelompokKategori;
+use App\Models\KelompokKategoriPivot;
+use App\Models\MenuTerlarisView;
+use Illuminate\Http\Request;
+
+class DounatController extends Controller
+{
+    public function getChartDounat()
+    {
+        $menuPaket = $this->menuPaket();
+        $menuIrit = $this->menuIrit();
+
+        return ResponseFormatter::success(['menuPaket' => $menuPaket, 'menuIrit' => $menuIrit]);
+    }
+
+    public function menuPaket()
+    {
+        // get menu terlaris where kelompok kategori id = 1
+        $data = MenuTerlarisView::whereHas('kelompokKategoriPivot', function ($query) {
+            $query->where('kelompok_kategori_id', 1);
+        })->where([
+            ['nama_produk', 'not like', '%paket irit%'],
+            ['kode_produk', 'not regexp', '^[a-zA-Z0-9]{2}$'],
+            ['kode_produk', 'not regexp', '^[a-zA-Z0-9]{4}$']
+        ])->orderBy('jumlah_produk_terjual', 'desc')->limit(6)->get();
+
+        return [
+            'labels' => $data->pluck('nama_produk'),
+            'data' => $data->pluck('jumlah_produk_terjual')
+        ];
+    }
+
+    public function menuIrit()
+    {
+        // get menu terlaris where kelompok kategori id = 1
+        $data = MenuTerlarisView::whereHas('kelompokKategoriPivot', function ($query) {
+            $query->where([['kelompok_kategori_id', 2]]);
+        })->where([
+            ['nama_produk', 'like', '%paket irit%'],
+            ['kode_produk', 'not regexp', '^[a-zA-Z0-9]{2}$']
+        ])->orderBy('jumlah_produk_terjual', 'desc')->limit(6)->get();
+
+        return [
+            'labels' => $data->pluck('nama_produk'),
+            'data' => $data->pluck('jumlah_produk_terjual')
+        ];
+    }
+}
diff --git a/app/Http/Controllers/Admins/Dashboard/DounatSatuanController.php b/app/Http/Controllers/Admins/Dashboard/DounatSatuanController.php
new file mode 100644
index 0000000..684d667
--- /dev/null
+++ b/app/Http/Controllers/Admins/Dashboard/DounatSatuanController.php
@@ -0,0 +1,102 @@
+<?php
+
+namespace App\Http\Controllers\Admins\Dashboard;
+
+use App\Helpers\ResponseFormatter;
+use App\Http\Controllers\Controller;
+use App\Models\MenuTerlarisView;
+use Illuminate\Http\Request;
+
+class DounatSatuanController extends Controller
+{
+    public function getChartDounatSatuan()
+    {
+        $nasi = $this->nasi();
+        $sambal = $this->sambal();
+        $lauk = $this->lauk();
+
+        return ResponseFormatter::success(['menuNasi' => $nasi, 'menuSambal' => $sambal, 'menuLauk' => $lauk]);
+    }
+
+    public function nasi()
+    {
+        // get menu terlaris where kelompok kategori id = 1
+        $nasiPutih = MenuTerlarisView::where('nama_produk', 'like', '%nasi putih%')
+            ->whereNull('tgl_start_promo')
+            ->get();
+
+        $nasiJeruk = MenuTerlarisView::where('nama_produk', 'like', '%nasi jeruk%')
+            ->whereNull('tgl_start_promo')
+            ->get();
+
+        $nasiPecel = MenuTerlarisView::where('nama_produk', 'like', '%nasi pecel%')
+            ->whereNull('tgl_start_promo')
+            ->get();
+
+        return [
+            'labels' => ['Nasi Putih', 'Nasi Jeruk', 'Nasi Pecel'],
+            'data' => [$nasiPutih->sum('jumlah_produk_terjual'), $nasiJeruk->sum('jumlah_produk_terjual'), $nasiPecel->sum('jumlah_produk_terjual')]
+        ];
+    }
+
+    public function sambal()
+    {
+        // get menu terlaris where kelompok kategori id = 1
+        $sambalMatah = MenuTerlarisView::where('nama_produk', 'like', '%sambal matah%')
+            ->whereNull('tgl_start_promo')
+            ->get();
+
+        $sambalIjo = MenuTerlarisView::where('nama_produk', 'like', '%sambal ijo%')
+            ->whereNull('tgl_start_promo')
+            ->get();
+
+        $sambalBawang = MenuTerlarisView::where('nama_produk', 'like', '%sambal bawang%')
+            ->whereNull('tgl_start_promo')
+            ->get();
+
+        return [
+            'labels' => ['Sambal Matah', 'Sambal Ijo', 'Sambal Bawang'],
+            'data' => [$sambalMatah->sum('jumlah_produk_terjual'), $sambalIjo->sum('jumlah_produk_terjual'), $sambalBawang->sum('jumlah_produk_terjual')]
+        ];
+    }
+
+    public function lauk()
+    {
+        // get menu terlaris where kelompok kategori id = 1
+        $cakalan = MenuTerlarisView::where('nama_produk', 'like', '%cakalan%')
+            ->whereNull('tgl_start_promo')
+            ->get();
+        $usus = MenuTerlarisView::where('nama_produk', 'like', '%usus%')
+            ->whereNull('tgl_start_promo')
+            ->get();
+        $rempelo = MenuTerlarisView::where('nama_produk', 'like', '%rempelo%')
+            ->whereNull('tgl_start_promo')
+            ->get();
+        $kulit = MenuTerlarisView::where('nama_produk', 'like', '%kulit%')
+            ->whereNull('tgl_start_promo')
+            ->get();
+        $suwir = MenuTerlarisView::where('nama_produk', 'like', '%suwir%')
+            ->whereNull('tgl_start_promo')
+            ->get();
+        $paru = MenuTerlarisView::where('nama_produk', 'like', '%paru%')
+            ->whereNull('tgl_start_promo')
+            ->get();
+        $babat = MenuTerlarisView::where('nama_produk', 'like', '%babat%')
+            ->whereNull('tgl_start_promo')
+            ->get();
+        $udang = MenuTerlarisView::where('nama_produk', 'like', '%udang%')
+            ->whereNull('tgl_start_promo')
+            ->get();
+        $cumi = MenuTerlarisView::where('nama_produk', 'like', '%cumi%')
+            ->whereNull('tgl_start_promo')
+            ->get();
+        $sapi = MenuTerlarisView::where('nama_produk', 'like', '%sapi%')
+            ->whereNull('tgl_start_promo')
+            ->get();
+
+        return [
+            'labels' => ['Cakalan', 'Usus', 'Rempelo', 'Kulit', 'Suwir', 'Paru', 'Babat', 'Udang', 'Cumi', 'Sapi'],
+            'data' => [$cakalan->sum('jumlah_produk_terjual'), $usus->sum('jumlah_produk_terjual'), $rempelo->sum('jumlah_produk_terjual'), $kulit->sum('jumlah_produk_terjual'), $suwir->sum('jumlah_produk_terjual'), $paru->sum('jumlah_produk_terjual'), $babat->sum('jumlah_produk_terjual'), $udang->sum('jumlah_produk_terjual'), $cumi->sum('jumlah_produk_terjual'), $sapi->sum('jumlah_produk_terjual')]
+        ];
+    }
+}
diff --git a/app/Http/Controllers/Admins/Penjualan/PenjualanController.php b/app/Http/Controllers/Admins/Penjualan/PenjualanController.php
index 1eaa680..c4710ce 100644
--- a/app/Http/Controllers/Admins/Penjualan/PenjualanController.php
+++ b/app/Http/Controllers/Admins/Penjualan/PenjualanController.php
@@ -7,6 +7,7 @@ use App\Models\DetailPesanan;
 use App\Models\Pesanan;
 use Carbon\Carbon;
 use Illuminate\Http\Request;
+use Illuminate\Support\Facades\DB;
 
 class PenjualanController extends Controller
 {
@@ -56,6 +57,7 @@ class PenjualanController extends Controller
             })
             ->addColumn('ubah', function ($data) {
                 return '<div class="btn-group">
+                <a href="javascript:void(0)" onclick="cancelOrder(\'' . $data->id . '\')"><span class="btn btn-xs btn-danger mr-1">cancel</span></a>
                     <a href="javascript:void(0)" onclick="detail(\'' . $data->id . '\')"><span class="btn btn-xs btn-warning mr-1"><i class="fas fa-eye"></i></span></a>
                     <a href="javascript:void(0)" onclick="print(\'' . $data->id . '\')"><span class="btn btn-xs btn-success"><i class="fas fa-print"></i></span></a></div>';
             })
@@ -106,4 +108,64 @@ class PenjualanController extends Controller
         $mpdf->Output('Laporan_Penjualan.pdf', 'I');
         return response()->header('Content-Type', 'application/pdf');
     }
+
+    public function cancel(Request $request)
+    {
+        try {
+
+            DB::beginTransaction();
+            $pesanan = Pesanan::find($request->id);
+            $pesanan->status_pesanan = 3;
+            // delete detail pesanan
+            $pesanan->detailPesanan()->delete();
+            $pesanan->delete();
+            $pesanan->save();
+
+            DB::commit();
+            return response()->json(['status' => true, 'message' => 'Pesanan berhasil di cancel']);
+        } catch (\Throwable $th) {
+            DB::rollBack();
+            return response()->json(['status' => false, 'message' => 'Pesanan gagal di cancel']);
+            //throw $th;
+        }
+    }
+
+    public function dibatalkan()
+    {
+        if (request()->ajax()) {
+            $data = Pesanan::with(['detailPesanan', 'user'])
+                ->where('status_pesanan', 3)
+                ->orderBy('tanggal_pesanan', 'desc')
+                ->withTrashed()
+                ->get();
+
+            return datatables()
+                ->of($data)
+                ->addIndexColumn()
+                ->addColumn('nama_pemesan', function ($data) {
+                    $nomor = $data->nomor_pemesan != null ? '(' . $data->nomor_pemesan . ')' : '';
+                    return $data->nama_pemesan . ' ' . $nomor;
+                })
+                ->addColumn('nomor_meja', function ($data) {
+                    return $data->nomor_meja != null ? $data->nomor_meja : '-';
+                })
+                ->addColumn('created_at', function ($data) {
+                    return \Carbon\Carbon::parse($data->created_at)->format('d F Y H:i:s');
+                })
+                ->addColumn('total_bayar_rp', function ($data) {
+                    return 'Rp ' . number_format($data->total_bayar, 0, ',', '.');
+                })
+                ->addColumn('grand_total_rp', function ($data) {
+                    return 'Rp ' . number_format($data->grand_total, 0, ',', '.');
+                })
+                ->addColumn('ubah', function ($data) {
+                    return '<div class="btn-group">
+                    <a href="javascript:void(0)" onclick="detail(\'' . $data->id . '\')"><span class="btn btn-xs btn-warning mr-1"><i class="fas fa-eye"></i></span></a>
+                    <a href="javascript:void(0)" onclick="print(\'' . $data->id . '\')"><span class="btn btn-xs btn-success"><i class="fas fa-print"></i></span></a></div>';
+                })
+                ->rawColumns(['nomor', 'nama_user', 'created_at', 'grand_total', 'ubah'])
+                ->make(true);
+        }
+        return view('pages.admin.penjualan.dibatalkan');
+    }
 }
diff --git a/app/Models/KelompokKategori.php b/app/Models/KelompokKategori.php
index b4369e9..c1bfbca 100644
--- a/app/Models/KelompokKategori.php
+++ b/app/Models/KelompokKategori.php
@@ -29,4 +29,10 @@ class KelompokKategori extends Model
     {
         return $this->hasMany(KelompokKategoriPivot::class, 'kelompok_kategori_id');
     }
+
+    // menu terlaris
+    public function menuTerlaris()
+    {
+        return $this->belongsToMany(MenuTerlarisView::class, 'kelompok_kategori_pivots', 'kelompok_kategori_id', 'produk_id');
+    }
 }
diff --git a/app/Models/MenuTerlarisView.php b/app/Models/MenuTerlarisView.php
index 4a1b0f8..39a48ce 100644
--- a/app/Models/MenuTerlarisView.php
+++ b/app/Models/MenuTerlarisView.php
@@ -31,4 +31,9 @@ class MenuTerlarisView extends Model
     {
         return $this->belongsToMany(KelompokKategori::class, KelompokKategoriPivot::class, 'produk_id', 'kelompok_kategori_id');
     }
+
+    public function kelompokKategoriPivot()
+    {
+        return $this->hasMany(KelompokKategoriPivot::class, 'produk_id');
+    }
 }
diff --git a/database/migrations/2024_02_03_201324_add_cancel_option_in_status_pesanan_in_table_pesanan.php b/database/migrations/2024_02_03_201324_add_cancel_option_in_status_pesanan_in_table_pesanan.php
new file mode 100644
index 0000000..f42864f
--- /dev/null
+++ b/database/migrations/2024_02_03_201324_add_cancel_option_in_status_pesanan_in_table_pesanan.php
@@ -0,0 +1,28 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     */
+    public function up(): void
+    {
+        Schema::table('pesanans', function (Blueprint $table) {
+            $table->enum('status_pesanan', [0, 1, 2, 3])->default(1)->comment('0=takeaway,1=default,2=dinein,3=cancel')->change();
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     */
+    public function down(): void
+    {
+        Schema::table('pesanans', function (Blueprint $table) {
+            $table->enum('status_pesanan', [0, 1, 2])->default(1)->comment('0=takeaway,1=default,2=dinein')->change();
+        });
+    }
+};
diff --git a/resources/views/pages/Kasir/js.blade.php b/resources/views/pages/Kasir/js.blade.php
index 58f4f32..a0b5e0e 100644
--- a/resources/views/pages/Kasir/js.blade.php
+++ b/resources/views/pages/Kasir/js.blade.php
@@ -202,7 +202,7 @@
                     <br>
                     ${(diskonSatuan > 0) ? '<small class="text-primary"><s>Rp. ' + (harga * qty) + '</s></small> | <small class="text-danger">Rp. ' + total + '</small>' : '<small class="text-primary">Rp. ' + totalLama + '</small>'}
                     <div class="input-group input-group-sm mt-1">
-                        <input type="text" name="keterangan_satuan" data-keterangan="" class="form-control rounded-3" placeholder="Keterangane..">
+                        <input type="text" name="keterangan_satuan" data-keterangan="" class="form-control rounded-3" placeholder="Keterangan..">
                     </div>
                 </td>
                 `;
diff --git a/resources/views/pages/admin/dashboard/chart.blade.php b/resources/views/pages/admin/dashboard/chart.blade.php
new file mode 100644
index 0000000..07942c1
--- /dev/null
+++ b/resources/views/pages/admin/dashboard/chart.blade.php
@@ -0,0 +1,191 @@
+<div class="content">
+    <div class="container-fluid">
+        <div class="row">
+            <div class="col-lg-6">
+                <div class="card">
+                    <div class="card-header">
+                        <h3 class="card-title">Paket Spesial Terlaris</h3>
+
+                        <div class="card-tools">
+                            <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                <i class="fas fa-minus"></i>
+                            </button>
+                            <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                <i class="fas fa-times"></i>
+                            </button>
+                        </div>
+                    </div>
+                    <!-- /.card-header -->
+                    <div class="card-body">
+                        <div class="row">
+                            <div class="col-md-6">
+                                <div class="chart-responsive">
+                                    <canvas id="pieChartPaket" height="150"></canvas>
+                                </div>
+                                <!-- ./chart-responsive -->
+                            </div>
+                            <div class="col-md-6">
+                                <ul class="chart-legend clearfix" id="menuPaketLegend">
+                                </ul>
+                                <!-- ./chart-responsive -->
+                            </div>
+                        </div>
+                        <!-- /.row -->
+                    </div>
+                    <!-- /.card-body -->
+                </div>
+            </div>
+            <!-- /.col-lg-3 -->
+            <div class="col-lg-6">
+                <div class="card">
+                    <div class="card-header">
+                        <h3 class="card-title">Paket Irit Terlaris</h3>
+
+                        <div class="card-tools">
+                            <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                <i class="fas fa-minus"></i>
+                            </button>
+                            <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                <i class="fas fa-times"></i>
+                            </button>
+                        </div>
+                    </div>
+                    <!-- /.card-header -->
+                    <div class="card-body">
+                        <div class="row">
+                            <div class="col-md-6">
+                                <div class="chart-responsive">
+                                    <canvas id="pieChartIrit" height="150"></canvas>
+                                </div>
+                                <!-- ./chart-responsive -->
+                            </div>
+                            <div class="col-md-6">
+                                <ul class="chart-legend clearfix" id="menuIritLegend">
+                                </ul>
+                                <!-- ./chart-responsive -->
+                            </div>
+                        </div>
+                        <!-- /.row -->
+                    </div>
+                    <!-- /.card-body -->
+                </div>
+            </div>
+            <!-- /.col-lg-3 -->
+        </div>
+        <!-- /.row -->
+    </div>
+    <!-- /.container-fluid -->
+</div>
+<!-- /.content -->
+
+
+<div class="content">
+    <div class="container-fluid">
+        <div class="row">
+            <div class="col-lg-4">
+                <div class="card">
+                    <div class="card-header">
+                        <h3 class="card-title">Nasi Terlaris</h3>
+
+                        <div class="card-tools">
+                            <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                <i class="fas fa-minus"></i>
+                            </button>
+                            <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                <i class="fas fa-times"></i>
+                            </button>
+                        </div>
+                    </div>
+                    <!-- /.card-header -->
+                    <div class="card-body">
+                        <div class="col-md-12">
+                            <div class="chart-responsive">
+                                <canvas id="pieChartNasi" height="150"></canvas>
+                            </div>
+                            <!-- ./chart-responsive -->
+                        </div>
+                        <div class="col-md-12">
+                            <ul class="chart-legend clearfix" id="menuNasiLegend">
+                            </ul>
+                            <!-- ./chart-responsive -->
+                        </div>
+                        <!-- /.row -->
+                    </div>
+                    <!-- /.card-body -->
+                </div>
+            </div>
+            <!-- /.col-lg-3 -->
+            <div class="col-lg-4">
+                <div class="card">
+                    <div class="card-header">
+                        <h3 class="card-title">Sambal Terlaris</h3>
+
+                        <div class="card-tools">
+                            <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                <i class="fas fa-minus"></i>
+                            </button>
+                            <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                <i class="fas fa-times"></i>
+                            </button>
+                        </div>
+                    </div>
+                    <!-- /.card-header -->
+                    <div class="card-body">
+                        <div class="col-md-12">
+                            <div class="chart-responsive">
+                                <canvas id="pieChartSambal" height="150"></canvas>
+                            </div>
+                            <!-- ./chart-responsive -->
+                        </div>
+                        <div class="col-md-12">
+                            <ul class="chart-legend clearfix" id="menuSambalLegend">
+                            </ul>
+                            <!-- ./chart-responsive -->
+                        </div>
+                        <!-- /.row -->
+                    </div>
+                    <!-- /.card-body -->
+                </div>
+            </div>
+            <!-- /.col-lg-3 -->
+            <div class="col-lg-4">
+                <div class="card">
+                    <div class="card-header">
+                        <h3 class="card-title">Lauk Terlaris</h3>
+
+                        <div class="card-tools">
+                            <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                <i class="fas fa-minus"></i>
+                            </button>
+                            <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                <i class="fas fa-times"></i>
+                            </button>
+                        </div>
+                    </div>
+                    <!-- /.card-header -->
+                    <div class="card-body">
+                        <div class="row">
+                            <div class="col-md-12">
+                                <div class="chart-responsive">
+                                    <canvas id="pieChartLauk" height="150"></canvas>
+                                </div>
+                                <!-- ./chart-responsive -->
+                            </div>
+                            <div class="col-md-12">
+                                <ul class="chart-legend clearfix" id="menuLaukLegend">
+                                </ul>
+                                <!-- ./chart-responsive -->
+                            </div>
+                        </div>
+                        <!-- /.row -->
+                    </div>
+                    <!-- /.card-body -->
+                </div>
+            </div>
+            <!-- /.col-lg-3 -->
+        </div>
+        <!-- /.row -->
+    </div>
+    <!-- /.container-fluid -->
+</div>
+<!-- /.content -->
diff --git a/resources/views/pages/admin/dashboard/chartjs.blade.php b/resources/views/pages/admin/dashboard/chartjs.blade.php
new file mode 100644
index 0000000..d283be4
--- /dev/null
+++ b/resources/views/pages/admin/dashboard/chartjs.blade.php
@@ -0,0 +1,264 @@
+@push('scripts')
+    <script src="{{ asset('assets/plugins/chart.js/Chart.min.js') }}"></script>
+    <!-- ChartJS -->
+
+    <script>
+        $(function() {
+            'use strict'
+
+
+            $.ajax({
+                url: "{{ route('dashboard.getChartDounat') }}",
+                type: "GET",
+                cache: false,
+                async: false,
+                success: function(response) {
+                    var data = response.data;
+                    chartPaket(data.menuPaket);
+                    chartIrit(data.menuIrit);
+                },
+                error: function(response) {
+                    console.log(response);
+                }
+            })
+
+
+        })
+
+        function chartPaket(params) {
+            //-------------
+            // - PIE CHART -
+            //-------------
+            // Get context with jQuery - using jQuery's .get() method.
+            var pieChartCanvas = $('#pieChartPaket').get(0).getContext('2d')
+            var data = params;
+
+            var color = ['#f56954', '#00a65a', '#f39c12', '#00c0ef',
+                '#3c8dbc', '#d2d6de'
+            ]
+            var menuPaketLegend = $('#menuPaketLegend');
+            $.each(data.labels, function(index, value) {
+                menuPaketLegend.append('<li><i class="far fa-circle" style="color:' +
+                    color[index] + '"></i>' + value + ' : ' + data.data[
+                        index] + '</li>');
+            });
+            var pieData = {
+                labels: data.labels,
+                datasets: [{
+                    data: data.data,
+                    backgroundColor: color
+                    // backgroundColor: ['#f56954', '#00a65a', '#f39c12', '#00c0ef',
+                    //     '#3c8dbc', '#d2d6de', '#605ca8', '#ff851b', '#00a65a',
+                    //     '#f39c12'
+                    // ]
+                }]
+            }
+            var pieOptions = {
+                legend: {
+                    display: false
+                }
+            }
+            // Create pie or douhnut chart
+            // You can switch between pie and douhnut using the method below.
+            // eslint-disable-next-line no-unused-vars
+            var pieChart = new Chart(pieChartCanvas, {
+                type: 'doughnut',
+                data: pieData,
+                options: pieOptions
+            })
+        }
+
+        function chartIrit(params) {
+            //-------------
+            // - PIE CHART -
+            //-------------
+            // Get context with jQuery - using jQuery's .get() method.
+            var pieChartCanvas = $('#pieChartIrit').get(0).getContext('2d')
+            var data = params;
+
+            var color = ['#605ca8', '#ff851b', '#00a65a', '#f39c12', '#00c0ef', '#3c8dbc'];
+            var menuIritLegend = $('#menuIritLegend');
+            $.each(data.labels, function(index, value) {
+                menuIritLegend.append('<li><i class="far fa-circle" style="color:' +
+                    color[index] + '"></i>' + value + ' : ' + data.data[
+                        index] + '</li>');
+            });
+            var pieData = {
+                labels: data.labels,
+                datasets: [{
+                    data: data.data,
+                    backgroundColor: color
+                    // backgroundColor: ['#f56954', '#00a65a', '#f39c12', '#00c0ef',
+                    //     '#3c8dbc', '#d2d6de', '#605ca8', '#ff851b', '#00a65a',
+                    //     '#f39c12'
+                    // ]
+                }]
+            }
+            var pieOptions = {
+                legend: {
+                    display: false
+                }
+            }
+            // Create pie or douhnut chart
+            // You can switch between pie and douhnut using the method below.
+            // eslint-disable-next-line no-unused-vars
+            var pieChart = new Chart(pieChartCanvas, {
+                type: 'doughnut',
+                data: pieData,
+                options: pieOptions
+            })
+        }
+    </script>
+
+    <script>
+        $(function() {
+            'use strict'
+
+
+            $.ajax({
+                url: "{{ route('dashboard.getChartDounatSatuan') }}",
+                type: "GET",
+                cache: false,
+                async: false,
+                success: function(response) {
+                    var data = response.data;
+                    chartNasi(data.menuNasi);
+                    chartSambal(data.menuSambal);
+                    chartLauk(data.menuLauk);
+                },
+                error: function(response) {
+                    console.log(response);
+                }
+            })
+
+
+        })
+
+        function chartNasi(params) {
+            //-------------
+            // - PIE CHART -
+            //-------------
+            // Get context with jQuery - using jQuery's .get() method.
+            var pieChartCanvas = $('#pieChartNasi').get(0).getContext('2d')
+            var data = params;
+
+            var color = ['#f56954', '#00a65a', '#f39c12', '#00c0ef',
+                '#3c8dbc', '#d2d6de'
+            ]
+            var menuNasiLegend = $('#menuNasiLegend');
+            $.each(data.labels, function(index, value) {
+                menuNasiLegend.append('<li><i class="far fa-circle" style="color:' +
+                    color[index] + '"></i>' + value + ' : ' + data.data[
+                        index] + '</li>');
+            });
+            var pieData = {
+                labels: data.labels,
+                datasets: [{
+                    data: data.data,
+                    backgroundColor: color
+                    // backgroundColor: ['#f56954', '#00a65a', '#f39c12', '#00c0ef',
+                    //     '#3c8dbc', '#d2d6de', '#605ca8', '#ff851b', '#00a65a',
+                    //     '#f39c12'
+                    // ]
+                }]
+            }
+            var pieOptions = {
+                legend: {
+                    display: false
+                }
+            }
+            // Create pie or douhnut chart
+            // You can switch between pie and douhnut using the method below.
+            // eslint-disable-next-line no-unused-vars
+            var pieChart = new Chart(pieChartCanvas, {
+                type: 'doughnut',
+                data: pieData,
+                options: pieOptions
+            })
+        }
+
+        function chartSambal(params) {
+            //-------------
+            // - PIE CHART -
+            //-------------
+            // Get context with jQuery - using jQuery's .get() method.
+            var pieChartCanvas = $('#pieChartSambal').get(0).getContext('2d')
+            var data = params;
+
+            var color = ['#605ca8', '#ff851b', '#00a65a', '#f39c12', '#00c0ef', '#3c8dbc'];
+            var menuSambalLegend = $('#menuSambalLegend');
+            $.each(data.labels, function(index, value) {
+                menuSambalLegend.append('<li><i class="far fa-circle" style="color:' +
+                    color[index] + '"></i>' + value + ' : ' + data.data[
+                        index] + '</li>');
+            });
+            var pieData = {
+                labels: data.labels,
+                datasets: [{
+                    data: data.data,
+                    backgroundColor: color
+                    // backgroundColor: ['#f56954', '#00a65a', '#f39c12', '#00c0ef',
+                    //     '#3c8dbc', '#d2d6de', '#605ca8', '#ff851b', '#00a65a',
+                    //     '#f39c12'
+                    // ]
+                }]
+            }
+            var pieOptions = {
+                legend: {
+                    display: false
+                }
+            }
+            // Create pie or douhnut chart
+            // You can switch between pie and douhnut using the method below.
+            // eslint-disable-next-line no-unused-vars
+            var pieChart = new Chart(pieChartCanvas, {
+                type: 'doughnut',
+                data: pieData,
+                options: pieOptions
+            })
+        }
+
+        function chartLauk(params) {
+            //-------------
+            // - PIE CHART -
+            //-------------
+            // Get context with jQuery - using jQuery's .get() method.
+            var pieChartCanvas = $('#pieChartLauk').get(0).getContext('2d')
+            var data = params;
+
+            var color = ['#605ca8', '#ff851b', '#00a65a', '#f39c12', '#00c0ef', '#3c8dbc', '#d2d6de', '#f56954', '#4b0082',
+                '#ff0000'
+            ];
+            var menuLaukLegend = $('#menuLaukLegend');
+            $.each(data.labels, function(index, value) {
+                menuLaukLegend.append('<li><i class="far fa-circle" style="color:' +
+                    color[index] + '"></i>' + value + ' : ' + data.data[
+                        index] + '</li>');
+            });
+            var pieData = {
+                labels: data.labels,
+                datasets: [{
+                    data: data.data,
+                    backgroundColor: color
+                    // backgroundColor: ['#f56954', '#00a65a', '#f39c12', '#00c0ef',
+                    //     '#3c8dbc', '#d2d6de', '#605ca8', '#ff851b', '#00a65a',
+                    //     '#f39c12'
+                    // ]
+                }]
+            }
+            var pieOptions = {
+                legend: {
+                    display: false
+                }
+            }
+            // Create pie or douhnut chart
+            // You can switch between pie and douhnut using the method below.
+            // eslint-disable-next-line no-unused-vars
+            var pieChart = new Chart(pieChartCanvas, {
+                type: 'doughnut',
+                data: pieData,
+                options: pieOptions
+            })
+        }
+    </script>
+@endpush
diff --git a/resources/views/pages/admin/dashboard/dashboard.blade.php b/resources/views/pages/admin/dashboard/dashboard.blade.php
index 8584147..9af5cf6 100644
--- a/resources/views/pages/admin/dashboard/dashboard.blade.php
+++ b/resources/views/pages/admin/dashboard/dashboard.blade.php
@@ -208,6 +208,8 @@
         <!-- /.container-fluid -->
     </div>
 
+    @include('pages.admin.dashboard.chart')
+
     <div class="content">
         <div class="container-fluid">
             <div class="row">
@@ -280,5 +282,6 @@
 @push('styles')
     <link rel="stylesheet" href="{{ asset('assets/datatables/datatables.min.css') }} ">
 @endpush
+@include('pages.admin.dashboard.chartjs')
 
 @include('pages.admin.dashboard.js')
diff --git a/resources/views/pages/admin/dashboard/js.blade.php b/resources/views/pages/admin/dashboard/js.blade.php
index 6c97783..ecc933f 100644
--- a/resources/views/pages/admin/dashboard/js.blade.php
+++ b/resources/views/pages/admin/dashboard/js.blade.php
@@ -330,7 +330,7 @@
                 async: false,
                 success: function(response) {
                     var data = response.data;
-                    console.log(data);
+                    // console.log(data);
                     changeDataFromCalculate('penjualanBulan', data.pendapatanBulan
                         .penjualanSatuBulan, data.pendapatanBulan.percentageOfSalesGrowth,
                         data.pendapatanBulan.statusCalculation)
diff --git a/resources/views/pages/admin/penjualan/dibatalkan.blade.php b/resources/views/pages/admin/penjualan/dibatalkan.blade.php
new file mode 100644
index 0000000..5418b0e
--- /dev/null
+++ b/resources/views/pages/admin/penjualan/dibatalkan.blade.php
@@ -0,0 +1,86 @@
+@extends('layouts.base')
+
+@section('content-header')
+    <div class="col-12">
+        <div class="container" style="display: contents">
+            <div class="row mb-2">
+                <div class="col-sm-6">
+                    <h1 class="m-0"> Penjualan Dibatalkan</h1>
+                </div>
+                <div class="col-sm-6">
+                    <ol class="breadcrumb float-sm-right">
+                        <li class="breadcrumb-item">Home</li>
+                        <li class="breadcrumb-item">Transaksi</li>
+                        <li class="breadcrumb-item active">Dibatalkan</li>
+                    </ol>
+                </div>
+            </div>
+        </div>
+    </div>
+@endsection
+
+@section('content')
+    <div class="col-12 mt-2">
+        <div class="container" style="display: contents">
+            <div class="card">
+                <div class="card bg-info" style="min-height:5px; border-radius:1px;"></div>
+                <div class="card-body">
+                    <div class="col-md-12">
+                        <label>Filter Pencarian:</label>
+                        <form action="{{ route('penjualan.laporan') }}" method="POST">
+                            @csrf
+                            <div class="row">
+                                <div class="col-md-3">
+                                    <input type="date" class="form-control form-control-sm" id="filter_tanggal_1"
+                                        name="filter_tanggal_1" value="{{ date('Y-m-d') }}">
+                                </div>
+                                <p>s/d</p>
+                                <div class="col-md-3">
+                                    <input type="date" class="form-control form-control-sm" id="filter_tanggal_2"
+                                        name="filter_tanggal_2" value="{{ date('Y-m-d') }}">
+                                </div>
+                                <div class="col-md-4">
+                                    <a href="javascript:void(0)" class="btn btn-sm btn-primary" id="btn_filter"><i
+                                            class="fas fa-search mr-1"></i>Filter data</a>
+                                </div>
+                            </div>
+                        </form>
+                    </div>
+                    <div class="col-md-12">
+                        <div class="table-responsive mt-3">
+                            <table id="tabeldibatalkan" class="table table-hover display" style="width: 100%">
+                                <thead>
+                                    <tr>
+                                        <th class="text-center">No</th>
+                                        <th>Kode Pesanan</th>
+                                        <th>Pemesan</th>
+                                        <th>Nomor Meja</th>
+                                        <th>Tanggal & Jam</th>
+                                        <th>Total Pesanan</th>
+                                        <th>Sub Total</th>
+                                        <th>Diskon(%)</th>
+                                        <th>Grand Total</th>
+                                        <th class="text-center"><i class="fas fa-cog"></i></th>
+                                    </tr>
+                                </thead>
+                                <tfoot>
+                                    <tr>
+                                        <th class="text-right" colspan="5">Total</th>
+                                        <th></th>
+                                        <th class="text-right"></th>
+                                        <th></th>
+                                        <th class="text-right"></th>
+                                        <th class="text-center"><i class="fas fa-cog"></i></th>
+                                    </tr>
+                                </tfoot>
+                            </table>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+@endsection
+
+@include('pages.admin.penjualan.style')
+@include('pages.admin.penjualan.js_dibatalkan')
diff --git a/resources/views/pages/admin/penjualan/index.blade.php b/resources/views/pages/admin/penjualan/index.blade.php
index 34296df..8592765 100644
--- a/resources/views/pages/admin/penjualan/index.blade.php
+++ b/resources/views/pages/admin/penjualan/index.blade.php
@@ -25,28 +25,35 @@
             <div class="card">
                 <div class="card bg-warning" style="min-height:5px; border-radius:1px;"></div>
                 <div class="card-body">
-                    <div class="col-md-12">
-                        <label>Filter Pencarian:</label>
-                        <form action="{{ route('penjualan.laporan') }}" method="POST">
-                            @csrf
-                            <div class="row">
-                                <div class="col-md-2">
-                                    <input type="date" class="form-control form-control-sm" id="filter_tanggal_1"
-                                        name="filter_tanggal_1" value="{{ date('Y-m-d') }}">
+                    <div class="row">
+                        <div class="col-md-10">
+                            <label>Filter Pencarian:</label>
+                            <form action="{{ route('penjualan.laporan') }}" method="POST">
+                                @csrf
+                                <div class="row">
+                                    <div class="col-md-3">
+                                        <input type="date" class="form-control form-control-sm" id="filter_tanggal_1"
+                                            name="filter_tanggal_1" value="{{ date('Y-m-d') }}">
+                                    </div>
+                                    <p>s/d</p>
+                                    <div class="col-md-3">
+                                        <input type="date" class="form-control form-control-sm" id="filter_tanggal_2"
+                                            name="filter_tanggal_2" value="{{ date('Y-m-d') }}">
+                                    </div>
+                                    <div class="col-md-4">
+                                        <a href="javascript:void(0)" class="btn btn-sm btn-primary" id="btn_filter"><i
+                                                class="fas fa-search mr-1"></i>Filter data</a>
+                                        <button class="btn btn-sm btn-warning" id="cetak_laporan" type="submit"><i
+                                                class="fas fa-print mr-1"></i>Cetak Laporan Penjualan</button>
+                                    </div>
                                 </div>
-                                <p>s/d</p>
-                                <div class="col-md-2">
-                                    <input type="date" class="form-control form-control-sm" id="filter_tanggal_2"
-                                        name="filter_tanggal_2" value="{{ date('Y-m-d') }}">
-                                </div>
-                                <div class="col-md-2">
-                                    <a href="javascript:void(0)" class="btn btn-sm btn-primary" id="btn_filter"><i
-                                            class="fas fa-search mr-1"></i>Filter data</a>
-                                    <button class="btn btn-sm btn-warning" id="cetak_laporan" type="submit"><i
-                                            class="fas fa-print mr-1"></i>Cetak</button>
-                                </div>
-                            </div>
-                        </form>
+                            </form>
+                        </div>
+                        <div class="col-md-2" style="text-align: right">
+                            <a class="btn btn-sm btn-info mt-4" id="penjualan_cancel"
+                                href="{{ route('penjualan.dibatalkan') }}"><i class="fas fa-table mr-1"></i>Penjualan
+                                Dibatalkan</a>
+                        </div>
                     </div>
                     <div class="col-md-12">
                         <div class="table-responsive mt-3">
diff --git a/resources/views/pages/admin/penjualan/js.blade.php b/resources/views/pages/admin/penjualan/js.blade.php
index e9e23e7..cc427a5 100644
--- a/resources/views/pages/admin/penjualan/js.blade.php
+++ b/resources/views/pages/admin/penjualan/js.blade.php
@@ -1,5 +1,6 @@
 @push('scripts')
     <script src="{{ asset('assets/datatables/datatables.min.js') }}"></script>
+    <script src="{{ asset('assets/plugins/sweetalert2/sweetalert2.min.js') }}"></script>
     <script>
         $(document).ready(function() {
             let dataTable = $('#tabelku').DataTable({
@@ -191,6 +192,47 @@
             return rupiah;
         }
 
+        cancelOrder = (id) => {
+            Swal.fire({
+                title: 'Apakah anda yakin?',
+                text: "Data yang sudah dihapus tidak dapat dikembalikan!",
+                icon: 'warning',
+                showCancelButton: true,
+                confirmButtonColor: '#3085d6',
+                cancelButtonColor: '#d33',
+                confirmButtonText: 'Ya, Hapus!',
+                cancelButtonText: 'Batal'
+            }).then((result) => {
+                if (result.isConfirmed) {
+                    $.ajax({
+                        type: "DELETE",
+                        url: "{{ route('penjualan.cancel') }}",
+                        data: {
+                            _token: "{{ csrf_token() }}",
+                            id: id
+                        },
+                        success: function(result) {
+                            console.log(result);
+                            if (result.status) {
+                                Swal.fire(
+                                    'Berhasil!',
+                                    result.message,
+                                    'success'
+                                )
+                                $('#tabelku').DataTable().ajax.reload();
+                            } else {
+                                Swal.fire(
+                                    'Gagal!',
+                                    result.message,
+                                    'error'
+                                )
+                            }
+                        }
+                    })
+                }
+            })
+        }
+
         // // cetak_laporan
         // $('#cetak_laporan').on('click', function() {
         //     let filter_tanggal_1 = $("#filter_tanggal_1").val()
diff --git a/resources/views/pages/admin/penjualan/js_dibatalkan.blade.php b/resources/views/pages/admin/penjualan/js_dibatalkan.blade.php
new file mode 100644
index 0000000..be74aa3
--- /dev/null
+++ b/resources/views/pages/admin/penjualan/js_dibatalkan.blade.php
@@ -0,0 +1,196 @@
+@push('scripts')
+    <script src="{{ asset('assets/datatables/datatables.min.js') }}"></script>
+    <script src="{{ asset('assets/plugins/sweetalert2/sweetalert2.min.js') }}"></script>
+    <script>
+        $(document).ready(function() {
+            let dataTable = $('#tabeldibatalkan').DataTable({
+                aLengthMenu: [
+                    [25, 50, 100, 200, -1],
+                    [25, 50, 100, 200, "All"]
+                ],
+                processing: true,
+                serverSide: true,
+                ajax: {
+                    url: '{{ route('penjualan.dibatalkan') }}',
+                    data: function(d) {
+                        d.filter_tanggal_1 = $("#filter_tanggal_1").val();
+                        d.filter_tanggal_2 = $("#filter_tanggal_2").val();
+                    }
+                },
+                columns: [{
+                        data: 'DT_RowIndex',
+                        name: 'DT_RowIndex',
+                        orderable: false,
+                        searchable: false,
+                        className: 'text-center'
+                    },
+                    {
+                        data: 'kode_pesanan',
+                        name: 'kode_pesanan'
+                    },
+                    {
+                        data: 'nama_pemesan',
+                        name: 'nama_pemesan'
+                    },
+                    {
+                        data: 'nomor_meja',
+                        name: 'nomor_meja'
+                    },
+                    {
+                        data: 'created_at',
+                        name: 'created_at'
+                    },
+                    {
+                        data: 'total_pesanan',
+                        name: 'total_pesanan',
+                        className: 'text-center'
+                    },
+                    {
+                        data: 'total_bayar',
+                        name: 'total_bayar',
+                        className: 'text-right',
+                        render: function(data) {
+                            // change to IDR
+                            return 'Rp. ' + data.toString().replace(/\B(?=(\d{3})+(?!\d))/g, '.');
+                        }
+                    },
+                    {
+                        data: 'diskon_persen',
+                        name: 'diskon_persen',
+                        className: 'text-center',
+                        render: function(data) {
+                            return data ?? 0;
+                        }
+                    },
+                    {
+                        data: 'grand_total',
+                        name: 'grand_total',
+                        className: 'text-right',
+                        render: function(data) {
+                            // change to IDR
+                            return 'Rp. ' + data.toString().replace(/\B(?=(\d{3})+(?!\d))/g, '.');
+                        }
+                    },
+                    {
+                        data: 'ubah',
+                        name: 'ubah',
+                        className: 'text-center'
+                    },
+                ],
+                footerCallback: function(row, data, start, end, display) {
+                    let api = this.api();
+                    // Remove the formatting to get integer data for summation
+                    let intVal = function(i) {
+                        return typeof i === 'string' ?
+                            i.replace(/[\$,]/g, '') * 1 :
+                            typeof i === 'number' ?
+                            i :
+                            0;
+                    };
+
+                    // GrandTotal over all pages
+                    totalAll = api
+                        .column(8)
+                        .data()
+                        .reduce((a, b) => intVal(a) + intVal(b), 0);
+
+                    // GrandTotal over all pages
+
+
+                    // Total over this page
+                    pageTotal = api
+                        .column(6, {
+                            page: 'current'
+                        })
+                        .data()
+                        .reduce((a, b) => intVal(a) + intVal(b), 0);
+
+                    // total pesanan
+                    totalPesanan = api
+                        .column(5)
+                        .data()
+                        .reduce((a, b) => intVal(a) + intVal(b), 0);
+
+                    // Update footer
+                    api.column(5).footer().innerHTML = totalPesanan + ' Item';
+                    api.column(6).footer().innerHTML =
+                        'Rp. ' + pageTotal.toString().replace(/\B(?=(\d{3})+(?!\d))/g, '.');
+                    api.column(8).footer().innerHTML =
+                        'Rp. ' + totalAll.toString().replace(/\B(?=(\d{3})+(?!\d))/g, '.');
+                }
+            })
+            $('#btn_filter').on('click', function() {
+                if ($("#filter_tanggal_1").val() == "" || $("#filter_tanggal_2").val() == "") {
+                    alert("Input pencarian tidak boleh kosong")
+                } else {
+                    dataTable.ajax.reload();
+                }
+            });
+        })
+    </script>
+    <script>
+        function print(id) {
+            var url = "{{ route('penjualan.print', '') }}/" + id + '?print=true'
+            // window.open(url, '_blank');
+            window.open(url, '_blank', "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=900,height=600");
+        }
+    </script>
+    <script>
+        function detail(id_pesanan) {
+            $.ajax({
+                headers: {
+                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
+                },
+                type: "POST",
+                url: "{{ route('penjualan.getDataDetailPenjualan') }}",
+                data: {
+                    id_pesanan: id_pesanan,
+                },
+                success: function(result) {
+                    $('#view_penjualan_detail').empty()
+                    if (result.status) {
+                        const data = result.data
+                        let nomor = 1
+                        // console.log(data);
+                        data.forEach(x => {
+                            let tr = $('<tr></tr>')
+                            tr.append('<td class="text-center">' + nomor + '</td>')
+                            tr.append('<td>' + x.nama_produk + '</td>')
+                            tr.append('<td>' + formatRupiah(x.harga_produk) + '</td>')
+                            tr.append('<td class="text-center">' + x.jumlah_produk + '</td>')
+                            tr.append('<td>' + formatRupiah(x.total_harga_produk) + '</td>')
+                            tr.append('<td class="text-center">' + x.diskon_persen + '%</td>')
+                            tr.append('<td class="text-center">' + (x.keterangan_produk ?? '-') +
+                                '</td>')
+                            $('#view_penjualan_detail').append(tr)
+                            nomor++
+                        })
+                    }
+                }
+            })
+            $('#modal_detail_penjualan').modal('show')
+        }
+    </script>
+    <script>
+        function formatRupiah(angka) {
+            var bilangan = parseInt(angka);
+
+            // Cek apakah bilangan negatif atau positif
+            var minus = "";
+            if (bilangan < 0) {
+                minus = "-";
+                bilangan = Math.abs(bilangan);
+            }
+
+            // Konversi angka menjadi format ribuan dengan menambahkan titik
+            var reverse = bilangan.toString().split("").reverse().join("");
+            var ribuan = reverse.match(/\d{1,3}/g);
+            var hasil = ribuan.join(".").split("").reverse().join("");
+
+            // Gabungkan hasil dengan simbol rupiah
+            var rupiah = "Rp " + minus + hasil;
+
+            return rupiah;
+        }
+    </script>
+@endpush
diff --git a/resources/views/pages/admin/penjualan/style.blade.php b/resources/views/pages/admin/penjualan/style.blade.php
index 63bfc92..5e40594 100644
--- a/resources/views/pages/admin/penjualan/style.blade.php
+++ b/resources/views/pages/admin/penjualan/style.blade.php
@@ -15,4 +15,5 @@
     </style>
     <link rel="stylesheet" href="{{ asset('assets/plugins/toastr/toastr.min.css') }}">
     <link rel="stylesheet" href="{{ asset('assets/datatables/datatables.min.css') }}">
-@endpush
\ No newline at end of file
+    <link rel="stylesheet" href="{{ asset('assets/plugins/sweetalert2/sweetalert2.min.css') }}">
+@endpush
diff --git a/routes/web.php b/routes/web.php
index 3d0938a..856a1e0 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -4,6 +4,8 @@ use App\Http\Controllers\Admins\Dashboard\CalculationController;
 use App\Http\Controllers\Admins\Dashboard\ChartPengeluaranController;
 use App\Http\Controllers\Admins\Dashboard\ChartPenjualanController;
 use App\Http\Controllers\Admins\Dashboard\DashboardController;
+use App\Http\Controllers\Admins\Dashboard\DounatController;
+use App\Http\Controllers\Admins\Dashboard\DounatSatuanController;
 use App\Http\Controllers\Admins\JenisMenu\JenisMenuController;
 use App\Http\Controllers\Admins\Pengeluaran\PengeluaranController;
 use App\Http\Controllers\Admins\Penjualan\PenjualanController;
@@ -85,6 +87,8 @@ Route::group(['middleware' => ['auth', 'permission']], function () {
         Route::get('/getChartMonth', [ChartPenjualanController::class, 'getChartMonth'])->name('dashboard.getChartMonth')->comment("Ambil data Total Penjualan per Bulan");
         Route::get('/getChartYear', [ChartPenjualanController::class, 'getChartYear'])->name('dashboard.getChartYear')->comment("Ambil data Total Penjualan per Tahun");
         Route::get('/getChartPengeluaran', [ChartPengeluaranController::class, 'getChartPengeluaran'])->name('dashboard.getChartPengeluaran')->comment("Ambil data Total Pengeluaran");
+        Route::get('/getChartDounat', [DounatController::class, 'getChartDounat'])->name('dashboard.getChartDounat')->comment("Ambil data Total Paket Terjual");
+        Route::get('/getChartDounatSatuan', [DounatSatuanController::class, 'getChartDounatSatuan'])->name('dashboard.getChartDounatSatuan')->comment("Ambil data Total Produk Satuan Terjual");
     });
 
 
@@ -128,6 +132,8 @@ Route::group(['middleware' => ['auth', 'permission']], function () {
         Route::get('/print/{id}', [PenjualanController::class, 'print'])->name('penjualan.print')->comment("Print Riwayat Transaksi Penjualan");
         Route::post('/laporan', [PenjualanController::class, 'laporan'])->name('penjualan.laporan')->comment('Halaman Laporan Penjualan');
         Route::post('/getDataDetailPenjualan', [PenjualanController::class, 'getDataDetailPenjualan'])->name('penjualan.getDataDetailPenjualan')->comment("Ambil data Detail Riwayat Transaksi Penjualan");
+        Route::delete('/cancel', [PenjualanController::class, 'cancel'])->name('penjualan.cancel')->comment("Cancel order transaksi penjualan");
+        Route::get('/dibatalkan', [PenjualanController::class, 'dibatalkan'])->name('penjualan.dibatalkan')->comment("Halaman Transaksi Dibatalkan");
     });
 
     // Rekening Coa