create-nodemin-app 1.0.16

package/templates/HRMS_Mysql/frontend/src/pages/ForgotPassword.jsx

@@ -0,0 +1,66 @@
+import React, { useState } from 'react'
+import { useNavigate } from 'react-router-dom'
+import api from '../api'
+
+export default function ForgotPassword() {
+  const [email, setEmail] = useState('');
+  const [message, setMessage] = useState('');
+  const [error, setError] = useState('');
+  const navigate = useNavigate();
+
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    setError('');
+    setMessage('');
+    try {
+      const res = await api.post('/forgot-password', { email });
+      setMessage(`Temporary password sent: ${res.data.tempPassword}`);
+    } catch (err) {
+      setError(err.response?.data?.error || 'Email not found');
+    }
+  };
+
+  return (
+    <div className="min-h-screen bg-primary-50 flex items-center justify-center">
+      <div className="bg-white rounded-lg shadow-lg p-8 w-full max-w-md">
+        <div className="text-center mb-6">
+          <h1 className="text-2xl font-bold text-primary-700">Reset Password</h1>
+          <p className="text-primary-500">Enter your registered email</p>
+        </div>
+        <form onSubmit={handleSubmit} className="space-y-4">
+          {error && (
+            <div className="bg-red-100 border border-red-400 text-red-700 px-4 py-2 rounded text-sm">
+              {error}
+            </div>
+          )}
+          {message && (
+            <div className="bg-green-100 border border-green-400 text-green-700 px-4 py-2 rounded text-sm">
+              {message}
+            </div>
+          )}
+          <div>
+            <label className="block text-sm font-medium text-gray-700 mb-1">Email</label>
+            <input
+              type="email"
+              value={email}
+              onChange={(e) => setEmail(e.target.value)}
+              className="w-full px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent"
+              required
+            />
+          </div>
+          <button
+            type="submit"
+            className="w-full bg-primary-600 text-white py-2 rounded hover:bg-primary-500 transition-colors"
+          >
+            Send Temporary Password
+          </button>
+        </form>
+        <div className="mt-4 text-center">
+          <a href="/login" className="text-sm text-primary-600 hover:underline">
+            Back to Login
+          </a>
+        </div>
+      </div>
+    </div>
+  );
+}

package/templates/HRMS_Mysql/frontend/src/pages/Login.jsx

@@ -0,0 +1,79 @@
+import React, { useState } from 'react'
+import { useNavigate, Link } from 'react-router-dom'
+import api from '../api'
+
+export default function Login() {
+  const [username, setUsername] = useState('');
+  const [password, setPassword] = useState('');
+  const [error, setError] = useState('');
+  const navigate = useNavigate();
+
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    setError('');
+    try {
+      const res = await api.post('/login', { username, password });
+      if (res.data.success) {
+        navigate('/');
+      }
+    } catch (err) {
+      setError(err.response?.data?.error || 'Login failed');
+    }
+  };
+
+  return (
+    <div className="min-h-screen bg-primary-50 flex items-center justify-center">
+      <div className="bg-white rounded-lg shadow-lg p-8 w-full max-w-md">
+        <div className="text-center mb-6">
+          <h1 className="text-2xl font-bold text-primary-700">HRMS</h1>
+          <p className="text-primary-500">DAB Enterprise LTD</p>
+        </div>
+        <form onSubmit={handleSubmit} className="space-y-4">
+          {error && (
+            <div className="bg-red-100 border border-red-400 text-red-700 px-4 py-2 rounded text-sm">
+              {error}
+            </div>
+          )}
+          <div>
+            <label className="block text-sm font-medium text-gray-700 mb-1">Username</label>
+            <input
+              type="text"
+              value={username}
+              onChange={(e) => setUsername(e.target.value)}
+              className="w-full px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent"
+              required
+            />
+          </div>
+          <div>
+            <label className="block text-sm font-medium text-gray-700 mb-1">Password</label>
+            <input
+              type="password"
+              value={password}
+              onChange={(e) => setPassword(e.target.value)}
+              className="w-full px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent"
+              required
+            />
+          </div>
+          <button
+            type="submit"
+            className="w-full bg-primary-600 text-white py-2 rounded hover:bg-primary-500 transition-colors"
+          >
+            Login
+          </button>
+        </form>
+        <div className="mt-4 text-center space-y-2">
+          <div>
+            <Link to="/forgot-password" className="text-sm text-primary-600 hover:underline">
+              Forgot Password?
+            </Link>
+          </div>
+          <div>
+            <Link to="/register" className="text-sm text-primary-600 hover:underline">
+              Don't have an account? Register
+            </Link>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}

package/templates/HRMS_Mysql/frontend/src/pages/Positions.jsx

@@ -0,0 +1,109 @@
+import React, { useState, useEffect } from 'react'
+import api from '../api'
+
+export default function Positions() {
+  const [positions, setPositions] = useState([]);
+  const [form, setForm] = useState({ PosName: '', RequiredQualification: '' });
+  const [editing, setEditing] = useState(null);
+  const [showForm, setShowForm] = useState(false);
+
+  useEffect(() => { load(); }, []);
+
+  const load = async () => {
+    const res = await api.get('/positions');
+    setPositions(res.data);
+  };
+
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    if (editing) {
+      await api.put(`/positions/${editing}`, form);
+    } else {
+      await api.post('/positions', form);
+    }
+    setForm({ PosName: '', RequiredQualification: '' });
+    setEditing(null);
+    setShowForm(false);
+    load();
+  };
+
+  const handleEdit = (pos) => {
+    setForm({ PosName: pos.PosName, RequiredQualification: pos.RequiredQualification });
+    setEditing(pos.PosID);
+    setShowForm(true);
+  };
+
+  const handleDelete = async (id) => {
+    if (confirm('Delete this position?')) {
+      await api.delete(`/positions/${id}`);
+      load();
+    }
+  };
+
+  return (
+    <div>
+      <div className="flex justify-between items-center mb-6">
+        <h1 className="text-2xl font-bold text-primary-800">Positions</h1>
+        <button onClick={() => { setShowForm(true); setEditing(null); setForm({ PosName: '', RequiredQualification: '' }); }}
+          className="bg-primary-600 text-white px-4 py-2 rounded hover:bg-primary-500 transition-colors">
+          Add Position
+        </button>
+      </div>
+
+      {showForm && (
+        <form onSubmit={handleSubmit} className="bg-white rounded-lg shadow p-4 mb-6">
+          <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
+            <div>
+              <label className="block text-sm font-medium text-gray-700 mb-1">Position Name</label>
+              <input type="text" value={form.PosName}
+                onChange={(e) => setForm({ ...form, PosName: e.target.value })}
+                className="w-full px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-primary-500" required />
+            </div>
+            <div>
+              <label className="block text-sm font-medium text-gray-700 mb-1">Required Qualification</label>
+              <input type="text" value={form.RequiredQualification}
+                onChange={(e) => setForm({ ...form, RequiredQualification: e.target.value })}
+                className="w-full px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-primary-500" />
+            </div>
+          </div>
+          <div className="mt-4 space-x-2">
+            <button type="submit" className="bg-primary-600 text-white px-4 py-2 rounded hover:bg-primary-500">
+              {editing ? 'Update' : 'Save'}
+            </button>
+            <button type="button" onClick={() => setShowForm(false)}
+              className="bg-gray-400 text-white px-4 py-2 rounded hover:bg-gray-500">Cancel</button>
+          </div>
+        </form>
+      )}
+
+      <div className="bg-white rounded-lg shadow overflow-hidden">
+        <table className="w-full">
+          <thead className="bg-primary-600 text-white">
+            <tr>
+              <th className="px-4 py-3 text-left">ID</th>
+              <th className="px-4 py-3 text-left">Position Name</th>
+              <th className="px-4 py-3 text-left">Required Qualification</th>
+              <th className="px-4 py-3 text-right">Actions</th>
+            </tr>
+          </thead>
+          <tbody>
+            {positions.map(pos => (
+              <tr key={pos.PosID} className="border-t hover:bg-primary-50">
+                <td className="px-4 py-3">{pos.PosID}</td>
+                <td className="px-4 py-3">{pos.PosName}</td>
+                <td className="px-4 py-3">{pos.RequiredQualification || '-'}</td>
+                <td className="px-4 py-3 text-right space-x-2">
+                  <button onClick={() => handleEdit(pos)} className="text-primary-600 hover:underline text-sm">Edit</button>
+                  <button onClick={() => handleDelete(pos.PosID)} className="text-red-600 hover:underline text-sm">Delete</button>
+                </td>
+              </tr>
+            ))}
+            {positions.length === 0 && (
+              <tr><td colSpan="4" className="px-4 py-8 text-center text-gray-500">No positions found</td></tr>
+            )}
+          </tbody>
+        </table>
+      </div>
+    </div>
+  );
+}

package/templates/HRMS_Mysql/frontend/src/pages/Register.jsx

@@ -0,0 +1,95 @@
+import React, { useState } from 'react'
+import { useNavigate, Link } from 'react-router-dom'
+import api from '../api'
+
+export default function Register() {
+  const [form, setForm] = useState({ firstName: '', lastName: '', email: '', username: '', password: '' });
+  const [error, setError] = useState('');
+  const navigate = useNavigate();
+
+  const handleChange = (e) => setForm({ ...form, [e.target.name]: e.target.value });
+
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    setError('');
+    try {
+      const res = await api.post('/register', form);
+      if (res.data.success) {
+        navigate('/');
+      }
+    } catch (err) {
+      setError(err.response?.data?.error || 'Registration failed');
+    }
+  };
+
+  return (
+    <div className="min-h-screen bg-primary-50 flex items-center justify-center">
+      <div className="bg-white rounded-lg shadow-lg p-8 w-full max-w-md">
+        <div className="text-center mb-6">
+          <h1 className="text-2xl font-bold text-primary-700">HRMS</h1>
+          <p className="text-primary-500">Create Account</p>
+        </div>
+        <form onSubmit={handleSubmit} className="space-y-4">
+          {error && (
+            <div className="bg-red-100 border border-red-400 text-red-700 px-4 py-2 rounded text-sm">
+              {error}
+            </div>
+          )}
+          <div className="grid grid-cols-2 gap-4">
+            <div>
+              <label className="block text-sm font-medium text-gray-700 mb-1">First Name</label>
+              <input
+                type="text" name="firstName" value={form.firstName} onChange={handleChange}
+                className="w-full px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent"
+                required
+              />
+            </div>
+            <div>
+              <label className="block text-sm font-medium text-gray-700 mb-1">Last Name</label>
+              <input
+                type="text" name="lastName" value={form.lastName} onChange={handleChange}
+                className="w-full px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent"
+                required
+              />
+            </div>
+          </div>
+          <div>
+            <label className="block text-sm font-medium text-gray-700 mb-1">Email</label>
+            <input
+              type="email" name="email" value={form.email} onChange={handleChange}
+              className="w-full px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent"
+              required
+            />
+          </div>
+          <div>
+            <label className="block text-sm font-medium text-gray-700 mb-1">Username</label>
+            <input
+              type="text" name="username" value={form.username} onChange={handleChange}
+              className="w-full px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent"
+              required
+            />
+          </div>
+          <div>
+            <label className="block text-sm font-medium text-gray-700 mb-1">Password</label>
+            <input
+              type="password" name="password" value={form.password} onChange={handleChange}
+              className="w-full px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent"
+              required
+            />
+          </div>
+          <button
+            type="submit"
+            className="w-full bg-primary-600 text-white py-2 rounded hover:bg-primary-500 transition-colors"
+          >
+            Register
+          </button>
+        </form>
+        <div className="mt-4 text-center">
+          <Link to="/login" className="text-sm text-primary-600 hover:underline">
+            Already have an account? Login
+          </Link>
+        </div>
+      </div>
+    </div>
+  );
+}

package/templates/HRMS_Mysql/frontend/src/pages/Users.jsx

@@ -0,0 +1,133 @@
+import React, { useState, useEffect } from 'react'
+import api from '../api'
+
+export default function Users() {
+  const [users, setUsers] = useState([]);
+  const [employees, setEmployees] = useState([]);
+  const [form, setForm] = useState({ EmpID: '', UserName: '', Password: '' });
+  const [editing, setEditing] = useState(null);
+  const [showForm, setShowForm] = useState(false);
+
+  useEffect(() => {
+    load();
+    api.get('/employees').then(r => setEmployees(r.data));
+  }, []);
+
+  const load = async () => {
+    const res = await api.get('/users');
+    setUsers(res.data);
+  };
+
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    if (editing) {
+      await api.put(`/users/${editing}`, { UserName: form.UserName, Password: form.Password || undefined });
+    } else {
+      await api.post('/users', form);
+    }
+    setForm({ EmpID: '', UserName: '', Password: '' });
+    setEditing(null);
+    setShowForm(false);
+    load();
+  };
+
+  const handleEdit = (user) => {
+    setForm({ EmpID: user.EmpID, UserName: user.UserName, Password: '' });
+    setEditing(user.UserID);
+    setShowForm(true);
+  };
+
+  const handleDelete = async (id) => {
+    if (confirm('Delete this user?')) {
+      await api.delete(`/users/${id}`);
+      load();
+    }
+  };
+
+  const availableEmployees = employees.filter(emp =>
+    !users.some(u => u.EmpID === emp.EmpID && u.UserID !== editing)
+  );
+
+  return (
+    <div>
+      <div className="flex justify-between items-center mb-6">
+        <h1 className="text-2xl font-bold text-primary-800">Users</h1>
+        <button onClick={() => { setShowForm(true); setEditing(null); setForm({ EmpID: '', UserName: '', Password: '' }); }}
+          className="bg-primary-600 text-white px-4 py-2 rounded hover:bg-primary-500 transition-colors">
+          Add User
+        </button>
+      </div>
+
+      {showForm && (
+        <form onSubmit={handleSubmit} className="bg-white rounded-lg shadow p-4 mb-6">
+          <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
+            <div>
+              <label className="block text-sm font-medium text-gray-700 mb-1">Employee *</label>
+              <select value={form.EmpID}
+                onChange={(e) => setForm({ ...form, EmpID: e.target.value })}
+                className="w-full px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-primary-500" required>
+                <option value="">Select Employee</option>
+                {(editing ? employees : availableEmployees).map(emp => (
+                  <option key={emp.EmpID} value={emp.EmpID}>{emp.EmpFirstName} {emp.EmpLastName} - {emp.EmpEmail}</option>
+                ))}
+              </select>
+            </div>
+            <div>
+              <label className="block text-sm font-medium text-gray-700 mb-1">Username *</label>
+              <input type="text" value={form.UserName}
+                onChange={(e) => setForm({ ...form, UserName: e.target.value })}
+                className="w-full px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-primary-500" required />
+            </div>
+            <div>
+              <label className="block text-sm font-medium text-gray-700 mb-1">
+                Password {editing ? '(leave blank to keep current)' : '*'}
+              </label>
+              <input type="password" value={form.Password}
+                onChange={(e) => setForm({ ...form, Password: e.target.value })}
+                className="w-full px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-primary-500"
+                required={!editing} />
+            </div>
+          </div>
+          <div className="mt-4 space-x-2">
+            <button type="submit" className="bg-primary-600 text-white px-4 py-2 rounded hover:bg-primary-500">
+              {editing ? 'Update' : 'Save'}
+            </button>
+            <button type="button" onClick={() => setShowForm(false)}
+              className="bg-gray-400 text-white px-4 py-2 rounded hover:bg-gray-500">Cancel</button>
+          </div>
+        </form>
+      )}
+
+      <div className="bg-white rounded-lg shadow overflow-hidden">
+        <table className="w-full">
+          <thead className="bg-primary-600 text-white">
+            <tr>
+              <th className="px-4 py-3 text-left">ID</th>
+              <th className="px-4 py-3 text-left">Username</th>
+              <th className="px-4 py-3 text-left">Employee Name</th>
+              <th className="px-4 py-3 text-left">Email</th>
+              <th className="px-4 py-3 text-right">Actions</th>
+            </tr>
+          </thead>
+          <tbody>
+            {users.map(user => (
+              <tr key={user.UserID} className="border-t hover:bg-primary-50">
+                <td className="px-4 py-3">{user.UserID}</td>
+                <td className="px-4 py-3">{user.UserName}</td>
+                <td className="px-4 py-3">{user.EmpFirstName} {user.EmpLastName}</td>
+                <td className="px-4 py-3">{user.EmpEmail}</td>
+                <td className="px-4 py-3 text-right space-x-2">
+                  <button onClick={() => handleEdit(user)} className="text-primary-600 hover:underline text-sm">Edit</button>
+                  <button onClick={() => handleDelete(user.UserID)} className="text-red-600 hover:underline text-sm">Delete</button>
+                </td>
+              </tr>
+            ))}
+            {users.length === 0 && (
+              <tr><td colSpan="5" className="px-4 py-8 text-center text-gray-500">No users found</td></tr>
+            )}
+          </tbody>
+        </table>
+      </div>
+    </div>
+  );
+}

package/templates/HRMS_Mysql/frontend/tailwind.config.js

@@ -0,0 +1,26 @@
+/** @type {import('tailwindcss').Config} */
+export default {
+  content: [
+    "./index.html",
+    "./src/**/*.{js,ts,jsx,tsx}",
+  ],
+  theme: {
+    extend: {
+      colors: {
+        primary: {
+          50: '#fdf8f0',
+          100: '#f9edd6',
+          200: '#f2d9a8',
+          300: '#e9c070',
+          400: '#e0a645',
+          500: '#d48f2a',
+          600: '#b87322',
+          700: '#96571d',
+          800: '#7a4720',
+          900: '#653c1d',
+        }
+      }
+    },
+  },
+  plugins: [],
+}

package/templates/HRMS_Mysql/frontend/vite.config.js

@@ -0,0 +1,15 @@
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
+
+export default defineConfig({
+  plugins: [react()],
+  server: {
+    port: 5173,
+    proxy: {
+      '/api': {
+        target: 'http://localhost:5000',
+        changeOrigin: true
+      }
+    }
+  }
+})

package/templates/HRMS_Mysql/hrms_schema.sql

@@ -0,0 +1,57 @@
+-- HRMS Database Schema
+-- Database: HRMS
+-- Entity Relationship Diagram (ERD):
+--
+-- Department 1---* Employee *---1 Position
+-- Employee 1---1 Users
+--
+-- Tables:
+--   Department (DepartID INT PK, DepartName VARCHAR)
+--   Position (PosID INT PK, PosName VARCHAR, RequiredQualification VARCHAR)
+--   Employee (EmpID INT PK, EmpFirstName, EmpLastName, EmpGender, EmpDateOfBirth,
+--             EmpEmail, EmpTelephone, EmpAddress, EmpHireDate, EmpStatus,
+--             DepartID FK, PosID FK)
+--   Users (UserID INT PK, EmpID FK UNIQUE, UserName, Password)
+
+CREATE DATABASE IF NOT EXISTS HRMS;
+USE HRMS;
+
+-- Department table
+CREATE TABLE IF NOT EXISTS Department (
+    DepartID INT AUTO_INCREMENT PRIMARY KEY,
+    DepartName VARCHAR(100) NOT NULL
+) ENGINE=InnoDB;
+
+-- Position table
+CREATE TABLE IF NOT EXISTS Positionemp(
+    PosID INT AUTO_INCREMENT PRIMARY KEY,
+    PosName VARCHAR(100) NOT NULL,
+    RequiredQualification VARCHAR(255)
+) ENGINE=InnoDB;
+
+-- Employee table
+CREATE TABLE IF NOT EXISTS Employee (
+    EmpID INT AUTO_INCREMENT PRIMARY KEY,
+    EmpFirstName VARCHAR(100) NOT NULL,
+    EmpLastName VARCHAR(100) NOT NULL,
+    EmpGender VARCHAR(10),
+    EmpDateOfBirth DATE,
+    EmpEmail VARCHAR(100) UNIQUE,
+    EmpTelephone VARCHAR(20),
+    EmpAddress TEXT,
+    EmpHireDate DATE,
+    EmpStatus ENUM('on leave','left','blacklisted','deceased','on mission') DEFAULT 'on leave',
+    DepartID INT,
+    PosID INT,
+    FOREIGN KEY (DepartID) REFERENCES Department(DepartID) ON DELETE SET NULL,
+    FOREIGN KEY (PosID) REFERENCES Positionemp(PosID) ON DELETE SET NULL
+) ENGINE=InnoDB;
+
+-- Users table
+CREATE TABLE IF NOT EXISTS Users (
+    UserID INT AUTO_INCREMENT PRIMARY KEY,
+    EmpID INT UNIQUE,
+    UserName VARCHAR(50) UNIQUE NOT NULL,
+    Password VARCHAR(255) NOT NULL,
+    FOREIGN KEY (EmpID) REFERENCES Employee(EmpID) ON DELETE CASCADE
+) ENGINE=InnoDB;