💎 Aplikasi Kasir Toko Perhiasan

Aplikasi kasir modern berbasis web untuk toko perhiasan dengan sistem manajemen yang lengkap dan antarmuka yang user-friendly. Dibuat khusus sesuai kebutuhan Toko Emas Jakarta Citayam.

👥 Tim Development

PT Teknologi Mulia Sejahtera Cemerlang (Abbauf Tech) - Internship Program

• Baghaztra Van Ril - Backend Developer
• Aditya Ahmad Afarison - Frontend Developer
• Timotius Julius Iwan - Backend Developer
• Dhilan Radya Irawan - Frontend Developer

---

🚀 Tentang Aplikasi

Semuah sistem Point of Sale (POS) yang dirancang khusus untuk kebutuhan toko perhiasan dengan fitur manajemen yang komprehensif dan sistem role-based access control.

✨ Fitur Utama

👑 Role Owner

• Manajemen Produk - CRUD produk perhiasan lengkap dengan detail
• Manajemen Nampan - Organisasi produk berdasarkan nampan display
• Manajemen Brankas - Sistem penyimpanan produk berharga
• Manajemen Sales - Kelola data karyawan dan sales performance
• Kasir - Akses penuh ke sistem transaksi
• Laporan - Dashboard analytics dan laporan keuangan
• Manajemen Akun - User management dan pengaturan sistem

💼 Role Kasir

• Lihat Produk - View-only access ke database produk
• Kasir - Interface transaksi untuk penjualan

🛠️ Tech Stack

• Backend: Laravel 11.x
• Frontend: Vue.js 3 + Vue Router
• Database: MySQL
• Styling: Tailwind CSS
• Build Tool: Vite
• Authentication: Laravel Sanctum
• HTTP Client: Axios

---

📋 Prerequisites

Opsi 1: Docker (Recommended) 🐳

• Docker Desktop (Windows/Mac) atau Docker Engine (Linux)
• Docker Compose v2.0+
• Git

Opsi 2: Manual Installation

• PHP 8.2+
• Composer
• Node.js 18+
• NPM
• MySQL 8.0+
• Redis (optional)
• Git

---

Installation

1. Clone Repository

git clone https://git.abbauf.com/Magang-2025/Kasir.git
cd Kasir

2. Install Dependencies Backend

# Install PHP dependencies
composer install

# Copy environment file
cp .env.example .env

# Generate application key
php artisan key:generate

3. Install Dependencies Frontend

# Install Node.js dependencies
npm install

4. Konfigurasi Database

Edit file .env sesuai dengan konfigurasi database:

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=toko_emas
DB_USERNAME=root
DB_PASSWORD=

5. Setup Database

php artisan migrate

php artisan db:seed

6. Storage Link

php artisan storage:link

7. Jalankan Aplikasi

Development Mode

npm run dev

Production Mode

# Pastikan env production sudah tersedia
docker compose --env-file .env.production up -d --build

# Siapkan database
docker exec -it abbauf_kasir_app php artisan migrate --seed

# Atau import database secara manual
docker exec -i abbauf_kasir_db mysql -u kasir_user -pkasir_password kasir_db < ./toko_emas.sql

# Periksa database (opsional)
docker exec -it abbauf_kasir_db bash
mysql -u kasir_user -pkasir_password kasir_db

8. Print Label

• Install driver, ada pada folder ./driver/NiimbotPrinterDriverInstall_3.0.0.5.exe untuk windows 64bit.
  • Pilih NIIMBOT B3S_P pada saat install driver.
  • Sambungkan printer ke komputer via USB.
  • Nyalakan printer.
• Temukan kode qr yang akan diprint (misalnya pada halaman brankas)
• Klik tombol print pada halaman tersebut
  • Pilih printer NIIMBOT B3S_P dan atur kertas ke ukuran kertas 40mm x 30mm, margin Default, scale Default
  • Klik print

9. Print Nota

• Pastikan printer terhubung dengan komputer via USB.
• Nyalakan printer.
• Install driver, ada pada folder ./driver/L120_x64_213UsHomeExportAsiaML.exe.
• Lakukan transaksi penjualan pada aplikasi, atau pilih nota yang akan diprint di Laporan > Riwayat transaksi.
• Klik tombol print pada halaman tersebut
  • Pilih ukuran kertas A4, margin Minimum, scale 95
  • Klik print

---

🌐 Akses Aplikasi

Setelah instalasi berhasil, akses aplikasi melalui:

• URL: http://localhost:8000

👤 Default Login

Owner Account:

• Username: admin
• Password: 123123

Kasir Account:

• Username: kasir
• Password: 123123

---

📁 Struktur Folder

kasir-toko-perhiasan/
├── app/
│   ├── Http/Controllers/        # API Controllers
│   └── Models/                  # Database Models
├── database/
│   ├── migrations/              # Database Migrations
│   ├── seeders/                 # Data Seeders
│   └── factories/               # Model Factories
├── public/                      # Public Files
├── resources/
│   ├── css/
│   │   └── app.css              # Main CSS File
│   ├── js/
│   │   ├── components/          # Reusable Vue Components
│   │   ├── pages/               # Vue Pages
│   │   ├── router/              # Vue Routes
│   │   ├── services/            # API Services
│   │   └── App.vue
│   └── views/
│       └── app.blade.php        # Main SPA Template
└── routes/
    └── web.php                  # Laravel Routes

---

📊 Fitur Database (Revisi)

Tabel Utama

• akun → Data pengguna (owner, kasir)
• produk → Master data produk perhiasan
• foto → Kumpulan foto untuk tiap produk
• nampan → Organisasi tempat penyimpanan produk (display)
• item → Stok unit fisik dari produk (bisa ada banyak untuk 1 produk)
• transaksi → Data transaksi penjualan
• item_transaksi → Detail item yang dijual per transaksi
• sales → Data marketing/sales yang membawa pelanggan

(catatan: “brankas” nggak perlu tabel khusus, karena sudah diwakili item.id_nampan = null)

Relationships

// Produk bisa punya banyak foto
Produk -> hasMany -> Foto

// Produk bisa punya banyak item fisik
Produk -> hasMany -> Item

// Item bisa ada di satu nampan, atau null (brankas)
Item -> belongsTo -> Nampan

// Transaksi dicatat oleh satu kasir
Transaksi -> belongsTo -> Akun (kasir)

// Transaksi bisa melibatkan 0/1 sales
Transaksi -> belongsTo -> Sales

// Transaksi punya banyak item_transaksi
Transaksi -> hasMany -> ItemTransaksi

// Item_transaksi menghubungkan 1 transaksi dengan 1 item
ItemTransaksi -> belongsTo -> Item

---

📄 License

Lisensi dan kepemilikan atascource code adalah milik PT Teknologi Mulia Sejahtera Cemerlang.

---

Tim Internship TMSC 2025