Skip to content

hellogunawan99/sawit-web

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Palm Oil Vue.js TypeScript Node.js PostgreSQL

🌿 Sawit-Web

Enterprise Palm Oil Harvest Management System
Complete full-stack solution for managing palm oil harvesting operations, worker management, payroll calculations, and village cooperative (BUMDES) data.

FeaturesTech StackQuick StartAPIModulesDocs


🌟 Features

🎯 Core Modules

Module Description
📊 Dashboard Real-time harvest statistics, analytics & pricing
🌴 Panen Daily palm oil harvest data management
💰 Payroll Farmer payment calculations with deductions
👷 Tenaga Kerja Worker & team management

🚀 Additional Modules

Module Description
💳 Simpan Pinjam Savings & loan management
🧪 Analisa Nutrisi Palm tree nutrition analysis (NPK)
📈 Laporan Report generation & management
🏢 Data Bumdes Village cooperative financial data

⚡ Technical Highlights

  • 🔐 JWT Authentication with role-based access control
  • 📱 Mobile-First responsive design
  • 🐳 Docker Ready one-command deployment
  • Hot Reload development experience
  • 🗄️ Prisma ORM database management
  • 🎨 Modern UI with Vue 3 Composition API

🛠️ Tech Stack

Frontend

Vue.js TypeScript Vite Vue Router Pinia Axios FontAwesome

Backend

Node.js Express TypeScript Prisma JWT bcrypt Zod

Database & DevOps

PostgreSQL Docker Docker Compose

🚀 Quick Start

🐳 Docker (Recommended)

# Clone the repository
git clone https://github.com/YOUR_USERNAME/sawit-web.git
cd sawit-web

# Start all services with one command
docker-compose up -d

# View logs
docker-compose logs -f

Access the application:


💻 Manual Setup

Prerequisites

  • Node.js 20+
  • PostgreSQL 16+
  • npm or yarn

Backend Setup

# Navigate to backend
cd backend

# Install dependencies
npm install

# Generate Prisma client
npx prisma generate

# Push schema to database
npx prisma db push

# Seed with sample data
npm run db:seed

# Start development server
npm run dev
# Server runs on http://localhost:3000

Frontend Setup

# Navigate to root directory
cd ..

# Install dependencies
npm install

# Start development server
npm run dev
# App runs on http://localhost:5000

🔐 Default Credentials

Application Users

Role Email Password
👑 Admin admin@sawit.com password123
📋 Manager manager@sawit.com password123

Database

Username:  sawit_user
Password:  sawit_password
Database:  sawit
Port:      5432

📡 API Documentation

Base URL

http://localhost:3030/api

Authentication

All endpoints (except login) require JWT token:

Authorization: Bearer <your_jwt_token>

Core Endpoints

Authentication

Method Endpoint Description
POST /api/auth/login 🔐 User login
POST /api/auth/register 📝 Register new user
GET /api/auth/me 👤 Get current user

Dashboard

Method Endpoint Description
GET /api/dashboard/stats 📊 Get statistics
GET /api/dashboard/harga 💵 Get TBS prices

Farmers (Petani)

Method Endpoint Description
GET /api/petani 👨‍🌾 List all farmers
GET /api/petani/:id 🔍 Get farmer details
POST /api/petani ➕ Create farmer
PUT /api/petani/:id ✏️ Update farmer
DELETE /api/petani/:id 🗑️ Delete farmer

Harvest (Panen)

Method Endpoint Description
GET /api/panen 🌴 List harvests
GET /api/panen/stats 📈 Harvest statistics
POST /api/panen ➕ Record harvest

Payroll

Method Endpoint Description
GET /api/payroll 💰 List payroll
POST /api/payroll/calculate 🧮 Calculate payroll
PUT /api/payroll/:id/status ✅ Update status

Workers (Tenaga Kerja)

Method Endpoint Description
GET /api/tenaga-kerja 👷 List workers
GET /api/tenaga-kerja/team 👥 List teams

Example API Call

# Login to get JWT token
curl -X POST http://localhost:3030/api/auth/login \
  -H "Content-Type: application/json" \
  -d '{"email":"admin@sawit.com","password":"password123"}'

# Use token to fetch dashboard stats
curl http://localhost:3030/api/dashboard/stats \
  -H "Authorization: Bearer <your_token>"

📂 Project Structure

sawit-web/
├── 🌐 frontend/                    # Vue 3 web application
│   ├── src/
│   │   ├── views/               # Page components
│   │   ├── components/          # Reusable components
│   │   ├── router/             # Vue Router config
│   │   ├── stores/             # Pinia state stores
│   │   ├── utils/              # API client & helpers
│   │   └── assets/             # Styles & images
│   ├── public/                  # Static assets
│   ├── vite.config.ts          # Vite configuration
│   └── package.json
│
├── ⚙️ backend/                    # Node.js Express API
│   ├── src/
│   │   ├── config/            # Database config
│   │   ├── controllers/       # HTTP request handlers
│   │   ├── services/          # Business logic
│   │   ├── routes/           # API routes
│   │   ├── middleware/       # Auth & validation
│   │   └── utils/            # JWT & helpers
│   ├── prisma/
│   │   ├── schema.prisma     # Database schema
│   │   └── seed.ts           # Sample data
│   ├── package.json
│   └── tsconfig.json
│
├── 🐳 docker/                    # Docker configurations
│   ├── backend/                # Backend Dockerfile
│   ├── frontend/              # Frontend Dockerfile
│   └── health/                # Health check page
│
├── 📄 docker-compose.yml        # Docker orchestration
├── 📖 README.md               # This file
└── 📚 docs/                   # Documentation

🎨 Modules Overview

📊 Dashboard

Real-time analytics and statistics:

  • Total tonase (harvest weight)
  • Total janjang (fruit bunches)
  • BJR (Fruit Weight Ratio)
  • Current TBS prices
  • Monthly comparisons
  • Interactive charts

🌴 Panen (Harvest)

Harvest data management:

  • Record daily harvests
  • Track farmer contributions
  • Monitor quality ratings
  • Faktur (invoice) management
  • Team assignment
  • Date-based filtering

💰 Payroll

Automated payment calculations:

  • Gross Kotor = Tonase × TBS Price
  • Deductions:
    • Operational costs
    • Fertilizer installments
    • Loan installments
  • Gross Bersih = Gross Kotor - All Deductions
  • Status tracking: Pending → Approved → Paid

👷 Tenaga Kerja (Workers)

Worker & team management:

  • Farmer land data
  • Team organization
  • Service history
  • Insurance tracking
  • Position management (Mandor/Pekerja Lapang)

💳 Simpan Pinjam (Savings & Loans)

Cooperative financial services:

  • Mandatory savings
  • Loan applications
  • Interest calculation
  • Tenor management
  • Status tracking (active/lunas/batal)

🧪 Analisa Nutrisi (Nutrition Analysis)

Palm tree health monitoring:

  • NPK analysis (Nitrogen, Phosphorus, Potassium)
  • Magnesium levels
  • Auto status determination:
    • ✅ Optimal
    • ⚠️ Kurang (Deficient)
    • ⚠️ Berlebih (Excess)
  • Recommendations

📈 Laporan (Reports)

Report generation:

  • Period-based reports
  • Multiple report types
  • Status tracking
  • Export capabilities

🏢 Data Bumdes

Village cooperative management:

  • Asset tracking
  • Liability management
  • Equity calculation
  • Income & expense tracking
  • Financial summaries

🐳 Docker Services

Service Port Description
🌐 Frontend 5010 (host) / 5000 (container) Vue.js web application
⚙️ Backend 3030 (host) / 3000 (container) Express REST API
💚 Health 3031 Service health check
🗄️ PostgreSQL 5432 Database server
🔧 Prisma Studio 5555 Database management UI

📱 Mobile Responsiveness

The application is fully mobile-optimized:

✨ Features

  • 📱 Mobile-first design approach
  • 🍔 Hamburger menu for navigation
  • 📐 Responsive tables with horizontal scroll
  • 👆 Touch-friendly buttons (44px minimum)
  • 📲 Safe area support for notched phones
  • 🎬 Smooth animations and transitions

📐 Breakpoints

Screen Width Layout
Desktop > 960px Full sidebar
Tablet 768-960px Hamburger menu
Mobile < 768px Stacked layout
Small Phone < 480px Compact view

🧪 Testing

Backend Tests

cd backend
npm test

Frontend Tests

npm test

Linting

# Lint code
npm run lint

# Format code
npm run format

Type Checking

npm run type-check

🚢 Deployment

Production Docker

# Build production images
docker-compose -f docker-compose.yml build

# Run in production
docker-compose -f docker-compose.yml up -d

Cloud Platforms

Service Recommended Platform
Frontend Vercel, Netlify
Backend Railway, Render
Database Supabase, Neon, Railway
Images Docker Hub, GHCR

🤝 Contributing

Contributions are welcome! 🎉

  1. Fork the repository
  2. Create your feature branch:
    git checkout -b feature/AmazingFeature
  3. Commit your changes:
    git commit -m 'Add some AmazingFeature'
  4. Push to the branch:
    git push origin feature/AmazingFeature
  5. Open a Pull Request

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.


🙏 Acknowledgments

  • 🌴 Built for palm oil farmers and cooperatives
  • 💚 Designed with love for the agricultural community
  • 🚀 Powered by modern web technologies

Built with ❤️ for palm oil farmers and cooperatives
Made with Vue.js, Node.js, PostgreSQL, and Docker

Palm Oil

About

No description or website provided.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors