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

0 stars

Watchers

0 watching

Forks

Releases

No releases published

Packages

 
 
 

Contributors