Compare commits
22 Commits
main
...
c1d49689da
| Author | SHA1 | Date | |
|---|---|---|---|
| c1d49689da | |||
| 95ef139843 | |||
| 2735d46552 | |||
| 0dd988730f | |||
| 50adc50a24 | |||
| 639a7b7eab | |||
| 07b4af5f24 | |||
| 6fc2e6703b | |||
| 764f6d1100 | |||
| 225d16c1c9 | |||
| aada481c0a | |||
| c767e65819 | |||
| 8e35821344 | |||
|
|
747a68832e | ||
|
|
e828aa660b | ||
|
|
9b6307eabe | ||
|
|
490994d323 | ||
|
|
b5120657a9 | ||
|
|
5228ed3fc0 | ||
|
|
51d37fc65a | ||
|
|
92f458e59b | ||
|
|
33ea8de17e |
3
.gitignore
vendored
3
.gitignore
vendored
@@ -45,3 +45,6 @@ next-env.d.ts
|
||||
|
||||
# kosz
|
||||
/kosz
|
||||
|
||||
# uploads
|
||||
/public/uploads
|
||||
201
DOCKER_GIT_DEPLOYMENT.md
Normal file
201
DOCKER_GIT_DEPLOYMENT.md
Normal file
@@ -0,0 +1,201 @@
|
||||
# Docker Git Deployment Guide
|
||||
|
||||
This project now supports deploying directly from a Git repository using Docker. This is useful for automated deployments and CI/CD pipelines.
|
||||
|
||||
## File Structure
|
||||
|
||||
- `Dockerfile` - Production dockerfile that supports Git deployment
|
||||
- `Dockerfile.dev` - Development dockerfile
|
||||
- `docker-compose.yml` - Development environment
|
||||
- `docker-compose.prod.yml` - Production environment with Git support
|
||||
- `deploy.sh` / `deploy.bat` - Deployment scripts
|
||||
|
||||
## Deployment Options
|
||||
|
||||
### 1. Deploy from Local Files (Default)
|
||||
|
||||
```bash
|
||||
# Development
|
||||
docker-compose up
|
||||
|
||||
# Production
|
||||
docker-compose -f docker-compose.prod.yml up --build
|
||||
```
|
||||
|
||||
**Note**: Both development and production Docker builds automatically create the default admin account.
|
||||
|
||||
### 2. Deploy from Git Repository
|
||||
|
||||
#### Using Environment Variables
|
||||
|
||||
Create a `.env` file with:
|
||||
```env
|
||||
GIT_REPO_URL=https://git.wastpol.pl/Admin/panel.git
|
||||
GIT_BRANCH=ui-fix
|
||||
GIT_COMMIT=abc123 # Optional: specific commit hash
|
||||
```
|
||||
|
||||
Then run:
|
||||
```bash
|
||||
docker-compose -f docker-compose.prod.yml up --build
|
||||
```
|
||||
|
||||
#### Using Build Arguments
|
||||
|
||||
```bash
|
||||
docker build \
|
||||
--build-arg GIT_REPO_URL=https://git.wastpol.pl/Admin/panel.git \
|
||||
--build-arg GIT_BRANCH=ui-fix \
|
||||
--build-arg GIT_COMMIT=abc123 \
|
||||
-t your-app .
|
||||
```
|
||||
|
||||
#### Using Deployment Scripts
|
||||
|
||||
```bash
|
||||
# Linux/Mac
|
||||
./deploy.sh https://git.wastpol.pl/Admin/panel.git ui-fix abc123
|
||||
|
||||
# Windows
|
||||
deploy.bat https://git.wastpol.pl/Admin/panel.git ui-fix abc123
|
||||
```
|
||||
|
||||
## Private Repositories
|
||||
|
||||
For private repositories, you have several options:
|
||||
|
||||
### 1. SSH Keys (Recommended for development)
|
||||
```bash
|
||||
# Build with SSH URL
|
||||
docker build --build-arg GIT_REPO_URL=git@git.wastpol.pl:Admin/panel.git .
|
||||
```
|
||||
|
||||
### 2. Personal Access Token
|
||||
```bash
|
||||
# Build with token in URL
|
||||
docker build --build-arg GIT_REPO_URL=https://username:token@git.wastpol.pl/Admin/panel.git .
|
||||
```
|
||||
|
||||
### 3. Docker Secrets (Recommended for production)
|
||||
```yaml
|
||||
# In docker-compose.prod.yml
|
||||
services:
|
||||
app:
|
||||
build:
|
||||
context: .
|
||||
args:
|
||||
- GIT_REPO_URL=https://git.wastpol.pl/Admin/panel.git
|
||||
secrets:
|
||||
- git_token
|
||||
secrets:
|
||||
git_token:
|
||||
file: ./git_token.txt
|
||||
```
|
||||
|
||||
## CI/CD Integration
|
||||
|
||||
### GitHub Actions Example
|
||||
|
||||
```yaml
|
||||
name: Deploy
|
||||
on:
|
||||
push:
|
||||
branches: [main]
|
||||
|
||||
jobs:
|
||||
deploy:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Deploy to server
|
||||
run: |
|
||||
docker build \
|
||||
--build-arg GIT_REPO_URL=${{ github.repository }} \
|
||||
--build-arg GIT_COMMIT=${{ github.sha }} \
|
||||
-t my-app .
|
||||
docker run -d -p 3000:3000 my-app
|
||||
```
|
||||
|
||||
### Docker Compose in CI/CD
|
||||
|
||||
```bash
|
||||
# Set environment variables in your CI/CD system
|
||||
export GIT_REPO_URL="https://git.wastpol.pl/Admin/panel.git"
|
||||
export GIT_BRANCH="ui-fix"
|
||||
export GIT_COMMIT="$CI_COMMIT_SHA"
|
||||
|
||||
# Deploy
|
||||
docker-compose -f docker-compose.prod.yml up --build -d
|
||||
```
|
||||
|
||||
## Build Process
|
||||
|
||||
When `GIT_REPO_URL` is provided:
|
||||
1. Git repository is cloned into the container
|
||||
2. If `GIT_COMMIT` is specified, checkout that specific commit
|
||||
3. Install dependencies from the repository's package.json
|
||||
4. Build the application
|
||||
5. **Admin account is created when container starts (not during build)**
|
||||
6. Start the production server
|
||||
|
||||
When `GIT_REPO_URL` is not provided:
|
||||
1. Copy local files into the container
|
||||
2. Install dependencies
|
||||
3. Build the application
|
||||
4. **Admin account is created when container starts (not during build)**
|
||||
5. Start the production server
|
||||
|
||||
## Default Admin Account
|
||||
|
||||
Both development and production Docker containers automatically create a default admin account **when the container starts** (not during build). This ensures the database is properly persisted in mounted volumes.
|
||||
|
||||
- **Email**: `admin@localhost.com`
|
||||
- **Password**: `admin123456`
|
||||
- **Role**: `admin`
|
||||
|
||||
⚠️ **Important Security Note**: Please change the default password immediately after your first login!
|
||||
|
||||
### Manual Admin Account Creation
|
||||
|
||||
If you need to create the admin account manually (for development or testing):
|
||||
|
||||
```bash
|
||||
# Using npm script
|
||||
npm run create-admin
|
||||
|
||||
# Or directly
|
||||
node scripts/create-admin.js
|
||||
```
|
||||
|
||||
The script will skip creation if an admin account already exists.
|
||||
|
||||
## Environment Variables
|
||||
|
||||
- `GIT_REPO_URL` - Git repository URL (HTTPS or SSH)
|
||||
- `GIT_BRANCH` - Git branch to checkout (default: main)
|
||||
- `GIT_COMMIT` - Specific commit hash to checkout (optional)
|
||||
- `NODE_ENV` - Node.js environment (development/production)
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
### Git Authentication Issues
|
||||
- Ensure your Git credentials are properly configured
|
||||
- For HTTPS, use personal access tokens instead of passwords
|
||||
- For SSH, ensure SSH keys are properly mounted or available
|
||||
|
||||
### Build Failures
|
||||
- Check if the repository URL is accessible
|
||||
- Verify the branch name exists
|
||||
- Ensure the commit hash is valid
|
||||
- Check Docker build logs for specific errors
|
||||
|
||||
### Permission Issues
|
||||
- Ensure the Docker daemon has network access
|
||||
- For private repositories, verify authentication tokens/keys
|
||||
|
||||
### Admin Account Issues
|
||||
- If admin creation fails during startup, check database initialization
|
||||
- Ensure the `./data` directory is writable on the host
|
||||
- Database files are persisted in the mounted `./data` volume
|
||||
- Admin account is created on container startup, not during build
|
||||
- If admin already exists, the script will skip creation (this is normal)
|
||||
- To recreate admin account, delete the database file in `./data/` and restart the container
|
||||
31
Dockerfile
31
Dockerfile
@@ -1,20 +1,43 @@
|
||||
# Use Node.js 22.11.0 as the base image
|
||||
FROM node:22.11.0
|
||||
|
||||
# Install git
|
||||
RUN apt-get update && apt-get install -y git && rm -rf /var/lib/apt/lists/*
|
||||
|
||||
# Set the working directory
|
||||
WORKDIR /app
|
||||
|
||||
# Copy package.json and package-lock.json (if any)
|
||||
# If building from a git repository, clone it
|
||||
# This will be used when the build context doesn't include source files
|
||||
ARG GIT_REPO_URL
|
||||
ARG GIT_BRANCH=main
|
||||
ARG GIT_COMMIT
|
||||
|
||||
# If GIT_REPO_URL is provided, clone the repo; otherwise copy local files
|
||||
RUN if [ -n "$GIT_REPO_URL" ]; then \
|
||||
git clone --branch ${GIT_BRANCH} ${GIT_REPO_URL} . && \
|
||||
if [ -n "$GIT_COMMIT" ]; then git checkout ${GIT_COMMIT}; fi; \
|
||||
fi
|
||||
|
||||
# Copy package.json and package-lock.json (if not cloned from git)
|
||||
COPY package*.json ./
|
||||
|
||||
# Install dependencies
|
||||
RUN npm install
|
||||
|
||||
# Copy the rest of the app
|
||||
# Copy the rest of the app (if not cloned from git)
|
||||
RUN if [ -z "$GIT_REPO_URL" ]; then echo "Copying local files..."; fi
|
||||
COPY . .
|
||||
|
||||
# Build the application for production
|
||||
RUN npm run build
|
||||
|
||||
# Copy the entrypoint script
|
||||
COPY docker-entrypoint.sh /docker-entrypoint.sh
|
||||
RUN chmod +x /docker-entrypoint.sh
|
||||
|
||||
# Expose the default Next.js port
|
||||
EXPOSE 3000
|
||||
|
||||
# Start the dev server
|
||||
CMD ["npm", "run", "dev"]
|
||||
# Use the entrypoint script
|
||||
ENTRYPOINT ["/docker-entrypoint.sh"]
|
||||
|
||||
27
Dockerfile.dev
Normal file
27
Dockerfile.dev
Normal file
@@ -0,0 +1,27 @@
|
||||
# Use Node.js 22.11.0 as the base image
|
||||
FROM node:22.11.0
|
||||
|
||||
# Install git for development
|
||||
RUN apt-get update && apt-get install -y git && rm -rf /var/lib/apt/lists/*
|
||||
|
||||
# Set the working directory
|
||||
WORKDIR /app
|
||||
|
||||
# Copy package.json and package-lock.json (if any)
|
||||
COPY package*.json ./
|
||||
|
||||
# Install dependencies
|
||||
RUN npm install
|
||||
|
||||
# Copy the rest of the app
|
||||
COPY . .
|
||||
|
||||
# Copy the development entrypoint script
|
||||
COPY docker-entrypoint-dev.sh /docker-entrypoint-dev.sh
|
||||
RUN chmod +x /docker-entrypoint-dev.sh
|
||||
|
||||
# Expose the default Next.js port
|
||||
EXPOSE 3000
|
||||
|
||||
# Use the development entrypoint script
|
||||
ENTRYPOINT ["/docker-entrypoint-dev.sh"]
|
||||
57
deploy.bat
Normal file
57
deploy.bat
Normal file
@@ -0,0 +1,57 @@
|
||||
@echo off
|
||||
REM Production deployment script for Windows
|
||||
REM Usage: deploy.bat [git_repo_url] [branch] [commit_hash]
|
||||
|
||||
set GIT_REPO_URL=%1
|
||||
set GIT_BRANCH=%2
|
||||
if "%GIT_BRANCH%"=="" set GIT_BRANCH=ui-fix
|
||||
set GIT_COMMIT=%3
|
||||
|
||||
REM Check if .env.production exists
|
||||
if exist .env.production (
|
||||
echo Loading production environment variables...
|
||||
for /f "delims=" %%x in (.env.production) do (
|
||||
set "%%x"
|
||||
)
|
||||
) else (
|
||||
echo Warning: .env.production not found. Make sure environment variables are set!
|
||||
)
|
||||
|
||||
REM Validate critical environment variables
|
||||
if "%NEXTAUTH_SECRET%"=="" (
|
||||
echo ERROR: NEXTAUTH_SECRET must be set to a secure random string!
|
||||
echo Generate one with: openssl rand -base64 32
|
||||
exit /b 1
|
||||
)
|
||||
|
||||
@REM if "%NEXTAUTH_SECRET%"=="YOUR_SUPER_SECURE_SECRET_KEY_HERE_AT_LEAST_32_CHARACTERS_LONG" (
|
||||
@REM echo ERROR: NEXTAUTH_SECRET must be changed from the default value!
|
||||
@REM echo Generate one with: openssl rand -base64 32
|
||||
@REM exit /b 1
|
||||
@REM )
|
||||
|
||||
if "%NEXTAUTH_URL%"=="" (
|
||||
echo ERROR: NEXTAUTH_URL must be set to your production URL!
|
||||
exit /b 1
|
||||
)
|
||||
|
||||
if "%GIT_REPO_URL%"=="" (
|
||||
echo Building from local files...
|
||||
docker-compose -f docker-compose.prod.yml build
|
||||
) else (
|
||||
echo Building from git repository: %GIT_REPO_URL%
|
||||
echo Branch: %GIT_BRANCH%
|
||||
if not "%GIT_COMMIT%"=="" echo Commit: %GIT_COMMIT%
|
||||
|
||||
set GIT_REPO_URL=%GIT_REPO_URL%
|
||||
set GIT_BRANCH=%GIT_BRANCH%
|
||||
set GIT_COMMIT=%GIT_COMMIT%
|
||||
docker-compose -f docker-compose.prod.yml build
|
||||
)
|
||||
|
||||
echo Starting production deployment...
|
||||
docker-compose -f docker-compose.prod.yml down
|
||||
docker-compose -f docker-compose.prod.yml up -d
|
||||
|
||||
echo Deployment completed successfully!
|
||||
echo Application is running at http://localhost:3001
|
||||
52
deploy.sh
Normal file
52
deploy.sh
Normal file
@@ -0,0 +1,52 @@
|
||||
#!/bin/bash
|
||||
|
||||
# Production deployment script
|
||||
# Usage: ./deploy.sh [git_repo_url] [branch] [commit_hash]
|
||||
|
||||
set -e
|
||||
|
||||
# Default values
|
||||
GIT_REPO_URL=${1:-""}
|
||||
GIT_BRANCH=${2:-"ui-fix"}
|
||||
GIT_COMMIT=${3:-""}
|
||||
|
||||
# Check if .env.production exists and source it
|
||||
if [ -f .env.production ]; then
|
||||
echo "Loading production environment variables..."
|
||||
export $(grep -v '^#' .env.production | xargs)
|
||||
else
|
||||
echo "Warning: .env.production not found. Make sure environment variables are set!"
|
||||
fi
|
||||
|
||||
# Validate critical environment variables
|
||||
# if [ -z "$NEXTAUTH_SECRET" ] || [ "$NEXTAUTH_SECRET" = "YOUR_SUPER_SECURE_SECRET_KEY_HERE_AT_LEAST_32_CHARACTERS_LONG" ]; then
|
||||
# echo "ERROR: NEXTAUTH_SECRET must be set to a secure random string!"
|
||||
# echo "Generate one with: openssl rand -base64 32"
|
||||
# exit 1
|
||||
# fi
|
||||
|
||||
if [ -z "$NEXTAUTH_URL" ]; then
|
||||
echo "ERROR: NEXTAUTH_URL must be set to your production URL!"
|
||||
exit 1
|
||||
fi
|
||||
|
||||
if [ -z "$GIT_REPO_URL" ]; then
|
||||
echo "Building from local files..."
|
||||
docker-compose -f docker-compose.prod.yml build
|
||||
else
|
||||
echo "Building from git repository: $GIT_REPO_URL"
|
||||
echo "Branch: $GIT_BRANCH"
|
||||
if [ -n "$GIT_COMMIT" ]; then
|
||||
echo "Commit: $GIT_COMMIT"
|
||||
fi
|
||||
|
||||
GIT_REPO_URL=$GIT_REPO_URL GIT_BRANCH=$GIT_BRANCH GIT_COMMIT=$GIT_COMMIT \
|
||||
docker-compose -f docker-compose.prod.yml build
|
||||
fi
|
||||
|
||||
echo "Starting production deployment..."
|
||||
docker-compose -f docker-compose.prod.yml down
|
||||
docker-compose -f docker-compose.prod.yml up -d
|
||||
|
||||
echo "Deployment completed successfully!"
|
||||
echo "Application is running at http://localhost:3001"
|
||||
20
docker-compose.prod.yml
Normal file
20
docker-compose.prod.yml
Normal file
@@ -0,0 +1,20 @@
|
||||
version: "3.9"
|
||||
|
||||
services:
|
||||
app:
|
||||
build:
|
||||
context: .
|
||||
dockerfile: Dockerfile
|
||||
args:
|
||||
- GIT_REPO_URL=${GIT_REPO_URL}
|
||||
- GIT_BRANCH=${GIT_BRANCH:-main}
|
||||
- GIT_COMMIT=${GIT_COMMIT}
|
||||
ports:
|
||||
- "3001:3000"
|
||||
volumes:
|
||||
- ./data:/app/data
|
||||
environment:
|
||||
- NODE_ENV=production
|
||||
- NEXTAUTH_SECRET=${NEXTAUTH_SECRET:-your-secret-key-generate-a-strong-random-string-at-least-32-characters}
|
||||
- NEXTAUTH_URL=${NEXTAUTH_URL:-https://panel2.wastpol.pl}
|
||||
restart: unless-stopped
|
||||
@@ -2,9 +2,11 @@ version: "3.9"
|
||||
|
||||
services:
|
||||
app:
|
||||
build: .
|
||||
build:
|
||||
context: .
|
||||
dockerfile: Dockerfile.dev
|
||||
ports:
|
||||
- "3000:3000"
|
||||
- "3001:3000"
|
||||
volumes:
|
||||
- .:/app
|
||||
- /app/node_modules
|
||||
|
||||
17
docker-entrypoint-dev.sh
Normal file
17
docker-entrypoint-dev.sh
Normal file
@@ -0,0 +1,17 @@
|
||||
#!/bin/bash
|
||||
|
||||
# Development container startup script
|
||||
# This runs when the development container starts
|
||||
|
||||
echo "🚀 Starting development environment..."
|
||||
|
||||
# Ensure data directory exists
|
||||
mkdir -p /app/data
|
||||
|
||||
# Create admin account if it doesn't exist
|
||||
echo "🔧 Setting up admin account..."
|
||||
node scripts/create-admin.js
|
||||
|
||||
# Start the development server
|
||||
echo "✅ Starting development server..."
|
||||
exec npm run dev
|
||||
17
docker-entrypoint.sh
Normal file
17
docker-entrypoint.sh
Normal file
@@ -0,0 +1,17 @@
|
||||
#!/bin/bash
|
||||
|
||||
# Container startup script
|
||||
# This runs when the container starts, not during build
|
||||
|
||||
echo "🚀 Starting application..."
|
||||
|
||||
# Ensure data directory exists
|
||||
mkdir -p /app/data
|
||||
|
||||
# Create admin account if it doesn't exist
|
||||
echo "🔧 Setting up admin account..."
|
||||
node scripts/create-admin.js
|
||||
|
||||
# Start the application
|
||||
echo "✅ Starting production server..."
|
||||
exec npm start
|
||||
5
init-db-temp.mjs
Normal file
5
init-db-temp.mjs
Normal file
@@ -0,0 +1,5 @@
|
||||
import initializeDatabase from './src/lib/init-db.js';
|
||||
|
||||
console.log('Initializing database...');
|
||||
initializeDatabase();
|
||||
console.log('Database initialized successfully!');
|
||||
60
migrate-to-username.js
Normal file
60
migrate-to-username.js
Normal file
@@ -0,0 +1,60 @@
|
||||
import Database from "better-sqlite3";
|
||||
|
||||
const db = new Database("./data/database.sqlite");
|
||||
|
||||
console.log("🔄 Migrating database to username-based authentication...\n");
|
||||
|
||||
try {
|
||||
// Check current table structure
|
||||
const tableInfo = db.prepare("PRAGMA table_info(users)").all();
|
||||
console.log("Current users table columns:");
|
||||
tableInfo.forEach(col => console.log(` - ${col.name}: ${col.type}`));
|
||||
|
||||
const hasUsername = tableInfo.some(col => col.name === 'username');
|
||||
const hasEmail = tableInfo.some(col => col.name === 'email');
|
||||
|
||||
if (hasUsername) {
|
||||
console.log("✅ Username column already exists!");
|
||||
} else if (hasEmail) {
|
||||
console.log("\n📝 Adding username column...");
|
||||
|
||||
// Add username column
|
||||
db.exec(`ALTER TABLE users ADD COLUMN username TEXT;`);
|
||||
console.log("✅ Username column added");
|
||||
|
||||
// Copy email data to username for existing users
|
||||
console.log("📋 Migrating existing email data to username...");
|
||||
const result = db.exec(`UPDATE users SET username = email WHERE username IS NULL;`);
|
||||
console.log("✅ Data migrated");
|
||||
|
||||
// Create unique index on username
|
||||
console.log("🔍 Creating unique index on username...");
|
||||
try {
|
||||
db.exec(`CREATE UNIQUE INDEX idx_users_username_unique ON users(username);`);
|
||||
console.log("✅ Unique index created");
|
||||
} catch (e) {
|
||||
console.log("ℹ️ Index already exists or couldn't be created:", e.message);
|
||||
}
|
||||
|
||||
// Verify migration
|
||||
console.log("\n🔍 Verifying migration...");
|
||||
const users = db.prepare("SELECT id, name, username, email FROM users LIMIT 3").all();
|
||||
console.log("Sample users after migration:");
|
||||
users.forEach(user => {
|
||||
console.log(` - ${user.name}: username="${user.username}", email="${user.email || 'NULL'}"`);
|
||||
});
|
||||
|
||||
console.log("\n✅ Migration completed successfully!");
|
||||
console.log("ℹ️ You can now log in using usernames instead of emails");
|
||||
|
||||
} else {
|
||||
console.log("❌ Neither username nor email column found. Database may be corrupted.");
|
||||
process.exit(1);
|
||||
}
|
||||
|
||||
} catch (error) {
|
||||
console.error("❌ Migration failed:", error.message);
|
||||
process.exit(1);
|
||||
} finally {
|
||||
db.close();
|
||||
}
|
||||
@@ -8,6 +8,7 @@
|
||||
"build": "next build",
|
||||
"start": "next start",
|
||||
"lint": "next lint",
|
||||
"create-admin": "node scripts/create-admin.js",
|
||||
"test": "jest",
|
||||
"test:watch": "jest --watch",
|
||||
"test:coverage": "jest --coverage",
|
||||
|
||||
@@ -10,13 +10,13 @@ async function createInitialAdmin() {
|
||||
|
||||
const adminUser = await createUser({
|
||||
name: "Administrator",
|
||||
email: "admin@localhost.com",
|
||||
username: "admin",
|
||||
password: "admin123456", // Change this in production!
|
||||
role: "admin"
|
||||
})
|
||||
|
||||
console.log("✅ Initial admin user created successfully!")
|
||||
console.log("📧 Email: admin@localhost.com")
|
||||
console.log("<EFBFBD> Username: admin")
|
||||
console.log("🔑 Password: admin123456")
|
||||
console.log("⚠️ Please change the password after first login!")
|
||||
console.log("👤 User ID:", adminUser.id)
|
||||
|
||||
@@ -15,7 +15,7 @@ export default function EditUserPage() {
|
||||
const [user, setUser] = useState(null);
|
||||
const [formData, setFormData] = useState({
|
||||
name: "",
|
||||
email: "",
|
||||
username: "",
|
||||
role: "user",
|
||||
is_active: true,
|
||||
password: ""
|
||||
@@ -62,7 +62,7 @@ export default function EditUserPage() {
|
||||
setUser(userData);
|
||||
setFormData({
|
||||
name: userData.name,
|
||||
email: userData.email,
|
||||
username: userData.username,
|
||||
role: userData.role,
|
||||
is_active: userData.is_active,
|
||||
password: "" // Never populate password field
|
||||
@@ -84,7 +84,7 @@ export default function EditUserPage() {
|
||||
// Prepare update data (exclude empty password)
|
||||
const updateData = {
|
||||
name: formData.name,
|
||||
email: formData.email,
|
||||
username: formData.username,
|
||||
role: formData.role,
|
||||
is_active: formData.is_active
|
||||
};
|
||||
@@ -209,12 +209,12 @@ export default function EditUserPage() {
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Email *
|
||||
Username *
|
||||
</label>
|
||||
<Input
|
||||
type="email"
|
||||
value={formData.email}
|
||||
onChange={(e) => setFormData({ ...formData, email: e.target.value })}
|
||||
type="text"
|
||||
value={formData.username}
|
||||
onChange={(e) => setFormData({ ...formData, username: e.target.value })}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -12,8 +12,10 @@ import PageContainer from "@/components/ui/PageContainer";
|
||||
import PageHeader from "@/components/ui/PageHeader";
|
||||
import { LoadingState } from "@/components/ui/States";
|
||||
import { formatDate } from "@/lib/utils";
|
||||
import { useTranslation } from "@/lib/i18n";
|
||||
|
||||
export default function UserManagementPage() {
|
||||
const { t } = useTranslation();
|
||||
const [users, setUsers] = useState([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [error, setError] = useState("");
|
||||
@@ -54,7 +56,7 @@ export default function UserManagementPage() {
|
||||
};
|
||||
|
||||
const handleDeleteUser = async (userId) => {
|
||||
if (!confirm("Are you sure you want to delete this user?")) return;
|
||||
if (!confirm(t('admin.deleteUser') + "?")) return;
|
||||
|
||||
try {
|
||||
const response = await fetch(`/api/admin/users/${userId}`, {
|
||||
@@ -141,7 +143,7 @@ export default function UserManagementPage() {
|
||||
|
||||
return (
|
||||
<PageContainer>
|
||||
<PageHeader title="User Management" description="Manage system users and permissions">
|
||||
<PageHeader title={t('admin.userManagement')} description={t('admin.subtitle')}>
|
||||
<Button
|
||||
variant="primary"
|
||||
onClick={() => setShowCreateForm(true)}
|
||||
@@ -149,7 +151,7 @@ export default function UserManagementPage() {
|
||||
<svg className="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 4v16m8-8H4" />
|
||||
</svg>
|
||||
Add User
|
||||
{t('admin.newUser')}
|
||||
</Button>
|
||||
</PageHeader>
|
||||
|
||||
@@ -192,7 +194,7 @@ export default function UserManagementPage() {
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-lg font-semibold text-gray-900">{user.name}</h3>
|
||||
<p className="text-sm text-gray-500">{user.email}</p>
|
||||
<p className="text-sm text-gray-500">{user.username}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex items-center space-x-2">
|
||||
@@ -282,7 +284,7 @@ export default function UserManagementPage() {
|
||||
function CreateUserModal({ onClose, onUserCreated }) {
|
||||
const [formData, setFormData] = useState({
|
||||
name: "",
|
||||
email: "",
|
||||
username: "",
|
||||
password: "",
|
||||
role: "user",
|
||||
is_active: true
|
||||
@@ -351,12 +353,12 @@ function CreateUserModal({ onClose, onUserCreated }) {
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-1">
|
||||
Email
|
||||
Username
|
||||
</label>
|
||||
<Input
|
||||
type="email"
|
||||
value={formData.email}
|
||||
onChange={(e) => setFormData({ ...formData, email: e.target.value })}
|
||||
type="text"
|
||||
value={formData.username}
|
||||
onChange={(e) => setFormData({ ...formData, username: e.target.value })}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -78,7 +78,7 @@ async function updateUserHandler(req, { params }) {
|
||||
|
||||
if (error.message.includes("already exists")) {
|
||||
return NextResponse.json(
|
||||
{ error: "A user with this email already exists" },
|
||||
{ error: "A user with this username already exists" },
|
||||
{ status: 409 }
|
||||
);
|
||||
}
|
||||
|
||||
@@ -27,9 +27,9 @@ async function createUserHandler(req) {
|
||||
const data = await req.json();
|
||||
|
||||
// Validate required fields
|
||||
if (!data.name || !data.email || !data.password) {
|
||||
if (!data.name || !data.username || !data.password) {
|
||||
return NextResponse.json(
|
||||
{ error: "Name, email, and password are required" },
|
||||
{ error: "Name, username, and password are required" },
|
||||
{ status: 400 }
|
||||
);
|
||||
}
|
||||
@@ -53,7 +53,7 @@ async function createUserHandler(req) {
|
||||
|
||||
const newUser = await createUser({
|
||||
name: data.name,
|
||||
email: data.email,
|
||||
username: data.username,
|
||||
password: data.password,
|
||||
role: data.role || "user",
|
||||
is_active: data.is_active !== undefined ? data.is_active : true
|
||||
@@ -68,7 +68,7 @@ async function createUserHandler(req) {
|
||||
|
||||
if (error.message.includes("already exists")) {
|
||||
return NextResponse.json(
|
||||
{ error: "A user with this email already exists" },
|
||||
{ error: "A user with this username already exists" },
|
||||
{ status: 409 }
|
||||
);
|
||||
}
|
||||
|
||||
46
src/app/api/field-history/route.js
Normal file
46
src/app/api/field-history/route.js
Normal file
@@ -0,0 +1,46 @@
|
||||
// Force this API route to use Node.js runtime for database access
|
||||
export const runtime = "nodejs";
|
||||
|
||||
import { getFieldHistory, hasFieldHistory } from "@/lib/queries/fieldHistory";
|
||||
import { NextResponse } from "next/server";
|
||||
import { withReadAuth } from "@/lib/middleware/auth";
|
||||
import initializeDatabase from "@/lib/init-db";
|
||||
|
||||
// Make sure the DB is initialized before queries run
|
||||
initializeDatabase();
|
||||
|
||||
async function getFieldHistoryHandler(req) {
|
||||
const { searchParams } = new URL(req.url);
|
||||
const tableName = searchParams.get("table_name");
|
||||
const recordId = searchParams.get("record_id");
|
||||
const fieldName = searchParams.get("field_name");
|
||||
const checkOnly = searchParams.get("check_only") === "true";
|
||||
|
||||
if (!tableName || !recordId || !fieldName) {
|
||||
return NextResponse.json(
|
||||
{ error: "Missing required parameters: table_name, record_id, field_name" },
|
||||
{ status: 400 }
|
||||
);
|
||||
}
|
||||
|
||||
try {
|
||||
if (checkOnly) {
|
||||
// Just check if history exists
|
||||
const exists = hasFieldHistory(tableName, parseInt(recordId), fieldName);
|
||||
return NextResponse.json({ hasHistory: exists });
|
||||
} else {
|
||||
// Get full history
|
||||
const history = getFieldHistory(tableName, parseInt(recordId), fieldName);
|
||||
return NextResponse.json(history);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error fetching field history:", error);
|
||||
return NextResponse.json(
|
||||
{ error: "Failed to fetch field history" },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// Protected route - require read authentication
|
||||
export const GET = withReadAuth(getFieldHistoryHandler);
|
||||
79
src/app/api/files/[fileId]/route.js
Normal file
79
src/app/api/files/[fileId]/route.js
Normal file
@@ -0,0 +1,79 @@
|
||||
import { NextResponse } from "next/server";
|
||||
import { unlink } from "fs/promises";
|
||||
import path from "path";
|
||||
import db from "@/lib/db";
|
||||
|
||||
export async function DELETE(request, { params }) {
|
||||
try {
|
||||
const fileId = params.fileId;
|
||||
|
||||
// Get file info from database
|
||||
const file = db.prepare(`
|
||||
SELECT * FROM file_attachments WHERE file_id = ?
|
||||
`).get(parseInt(fileId));
|
||||
|
||||
if (!file) {
|
||||
return NextResponse.json(
|
||||
{ error: "File not found" },
|
||||
{ status: 404 }
|
||||
);
|
||||
}
|
||||
|
||||
// Delete physical file
|
||||
try {
|
||||
const fullPath = path.join(process.cwd(), "public", file.file_path);
|
||||
await unlink(fullPath);
|
||||
} catch (fileError) {
|
||||
console.warn("Could not delete physical file:", fileError.message);
|
||||
// Continue with database deletion even if file doesn't exist
|
||||
}
|
||||
|
||||
// Delete from database
|
||||
const result = db.prepare(`
|
||||
DELETE FROM file_attachments WHERE file_id = ?
|
||||
`).run(parseInt(fileId));
|
||||
|
||||
if (result.changes === 0) {
|
||||
return NextResponse.json(
|
||||
{ error: "File not found" },
|
||||
{ status: 404 }
|
||||
);
|
||||
}
|
||||
|
||||
return NextResponse.json({ success: true });
|
||||
|
||||
} catch (error) {
|
||||
console.error("Error deleting file:", error);
|
||||
return NextResponse.json(
|
||||
{ error: "Failed to delete file" },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export async function GET(request, { params }) {
|
||||
try {
|
||||
const fileId = params.fileId;
|
||||
|
||||
// Get file info from database
|
||||
const file = db.prepare(`
|
||||
SELECT * FROM file_attachments WHERE file_id = ?
|
||||
`).get(parseInt(fileId));
|
||||
|
||||
if (!file) {
|
||||
return NextResponse.json(
|
||||
{ error: "File not found" },
|
||||
{ status: 404 }
|
||||
);
|
||||
}
|
||||
|
||||
return NextResponse.json(file);
|
||||
|
||||
} catch (error) {
|
||||
console.error("Error fetching file:", error);
|
||||
return NextResponse.json(
|
||||
{ error: "Failed to fetch file" },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
162
src/app/api/files/route.js
Normal file
162
src/app/api/files/route.js
Normal file
@@ -0,0 +1,162 @@
|
||||
import { NextRequest, NextResponse } from "next/server";
|
||||
import { writeFile, mkdir } from "fs/promises";
|
||||
import { existsSync } from "fs";
|
||||
import path from "path";
|
||||
import db from "@/lib/db";
|
||||
import { auditLog } from "@/lib/middleware/auditLog";
|
||||
|
||||
const UPLOAD_DIR = path.join(process.cwd(), "public", "uploads");
|
||||
const MAX_FILE_SIZE = 10 * 1024 * 1024; // 10MB
|
||||
const ALLOWED_TYPES = [
|
||||
"application/pdf",
|
||||
"application/msword",
|
||||
"application/vnd.openxmlformats-officedocument.wordprocessingml.document",
|
||||
"application/vnd.ms-excel",
|
||||
"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
|
||||
"image/jpeg",
|
||||
"image/png",
|
||||
"image/gif",
|
||||
"text/plain"
|
||||
];
|
||||
|
||||
export async function POST(request) {
|
||||
try {
|
||||
const formData = await request.formData();
|
||||
const file = formData.get("file");
|
||||
const entityType = formData.get("entityType");
|
||||
const entityId = formData.get("entityId");
|
||||
const description = formData.get("description") || "";
|
||||
|
||||
if (!file || !entityType || !entityId) {
|
||||
return NextResponse.json(
|
||||
{ error: "File, entityType, and entityId are required" },
|
||||
{ status: 400 }
|
||||
);
|
||||
}
|
||||
|
||||
// Validate entity type
|
||||
if (!["contract", "project", "task"].includes(entityType)) {
|
||||
return NextResponse.json(
|
||||
{ error: "Invalid entity type" },
|
||||
{ status: 400 }
|
||||
);
|
||||
}
|
||||
|
||||
// Validate file
|
||||
if (file.size > MAX_FILE_SIZE) {
|
||||
return NextResponse.json(
|
||||
{ error: "File size too large (max 10MB)" },
|
||||
{ status: 400 }
|
||||
);
|
||||
}
|
||||
|
||||
if (!ALLOWED_TYPES.includes(file.type)) {
|
||||
return NextResponse.json(
|
||||
{ error: "File type not allowed" },
|
||||
{ status: 400 }
|
||||
);
|
||||
}
|
||||
|
||||
// Create upload directory structure
|
||||
const entityDir = path.join(UPLOAD_DIR, entityType + "s", entityId);
|
||||
if (!existsSync(entityDir)) {
|
||||
await mkdir(entityDir, { recursive: true });
|
||||
}
|
||||
|
||||
// Generate unique filename
|
||||
const timestamp = Date.now();
|
||||
const sanitizedOriginalName = file.name.replace(/[^a-zA-Z0-9.-]/g, "_");
|
||||
const storedFilename = `${timestamp}_${sanitizedOriginalName}`;
|
||||
const filePath = path.join(entityDir, storedFilename);
|
||||
const relativePath = `/uploads/${entityType}s/${entityId}/${storedFilename}`;
|
||||
|
||||
// Save file
|
||||
const bytes = await file.arrayBuffer();
|
||||
const buffer = Buffer.from(bytes);
|
||||
await writeFile(filePath, buffer);
|
||||
|
||||
// Save to database
|
||||
const stmt = db.prepare(`
|
||||
INSERT INTO file_attachments (
|
||||
entity_type, entity_id, original_filename, stored_filename,
|
||||
file_path, file_size, mime_type, description, uploaded_by
|
||||
) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?)
|
||||
`);
|
||||
|
||||
const result = stmt.run(
|
||||
entityType,
|
||||
parseInt(entityId),
|
||||
file.name,
|
||||
storedFilename,
|
||||
relativePath,
|
||||
file.size,
|
||||
file.type,
|
||||
description,
|
||||
null // TODO: Get from session when auth is implemented
|
||||
);
|
||||
|
||||
const newFile = {
|
||||
file_id: result.lastInsertRowid,
|
||||
entity_type: entityType,
|
||||
entity_id: parseInt(entityId),
|
||||
original_filename: file.name,
|
||||
stored_filename: storedFilename,
|
||||
file_path: relativePath,
|
||||
file_size: file.size,
|
||||
mime_type: file.type,
|
||||
description: description,
|
||||
upload_date: new Date().toISOString()
|
||||
};
|
||||
|
||||
return NextResponse.json(newFile, { status: 201 });
|
||||
|
||||
} catch (error) {
|
||||
console.error("File upload error:", error);
|
||||
return NextResponse.json(
|
||||
{ error: "Failed to upload file" },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export async function GET(request) {
|
||||
try {
|
||||
const { searchParams } = new URL(request.url);
|
||||
const entityType = searchParams.get("entityType");
|
||||
const entityId = searchParams.get("entityId");
|
||||
|
||||
if (!entityType || !entityId) {
|
||||
return NextResponse.json(
|
||||
{ error: "entityType and entityId are required" },
|
||||
{ status: 400 }
|
||||
);
|
||||
}
|
||||
|
||||
const files = db.prepare(`
|
||||
SELECT
|
||||
file_id,
|
||||
entity_type,
|
||||
entity_id,
|
||||
original_filename,
|
||||
stored_filename,
|
||||
file_path,
|
||||
file_size,
|
||||
mime_type,
|
||||
description,
|
||||
upload_date,
|
||||
uploaded_by
|
||||
FROM file_attachments
|
||||
WHERE entity_type = ? AND entity_id = ?
|
||||
ORDER BY upload_date DESC
|
||||
`).all(entityType, parseInt(entityId));
|
||||
|
||||
return NextResponse.json(files);
|
||||
|
||||
} catch (error) {
|
||||
console.error("Error fetching files:", error);
|
||||
return NextResponse.json(
|
||||
{ error: "Failed to fetch files" },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
72
src/app/api/notes/[id]/route.js
Normal file
72
src/app/api/notes/[id]/route.js
Normal file
@@ -0,0 +1,72 @@
|
||||
// Force this API route to use Node.js runtime for database access
|
||||
export const runtime = "nodejs";
|
||||
|
||||
import db from "@/lib/db";
|
||||
import { NextResponse } from "next/server";
|
||||
import { withUserAuth } from "@/lib/middleware/auth";
|
||||
import {
|
||||
logApiActionSafe,
|
||||
AUDIT_ACTIONS,
|
||||
RESOURCE_TYPES,
|
||||
} from "@/lib/auditLogSafe.js";
|
||||
import initializeDatabase from "@/lib/init-db";
|
||||
|
||||
// Make sure the DB is initialized before queries run
|
||||
initializeDatabase();
|
||||
|
||||
async function deleteNoteHandler(req, { params }) {
|
||||
const { id } = await params;
|
||||
|
||||
if (!id) {
|
||||
return NextResponse.json({ error: "Note ID is required" }, { status: 400 });
|
||||
}
|
||||
|
||||
try {
|
||||
// Get note data before deletion for audit log
|
||||
const note = db.prepare("SELECT * FROM notes WHERE note_id = ?").get(id);
|
||||
|
||||
if (!note) {
|
||||
return NextResponse.json({ error: "Note not found" }, { status: 404 });
|
||||
}
|
||||
|
||||
// Check if user has permission to delete this note
|
||||
// Users can delete their own notes, or admins can delete any note
|
||||
const userRole = req.user?.role;
|
||||
const userId = req.user?.id;
|
||||
|
||||
if (userRole !== 'admin' && note.created_by !== userId) {
|
||||
return NextResponse.json({ error: "Unauthorized to delete this note" }, { status: 403 });
|
||||
}
|
||||
|
||||
// Delete the note
|
||||
db.prepare("DELETE FROM notes WHERE note_id = ?").run(id);
|
||||
|
||||
// Log note deletion
|
||||
await logApiActionSafe(
|
||||
req,
|
||||
AUDIT_ACTIONS.NOTE_DELETE,
|
||||
RESOURCE_TYPES.NOTE,
|
||||
id,
|
||||
req.auth,
|
||||
{
|
||||
deletedNote: {
|
||||
project_id: note?.project_id,
|
||||
task_id: note?.task_id,
|
||||
note_length: note?.note?.length || 0,
|
||||
created_by: note?.created_by,
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
return NextResponse.json({ success: true });
|
||||
} catch (error) {
|
||||
console.error("Error deleting note:", error);
|
||||
return NextResponse.json(
|
||||
{ error: "Failed to delete note", details: error.message },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// Protected route - require user authentication
|
||||
export const DELETE = withUserAuth(deleteNoteHandler);
|
||||
@@ -3,13 +3,59 @@ export const runtime = "nodejs";
|
||||
|
||||
import db from "@/lib/db";
|
||||
import { NextResponse } from "next/server";
|
||||
import { withUserAuth } from "@/lib/middleware/auth";
|
||||
import { withUserAuth, withReadAuth } from "@/lib/middleware/auth";
|
||||
import {
|
||||
logApiActionSafe,
|
||||
AUDIT_ACTIONS,
|
||||
RESOURCE_TYPES,
|
||||
} from "@/lib/auditLogSafe.js";
|
||||
|
||||
async function getNotesHandler(req) {
|
||||
const { searchParams } = new URL(req.url);
|
||||
const projectId = searchParams.get("project_id");
|
||||
const taskId = searchParams.get("task_id");
|
||||
|
||||
let query;
|
||||
let params;
|
||||
|
||||
if (projectId) {
|
||||
query = `
|
||||
SELECT n.*,
|
||||
u.name as created_by_name,
|
||||
u.username as created_by_username
|
||||
FROM notes n
|
||||
LEFT JOIN users u ON n.created_by = u.id
|
||||
WHERE n.project_id = ?
|
||||
ORDER BY n.note_date DESC
|
||||
`;
|
||||
params = [projectId];
|
||||
} else if (taskId) {
|
||||
query = `
|
||||
SELECT n.*,
|
||||
u.name as created_by_name,
|
||||
u.username as created_by_username
|
||||
FROM notes n
|
||||
LEFT JOIN users u ON n.created_by = u.id
|
||||
WHERE n.task_id = ?
|
||||
ORDER BY n.note_date DESC
|
||||
`;
|
||||
params = [taskId];
|
||||
} else {
|
||||
return NextResponse.json({ error: "project_id or task_id is required" }, { status: 400 });
|
||||
}
|
||||
|
||||
try {
|
||||
const notes = db.prepare(query).all(...params);
|
||||
return NextResponse.json(notes);
|
||||
} catch (error) {
|
||||
console.error("Error fetching notes:", error);
|
||||
return NextResponse.json(
|
||||
{ error: "Failed to fetch notes" },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
async function createNoteHandler(req) {
|
||||
const { project_id, task_id, note } = await req.json();
|
||||
|
||||
@@ -118,6 +164,7 @@ async function updateNoteHandler(req, { params }) {
|
||||
}
|
||||
|
||||
// Protected routes - require authentication
|
||||
export const GET = withReadAuth(getNotesHandler);
|
||||
export const POST = withUserAuth(createNoteHandler);
|
||||
export const DELETE = withUserAuth(deleteNoteHandler);
|
||||
export const PUT = withUserAuth(updateNoteHandler);
|
||||
|
||||
@@ -1,13 +1,45 @@
|
||||
import {
|
||||
updateProjectTaskStatus,
|
||||
deleteProjectTask,
|
||||
updateProjectTask,
|
||||
} from "@/lib/queries/tasks";
|
||||
import { NextResponse } from "next/server";
|
||||
import { withUserAuth } from "@/lib/middleware/auth";
|
||||
|
||||
// PATCH: Update project task status
|
||||
// PUT: Update project task (general update)
|
||||
async function updateProjectTaskHandler(req, { params }) {
|
||||
try {
|
||||
const { id } = await params;
|
||||
const updates = await req.json();
|
||||
|
||||
// Validate that we have at least one field to update
|
||||
const allowedFields = ["priority", "status", "assigned_to", "date_started"];
|
||||
const hasValidFields = Object.keys(updates).some((key) =>
|
||||
allowedFields.includes(key)
|
||||
);
|
||||
|
||||
if (!hasValidFields) {
|
||||
return NextResponse.json(
|
||||
{ error: "No valid fields provided for update" },
|
||||
{ status: 400 }
|
||||
);
|
||||
}
|
||||
|
||||
updateProjectTask(id, updates, req.user?.id || null);
|
||||
return NextResponse.json({ success: true });
|
||||
} catch (error) {
|
||||
console.error("Error updating task:", error);
|
||||
return NextResponse.json(
|
||||
{ error: "Failed to update project task", details: error.message },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// PATCH: Update project task status
|
||||
async function updateProjectTaskStatusHandler(req, { params }) {
|
||||
try {
|
||||
const { id } = await params;
|
||||
const { status } = await req.json();
|
||||
|
||||
if (!status) {
|
||||
@@ -17,7 +49,7 @@ async function updateProjectTaskHandler(req, { params }) {
|
||||
);
|
||||
}
|
||||
|
||||
updateProjectTaskStatus(params.id, status, req.user?.id || null);
|
||||
updateProjectTaskStatus(id, status, req.user?.id || null);
|
||||
return NextResponse.json({ success: true });
|
||||
} catch (error) {
|
||||
console.error("Error updating task status:", error);
|
||||
@@ -31,16 +63,19 @@ async function updateProjectTaskHandler(req, { params }) {
|
||||
// DELETE: Delete a project task
|
||||
async function deleteProjectTaskHandler(req, { params }) {
|
||||
try {
|
||||
deleteProjectTask(params.id);
|
||||
const { id } = await params;
|
||||
const result = deleteProjectTask(id);
|
||||
return NextResponse.json({ success: true });
|
||||
} catch (error) {
|
||||
console.error("Error in deleteProjectTaskHandler:", error);
|
||||
return NextResponse.json(
|
||||
{ error: "Failed to delete project task" },
|
||||
{ error: "Failed to delete project task", details: error.message },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// Protected routes - require authentication
|
||||
export const PATCH = withUserAuth(updateProjectTaskHandler);
|
||||
export const PUT = withUserAuth(updateProjectTaskHandler);
|
||||
export const PATCH = withUserAuth(updateProjectTaskStatusHandler);
|
||||
export const DELETE = withUserAuth(deleteProjectTaskHandler);
|
||||
|
||||
24
src/app/api/projects/[id]/finish-date-updates/route.js
Normal file
24
src/app/api/projects/[id]/finish-date-updates/route.js
Normal file
@@ -0,0 +1,24 @@
|
||||
// Force this API route to use Node.js runtime for database access
|
||||
export const runtime = "nodejs";
|
||||
|
||||
import { getFinishDateUpdates } from "@/lib/queries/projects";
|
||||
import { NextResponse } from "next/server";
|
||||
import { withReadAuth } from "@/lib/middleware/auth";
|
||||
|
||||
async function getFinishDateUpdatesHandler(req, { params }) {
|
||||
const { id } = await params;
|
||||
|
||||
try {
|
||||
const updates = getFinishDateUpdates(parseInt(id));
|
||||
return NextResponse.json(updates);
|
||||
} catch (error) {
|
||||
console.error("Error fetching finish date updates:", error);
|
||||
return NextResponse.json(
|
||||
{ error: "Failed to fetch finish date updates" },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// Protected route - require authentication
|
||||
export const GET = withReadAuth(getFinishDateUpdatesHandler);
|
||||
@@ -3,9 +3,12 @@ export const runtime = "nodejs";
|
||||
|
||||
import {
|
||||
getProjectById,
|
||||
getProjectWithContract,
|
||||
updateProject,
|
||||
deleteProject,
|
||||
} from "@/lib/queries/projects";
|
||||
import { logFieldChange } from "@/lib/queries/fieldHistory";
|
||||
import { addNoteToProject } from "@/lib/queries/notes";
|
||||
import initializeDatabase from "@/lib/init-db";
|
||||
import { NextResponse } from "next/server";
|
||||
import { withReadAuth, withUserAuth } from "@/lib/middleware/auth";
|
||||
@@ -20,7 +23,7 @@ initializeDatabase();
|
||||
|
||||
async function getProjectHandler(req, { params }) {
|
||||
const { id } = await params;
|
||||
const project = getProjectById(parseInt(id));
|
||||
const project = getProjectWithContract(parseInt(id));
|
||||
|
||||
if (!project) {
|
||||
return NextResponse.json({ error: "Project not found" }, { status: 404 });
|
||||
@@ -40,15 +43,58 @@ async function getProjectHandler(req, { params }) {
|
||||
}
|
||||
|
||||
async function updateProjectHandler(req, { params }) {
|
||||
try {
|
||||
const { id } = await params;
|
||||
const data = await req.json();
|
||||
|
||||
// Get user ID from authenticated request
|
||||
const userId = req.user?.id;
|
||||
|
||||
// Get original project data for audit log
|
||||
// Get original project data for audit log and field tracking
|
||||
const originalProject = getProjectById(parseInt(id));
|
||||
|
||||
if (!originalProject) {
|
||||
return NextResponse.json({ error: "Project not found" }, { status: 404 });
|
||||
}
|
||||
|
||||
// Track field changes for specific fields we want to monitor
|
||||
const fieldsToTrack = ['finish_date', 'project_status', 'assigned_to', 'contract_id'];
|
||||
|
||||
for (const fieldName of fieldsToTrack) {
|
||||
if (data.hasOwnProperty(fieldName)) {
|
||||
const oldValue = originalProject[fieldName];
|
||||
const newValue = data[fieldName];
|
||||
|
||||
if (oldValue !== newValue) {
|
||||
try {
|
||||
logFieldChange('projects', parseInt(id), fieldName, oldValue, newValue, userId);
|
||||
} catch (error) {
|
||||
console.error(`Failed to log field change for ${fieldName}:`, error);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Special handling for project cancellation
|
||||
if (data.project_status === 'cancelled' && originalProject.project_status !== 'cancelled') {
|
||||
const now = new Date();
|
||||
const cancellationDate = now.toLocaleDateString('pl-PL', {
|
||||
year: 'numeric',
|
||||
month: '2-digit',
|
||||
day: '2-digit',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit'
|
||||
});
|
||||
|
||||
const cancellationNote = `Projekt został wycofany w dniu ${cancellationDate}`;
|
||||
|
||||
try {
|
||||
addNoteToProject(parseInt(id), cancellationNote, userId, true); // true for is_system
|
||||
} catch (error) {
|
||||
console.error('Failed to log project cancellation:', error);
|
||||
}
|
||||
}
|
||||
|
||||
updateProject(parseInt(id), data, userId);
|
||||
|
||||
// Get updated project
|
||||
@@ -69,6 +115,13 @@ async function updateProjectHandler(req, { params }) {
|
||||
);
|
||||
|
||||
return NextResponse.json(updatedProject);
|
||||
} catch (error) {
|
||||
console.error("Error in updateProjectHandler:", error);
|
||||
return NextResponse.json(
|
||||
{ error: "Internal server error", details: error.message },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
async function deleteProjectHandler(req, { params }) {
|
||||
|
||||
48
src/app/api/task-notes/[id]/route.js
Normal file
48
src/app/api/task-notes/[id]/route.js
Normal file
@@ -0,0 +1,48 @@
|
||||
import { deleteNote } from "@/lib/queries/notes";
|
||||
import { NextResponse } from "next/server";
|
||||
import { withUserAuth } from "@/lib/middleware/auth";
|
||||
import db from "@/lib/db";
|
||||
|
||||
// DELETE: Delete a specific task note
|
||||
async function deleteTaskNoteHandler(req, { params }) {
|
||||
try {
|
||||
const { id } = await params;
|
||||
|
||||
if (!id) {
|
||||
return NextResponse.json({ error: "Note ID is required" }, { status: 400 });
|
||||
}
|
||||
|
||||
// Get note data before deletion for permission checking
|
||||
const note = db.prepare("SELECT * FROM notes WHERE note_id = ?").get(id);
|
||||
|
||||
if (!note) {
|
||||
return NextResponse.json({ error: "Note not found" }, { status: 404 });
|
||||
}
|
||||
|
||||
// Check if user has permission to delete this note
|
||||
// Users can delete their own notes, or admins can delete any note
|
||||
const userRole = req.user?.role;
|
||||
const userId = req.user?.id;
|
||||
|
||||
if (userRole !== 'admin' && note.created_by !== userId) {
|
||||
return NextResponse.json({ error: "Unauthorized to delete this note" }, { status: 403 });
|
||||
}
|
||||
|
||||
// Don't allow deletion of system notes by regular users
|
||||
if (note.is_system && userRole !== 'admin') {
|
||||
return NextResponse.json({ error: "Cannot delete system notes" }, { status: 403 });
|
||||
}
|
||||
|
||||
deleteNote(id);
|
||||
return NextResponse.json({ success: true });
|
||||
} catch (error) {
|
||||
console.error("Error deleting task note:", error);
|
||||
return NextResponse.json(
|
||||
{ error: "Failed to delete task note" },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// Protected route - require user authentication
|
||||
export const DELETE = withUserAuth(deleteTaskNoteHandler);
|
||||
@@ -6,7 +6,7 @@ import { useRouter } from "next/navigation"
|
||||
import { useSearchParams } from "next/navigation"
|
||||
|
||||
function SignInContent() {
|
||||
const [email, setEmail] = useState("")
|
||||
const [username, setUsername] = useState("")
|
||||
const [password, setPassword] = useState("")
|
||||
const [error, setError] = useState("")
|
||||
const [isLoading, setIsLoading] = useState(false)
|
||||
@@ -21,13 +21,13 @@ function SignInContent() {
|
||||
|
||||
try {
|
||||
const result = await signIn("credentials", {
|
||||
email,
|
||||
username,
|
||||
password,
|
||||
redirect: false,
|
||||
})
|
||||
|
||||
if (result?.error) {
|
||||
setError("Invalid email or password")
|
||||
setError("Invalid username or password")
|
||||
} else {
|
||||
// Successful login
|
||||
router.push(callbackUrl)
|
||||
@@ -45,10 +45,10 @@ function SignInContent() {
|
||||
<div className="max-w-md w-full space-y-8">
|
||||
<div>
|
||||
<h2 className="mt-6 text-center text-3xl font-extrabold text-gray-900">
|
||||
Sign in to your account
|
||||
Zaloguj się do swojego konta
|
||||
</h2>
|
||||
<p className="mt-2 text-center text-sm text-gray-600">
|
||||
Access the Project Management Panel
|
||||
Dostęp do panelu
|
||||
</p>
|
||||
</div>
|
||||
<form className="mt-8 space-y-6" onSubmit={handleSubmit}>
|
||||
@@ -60,24 +60,24 @@ function SignInContent() {
|
||||
|
||||
<div className="rounded-md shadow-sm -space-y-px">
|
||||
<div>
|
||||
<label htmlFor="email" className="sr-only">
|
||||
Email address
|
||||
<label htmlFor="username" className="sr-only">
|
||||
Nazwa użytkownika
|
||||
</label>
|
||||
<input
|
||||
id="email"
|
||||
name="email"
|
||||
type="email"
|
||||
autoComplete="email"
|
||||
id="username"
|
||||
name="username"
|
||||
type="text"
|
||||
autoComplete="username"
|
||||
required
|
||||
className="appearance-none rounded-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-t-md focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm"
|
||||
placeholder="Email address"
|
||||
value={email}
|
||||
onChange={(e) => setEmail(e.target.value)}
|
||||
placeholder="Nazwa użytkownika"
|
||||
value={username}
|
||||
onChange={(e) => setUsername(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label htmlFor="password" className="sr-only">
|
||||
Password
|
||||
Hasło
|
||||
</label>
|
||||
<input
|
||||
id="password"
|
||||
@@ -105,7 +105,7 @@ function SignInContent() {
|
||||
<circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4"></circle>
|
||||
<path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
|
||||
</svg>
|
||||
Signing in...
|
||||
Zaloguj...
|
||||
</span>
|
||||
) : (
|
||||
"Sign in"
|
||||
@@ -113,13 +113,13 @@ function SignInContent() {
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="text-center">
|
||||
{/* <div className="text-center">
|
||||
<div className="text-sm text-gray-600 bg-blue-50 p-3 rounded">
|
||||
<p className="font-medium">Default Admin Account:</p>
|
||||
<p>Email: admin@localhost</p>
|
||||
<p>Password: admin123456</p>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
361
src/app/calendar/page.js
Normal file
361
src/app/calendar/page.js
Normal file
@@ -0,0 +1,361 @@
|
||||
"use client";
|
||||
|
||||
import { useEffect, useState } from "react";
|
||||
import Link from "next/link";
|
||||
import { Card, CardHeader, CardContent } from "@/components/ui/Card";
|
||||
import Button from "@/components/ui/Button";
|
||||
import Badge from "@/components/ui/Badge";
|
||||
import PageContainer from "@/components/ui/PageContainer";
|
||||
import PageHeader from "@/components/ui/PageHeader";
|
||||
import { LoadingState } from "@/components/ui/States";
|
||||
import { formatDate } from "@/lib/utils";
|
||||
import { useTranslation } from "@/lib/i18n";
|
||||
import {
|
||||
format,
|
||||
startOfMonth,
|
||||
endOfMonth,
|
||||
startOfWeek,
|
||||
endOfWeek,
|
||||
addDays,
|
||||
isSameMonth,
|
||||
isSameDay,
|
||||
addMonths,
|
||||
subMonths,
|
||||
parseISO,
|
||||
isAfter,
|
||||
isBefore,
|
||||
startOfDay,
|
||||
addWeeks
|
||||
} from "date-fns";
|
||||
import { pl } from "date-fns/locale";
|
||||
|
||||
const statusColors = {
|
||||
registered: "bg-blue-100 text-blue-800",
|
||||
approved: "bg-green-100 text-green-800",
|
||||
pending: "bg-yellow-100 text-yellow-800",
|
||||
in_progress: "bg-orange-100 text-orange-800",
|
||||
fulfilled: "bg-gray-100 text-gray-800",
|
||||
};
|
||||
|
||||
const statusTranslations = {
|
||||
registered: "Zarejestrowany",
|
||||
approved: "Zatwierdzony",
|
||||
pending: "Oczekujący",
|
||||
in_progress: "W trakcie",
|
||||
fulfilled: "Zakończony",
|
||||
};
|
||||
|
||||
export default function ProjectCalendarPage() {
|
||||
const { t } = useTranslation();
|
||||
const [projects, setProjects] = useState([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [currentDate, setCurrentDate] = useState(new Date());
|
||||
const [viewMode, setViewMode] = useState('month'); // 'month' or 'upcoming'
|
||||
|
||||
useEffect(() => {
|
||||
fetch("/api/projects")
|
||||
.then((res) => res.json())
|
||||
.then((data) => {
|
||||
// Filter projects that have finish dates and are not fulfilled
|
||||
const projectsWithDates = data.filter(p =>
|
||||
p.finish_date && p.project_status !== 'fulfilled'
|
||||
);
|
||||
setProjects(projectsWithDates);
|
||||
setLoading(false);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error("Error fetching projects:", error);
|
||||
setLoading(false);
|
||||
});
|
||||
}, []);
|
||||
|
||||
const getProjectsForDate = (date) => {
|
||||
return projects.filter(project => {
|
||||
if (!project.finish_date) return false;
|
||||
try {
|
||||
const projectDate = parseISO(project.finish_date);
|
||||
return isSameDay(projectDate, date);
|
||||
} catch (error) {
|
||||
return false;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const getUpcomingProjects = () => {
|
||||
const today = startOfDay(new Date());
|
||||
const nextMonth = addWeeks(today, 4);
|
||||
|
||||
return projects
|
||||
.filter(project => {
|
||||
if (!project.finish_date) return false;
|
||||
try {
|
||||
const projectDate = parseISO(project.finish_date);
|
||||
return isAfter(projectDate, today) && isBefore(projectDate, nextMonth);
|
||||
} catch (error) {
|
||||
return false;
|
||||
}
|
||||
})
|
||||
.sort((a, b) => {
|
||||
const dateA = parseISO(a.finish_date);
|
||||
const dateB = parseISO(b.finish_date);
|
||||
return dateA - dateB;
|
||||
});
|
||||
};
|
||||
|
||||
const getOverdueProjects = () => {
|
||||
const today = startOfDay(new Date());
|
||||
|
||||
return projects
|
||||
.filter(project => {
|
||||
if (!project.finish_date) return false;
|
||||
try {
|
||||
const projectDate = parseISO(project.finish_date);
|
||||
return isBefore(projectDate, today);
|
||||
} catch (error) {
|
||||
return false;
|
||||
}
|
||||
})
|
||||
.sort((a, b) => {
|
||||
const dateA = parseISO(a.finish_date);
|
||||
const dateB = parseISO(b.finish_date);
|
||||
return dateB - dateA; // Most recently overdue first
|
||||
});
|
||||
};
|
||||
|
||||
const renderCalendarGrid = () => {
|
||||
const monthStart = startOfMonth(currentDate);
|
||||
const monthEnd = endOfMonth(currentDate);
|
||||
const calendarStart = startOfWeek(monthStart, { weekStartsOn: 1 });
|
||||
const calendarEnd = endOfWeek(monthEnd, { weekStartsOn: 1 });
|
||||
|
||||
const days = [];
|
||||
let day = calendarStart;
|
||||
|
||||
while (day <= calendarEnd) {
|
||||
days.push(day);
|
||||
day = addDays(day, 1);
|
||||
}
|
||||
|
||||
const weekdays = ['Pon', 'Wt', 'Śr', 'Czw', 'Pt', 'Sob', 'Nie'];
|
||||
|
||||
return (
|
||||
<div className="bg-white rounded-lg shadow">
|
||||
{/* Calendar Header */}
|
||||
<div className="p-4 border-b border-gray-200">
|
||||
<div className="flex items-center justify-between">
|
||||
<h2 className="text-lg font-semibold text-gray-900">
|
||||
{format(currentDate, 'LLLL yyyy', { locale: pl })}
|
||||
</h2>
|
||||
<div className="flex space-x-2">
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
onClick={() => setCurrentDate(subMonths(currentDate, 1))}
|
||||
>
|
||||
←
|
||||
</Button>
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
onClick={() => setCurrentDate(new Date())}
|
||||
>
|
||||
Dziś
|
||||
</Button>
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
onClick={() => setCurrentDate(addMonths(currentDate, 1))}
|
||||
>
|
||||
→
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Weekday Headers */}
|
||||
<div className="grid grid-cols-7 border-b border-gray-200">
|
||||
{weekdays.map(weekday => (
|
||||
<div key={weekday} className="p-2 text-sm font-medium text-gray-500 text-center">
|
||||
{weekday}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{/* Calendar Grid */}
|
||||
<div className="grid grid-cols-7">
|
||||
{days.map((day, index) => {
|
||||
const dayProjects = getProjectsForDate(day);
|
||||
const isCurrentMonth = isSameMonth(day, currentDate);
|
||||
const isToday = isSameDay(day, new Date());
|
||||
|
||||
return (
|
||||
<div
|
||||
key={index}
|
||||
className={`min-h-[120px] p-2 border-r border-b border-gray-100 ${
|
||||
!isCurrentMonth ? 'bg-gray-50' : 'bg-white'
|
||||
} ${isToday ? 'bg-blue-50' : ''}`}
|
||||
>
|
||||
<div className={`text-sm font-medium mb-2 ${
|
||||
!isCurrentMonth ? 'text-gray-400' : isToday ? 'text-blue-600' : 'text-gray-900'
|
||||
}`}>
|
||||
{format(day, 'd')}
|
||||
</div>
|
||||
|
||||
{dayProjects.length > 0 && (
|
||||
<div className="space-y-1">
|
||||
{dayProjects.slice(0, 3).map(project => (
|
||||
<Link
|
||||
key={project.project_id}
|
||||
href={`/projects/${project.project_id}`}
|
||||
className="block"
|
||||
>
|
||||
<div className={`text-xs p-1 rounded truncate ${
|
||||
statusColors[project.project_status] || statusColors.registered
|
||||
} hover:opacity-80 transition-opacity`}>
|
||||
{project.project_name}
|
||||
</div>
|
||||
</Link>
|
||||
))}
|
||||
{dayProjects.length > 3 && (
|
||||
<div className="text-xs text-gray-500 p-1">
|
||||
+{dayProjects.length - 3} więcej
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
const renderUpcomingView = () => {
|
||||
const upcomingProjects = getUpcomingProjects();
|
||||
const overdueProjects = getOverdueProjects();
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
{/* Overdue Projects */}
|
||||
{overdueProjects.length > 0 && (
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<h3 className="text-lg font-semibold text-red-600">
|
||||
Projekty przeterminowane ({overdueProjects.length})
|
||||
</h3>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="space-y-3">
|
||||
{overdueProjects.map(project => (
|
||||
<div key={project.project_id} className="flex items-center justify-between p-3 bg-red-50 rounded-lg border border-red-200">
|
||||
<div className="flex-1">
|
||||
<Link
|
||||
href={`/projects/${project.project_id}`}
|
||||
className="font-medium text-gray-900 hover:text-blue-600"
|
||||
>
|
||||
{project.project_name}
|
||||
</Link>
|
||||
<div className="text-sm text-gray-600 mt-1">
|
||||
{project.customer && `${project.customer} • `}
|
||||
{project.address}
|
||||
</div>
|
||||
</div>
|
||||
<div className="text-right">
|
||||
<div className="text-sm font-medium text-red-600">
|
||||
{formatDate(project.finish_date)}
|
||||
</div>
|
||||
<Badge className={statusColors[project.project_status] || statusColors.registered}>
|
||||
{statusTranslations[project.project_status] || project.project_status}
|
||||
</Badge>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
)}
|
||||
|
||||
{/* Upcoming Projects */}
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<h3 className="text-lg font-semibold text-gray-900">
|
||||
Nadchodzące terminy ({upcomingProjects.length})
|
||||
</h3>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
{upcomingProjects.length > 0 ? (
|
||||
<div className="space-y-3">
|
||||
{upcomingProjects.map(project => {
|
||||
const daysUntilDeadline = Math.ceil((parseISO(project.finish_date) - new Date()) / (1000 * 60 * 60 * 24));
|
||||
|
||||
return (
|
||||
<div key={project.project_id} className="flex items-center justify-between p-3 bg-gray-50 rounded-lg">
|
||||
<div className="flex-1">
|
||||
<Link
|
||||
href={`/projects/${project.project_id}`}
|
||||
className="font-medium text-gray-900 hover:text-blue-600"
|
||||
>
|
||||
{project.project_name}
|
||||
</Link>
|
||||
<div className="text-sm text-gray-600 mt-1">
|
||||
{project.customer && `${project.customer} • `}
|
||||
{project.address}
|
||||
</div>
|
||||
</div>
|
||||
<div className="text-right">
|
||||
<div className="text-sm font-medium text-gray-900">
|
||||
{formatDate(project.finish_date)}
|
||||
</div>
|
||||
<div className="text-xs text-gray-500">
|
||||
za {daysUntilDeadline} dni
|
||||
</div>
|
||||
<Badge className={statusColors[project.project_status] || statusColors.registered}>
|
||||
{statusTranslations[project.project_status] || project.project_status}
|
||||
</Badge>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
) : (
|
||||
<p className="text-gray-500 text-center py-8">
|
||||
Brak nadchodzących projektów w następnych 4 tygodniach
|
||||
</p>
|
||||
)}
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
if (loading) {
|
||||
return <LoadingState />;
|
||||
}
|
||||
|
||||
return (
|
||||
<PageContainer>
|
||||
<PageHeader
|
||||
title="Kalendarz projektów"
|
||||
subtitle={`${projects.length} aktywnych projektów z terminami`}
|
||||
>
|
||||
<div className="flex space-x-2">
|
||||
<Button
|
||||
variant={viewMode === 'month' ? 'primary' : 'outline'}
|
||||
onClick={() => setViewMode('month')}
|
||||
>
|
||||
Kalendarz
|
||||
</Button>
|
||||
<Button
|
||||
variant={viewMode === 'upcoming' ? 'primary' : 'outline'}
|
||||
onClick={() => setViewMode('upcoming')}
|
||||
>
|
||||
Lista terminów
|
||||
</Button>
|
||||
</div>
|
||||
</PageHeader>
|
||||
|
||||
{viewMode === 'month' ? renderCalendarGrid() : renderUpcomingView()}
|
||||
</PageContainer>
|
||||
);
|
||||
}
|
||||
@@ -10,6 +10,8 @@ import PageContainer from "@/components/ui/PageContainer";
|
||||
import PageHeader from "@/components/ui/PageHeader";
|
||||
import { LoadingState } from "@/components/ui/States";
|
||||
import { formatDate } from "@/lib/utils";
|
||||
import FileUploadModal from "@/components/FileUploadModal";
|
||||
import FileAttachmentsList from "@/components/FileAttachmentsList";
|
||||
|
||||
export default function ContractDetailsPage() {
|
||||
const params = useParams();
|
||||
@@ -17,6 +19,8 @@ export default function ContractDetailsPage() {
|
||||
const [contract, setContract] = useState(null);
|
||||
const [projects, setProjects] = useState([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [showUploadModal, setShowUploadModal] = useState(false);
|
||||
const [attachments, setAttachments] = useState([]);
|
||||
|
||||
useEffect(() => {
|
||||
async function fetchContractDetails() {
|
||||
@@ -52,6 +56,14 @@ export default function ContractDetailsPage() {
|
||||
fetchContractDetails();
|
||||
}
|
||||
}, [contractId]);
|
||||
const handleFileUploaded = (newFile) => {
|
||||
setAttachments(prev => [newFile, ...prev]);
|
||||
};
|
||||
|
||||
const handleFilesChange = (files) => {
|
||||
setAttachments(files);
|
||||
};
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<PageContainer>
|
||||
@@ -245,6 +257,44 @@ export default function ContractDetailsPage() {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Contract Documents */}
|
||||
<Card className="mb-8">
|
||||
<CardHeader>
|
||||
<div className="flex justify-between items-center">
|
||||
<h2 className="text-xl font-semibold text-gray-900">
|
||||
Contract Documents ({attachments.length})
|
||||
</h2>
|
||||
<Button
|
||||
variant="primary"
|
||||
size="sm"
|
||||
onClick={() => setShowUploadModal(true)}
|
||||
>
|
||||
<svg
|
||||
className="w-4 h-4 mr-2"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={2}
|
||||
d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12"
|
||||
/>
|
||||
</svg>
|
||||
Upload Document
|
||||
</Button>
|
||||
</div>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<FileAttachmentsList
|
||||
entityType="contract"
|
||||
entityId={contractId}
|
||||
onFilesChange={handleFilesChange}
|
||||
/>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
{/* Associated Projects */}
|
||||
<Card>
|
||||
<CardHeader>
|
||||
@@ -386,6 +436,15 @@ export default function ContractDetailsPage() {
|
||||
)}
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
{/* File Upload Modal */}
|
||||
<FileUploadModal
|
||||
isOpen={showUploadModal}
|
||||
onClose={() => setShowUploadModal(false)}
|
||||
entityType="contract"
|
||||
entityId={contractId}
|
||||
onFileUploaded={handleFileUploaded}
|
||||
/>
|
||||
</PageContainer>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -11,8 +11,10 @@ import SearchBar from "@/components/ui/SearchBar";
|
||||
import FilterBar from "@/components/ui/FilterBar";
|
||||
import { LoadingState } from "@/components/ui/States";
|
||||
import { formatDate } from "@/lib/utils";
|
||||
import { useTranslation } from "@/lib/i18n";
|
||||
|
||||
export default function ContractsMainPage() {
|
||||
const { t } = useTranslation();
|
||||
const [contracts, setContracts] = useState([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [searchTerm, setSearchTerm] = useState("");
|
||||
@@ -133,13 +135,13 @@ export default function ContractsMainPage() {
|
||||
const getStatusBadge = (status) => {
|
||||
switch (status) {
|
||||
case "active":
|
||||
return <Badge variant="success">Aktywna</Badge>;
|
||||
return <Badge variant="success">{t('contracts.active')}</Badge>;
|
||||
case "completed":
|
||||
return <Badge variant="secondary">Zakończona</Badge>;
|
||||
return <Badge variant="secondary">{t('common.completed')}</Badge>;
|
||||
case "ongoing":
|
||||
return <Badge variant="primary">W trakcie</Badge>;
|
||||
return <Badge variant="primary">{t('contracts.withoutEndDate')}</Badge>;
|
||||
default:
|
||||
return <Badge>Nieznany</Badge>;
|
||||
return <Badge>{t('common.unknown')}</Badge>;
|
||||
}
|
||||
};
|
||||
|
||||
@@ -170,17 +172,17 @@ export default function ContractsMainPage() {
|
||||
return (
|
||||
<PageContainer>
|
||||
<PageHeader
|
||||
title="Umowy"
|
||||
description="Zarządzaj swoimi umowami i kontraktami"
|
||||
title={t('contracts.title')}
|
||||
description={t('contracts.subtitle')}
|
||||
>
|
||||
<Link href="/contracts/new">
|
||||
<Button variant="primary" size="lg">
|
||||
<span className="mr-2">➕</span>
|
||||
Nowa umowa
|
||||
{t('contracts.newContract')}
|
||||
</Button>
|
||||
</Link>
|
||||
</PageHeader>
|
||||
<LoadingState message="Ładowanie umów..." />
|
||||
<LoadingState message={t('navigation.loading')} />
|
||||
</PageContainer>
|
||||
);
|
||||
}
|
||||
@@ -225,13 +227,13 @@ export default function ContractsMainPage() {
|
||||
return (
|
||||
<PageContainer>
|
||||
<PageHeader
|
||||
title="Umowy"
|
||||
description="Zarządzaj swoimi umowami i kontraktami"
|
||||
title={t('contracts.title')}
|
||||
description={t('contracts.subtitle')}
|
||||
>
|
||||
<Link href="/contracts/new">
|
||||
<Button variant="primary" size="lg">
|
||||
<span className="mr-2">➕</span>
|
||||
Nowa umowa
|
||||
{t('contracts.newContract')}
|
||||
</Button>
|
||||
</Link>{" "}
|
||||
</PageHeader>
|
||||
|
||||
@@ -2,6 +2,7 @@ import { Geist, Geist_Mono } from "next/font/google";
|
||||
import "./globals.css";
|
||||
import Navigation from "@/components/ui/Navigation";
|
||||
import { AuthProvider } from "@/components/auth/AuthProvider";
|
||||
import { TranslationProvider } from "@/lib/i18n";
|
||||
|
||||
const geistSans = Geist({
|
||||
variable: "--font-geist-sans",
|
||||
@@ -14,20 +15,22 @@ const geistMono = Geist_Mono({
|
||||
});
|
||||
|
||||
export const metadata = {
|
||||
title: "Project Management Panel",
|
||||
description: "Professional project management dashboard",
|
||||
title: "Panel Zarządzania Projektami",
|
||||
description: "Profesjonalny panel zarządzania projektami",
|
||||
};
|
||||
|
||||
export default function RootLayout({ children }) {
|
||||
return (
|
||||
<html lang="en">
|
||||
<html lang="pl">
|
||||
<body
|
||||
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
|
||||
>
|
||||
<TranslationProvider initialLanguage="pl">
|
||||
<AuthProvider>
|
||||
<Navigation />
|
||||
<main>{children}</main>
|
||||
</AuthProvider>
|
||||
</TranslationProvider>
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
|
||||
1083
src/app/page.js
1083
src/app/page.js
File diff suppressed because it is too large
Load Diff
@@ -6,8 +6,8 @@ export default function ProjectTasksPage() {
|
||||
return (
|
||||
<PageContainer>
|
||||
<PageHeader
|
||||
title="Project Tasks"
|
||||
description="View and manage tasks across all projects in a structured list format"
|
||||
title="Zadania projektów"
|
||||
description="---"
|
||||
/>
|
||||
<ProjectTasksList />
|
||||
</PageContainer>
|
||||
|
||||
@@ -1,33 +1,88 @@
|
||||
import {
|
||||
getProjectWithContract,
|
||||
getNotesForProject,
|
||||
} from "@/lib/queries/projects";
|
||||
"use client";
|
||||
|
||||
import { useState, useEffect } from "react";
|
||||
import { useParams } from "next/navigation";
|
||||
import { useSession } from "next-auth/react";
|
||||
import NoteForm from "@/components/NoteForm";
|
||||
import ProjectTasksSection from "@/components/ProjectTasksSection";
|
||||
import FieldWithHistory from "@/components/FieldWithHistory";
|
||||
import { Card, CardHeader, CardContent } from "@/components/ui/Card";
|
||||
import Button from "@/components/ui/Button";
|
||||
import Badge from "@/components/ui/Badge";
|
||||
import Link from "next/link";
|
||||
import { differenceInCalendarDays, parseISO } from "date-fns";
|
||||
import { formatDate } from "@/lib/utils";
|
||||
import { formatDate, formatCoordinates } from "@/lib/utils";
|
||||
import PageContainer from "@/components/ui/PageContainer";
|
||||
import PageHeader from "@/components/ui/PageHeader";
|
||||
import ProjectStatusDropdown from "@/components/ProjectStatusDropdown";
|
||||
import ClientProjectMap from "@/components/ui/ClientProjectMap";
|
||||
|
||||
export default async function ProjectViewPage({ params }) {
|
||||
const { id } = await params;
|
||||
const project = await getProjectWithContract(id);
|
||||
const notes = await getNotesForProject(id);
|
||||
export default function ProjectViewPage() {
|
||||
const params = useParams();
|
||||
const { data: session } = useSession();
|
||||
const [project, setProject] = useState(null);
|
||||
const [notes, setNotes] = useState([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
|
||||
// Helper function to check if user can delete a note
|
||||
const canDeleteNote = (note) => {
|
||||
if (!session?.user) return false;
|
||||
|
||||
// Admins can delete any note
|
||||
if (session.user.role === 'admin') return true;
|
||||
|
||||
// Users can delete their own notes
|
||||
return note.created_by === session.user.id;
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
const fetchData = async () => {
|
||||
if (!params.id) return;
|
||||
|
||||
try {
|
||||
// Fetch project data
|
||||
const projectRes = await fetch(`/api/projects/${params.id}`);
|
||||
if (!projectRes.ok) {
|
||||
throw new Error('Project not found');
|
||||
}
|
||||
const projectData = await projectRes.json();
|
||||
|
||||
// Fetch notes data
|
||||
const notesRes = await fetch(`/api/notes?project_id=${params.id}`);
|
||||
const notesData = notesRes.ok ? await notesRes.json() : [];
|
||||
|
||||
setProject(projectData);
|
||||
setNotes(notesData);
|
||||
} catch (error) {
|
||||
console.error('Error fetching data:', error);
|
||||
setProject(null);
|
||||
setNotes([]);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
fetchData();
|
||||
}, [params.id]);
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<PageContainer>
|
||||
<div className="flex items-center justify-center py-12">
|
||||
<div className="text-gray-500">Loading...</div>
|
||||
</div>
|
||||
</PageContainer>
|
||||
);
|
||||
}
|
||||
|
||||
if (!project) {
|
||||
return (
|
||||
<PageContainer>
|
||||
<Card>
|
||||
<CardContent className="text-center py-8">
|
||||
<p className="text-red-600 text-lg">Project not found.</p>
|
||||
<p className="text-red-600 text-lg">Projekt nie został znaleziony.</p>
|
||||
<Link href="/projects" className="mt-4 inline-block">
|
||||
<Button variant="primary">Back to Projects</Button>
|
||||
<Button variant="primary">Powrót do projektów</Button>
|
||||
</Link>
|
||||
</CardContent>
|
||||
</Card>
|
||||
@@ -55,10 +110,10 @@ export default async function ProjectViewPage({ params }) {
|
||||
{daysRemaining !== null && (
|
||||
<Badge variant={getDeadlineVariant(daysRemaining)} size="md">
|
||||
{daysRemaining === 0
|
||||
? "Due Today"
|
||||
? "Termin dzisiaj"
|
||||
: daysRemaining > 0
|
||||
? `${daysRemaining} days left`
|
||||
: `${Math.abs(daysRemaining)} days overdue`}
|
||||
? `${daysRemaining} dni pozostało`
|
||||
: `${Math.abs(daysRemaining)} dni po terminie`}
|
||||
</Badge>
|
||||
)}
|
||||
<Link href="/projects">
|
||||
@@ -76,10 +131,10 @@ export default async function ProjectViewPage({ params }) {
|
||||
d="M15 19l-7-7 7-7"
|
||||
/>
|
||||
</svg>
|
||||
Back to Projects
|
||||
Powrót do projektów
|
||||
</Button>
|
||||
</Link>
|
||||
<Link href={`/projects/${id}/edit`}>
|
||||
<Link href={`/projects/${params.id}/edit`}>
|
||||
<Button variant="primary">
|
||||
<svg
|
||||
className="w-4 h-4 mr-2"
|
||||
@@ -94,7 +149,7 @@ export default async function ProjectViewPage({ params }) {
|
||||
d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"
|
||||
/>
|
||||
</svg>
|
||||
Edit Project
|
||||
Edytuj projekt
|
||||
</Button>
|
||||
</Link>
|
||||
</div>
|
||||
@@ -108,7 +163,7 @@ export default async function ProjectViewPage({ params }) {
|
||||
{" "}
|
||||
<div className="flex items-center justify-between">
|
||||
<h2 className="text-xl font-semibold text-gray-900">
|
||||
Project Information
|
||||
Informacje o projekcie
|
||||
</h2>
|
||||
<Badge
|
||||
variant={
|
||||
@@ -123,12 +178,12 @@ export default async function ProjectViewPage({ params }) {
|
||||
size="sm"
|
||||
>
|
||||
{project.project_type === "design"
|
||||
? "Design (P)"
|
||||
? "Projektowanie (P)"
|
||||
: project.project_type === "construction"
|
||||
? "Construction (R)"
|
||||
? "Realizacja (R)"
|
||||
: project.project_type === "design+construction"
|
||||
? "Design + Construction (P+R)"
|
||||
: "Unknown"}
|
||||
? "Projektowanie + Realizacja (P+R)"
|
||||
: "Nieznany"}
|
||||
</Badge>
|
||||
</div>
|
||||
</CardHeader>
|
||||
@@ -136,7 +191,7 @@ export default async function ProjectViewPage({ params }) {
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
|
||||
<div>
|
||||
<span className="text-sm font-medium text-gray-500 block mb-1">
|
||||
Location
|
||||
Lokalizacja
|
||||
</span>
|
||||
<p className="text-gray-900 font-medium">
|
||||
{project.city || "N/A"}
|
||||
@@ -144,7 +199,7 @@ export default async function ProjectViewPage({ params }) {
|
||||
</div>
|
||||
<div>
|
||||
<span className="text-sm font-medium text-gray-500 block mb-1">
|
||||
Address
|
||||
Adres
|
||||
</span>
|
||||
<p className="text-gray-900 font-medium">
|
||||
{project.address || "N/A"}
|
||||
@@ -152,7 +207,7 @@ export default async function ProjectViewPage({ params }) {
|
||||
</div>
|
||||
<div>
|
||||
<span className="text-sm font-medium text-gray-500 block mb-1">
|
||||
Plot
|
||||
Działka
|
||||
</span>
|
||||
<p className="text-gray-900 font-medium">
|
||||
{project.plot || "N/A"}
|
||||
@@ -160,7 +215,7 @@ export default async function ProjectViewPage({ params }) {
|
||||
</div>
|
||||
<div>
|
||||
<span className="text-sm font-medium text-gray-500 block mb-1">
|
||||
District
|
||||
Dzielnica
|
||||
</span>
|
||||
<p className="text-gray-900 font-medium">
|
||||
{project.district || "N/A"}
|
||||
@@ -168,22 +223,19 @@ export default async function ProjectViewPage({ params }) {
|
||||
</div>
|
||||
<div>
|
||||
<span className="text-sm font-medium text-gray-500 block mb-1">
|
||||
Unit
|
||||
Jednostka
|
||||
</span>
|
||||
<p className="text-gray-900 font-medium">
|
||||
{project.unit || "N/A"}
|
||||
</p>
|
||||
</div>{" "}
|
||||
<div>
|
||||
<span className="text-sm font-medium text-gray-500 block mb-1">
|
||||
Deadline
|
||||
</span>
|
||||
<p className="text-gray-900 font-medium">
|
||||
{project.finish_date
|
||||
? formatDate(project.finish_date)
|
||||
: "N/A"}
|
||||
</p>
|
||||
</div>
|
||||
<FieldWithHistory
|
||||
tableName="projects"
|
||||
recordId={project.project_id}
|
||||
fieldName="finish_date"
|
||||
currentValue={project.finish_date}
|
||||
label="Termin zakończenia"
|
||||
/>
|
||||
<div>
|
||||
<span className="text-sm font-medium text-gray-500 block mb-1">
|
||||
WP
|
||||
@@ -194,7 +246,7 @@ export default async function ProjectViewPage({ params }) {
|
||||
</div>
|
||||
<div>
|
||||
<span className="text-sm font-medium text-gray-500 block mb-1">
|
||||
Investment Number
|
||||
Numer inwestycji
|
||||
</span>
|
||||
<p className="text-gray-900 font-medium">
|
||||
{project.investment_number || "N/A"}
|
||||
@@ -205,7 +257,7 @@ export default async function ProjectViewPage({ params }) {
|
||||
{project.contact && (
|
||||
<div className="border-t pt-4">
|
||||
<span className="text-sm font-medium text-gray-500 block mb-1">
|
||||
Contact
|
||||
Kontakt
|
||||
</span>
|
||||
<p className="text-gray-900 font-medium">{project.contact}</p>
|
||||
</div>
|
||||
@@ -214,10 +266,10 @@ export default async function ProjectViewPage({ params }) {
|
||||
{project.coordinates && (
|
||||
<div className="border-t pt-4">
|
||||
<span className="text-sm font-medium text-gray-500 block mb-1">
|
||||
Coordinates
|
||||
Współrzędne
|
||||
</span>
|
||||
<p className="text-gray-900 font-medium font-mono text-sm">
|
||||
{project.coordinates}
|
||||
{formatCoordinates(project.coordinates)}
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
@@ -237,14 +289,14 @@ export default async function ProjectViewPage({ params }) {
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<h2 className="text-xl font-semibold text-gray-900">
|
||||
Contract Details
|
||||
Szczegóły umowy
|
||||
</h2>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-4">
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
|
||||
<div>
|
||||
<span className="text-sm font-medium text-gray-500 block mb-1">
|
||||
Contract Number
|
||||
Numer umowy
|
||||
</span>
|
||||
<p className="text-gray-900 font-medium">
|
||||
{project.contract_number || "N/A"}
|
||||
@@ -252,7 +304,7 @@ export default async function ProjectViewPage({ params }) {
|
||||
</div>
|
||||
<div>
|
||||
<span className="text-sm font-medium text-gray-500 block mb-1">
|
||||
Contract Name
|
||||
Nazwa umowy
|
||||
</span>
|
||||
<p className="text-gray-900 font-medium">
|
||||
{project.contract_name || "N/A"}
|
||||
@@ -260,7 +312,7 @@ export default async function ProjectViewPage({ params }) {
|
||||
</div>
|
||||
<div>
|
||||
<span className="text-sm font-medium text-gray-500 block mb-1">
|
||||
Customer
|
||||
Klient
|
||||
</span>
|
||||
<p className="text-gray-900 font-medium">
|
||||
{project.customer || "N/A"}
|
||||
@@ -268,7 +320,7 @@ export default async function ProjectViewPage({ params }) {
|
||||
</div>
|
||||
<div>
|
||||
<span className="text-sm font-medium text-gray-500 block mb-1">
|
||||
Investor
|
||||
Inwestor
|
||||
</span>
|
||||
<p className="text-gray-900 font-medium">
|
||||
{project.investor || "N/A"}
|
||||
@@ -284,21 +336,21 @@ export default async function ProjectViewPage({ params }) {
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<h2 className="text-lg font-semibold text-gray-900">
|
||||
Project Status
|
||||
Status projektu
|
||||
</h2>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-4">
|
||||
{" "}
|
||||
<div>
|
||||
<span className="text-sm font-medium text-gray-500 block mb-2">
|
||||
Current Status
|
||||
Aktualny status
|
||||
</span>
|
||||
<ProjectStatusDropdown project={project} size="md" />
|
||||
</div>
|
||||
{daysRemaining !== null && (
|
||||
<div className="border-t pt-4">
|
||||
<span className="text-sm font-medium text-gray-500 block mb-2">
|
||||
Timeline
|
||||
Harmonogram
|
||||
</span>
|
||||
<div className="text-center">
|
||||
<Badge
|
||||
@@ -306,10 +358,10 @@ export default async function ProjectViewPage({ params }) {
|
||||
size="lg"
|
||||
>
|
||||
{daysRemaining === 0
|
||||
? "Due Today"
|
||||
? "Termin dzisiaj"
|
||||
: daysRemaining > 0
|
||||
? `${daysRemaining} days remaining`
|
||||
: `${Math.abs(daysRemaining)} days overdue`}
|
||||
? `${daysRemaining} dni pozostało`
|
||||
: `${Math.abs(daysRemaining)} dni po terminie`}
|
||||
</Badge>
|
||||
</div>
|
||||
</div>
|
||||
@@ -321,11 +373,11 @@ export default async function ProjectViewPage({ params }) {
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<h2 className="text-lg font-semibold text-gray-900">
|
||||
Quick Actions
|
||||
Szybkie akcje
|
||||
</h2>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-3">
|
||||
<Link href={`/projects/${id}/edit`} className="block">
|
||||
<Link href={`/projects/${params.id}/edit`} className="block">
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
@@ -344,7 +396,7 @@ export default async function ProjectViewPage({ params }) {
|
||||
d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"
|
||||
/>
|
||||
</svg>
|
||||
Edit Project
|
||||
Edytuj projekt
|
||||
</Button>
|
||||
</Link>{" "}
|
||||
<Link href="/projects" className="block">
|
||||
@@ -366,7 +418,7 @@ export default async function ProjectViewPage({ params }) {
|
||||
d="M15 19l-7-7 7-7"
|
||||
/>
|
||||
</svg>
|
||||
Back to Projects
|
||||
Powrót do projektów
|
||||
</Button>
|
||||
</Link>
|
||||
<Link href="/projects/map" className="block">
|
||||
@@ -388,7 +440,7 @@ export default async function ProjectViewPage({ params }) {
|
||||
d="M9 20l-5.447-2.724A1 1 0 013 16.382V5.618a1 1 0 011.447-.894L9 7m0 13l6-3m-6 3V7m6 10l4.553 2.276A1 1 0 0021 18.382V7.618a1 1 0 00-1.447-.894L15 4m0 13V4m0 0L9 7"
|
||||
/>
|
||||
</svg>
|
||||
View All on Map
|
||||
Zobacz wszystkie na mapie
|
||||
</Button>
|
||||
</Link>
|
||||
</CardContent>
|
||||
@@ -404,7 +456,7 @@ export default async function ProjectViewPage({ params }) {
|
||||
{" "}
|
||||
<div className="flex items-center justify-between">
|
||||
<h2 className="text-xl font-semibold text-gray-900">
|
||||
Project Location
|
||||
Lokalizacja projektu
|
||||
</h2>
|
||||
{project.coordinates && (
|
||||
<Link
|
||||
@@ -428,7 +480,7 @@ export default async function ProjectViewPage({ params }) {
|
||||
d="M9 20l-5.447-2.724A1 1 0 013 16.382V5.618a1 1 0 011.447-.894L9 7m0 13l6-3m-6 3V7m6 10l4.553 2.276A1 1 0 0021 18.382V7.618a1 1 0 00-1.447-.894L15 4m0 13V4m0 0L9 7"
|
||||
/>
|
||||
</svg>
|
||||
View on Full Map
|
||||
Zobacz na pełnej mapie
|
||||
</Button>
|
||||
</Link>
|
||||
)}
|
||||
@@ -449,16 +501,16 @@ export default async function ProjectViewPage({ params }) {
|
||||
)}
|
||||
{/* Project Tasks Section */}
|
||||
<div className="mb-8">
|
||||
<ProjectTasksSection projectId={id} />
|
||||
<ProjectTasksSection projectId={params.id} />
|
||||
</div>
|
||||
{/* Notes Section */}
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<h2 className="text-xl font-semibold text-gray-900">Notes</h2>
|
||||
<h2 className="text-xl font-semibold text-gray-900">Notatki</h2>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="mb-6">
|
||||
<NoteForm projectId={id} />
|
||||
<NoteForm projectId={params.id} />
|
||||
</div>
|
||||
{notes.length === 0 ? (
|
||||
<div className="text-center py-12">
|
||||
@@ -475,10 +527,10 @@ export default async function ProjectViewPage({ params }) {
|
||||
</svg>
|
||||
</div>
|
||||
<h3 className="text-lg font-medium text-gray-900 mb-2">
|
||||
No notes yet
|
||||
Brak notatek
|
||||
</h3>
|
||||
<p className="text-gray-500">
|
||||
Add your first note using the form above.
|
||||
Dodaj swoją pierwszą notatkę używając formularza powyżej.
|
||||
</p>
|
||||
</div>
|
||||
) : (
|
||||
@@ -486,7 +538,7 @@ export default async function ProjectViewPage({ params }) {
|
||||
{notes.map((n) => (
|
||||
<div
|
||||
key={n.note_id}
|
||||
className="border border-gray-200 p-4 rounded-lg bg-gray-50 hover:bg-gray-100 transition-colors"
|
||||
className="border border-gray-200 p-4 rounded-lg bg-gray-50 hover:bg-gray-100 transition-colors group"
|
||||
>
|
||||
<div className="flex items-center justify-between mb-2">
|
||||
<div className="flex items-center gap-2">
|
||||
@@ -499,6 +551,44 @@ export default async function ProjectViewPage({ params }) {
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
{canDeleteNote(n) && (
|
||||
<button
|
||||
onClick={async () => {
|
||||
if (confirm('Czy na pewno chcesz usunąć tę notatkę?')) {
|
||||
try {
|
||||
const res = await fetch(`/api/notes/${n.note_id}`, {
|
||||
method: 'DELETE',
|
||||
});
|
||||
if (res.ok) {
|
||||
// Remove the note from local state instead of full page reload
|
||||
setNotes(prevNotes => prevNotes.filter(note => note.note_id !== n.note_id));
|
||||
} else {
|
||||
alert('Błąd podczas usuwania notatki');
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error deleting note:', error);
|
||||
alert('Błąd podczas usuwania notatki');
|
||||
}
|
||||
}
|
||||
}}
|
||||
className="opacity-0 group-hover:opacity-100 transition-opacity p-1 text-gray-400 hover:text-red-500 hover:bg-red-50 rounded"
|
||||
title="Usuń notatkę"
|
||||
>
|
||||
<svg
|
||||
className="w-4 h-4"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={2}
|
||||
d="M6 18L18 6M6 6l12 12"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
<p className="text-gray-900 leading-relaxed">{n.note}</p>
|
||||
</div>
|
||||
|
||||
@@ -29,6 +29,7 @@ function ProjectsMapPageContent() {
|
||||
in_progress_design: true,
|
||||
in_progress_construction: true,
|
||||
fulfilled: true,
|
||||
cancelled: true,
|
||||
});
|
||||
const [activeBaseLayer, setActiveBaseLayer] = useState("OpenStreetMap");
|
||||
const [activeOverlays, setActiveOverlays] = useState([]);
|
||||
@@ -57,6 +58,11 @@ function ProjectsMapPageContent() {
|
||||
label: "Completed",
|
||||
shortLabel: "Zakończony",
|
||||
},
|
||||
cancelled: {
|
||||
color: "#EF4444",
|
||||
label: "Cancelled",
|
||||
shortLabel: "Wycofany",
|
||||
},
|
||||
};
|
||||
|
||||
// Toggle all status filters
|
||||
|
||||
@@ -1,3 +1,6 @@
|
||||
"use client";
|
||||
|
||||
import { useTranslation } from "@/lib/i18n";
|
||||
import ProjectForm from "@/components/ProjectForm";
|
||||
import PageContainer from "@/components/ui/PageContainer";
|
||||
import PageHeader from "@/components/ui/PageHeader";
|
||||
@@ -5,11 +8,13 @@ import Button from "@/components/ui/Button";
|
||||
import Link from "next/link";
|
||||
|
||||
export default function NewProjectPage() {
|
||||
const { t } = useTranslation();
|
||||
|
||||
return (
|
||||
<PageContainer>
|
||||
<PageHeader
|
||||
title="Create New Project"
|
||||
description="Add a new project to your portfolio"
|
||||
title={t("projects.newProject")}
|
||||
// description={t("projects.noProjectsMessage")}
|
||||
action={
|
||||
<Link href="/projects">
|
||||
<Button variant="outline" size="sm">
|
||||
@@ -26,7 +31,7 @@ export default function NewProjectPage() {
|
||||
d="M15 19l-7-7 7-7"
|
||||
/>
|
||||
</svg>
|
||||
Back to Projects
|
||||
{t("common.back")}
|
||||
</Button>
|
||||
</Link>
|
||||
}
|
||||
|
||||
@@ -11,41 +11,78 @@ import PageHeader from "@/components/ui/PageHeader";
|
||||
import SearchBar from "@/components/ui/SearchBar";
|
||||
import { LoadingState } from "@/components/ui/States";
|
||||
import { formatDate } from "@/lib/utils";
|
||||
import { useTranslation } from "@/lib/i18n";
|
||||
|
||||
export default function ProjectListPage() {
|
||||
const { t } = useTranslation();
|
||||
const [projects, setProjects] = useState([]);
|
||||
const [searchTerm, setSearchTerm] = useState("");
|
||||
const [filteredProjects, setFilteredProjects] = useState([]);
|
||||
const [filters, setFilters] = useState({
|
||||
status: 'all',
|
||||
type: 'all',
|
||||
customer: 'all'
|
||||
});
|
||||
|
||||
const [customers, setCustomers] = useState([]);
|
||||
|
||||
useEffect(() => {
|
||||
fetch("/api/projects")
|
||||
.then((res) => res.json())
|
||||
.then((data) => {
|
||||
setProjects(data);
|
||||
setFilteredProjects(data);
|
||||
|
||||
// Extract unique customers for filter
|
||||
const uniqueCustomers = [...new Set(data.map(p => p.customer).filter(Boolean))];
|
||||
setCustomers(uniqueCustomers);
|
||||
});
|
||||
}, []);
|
||||
|
||||
// Filter projects based on search term
|
||||
// Filter projects based on search term and filters
|
||||
useEffect(() => {
|
||||
if (!searchTerm.trim()) {
|
||||
setFilteredProjects(projects);
|
||||
let filtered = projects;
|
||||
|
||||
// Apply status filter
|
||||
if (filters.status !== 'all') {
|
||||
if (filters.status === 'not_finished') {
|
||||
filtered = filtered.filter(project => project.project_status !== 'fulfilled');
|
||||
} else {
|
||||
const filtered = projects.filter((project) => {
|
||||
filtered = filtered.filter(project => project.project_status === filters.status);
|
||||
}
|
||||
}
|
||||
|
||||
// Apply type filter
|
||||
if (filters.type !== 'all') {
|
||||
filtered = filtered.filter(project => project.project_type === filters.type);
|
||||
}
|
||||
|
||||
// Apply customer filter
|
||||
if (filters.customer !== 'all') {
|
||||
filtered = filtered.filter(project => project.customer === filters.customer);
|
||||
}
|
||||
|
||||
// Apply search term
|
||||
if (searchTerm.trim()) {
|
||||
const searchLower = searchTerm.toLowerCase();
|
||||
filtered = filtered.filter((project) => {
|
||||
return (
|
||||
project.project_name?.toLowerCase().includes(searchLower) ||
|
||||
project.wp?.toLowerCase().includes(searchLower) ||
|
||||
project.plot?.toLowerCase().includes(searchLower) ||
|
||||
project.investment_number?.toLowerCase().includes(searchLower) ||
|
||||
project.address?.toLowerCase().includes(searchLower)
|
||||
project.address?.toLowerCase().includes(searchLower) ||
|
||||
project.customer?.toLowerCase().includes(searchLower) ||
|
||||
project.investor?.toLowerCase().includes(searchLower)
|
||||
);
|
||||
});
|
||||
setFilteredProjects(filtered);
|
||||
}
|
||||
}, [searchTerm, projects]);
|
||||
|
||||
setFilteredProjects(filtered);
|
||||
}, [searchTerm, projects, filters]);
|
||||
|
||||
async function handleDelete(id) {
|
||||
const confirmed = confirm("Are you sure you want to delete this project?");
|
||||
const confirmed = confirm(t('projects.deleteConfirm'));
|
||||
if (!confirmed) return;
|
||||
|
||||
const res = await fetch(`/api/projects/${id}`, {
|
||||
@@ -59,9 +96,45 @@ export default function ProjectListPage() {
|
||||
const handleSearchChange = (e) => {
|
||||
setSearchTerm(e.target.value);
|
||||
};
|
||||
|
||||
const handleFilterChange = (filterType, value) => {
|
||||
setFilters(prev => ({
|
||||
...prev,
|
||||
[filterType]: value
|
||||
}));
|
||||
};
|
||||
|
||||
const clearAllFilters = () => {
|
||||
setFilters({
|
||||
status: 'all',
|
||||
type: 'all',
|
||||
customer: 'all'
|
||||
});
|
||||
setSearchTerm('');
|
||||
};
|
||||
|
||||
const getStatusLabel = (status) => {
|
||||
switch(status) {
|
||||
case "registered": return t('projectStatus.registered');
|
||||
case "in_progress_design": return t('projectStatus.in_progress_design');
|
||||
case "in_progress_construction": return t('projectStatus.in_progress_construction');
|
||||
case "fulfilled": return t('projectStatus.fulfilled');
|
||||
case "cancelled": return t('projectStatus.cancelled');
|
||||
default: return "-";
|
||||
}
|
||||
};
|
||||
|
||||
const getTypeLabel = (type) => {
|
||||
switch(type) {
|
||||
case "design": return t('projectType.design');
|
||||
case "construction": return t('projectType.construction');
|
||||
case "design+construction": return t('projectType.design+construction');
|
||||
default: return "-";
|
||||
}
|
||||
};
|
||||
return (
|
||||
<PageContainer>
|
||||
<PageHeader title="Projects" description="Manage and track your projects">
|
||||
<PageHeader title={t('projects.title')} description={t('projects.subtitle')}>
|
||||
<div className="flex gap-2">
|
||||
<Link href="/projects/map">
|
||||
<Button variant="outline" size="lg">
|
||||
@@ -78,7 +151,7 @@ export default function ProjectListPage() {
|
||||
d="M9 20l-5.447-2.724A1 1 0 013 16.382V5.618a1 1 0 011.447-.894L9 7m0 13l6-3m-6 3V7m6 10l4.553 2.276A1 1 0 0021 18.382V7.618a1 1 0 00-.553-.894L15 4m0 13V4m0 0L9 7"
|
||||
/>
|
||||
</svg>
|
||||
Map View
|
||||
{t('projects.mapView') || 'Widok mapy'}
|
||||
</Button>
|
||||
</Link>
|
||||
<Link href="/projects/new">
|
||||
@@ -96,7 +169,7 @@ export default function ProjectListPage() {
|
||||
d="M12 4v16m8-8H4"
|
||||
/>
|
||||
</svg>
|
||||
Add Project
|
||||
{t('projects.newProject')}
|
||||
</Button>
|
||||
</Link>
|
||||
</div>
|
||||
@@ -105,10 +178,78 @@ export default function ProjectListPage() {
|
||||
<SearchBar
|
||||
searchTerm={searchTerm}
|
||||
onSearchChange={handleSearchChange}
|
||||
placeholder="Search by project name, WP, plot, or investment number..."
|
||||
placeholder={t('projects.searchPlaceholder')}
|
||||
resultsCount={filteredProjects.length}
|
||||
resultsText="projects"
|
||||
resultsText={t('projects.projects') || 'projektów'}
|
||||
/>
|
||||
|
||||
{/* Filters */}
|
||||
<Card className="mb-6">
|
||||
<CardContent className="p-4">
|
||||
<div className="flex flex-wrap gap-4 items-center">
|
||||
<div className="flex items-center gap-2">
|
||||
<label className="text-sm font-medium text-gray-700">{t('common.status') || 'Status'}:</label>
|
||||
<select
|
||||
value={filters.status}
|
||||
onChange={(e) => handleFilterChange('status', e.target.value)}
|
||||
className="px-3 py-1 border border-gray-300 rounded-md text-sm focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
>
|
||||
<option value="all">{t('common.all')}</option>
|
||||
<option value="not_finished">{t('projects.notFinished') || 'Nie zakończone'}</option>
|
||||
<option value="registered">{t('projectStatus.registered')}</option>
|
||||
<option value="in_progress_design">{t('projectStatus.in_progress_design')}</option>
|
||||
<option value="in_progress_construction">{t('projectStatus.in_progress_construction')}</option>
|
||||
<option value="fulfilled">{t('projectStatus.fulfilled')}</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-2">
|
||||
<label className="text-sm font-medium text-gray-700">{t('common.type') || 'Typ'}:</label>
|
||||
<select
|
||||
value={filters.type}
|
||||
onChange={(e) => handleFilterChange('type', e.target.value)}
|
||||
className="px-3 py-1 border border-gray-300 rounded-md text-sm focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
>
|
||||
<option value="all">{t('common.all')}</option>
|
||||
<option value="design">{t('projectType.design')}</option>
|
||||
<option value="construction">{t('projectType.construction')}</option>
|
||||
<option value="design+construction">{t('projectType.design+construction')}</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-2">
|
||||
<label className="text-sm font-medium text-gray-700">{t('contracts.customer') || 'Klient'}:</label>
|
||||
<select
|
||||
value={filters.customer}
|
||||
onChange={(e) => handleFilterChange('customer', e.target.value)}
|
||||
className="px-3 py-1 border border-gray-300 rounded-md text-sm focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
>
|
||||
<option value="all">{t('common.all')}</option>
|
||||
{customers.map((customer) => (
|
||||
<option key={customer} value={customer}>
|
||||
{customer}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
{(filters.status !== 'all' || filters.type !== 'all' || filters.customer !== 'all' || searchTerm) && (
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
onClick={clearAllFilters}
|
||||
className="text-xs"
|
||||
>
|
||||
{t('common.clearAllFilters') || 'Wyczyść wszystkie filtry'}
|
||||
</Button>
|
||||
)}
|
||||
|
||||
<div className="text-sm text-gray-500 ml-auto">
|
||||
{t('projects.showingResults', { shown: filteredProjects.length, total: projects.length }) || `Wyświetlono ${filteredProjects.length} z ${projects.length} projektów`}
|
||||
</div>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
{filteredProjects.length === 0 && searchTerm ? (
|
||||
<Card>
|
||||
<CardContent className="text-center py-12">
|
||||
@@ -126,14 +267,13 @@ export default function ProjectListPage() {
|
||||
</svg>
|
||||
</div>
|
||||
<h3 className="text-lg font-medium text-gray-900 mb-2">
|
||||
No projects found
|
||||
{t('common.noResults')}
|
||||
</h3>
|
||||
<p className="text-gray-500 mb-6">
|
||||
No projects match your search criteria. Try adjusting your search
|
||||
terms.
|
||||
{t('projects.noMatchingResults') || 'Brak projektów pasujących do kryteriów wyszukiwania. Spróbuj zmienić wyszukiwane frazy.'}
|
||||
</p>
|
||||
<Button variant="outline" onClick={() => setSearchTerm("")}>
|
||||
Clear Search
|
||||
{t('common.clearSearch') || 'Wyczyść wyszukiwanie'}
|
||||
</Button>
|
||||
</CardContent>
|
||||
</Card>
|
||||
@@ -154,13 +294,13 @@ export default function ProjectListPage() {
|
||||
</svg>
|
||||
</div>
|
||||
<h3 className="text-lg font-medium text-gray-900 mb-2">
|
||||
No projects yet
|
||||
{t('projects.noProjects')}
|
||||
</h3>
|
||||
<p className="text-gray-500 mb-6">
|
||||
Get started by creating your first project
|
||||
{t('projects.noProjectsMessage')}
|
||||
</p>
|
||||
<Link href="/projects/new">
|
||||
<Button variant="primary">Create First Project</Button>
|
||||
<Button variant="primary">{t('projects.createFirstProject') || 'Utwórz pierwszy projekt'}</Button>
|
||||
</Link>
|
||||
</CardContent>
|
||||
</Card>
|
||||
@@ -170,40 +310,34 @@ export default function ProjectListPage() {
|
||||
<thead>
|
||||
<tr className="bg-gray-100 border-b">
|
||||
<th className="text-left px-2 py-3 font-semibold text-xs text-gray-700 w-32">
|
||||
No.
|
||||
Nr.
|
||||
</th>
|
||||
<th className="text-left px-2 py-3 font-semibold text-xs text-gray-700">
|
||||
Project Name
|
||||
{t('projects.projectName')}
|
||||
</th>
|
||||
<th className="text-left px-2 py-3 font-semibold text-xs text-gray-700 w-40">
|
||||
WP
|
||||
</th>
|
||||
<th className="text-left px-2 py-3 font-semibold text-xs text-gray-700 w-20">
|
||||
City
|
||||
{t('projects.city')}
|
||||
</th>
|
||||
<th className="text-left px-2 py-3 font-semibold text-xs text-gray-700 w-40">
|
||||
Address
|
||||
{t('projects.address')}
|
||||
</th>
|
||||
<th className="text-left px-2 py-3 font-semibold text-xs text-gray-700 w-20">
|
||||
Plot
|
||||
{t('projects.plot')}
|
||||
</th>
|
||||
<th className="text-left px-2 py-3 font-semibold text-xs text-gray-700 w-24">
|
||||
Finish
|
||||
{t('projects.finishDate')}
|
||||
</th>
|
||||
<th className="text-left px-2 py-3 font-semibold text-xs text-gray-700 w-12">
|
||||
Type
|
||||
{t('common.type') || 'Typ'}
|
||||
</th>
|
||||
<th className="text-left px-2 py-3 font-semibold text-xs text-gray-700 w-24">
|
||||
Status
|
||||
</th>
|
||||
<th className="text-left px-2 py-3 font-semibold text-xs text-gray-700 w-24">
|
||||
Created By
|
||||
</th>
|
||||
<th className="text-left px-2 py-3 font-semibold text-xs text-gray-700 w-24">
|
||||
Assigned To
|
||||
{t('common.status') || 'Status'}
|
||||
</th>
|
||||
<th className="text-left px-2 py-3 font-semibold text-xs text-gray-700 w-20">
|
||||
Actions
|
||||
{t('common.actions') || 'Akcje'}
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
@@ -271,27 +405,7 @@ export default function ProjectListPage() {
|
||||
: "-"}
|
||||
</td>
|
||||
<td className="px-2 py-3 text-xs text-gray-600 truncate">
|
||||
{project.project_status === "registered"
|
||||
? "Zarejestr."
|
||||
: project.project_status === "in_progress_design"
|
||||
? "W real. (P)"
|
||||
: project.project_status === "in_progress_construction"
|
||||
? "W real. (R)"
|
||||
: project.project_status === "fulfilled"
|
||||
? "Zakończony"
|
||||
: "-"}
|
||||
</td>
|
||||
<td
|
||||
className="px-2 py-3 text-xs text-gray-600 truncate"
|
||||
title={project.created_by_name || "Unknown"}
|
||||
>
|
||||
{project.created_by_name || "Unknown"}
|
||||
</td>
|
||||
<td
|
||||
className="px-2 py-3 text-xs text-gray-600 truncate"
|
||||
title={project.assigned_to_name || "Unassigned"}
|
||||
>
|
||||
{project.assigned_to_name || "Unassigned"}
|
||||
{getStatusLabel(project.project_status)}
|
||||
</td>
|
||||
<td className="px-2 py-3">
|
||||
<Link href={`/projects/${project.project_id}`}>
|
||||
@@ -300,7 +414,7 @@ export default function ProjectListPage() {
|
||||
size="sm"
|
||||
className="text-xs px-2 py-1"
|
||||
>
|
||||
View
|
||||
{t('common.view') || 'Wyświetl'}
|
||||
</Button>
|
||||
</Link>
|
||||
</td>
|
||||
|
||||
@@ -14,8 +14,10 @@ import PageHeader from "@/components/ui/PageHeader";
|
||||
import SearchBar from "@/components/ui/SearchBar";
|
||||
import FilterBar from "@/components/ui/FilterBar";
|
||||
import { LoadingState } from "@/components/ui/States";
|
||||
import { useTranslation } from "@/lib/i18n";
|
||||
|
||||
export default function ProjectTasksPage() {
|
||||
const { t } = useTranslation();
|
||||
const [allTasks, setAllTasks] = useState([]);
|
||||
const [filteredTasks, setFilteredTasks] = useState([]);
|
||||
const [searchTerm, setSearchTerm] = useState("");
|
||||
@@ -148,25 +150,25 @@ export default function ProjectTasksPage() {
|
||||
|
||||
const filterOptions = [
|
||||
{
|
||||
label: "Status",
|
||||
label: t('tasks.status'),
|
||||
value: statusFilter,
|
||||
onChange: (e) => setStatusFilter(e.target.value),
|
||||
options: [
|
||||
{ value: "all", label: "All" },
|
||||
{ value: "pending", label: "Pending" },
|
||||
{ value: "in_progress", label: "In Progress" },
|
||||
{ value: "completed", label: "Completed" },
|
||||
{ value: "all", label: t('common.all') },
|
||||
{ value: "pending", label: t('taskStatus.pending') },
|
||||
{ value: "in_progress", label: t('taskStatus.in_progress') },
|
||||
{ value: "completed", label: t('taskStatus.completed') },
|
||||
],
|
||||
},
|
||||
{
|
||||
label: "Priority",
|
||||
label: t('tasks.priority'),
|
||||
value: priorityFilter,
|
||||
onChange: (e) => setPriorityFilter(e.target.value),
|
||||
options: [
|
||||
{ value: "all", label: "All" },
|
||||
{ value: "high", label: "High" },
|
||||
{ value: "normal", label: "Normal" },
|
||||
{ value: "low", label: "Low" },
|
||||
{ value: "all", label: t('common.all') },
|
||||
{ value: "high", label: t('tasks.high') },
|
||||
{ value: "normal", label: t('tasks.medium') },
|
||||
{ value: "low", label: t('tasks.low') },
|
||||
],
|
||||
},
|
||||
];
|
||||
@@ -174,8 +176,8 @@ export default function ProjectTasksPage() {
|
||||
return (
|
||||
<PageContainer>
|
||||
<PageHeader
|
||||
title="Project Tasks"
|
||||
description="Monitor and manage tasks across all projects"
|
||||
title={t('tasks.title')}
|
||||
description={t('tasks.subtitle')}
|
||||
/>
|
||||
<SearchBar
|
||||
searchTerm={searchTerm}
|
||||
@@ -206,7 +208,7 @@ export default function ProjectTasksPage() {
|
||||
</svg>
|
||||
</div>
|
||||
<div className="ml-4">
|
||||
<p className="text-sm font-medium text-gray-600">Total Tasks</p>
|
||||
<p className="text-sm font-medium text-gray-600">{t('dashboard.totalTasks')}</p>
|
||||
<p className="text-2xl font-bold text-gray-900">
|
||||
{statusCounts.all}
|
||||
</p>
|
||||
@@ -233,7 +235,7 @@ export default function ProjectTasksPage() {
|
||||
</svg>
|
||||
</div>
|
||||
<div className="ml-4">
|
||||
<p className="text-sm font-medium text-gray-600">Pending</p>
|
||||
<p className="text-sm font-medium text-gray-600">{t('taskStatus.pending')}</p>
|
||||
<p className="text-2xl font-bold text-gray-900">
|
||||
{statusCounts.pending}
|
||||
</p>
|
||||
@@ -260,7 +262,7 @@ export default function ProjectTasksPage() {
|
||||
</svg>
|
||||
</div>
|
||||
<div className="ml-4">
|
||||
<p className="text-sm font-medium text-gray-600">In Progress</p>
|
||||
<p className="text-sm font-medium text-gray-600">{t('taskStatus.in_progress')}</p>
|
||||
<p className="text-2xl font-bold text-gray-900">
|
||||
{statusCounts.in_progress}
|
||||
</p>
|
||||
@@ -287,7 +289,7 @@ export default function ProjectTasksPage() {
|
||||
</svg>
|
||||
</div>
|
||||
<div className="ml-4">
|
||||
<p className="text-sm font-medium text-gray-600">Completed</p>
|
||||
<p className="text-sm font-medium text-gray-600">{t('taskStatus.completed')}</p>
|
||||
<p className="text-2xl font-bold text-gray-900">
|
||||
{statusCounts.completed}
|
||||
</p>
|
||||
|
||||
@@ -89,20 +89,12 @@ export default function TaskTemplatesPage() {
|
||||
{template.description}
|
||||
</p>
|
||||
)}{" "}
|
||||
<div className="flex items-center justify-between">
|
||||
<span className="text-xs text-gray-500">
|
||||
Template ID: {template.task_id}
|
||||
</span>
|
||||
<div className="flex space-x-2">
|
||||
<div className="flex items-center justify-end">
|
||||
<Link href={`/tasks/templates/${template.task_id}/edit`}>
|
||||
<Button variant="outline" size="sm">
|
||||
Edit
|
||||
</Button>
|
||||
</Link>
|
||||
<Button variant="secondary" size="sm">
|
||||
Duplicate
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
126
src/components/FieldWithHistory.js
Normal file
126
src/components/FieldWithHistory.js
Normal file
@@ -0,0 +1,126 @@
|
||||
"use client";
|
||||
|
||||
import { useState, useEffect } from "react";
|
||||
import Tooltip from "@/components/ui/Tooltip";
|
||||
import { formatDate } from "@/lib/utils";
|
||||
|
||||
export default function FieldWithHistory({
|
||||
tableName,
|
||||
recordId,
|
||||
fieldName,
|
||||
currentValue,
|
||||
displayValue = null,
|
||||
label = null,
|
||||
className = "",
|
||||
}) {
|
||||
const [hasHistory, setHasHistory] = useState(false);
|
||||
const [history, setHistory] = useState([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
|
||||
useEffect(() => {
|
||||
const fetchHistory = async () => {
|
||||
try {
|
||||
const response = await fetch(
|
||||
`/api/field-history?table_name=${tableName}&record_id=${recordId}&field_name=${fieldName}`
|
||||
);
|
||||
if (response.ok) {
|
||||
const historyData = await response.json();
|
||||
setHistory(historyData);
|
||||
setHasHistory(historyData.length > 0);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Failed to fetch field history:", error);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
if (tableName && recordId && fieldName) {
|
||||
fetchHistory();
|
||||
} else {
|
||||
setLoading(false);
|
||||
}
|
||||
}, [tableName, recordId, fieldName]);
|
||||
|
||||
// Format value for display
|
||||
const getDisplayValue = (value) => {
|
||||
if (displayValue !== null) return displayValue;
|
||||
if (value && fieldName.includes("date")) {
|
||||
try {
|
||||
return formatDate(value);
|
||||
} catch {
|
||||
return value;
|
||||
}
|
||||
}
|
||||
return value || "N/A";
|
||||
};
|
||||
|
||||
// Create tooltip content
|
||||
const tooltipContent = history.length > 0 && (
|
||||
<div className="space-y-2">
|
||||
<div className="font-medium text-white mb-2">Change History:</div>
|
||||
{history.map((change, index) => (
|
||||
<div key={change.id} className="text-xs border-b border-gray-600 pb-1 last:border-b-0">
|
||||
<div className="flex justify-between items-start gap-2">
|
||||
<div className="flex-1">
|
||||
<div className="text-white font-medium">
|
||||
Changed to: {getDisplayValue(change.new_value)}
|
||||
</div>
|
||||
{change.old_value && (
|
||||
<div className="text-gray-400 text-xs">
|
||||
From: {getDisplayValue(change.old_value)}
|
||||
</div>
|
||||
)}
|
||||
{change.changed_by_name && (
|
||||
<div className="text-gray-300">
|
||||
by {change.changed_by_name}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="text-gray-400 text-right text-xs">
|
||||
{formatDate(change.changed_at)}
|
||||
</div>
|
||||
</div>
|
||||
{change.change_reason && (
|
||||
<div className="text-gray-400 text-xs mt-1">
|
||||
Reason: {change.change_reason}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<div className={className}>
|
||||
{label && <span className="text-sm font-medium text-gray-500 block mb-1">{label}</span>}
|
||||
<p className="text-gray-900 font-medium">{getDisplayValue(currentValue)}</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className={className}>
|
||||
{label && <span className="text-sm font-medium text-gray-500 block mb-1">{label}</span>}
|
||||
<div className="flex items-center gap-2">
|
||||
<p className="text-gray-900 font-medium">{getDisplayValue(currentValue)}</p>
|
||||
{hasHistory && (
|
||||
<Tooltip content={tooltipContent}>
|
||||
<svg
|
||||
className="w-4 h-4 text-blue-500 hover:text-blue-700 cursor-help"
|
||||
fill="currentColor"
|
||||
viewBox="0 0 20 20"
|
||||
>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z"
|
||||
clipRule="evenodd"
|
||||
/>
|
||||
</svg>
|
||||
</Tooltip>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
177
src/components/FileAttachmentsList.js
Normal file
177
src/components/FileAttachmentsList.js
Normal file
@@ -0,0 +1,177 @@
|
||||
"use client";
|
||||
|
||||
import { useState, useEffect } from "react";
|
||||
import Button from "@/components/ui/Button";
|
||||
import { formatDate } from "@/lib/utils";
|
||||
|
||||
export default function FileAttachmentsList({ entityType, entityId, onFilesChange }) {
|
||||
const [files, setFiles] = useState([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
|
||||
const fetchFiles = async () => {
|
||||
try {
|
||||
const response = await fetch(`/api/files?entityType=${entityType}&entityId=${entityId}`);
|
||||
if (response.ok) {
|
||||
const filesData = await response.json();
|
||||
setFiles(filesData);
|
||||
if (onFilesChange) {
|
||||
onFilesChange(filesData);
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error fetching files:", error);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
fetchFiles();
|
||||
}, [entityType, entityId]);
|
||||
|
||||
const handleDelete = async (fileId) => {
|
||||
if (!confirm("Are you sure you want to delete this file?")) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const response = await fetch(`/api/files/${fileId}`, {
|
||||
method: "DELETE",
|
||||
});
|
||||
|
||||
if (response.ok) {
|
||||
setFiles(files.filter(file => file.file_id !== fileId));
|
||||
if (onFilesChange) {
|
||||
onFilesChange(files.filter(file => file.file_id !== fileId));
|
||||
}
|
||||
} else {
|
||||
alert("Failed to delete file");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error deleting file:", error);
|
||||
alert("Failed to delete file");
|
||||
}
|
||||
};
|
||||
|
||||
const formatFileSize = (bytes) => {
|
||||
if (bytes === 0) return '0 Bytes';
|
||||
const k = 1024;
|
||||
const sizes = ['Bytes', 'KB', 'MB', 'GB'];
|
||||
const i = Math.floor(Math.log(bytes) / Math.log(k));
|
||||
return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
|
||||
};
|
||||
|
||||
const getFileIcon = (mimeType) => {
|
||||
if (mimeType.startsWith('image/')) {
|
||||
return (
|
||||
<svg className="w-5 h-5 text-blue-500" fill="currentColor" viewBox="0 0 20 20">
|
||||
<path fillRule="evenodd" d="M4 3a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V5a2 2 0 00-2-2H4zm12 12H4l4-8 3 6 2-4 3 6z" clipRule="evenodd" />
|
||||
</svg>
|
||||
);
|
||||
} else if (mimeType === 'application/pdf') {
|
||||
return (
|
||||
<svg className="w-5 h-5 text-red-500" fill="currentColor" viewBox="0 0 20 20">
|
||||
<path fillRule="evenodd" d="M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4z" clipRule="evenodd" />
|
||||
</svg>
|
||||
);
|
||||
} else if (mimeType.includes('word') || mimeType.includes('document')) {
|
||||
return (
|
||||
<svg className="w-5 h-5 text-blue-600" fill="currentColor" viewBox="0 0 20 20">
|
||||
<path fillRule="evenodd" d="M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4z" clipRule="evenodd" />
|
||||
</svg>
|
||||
);
|
||||
} else if (mimeType.includes('excel') || mimeType.includes('sheet')) {
|
||||
return (
|
||||
<svg className="w-5 h-5 text-green-600" fill="currentColor" viewBox="0 0 20 20">
|
||||
<path fillRule="evenodd" d="M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4z" clipRule="evenodd" />
|
||||
</svg>
|
||||
);
|
||||
} else {
|
||||
return (
|
||||
<svg className="w-5 h-5 text-gray-500" fill="currentColor" viewBox="0 0 20 20">
|
||||
<path fillRule="evenodd" d="M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4z" clipRule="evenodd" />
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<div className="flex items-center justify-center py-8">
|
||||
<svg className="animate-spin h-6 w-6 text-gray-400" fill="none" viewBox="0 0 24 24">
|
||||
<circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4" />
|
||||
<path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" />
|
||||
</svg>
|
||||
<span className="ml-2 text-gray-500">Loading files...</span>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (files.length === 0) {
|
||||
return (
|
||||
<div className="text-center py-8">
|
||||
<svg className="w-12 h-12 text-gray-300 mx-auto mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
|
||||
</svg>
|
||||
<p className="text-gray-500">No documents uploaded yet</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="space-y-3">
|
||||
{files.map((file) => (
|
||||
<div
|
||||
key={file.file_id}
|
||||
className="flex items-center justify-between p-3 border border-gray-200 rounded-lg hover:bg-gray-50"
|
||||
>
|
||||
<div className="flex items-center flex-1 min-w-0">
|
||||
<div className="flex-shrink-0 mr-3">
|
||||
{getFileIcon(file.mime_type)}
|
||||
</div>
|
||||
<div className="min-w-0 flex-1">
|
||||
<div className="text-sm font-medium text-gray-900 truncate">
|
||||
{file.original_filename}
|
||||
</div>
|
||||
<div className="text-xs text-gray-500 flex items-center gap-2">
|
||||
<span>{formatFileSize(file.file_size)}</span>
|
||||
<span>•</span>
|
||||
<span>{formatDate(file.upload_date, { includeTime: true })}</span>
|
||||
</div>
|
||||
{file.description && (
|
||||
<div className="text-xs text-gray-600 mt-1 truncate">
|
||||
{file.description}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex items-center gap-2 ml-3">
|
||||
<a
|
||||
href={file.file_path}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="text-blue-600 hover:text-blue-800"
|
||||
>
|
||||
<Button variant="outline" size="sm">
|
||||
<svg className="w-4 h-4 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
|
||||
</svg>
|
||||
Download
|
||||
</Button>
|
||||
</a>
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
onClick={() => handleDelete(file.file_id)}
|
||||
className="text-red-600 hover:text-red-800 hover:border-red-300"
|
||||
>
|
||||
<svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" />
|
||||
</svg>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
186
src/components/FileUploadModal.js
Normal file
186
src/components/FileUploadModal.js
Normal file
@@ -0,0 +1,186 @@
|
||||
"use client";
|
||||
|
||||
import { useState, useRef } from "react";
|
||||
import Button from "@/components/ui/Button";
|
||||
|
||||
export default function FileUploadModal({
|
||||
isOpen,
|
||||
onClose,
|
||||
entityType,
|
||||
entityId,
|
||||
onFileUploaded
|
||||
}) {
|
||||
const [dragActive, setDragActive] = useState(false);
|
||||
const [uploading, setUploading] = useState(false);
|
||||
const [description, setDescription] = useState("");
|
||||
const fileInputRef = useRef(null);
|
||||
|
||||
const handleDrag = (e) => {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
if (e.type === "dragenter" || e.type === "dragover") {
|
||||
setDragActive(true);
|
||||
} else if (e.type === "dragleave") {
|
||||
setDragActive(false);
|
||||
}
|
||||
};
|
||||
|
||||
const handleDrop = (e) => {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
setDragActive(false);
|
||||
|
||||
if (e.dataTransfer.files && e.dataTransfer.files[0]) {
|
||||
handleFiles(e.dataTransfer.files);
|
||||
}
|
||||
};
|
||||
|
||||
const handleChange = (e) => {
|
||||
e.preventDefault();
|
||||
if (e.target.files && e.target.files[0]) {
|
||||
handleFiles(e.target.files);
|
||||
}
|
||||
};
|
||||
|
||||
const handleFiles = async (files) => {
|
||||
const file = files[0];
|
||||
if (!file) return;
|
||||
|
||||
setUploading(true);
|
||||
|
||||
try {
|
||||
const formData = new FormData();
|
||||
formData.append("file", file);
|
||||
formData.append("entityType", entityType);
|
||||
formData.append("entityId", entityId.toString());
|
||||
formData.append("description", description);
|
||||
|
||||
const response = await fetch("/api/files", {
|
||||
method: "POST",
|
||||
body: formData,
|
||||
});
|
||||
|
||||
if (response.ok) {
|
||||
const uploadedFile = await response.json();
|
||||
onFileUploaded(uploadedFile);
|
||||
setDescription("");
|
||||
onClose();
|
||||
} else {
|
||||
const error = await response.json();
|
||||
alert(error.error || "Failed to upload file");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Upload error:", error);
|
||||
alert("Failed to upload file");
|
||||
} finally {
|
||||
setUploading(false);
|
||||
}
|
||||
};
|
||||
|
||||
const onButtonClick = () => {
|
||||
fileInputRef.current?.click();
|
||||
};
|
||||
|
||||
if (!isOpen) return null;
|
||||
|
||||
return (
|
||||
<div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
|
||||
<div className="bg-white rounded-lg p-6 w-full max-w-md mx-4">
|
||||
<div className="flex items-center justify-between mb-6">
|
||||
<h3 className="text-lg font-semibold text-gray-900">
|
||||
Upload Document
|
||||
</h3>
|
||||
<button
|
||||
onClick={onClose}
|
||||
className="text-gray-400 hover:text-gray-600"
|
||||
disabled={uploading}
|
||||
>
|
||||
<svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="space-y-4">
|
||||
{/* Description Input */}
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Description (optional)
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
value={description}
|
||||
onChange={(e) => setDescription(e.target.value)}
|
||||
placeholder="Brief description of the document..."
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500"
|
||||
disabled={uploading}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* File Drop Zone */}
|
||||
<div
|
||||
className={`relative border-2 border-dashed rounded-lg p-8 text-center transition-colors ${
|
||||
dragActive
|
||||
? "border-blue-400 bg-blue-50"
|
||||
: "border-gray-300 hover:border-gray-400"
|
||||
} ${uploading ? "opacity-50 pointer-events-none" : ""}`}
|
||||
onDragEnter={handleDrag}
|
||||
onDragLeave={handleDrag}
|
||||
onDragOver={handleDrag}
|
||||
onDrop={handleDrop}
|
||||
>
|
||||
<input
|
||||
ref={fileInputRef}
|
||||
type="file"
|
||||
className="hidden"
|
||||
onChange={handleChange}
|
||||
accept=".pdf,.doc,.docx,.xls,.xlsx,.jpg,.jpeg,.png,.gif,.txt"
|
||||
disabled={uploading}
|
||||
/>
|
||||
|
||||
{uploading ? (
|
||||
<div className="flex flex-col items-center">
|
||||
<svg className="animate-spin h-8 w-8 text-blue-600 mb-2" fill="none" viewBox="0 0 24 24">
|
||||
<circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4" />
|
||||
<path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" />
|
||||
</svg>
|
||||
<span className="text-sm text-gray-600">Uploading...</span>
|
||||
</div>
|
||||
) : (
|
||||
<div className="flex flex-col items-center">
|
||||
<svg className="w-12 h-12 text-gray-400 mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12" />
|
||||
</svg>
|
||||
<span className="text-sm font-medium text-gray-900 mb-2">
|
||||
Drop files here or click to browse
|
||||
</span>
|
||||
<span className="text-xs text-gray-500 mb-4">
|
||||
PDF, DOC, XLS, Images up to 10MB
|
||||
</span>
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
onClick={onButtonClick}
|
||||
disabled={uploading}
|
||||
>
|
||||
Choose File
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex justify-end gap-3 mt-6">
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
onClick={onClose}
|
||||
disabled={uploading}
|
||||
>
|
||||
Cancel
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
114
src/components/FinishDateWithHistory.js
Normal file
114
src/components/FinishDateWithHistory.js
Normal file
@@ -0,0 +1,114 @@
|
||||
"use client";
|
||||
|
||||
import { useState, useEffect } from "react";
|
||||
import Tooltip from "@/components/ui/Tooltip";
|
||||
import { formatDate } from "@/lib/utils";
|
||||
|
||||
export default function FinishDateWithHistory({ projectId, finishDate }) {
|
||||
const [hasUpdates, setHasUpdates] = useState(false);
|
||||
const [updates, setUpdates] = useState([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
|
||||
useEffect(() => {
|
||||
const fetchUpdates = async () => {
|
||||
try {
|
||||
const res = await fetch(`/api/projects/${projectId}/finish-date-updates`);
|
||||
if (res.ok) {
|
||||
const data = await res.json();
|
||||
setUpdates(data);
|
||||
setHasUpdates(data.length > 0);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Failed to fetch finish date updates:", error);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
if (projectId) {
|
||||
fetchUpdates();
|
||||
}
|
||||
}, [projectId]);
|
||||
|
||||
const formatDateTime = (dateString) => {
|
||||
const date = new Date(dateString);
|
||||
return date.toLocaleDateString("pl-PL", {
|
||||
year: "numeric",
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
hour: "2-digit",
|
||||
minute: "2-digit",
|
||||
});
|
||||
};
|
||||
|
||||
const tooltipContent = (
|
||||
<div className="space-y-2">
|
||||
<div className="font-medium text-xs text-gray-300 mb-2">
|
||||
Historia zmian terminu:
|
||||
</div>
|
||||
{updates.map((update, index) => (
|
||||
<div key={update.id} className="text-xs">
|
||||
<div className="flex justify-between items-start gap-2">
|
||||
<div>
|
||||
<div className="font-medium">
|
||||
{update.new_finish_date
|
||||
? formatDate(update.new_finish_date)
|
||||
: "Usunięto termin"}
|
||||
</div>
|
||||
{update.old_finish_date && (
|
||||
<div className="text-gray-400 text-xs">
|
||||
poprzednio: {formatDate(update.old_finish_date)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<div className="text-gray-400 text-xs mt-1">
|
||||
{update.updated_by_name && (
|
||||
<span>przez {update.updated_by_name} • </span>
|
||||
)}
|
||||
<span>{formatDateTime(update.updated_at)}</span>
|
||||
</div>
|
||||
{update.reason && (
|
||||
<div className="text-gray-300 text-xs mt-1 italic">
|
||||
"{update.reason}"
|
||||
</div>
|
||||
)}
|
||||
{index < updates.length - 1 && (
|
||||
<div className="border-b border-gray-600 my-2"></div>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<p className="text-gray-900 font-medium">
|
||||
{finishDate ? formatDate(finishDate) : "N/A"}
|
||||
</p>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="flex items-center gap-1">
|
||||
<p className="text-gray-900 font-medium">
|
||||
{finishDate ? formatDate(finishDate) : "N/A"}
|
||||
</p>
|
||||
{hasUpdates && (
|
||||
<Tooltip content={tooltipContent} position="top">
|
||||
<svg
|
||||
className="w-4 h-4 text-blue-500 cursor-help hover:text-blue-600 transition-colors"
|
||||
fill="currentColor"
|
||||
viewBox="0 0 20 20"
|
||||
>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z"
|
||||
clipRule="evenodd"
|
||||
/>
|
||||
</svg>
|
||||
</Tooltip>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,8 +1,10 @@
|
||||
"use client";
|
||||
|
||||
import React, { useState } from "react";
|
||||
import { useTranslation } from "@/lib/i18n";
|
||||
|
||||
export default function NoteForm({ projectId }) {
|
||||
const { t } = useTranslation();
|
||||
const [note, setNote] = useState("");
|
||||
const [status, setStatus] = useState(null);
|
||||
|
||||
@@ -17,10 +19,10 @@ export default function NoteForm({ projectId }) {
|
||||
|
||||
if (res.ok) {
|
||||
setNote("");
|
||||
setStatus("Note added");
|
||||
setStatus(t("common.addNoteSuccess"));
|
||||
window.location.reload();
|
||||
} else {
|
||||
setStatus("Failed to save note");
|
||||
setStatus(t("common.addNoteError"));
|
||||
}
|
||||
}
|
||||
|
||||
@@ -29,7 +31,7 @@ export default function NoteForm({ projectId }) {
|
||||
<textarea
|
||||
value={note}
|
||||
onChange={(e) => setNote(e.target.value)}
|
||||
placeholder="Add a new note..."
|
||||
placeholder={t("common.addNotePlaceholder")}
|
||||
className="border p-2 w-full"
|
||||
rows={3}
|
||||
required
|
||||
@@ -38,7 +40,7 @@ export default function NoteForm({ projectId }) {
|
||||
type="submit"
|
||||
className="bg-blue-600 text-white px-4 py-2 rounded"
|
||||
>
|
||||
Add Note
|
||||
{t("common.addNote")}
|
||||
</button>
|
||||
{status && <p className="text-sm text-gray-600">{status}</p>}
|
||||
</form>
|
||||
|
||||
@@ -6,8 +6,10 @@ import { Card, CardHeader, CardContent } from "@/components/ui/Card";
|
||||
import Button from "@/components/ui/Button";
|
||||
import { Input } from "@/components/ui/Input";
|
||||
import { formatDateForInput } from "@/lib/utils";
|
||||
import { useTranslation } from "@/lib/i18n";
|
||||
|
||||
export default function ProjectForm({ initialData = null }) {
|
||||
const { t } = useTranslation();
|
||||
const [form, setForm] = useState({
|
||||
contract_id: "",
|
||||
project_name: "",
|
||||
@@ -101,11 +103,11 @@ export default function ProjectForm({ initialData = null }) {
|
||||
router.push("/projects");
|
||||
}
|
||||
} else {
|
||||
alert("Failed to save project.");
|
||||
alert(t('projects.saveError'));
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error saving project:", error);
|
||||
alert("Failed to save project.");
|
||||
alert(t('projects.saveError'));
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
@@ -114,7 +116,7 @@ export default function ProjectForm({ initialData = null }) {
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<h2 className="text-xl font-semibold text-gray-900">
|
||||
{isEdit ? "Edit Project Details" : "Project Details"}
|
||||
{isEdit ? t('projects.editProjectDetails') : t('projects.projectDetails')}
|
||||
</h2>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
@@ -123,7 +125,7 @@ export default function ProjectForm({ initialData = null }) {
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-6">
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Contract <span className="text-red-500">*</span>
|
||||
{t('projects.contract')} <span className="text-red-500">*</span>
|
||||
</label>
|
||||
<select
|
||||
name="contract_id"
|
||||
@@ -132,7 +134,7 @@ export default function ProjectForm({ initialData = null }) {
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500"
|
||||
required
|
||||
>
|
||||
<option value="">Select Contract</option>
|
||||
<option value="">{t('projects.selectContract')}</option>
|
||||
{contracts.map((contract) => (
|
||||
<option
|
||||
key={contract.contract_id}
|
||||
@@ -146,7 +148,7 @@ export default function ProjectForm({ initialData = null }) {
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Project Type <span className="text-red-500">*</span>
|
||||
{t('projects.type')} <span className="text-red-500">*</span>
|
||||
</label>
|
||||
<select
|
||||
name="project_type"
|
||||
@@ -155,17 +157,17 @@ export default function ProjectForm({ initialData = null }) {
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500"
|
||||
required
|
||||
>
|
||||
<option value="design">Design (Projektowanie)</option>
|
||||
<option value="construction">Construction (Realizacja)</option>
|
||||
<option value="design">{t('projectType.design')}</option>
|
||||
<option value="construction">{t('projectType.construction')}</option>
|
||||
<option value="design+construction">
|
||||
Design + Construction (Projektowanie + Realizacja)
|
||||
{t('projectType.design+construction')}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Assigned To
|
||||
{t('projects.assignedTo')}
|
||||
</label>
|
||||
<select
|
||||
name="assigned_to"
|
||||
@@ -173,10 +175,10 @@ export default function ProjectForm({ initialData = null }) {
|
||||
onChange={handleChange}
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500"
|
||||
>
|
||||
<option value="">Unassigned</option>
|
||||
<option value="">{t('projects.unassigned')}</option>
|
||||
{users.map((user) => (
|
||||
<option key={user.id} value={user.id}>
|
||||
{user.name} ({user.email})
|
||||
{user.name} ({user.username})
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
@@ -186,92 +188,92 @@ export default function ProjectForm({ initialData = null }) {
|
||||
{/* Basic Information Section */}
|
||||
<div className="border-t pt-6">
|
||||
<h3 className="text-lg font-medium text-gray-900 mb-4">
|
||||
Basic Information
|
||||
{t('projects.basicInformation')}
|
||||
</h3>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div className="md:col-span-2">
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Project Name <span className="text-red-500">*</span>
|
||||
{t('projects.projectName')} <span className="text-red-500">*</span>
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="project_name"
|
||||
value={form.project_name || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter project name"
|
||||
placeholder={t('projects.enterProjectName')}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
City
|
||||
{t('projects.city')}
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="city"
|
||||
value={form.city || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter city"
|
||||
placeholder={t('projects.enterCity')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Address
|
||||
{t('projects.address')}
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="address"
|
||||
value={form.address || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter address"
|
||||
placeholder={t('projects.enterAddress')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Plot
|
||||
{t('projects.plot')}
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="plot"
|
||||
value={form.plot || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter plot number"
|
||||
placeholder={t('projects.enterPlotNumber')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
District
|
||||
{t('projects.district')}
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="district"
|
||||
value={form.district || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter district"
|
||||
placeholder={t('projects.enterDistrict')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Unit
|
||||
{t('projects.unit')}
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="unit"
|
||||
value={form.unit || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter unit"
|
||||
placeholder={t('projects.enterUnit')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Finish Date
|
||||
</label>{" "}
|
||||
{t('projects.finishDate')}
|
||||
</label>
|
||||
<Input
|
||||
type="date"
|
||||
name="finish_date"
|
||||
@@ -285,19 +287,19 @@ export default function ProjectForm({ initialData = null }) {
|
||||
{/* Additional Information Section */}
|
||||
<div className="border-t pt-6">
|
||||
<h3 className="text-lg font-medium text-gray-900 mb-4">
|
||||
Additional Information
|
||||
{t('projects.additionalInfo')}
|
||||
</h3>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Investment Number
|
||||
{t('projects.investmentNumber')}
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="investment_number"
|
||||
value={form.investment_number || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter investment number"
|
||||
placeholder={t('projects.placeholders.investmentNumber')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -310,39 +312,39 @@ export default function ProjectForm({ initialData = null }) {
|
||||
name="wp"
|
||||
value={form.wp || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter WP"
|
||||
placeholder={t('projects.placeholders.wp')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="md:col-span-2">
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Contact Information
|
||||
{t('projects.contact')}
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="contact"
|
||||
value={form.contact || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter contact details"
|
||||
placeholder={t('projects.placeholders.contact')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="md:col-span-2">
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Coordinates
|
||||
{t('projects.coordinates')}
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="coordinates"
|
||||
value={form.coordinates || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="e.g., 49.622958,20.629562"
|
||||
placeholder={t('projects.placeholders.coordinates')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="md:col-span-2">
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Notes
|
||||
{t('projects.notes')}
|
||||
</label>
|
||||
<textarea
|
||||
name="notes"
|
||||
@@ -350,7 +352,7 @@ export default function ProjectForm({ initialData = null }) {
|
||||
onChange={handleChange}
|
||||
rows={4}
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500"
|
||||
placeholder="Enter any additional notes"
|
||||
placeholder={t('projects.placeholders.notes')}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -364,7 +366,7 @@ export default function ProjectForm({ initialData = null }) {
|
||||
onClick={() => router.back()}
|
||||
disabled={loading}
|
||||
>
|
||||
Cancel
|
||||
{t('common.cancel')}
|
||||
</Button>
|
||||
<Button type="submit" variant="primary" disabled={loading}>
|
||||
{loading ? (
|
||||
@@ -389,7 +391,7 @@ export default function ProjectForm({ initialData = null }) {
|
||||
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
||||
></path>
|
||||
</svg>
|
||||
{isEdit ? "Updating..." : "Creating..."}
|
||||
{isEdit ? t('projects.updating') : t('projects.creating')}
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
@@ -408,7 +410,7 @@ export default function ProjectForm({ initialData = null }) {
|
||||
d="M5 13l4 4L19 7"
|
||||
/>
|
||||
</svg>
|
||||
Update Project
|
||||
{t('projects.updateProject')}
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
@@ -425,7 +427,7 @@ export default function ProjectForm({ initialData = null }) {
|
||||
d="M12 4v16m8-8H4"
|
||||
/>
|
||||
</svg>
|
||||
Create Project
|
||||
{t('projects.createProject')}
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
|
||||
@@ -3,12 +3,14 @@
|
||||
import { useState, useEffect, useRef } from "react";
|
||||
import { createPortal } from "react-dom";
|
||||
import Badge from "@/components/ui/Badge";
|
||||
import { useTranslation } from "@/lib/i18n";
|
||||
|
||||
export default function ProjectStatusDropdown({
|
||||
project,
|
||||
size = "md",
|
||||
showDropdown = true,
|
||||
}) {
|
||||
const { t } = useTranslation();
|
||||
const [status, setStatus] = useState(project.project_status);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [isOpen, setIsOpen] = useState(false);
|
||||
@@ -21,21 +23,25 @@ export default function ProjectStatusDropdown({
|
||||
|
||||
const statusConfig = {
|
||||
registered: {
|
||||
label: "Registered",
|
||||
label: t("projectStatus.registered"),
|
||||
variant: "secondary",
|
||||
},
|
||||
in_progress_design: {
|
||||
label: "In Progress (Design)",
|
||||
label: t("projectStatus.in_progress_design"),
|
||||
variant: "primary",
|
||||
},
|
||||
in_progress_construction: {
|
||||
label: "In Progress (Construction)",
|
||||
label: t("projectStatus.in_progress_construction"),
|
||||
variant: "primary",
|
||||
},
|
||||
fulfilled: {
|
||||
label: "Completed",
|
||||
label: t("projectStatus.fulfilled"),
|
||||
variant: "success",
|
||||
},
|
||||
cancelled: {
|
||||
label: t("projectStatus.cancelled"),
|
||||
variant: "danger",
|
||||
},
|
||||
};
|
||||
const handleChange = async (newStatus) => {
|
||||
if (newStatus === status) {
|
||||
@@ -48,11 +54,19 @@ export default function ProjectStatusDropdown({
|
||||
setIsOpen(false);
|
||||
|
||||
try {
|
||||
await fetch(`/api/projects/${project.project_id}`, {
|
||||
const updateData = { ...project, project_status: newStatus };
|
||||
|
||||
const response = await fetch(`/api/projects/${project.project_id}`, {
|
||||
method: "PUT",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({ ...project, project_status: newStatus }),
|
||||
body: JSON.stringify(updateData),
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
const errorData = await response.json();
|
||||
console.error('Update failed:', errorData);
|
||||
}
|
||||
|
||||
window.location.reload();
|
||||
} catch (error) {
|
||||
console.error("Failed to update status:", error);
|
||||
@@ -73,9 +87,6 @@ export default function ProjectStatusDropdown({
|
||||
}
|
||||
};
|
||||
const handleOpen = () => {
|
||||
console.log(
|
||||
"ProjectStatusDropdown handleOpen called, setting isOpen to true"
|
||||
);
|
||||
setIsOpen(true);
|
||||
};
|
||||
|
||||
@@ -111,10 +122,6 @@ export default function ProjectStatusDropdown({
|
||||
<button
|
||||
ref={buttonRef}
|
||||
onClick={() => {
|
||||
console.log(
|
||||
"ProjectStatusDropdown button clicked, current isOpen:",
|
||||
isOpen
|
||||
);
|
||||
setIsOpen(!isOpen);
|
||||
}}
|
||||
disabled={loading}
|
||||
@@ -145,17 +152,13 @@ export default function ProjectStatusDropdown({
|
||||
</svg>
|
||||
</Badge>
|
||||
</button>{" "}
|
||||
{/* Simple dropdown for debugging */}
|
||||
{/* Status Options Dropdown */}
|
||||
{isOpen && (
|
||||
<div className="absolute top-full left-0 mt-1 bg-white border-2 border-red-500 rounded-md shadow-lg z-[9999] min-w-[140px]">
|
||||
<div className="bg-yellow-100 p-2 text-xs text-center border-b">
|
||||
DEBUG: ProjectStatus Dropdown is visible
|
||||
</div>
|
||||
<div className="absolute top-full left-0 mt-1 bg-white border border-gray-200 rounded-md shadow-lg z-[9999] min-w-[140px]">
|
||||
{Object.entries(statusConfig).map(([statusKey, config]) => (
|
||||
<button
|
||||
key={statusKey}
|
||||
onClick={() => {
|
||||
console.log("ProjectStatus Option clicked:", statusKey);
|
||||
handleChange(statusKey);
|
||||
}}
|
||||
className="w-full text-left px-3 py-2 hover:bg-gray-50 transition-colors first:rounded-t-md last:rounded-b-md"
|
||||
@@ -170,9 +173,8 @@ export default function ProjectStatusDropdown({
|
||||
{/* Backdrop */}
|
||||
{isOpen && (
|
||||
<div
|
||||
className="fixed inset-0 z-[9998] bg-black bg-opacity-10"
|
||||
className="fixed inset-0 z-[9998]"
|
||||
onClick={() => {
|
||||
console.log("ProjectStatus Backdrop clicked");
|
||||
setIsOpen(false);
|
||||
}}
|
||||
/>
|
||||
|
||||
@@ -29,6 +29,10 @@ export default function ProjectStatusDropdownDebug({
|
||||
label: "Completed",
|
||||
variant: "success",
|
||||
},
|
||||
cancelled: {
|
||||
label: "Cancelled",
|
||||
variant: "danger",
|
||||
},
|
||||
};
|
||||
|
||||
const handleChange = async (newStatus) => {
|
||||
|
||||
@@ -29,6 +29,10 @@ export default function ProjectStatusDropdownSimple({
|
||||
label: "Completed",
|
||||
variant: "success",
|
||||
},
|
||||
cancelled: {
|
||||
label: "Cancelled",
|
||||
variant: "danger",
|
||||
},
|
||||
};
|
||||
|
||||
const handleChange = async (newStatus) => {
|
||||
|
||||
@@ -3,8 +3,10 @@
|
||||
import { useState, useEffect } from "react";
|
||||
import Button from "./ui/Button";
|
||||
import Badge from "./ui/Badge";
|
||||
import { useTranslation } from "@/lib/i18n";
|
||||
|
||||
export default function ProjectTaskForm({ projectId, onTaskAdded }) {
|
||||
const { t } = useTranslation();
|
||||
const [taskTemplates, setTaskTemplates] = useState([]);
|
||||
const [users, setUsers] = useState([]);
|
||||
const [taskType, setTaskType] = useState("template"); // "template" or "custom"
|
||||
@@ -67,10 +69,10 @@ export default function ProjectTaskForm({ projectId, onTaskAdded }) {
|
||||
setAssignedTo("");
|
||||
if (onTaskAdded) onTaskAdded();
|
||||
} else {
|
||||
alert("Failed to add task to project.");
|
||||
alert(t("tasks.addTaskError"));
|
||||
}
|
||||
} catch (error) {
|
||||
alert("Error adding task to project.");
|
||||
alert(t("tasks.addTaskError"));
|
||||
} finally {
|
||||
setIsSubmitting(false);
|
||||
}
|
||||
@@ -79,7 +81,7 @@ export default function ProjectTaskForm({ projectId, onTaskAdded }) {
|
||||
<form onSubmit={handleSubmit} className="space-y-6">
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-3">
|
||||
Task Type
|
||||
{t("tasks.taskType")}
|
||||
</label>
|
||||
<div className="flex space-x-6">
|
||||
<label className="flex items-center">
|
||||
@@ -90,7 +92,7 @@ export default function ProjectTaskForm({ projectId, onTaskAdded }) {
|
||||
onChange={(e) => setTaskType(e.target.value)}
|
||||
className="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300"
|
||||
/>
|
||||
<span className="ml-2 text-sm text-gray-900">From Template</span>
|
||||
<span className="ml-2 text-sm text-gray-900">{t("tasks.fromTemplate")}</span>
|
||||
</label>
|
||||
<label className="flex items-center">
|
||||
<input
|
||||
@@ -100,7 +102,7 @@ export default function ProjectTaskForm({ projectId, onTaskAdded }) {
|
||||
onChange={(e) => setTaskType(e.target.value)}
|
||||
className="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300"
|
||||
/>
|
||||
<span className="ml-2 text-sm text-gray-900">Custom Task</span>
|
||||
<span className="ml-2 text-sm text-gray-900">{t("tasks.customTask")}</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
@@ -108,7 +110,7 @@ export default function ProjectTaskForm({ projectId, onTaskAdded }) {
|
||||
{taskType === "template" ? (
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Select Task Template
|
||||
{t("tasks.selectTemplate")}
|
||||
</label>{" "}
|
||||
<select
|
||||
value={selectedTemplate}
|
||||
@@ -116,10 +118,10 @@ export default function ProjectTaskForm({ projectId, onTaskAdded }) {
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
|
||||
required
|
||||
>
|
||||
<option value="">Choose a task template...</option>
|
||||
<option value="">{t("tasks.chooseTemplate")}</option>
|
||||
{taskTemplates.map((template) => (
|
||||
<option key={template.task_id} value={template.task_id}>
|
||||
{template.name} ({template.max_wait_days} days)
|
||||
{template.name} ({template.max_wait_days} {t("tasks.days")})
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
@@ -128,20 +130,20 @@ export default function ProjectTaskForm({ projectId, onTaskAdded }) {
|
||||
<div className="space-y-4">
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Task Name
|
||||
{t("tasks.taskName")}
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
value={customTaskName}
|
||||
onChange={(e) => setCustomTaskName(e.target.value)}
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
|
||||
placeholder="Enter custom task name..."
|
||||
placeholder={t("tasks.enterTaskName")}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Max Wait Days
|
||||
{t("tasks.maxWait")}
|
||||
</label>
|
||||
<input
|
||||
type="number"
|
||||
@@ -154,13 +156,13 @@ export default function ProjectTaskForm({ projectId, onTaskAdded }) {
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Description
|
||||
{t("tasks.description")}
|
||||
</label>
|
||||
<textarea
|
||||
value={customDescription}
|
||||
onChange={(e) => setCustomDescription(e.target.value)}
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
|
||||
placeholder="Enter task description (optional)..."
|
||||
placeholder={t("tasks.enterDescription")}
|
||||
rows={3}
|
||||
/>
|
||||
</div>
|
||||
@@ -169,14 +171,14 @@ export default function ProjectTaskForm({ projectId, onTaskAdded }) {
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Assign To <span className="text-gray-500 text-xs">(optional)</span>
|
||||
{t("tasks.assignedTo")} <span className="text-gray-500 text-xs">({t("common.optional")})</span>
|
||||
</label>
|
||||
<select
|
||||
value={assignedTo}
|
||||
onChange={(e) => setAssignedTo(e.target.value)}
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
|
||||
>
|
||||
<option value="">Unassigned</option>
|
||||
<option value="">{t("projects.unassigned")}</option>
|
||||
{users.map((user) => (
|
||||
<option key={user.id} value={user.id}>
|
||||
{user.name} ({user.email})
|
||||
@@ -187,17 +189,17 @@ export default function ProjectTaskForm({ projectId, onTaskAdded }) {
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Priority
|
||||
{t("tasks.priority")}
|
||||
</label>
|
||||
<select
|
||||
value={priority}
|
||||
onChange={(e) => setPriority(e.target.value)}
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
|
||||
>
|
||||
<option value="low">Low</option>
|
||||
<option value="normal">Normal</option>
|
||||
<option value="high">High</option>
|
||||
<option value="urgent">Urgent</option>
|
||||
<option value="low">{t("tasks.low")}</option>
|
||||
<option value="normal">{t("tasks.normal")}</option>
|
||||
<option value="high">{t("tasks.high")}</option>
|
||||
<option value="urgent">{t("tasks.urgent")}</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
@@ -211,7 +213,7 @@ export default function ProjectTaskForm({ projectId, onTaskAdded }) {
|
||||
(taskType === "custom" && !customTaskName.trim())
|
||||
}
|
||||
>
|
||||
{isSubmitting ? "Adding..." : "Add Task"}
|
||||
{isSubmitting ? t("tasks.adding") : t("tasks.addTask")}
|
||||
</Button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
@@ -5,6 +5,7 @@ import { Card, CardHeader, CardContent } from "./ui/Card";
|
||||
import Button from "./ui/Button";
|
||||
import Badge from "./ui/Badge";
|
||||
import TaskStatusDropdownSimple from "./TaskStatusDropdownSimple";
|
||||
import TaskCommentsModal from "./TaskCommentsModal";
|
||||
import SearchBar from "./ui/SearchBar";
|
||||
import { Select } from "./ui/Input";
|
||||
import Link from "next/link";
|
||||
@@ -14,12 +15,16 @@ import {
|
||||
formatDistanceToNow,
|
||||
} from "date-fns";
|
||||
import { formatDate } from "@/lib/utils";
|
||||
import { useTranslation } from "@/lib/i18n";
|
||||
|
||||
export default function ProjectTasksList() {
|
||||
const { t } = useTranslation();
|
||||
const [allTasks, setAllTasks] = useState([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [searchTerm, setSearchTerm] = useState("");
|
||||
const [groupBy, setGroupBy] = useState("none");
|
||||
const [selectedTask, setSelectedTask] = useState(null);
|
||||
const [showCommentsModal, setShowCommentsModal] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
const fetchAllTasks = async () => {
|
||||
@@ -35,7 +40,19 @@ export default function ProjectTasksList() {
|
||||
};
|
||||
|
||||
fetchAllTasks();
|
||||
}, []); // Calculate task status based on date_added and max_wait_days
|
||||
}, []);
|
||||
|
||||
// Handle escape key to close modal
|
||||
useEffect(() => {
|
||||
const handleEscape = (e) => {
|
||||
if (e.key === "Escape" && showCommentsModal) {
|
||||
handleCloseComments();
|
||||
}
|
||||
};
|
||||
|
||||
document.addEventListener("keydown", handleEscape);
|
||||
return () => document.removeEventListener("keydown", handleEscape);
|
||||
}, [showCommentsModal]); // Calculate task status based on date_added and max_wait_days
|
||||
const getTaskStatus = (task) => {
|
||||
if (task.status === "completed" || task.status === "cancelled") {
|
||||
return { type: "completed", days: 0 };
|
||||
@@ -195,7 +212,7 @@ export default function ProjectTasksList() {
|
||||
|
||||
// Group tasks by task name when groupBy is set to "task_name"
|
||||
const groupTasksByName = (tasks) => {
|
||||
if (groupBy !== "task_name") return { "All Tasks": tasks };
|
||||
if (groupBy !== "task_name") return { [t("tasks.allTasks")]: tasks };
|
||||
|
||||
const groups = {};
|
||||
tasks.forEach((task) => {
|
||||
@@ -223,13 +240,23 @@ export default function ProjectTasksList() {
|
||||
const tasks = await res2.json();
|
||||
setAllTasks(tasks);
|
||||
} else {
|
||||
alert("Failed to update task status");
|
||||
alert(t("errors.generic"));
|
||||
}
|
||||
} catch (error) {
|
||||
alert("Error updating task status");
|
||||
alert(t("errors.generic"));
|
||||
}
|
||||
};
|
||||
|
||||
const handleShowComments = (task) => {
|
||||
setSelectedTask(task);
|
||||
setShowCommentsModal(true);
|
||||
};
|
||||
|
||||
const handleCloseComments = () => {
|
||||
setShowCommentsModal(false);
|
||||
setSelectedTask(null);
|
||||
};
|
||||
|
||||
const getPriorityVariant = (priority) => {
|
||||
switch (priority) {
|
||||
case "urgent":
|
||||
@@ -250,13 +277,13 @@ export default function ProjectTasksList() {
|
||||
if (days > 3) return "warning";
|
||||
return "high";
|
||||
};
|
||||
const TaskRow = ({ task, showTimeLeft = false }) => (
|
||||
const TaskRow = ({ task, showTimeLeft = false, showMaxWait = true }) => (
|
||||
<tr className="hover:bg-gray-50 border-b border-gray-200">
|
||||
<td className="px-4 py-3">
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="font-medium text-gray-900">{task.task_name}</span>
|
||||
<Badge variant={getPriorityVariant(task.priority)} size="sm">
|
||||
{task.priority}
|
||||
{t(`tasks.${task.priority}`)}
|
||||
</Badge>
|
||||
</div>
|
||||
</td>
|
||||
@@ -273,26 +300,16 @@ export default function ProjectTasksList() {
|
||||
<td className="px-4 py-3 text-sm text-gray-600">
|
||||
{task.address || "N/A"}
|
||||
</td>
|
||||
<td className="px-4 py-3 text-sm text-gray-600">
|
||||
{task.created_by_name ? (
|
||||
<div>
|
||||
<div className="font-medium">{task.created_by_name}</div>
|
||||
<div className="text-xs text-gray-500">{task.created_by_email}</div>
|
||||
</div>
|
||||
) : (
|
||||
"N/A"
|
||||
)}
|
||||
</td>
|
||||
<td className="px-4 py-3 text-sm text-gray-600">
|
||||
{task.assigned_to_name ? (
|
||||
<div>
|
||||
<div className="font-medium">{task.assigned_to_name}</div>
|
||||
<div className="text-xs text-gray-500">
|
||||
{/* <div className="text-xs text-gray-500">
|
||||
{task.assigned_to_email}
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
) : (
|
||||
<span className="text-gray-400 italic">Unassigned</span>
|
||||
<span className="text-gray-400 italic">{t("projects.unassigned")}</span>
|
||||
)}
|
||||
</td>
|
||||
{showTimeLeft && (
|
||||
@@ -307,9 +324,9 @@ export default function ProjectTasksList() {
|
||||
>
|
||||
{!isNaN(task.statusInfo.daysRemaining)
|
||||
? task.statusInfo.daysRemaining > 0
|
||||
? `${task.statusInfo.daysRemaining}d left`
|
||||
: `${Math.abs(task.statusInfo.daysRemaining)}d overdue`
|
||||
: "Calculating..."}
|
||||
? `${task.statusInfo.daysRemaining}${t("tasks.daysLeft")}`
|
||||
: `${Math.abs(task.statusInfo.daysRemaining)}${t("tasks.daysOverdue")}`
|
||||
: t("common.loading")}
|
||||
</Badge>
|
||||
)}
|
||||
{task.statusInfo &&
|
||||
@@ -317,8 +334,8 @@ export default function ProjectTasksList() {
|
||||
task.status === "in_progress" && (
|
||||
<Badge variant="danger" size="sm">
|
||||
{!isNaN(task.statusInfo.daysRemaining)
|
||||
? `${Math.abs(task.statusInfo.daysRemaining)}d overdue`
|
||||
: "Overdue"}
|
||||
? `${Math.abs(task.statusInfo.daysRemaining)}${t("tasks.daysOverdue")}`
|
||||
: t("tasks.overdue")}
|
||||
</Badge>
|
||||
)}
|
||||
</div>
|
||||
@@ -328,7 +345,7 @@ export default function ProjectTasksList() {
|
||||
{task.status === "completed" && task.date_completed ? (
|
||||
<div>
|
||||
<div>
|
||||
Completed:{" "}
|
||||
{t("taskStatus.completed")}:{" "}
|
||||
{(() => {
|
||||
try {
|
||||
const completedDate = new Date(task.date_completed);
|
||||
@@ -344,7 +361,7 @@ export default function ProjectTasksList() {
|
||||
) : task.status === "in_progress" && task.date_started ? (
|
||||
<div>
|
||||
<div>
|
||||
Started:{" "}
|
||||
{t("tasks.dateStarted")}:{" "}
|
||||
{(() => {
|
||||
try {
|
||||
const startedDate = new Date(task.date_started);
|
||||
@@ -368,22 +385,34 @@ export default function ProjectTasksList() {
|
||||
})()
|
||||
)}
|
||||
</td>
|
||||
{showMaxWait && (
|
||||
<td className="px-4 py-3 text-sm text-gray-500">
|
||||
{task.max_wait_days} days
|
||||
{task.max_wait_days} {t("tasks.days")}
|
||||
</td>
|
||||
)}
|
||||
<td className="px-4 py-3">
|
||||
<div className="flex items-center gap-2">
|
||||
<TaskStatusDropdownSimple
|
||||
task={task}
|
||||
size="sm"
|
||||
onStatusChange={handleStatusChange}
|
||||
/>
|
||||
<Button
|
||||
variant="secondary"
|
||||
size="sm"
|
||||
onClick={() => handleShowComments(task)}
|
||||
title={t("tasks.comments")}
|
||||
>
|
||||
💬
|
||||
</Button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
);
|
||||
const TaskTable = ({ tasks, showGrouped = false, showTimeLeft = false }) => {
|
||||
const TaskTable = ({ tasks, showGrouped = false, showTimeLeft = false, showMaxWait = true }) => {
|
||||
const filteredTasks = filterTasks(tasks);
|
||||
const groupedTasks = groupTasksByName(filteredTasks);
|
||||
const colSpan = showTimeLeft ? "10" : "9";
|
||||
const colSpan = showTimeLeft && showMaxWait ? "9" : showTimeLeft || showMaxWait ? "8" : "7";
|
||||
|
||||
return (
|
||||
<div className="overflow-x-auto">
|
||||
@@ -391,49 +420,48 @@ export default function ProjectTasksList() {
|
||||
<thead className="bg-gray-50">
|
||||
<tr>
|
||||
<th className="px-4 py-3 text-left text-sm font-medium text-gray-700">
|
||||
Task Name
|
||||
{t("tasks.taskName")}
|
||||
</th>{" "}
|
||||
<th className="px-4 py-3 text-left text-sm font-medium text-gray-700">
|
||||
Project
|
||||
{t("tasks.project")}
|
||||
</th>
|
||||
<th className="px-4 py-3 text-left text-sm font-medium text-gray-700">
|
||||
City
|
||||
{t("projects.city")}
|
||||
</th>
|
||||
<th className="px-4 py-3 text-left text-sm font-medium text-gray-700">
|
||||
Address
|
||||
{t("projects.address")}
|
||||
</th>
|
||||
<th className="px-4 py-3 text-left text-sm font-medium text-gray-700">
|
||||
Created By
|
||||
</th>
|
||||
<th className="px-4 py-3 text-left text-sm font-medium text-gray-700">
|
||||
Assigned To
|
||||
{t("tasks.assignedTo")}
|
||||
</th>
|
||||
{showTimeLeft && (
|
||||
<th className="px-4 py-3 text-left text-sm font-medium text-gray-700">
|
||||
Time Left
|
||||
{t("tasks.daysLeft")}
|
||||
</th>
|
||||
)}
|
||||
<th className="px-4 py-3 text-left text-sm font-medium text-gray-700">
|
||||
Date Info
|
||||
{t("tasks.dateCreated")}
|
||||
</th>
|
||||
{showMaxWait && (
|
||||
<th className="px-4 py-3 text-left text-sm font-medium text-gray-700">
|
||||
Max Wait
|
||||
</th>{" "}
|
||||
{t("tasks.maxWait")}
|
||||
</th>
|
||||
)}{" "}
|
||||
<th className="px-4 py-3 text-left text-sm font-medium text-gray-700">
|
||||
Actions
|
||||
{t("tasks.actions")}
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{Object.entries(groupedTasks).map(([groupName, groupTasks]) => (
|
||||
<Fragment key={`group-fragment-${groupName}`}>
|
||||
{showGrouped && groupName !== "All Tasks" && (
|
||||
{showGrouped && groupName !== t("tasks.allTasks") && (
|
||||
<tr key={`group-${groupName}`}>
|
||||
<td
|
||||
colSpan={colSpan}
|
||||
className="px-4 py-2 bg-gray-100 font-medium text-gray-800 text-sm"
|
||||
>
|
||||
{groupName} ({groupTasks.length} tasks)
|
||||
{groupName} ({groupTasks.length} {t("tasks.tasks")})
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
@@ -442,6 +470,7 @@ export default function ProjectTasksList() {
|
||||
key={task.id}
|
||||
task={task}
|
||||
showTimeLeft={showTimeLeft}
|
||||
showMaxWait={showMaxWait}
|
||||
/>
|
||||
))}
|
||||
</Fragment>
|
||||
@@ -450,7 +479,7 @@ export default function ProjectTasksList() {
|
||||
</table>
|
||||
{filteredTasks.length === 0 && (
|
||||
<div className="text-center py-8 text-gray-500">
|
||||
<p>No tasks found</p>
|
||||
<p>{t("tasks.noTasks")}</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
@@ -476,7 +505,7 @@ export default function ProjectTasksList() {
|
||||
<div className="text-2xl font-bold text-blue-600">
|
||||
{taskGroups.pending.length}
|
||||
</div>
|
||||
<div className="text-sm text-gray-600">Pending</div>
|
||||
<div className="text-sm text-gray-600">{t("taskStatus.pending")}</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card>
|
||||
@@ -484,7 +513,7 @@ export default function ProjectTasksList() {
|
||||
<div className="text-2xl font-bold text-purple-600">
|
||||
{taskGroups.in_progress.length}
|
||||
</div>
|
||||
<div className="text-sm text-gray-600">In Progress</div>
|
||||
<div className="text-sm text-gray-600">{t("taskStatus.in_progress")}</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card>
|
||||
@@ -492,7 +521,7 @@ export default function ProjectTasksList() {
|
||||
<div className="text-2xl font-bold text-green-600">
|
||||
{taskGroups.completed.length}
|
||||
</div>
|
||||
<div className="text-sm text-gray-600">Completed</div>
|
||||
<div className="text-sm text-gray-600">{t("taskStatus.completed")}</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>{" "}
|
||||
@@ -500,26 +529,26 @@ export default function ProjectTasksList() {
|
||||
<SearchBar
|
||||
searchTerm={searchTerm}
|
||||
onSearchChange={(e) => setSearchTerm(e.target.value)}
|
||||
placeholder="Search tasks, projects, city, or address..."
|
||||
placeholder={t("tasks.searchPlaceholder")}
|
||||
resultsCount={
|
||||
filterTasks(taskGroups.pending).length +
|
||||
filterTasks(taskGroups.in_progress).length +
|
||||
filterTasks(taskGroups.completed).length
|
||||
}
|
||||
resultsText="tasks"
|
||||
resultsText={t("tasks.tasks")}
|
||||
filters={
|
||||
<div className="flex items-center gap-4">
|
||||
<div className="flex items-center gap-2">
|
||||
<label className="text-sm font-medium text-gray-700">
|
||||
Group by:
|
||||
{t("tasks.sortBy")}:
|
||||
</label>
|
||||
<Select
|
||||
value={groupBy}
|
||||
onChange={(e) => setGroupBy(e.target.value)}
|
||||
className="min-w-[120px]"
|
||||
>
|
||||
<option value="none">None</option>
|
||||
<option value="task_name">Task Name</option>
|
||||
<option value="none">{t("common.none")}</option>
|
||||
<option value="task_name">{t("tasks.taskName")}</option>
|
||||
</Select>
|
||||
</div>
|
||||
</div>
|
||||
@@ -531,19 +560,20 @@ export default function ProjectTasksList() {
|
||||
<div>
|
||||
<div className="mb-4">
|
||||
<h2 className="text-xl font-semibold text-gray-900 flex items-center gap-2">
|
||||
Pending Tasks
|
||||
{t("taskStatus.pending")} {t("tasks.tasks")}
|
||||
<Badge variant="primary" size="md">
|
||||
{taskGroups.pending.length}
|
||||
</Badge>
|
||||
</h2>
|
||||
<p className="text-sm text-gray-600 mt-1">
|
||||
Tasks waiting to be started
|
||||
{t("tasks.noTasksMessage")}
|
||||
</p>
|
||||
</div>
|
||||
<TaskTable
|
||||
tasks={taskGroups.pending}
|
||||
showGrouped={groupBy === "task_name"}
|
||||
showTimeLeft={false}
|
||||
showMaxWait={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -551,19 +581,20 @@ export default function ProjectTasksList() {
|
||||
<div>
|
||||
<div className="mb-4">
|
||||
<h2 className="text-xl font-semibold text-gray-900 flex items-center gap-2">
|
||||
In Progress Tasks
|
||||
{t("taskStatus.in_progress")} {t("tasks.tasks")}
|
||||
<Badge variant="secondary" size="md">
|
||||
{taskGroups.in_progress.length}
|
||||
</Badge>
|
||||
</h2>
|
||||
<p className="text-sm text-gray-600 mt-1">
|
||||
Tasks currently being worked on - showing time left for completion
|
||||
Zadania aktualnie w trakcie realizacji - pokazujący pozostały czas do ukończenia
|
||||
</p>
|
||||
</div>
|
||||
<TaskTable
|
||||
tasks={taskGroups.in_progress}
|
||||
showGrouped={groupBy === "task_name"}
|
||||
showTimeLeft={true}
|
||||
showMaxWait={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -571,22 +602,28 @@ export default function ProjectTasksList() {
|
||||
<div>
|
||||
<div className="mb-4">
|
||||
<h2 className="text-xl font-semibold text-gray-900 flex items-center gap-2">
|
||||
Completed Tasks
|
||||
{t("taskStatus.completed")} {t("tasks.tasks")}
|
||||
<Badge variant="success" size="md">
|
||||
{taskGroups.completed.length}
|
||||
</Badge>
|
||||
</h2>
|
||||
<p className="text-sm text-gray-600 mt-1">
|
||||
Recently completed and cancelled tasks
|
||||
Ostatnio ukończone i anulowane zadania
|
||||
</p>
|
||||
</div>
|
||||
<TaskTable
|
||||
tasks={taskGroups.completed}
|
||||
showGrouped={groupBy === "task_name"}
|
||||
showTimeLeft={false}
|
||||
showMaxWait={false}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div> {/* Comments Modal */}
|
||||
<TaskCommentsModal
|
||||
task={selectedTask}
|
||||
isOpen={showCommentsModal}
|
||||
onClose={handleCloseComments}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -7,8 +7,10 @@ import { Card, CardHeader, CardContent } from "./ui/Card";
|
||||
import Button from "./ui/Button";
|
||||
import Badge from "./ui/Badge";
|
||||
import { formatDate } from "@/lib/utils";
|
||||
import { useTranslation } from "@/lib/i18n";
|
||||
|
||||
export default function ProjectTasksSection({ projectId }) {
|
||||
const { t } = useTranslation();
|
||||
const [projectTasks, setProjectTasks] = useState([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [taskNotes, setTaskNotes] = useState({});
|
||||
@@ -17,6 +19,15 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
const [showAddTaskModal, setShowAddTaskModal] = useState(false);
|
||||
const [expandedDescriptions, setExpandedDescriptions] = useState({});
|
||||
const [expandedNotes, setExpandedNotes] = useState({});
|
||||
const [editingTask, setEditingTask] = useState(null);
|
||||
const [showEditTaskModal, setShowEditTaskModal] = useState(false);
|
||||
const [editTaskForm, setEditTaskForm] = useState({
|
||||
priority: "",
|
||||
date_started: "",
|
||||
status: "",
|
||||
assigned_to: "",
|
||||
});
|
||||
const [users, setUsers] = useState([]);
|
||||
useEffect(() => {
|
||||
const fetchProjectTasks = async () => {
|
||||
try {
|
||||
@@ -49,22 +60,38 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
}
|
||||
};
|
||||
|
||||
// Fetch users for assignment dropdown
|
||||
const fetchUsers = async () => {
|
||||
try {
|
||||
const res = await fetch("/api/project-tasks/users");
|
||||
const usersData = await res.json();
|
||||
setUsers(usersData);
|
||||
} catch (error) {
|
||||
console.error("Failed to fetch users:", error);
|
||||
}
|
||||
};
|
||||
|
||||
fetchProjectTasks();
|
||||
fetchUsers();
|
||||
}, [projectId]);
|
||||
// Handle escape key to close modal
|
||||
// Handle escape key to close modals
|
||||
useEffect(() => {
|
||||
const handleEscape = (e) => {
|
||||
if (e.key === "Escape" && showAddTaskModal) {
|
||||
if (e.key === "Escape") {
|
||||
if (showEditTaskModal) {
|
||||
handleCloseEditModal();
|
||||
} else if (showAddTaskModal) {
|
||||
setShowAddTaskModal(false);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
document.addEventListener("keydown", handleEscape);
|
||||
return () => document.removeEventListener("keydown", handleEscape);
|
||||
}, [showAddTaskModal]);
|
||||
}, [showAddTaskModal, showEditTaskModal]);
|
||||
// Prevent body scroll when modal is open and handle map z-index
|
||||
useEffect(() => {
|
||||
if (showAddTaskModal) {
|
||||
if (showAddTaskModal || showEditTaskModal) {
|
||||
// Prevent body scroll
|
||||
document.body.style.overflow = "hidden";
|
||||
|
||||
@@ -111,7 +138,7 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
nav.style.zIndex = "";
|
||||
});
|
||||
};
|
||||
}, [showAddTaskModal]);
|
||||
}, [showAddTaskModal, showEditTaskModal]);
|
||||
const refetchTasks = async () => {
|
||||
try {
|
||||
const res = await fetch(`/api/project-tasks?project_id=${projectId}`);
|
||||
@@ -155,14 +182,14 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
if (res.ok) {
|
||||
refetchTasks(); // Refresh the list
|
||||
} else {
|
||||
alert("Failed to update task status");
|
||||
alert(t("errors.generic"));
|
||||
}
|
||||
} catch (error) {
|
||||
alert("Error updating task status");
|
||||
alert(t("errors.generic"));
|
||||
}
|
||||
};
|
||||
const handleDeleteTask = async (taskId) => {
|
||||
if (!confirm("Are you sure you want to delete this task?")) return;
|
||||
if (!confirm(t("common.deleteConfirm"))) return;
|
||||
try {
|
||||
const res = await fetch(`/api/project-tasks/${taskId}`, {
|
||||
method: "DELETE",
|
||||
@@ -171,10 +198,11 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
if (res.ok) {
|
||||
refetchTasks(); // Refresh the list
|
||||
} else {
|
||||
alert("Failed to delete task");
|
||||
const errorData = await res.json();
|
||||
alert(t("errors.generic") + ": " + (errorData.error || t("errors.unknown")));
|
||||
}
|
||||
} catch (error) {
|
||||
alert("Error deleting task");
|
||||
alert(t("tasks.deleteError") + ": " + error.message);
|
||||
}
|
||||
};
|
||||
|
||||
@@ -201,20 +229,20 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
setTaskNotes((prev) => ({ ...prev, [taskId]: notes }));
|
||||
setNewNote((prev) => ({ ...prev, [taskId]: "" }));
|
||||
} else {
|
||||
alert("Failed to add note");
|
||||
alert(t("errors.generic"));
|
||||
}
|
||||
} catch (error) {
|
||||
alert("Error adding note");
|
||||
alert(t("errors.generic"));
|
||||
} finally {
|
||||
setLoadingNotes((prev) => ({ ...prev, [taskId]: false }));
|
||||
}
|
||||
};
|
||||
|
||||
const handleDeleteNote = async (noteId, taskId) => {
|
||||
if (!confirm("Are you sure you want to delete this note?")) return;
|
||||
if (!confirm(t("common.deleteConfirm"))) return;
|
||||
|
||||
try {
|
||||
const res = await fetch(`/api/task-notes?note_id=${noteId}`, {
|
||||
const res = await fetch(`/api/task-notes/${noteId}`, {
|
||||
method: "DELETE",
|
||||
});
|
||||
|
||||
@@ -224,12 +252,74 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
const notes = await notesRes.json();
|
||||
setTaskNotes((prev) => ({ ...prev, [taskId]: notes }));
|
||||
} else {
|
||||
alert("Failed to delete note");
|
||||
alert(t("errors.generic"));
|
||||
}
|
||||
} catch (error) {
|
||||
alert("Error deleting note");
|
||||
console.error("Error deleting task note:", error);
|
||||
alert(t("errors.generic"));
|
||||
}
|
||||
};
|
||||
|
||||
const handleEditTask = (task) => {
|
||||
setEditingTask(task);
|
||||
|
||||
// Format date for HTML input (YYYY-MM-DD)
|
||||
let dateStarted = "";
|
||||
if (task.date_started) {
|
||||
const date = new Date(task.date_started);
|
||||
if (!isNaN(date.getTime())) {
|
||||
dateStarted = date.toISOString().split("T")[0];
|
||||
}
|
||||
}
|
||||
|
||||
const formData = {
|
||||
priority: task.priority || "",
|
||||
date_started: dateStarted,
|
||||
status: task.status || "",
|
||||
assigned_to: task.assigned_to || "",
|
||||
};
|
||||
|
||||
setEditTaskForm(formData);
|
||||
setShowEditTaskModal(true);
|
||||
};
|
||||
|
||||
const handleUpdateTask = async () => {
|
||||
if (!editingTask) return;
|
||||
|
||||
try {
|
||||
const res = await fetch(`/api/project-tasks/${editingTask.id}`, {
|
||||
method: "PUT",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({
|
||||
priority: editTaskForm.priority,
|
||||
date_started: editTaskForm.date_started || null,
|
||||
status: editTaskForm.status,
|
||||
assigned_to: editTaskForm.assigned_to || null,
|
||||
}),
|
||||
});
|
||||
|
||||
if (res.ok) {
|
||||
refetchTasks();
|
||||
handleCloseEditModal();
|
||||
} else {
|
||||
alert(t("errors.generic"));
|
||||
}
|
||||
} catch (error) {
|
||||
alert(t("errors.generic"));
|
||||
}
|
||||
};
|
||||
|
||||
const handleCloseEditModal = () => {
|
||||
setShowEditTaskModal(false);
|
||||
setEditingTask(null);
|
||||
setEditTaskForm({
|
||||
priority: "",
|
||||
date_started: "",
|
||||
status: "",
|
||||
assigned_to: "",
|
||||
});
|
||||
};
|
||||
|
||||
const getPriorityVariant = (priority) => {
|
||||
switch (priority) {
|
||||
case "urgent":
|
||||
@@ -261,10 +351,10 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div className="flex items-center justify-between">
|
||||
<h2 className="text-xl font-semibold text-gray-900">Project Tasks</h2>
|
||||
<h2 className="text-xl font-semibold text-gray-900">{t("tasks.title")}</h2>
|
||||
<div className="flex items-center gap-3">
|
||||
<Badge variant="default" className="text-sm">
|
||||
{projectTasks.length} {projectTasks.length === 1 ? "task" : "tasks"}
|
||||
{projectTasks.length} {projectTasks.length === 1 ? t("tasks.task") : t("tasks.tasks")}
|
||||
</Badge>
|
||||
<Button
|
||||
variant="primary"
|
||||
@@ -284,7 +374,7 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
d="M12 4v16m8-8H4"
|
||||
/>
|
||||
</svg>
|
||||
Add Task
|
||||
{t("tasks.newTask")}
|
||||
</Button>
|
||||
</div>
|
||||
</div>{" "}
|
||||
@@ -305,7 +395,7 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
>
|
||||
<div className="flex items-center justify-between p-6 border-b">
|
||||
<h3 className="text-lg font-semibold text-gray-900">
|
||||
Add New Task
|
||||
{t("tasks.newTask")}
|
||||
</h3>
|
||||
<button
|
||||
onClick={() => setShowAddTaskModal(false)}
|
||||
@@ -338,7 +428,7 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
{/* Current Tasks */}
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<h3 className="text-lg font-medium text-gray-900">Current Tasks</h3>
|
||||
<h3 className="text-lg font-medium text-gray-900">{t("tasks.title")}</h3>
|
||||
</CardHeader>
|
||||
<CardContent className="p-0">
|
||||
{loading ? (
|
||||
@@ -364,10 +454,10 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
</svg>
|
||||
</div>
|
||||
<p className="text-gray-500 text-sm">
|
||||
No tasks assigned to this project yet.
|
||||
{t("tasks.noTasksMessage")}
|
||||
</p>
|
||||
<p className="text-gray-400 text-xs mt-1">
|
||||
Add a task above to get started.
|
||||
{t("tasks.addTaskMessage")}
|
||||
</p>
|
||||
</div>
|
||||
) : (
|
||||
@@ -376,22 +466,22 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
<thead className="bg-gray-50 border-b border-gray-200">
|
||||
<tr>
|
||||
<th className="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
||||
Task
|
||||
{t("tasks.taskName")}
|
||||
</th>
|
||||
<th className="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
||||
Priority
|
||||
{t("tasks.priority")}
|
||||
</th>{" "}
|
||||
<th className="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
||||
Max Wait
|
||||
{t("tasks.maxWait")}
|
||||
</th>
|
||||
<th className="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
||||
Date Started
|
||||
{t("tasks.dateStarted")}
|
||||
</th>
|
||||
<th className="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
||||
Status
|
||||
{t("tasks.status")}
|
||||
</th>
|
||||
<th className="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
||||
Actions
|
||||
<th className="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider w-48">
|
||||
{t("tasks.actions")}
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
@@ -437,17 +527,17 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
variant={getPriorityVariant(task.priority)}
|
||||
size="sm"
|
||||
>
|
||||
{task.priority}
|
||||
{t(`tasks.${task.priority}`)}
|
||||
</Badge>
|
||||
</td>
|
||||
<td className="px-4 py-4 text-sm text-gray-600">
|
||||
{task.max_wait_days} days
|
||||
{task.max_wait_days} {t("tasks.days")}
|
||||
</td>{" "}
|
||||
<td className="px-4 py-4 text-sm text-gray-600">
|
||||
{task.date_started
|
||||
? formatDate(task.date_started)
|
||||
: "Not started"}
|
||||
</td>{" "}
|
||||
: t("tasks.notStarted")}
|
||||
</td>
|
||||
<td className="px-4 py-4">
|
||||
<TaskStatusDropdownSimple
|
||||
task={task}
|
||||
@@ -456,21 +546,70 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
/>
|
||||
</td>
|
||||
<td className="px-4 py-4">
|
||||
<div className="flex items-center gap-2">
|
||||
<button
|
||||
<div className="flex items-center gap-1.5">
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
onClick={() => toggleNotes(task.id)}
|
||||
className="text-xs text-blue-600 hover:text-blue-800 font-medium"
|
||||
title={`${taskNotes[task.id]?.length || 0} notes`}
|
||||
className="text-xs px-2 py-1 text-blue-600 hover:text-blue-800 hover:bg-blue-50 border-0"
|
||||
title={`${taskNotes[task.id]?.length || 0} ${t("tasks.notes")}`}
|
||||
>
|
||||
Notes ({taskNotes[task.id]?.length || 0})
|
||||
</button>
|
||||
<svg
|
||||
className="w-3 h-3 mr-1"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={2}
|
||||
d="M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z"
|
||||
/>
|
||||
</svg>
|
||||
{taskNotes[task.id]?.length || 0}
|
||||
</Button>
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
onClick={() => handleEditTask(task)}
|
||||
className="text-xs px-2 py-1 min-w-[60px]"
|
||||
>
|
||||
<svg
|
||||
className="w-3 h-3 mr-1"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={2}
|
||||
d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"
|
||||
/>
|
||||
</svg>
|
||||
{t("common.edit")}
|
||||
</Button>
|
||||
<Button
|
||||
variant="danger"
|
||||
size="sm"
|
||||
onClick={() => handleDeleteTask(task.id)}
|
||||
className="text-xs"
|
||||
className="text-xs px-2 py-1 min-w-[60px]"
|
||||
>
|
||||
Delete
|
||||
<svg
|
||||
className="w-3 h-3 mr-1"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={2}
|
||||
d="19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
|
||||
/>
|
||||
</svg>
|
||||
{t("common.delete")}
|
||||
</Button>
|
||||
</div>
|
||||
</td>
|
||||
@@ -481,7 +620,7 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
<td colSpan="6" className="px-4 py-3">
|
||||
<div className="text-sm text-gray-700">
|
||||
<span className="font-medium text-gray-900">
|
||||
Description:
|
||||
{t("tasks.description")}:
|
||||
</span>
|
||||
<p className="mt-1">{task.description}</p>
|
||||
</div>
|
||||
@@ -494,7 +633,7 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
<td colSpan="6" className="px-4 py-4">
|
||||
<div className="space-y-3">
|
||||
<h5 className="text-sm font-medium text-gray-900">
|
||||
Notes ({taskNotes[task.id]?.length || 0})
|
||||
{t("tasks.comments")} ({taskNotes[task.id]?.length || 0})
|
||||
</h5>
|
||||
|
||||
{/* Existing Notes */}
|
||||
@@ -512,11 +651,11 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
>
|
||||
<div className="flex-1">
|
||||
<div className="flex items-center gap-2 mb-1">
|
||||
{note.is_system && (
|
||||
{note.is_system ? (
|
||||
<span className="px-2 py-1 text-xs bg-blue-100 text-blue-700 rounded-full font-medium">
|
||||
System
|
||||
{t("admin.system")}
|
||||
</span>
|
||||
)}
|
||||
) : null}
|
||||
{note.created_by_name && (
|
||||
<span className="px-2 py-1 text-xs bg-gray-100 text-gray-700 rounded-full font-medium">
|
||||
{note.created_by_name}
|
||||
@@ -530,11 +669,6 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
{formatDate(note.note_date, {
|
||||
includeTime: true,
|
||||
})}
|
||||
{note.created_by_name && (
|
||||
<span className="ml-2">
|
||||
by {note.created_by_name}
|
||||
</span>
|
||||
)}
|
||||
</p>
|
||||
</div>
|
||||
{!note.is_system && (
|
||||
@@ -546,7 +680,7 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
)
|
||||
}
|
||||
className="ml-2 text-red-500 hover:text-red-700 text-xs font-bold"
|
||||
title="Delete note"
|
||||
title={t("tasks.deleteNote")}
|
||||
>
|
||||
×
|
||||
</button>
|
||||
@@ -560,7 +694,7 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
<div className="flex gap-2">
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Add a note..."
|
||||
placeholder={t("tasks.addComment")}
|
||||
value={newNote[task.id] || ""}
|
||||
onChange={(e) =>
|
||||
setNewNote((prev) => ({
|
||||
@@ -584,7 +718,7 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
!newNote[task.id]?.trim()
|
||||
}
|
||||
>
|
||||
{loadingNotes[task.id] ? "Adding..." : "Add"}
|
||||
{loadingNotes[task.id] ? t("common.saving") : t("common.add")}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -599,6 +733,134 @@ export default function ProjectTasksSection({ projectId }) {
|
||||
)}
|
||||
</CardContent>
|
||||
</Card>
|
||||
{/* Edit Task Modal */}
|
||||
{showEditTaskModal && (
|
||||
<div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-[9999]">
|
||||
<div className="bg-white rounded-lg p-6 w-full max-w-md mx-4">
|
||||
<div className="flex items-center justify-between mb-4">
|
||||
<h3 className="text-lg font-semibold text-gray-900">
|
||||
{t("tasks.editTask")}:{" "}
|
||||
{editingTask?.custom_task_name || editingTask?.task_name}
|
||||
</h3>
|
||||
<button
|
||||
onClick={handleCloseEditModal}
|
||||
className="text-gray-400 hover:text-gray-600"
|
||||
>
|
||||
<svg
|
||||
className="w-5 h-5"
|
||||
fill="currentColor"
|
||||
viewBox="0 0 20 20"
|
||||
>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
|
||||
clipRule="evenodd"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="space-y-4">
|
||||
{/* Assignment */}
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-1">
|
||||
{t("tasks.assignedTo")}
|
||||
</label>
|
||||
<select
|
||||
value={editTaskForm.assigned_to}
|
||||
onChange={(e) =>
|
||||
setEditTaskForm((prev) => ({
|
||||
...prev,
|
||||
assigned_to: e.target.value,
|
||||
}))
|
||||
}
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
|
||||
>
|
||||
<option value="">{t("projects.unassigned")}</option>
|
||||
{users.map((user) => (
|
||||
<option key={user.id} value={user.id}>
|
||||
{user.name}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
{/* Priority */}
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-1">
|
||||
{t("tasks.priority")}
|
||||
</label>
|
||||
<select
|
||||
value={editTaskForm.priority}
|
||||
onChange={(e) =>
|
||||
setEditTaskForm((prev) => ({
|
||||
...prev,
|
||||
priority: e.target.value,
|
||||
}))
|
||||
}
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
|
||||
>
|
||||
<option value="">{t("common.selectOption")}</option>
|
||||
<option value="low">{t("tasks.low")}</option>
|
||||
<option value="normal">{t("tasks.normal")}</option>
|
||||
<option value="high">{t("tasks.high")}</option>
|
||||
<option value="urgent">{t("tasks.urgent")}</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
{/* Date Started */}
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-1">
|
||||
{t("tasks.dateStarted")}
|
||||
</label>
|
||||
<input
|
||||
type="date"
|
||||
value={editTaskForm.date_started}
|
||||
onChange={(e) =>
|
||||
setEditTaskForm((prev) => ({
|
||||
...prev,
|
||||
date_started: e.target.value,
|
||||
}))
|
||||
}
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Status */}
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-1">
|
||||
{t("tasks.status")}
|
||||
</label>
|
||||
<select
|
||||
value={editTaskForm.status}
|
||||
onChange={(e) =>
|
||||
setEditTaskForm((prev) => ({
|
||||
...prev,
|
||||
status: e.target.value,
|
||||
}))
|
||||
}
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
|
||||
>
|
||||
<option value="">{t("common.selectOption")}</option>
|
||||
<option value="pending">{t("taskStatus.pending")}</option>
|
||||
<option value="in_progress">{t("taskStatus.in_progress")}</option>
|
||||
<option value="completed">{t("taskStatus.completed")}</option>
|
||||
<option value="cancelled">{t("taskStatus.cancelled")}</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center justify-end gap-3 mt-6">
|
||||
<Button variant="outline" onClick={handleCloseEditModal}>
|
||||
{t("common.cancel")}
|
||||
</Button>
|
||||
<Button variant="primary" onClick={handleUpdateTask}>
|
||||
{t("tasks.updateTask")}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
371
src/components/TaskCommentsModal.js
Normal file
371
src/components/TaskCommentsModal.js
Normal file
@@ -0,0 +1,371 @@
|
||||
"use client";
|
||||
|
||||
import React, { useState, useEffect } from "react";
|
||||
import Button from "./ui/Button";
|
||||
import Badge from "./ui/Badge";
|
||||
import { formatDate } from "@/lib/utils";
|
||||
import { formatDistanceToNow, parseISO } from "date-fns";
|
||||
import { useTranslation } from "@/lib/i18n";
|
||||
|
||||
export default function TaskCommentsModal({ task, isOpen, onClose }) {
|
||||
const { t } = useTranslation();
|
||||
const [notes, setNotes] = useState([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [newNote, setNewNote] = useState("");
|
||||
const [loadingAdd, setLoadingAdd] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (isOpen && task) {
|
||||
fetchNotes();
|
||||
}
|
||||
}, [isOpen, task]);
|
||||
|
||||
const fetchNotes = async () => {
|
||||
if (!task?.id) return;
|
||||
|
||||
try {
|
||||
setLoading(true);
|
||||
const res = await fetch(`/api/task-notes?task_id=${task.id}`);
|
||||
const data = await res.json();
|
||||
setNotes(data);
|
||||
} catch (error) {
|
||||
console.error("Failed to fetch notes:", error);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
const handleAddNote = async () => {
|
||||
if (!newNote.trim() || !task?.id) return;
|
||||
|
||||
try {
|
||||
setLoadingAdd(true);
|
||||
const res = await fetch("/api/task-notes", {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({
|
||||
task_id: task.id,
|
||||
note: newNote.trim(),
|
||||
}),
|
||||
});
|
||||
|
||||
if (res.ok) {
|
||||
setNewNote("");
|
||||
await fetchNotes(); // Refresh notes
|
||||
} else {
|
||||
alert("Failed to add note");
|
||||
}
|
||||
} catch (error) {
|
||||
alert("Error adding note");
|
||||
} finally {
|
||||
setLoadingAdd(false);
|
||||
}
|
||||
};
|
||||
|
||||
const handleDeleteNote = async (noteId) => {
|
||||
if (!confirm("Are you sure you want to delete this note?")) return;
|
||||
|
||||
try {
|
||||
const res = await fetch("/api/task-notes", {
|
||||
method: "DELETE",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({ note_id: noteId }),
|
||||
});
|
||||
|
||||
if (res.ok) {
|
||||
await fetchNotes(); // Refresh notes
|
||||
} else {
|
||||
alert("Failed to delete note");
|
||||
}
|
||||
} catch (error) {
|
||||
alert("Error deleting note");
|
||||
}
|
||||
};
|
||||
|
||||
const handleKeyDown = (e) => {
|
||||
if (e.key === "Escape") {
|
||||
onClose();
|
||||
} else if (e.key === "Enter" && e.ctrlKey) {
|
||||
handleAddNote();
|
||||
}
|
||||
};
|
||||
|
||||
const getPriorityVariant = (priority) => {
|
||||
switch (priority) {
|
||||
case "urgent":
|
||||
return "urgent";
|
||||
case "high":
|
||||
return "high";
|
||||
case "normal":
|
||||
return "normal";
|
||||
case "low":
|
||||
return "low";
|
||||
default:
|
||||
return "default";
|
||||
}
|
||||
};
|
||||
|
||||
const getStatusVariant = (status) => {
|
||||
switch (status) {
|
||||
case "completed":
|
||||
case "cancelled":
|
||||
return "success";
|
||||
case "in_progress":
|
||||
return "secondary";
|
||||
case "pending":
|
||||
return "primary";
|
||||
default:
|
||||
return "default";
|
||||
}
|
||||
};
|
||||
|
||||
const formatTaskDate = (dateString, label) => {
|
||||
if (!dateString) return null;
|
||||
try {
|
||||
const date = dateString.includes("T") ? parseISO(dateString) : new Date(dateString);
|
||||
return {
|
||||
label,
|
||||
relative: formatDistanceToNow(date, { addSuffix: true }),
|
||||
absolute: formatDate(date, { includeTime: true })
|
||||
};
|
||||
} catch (error) {
|
||||
return { label, relative: dateString, absolute: dateString };
|
||||
}
|
||||
};
|
||||
|
||||
if (!isOpen) return null;
|
||||
|
||||
return (
|
||||
<div
|
||||
className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-[9999]"
|
||||
onClick={(e) => e.target === e.currentTarget && onClose()}
|
||||
>
|
||||
<div className="bg-white rounded-lg w-full max-w-4xl mx-4 max-h-[90vh] flex flex-col">
|
||||
{/* Header */}
|
||||
<div className="p-6 border-b">
|
||||
<div className="flex items-start justify-between mb-4">
|
||||
<div className="flex-1">
|
||||
<div className="flex items-center gap-3 mb-2">
|
||||
<h3 className="text-xl font-semibold text-gray-900">
|
||||
{task?.task_name}
|
||||
</h3>
|
||||
<Badge variant={getPriorityVariant(task?.priority)} size="sm">
|
||||
{t(`tasks.${task?.priority}`)}
|
||||
</Badge>
|
||||
<Badge variant={getStatusVariant(task?.status)} size="sm">
|
||||
{t(`taskStatus.${task?.status}`)}
|
||||
</Badge>
|
||||
</div>
|
||||
<p className="text-sm text-gray-600 mb-3">
|
||||
{t("tasks.project")}: <span className="font-medium">{task?.project_name}</span>
|
||||
</p>
|
||||
</div>
|
||||
<button
|
||||
onClick={onClose}
|
||||
className="text-gray-400 hover:text-gray-600 text-xl font-semibold ml-4"
|
||||
onKeyDown={handleKeyDown}
|
||||
>
|
||||
×
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Task Details Grid */}
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 p-4 bg-gray-50 rounded-lg">
|
||||
{/* Location Information */}
|
||||
{(task?.city || task?.address) && (
|
||||
<div className="space-y-1">
|
||||
<h4 className="text-xs font-medium text-gray-500 uppercase tracking-wide">{t("projects.locationDetails")}</h4>
|
||||
{task?.city && (
|
||||
<p className="text-sm text-gray-900">{task.city}</p>
|
||||
)}
|
||||
{task?.address && (
|
||||
<p className="text-xs text-gray-600">{task.address}</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Assignment Information */}
|
||||
<div className="space-y-1">
|
||||
<h4 className="text-xs font-medium text-gray-500 uppercase tracking-wide">{t("tasks.assignedTo")}</h4>
|
||||
{task?.assigned_to_name ? (
|
||||
<div>
|
||||
<p className="text-sm text-gray-900">{task.assigned_to_name}</p>
|
||||
<p className="text-xs text-gray-600">{task.assigned_to_email}</p>
|
||||
</div>
|
||||
) : (
|
||||
<p className="text-sm text-gray-500 italic">{t("projects.unassigned")}</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Task Timing */}
|
||||
<div className="space-y-1">
|
||||
<h4 className="text-xs font-medium text-gray-500 uppercase tracking-wide">{t("tasks.dateCreated")}</h4>
|
||||
{task?.max_wait_days && (
|
||||
<p className="text-xs text-gray-600">{t("tasks.maxWait")}: {task.max_wait_days} {t("tasks.days")}</p>
|
||||
)}
|
||||
{(() => {
|
||||
if (task?.status === "completed" && task?.date_completed) {
|
||||
const dateInfo = formatTaskDate(task.date_completed, t("taskStatus.completed"));
|
||||
return (
|
||||
<div>
|
||||
<p className="text-sm text-green-700 font-medium">{dateInfo.relative}</p>
|
||||
<p className="text-xs text-gray-600">{dateInfo.absolute}</p>
|
||||
</div>
|
||||
);
|
||||
} else if (task?.status === "in_progress" && task?.date_started) {
|
||||
const dateInfo = formatTaskDate(task.date_started, t("tasks.dateStarted"));
|
||||
return (
|
||||
<div>
|
||||
<p className="text-sm text-blue-700 font-medium">{t("tasks.dateStarted")} {dateInfo.relative}</p>
|
||||
<p className="text-xs text-gray-600">{dateInfo.absolute}</p>
|
||||
</div>
|
||||
);
|
||||
} else if (task?.date_added) {
|
||||
const dateInfo = formatTaskDate(task.date_added, t("tasks.dateCreated"));
|
||||
return (
|
||||
<div>
|
||||
<p className="text-sm text-gray-700 font-medium">{t("tasks.dateCreated")} {dateInfo.relative}</p>
|
||||
<p className="text-xs text-gray-600">{dateInfo.absolute}</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
return null;
|
||||
})()}
|
||||
</div>
|
||||
|
||||
{/* Task Description */}
|
||||
{task?.description && (
|
||||
<div className="space-y-1 md:col-span-2 lg:col-span-3">
|
||||
<h4 className="text-xs font-medium text-gray-500 uppercase tracking-wide">{t("tasks.description")}</h4>
|
||||
<p className="text-sm text-gray-900 leading-relaxed">{task.description}</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Content */}
|
||||
<div className="flex-1 overflow-y-auto p-6">
|
||||
{loading ? (
|
||||
<div className="text-center py-8">
|
||||
<div className="animate-pulse space-y-4">
|
||||
<div className="h-4 bg-gray-200 rounded w-3/4"></div>
|
||||
<div className="h-4 bg-gray-200 rounded w-1/2"></div>
|
||||
<div className="h-4 bg-gray-200 rounded w-2/3"></div>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="space-y-4">
|
||||
<div className="flex items-center gap-2 mb-4">
|
||||
<h5 className="text-lg font-medium text-gray-900">
|
||||
{t("tasks.comments")}
|
||||
</h5>
|
||||
<Badge variant="secondary" size="sm">
|
||||
{notes.length}
|
||||
</Badge>
|
||||
</div>
|
||||
|
||||
{notes.length === 0 ? (
|
||||
<div className="text-center py-12 text-gray-500">
|
||||
<div className="w-16 h-16 mx-auto mb-4 bg-gray-100 rounded-full flex items-center justify-center">
|
||||
<span className="text-2xl">💬</span>
|
||||
</div>
|
||||
<p className="text-lg font-medium mb-1">{t("tasks.noComments")}</p>
|
||||
<p className="text-sm">Bądź pierwszy, który doda komentarz!</p>
|
||||
</div>
|
||||
) : (
|
||||
<div className="space-y-4">
|
||||
{notes.map((note) => (
|
||||
<div
|
||||
key={note.note_id}
|
||||
className={`p-4 rounded-lg border flex justify-between items-start transition-colors ${
|
||||
note.is_system
|
||||
? "bg-blue-50 border-blue-200 hover:bg-blue-100"
|
||||
: "bg-white border-gray-200 hover:bg-gray-50 shadow-sm"
|
||||
}`}
|
||||
>
|
||||
<div className="flex-1">
|
||||
<div className="flex items-center gap-2 mb-2">
|
||||
{note.is_system ? (
|
||||
<span className="px-2 py-1 text-xs bg-blue-100 text-blue-700 rounded-full font-medium flex items-center gap-1">
|
||||
<span>🤖</span>
|
||||
{t("admin.system")}
|
||||
</span>
|
||||
) : (
|
||||
<span className="px-2 py-1 text-xs bg-gray-100 text-gray-700 rounded-full font-medium flex items-center gap-1">
|
||||
<span>👤</span>
|
||||
{note.created_by_name || t("userRoles.user")}
|
||||
</span>
|
||||
)}
|
||||
<span className="text-xs text-gray-500 font-medium">
|
||||
{formatDate(note.note_date, {
|
||||
includeTime: true,
|
||||
})}
|
||||
</span>
|
||||
</div>
|
||||
<p className="text-sm text-gray-800 leading-relaxed">
|
||||
{note.note}
|
||||
</p>
|
||||
</div>
|
||||
{!note.is_system && (
|
||||
<button
|
||||
onClick={() => handleDeleteNote(note.note_id)}
|
||||
className="ml-3 p-1 text-red-400 hover:text-red-600 hover:bg-red-50 rounded transition-colors"
|
||||
title={t("common.delete")}
|
||||
>
|
||||
<span className="text-sm">🗑️</span>
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Footer - Add new comment */}
|
||||
<div className="p-6 border-t bg-gradient-to-r from-gray-50 to-gray-100">
|
||||
<div className="space-y-4">
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="text-lg">💬</span>
|
||||
<label className="text-sm font-medium text-gray-700">
|
||||
{t("tasks.addComment")}
|
||||
</label>
|
||||
</div>
|
||||
<textarea
|
||||
value={newNote}
|
||||
onChange={(e) => setNewNote(e.target.value)}
|
||||
placeholder={t("common.addNotePlaceholder")}
|
||||
className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent resize-none shadow-sm"
|
||||
rows={3}
|
||||
onKeyDown={handleKeyDown}
|
||||
/>
|
||||
<div className="flex items-center justify-between">
|
||||
<p className="text-xs text-gray-500 flex items-center gap-1">
|
||||
<span>⌨️</span>
|
||||
Naciśnij Ctrl+Enter aby wysłać lub Escape aby zamknąć
|
||||
</p>
|
||||
<div className="flex gap-3">
|
||||
<Button
|
||||
variant="secondary"
|
||||
size="sm"
|
||||
onClick={onClose}
|
||||
>
|
||||
{t("common.close")}
|
||||
</Button>
|
||||
<Button
|
||||
variant="primary"
|
||||
size="sm"
|
||||
onClick={handleAddNote}
|
||||
disabled={loadingAdd || !newNote.trim()}
|
||||
>
|
||||
{loadingAdd ? t("common.saving") : `💾 ${t("tasks.addComment")}`}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -3,13 +3,16 @@
|
||||
import { useState, useRef, useEffect } from "react";
|
||||
import { createPortal } from "react-dom";
|
||||
import Badge from "@/components/ui/Badge";
|
||||
import { useTranslation } from "@/lib/i18n";
|
||||
|
||||
export default function TaskStatusDropdown({
|
||||
task,
|
||||
size = "sm",
|
||||
showDropdown = true,
|
||||
onStatusChange,
|
||||
}) { const [status, setStatus] = useState(task.status);
|
||||
}) {
|
||||
const { t } = useTranslation();
|
||||
const [status, setStatus] = useState(task.status);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [isOpen, setIsOpen] = useState(false);
|
||||
const [dropdownPosition, setDropdownPosition] = useState({ x: 0, y: 0, position: 'bottom' });
|
||||
@@ -23,19 +26,19 @@ export default function TaskStatusDropdown({
|
||||
|
||||
const statusConfig = {
|
||||
pending: {
|
||||
label: "Pending",
|
||||
label: t("taskStatus.pending"),
|
||||
variant: "warning",
|
||||
},
|
||||
in_progress: {
|
||||
label: "In Progress",
|
||||
label: t("taskStatus.in_progress"),
|
||||
variant: "primary",
|
||||
},
|
||||
completed: {
|
||||
label: "Completed",
|
||||
label: t("taskStatus.completed"),
|
||||
variant: "success",
|
||||
},
|
||||
cancelled: {
|
||||
label: "Cancelled",
|
||||
label: t("taskStatus.cancelled"),
|
||||
variant: "danger",
|
||||
},
|
||||
};
|
||||
|
||||
@@ -9,6 +9,7 @@ const buttonVariants = {
|
||||
danger: "bg-red-600 hover:bg-red-700 text-white",
|
||||
success: "bg-green-600 hover:bg-green-700 text-white",
|
||||
outline: "border border-blue-600 text-blue-600 hover:bg-blue-50",
|
||||
ghost: "text-gray-600 hover:text-gray-900 hover:bg-gray-50",
|
||||
};
|
||||
|
||||
const buttonSizes = {
|
||||
|
||||
42
src/components/ui/LanguageSwitcher.js
Normal file
42
src/components/ui/LanguageSwitcher.js
Normal file
@@ -0,0 +1,42 @@
|
||||
"use client";
|
||||
|
||||
import { useTranslation } from '@/lib/i18n';
|
||||
|
||||
const LanguageSwitcher = ({ className = '' }) => {
|
||||
const { language, changeLanguage, availableLanguages, t } = useTranslation();
|
||||
|
||||
const languageNames = {
|
||||
pl: 'Polski',
|
||||
en: 'English'
|
||||
};
|
||||
|
||||
return (
|
||||
<div className={`relative ${className}`}>
|
||||
<select
|
||||
value={language}
|
||||
onChange={(e) => changeLanguage(e.target.value)}
|
||||
className="appearance-none bg-white border border-gray-300 rounded-md px-3 py-1 pr-8 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
|
||||
title={t('common.selectLanguage')}
|
||||
>
|
||||
{availableLanguages.map((lang) => (
|
||||
<option key={lang} value={lang}>
|
||||
{languageNames[lang] || lang.toUpperCase()}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
|
||||
{/* Custom dropdown arrow */}
|
||||
<div className="pointer-events-none absolute inset-y-0 right-0 flex items-center px-2 text-gray-700">
|
||||
<svg
|
||||
className="fill-current h-4 w-4"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 20 20"
|
||||
>
|
||||
<path d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" />
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default LanguageSwitcher;
|
||||
@@ -3,10 +3,13 @@
|
||||
import Link from "next/link";
|
||||
import { usePathname } from "next/navigation";
|
||||
import { useSession, signOut } from "next-auth/react";
|
||||
import { useTranslation } from "@/lib/i18n";
|
||||
import LanguageSwitcher from "./LanguageSwitcher";
|
||||
|
||||
const Navigation = () => {
|
||||
const pathname = usePathname();
|
||||
const { data: session, status } = useSession();
|
||||
const { t } = useTranslation();
|
||||
|
||||
const isActive = (path) => {
|
||||
if (path === "/") return pathname === "/";
|
||||
@@ -18,16 +21,16 @@ const Navigation = () => {
|
||||
};
|
||||
|
||||
const navItems = [
|
||||
{ href: "/", label: "Dashboard" },
|
||||
{ href: "/projects", label: "Projects" },
|
||||
{ href: "/tasks/templates", label: "Task Templates" },
|
||||
{ href: "/project-tasks", label: "Project Tasks" },
|
||||
{ href: "/contracts", label: "Contracts" },
|
||||
{ href: "/projects", label: t('navigation.projects') },
|
||||
{ href: "/calendar", label: t('navigation.calendar') || 'Kalendarz' },
|
||||
{ href: "/tasks/templates", label: t('navigation.taskTemplates') },
|
||||
{ href: "/project-tasks", label: t('navigation.projectTasks') },
|
||||
{ href: "/contracts", label: t('navigation.contracts') },
|
||||
];
|
||||
|
||||
// Add admin-only items
|
||||
if (session?.user?.role === 'admin') {
|
||||
navItems.push({ href: "/admin/users", label: "User Management" });
|
||||
navItems.push({ href: "/admin/users", label: t('navigation.userManagement') });
|
||||
}
|
||||
|
||||
const handleSignOut = async () => {
|
||||
@@ -44,14 +47,14 @@ const Navigation = () => {
|
||||
<div className="max-w-6xl mx-auto px-6">
|
||||
<div className="flex items-center justify-between h-16">
|
||||
<div className="flex items-center">
|
||||
<Link href="/" className="text-xl font-bold text-gray-900">
|
||||
Project Panel
|
||||
<Link href="/projects" className="text-xl font-bold text-gray-900">
|
||||
{t('navigation.projectPanel')}
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center space-x-4">
|
||||
{status === "loading" ? (
|
||||
<div className="text-gray-500">Loading...</div>
|
||||
<div className="text-gray-500">{t('navigation.loading')}</div>
|
||||
) : session ? (
|
||||
<>
|
||||
<div className="flex space-x-8">
|
||||
@@ -71,10 +74,12 @@ const Navigation = () => {
|
||||
</div>
|
||||
|
||||
<div className="flex items-center space-x-4 ml-8 pl-8 border-l border-gray-200">
|
||||
{/* <LanguageSwitcher /> */}
|
||||
|
||||
<div className="flex items-center space-x-2">
|
||||
<div className="text-sm">
|
||||
<div className="font-medium text-gray-900">{session.user.name}</div>
|
||||
<div className="text-gray-500 capitalize">{session.user.role?.replace('_', ' ')}</div>
|
||||
{/* <div className="text-gray-500 capitalize">{t(`userRoles.${session.user.role}`) || session.user.role?.replace('_', ' ')}</div> */}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -82,17 +87,20 @@ const Navigation = () => {
|
||||
onClick={handleSignOut}
|
||||
className="bg-gray-100 hover:bg-gray-200 text-gray-700 px-3 py-2 rounded-md text-sm font-medium transition-colors"
|
||||
>
|
||||
Sign Out
|
||||
{t('navigation.signOut')}
|
||||
</button>
|
||||
</div>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<LanguageSwitcher />
|
||||
<Link
|
||||
href="/auth/signin"
|
||||
className="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md text-sm font-medium transition-colors"
|
||||
>
|
||||
Sign In
|
||||
{t('navigation.signIn')}
|
||||
</Link>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
331
src/components/ui/ProjectCalendarWidget.js
Normal file
331
src/components/ui/ProjectCalendarWidget.js
Normal file
@@ -0,0 +1,331 @@
|
||||
"use client";
|
||||
|
||||
import { useState, useEffect } from "react";
|
||||
import Link from "next/link";
|
||||
import { Card, CardHeader, CardContent } from "./Card";
|
||||
import Badge from "./Badge";
|
||||
import Button from "./Button";
|
||||
import { formatDate } from "@/lib/utils";
|
||||
import {
|
||||
format,
|
||||
startOfMonth,
|
||||
endOfMonth,
|
||||
startOfWeek,
|
||||
endOfWeek,
|
||||
addDays,
|
||||
isSameMonth,
|
||||
isSameDay,
|
||||
addMonths,
|
||||
subMonths,
|
||||
parseISO,
|
||||
isAfter,
|
||||
isBefore,
|
||||
startOfDay,
|
||||
addWeeks
|
||||
} from "date-fns";
|
||||
import { pl } from "date-fns/locale";
|
||||
|
||||
const statusColors = {
|
||||
registered: "bg-blue-100 text-blue-800",
|
||||
approved: "bg-green-100 text-green-800",
|
||||
pending: "bg-yellow-100 text-yellow-800",
|
||||
in_progress: "bg-orange-100 text-orange-800",
|
||||
fulfilled: "bg-gray-100 text-gray-800",
|
||||
cancelled: "bg-red-100 text-red-800",
|
||||
};
|
||||
|
||||
const statusTranslations = {
|
||||
registered: "Zarejestrowany",
|
||||
approved: "Zatwierdzony",
|
||||
pending: "Oczekujący",
|
||||
in_progress: "W trakcie",
|
||||
fulfilled: "Zakończony",
|
||||
cancelled: "Wycofany",
|
||||
};
|
||||
|
||||
export default function ProjectCalendarWidget({
|
||||
projects = [],
|
||||
compact = false,
|
||||
showUpcoming = true,
|
||||
maxUpcoming = 5
|
||||
}) {
|
||||
const [currentDate, setCurrentDate] = useState(new Date());
|
||||
const [viewMode, setViewMode] = useState(compact ? 'upcoming' : 'mini-calendar');
|
||||
|
||||
// Filter projects that have finish dates and are not fulfilled
|
||||
const activeProjects = projects.filter(p =>
|
||||
p.finish_date && p.project_status !== 'fulfilled'
|
||||
);
|
||||
|
||||
const getProjectsForDate = (date) => {
|
||||
return activeProjects.filter(project => {
|
||||
if (!project.finish_date) return false;
|
||||
try {
|
||||
const projectDate = parseISO(project.finish_date);
|
||||
return isSameDay(projectDate, date);
|
||||
} catch (error) {
|
||||
return false;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const getUpcomingProjects = () => {
|
||||
const today = startOfDay(new Date());
|
||||
const nextMonth = addWeeks(today, 4);
|
||||
|
||||
return activeProjects
|
||||
.filter(project => {
|
||||
if (!project.finish_date) return false;
|
||||
try {
|
||||
const projectDate = parseISO(project.finish_date);
|
||||
return isAfter(projectDate, today) && isBefore(projectDate, nextMonth);
|
||||
} catch (error) {
|
||||
return false;
|
||||
}
|
||||
})
|
||||
.sort((a, b) => {
|
||||
const dateA = parseISO(a.finish_date);
|
||||
const dateB = parseISO(b.finish_date);
|
||||
return dateA - dateB;
|
||||
})
|
||||
.slice(0, maxUpcoming);
|
||||
};
|
||||
|
||||
const getOverdueProjects = () => {
|
||||
const today = startOfDay(new Date());
|
||||
|
||||
return activeProjects
|
||||
.filter(project => {
|
||||
if (!project.finish_date) return false;
|
||||
try {
|
||||
const projectDate = parseISO(project.finish_date);
|
||||
return isBefore(projectDate, today);
|
||||
} catch (error) {
|
||||
return false;
|
||||
}
|
||||
})
|
||||
.sort((a, b) => {
|
||||
const dateA = parseISO(a.finish_date);
|
||||
const dateB = parseISO(b.finish_date);
|
||||
return dateB - dateA; // Most recently overdue first
|
||||
})
|
||||
.slice(0, maxUpcoming);
|
||||
};
|
||||
|
||||
const renderMiniCalendar = () => {
|
||||
const monthStart = startOfMonth(currentDate);
|
||||
const monthEnd = endOfMonth(currentDate);
|
||||
const calendarStart = startOfWeek(monthStart, { weekStartsOn: 1 });
|
||||
const calendarEnd = endOfWeek(monthEnd, { weekStartsOn: 1 });
|
||||
|
||||
const days = [];
|
||||
let day = calendarStart;
|
||||
|
||||
while (day <= calendarEnd) {
|
||||
days.push(day);
|
||||
day = addDays(day, 1);
|
||||
}
|
||||
|
||||
const weekdays = ['P', 'W', 'Ś', 'C', 'P', 'S', 'N'];
|
||||
|
||||
return (
|
||||
<div className="space-y-3">
|
||||
{/* Calendar Header */}
|
||||
<div className="flex items-center justify-between">
|
||||
<h3 className="text-sm font-medium text-gray-900">
|
||||
{format(currentDate, 'LLLL yyyy', { locale: pl })}
|
||||
</h3>
|
||||
<div className="flex space-x-1">
|
||||
<button
|
||||
onClick={() => setCurrentDate(subMonths(currentDate, 1))}
|
||||
className="p-1 hover:bg-gray-100 rounded"
|
||||
>
|
||||
<svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M15 19l-7-7 7-7" />
|
||||
</svg>
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setCurrentDate(addMonths(currentDate, 1))}
|
||||
className="p-1 hover:bg-gray-100 rounded"
|
||||
>
|
||||
<svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Weekday Headers */}
|
||||
<div className="grid grid-cols-7 gap-1">
|
||||
{weekdays.map(weekday => (
|
||||
<div key={weekday} className="text-xs font-medium text-gray-500 text-center p-1">
|
||||
{weekday}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{/* Calendar Grid */}
|
||||
<div className="grid grid-cols-7 gap-1">
|
||||
{days.map((day, index) => {
|
||||
const dayProjects = getProjectsForDate(day);
|
||||
const isCurrentMonth = isSameMonth(day, currentDate);
|
||||
const isToday = isSameDay(day, new Date());
|
||||
const hasProjects = dayProjects.length > 0;
|
||||
|
||||
return (
|
||||
<div
|
||||
key={index}
|
||||
className={`text-xs p-1 text-center relative ${
|
||||
!isCurrentMonth ? 'text-gray-300' :
|
||||
isToday ? 'bg-blue-100 text-blue-700 font-semibold rounded' :
|
||||
'text-gray-700'
|
||||
} ${hasProjects && isCurrentMonth ? 'font-semibold' : ''}`}
|
||||
title={hasProjects ? `${dayProjects.length} projekt(ów): ${dayProjects.map(p => p.project_name).join(', ')}` : ''}
|
||||
>
|
||||
{format(day, 'd')}
|
||||
{hasProjects && isCurrentMonth && (
|
||||
<div className="absolute bottom-0 left-1/2 transform -translate-x-1/2 w-1 h-1 bg-red-500 rounded-full"></div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
const renderUpcomingList = () => {
|
||||
const upcomingProjects = getUpcomingProjects();
|
||||
const overdueProjects = getOverdueProjects();
|
||||
|
||||
return (
|
||||
<div className="space-y-4">
|
||||
{/* Overdue Projects */}
|
||||
{overdueProjects.length > 0 && (
|
||||
<div>
|
||||
<h4 className="text-sm font-medium text-red-600 mb-2">
|
||||
Przeterminowane ({overdueProjects.length})
|
||||
</h4>
|
||||
<div className="space-y-2">
|
||||
{overdueProjects.map(project => (
|
||||
<Link
|
||||
key={project.project_id}
|
||||
href={`/projects/${project.project_id}`}
|
||||
className="block p-2 bg-red-50 rounded border border-red-200 hover:bg-red-100 transition-colors"
|
||||
>
|
||||
<div className="text-sm font-medium text-gray-900 truncate">
|
||||
{project.project_name}
|
||||
</div>
|
||||
<div className="text-xs text-red-600">
|
||||
{formatDate(project.finish_date)}
|
||||
</div>
|
||||
</Link>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Upcoming Projects */}
|
||||
{upcomingProjects.length > 0 && (
|
||||
<div>
|
||||
<h4 className="text-sm font-medium text-gray-900 mb-2">
|
||||
Nadchodzące ({upcomingProjects.length})
|
||||
</h4>
|
||||
<div className="space-y-2">
|
||||
{upcomingProjects.map(project => {
|
||||
const daysUntilDeadline = Math.ceil((parseISO(project.finish_date) - new Date()) / (1000 * 60 * 60 * 24));
|
||||
|
||||
return (
|
||||
<Link
|
||||
key={project.project_id}
|
||||
href={`/projects/${project.project_id}`}
|
||||
className="block p-2 bg-gray-50 rounded hover:bg-gray-100 transition-colors"
|
||||
>
|
||||
<div className="text-sm font-medium text-gray-900 truncate">
|
||||
{project.project_name}
|
||||
</div>
|
||||
<div className="text-xs text-gray-600">
|
||||
{formatDate(project.finish_date)} • za {daysUntilDeadline} dni
|
||||
</div>
|
||||
</Link>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{upcomingProjects.length === 0 && overdueProjects.length === 0 && (
|
||||
<div className="text-sm text-gray-500 text-center py-4">
|
||||
Brak nadchodzących terminów
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
if (activeProjects.length === 0) {
|
||||
return (
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<div className="flex items-center justify-between">
|
||||
<h3 className="text-lg font-semibold">Kalendarz projektów</h3>
|
||||
<Link href="/calendar">
|
||||
<Button variant="outline" size="sm">
|
||||
Zobacz pełny kalendarz
|
||||
</Button>
|
||||
</Link>
|
||||
</div>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="text-center py-8 text-gray-500">
|
||||
Brak aktywnych projektów z terminami
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<div className="flex items-center justify-between">
|
||||
<h3 className="text-lg font-semibold">Kalendarz projektów</h3>
|
||||
<div className="flex items-center space-x-2">
|
||||
{!compact && (
|
||||
<div className="flex rounded-md bg-gray-100 p-1">
|
||||
<button
|
||||
onClick={() => setViewMode('mini-calendar')}
|
||||
className={`px-2 py-1 text-xs rounded ${
|
||||
viewMode === 'mini-calendar'
|
||||
? 'bg-white text-gray-900 shadow-sm'
|
||||
: 'text-gray-600 hover:text-gray-900'
|
||||
}`}
|
||||
>
|
||||
Kalendarz
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setViewMode('upcoming')}
|
||||
className={`px-2 py-1 text-xs rounded ${
|
||||
viewMode === 'upcoming'
|
||||
? 'bg-white text-gray-900 shadow-sm'
|
||||
: 'text-gray-600 hover:text-gray-900'
|
||||
}`}
|
||||
>
|
||||
Lista
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
<Link href="/calendar">
|
||||
<Button variant="outline" size="sm">
|
||||
Pełny kalendarz
|
||||
</Button>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
{viewMode === 'mini-calendar' ? renderMiniCalendar() : renderUpcomingList()}
|
||||
</CardContent>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
@@ -32,6 +32,7 @@ export default function ProjectMap({
|
||||
label: "In Progress (Construction)",
|
||||
},
|
||||
fulfilled: { color: "#10B981", label: "Completed" },
|
||||
cancelled: { color: "#EF4444", label: "Cancelled" },
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
@@ -51,7 +52,7 @@ export default function ProjectMap({
|
||||
<div className="space-y-2">
|
||||
<div className="flex items-center justify-between">
|
||||
<h3 className="text-sm font-medium text-gray-700">
|
||||
Project Location
|
||||
Lokalizacja projektu
|
||||
</h3>
|
||||
<div className="text-xs text-gray-500">No coordinates available</div>
|
||||
</div>
|
||||
@@ -85,7 +86,7 @@ export default function ProjectMap({
|
||||
<div className="flex items-center justify-between">
|
||||
<div className="flex items-center gap-2">
|
||||
<h3 className="text-sm font-medium text-gray-700">
|
||||
Project Location
|
||||
Lokalizacja projektu
|
||||
</h3>
|
||||
<div
|
||||
className="w-3 h-3 rounded-full border border-white shadow-sm"
|
||||
@@ -95,7 +96,7 @@ export default function ProjectMap({
|
||||
</div>
|
||||
{showLayerControl && (
|
||||
<div className="text-xs text-gray-500">
|
||||
Use the layer control (📚) to switch map views
|
||||
{/* Use the layer control (📚) to switch map views */}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
@@ -158,7 +159,7 @@ export default function ProjectMap({
|
||||
</div>
|
||||
<div className="flex items-center justify-between">
|
||||
<p className="text-xs text-gray-500">
|
||||
Coordinates: {coords.lat.toFixed(6)}, {coords.lng.toFixed(6)}
|
||||
{coords.lat.toFixed(6)}, {coords.lng.toFixed(6)}
|
||||
</p>
|
||||
<div className="flex items-center gap-1 text-xs text-gray-500">
|
||||
<div
|
||||
|
||||
95
src/components/ui/Tooltip.js
Normal file
95
src/components/ui/Tooltip.js
Normal file
@@ -0,0 +1,95 @@
|
||||
"use client";
|
||||
|
||||
import { useState, useRef, useEffect } from "react";
|
||||
import { createPortal } from "react-dom";
|
||||
|
||||
export default function Tooltip({ children, content, className = "" }) {
|
||||
const [isVisible, setIsVisible] = useState(false);
|
||||
const [position, setPosition] = useState({ top: 0, left: 0 });
|
||||
const triggerRef = useRef(null);
|
||||
const tooltipRef = useRef(null);
|
||||
|
||||
const updatePosition = () => {
|
||||
if (triggerRef.current && tooltipRef.current) {
|
||||
const triggerRect = triggerRef.current.getBoundingClientRect();
|
||||
const tooltipRect = tooltipRef.current.getBoundingClientRect();
|
||||
const scrollY = window.scrollY;
|
||||
const scrollX = window.scrollX;
|
||||
|
||||
// Calculate position (above the trigger by default)
|
||||
let top = triggerRect.top + scrollY - tooltipRect.height - 8;
|
||||
let left = triggerRect.left + scrollX + (triggerRect.width / 2) - (tooltipRect.width / 2);
|
||||
|
||||
// Keep tooltip within viewport
|
||||
if (left < 10) left = 10;
|
||||
if (left + tooltipRect.width > window.innerWidth - 10) {
|
||||
left = window.innerWidth - tooltipRect.width - 10;
|
||||
}
|
||||
|
||||
// If tooltip would go above viewport, show below instead
|
||||
if (top < scrollY + 10) {
|
||||
top = triggerRect.bottom + scrollY + 8;
|
||||
}
|
||||
|
||||
setPosition({ top, left });
|
||||
}
|
||||
};
|
||||
|
||||
const handleMouseEnter = () => {
|
||||
setIsVisible(true);
|
||||
};
|
||||
|
||||
const handleMouseLeave = () => {
|
||||
setIsVisible(false);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (isVisible) {
|
||||
// Small delay to ensure tooltip is rendered before positioning
|
||||
const timer = setTimeout(() => {
|
||||
updatePosition();
|
||||
}, 10);
|
||||
|
||||
const handleScroll = () => updatePosition();
|
||||
const handleResize = () => updatePosition();
|
||||
|
||||
window.addEventListener("scroll", handleScroll, true);
|
||||
window.addEventListener("resize", handleResize);
|
||||
|
||||
return () => {
|
||||
clearTimeout(timer);
|
||||
window.removeEventListener("scroll", handleScroll, true);
|
||||
window.removeEventListener("resize", handleResize);
|
||||
};
|
||||
}
|
||||
}, [isVisible]);
|
||||
|
||||
const tooltip = isVisible && (
|
||||
<div
|
||||
ref={tooltipRef}
|
||||
className={`fixed z-50 px-3 py-2 text-sm bg-gray-900 text-white rounded-lg shadow-lg border max-w-sm ${className}`}
|
||||
style={{
|
||||
top: position.top,
|
||||
left: position.left,
|
||||
}}
|
||||
>
|
||||
{content}
|
||||
{/* Arrow pointing down */}
|
||||
<div className="absolute top-full left-1/2 transform -translate-x-1/2 border-4 border-transparent border-t-gray-900"></div>
|
||||
</div>
|
||||
);
|
||||
|
||||
return (
|
||||
<>
|
||||
<span
|
||||
ref={triggerRef}
|
||||
onMouseEnter={handleMouseEnter}
|
||||
onMouseLeave={handleMouseLeave}
|
||||
className="inline-block"
|
||||
>
|
||||
{children}
|
||||
</span>
|
||||
{typeof document !== "undefined" && createPortal(tooltip, document.body)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -4,7 +4,7 @@ import bcrypt from "bcryptjs";
|
||||
import { z } from "zod";
|
||||
|
||||
const loginSchema = z.object({
|
||||
email: z.string().email("Invalid email format"),
|
||||
username: z.string().min(1, "Username is required"),
|
||||
password: z.string().min(6, "Password must be at least 6 characters"),
|
||||
});
|
||||
|
||||
@@ -13,7 +13,7 @@ export const { handlers, auth, signIn, signOut } = NextAuth({
|
||||
Credentials({
|
||||
name: "credentials",
|
||||
credentials: {
|
||||
email: { label: "Email", type: "email" },
|
||||
username: { label: "Username", type: "text" },
|
||||
password: { label: "Password", type: "password" },
|
||||
},
|
||||
async authorize(credentials) {
|
||||
@@ -28,13 +28,13 @@ export const { handlers, auth, signIn, signOut } = NextAuth({
|
||||
const user = db
|
||||
.prepare(
|
||||
`
|
||||
SELECT id, email, name, password_hash, role, is_active,
|
||||
SELECT id, username, name, password_hash, role, is_active,
|
||||
failed_login_attempts, locked_until
|
||||
FROM users
|
||||
WHERE email = ? AND is_active = 1
|
||||
WHERE username = ? AND is_active = 1
|
||||
`
|
||||
)
|
||||
.get(validatedFields.email);
|
||||
.get(validatedFields.username);
|
||||
|
||||
if (!user) {
|
||||
throw new Error("Invalid credentials");
|
||||
@@ -75,7 +75,7 @@ export const { handlers, auth, signIn, signOut } = NextAuth({
|
||||
userId: user.id,
|
||||
resourceType: RESOURCE_TYPES.SESSION,
|
||||
details: {
|
||||
email: validatedFields.email,
|
||||
username: validatedFields.username,
|
||||
reason: "invalid_password",
|
||||
failed_attempts: user.failed_login_attempts + 1,
|
||||
},
|
||||
@@ -107,7 +107,7 @@ export const { handlers, auth, signIn, signOut } = NextAuth({
|
||||
userId: user.id,
|
||||
resourceType: RESOURCE_TYPES.SESSION,
|
||||
details: {
|
||||
email: user.email,
|
||||
username: user.username,
|
||||
role: user.role,
|
||||
},
|
||||
});
|
||||
@@ -117,7 +117,7 @@ export const { handlers, auth, signIn, signOut } = NextAuth({
|
||||
|
||||
return {
|
||||
id: user.id,
|
||||
email: user.email,
|
||||
username: user.username,
|
||||
name: user.name,
|
||||
role: user.role,
|
||||
};
|
||||
@@ -128,30 +128,29 @@ export const { handlers, auth, signIn, signOut } = NextAuth({
|
||||
},
|
||||
}),
|
||||
],
|
||||
session: {
|
||||
strategy: "jwt",
|
||||
maxAge: 30 * 24 * 60 * 60, // 30 days
|
||||
},
|
||||
callbacks: {
|
||||
async jwt({ token, user }) {
|
||||
if (user) {
|
||||
token.role = user.role;
|
||||
token.userId = user.id;
|
||||
token.username = user.username;
|
||||
}
|
||||
return token;
|
||||
},
|
||||
async session({ session, token }) {
|
||||
if (token) {
|
||||
session.user.id = token.userId;
|
||||
session.user.id = token.sub;
|
||||
session.user.role = token.role;
|
||||
session.user.username = token.username;
|
||||
}
|
||||
return session;
|
||||
},
|
||||
},
|
||||
pages: {
|
||||
signIn: "/auth/signin",
|
||||
signOut: "/auth/signout",
|
||||
error: "/auth/error",
|
||||
},
|
||||
debug: process.env.NODE_ENV === "development",
|
||||
session: {
|
||||
strategy: "jwt",
|
||||
maxAge: 24 * 60 * 60, // 24 hours
|
||||
},
|
||||
secret: process.env.NEXTAUTH_SECRET,
|
||||
});
|
||||
|
||||
156
src/lib/auth_backup.js
Normal file
156
src/lib/auth_backup.js
Normal file
@@ -0,0 +1,156 @@
|
||||
import NextAuth from "next-auth";
|
||||
import Credentials from "next-auth/providers/credentials";
|
||||
import bcrypt from "bcryptjs";
|
||||
import { z } from "zod";
|
||||
|
||||
const loginSchema = z.object({
|
||||
username: z.string().min(1, "Username is required"),
|
||||
password: z.string().min(6, "Password must be at least 6 characters"),
|
||||
});
|
||||
|
||||
export const { handlers, auth, signIn, signOut } = NextAuth({
|
||||
providers: [
|
||||
Credentials({
|
||||
name: "credentials",
|
||||
credentials: {
|
||||
username: { label: "Username", type: "text" },
|
||||
password: { label: "Password", type: "password" },
|
||||
},
|
||||
async authorize(credentials) {
|
||||
try {
|
||||
// Import database here to avoid edge runtime issues
|
||||
const { default: db } = await import("./db.js");
|
||||
|
||||
// Validate input
|
||||
const validatedFields = loginSchema.parse(credentials);
|
||||
|
||||
// Check if user exists and is active
|
||||
const user = db
|
||||
.prepare(
|
||||
`
|
||||
SELECT id, username, name, password_hash, role, is_active,
|
||||
failed_login_attempts, locked_until
|
||||
FROM users
|
||||
WHERE username = ? AND is_active = 1
|
||||
`
|
||||
)
|
||||
.get(validatedFields.username);
|
||||
|
||||
if (!user) {
|
||||
throw new Error("Invalid credentials");
|
||||
}
|
||||
|
||||
// Check if account is locked
|
||||
if (user.locked_until && new Date(user.locked_until) > new Date()) {
|
||||
throw new Error("Account temporarily locked");
|
||||
}
|
||||
|
||||
// Verify password
|
||||
const isValidPassword = await bcrypt.compare(
|
||||
validatedFields.password,
|
||||
user.password_hash
|
||||
);
|
||||
|
||||
if (!isValidPassword) {
|
||||
// Increment failed attempts
|
||||
db.prepare(
|
||||
`
|
||||
UPDATE users
|
||||
SET failed_login_attempts = failed_login_attempts + 1,
|
||||
locked_until = CASE
|
||||
WHEN failed_login_attempts >= 4
|
||||
THEN datetime('now', '+15 minutes')
|
||||
ELSE locked_until
|
||||
END
|
||||
WHERE id = ?
|
||||
`
|
||||
).run(user.id);
|
||||
|
||||
// Log failed login attempt (only in Node.js runtime)
|
||||
try {
|
||||
const { logAuditEventSafe, AUDIT_ACTIONS, RESOURCE_TYPES } =
|
||||
await import("./auditLogSafe.js");
|
||||
await logAuditEventSafe({
|
||||
action: AUDIT_ACTIONS.LOGIN_FAILED,
|
||||
userId: user.id,
|
||||
resourceType: RESOURCE_TYPES.SESSION,
|
||||
details: {
|
||||
username: validatedFields.username,
|
||||
reason: "invalid_password",
|
||||
failed_attempts: user.failed_login_attempts + 1,
|
||||
},
|
||||
});
|
||||
} catch (auditError) {
|
||||
console.error("Failed to log audit event:", auditError);
|
||||
}
|
||||
|
||||
throw new Error("Invalid credentials");
|
||||
}
|
||||
|
||||
// Reset failed attempts and update last login
|
||||
db.prepare(
|
||||
`
|
||||
UPDATE users
|
||||
SET failed_login_attempts = 0,
|
||||
locked_until = NULL,
|
||||
last_login = CURRENT_TIMESTAMP
|
||||
WHERE id = ?
|
||||
`
|
||||
).run(user.id);
|
||||
|
||||
// Log successful login (only in Node.js runtime)
|
||||
try {
|
||||
const { logAuditEventSafe, AUDIT_ACTIONS, RESOURCE_TYPES } =
|
||||
await import("./auditLogSafe.js");
|
||||
await logAuditEventSafe({
|
||||
action: AUDIT_ACTIONS.LOGIN,
|
||||
userId: user.id,
|
||||
resourceType: RESOURCE_TYPES.SESSION,
|
||||
details: {
|
||||
username: user.username,
|
||||
role: user.role,
|
||||
},
|
||||
});
|
||||
} catch (auditError) {
|
||||
console.error("Failed to log audit event:", auditError);
|
||||
}
|
||||
|
||||
return {
|
||||
id: user.id,
|
||||
username: user.username,
|
||||
name: user.name,
|
||||
role: user.role,
|
||||
};
|
||||
} catch (error) {
|
||||
console.error("Login error:", error);
|
||||
return null;
|
||||
}
|
||||
},
|
||||
}),
|
||||
],
|
||||
callbacks: {
|
||||
async jwt({ token, user }) {
|
||||
if (user) {
|
||||
token.role = user.role;
|
||||
token.username = user.username;
|
||||
}
|
||||
return token;
|
||||
},
|
||||
async session({ session, token }) {
|
||||
if (token) {
|
||||
session.user.id = token.sub;
|
||||
session.user.role = token.role;
|
||||
session.user.username = token.username;
|
||||
}
|
||||
return session;
|
||||
},
|
||||
},
|
||||
pages: {
|
||||
signIn: "/auth/signin",
|
||||
},
|
||||
session: {
|
||||
strategy: "jwt",
|
||||
maxAge: 24 * 60 * 60, // 24 hours
|
||||
},
|
||||
secret: process.env.NEXTAUTH_SECRET,
|
||||
});
|
||||
954
src/lib/i18n.js
Normal file
954
src/lib/i18n.js
Normal file
@@ -0,0 +1,954 @@
|
||||
"use client";
|
||||
|
||||
import { createContext, useContext, useState, useEffect } from 'react';
|
||||
|
||||
// Translation context
|
||||
const TranslationContext = createContext();
|
||||
|
||||
// Translation data
|
||||
const translations = {
|
||||
pl: {
|
||||
// Navigation
|
||||
navigation: {
|
||||
dashboard: "Panel główny",
|
||||
projects: "Projekty",
|
||||
calendar: "Kalendarz",
|
||||
taskTemplates: "Szablony zadań",
|
||||
projectTasks: "Zadania projektów",
|
||||
contracts: "Umowy",
|
||||
userManagement: "Zarządzanie użytkownikami",
|
||||
projectPanel: "Panel Projektów",
|
||||
loading: "Ładowanie...",
|
||||
signOut: "Wyloguj się",
|
||||
signIn: "Zaloguj się"
|
||||
},
|
||||
|
||||
// Common UI elements
|
||||
common: {
|
||||
save: "Zapisz",
|
||||
cancel: "Anuluj",
|
||||
delete: "Usuń",
|
||||
edit: "Edytuj",
|
||||
add: "Dodaj",
|
||||
create: "Utwórz",
|
||||
update: "Aktualizuj",
|
||||
search: "Szukaj",
|
||||
filter: "Filtruj",
|
||||
loading: "Ładowanie...",
|
||||
saving: "Zapisywanie...",
|
||||
creating: "Tworzenie...",
|
||||
updating: "Aktualizowanie...",
|
||||
yes: "Tak",
|
||||
no: "Nie",
|
||||
confirm: "Potwierdź",
|
||||
close: "Zamknij",
|
||||
back: "Wstecz",
|
||||
next: "Dalej",
|
||||
previous: "Poprzedni",
|
||||
page: "Strona",
|
||||
of: "z",
|
||||
items: "pozycji",
|
||||
all: "Wszystkie",
|
||||
none: "Brak",
|
||||
required: "wymagane",
|
||||
optional: "opcjonalne",
|
||||
selectOption: "Wybierz opcję",
|
||||
selectLanguage: "Wybierz język",
|
||||
noResults: "Brak wyników",
|
||||
error: "Błąd",
|
||||
success: "Sukces",
|
||||
warning: "Ostrzeżenie",
|
||||
info: "Informacja",
|
||||
deleteConfirm: "Czy na pewno chcesz to usunąć?",
|
||||
addNote: "Dodaj notatkę",
|
||||
addNoteSuccess: "Notatka została dodana",
|
||||
addNoteError: "Nie udało się zapisać notatki",
|
||||
addNotePlaceholder: "Dodaj nową notatkę...",
|
||||
status: "Status",
|
||||
type: "Typ",
|
||||
actions: "Akcje",
|
||||
view: "Wyświetl",
|
||||
clearSearch: "Wyczyść wyszukiwanie",
|
||||
clearAllFilters: "Wyczyść wszystkie filtry",
|
||||
sortBy: "Sortuj według"
|
||||
},
|
||||
|
||||
// Dashboard
|
||||
dashboard: {
|
||||
title: "Panel główny",
|
||||
subtitle: "Przegląd twoich projektów i zadań",
|
||||
totalProjects: "Wszystkie projekty",
|
||||
activeProjects: "Aktywne projekty",
|
||||
completedProjects: "Ukończone projekty",
|
||||
overdueProjects: "Przeterminowane projekty",
|
||||
totalContracts: "Wszystkie umowy",
|
||||
activeContracts: "Aktywne umowy",
|
||||
pendingTasks: "Oczekujące zadania",
|
||||
inProgressTasks: "Zadania w trakcie",
|
||||
completedTasks: "Ukończone zadania",
|
||||
overdueTasks: "Przeterminowane zadania",
|
||||
recentProjects: "Najnowsze projekty",
|
||||
recentTasks: "Najnowsze zadania",
|
||||
upcomingDeadlines: "Nadchodzące terminy",
|
||||
projectsThisWeek: "Projekty w tym tygodniu",
|
||||
tasksThisWeek: "Zadania w tym tygodniu",
|
||||
completionRate: "Wskaźnik ukończenia",
|
||||
viewAll: "Zobacz wszystkie",
|
||||
noRecentProjects: "Brak najnowszych projektów",
|
||||
noRecentTasks: "Brak najnowszych zadań",
|
||||
noUpcomingDeadlines: "Brak nadchodzących terminów"
|
||||
},
|
||||
|
||||
// Project statuses
|
||||
projectStatus: {
|
||||
registered: "Zarejestrowany",
|
||||
in_progress_design: "W realizacji (projektowanie)",
|
||||
in_progress_construction: "W realizacji (realizacja)",
|
||||
fulfilled: "Zakończony",
|
||||
cancelled: "Wycofany",
|
||||
unknown: "Nieznany"
|
||||
},
|
||||
|
||||
// Project types
|
||||
projectType: {
|
||||
design: "Projektowanie",
|
||||
construction: "Realizacja",
|
||||
"design+construction": "Projektowanie + Realizacja"
|
||||
},
|
||||
|
||||
// Task statuses
|
||||
taskStatus: {
|
||||
pending: "Oczekujące",
|
||||
in_progress: "W trakcie",
|
||||
completed: "Ukończone",
|
||||
cancelled: "Anulowane",
|
||||
on_hold: "Wstrzymane"
|
||||
},
|
||||
|
||||
// Projects
|
||||
projects: {
|
||||
title: "Projekty",
|
||||
subtitle: "---",
|
||||
newProject: "Nowy projekt",
|
||||
editProject: "Edytuj projekt",
|
||||
deleteProject: "Usuń projekt",
|
||||
projectName: "Nazwa projektu",
|
||||
city: "Miasto",
|
||||
address: "Adres",
|
||||
plot: "Działka",
|
||||
district: "Jednostka ewidencyjna",
|
||||
unit: "Obręb",
|
||||
finishDate: "Data zakończenia",
|
||||
type: "Typ",
|
||||
contact: "Kontakt",
|
||||
coordinates: "Współrzędne",
|
||||
notes: "Notatki",
|
||||
assignedTo: "Przypisane do",
|
||||
unassigned: "Nieprzypisane",
|
||||
createdBy: "Utworzone przez",
|
||||
lastModified: "Ostatnia modyfikacja",
|
||||
basicInformation: "Informacje podstawowe",
|
||||
locationDetails: "Szczegóły lokalizacji",
|
||||
projectDetails: "Szczegóły projektu",
|
||||
additionalInfo: "Dodatkowe informacje",
|
||||
searchPlaceholder: "Szukaj projektów po nazwie, mieście lub adresie...",
|
||||
noProjects: "Brak projektów",
|
||||
noProjectsMessage: "Rozpocznij od utworzenia swojego pierwszego projektu.",
|
||||
notFinished: "Nie zakończone",
|
||||
projects: "projektów",
|
||||
mapView: "Widok mapy",
|
||||
createFirstProject: "Utwórz pierwszy projekt",
|
||||
noMatchingResults: "Brak projektów pasujących do kryteriów wyszukiwania. Spróbuj zmienić wyszukiwane frazy.",
|
||||
showingResults: "Wyświetlono {shown} z {total} projektów",
|
||||
deleteConfirm: "Czy na pewno chcesz usunąć ten projekt?",
|
||||
deleteSuccess: "Projekt został pomyślnie usunięty",
|
||||
createSuccess: "Projekt został pomyślnie utworzony",
|
||||
updateSuccess: "Projekt został pomyślnie zaktualizowany",
|
||||
saveError: "Nie udało się zapisać projektu",
|
||||
enterProjectName: "Wprowadź nazwę projektu",
|
||||
enterCity: "Wprowadź miasto",
|
||||
enterAddress: "Wprowadź adres",
|
||||
enterPlotNumber: "Wprowadź numer działki",
|
||||
enterDistrict: "Wprowadź jednostkę ewidencyjną",
|
||||
enterUnit: "Wprowadź obręb",
|
||||
enterContactDetails: "Wprowadź dane kontaktowe",
|
||||
coordinatesPlaceholder: "np. 49.622958,20.629562",
|
||||
enterNotes: "Wprowadź notatki...",
|
||||
createProject: "Utwórz projekt",
|
||||
updateProject: "Aktualizuj projekt",
|
||||
creating: "Tworzenie...",
|
||||
updating: "Aktualizowanie...",
|
||||
projectDetails: "Szczegóły projektu",
|
||||
editProjectDetails: "Edytuj szczegóły projektu",
|
||||
contract: "Umowa",
|
||||
selectContract: "Wybierz umowę",
|
||||
investmentNumber: "Numer inwestycji",
|
||||
enterInvestmentNumber: "Wprowadź numer inwestycji",
|
||||
enterWP: "Wprowadź WP",
|
||||
placeholders: {
|
||||
contact: "Wprowadź dane kontaktowe",
|
||||
coordinates: "np. 49.622958,20.629562",
|
||||
notes: "Wprowadź notatki...",
|
||||
investmentNumber: "Wprowadź numer inwestycji",
|
||||
wp: "Wprowadź WP"
|
||||
}
|
||||
},
|
||||
|
||||
// Contracts
|
||||
contracts: {
|
||||
title: "Umowy",
|
||||
subtitle: "---",
|
||||
newContract: "Nowa umowa",
|
||||
editContract: "Edytuj umowę",
|
||||
deleteContract: "Usuń umowę",
|
||||
contractNumber: "Numer umowy",
|
||||
contractName: "Nazwa umowy",
|
||||
customerContractNumber: "Numer umowy klienta",
|
||||
customer: "Klient",
|
||||
investor: "Inwestor",
|
||||
dateSigned: "Data zawarcia",
|
||||
finishDate: "Data zakończenia",
|
||||
searchPlaceholder: "Szukaj umów po numerze, nazwie, kliencie lub inwestorze...",
|
||||
noContracts: "Brak umów",
|
||||
noContractsMessage: "Rozpocznij od utworzenia swojej pierwszej umowy.",
|
||||
noMatchingContracts: "Brak pasujących umów",
|
||||
changeSearchCriteria: "Spróbuj zmienić kryteria wyszukiwania lub filtry.",
|
||||
all: "Wszystkie",
|
||||
active: "Aktywne",
|
||||
withoutEndDate: "W trakcie",
|
||||
expired: "Przeterminowane",
|
||||
createContract: "Utwórz umowę",
|
||||
enterContractNumber: "Wprowadź numer umowy",
|
||||
enterContractName: "Wprowadź nazwę umowy",
|
||||
enterCustomerContractNumber: "Wprowadź numer umowy klienta",
|
||||
enterCustomerName: "Wprowadź nazwę klienta",
|
||||
enterInvestorName: "Wprowadź nazwę inwestora",
|
||||
signedOn: "Zawarcie:",
|
||||
finishOn: "Zakończenie:",
|
||||
customerLabel: "Zleceniodawca:",
|
||||
investorLabel: "Inwestor:"
|
||||
},
|
||||
|
||||
// Tasks
|
||||
tasks: {
|
||||
title: "Zadania",
|
||||
task: "zadanie",
|
||||
tasks: "zadania",
|
||||
subtitle: "Zarządzaj zadaniami projektów",
|
||||
newTask: "Nowe zadanie",
|
||||
editTask: "Edytuj zadanie",
|
||||
deleteTask: "Usuń zadanie",
|
||||
taskName: "Nazwa zadania",
|
||||
description: "Opis",
|
||||
priority: "Priorytet",
|
||||
assignedTo: "Przypisane do",
|
||||
dueDate: "Termin wykonania",
|
||||
status: "Status",
|
||||
project: "Projekt",
|
||||
template: "Szablon",
|
||||
searchPlaceholder: "Szukaj zadań, projektów, miast lub adresów...",
|
||||
noTasks: "Brak zadań",
|
||||
noTasksMessage: "Brak zadań przypisanych do tego projektu.",
|
||||
addTaskMessage: "Dodaj zadanie powyżej, aby rozpocząć.",
|
||||
filterBy: "Filtruj według",
|
||||
sortBy: "Sortuj według",
|
||||
allTasks: "Wszystkie zadania",
|
||||
myTasks: "Moje zadania",
|
||||
overdue: "Przeterminowane",
|
||||
dueSoon: "Niedługo termin",
|
||||
high: "Wysoki",
|
||||
normal: "Normalny",
|
||||
medium: "Średni",
|
||||
low: "Niski",
|
||||
dateCreated: "Data utworzenia",
|
||||
dateModified: "Data modyfikacji",
|
||||
daysLeft: "dni pozostało",
|
||||
daysOverdue: "dni przeterminowane",
|
||||
dueToday: "Termin dzisiaj",
|
||||
startTask: "Rozpocznij zadanie",
|
||||
completeTask: "Zakończ zadanie",
|
||||
comments: "Komentarze",
|
||||
addComment: "Dodaj komentarz",
|
||||
noComments: "Brak komentarzy",
|
||||
maxWait: "Maksymalne oczekiwanie",
|
||||
dateStarted: "Data rozpoczęcia",
|
||||
actions: "Działania",
|
||||
urgent: "Pilne",
|
||||
updateTask: "Aktualizuj zadanie",
|
||||
taskType: "Typ zadania",
|
||||
fromTemplate: "Z szablonu",
|
||||
customTask: "Zadanie niestandardowe",
|
||||
selectTemplate: "Wybierz szablon zadania",
|
||||
chooseTemplate: "Wybierz szablon zadania...",
|
||||
enterTaskName: "Wprowadź nazwę zadania...",
|
||||
enterDescription: "Wprowadź opis zadania (opcjonalnie)...",
|
||||
addTask: "Dodaj zadanie",
|
||||
adding: "Dodawanie...",
|
||||
addTaskError: "Nie udało się dodać zadania do projektu",
|
||||
notes: "notatki",
|
||||
deleteNote: "Usuń notatkę",
|
||||
deleteError: "Błąd usuwania zadania",
|
||||
notStarted: "Nie rozpoczęte",
|
||||
days: "dni"
|
||||
},
|
||||
|
||||
// Task Templates
|
||||
taskTemplates: {
|
||||
title: "Szablony zadań",
|
||||
subtitle: "Zarządzaj szablonami zadań",
|
||||
newTemplate: "Nowy szablon",
|
||||
editTemplate: "Edytuj szablon",
|
||||
deleteTemplate: "Usuń szablon",
|
||||
templateName: "Nazwa szablonu",
|
||||
templateDescription: "Opis szablonu",
|
||||
defaultPriority: "Domyślny priorytet",
|
||||
estimatedDuration: "Szacowany czas trwania",
|
||||
category: "Kategoria",
|
||||
searchPlaceholder: "Szukaj szablonów...",
|
||||
noTemplates: "Brak szablonów",
|
||||
noTemplatesMessage: "Rozpocznij od utworzenia swojego pierwszego szablonu zadania.",
|
||||
useTemplate: "Użyj szablonu",
|
||||
duplicateTemplate: "Duplikuj szablon"
|
||||
},
|
||||
|
||||
// Forms
|
||||
forms: {
|
||||
validation: {
|
||||
required: "To pole jest wymagane",
|
||||
email: "Wprowadź prawidłowy adres email",
|
||||
minLength: "Minimalna długość: {min} znaków",
|
||||
maxLength: "Maksymalna długość: {max} znaków",
|
||||
invalidDate: "Nieprawidłowa data",
|
||||
invalidCoordinates: "Nieprawidłowe współrzędne"
|
||||
},
|
||||
placeholders: {
|
||||
enterText: "Wprowadź tekst...",
|
||||
selectDate: "Wybierz datę",
|
||||
selectOption: "Wybierz opcję",
|
||||
searchResults: "Szukaj wyników..."
|
||||
}
|
||||
},
|
||||
|
||||
// Sorting and filtering
|
||||
sorting: {
|
||||
sortBy: "Sortuj według",
|
||||
orderBy: "Kolejność",
|
||||
ascending: "Rosnąco",
|
||||
descending: "Malejąco",
|
||||
name: "Nazwa",
|
||||
date: "Data",
|
||||
status: "Status",
|
||||
priority: "Priorytet",
|
||||
dateCreated: "Data utworzenia",
|
||||
dateModified: "Data modyfikacji",
|
||||
startDate: "Data rozpoczęcia",
|
||||
finishDate: "Data zakończenia"
|
||||
},
|
||||
|
||||
// Date formats
|
||||
dates: {
|
||||
today: "Dzisiaj",
|
||||
yesterday: "Wczoraj",
|
||||
tomorrow: "Jutro",
|
||||
daysAgo: "{count} dni temu",
|
||||
inDays: "za {count} dni",
|
||||
invalidDate: "Nieprawidłowa data",
|
||||
selectDate: "Wybierz datę"
|
||||
},
|
||||
|
||||
// Map layers
|
||||
mapLayers: {
|
||||
polishOrthophoto: "🛰️ Polska Ortofotomapa",
|
||||
polishCadastral: "📋 Polskie Dane Katastralne",
|
||||
polishSpatialPlanning: "🏗️ Polskie Planowanie Przestrzenne",
|
||||
lpPortalRoads: "🛣️ LP-Portal Drogi",
|
||||
lpPortalStreetNames: "🏷️ LP-Portal Nazwy Ulic",
|
||||
lpPortalParcels: "📐 LP-Portal Działki",
|
||||
lpPortalSurveyMarkers: "📍 LP-Portal Punkty Pomiarowe",
|
||||
openStreetMap: "🗺️ OpenStreetMap",
|
||||
googleSatellite: "🛰️ Google Satelita",
|
||||
googleRoads: "🛣️ Google Drogi",
|
||||
layerControl: "Kontrola warstw",
|
||||
baseLayers: "Warstwy bazowe",
|
||||
overlayLayers: "Warstwy nakładkowe",
|
||||
opacity: "Przezroczystość"
|
||||
},
|
||||
|
||||
// Authentication
|
||||
auth: {
|
||||
signIn: "Zaloguj się",
|
||||
signOut: "Wyloguj się",
|
||||
email: "Email",
|
||||
password: "Hasło",
|
||||
rememberMe: "Zapamiętaj mnie",
|
||||
forgotPassword: "Zapomniałeś hasła?",
|
||||
signInWith: "Zaloguj się przez",
|
||||
signUp: "Zarejestruj się",
|
||||
createAccount: "Utwórz konto",
|
||||
alreadyHaveAccount: "Masz już konto?",
|
||||
dontHaveAccount: "Nie masz konta?",
|
||||
signInError: "Błąd logowania",
|
||||
signOutError: "Błąd wylogowania",
|
||||
emailRequired: "Email jest wymagany",
|
||||
passwordRequired: "Hasło jest wymagane",
|
||||
invalidCredentials: "Nieprawidłowe dane logowania"
|
||||
},
|
||||
|
||||
// User roles
|
||||
userRoles: {
|
||||
admin: "Administrator",
|
||||
user: "Użytkownik",
|
||||
manager: "Menedżer",
|
||||
viewer: "Czytelnik"
|
||||
},
|
||||
|
||||
// Error messages
|
||||
errors: {
|
||||
generic: "Wystąpił błąd. Spróbuj ponownie.",
|
||||
network: "Błąd połączenia sieciowego",
|
||||
unauthorized: "Brak autoryzacji",
|
||||
forbidden: "Brak uprawnień",
|
||||
notFound: "Nie znaleziono",
|
||||
validation: "Błąd walidacji danych",
|
||||
server: "Błąd serwera",
|
||||
timeout: "Przekroczono limit czasu",
|
||||
unknown: "Nieznany błąd"
|
||||
},
|
||||
|
||||
// Success messages
|
||||
success: {
|
||||
saved: "Zapisano pomyślnie",
|
||||
created: "Utworzono pomyślnie",
|
||||
updated: "Zaktualizowano pomyślnie",
|
||||
deleted: "Usunięto pomyślnie",
|
||||
sent: "Wysłano pomyślnie",
|
||||
completed: "Ukończono pomyślnie"
|
||||
},
|
||||
|
||||
// Admin section
|
||||
admin: {
|
||||
title: "Administracja",
|
||||
subtitle: "Zarządzaj użytkownikami systemu i uprawnieniami",
|
||||
userManagement: "Zarządzanie użytkownikami",
|
||||
auditLogs: "Logi audytu",
|
||||
systemSettings: "Ustawienia systemu",
|
||||
users: "Użytkownicy",
|
||||
newUser: "Nowy użytkownik",
|
||||
editUser: "Edytuj użytkownika",
|
||||
deleteUser: "Usuń użytkownika",
|
||||
userName: "Nazwa użytkownika",
|
||||
userEmail: "Email użytkownika",
|
||||
userRole: "Rola użytkownika",
|
||||
active: "Aktywny",
|
||||
inactive: "Nieaktywny",
|
||||
lastLogin: "Ostatnie logowanie",
|
||||
createdAt: "Data utworzenia",
|
||||
noUsers: "Brak użytkowników",
|
||||
system: "System"
|
||||
}
|
||||
},
|
||||
|
||||
en: {
|
||||
// English translations (fallback)
|
||||
navigation: {
|
||||
dashboard: "Dashboard",
|
||||
projects: "Projects",
|
||||
taskTemplates: "Task Templates",
|
||||
projectTasks: "Project Tasks",
|
||||
contracts: "Contracts",
|
||||
userManagement: "User Management",
|
||||
projectPanel: "Project Panel",
|
||||
loading: "Loading...",
|
||||
signOut: "Sign Out",
|
||||
signIn: "Sign In"
|
||||
},
|
||||
|
||||
common: {
|
||||
save: "Save",
|
||||
cancel: "Cancel",
|
||||
delete: "Delete",
|
||||
edit: "Edit",
|
||||
add: "Add",
|
||||
create: "Create",
|
||||
update: "Update",
|
||||
search: "Search",
|
||||
filter: "Filter",
|
||||
loading: "Loading...",
|
||||
saving: "Saving...",
|
||||
creating: "Creating...",
|
||||
updating: "Updating...",
|
||||
yes: "Yes",
|
||||
no: "No",
|
||||
confirm: "Confirm",
|
||||
close: "Close",
|
||||
back: "Back",
|
||||
next: "Next",
|
||||
previous: "Previous",
|
||||
page: "Page",
|
||||
of: "of",
|
||||
items: "items",
|
||||
all: "All",
|
||||
none: "None",
|
||||
required: "required",
|
||||
optional: "optional",
|
||||
selectOption: "Select option",
|
||||
selectLanguage: "Select language",
|
||||
noResults: "No results",
|
||||
error: "Error",
|
||||
success: "Success",
|
||||
warning: "Warning",
|
||||
info: "Info",
|
||||
deleteConfirm: "Are you sure you want to delete this?",
|
||||
addNote: "Add Note",
|
||||
addNoteSuccess: "Note added",
|
||||
addNoteError: "Failed to save note",
|
||||
addNotePlaceholder: "Add a new note...",
|
||||
status: "Status",
|
||||
type: "Type",
|
||||
actions: "Actions",
|
||||
view: "View",
|
||||
clearSearch: "Clear search",
|
||||
clearAllFilters: "Clear all filters",
|
||||
sortBy: "Sort by"
|
||||
},
|
||||
|
||||
dashboard: {
|
||||
title: "Dashboard",
|
||||
subtitle: "Overview of your projects and tasks",
|
||||
totalProjects: "Total Projects",
|
||||
activeProjects: "Active Projects",
|
||||
completedProjects: "Completed Projects",
|
||||
overdueProjects: "Overdue Projects",
|
||||
totalContracts: "Total Contracts",
|
||||
activeContracts: "Active Contracts",
|
||||
pendingTasks: "Pending Tasks",
|
||||
inProgressTasks: "In Progress Tasks",
|
||||
completedTasks: "Completed Tasks",
|
||||
overdueTasks: "Overdue Tasks",
|
||||
recentProjects: "Recent Projects",
|
||||
recentTasks: "Recent Tasks",
|
||||
upcomingDeadlines: "Upcoming Deadlines",
|
||||
projectsThisWeek: "Projects This Week",
|
||||
tasksThisWeek: "Tasks This Week",
|
||||
completionRate: "Completion Rate",
|
||||
viewAll: "View All",
|
||||
noRecentProjects: "No recent projects",
|
||||
noRecentTasks: "No recent tasks",
|
||||
noUpcomingDeadlines: "No upcoming deadlines"
|
||||
},
|
||||
|
||||
projectStatus: {
|
||||
registered: "Registered",
|
||||
in_progress_design: "In Progress (Design)",
|
||||
in_progress_construction: "In Progress (Construction)",
|
||||
fulfilled: "Completed",
|
||||
cancelled: "Cancelled",
|
||||
unknown: "Unknown"
|
||||
},
|
||||
|
||||
projectType: {
|
||||
design: "Design",
|
||||
construction: "Construction",
|
||||
"design+construction": "Design + Construction"
|
||||
},
|
||||
|
||||
taskStatus: {
|
||||
pending: "Pending",
|
||||
in_progress: "In Progress",
|
||||
completed: "Completed",
|
||||
cancelled: "Cancelled",
|
||||
on_hold: "On Hold"
|
||||
},
|
||||
|
||||
projects: {
|
||||
title: "Projects",
|
||||
subtitle: "Manage your projects",
|
||||
newProject: "New Project",
|
||||
editProject: "Edit Project",
|
||||
deleteProject: "Delete Project",
|
||||
projectName: "Project Name",
|
||||
city: "City",
|
||||
address: "Address",
|
||||
plot: "Plot",
|
||||
district: "District",
|
||||
unit: "Unit",
|
||||
finishDate: "Finish Date",
|
||||
type: "Type",
|
||||
contact: "Contact",
|
||||
coordinates: "Coordinates",
|
||||
notes: "Notes",
|
||||
assignedTo: "Assigned To",
|
||||
unassigned: "Unassigned",
|
||||
createdBy: "Created By",
|
||||
lastModified: "Last Modified",
|
||||
basicInformation: "Basic Information",
|
||||
locationDetails: "Location Details",
|
||||
projectDetails: "Project Details",
|
||||
additionalInfo: "Additional Information",
|
||||
searchPlaceholder: "Search projects by name, city or address...",
|
||||
noProjects: "No projects",
|
||||
noProjectsMessage: "Get started by creating your first project.",
|
||||
notFinished: "Not finished",
|
||||
projects: "projects",
|
||||
mapView: "Map View",
|
||||
createFirstProject: "Create first project",
|
||||
noMatchingResults: "No projects match the search criteria. Try changing your search terms.",
|
||||
showingResults: "Showing {shown} of {total} projects",
|
||||
deleteConfirm: "Are you sure you want to delete this project?",
|
||||
deleteSuccess: "Project deleted successfully",
|
||||
createSuccess: "Project created successfully",
|
||||
updateSuccess: "Project updated successfully",
|
||||
saveError: "Failed to save project",
|
||||
enterProjectName: "Enter project name",
|
||||
enterCity: "Enter city",
|
||||
enterAddress: "Enter address",
|
||||
enterPlotNumber: "Enter plot number",
|
||||
enterDistrict: "Enter district",
|
||||
enterUnit: "Enter unit",
|
||||
enterContactDetails: "Enter contact details",
|
||||
coordinatesPlaceholder: "e.g., 49.622958,20.629562",
|
||||
enterNotes: "Enter notes...",
|
||||
createProject: "Create Project",
|
||||
updateProject: "Update Project",
|
||||
creating: "Creating...",
|
||||
updating: "Updating...",
|
||||
projectDetails: "Project Details",
|
||||
editProjectDetails: "Edit Project Details",
|
||||
contract: "Contract",
|
||||
selectContract: "Select Contract",
|
||||
investmentNumber: "Investment Number",
|
||||
enterInvestmentNumber: "Enter investment number",
|
||||
enterWP: "Enter WP",
|
||||
placeholders: {
|
||||
contact: "Enter contact details",
|
||||
coordinates: "e.g., 49.622958,20.629562",
|
||||
notes: "Enter notes...",
|
||||
investmentNumber: "Enter investment number",
|
||||
wp: "Enter WP"
|
||||
}
|
||||
},
|
||||
|
||||
contracts: {
|
||||
title: "Contracts",
|
||||
subtitle: "Manage your contracts and agreements",
|
||||
newContract: "New Contract",
|
||||
editContract: "Edit Contract",
|
||||
deleteContract: "Delete Contract",
|
||||
contractNumber: "Contract Number",
|
||||
contractName: "Contract Name",
|
||||
customerContractNumber: "Customer Contract Number",
|
||||
customer: "Customer",
|
||||
investor: "Investor",
|
||||
dateSigned: "Date Signed",
|
||||
finishDate: "Finish Date",
|
||||
searchPlaceholder: "Search contracts by number, name, customer or investor...",
|
||||
noContracts: "No contracts",
|
||||
noContractsMessage: "Get started by creating your first contract.",
|
||||
noMatchingContracts: "No matching contracts",
|
||||
changeSearchCriteria: "Try changing your search criteria or filters.",
|
||||
all: "All",
|
||||
active: "Active",
|
||||
withoutEndDate: "In Progress",
|
||||
expired: "Expired",
|
||||
createContract: "Create Contract",
|
||||
enterContractNumber: "Enter contract number",
|
||||
enterContractName: "Enter contract name",
|
||||
enterCustomerContractNumber: "Enter customer contract number",
|
||||
enterCustomerName: "Enter customer name",
|
||||
enterInvestorName: "Enter investor name",
|
||||
signedOn: "Signed:",
|
||||
finishOn: "Finish:",
|
||||
customerLabel: "Customer:",
|
||||
investorLabel: "Investor:"
|
||||
},
|
||||
|
||||
tasks: {
|
||||
title: "Tasks",
|
||||
task: "task",
|
||||
tasks: "tasks",
|
||||
subtitle: "Manage project tasks",
|
||||
newTask: "New Task",
|
||||
editTask: "Edit Task",
|
||||
deleteTask: "Delete Task",
|
||||
taskName: "Task Name",
|
||||
description: "Description",
|
||||
priority: "Priority",
|
||||
assignedTo: "Assigned To",
|
||||
dueDate: "Due Date",
|
||||
status: "Status",
|
||||
project: "Project",
|
||||
template: "Template",
|
||||
searchPlaceholder: "Search tasks, projects, city, or address...",
|
||||
noTasks: "No tasks",
|
||||
noTasksMessage: "No tasks assigned to this project yet.",
|
||||
addTaskMessage: "Add a task above to get started.",
|
||||
filterBy: "Filter by",
|
||||
sortBy: "Sort by",
|
||||
allTasks: "All Tasks",
|
||||
myTasks: "My Tasks",
|
||||
overdue: "Overdue",
|
||||
dueSoon: "Due Soon",
|
||||
high: "High",
|
||||
normal: "Normal",
|
||||
medium: "Medium",
|
||||
low: "Low",
|
||||
dateCreated: "Date Created",
|
||||
dateModified: "Date Modified",
|
||||
daysLeft: "days left",
|
||||
daysOverdue: "days overdue",
|
||||
dueToday: "Due Today",
|
||||
startTask: "Start Task",
|
||||
completeTask: "Complete Task",
|
||||
comments: "Comments",
|
||||
addComment: "Add Comment",
|
||||
noComments: "No comments",
|
||||
maxWait: "Max Wait",
|
||||
dateStarted: "Date Started",
|
||||
actions: "Actions",
|
||||
urgent: "Urgent",
|
||||
updateTask: "Update Task",
|
||||
taskType: "Task Type",
|
||||
fromTemplate: "From Template",
|
||||
customTask: "Custom Task",
|
||||
selectTemplate: "Select Task Template",
|
||||
chooseTemplate: "Choose a task template...",
|
||||
enterTaskName: "Enter custom task name...",
|
||||
enterDescription: "Enter task description (optional)...",
|
||||
addTask: "Add Task",
|
||||
adding: "Adding...",
|
||||
addTaskError: "Failed to add task to project",
|
||||
notes: "notes",
|
||||
deleteNote: "Delete note",
|
||||
deleteError: "Error deleting task",
|
||||
notStarted: "Not started",
|
||||
days: "days"
|
||||
},
|
||||
|
||||
taskTemplates: {
|
||||
title: "Task Templates",
|
||||
subtitle: "Manage task templates",
|
||||
newTemplate: "New Template",
|
||||
editTemplate: "Edit Template",
|
||||
deleteTemplate: "Delete Template",
|
||||
templateName: "Template Name",
|
||||
templateDescription: "Template Description",
|
||||
defaultPriority: "Default Priority",
|
||||
estimatedDuration: "Estimated Duration",
|
||||
category: "Category",
|
||||
searchPlaceholder: "Search templates...",
|
||||
noTemplates: "No templates",
|
||||
noTemplatesMessage: "Get started by creating your first task template.",
|
||||
useTemplate: "Use Template",
|
||||
duplicateTemplate: "Duplicate Template"
|
||||
},
|
||||
|
||||
forms: {
|
||||
validation: {
|
||||
required: "This field is required",
|
||||
email: "Please enter a valid email address",
|
||||
minLength: "Minimum length: {min} characters",
|
||||
maxLength: "Maximum length: {max} characters",
|
||||
invalidDate: "Invalid date",
|
||||
invalidCoordinates: "Invalid coordinates"
|
||||
},
|
||||
placeholders: {
|
||||
enterText: "Enter text...",
|
||||
selectDate: "Select date",
|
||||
selectOption: "Select option",
|
||||
searchResults: "Search results..."
|
||||
}
|
||||
},
|
||||
|
||||
sorting: {
|
||||
sortBy: "Sort by",
|
||||
orderBy: "Order by",
|
||||
ascending: "Ascending",
|
||||
descending: "Descending",
|
||||
name: "Name",
|
||||
date: "Date",
|
||||
status: "Status",
|
||||
priority: "Priority",
|
||||
dateCreated: "Date Created",
|
||||
dateModified: "Date Modified",
|
||||
startDate: "Start Date",
|
||||
finishDate: "Finish Date"
|
||||
},
|
||||
|
||||
dates: {
|
||||
today: "Today",
|
||||
yesterday: "Yesterday",
|
||||
tomorrow: "Tomorrow",
|
||||
daysAgo: "{count} days ago",
|
||||
inDays: "in {count} days",
|
||||
invalidDate: "Invalid date",
|
||||
selectDate: "Select date"
|
||||
},
|
||||
|
||||
mapLayers: {
|
||||
polishOrthophoto: "🛰️ Polish Orthophoto",
|
||||
polishCadastral: "📋 Polish Cadastral Data",
|
||||
polishSpatialPlanning: "🏗️ Polish Spatial Planning",
|
||||
lpPortalRoads: "🛣️ LP-Portal Roads",
|
||||
lpPortalStreetNames: "🏷️ LP-Portal Street Names",
|
||||
lpPortalParcels: "📐 LP-Portal Parcels",
|
||||
lpPortalSurveyMarkers: "📍 LP-Portal Survey Markers",
|
||||
openStreetMap: "🗺️ OpenStreetMap",
|
||||
googleSatellite: "🛰️ Google Satellite",
|
||||
googleRoads: "🛣️ Google Roads",
|
||||
layerControl: "Layer Control",
|
||||
baseLayers: "Base Layers",
|
||||
overlayLayers: "Overlay Layers",
|
||||
opacity: "Opacity"
|
||||
},
|
||||
|
||||
auth: {
|
||||
signIn: "Sign In",
|
||||
signOut: "Sign Out",
|
||||
email: "Email",
|
||||
password: "Password",
|
||||
rememberMe: "Remember Me",
|
||||
forgotPassword: "Forgot Password?",
|
||||
signInWith: "Sign in with",
|
||||
signUp: "Sign Up",
|
||||
createAccount: "Create Account",
|
||||
alreadyHaveAccount: "Already have an account?",
|
||||
dontHaveAccount: "Don't have an account?",
|
||||
signInError: "Sign in error",
|
||||
signOutError: "Sign out error",
|
||||
emailRequired: "Email is required",
|
||||
passwordRequired: "Password is required",
|
||||
invalidCredentials: "Invalid credentials"
|
||||
},
|
||||
|
||||
userRoles: {
|
||||
admin: "Administrator",
|
||||
user: "User",
|
||||
manager: "Manager",
|
||||
viewer: "Viewer"
|
||||
},
|
||||
|
||||
errors: {
|
||||
generic: "An error occurred. Please try again.",
|
||||
network: "Network connection error",
|
||||
unauthorized: "Unauthorized",
|
||||
forbidden: "Forbidden",
|
||||
notFound: "Not found",
|
||||
validation: "Validation error",
|
||||
server: "Server error",
|
||||
timeout: "Request timeout",
|
||||
unknown: "Unknown error"
|
||||
},
|
||||
|
||||
success: {
|
||||
saved: "Saved successfully",
|
||||
created: "Created successfully",
|
||||
updated: "Updated successfully",
|
||||
deleted: "Deleted successfully",
|
||||
sent: "Sent successfully",
|
||||
completed: "Completed successfully"
|
||||
},
|
||||
|
||||
admin: {
|
||||
title: "Administration",
|
||||
userManagement: "User Management",
|
||||
auditLogs: "Audit Logs",
|
||||
systemSettings: "System Settings",
|
||||
users: "Users",
|
||||
newUser: "New User",
|
||||
editUser: "Edit User",
|
||||
deleteUser: "Delete User",
|
||||
userName: "User Name",
|
||||
userEmail: "User Email",
|
||||
userRole: "User Role",
|
||||
active: "Active",
|
||||
inactive: "Inactive",
|
||||
lastLogin: "Last Login",
|
||||
createdAt: "Created At",
|
||||
noUsers: "No users",
|
||||
system: "System"
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// Translation provider component
|
||||
export function TranslationProvider({ children, initialLanguage = 'pl' }) {
|
||||
const [language, setLanguage] = useState(initialLanguage);
|
||||
|
||||
// Load language from localStorage on mount
|
||||
useEffect(() => {
|
||||
const savedLanguage = localStorage.getItem('app-language');
|
||||
if (savedLanguage && translations[savedLanguage]) {
|
||||
setLanguage(savedLanguage);
|
||||
}
|
||||
}, []);
|
||||
|
||||
// Save language to localStorage when changed
|
||||
useEffect(() => {
|
||||
localStorage.setItem('app-language', language);
|
||||
}, [language]);
|
||||
|
||||
const changeLanguage = (newLanguage) => {
|
||||
if (translations[newLanguage]) {
|
||||
setLanguage(newLanguage);
|
||||
}
|
||||
};
|
||||
|
||||
const t = (key, replacements = {}) => {
|
||||
const keys = key.split('.');
|
||||
let value = translations[language];
|
||||
|
||||
for (const k of keys) {
|
||||
if (value && typeof value === 'object' && k in value) {
|
||||
value = value[k];
|
||||
} else {
|
||||
// Fallback to English if key not found in current language
|
||||
value = translations.en;
|
||||
for (const fallbackKey of keys) {
|
||||
if (value && typeof value === 'object' && fallbackKey in value) {
|
||||
value = value[fallbackKey];
|
||||
} else {
|
||||
console.warn(`Translation key not found: ${key} (language: ${language})`);
|
||||
return key; // Return the key itself as fallback
|
||||
}
|
||||
}
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (typeof value !== 'string') {
|
||||
console.warn(`Translation value is not a string: ${key} (language: ${language})`);
|
||||
return key;
|
||||
}
|
||||
|
||||
// Replace placeholders like {count}, {min}, {max}, etc.
|
||||
let result = value;
|
||||
Object.keys(replacements).forEach(placeholder => {
|
||||
result = result.replace(new RegExp(`{${placeholder}}`, 'g'), replacements[placeholder]);
|
||||
});
|
||||
|
||||
return result;
|
||||
};
|
||||
|
||||
return (
|
||||
<TranslationContext.Provider value={{
|
||||
t,
|
||||
language,
|
||||
changeLanguage,
|
||||
availableLanguages: Object.keys(translations)
|
||||
}}>
|
||||
{children}
|
||||
</TranslationContext.Provider>
|
||||
);
|
||||
}
|
||||
|
||||
// Hook to use translations
|
||||
export function useTranslation() {
|
||||
const context = useContext(TranslationContext);
|
||||
if (!context) {
|
||||
throw new Error('useTranslation must be used within a TranslationProvider');
|
||||
}
|
||||
return context;
|
||||
}
|
||||
|
||||
// Export translations for direct access if needed
|
||||
export { translations };
|
||||
@@ -31,7 +31,7 @@ export default function initializeDatabase() {
|
||||
contact TEXT,
|
||||
notes TEXT,
|
||||
project_type TEXT CHECK(project_type IN ('design', 'construction', 'design+construction')) DEFAULT 'design',
|
||||
project_status TEXT CHECK(project_status IN ('registered', 'in_progress_design', 'in_progress_construction', 'fulfilled')) DEFAULT 'registered',
|
||||
project_status TEXT CHECK(project_status IN ('registered', 'in_progress_design', 'in_progress_construction', 'fulfilled', 'cancelled')) DEFAULT 'registered',
|
||||
FOREIGN KEY (contract_id) REFERENCES contracts(contract_id)
|
||||
);
|
||||
|
||||
@@ -113,7 +113,7 @@ export default function initializeDatabase() {
|
||||
// Migration: Add project_status column to projects table
|
||||
try {
|
||||
db.exec(`
|
||||
ALTER TABLE projects ADD COLUMN project_status TEXT CHECK(project_status IN ('registered', 'in_progress_design', 'in_progress_construction', 'fulfilled')) DEFAULT 'registered';
|
||||
ALTER TABLE projects ADD COLUMN project_status TEXT CHECK(project_status IN ('registered', 'in_progress_design', 'in_progress_construction', 'fulfilled', 'cancelled')) DEFAULT 'registered';
|
||||
`);
|
||||
} catch (e) {
|
||||
// Column already exists, ignore error
|
||||
@@ -273,7 +273,7 @@ export default function initializeDatabase() {
|
||||
CREATE TABLE IF NOT EXISTS users (
|
||||
id TEXT PRIMARY KEY DEFAULT (lower(hex(randomblob(16)))),
|
||||
name TEXT NOT NULL,
|
||||
email TEXT UNIQUE NOT NULL,
|
||||
username TEXT UNIQUE NOT NULL,
|
||||
password_hash TEXT NOT NULL,
|
||||
role TEXT CHECK(role IN ('admin', 'project_manager', 'user', 'read_only')) DEFAULT 'user',
|
||||
created_at TEXT DEFAULT CURRENT_TIMESTAMP,
|
||||
@@ -309,9 +309,77 @@ export default function initializeDatabase() {
|
||||
);
|
||||
|
||||
-- Create indexes for performance
|
||||
CREATE INDEX IF NOT EXISTS idx_users_email ON users(email);
|
||||
CREATE INDEX IF NOT EXISTS idx_users_username ON users(username);
|
||||
CREATE INDEX IF NOT EXISTS idx_sessions_token ON sessions(session_token);
|
||||
CREATE INDEX IF NOT EXISTS idx_sessions_user ON sessions(user_id);
|
||||
CREATE INDEX IF NOT EXISTS idx_audit_user_timestamp ON audit_logs(user_id, timestamp);
|
||||
`);
|
||||
|
||||
// Migration: Add username column and migrate from email if needed
|
||||
try {
|
||||
// Check if username column exists
|
||||
const columns = db.prepare("PRAGMA table_info(users)").all();
|
||||
const hasUsername = columns.some(col => col.name === 'username');
|
||||
const hasEmail = columns.some(col => col.name === 'email');
|
||||
|
||||
if (!hasUsername && hasEmail) {
|
||||
// Add username column
|
||||
db.exec(`ALTER TABLE users ADD COLUMN username TEXT;`);
|
||||
|
||||
// Migrate existing email data to username (for development/testing)
|
||||
// In production, you might want to handle this differently
|
||||
db.exec(`UPDATE users SET username = email WHERE username IS NULL;`);
|
||||
|
||||
// Create unique index on username
|
||||
db.exec(`CREATE UNIQUE INDEX IF NOT EXISTS idx_users_username_unique ON users(username);`);
|
||||
|
||||
console.log("✅ Migrated users table from email to username");
|
||||
} else if (!hasUsername) {
|
||||
// If neither username nor email exists, something is wrong
|
||||
console.warn("⚠️ Users table missing both username and email columns");
|
||||
}
|
||||
} catch (e) {
|
||||
console.warn("Migration warning:", e.message);
|
||||
}
|
||||
|
||||
// Generic file attachments table
|
||||
db.exec(`
|
||||
CREATE TABLE IF NOT EXISTS file_attachments (
|
||||
file_id INTEGER PRIMARY KEY AUTOINCREMENT,
|
||||
entity_type TEXT NOT NULL CHECK(entity_type IN ('contract', 'project', 'task')),
|
||||
entity_id INTEGER NOT NULL,
|
||||
original_filename TEXT NOT NULL,
|
||||
stored_filename TEXT NOT NULL,
|
||||
file_path TEXT NOT NULL,
|
||||
file_size INTEGER,
|
||||
mime_type TEXT,
|
||||
description TEXT,
|
||||
uploaded_by TEXT,
|
||||
upload_date TEXT DEFAULT CURRENT_TIMESTAMP,
|
||||
FOREIGN KEY (uploaded_by) REFERENCES users(id)
|
||||
);
|
||||
|
||||
-- Create indexes for file attachments
|
||||
CREATE INDEX IF NOT EXISTS idx_file_attachments_entity ON file_attachments(entity_type, entity_id);
|
||||
CREATE INDEX IF NOT EXISTS idx_file_attachments_uploaded_by ON file_attachments(uploaded_by);
|
||||
|
||||
-- Generic field change history table
|
||||
CREATE TABLE IF NOT EXISTS field_change_history (
|
||||
id INTEGER PRIMARY KEY AUTOINCREMENT,
|
||||
table_name TEXT NOT NULL,
|
||||
record_id INTEGER NOT NULL,
|
||||
field_name TEXT NOT NULL,
|
||||
old_value TEXT,
|
||||
new_value TEXT,
|
||||
changed_by INTEGER,
|
||||
changed_at TEXT DEFAULT CURRENT_TIMESTAMP,
|
||||
change_reason TEXT,
|
||||
FOREIGN KEY (changed_by) REFERENCES users(id)
|
||||
);
|
||||
|
||||
-- Create indexes for field change history
|
||||
CREATE INDEX IF NOT EXISTS idx_field_history_table_record ON field_change_history(table_name, record_id);
|
||||
CREATE INDEX IF NOT EXISTS idx_field_history_field ON field_change_history(table_name, record_id, field_name);
|
||||
CREATE INDEX IF NOT EXISTS idx_field_history_changed_by ON field_change_history(changed_by);
|
||||
`);
|
||||
}
|
||||
|
||||
94
src/lib/queries/fieldHistory.js
Normal file
94
src/lib/queries/fieldHistory.js
Normal file
@@ -0,0 +1,94 @@
|
||||
import db from "../db.js";
|
||||
|
||||
/**
|
||||
* Log a field change to the history table
|
||||
*/
|
||||
export function logFieldChange(tableName, recordId, fieldName, oldValue, newValue, changedBy = null, reason = null) {
|
||||
// Don't log if values are the same
|
||||
if (oldValue === newValue) return null;
|
||||
|
||||
const stmt = db.prepare(`
|
||||
INSERT INTO field_change_history
|
||||
(table_name, record_id, field_name, old_value, new_value, changed_by, change_reason)
|
||||
VALUES (?, ?, ?, ?, ?, ?, ?)
|
||||
`);
|
||||
|
||||
return stmt.run(
|
||||
tableName,
|
||||
recordId,
|
||||
fieldName,
|
||||
oldValue || null,
|
||||
newValue || null,
|
||||
changedBy,
|
||||
reason
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Get field change history for a specific field
|
||||
*/
|
||||
export function getFieldHistory(tableName, recordId, fieldName) {
|
||||
const stmt = db.prepare(`
|
||||
SELECT
|
||||
fch.*,
|
||||
u.name as changed_by_name,
|
||||
u.username as changed_by_username
|
||||
FROM field_change_history fch
|
||||
LEFT JOIN users u ON fch.changed_by = u.id
|
||||
WHERE fch.table_name = ? AND fch.record_id = ? AND fch.field_name = ?
|
||||
ORDER BY fch.changed_at DESC
|
||||
`);
|
||||
|
||||
return stmt.all(tableName, recordId, fieldName);
|
||||
}
|
||||
|
||||
/**
|
||||
* Get all field changes for a specific record
|
||||
*/
|
||||
export function getAllFieldHistory(tableName, recordId) {
|
||||
const stmt = db.prepare(`
|
||||
SELECT
|
||||
fch.*,
|
||||
u.name as changed_by_name,
|
||||
u.username as changed_by_username
|
||||
FROM field_change_history fch
|
||||
LEFT JOIN users u ON fch.changed_by = u.id
|
||||
WHERE fch.table_name = ? AND fch.record_id = ?
|
||||
ORDER BY fch.changed_at DESC, fch.field_name ASC
|
||||
`);
|
||||
|
||||
return stmt.all(tableName, recordId);
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if a field has any change history
|
||||
*/
|
||||
export function hasFieldHistory(tableName, recordId, fieldName) {
|
||||
const stmt = db.prepare(`
|
||||
SELECT COUNT(*) as count
|
||||
FROM field_change_history
|
||||
WHERE table_name = ? AND record_id = ? AND field_name = ?
|
||||
`);
|
||||
|
||||
const result = stmt.get(tableName, recordId, fieldName);
|
||||
return result.count > 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the most recent change for a field
|
||||
*/
|
||||
export function getLatestFieldChange(tableName, recordId, fieldName) {
|
||||
const stmt = db.prepare(`
|
||||
SELECT
|
||||
fch.*,
|
||||
u.name as changed_by_name,
|
||||
u.username as changed_by_username
|
||||
FROM field_change_history fch
|
||||
LEFT JOIN users u ON fch.changed_by = u.id
|
||||
WHERE fch.table_name = ? AND fch.record_id = ? AND fch.field_name = ?
|
||||
ORDER BY fch.changed_at DESC
|
||||
LIMIT 1
|
||||
`);
|
||||
|
||||
return stmt.get(tableName, recordId, fieldName);
|
||||
}
|
||||
@@ -6,7 +6,7 @@ export function getNotesByProjectId(project_id) {
|
||||
`
|
||||
SELECT n.*,
|
||||
u.name as created_by_name,
|
||||
u.email as created_by_email
|
||||
u.username as created_by_username
|
||||
FROM notes n
|
||||
LEFT JOIN users u ON n.created_by = u.id
|
||||
WHERE n.project_id = ?
|
||||
@@ -16,13 +16,13 @@ export function getNotesByProjectId(project_id) {
|
||||
.all(project_id);
|
||||
}
|
||||
|
||||
export function addNoteToProject(project_id, note, created_by = null) {
|
||||
export function addNoteToProject(project_id, note, created_by = null, is_system = false) {
|
||||
db.prepare(
|
||||
`
|
||||
INSERT INTO notes (project_id, note, created_by, note_date)
|
||||
VALUES (?, ?, ?, CURRENT_TIMESTAMP)
|
||||
INSERT INTO notes (project_id, note, created_by, is_system, note_date)
|
||||
VALUES (?, ?, ?, ?, CURRENT_TIMESTAMP)
|
||||
`
|
||||
).run(project_id, note, created_by);
|
||||
).run(project_id, note, created_by, is_system ? 1 : 0);
|
||||
}
|
||||
|
||||
export function getNotesByTaskId(task_id) {
|
||||
@@ -31,7 +31,7 @@ export function getNotesByTaskId(task_id) {
|
||||
`
|
||||
SELECT n.*,
|
||||
u.name as created_by_name,
|
||||
u.email as created_by_email
|
||||
u.username as created_by_username
|
||||
FROM notes n
|
||||
LEFT JOIN users u ON n.created_by = u.id
|
||||
WHERE n.task_id = ?
|
||||
@@ -64,7 +64,7 @@ export function getAllNotesWithUsers() {
|
||||
`
|
||||
SELECT n.*,
|
||||
u.name as created_by_name,
|
||||
u.email as created_by_email,
|
||||
u.username as created_by_username,
|
||||
p.project_name,
|
||||
COALESCE(pt.custom_task_name, t.name) as task_name
|
||||
FROM notes n
|
||||
@@ -85,7 +85,7 @@ export function getNotesByCreator(userId) {
|
||||
`
|
||||
SELECT n.*,
|
||||
u.name as created_by_name,
|
||||
u.email as created_by_email,
|
||||
u.username as created_by_username,
|
||||
p.project_name,
|
||||
COALESCE(pt.custom_task_name, t.name) as task_name
|
||||
FROM notes n
|
||||
|
||||
@@ -4,11 +4,16 @@ export function getAllProjects(contractId = null) {
|
||||
const baseQuery = `
|
||||
SELECT
|
||||
p.*,
|
||||
c.contract_number,
|
||||
c.contract_name,
|
||||
c.customer,
|
||||
c.investor,
|
||||
creator.name as created_by_name,
|
||||
creator.email as created_by_email,
|
||||
creator.username as created_by_username,
|
||||
assignee.name as assigned_to_name,
|
||||
assignee.email as assigned_to_email
|
||||
assignee.username as assigned_to_username
|
||||
FROM projects p
|
||||
LEFT JOIN contracts c ON p.contract_id = c.contract_id
|
||||
LEFT JOIN users creator ON p.created_by = creator.id
|
||||
LEFT JOIN users assignee ON p.assigned_to = assignee.id
|
||||
`;
|
||||
@@ -30,9 +35,9 @@ export function getProjectById(id) {
|
||||
SELECT
|
||||
p.*,
|
||||
creator.name as created_by_name,
|
||||
creator.email as created_by_email,
|
||||
creator.username as created_by_username,
|
||||
assignee.name as assigned_to_name,
|
||||
assignee.email as assigned_to_email
|
||||
assignee.username as assigned_to_username
|
||||
FROM projects p
|
||||
LEFT JOIN users creator ON p.created_by = creator.id
|
||||
LEFT JOIN users assignee ON p.assigned_to = assignee.id
|
||||
@@ -105,7 +110,7 @@ export function updateProject(id, data, userId = null) {
|
||||
coordinates = ?, assigned_to = ?, updated_at = CURRENT_TIMESTAMP
|
||||
WHERE project_id = ?
|
||||
`);
|
||||
stmt.run(
|
||||
const result = stmt.run(
|
||||
data.contract_id,
|
||||
data.project_name,
|
||||
data.project_number,
|
||||
@@ -125,6 +130,9 @@ export function updateProject(id, data, userId = null) {
|
||||
data.assigned_to || null,
|
||||
id
|
||||
);
|
||||
|
||||
console.log('Update result:', result);
|
||||
return result;
|
||||
}
|
||||
|
||||
export function deleteProject(id) {
|
||||
@@ -136,7 +144,7 @@ export function getAllUsersForAssignment() {
|
||||
return db
|
||||
.prepare(
|
||||
`
|
||||
SELECT id, name, email, role
|
||||
SELECT id, name, username, role
|
||||
FROM users
|
||||
WHERE is_active = 1
|
||||
ORDER BY name
|
||||
@@ -153,9 +161,9 @@ export function getProjectsByAssignedUser(userId) {
|
||||
SELECT
|
||||
p.*,
|
||||
creator.name as created_by_name,
|
||||
creator.email as created_by_email,
|
||||
creator.username as created_by_username,
|
||||
assignee.name as assigned_to_name,
|
||||
assignee.email as assigned_to_email
|
||||
assignee.username as assigned_to_username
|
||||
FROM projects p
|
||||
LEFT JOIN users creator ON p.created_by = creator.id
|
||||
LEFT JOIN users assignee ON p.assigned_to = assignee.id
|
||||
@@ -174,9 +182,9 @@ export function getProjectsByCreator(userId) {
|
||||
SELECT
|
||||
p.*,
|
||||
creator.name as created_by_name,
|
||||
creator.email as created_by_email,
|
||||
creator.username as created_by_username,
|
||||
assignee.name as assigned_to_name,
|
||||
assignee.email as assigned_to_email
|
||||
assignee.username as assigned_to_username
|
||||
FROM projects p
|
||||
LEFT JOIN users creator ON p.created_by = creator.id
|
||||
LEFT JOIN users assignee ON p.assigned_to = assignee.id
|
||||
@@ -224,7 +232,7 @@ export function getNotesForProject(projectId) {
|
||||
`
|
||||
SELECT n.*,
|
||||
u.name as created_by_name,
|
||||
u.email as created_by_email
|
||||
u.username as created_by_username
|
||||
FROM notes n
|
||||
LEFT JOIN users u ON n.created_by = u.id
|
||||
WHERE n.project_id = ?
|
||||
@@ -233,3 +241,39 @@ export function getNotesForProject(projectId) {
|
||||
)
|
||||
.all(projectId);
|
||||
}
|
||||
|
||||
// Get finish date update history for a project
|
||||
export function getFinishDateUpdates(projectId) {
|
||||
return db
|
||||
.prepare(
|
||||
`
|
||||
SELECT fdu.*,
|
||||
u.name as updated_by_name,
|
||||
u.username as updated_by_username
|
||||
FROM project_finish_date_updates fdu
|
||||
LEFT JOIN users u ON fdu.updated_by = u.id
|
||||
WHERE fdu.project_id = ?
|
||||
ORDER BY fdu.updated_at DESC
|
||||
`
|
||||
)
|
||||
.all(projectId);
|
||||
}
|
||||
|
||||
// Log a finish date update
|
||||
export function logFinishDateUpdate(projectId, oldDate, newDate, userId, reason = null) {
|
||||
const stmt = db.prepare(`
|
||||
INSERT INTO project_finish_date_updates (
|
||||
project_id, old_finish_date, new_finish_date, updated_by, reason, updated_at
|
||||
) VALUES (?, ?, ?, ?, ?, CURRENT_TIMESTAMP)
|
||||
`);
|
||||
|
||||
return stmt.run(projectId, oldDate, newDate, userId, reason);
|
||||
}
|
||||
|
||||
// Check if project has finish date updates
|
||||
export function hasFinishDateUpdates(projectId) {
|
||||
const result = db
|
||||
.prepare('SELECT COUNT(*) as count FROM project_finish_date_updates WHERE project_id = ?')
|
||||
.get(projectId);
|
||||
return result.count > 0;
|
||||
}
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import db from "../db.js";
|
||||
import { addNoteToTask } from "./notes.js";
|
||||
import { getUserLanguage, serverT, translateStatus, translatePriority } from "../serverTranslations.js";
|
||||
|
||||
// Get all task templates (for dropdown selection)
|
||||
export function getAllTaskTemplates() {
|
||||
@@ -29,9 +30,9 @@ export function getAllProjectTasks() {
|
||||
p.address,
|
||||
p.finish_date,
|
||||
creator.name as created_by_name,
|
||||
creator.email as created_by_email,
|
||||
creator.username as created_by_username,
|
||||
assignee.name as assigned_to_name,
|
||||
assignee.email as assigned_to_email
|
||||
assignee.username as assigned_to_username
|
||||
FROM project_tasks pt
|
||||
LEFT JOIN tasks t ON pt.task_template_id = t.task_id
|
||||
LEFT JOIN projects p ON pt.project_id = p.project_id
|
||||
@@ -58,9 +59,9 @@ export function getProjectTasks(projectId) {
|
||||
ELSE 'custom'
|
||||
END as task_type,
|
||||
creator.name as created_by_name,
|
||||
creator.email as created_by_email,
|
||||
creator.username as created_by_username,
|
||||
assignee.name as assigned_to_name,
|
||||
assignee.email as assigned_to_email
|
||||
assignee.username as assigned_to_username
|
||||
FROM project_tasks pt
|
||||
LEFT JOIN tasks t ON pt.task_template_id = t.task_id
|
||||
LEFT JOIN users creator ON pt.created_by = creator.id
|
||||
@@ -182,8 +183,10 @@ export function updateProjectTaskStatus(taskId, status, userId = null) {
|
||||
|
||||
// Add system note for status change (only if status actually changed)
|
||||
if (result.changes > 0 && oldStatus !== status) {
|
||||
const taskName = currentTask.task_name || "Unknown task";
|
||||
const logMessage = `Status changed from "${oldStatus}" to "${status}"`;
|
||||
const language = getUserLanguage(); // Default to Polish for now
|
||||
const fromStatus = translateStatus(oldStatus, language);
|
||||
const toStatus = translateStatus(status, language);
|
||||
const logMessage = `${serverT("Status changed from", language)} "${fromStatus}" ${serverT("to", language)} "${toStatus}"`;
|
||||
addNoteToTask(taskId, logMessage, true, userId);
|
||||
}
|
||||
|
||||
@@ -192,8 +195,13 @@ export function updateProjectTaskStatus(taskId, status, userId = null) {
|
||||
|
||||
// Delete a project task
|
||||
export function deleteProjectTask(taskId) {
|
||||
const stmt = db.prepare("DELETE FROM project_tasks WHERE id = ?");
|
||||
return stmt.run(taskId);
|
||||
// First delete all related task notes
|
||||
const deleteNotesStmt = db.prepare("DELETE FROM notes WHERE task_id = ?");
|
||||
deleteNotesStmt.run(taskId);
|
||||
|
||||
// Then delete the task itself
|
||||
const deleteTaskStmt = db.prepare("DELETE FROM project_tasks WHERE id = ?");
|
||||
return deleteTaskStmt.run(taskId);
|
||||
}
|
||||
|
||||
// Get project tasks assigned to a specific user
|
||||
@@ -217,9 +225,9 @@ export function getProjectTasksByAssignedUser(userId) {
|
||||
p.address,
|
||||
p.finish_date,
|
||||
creator.name as created_by_name,
|
||||
creator.email as created_by_email,
|
||||
creator.username as created_by_username,
|
||||
assignee.name as assigned_to_name,
|
||||
assignee.email as assigned_to_email
|
||||
assignee.username as assigned_to_username
|
||||
FROM project_tasks pt
|
||||
LEFT JOIN tasks t ON pt.task_template_id = t.task_id
|
||||
LEFT JOIN projects p ON pt.project_id = p.project_id
|
||||
@@ -253,9 +261,9 @@ export function getProjectTasksByCreator(userId) {
|
||||
p.address,
|
||||
p.finish_date,
|
||||
creator.name as created_by_name,
|
||||
creator.email as created_by_email,
|
||||
creator.username as created_by_username,
|
||||
assignee.name as assigned_to_name,
|
||||
assignee.email as assigned_to_email
|
||||
assignee.username as assigned_to_username
|
||||
FROM project_tasks pt
|
||||
LEFT JOIN tasks t ON pt.task_template_id = t.task_id
|
||||
LEFT JOIN projects p ON pt.project_id = p.project_id
|
||||
@@ -283,7 +291,7 @@ export function getAllUsersForTaskAssignment() {
|
||||
return db
|
||||
.prepare(
|
||||
`
|
||||
SELECT id, name, email, role
|
||||
SELECT id, name, username, role
|
||||
FROM users
|
||||
WHERE is_active = 1
|
||||
ORDER BY name ASC
|
||||
@@ -291,3 +299,114 @@ export function getAllUsersForTaskAssignment() {
|
||||
)
|
||||
.all();
|
||||
}
|
||||
|
||||
// Update project task (general update for edit modal)
|
||||
export function updateProjectTask(taskId, updates, userId = null) {
|
||||
// Get current task for logging
|
||||
const getCurrentTask = db.prepare(`
|
||||
SELECT
|
||||
pt.*,
|
||||
COALESCE(pt.custom_task_name, t.name) as task_name
|
||||
FROM project_tasks pt
|
||||
LEFT JOIN tasks t ON pt.task_template_id = t.task_id
|
||||
WHERE pt.id = ?
|
||||
`);
|
||||
const currentTask = getCurrentTask.get(taskId);
|
||||
|
||||
if (!currentTask) {
|
||||
throw new Error(`Task with ID ${taskId} not found`);
|
||||
}
|
||||
|
||||
// Build dynamic update query
|
||||
const fields = [];
|
||||
const values = [];
|
||||
|
||||
if (updates.priority !== undefined) {
|
||||
fields.push("priority = ?");
|
||||
values.push(updates.priority);
|
||||
}
|
||||
|
||||
if (updates.status !== undefined) {
|
||||
fields.push("status = ?");
|
||||
values.push(updates.status);
|
||||
|
||||
// Handle status-specific timestamp updates
|
||||
if (currentTask.status === "pending" && updates.status === "in_progress") {
|
||||
fields.push("date_started = CURRENT_TIMESTAMP");
|
||||
} else if (updates.status === "completed") {
|
||||
fields.push("date_completed = CURRENT_TIMESTAMP");
|
||||
}
|
||||
}
|
||||
|
||||
if (updates.assigned_to !== undefined) {
|
||||
fields.push("assigned_to = ?");
|
||||
values.push(updates.assigned_to || null);
|
||||
}
|
||||
|
||||
if (updates.date_started !== undefined) {
|
||||
fields.push("date_started = ?");
|
||||
values.push(updates.date_started || null);
|
||||
}
|
||||
|
||||
// Always update the updated_at timestamp
|
||||
fields.push("updated_at = CURRENT_TIMESTAMP");
|
||||
values.push(taskId);
|
||||
|
||||
const stmt = db.prepare(`
|
||||
UPDATE project_tasks
|
||||
SET ${fields.join(", ")}
|
||||
WHERE id = ?
|
||||
`);
|
||||
|
||||
const result = stmt.run(...values);
|
||||
|
||||
// Log the update
|
||||
if (userId) {
|
||||
const language = getUserLanguage(); // Default to Polish for now
|
||||
const changes = [];
|
||||
|
||||
if (
|
||||
updates.priority !== undefined &&
|
||||
updates.priority !== currentTask.priority
|
||||
) {
|
||||
const oldPriority = translatePriority(currentTask.priority, language) || serverT("None", language);
|
||||
const newPriority = translatePriority(updates.priority, language) || serverT("None", language);
|
||||
changes.push(
|
||||
`${serverT("Priority", language)}: ${oldPriority} → ${newPriority}`
|
||||
);
|
||||
}
|
||||
|
||||
if (updates.status !== undefined && updates.status !== currentTask.status) {
|
||||
const oldStatus = translateStatus(currentTask.status, language) || serverT("None", language);
|
||||
const newStatus = translateStatus(updates.status, language) || serverT("None", language);
|
||||
changes.push(
|
||||
`${serverT("Status", language)}: ${oldStatus} → ${newStatus}`
|
||||
);
|
||||
}
|
||||
|
||||
if (
|
||||
updates.assigned_to !== undefined &&
|
||||
updates.assigned_to !== currentTask.assigned_to
|
||||
) {
|
||||
changes.push(serverT("Assignment updated", language));
|
||||
}
|
||||
|
||||
if (
|
||||
updates.date_started !== undefined &&
|
||||
updates.date_started !== currentTask.date_started
|
||||
) {
|
||||
const oldDate = currentTask.date_started || serverT("None", language);
|
||||
const newDate = updates.date_started || serverT("None", language);
|
||||
changes.push(
|
||||
`${serverT("Date started", language)}: ${oldDate} → ${newDate}`
|
||||
);
|
||||
}
|
||||
|
||||
if (changes.length > 0) {
|
||||
const logMessage = `${serverT("Task updated", language)}: ${changes.join(", ")}`;
|
||||
addNoteToTask(taskId, logMessage, true, userId);
|
||||
}
|
||||
}
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
0
src/lib/schemas/validation.js
Normal file
0
src/lib/schemas/validation.js
Normal file
79
src/lib/serverTranslations.js
Normal file
79
src/lib/serverTranslations.js
Normal file
@@ -0,0 +1,79 @@
|
||||
// Server-side translations for system messages
|
||||
// This is separate from the client-side translation system
|
||||
|
||||
const serverTranslations = {
|
||||
pl: {
|
||||
"Status changed from": "Status zmieniony z",
|
||||
"to": "na",
|
||||
"Priority": "Priorytet",
|
||||
"Status": "Status",
|
||||
"Assignment updated": "Przypisanie zaktualizowane",
|
||||
"Date started": "Data rozpoczęcia",
|
||||
"None": "Brak",
|
||||
"Task updated": "Zadanie zaktualizowane",
|
||||
"pending": "oczekujące",
|
||||
"in_progress": "w trakcie",
|
||||
"completed": "ukończone",
|
||||
"cancelled": "anulowane",
|
||||
"on_hold": "wstrzymane",
|
||||
"low": "niski",
|
||||
"normal": "normalny",
|
||||
"medium": "średni",
|
||||
"high": "wysoki",
|
||||
"urgent": "pilny"
|
||||
},
|
||||
en: {
|
||||
"Status changed from": "Status changed from",
|
||||
"to": "to",
|
||||
"Priority": "Priority",
|
||||
"Status": "Status",
|
||||
"Assignment updated": "Assignment updated",
|
||||
"Date started": "Date started",
|
||||
"None": "None",
|
||||
"Task updated": "Task updated",
|
||||
"pending": "pending",
|
||||
"in_progress": "in_progress",
|
||||
"completed": "completed",
|
||||
"cancelled": "cancelled",
|
||||
"on_hold": "on_hold",
|
||||
"low": "low",
|
||||
"normal": "normal",
|
||||
"medium": "medium",
|
||||
"high": "high",
|
||||
"urgent": "urgent"
|
||||
}
|
||||
};
|
||||
|
||||
// Get user's preferred language from request headers or default to Polish
|
||||
export function getUserLanguage(req = null) {
|
||||
// For now, default to Polish. In the future, this could be determined from:
|
||||
// - Request headers (Accept-Language)
|
||||
// - User profile settings
|
||||
// - Session data
|
||||
return 'pl';
|
||||
}
|
||||
|
||||
// Translate a key for server-side use
|
||||
export function serverT(key, language = 'pl') {
|
||||
if (serverTranslations[language] && serverTranslations[language][key]) {
|
||||
return serverTranslations[language][key];
|
||||
}
|
||||
|
||||
// Fallback to English if Polish not found
|
||||
if (language !== 'en' && serverTranslations.en[key]) {
|
||||
return serverTranslations.en[key];
|
||||
}
|
||||
|
||||
// Return the key itself if no translation found
|
||||
return key;
|
||||
}
|
||||
|
||||
// Helper function to translate status values
|
||||
export function translateStatus(status, language = 'pl') {
|
||||
return serverT(status, language);
|
||||
}
|
||||
|
||||
// Helper function to translate priority values
|
||||
export function translatePriority(priority, language = 'pl') {
|
||||
return serverT(priority, language);
|
||||
}
|
||||
@@ -3,22 +3,22 @@ import bcrypt from "bcryptjs"
|
||||
import { randomBytes } from "crypto"
|
||||
|
||||
// Create a new user
|
||||
export async function createUser({ name, email, password, role = 'user', is_active = true }) {
|
||||
const existingUser = db.prepare("SELECT id FROM users WHERE email = ?").get(email)
|
||||
export async function createUser({ name, username, password, role = 'user', is_active = true }) {
|
||||
const existingUser = db.prepare("SELECT id FROM users WHERE username = ?").get(username)
|
||||
if (existingUser) {
|
||||
throw new Error("User with this email already exists")
|
||||
throw new Error("User with this username already exists")
|
||||
}
|
||||
|
||||
const passwordHash = await bcrypt.hash(password, 12)
|
||||
const userId = randomBytes(16).toString('hex')
|
||||
|
||||
const result = db.prepare(`
|
||||
INSERT INTO users (id, name, email, password_hash, role, is_active)
|
||||
INSERT INTO users (id, name, username, password_hash, role, is_active)
|
||||
VALUES (?, ?, ?, ?, ?, ?)
|
||||
`).run(userId, name, email, passwordHash, role, is_active ? 1 : 0)
|
||||
`).run(userId, name, username, passwordHash, role, is_active ? 1 : 0)
|
||||
|
||||
return db.prepare(`
|
||||
SELECT id, name, email, role, created_at, updated_at, last_login,
|
||||
SELECT id, name, username, role, created_at, updated_at, last_login,
|
||||
is_active, failed_login_attempts, locked_until
|
||||
FROM users WHERE id = ?
|
||||
`).get(userId)
|
||||
@@ -27,24 +27,24 @@ export async function createUser({ name, email, password, role = 'user', is_acti
|
||||
// Get user by ID
|
||||
export function getUserById(id) {
|
||||
return db.prepare(`
|
||||
SELECT id, name, email, password_hash, role, created_at, updated_at, last_login,
|
||||
SELECT id, name, username, password_hash, role, created_at, updated_at, last_login,
|
||||
is_active, failed_login_attempts, locked_until
|
||||
FROM users WHERE id = ?
|
||||
`).get(id)
|
||||
}
|
||||
|
||||
// Get user by email
|
||||
export function getUserByEmail(email) {
|
||||
// Get user by username
|
||||
export function getUserByUsername(username) {
|
||||
return db.prepare(`
|
||||
SELECT id, name, email, role, created_at, last_login, is_active
|
||||
FROM users WHERE email = ?
|
||||
`).get(email)
|
||||
SELECT id, name, username, role, created_at, last_login, is_active
|
||||
FROM users WHERE username = ?
|
||||
`).get(username)
|
||||
}
|
||||
|
||||
// Get all users (for admin)
|
||||
export function getAllUsers() {
|
||||
return db.prepare(`
|
||||
SELECT id, name, email, password_hash, role, created_at, updated_at, last_login, is_active,
|
||||
SELECT id, name, username, password_hash, role, created_at, updated_at, last_login, is_active,
|
||||
failed_login_attempts, locked_until
|
||||
FROM users
|
||||
ORDER BY created_at DESC
|
||||
@@ -136,11 +136,11 @@ export async function updateUser(userId, updates) {
|
||||
return null;
|
||||
}
|
||||
|
||||
// Check if email is being changed and if it already exists
|
||||
if (updates.email && updates.email !== user.email) {
|
||||
const existingUser = db.prepare("SELECT id FROM users WHERE email = ? AND id != ?").get(updates.email, userId);
|
||||
// Check if username is being changed and if it already exists
|
||||
if (updates.username && updates.username !== user.username) {
|
||||
const existingUser = db.prepare("SELECT id FROM users WHERE username = ? AND id != ?").get(updates.username, userId);
|
||||
if (existingUser) {
|
||||
throw new Error("User with this email already exists");
|
||||
throw new Error("User with this username already exists");
|
||||
}
|
||||
}
|
||||
|
||||
@@ -153,9 +153,9 @@ export async function updateUser(userId, updates) {
|
||||
updateValues.push(updates.name);
|
||||
}
|
||||
|
||||
if (updates.email !== undefined) {
|
||||
updateFields.push("email = ?");
|
||||
updateValues.push(updates.email);
|
||||
if (updates.username !== undefined) {
|
||||
updateFields.push("username = ?");
|
||||
updateValues.push(updates.username);
|
||||
}
|
||||
|
||||
if (updates.role !== undefined) {
|
||||
@@ -198,7 +198,7 @@ export async function updateUser(userId, updates) {
|
||||
|
||||
if (result.changes > 0) {
|
||||
return db.prepare(`
|
||||
SELECT id, name, email, role, created_at, updated_at, last_login,
|
||||
SELECT id, name, username, role, created_at, updated_at, last_login,
|
||||
is_active, failed_login_attempts, locked_until
|
||||
FROM users WHERE id = ?
|
||||
`).get(userId);
|
||||
|
||||
@@ -15,6 +15,8 @@ export const formatProjectStatus = (status) => {
|
||||
return "W realizacji (realizacja)";
|
||||
case "fulfilled":
|
||||
return "Zakończony";
|
||||
case "cancelled":
|
||||
return "Wycofany";
|
||||
default:
|
||||
return "-";
|
||||
}
|
||||
@@ -34,9 +36,9 @@ export const formatProjectType = (type) => {
|
||||
};
|
||||
|
||||
export const getDeadlineText = (daysRemaining) => {
|
||||
if (daysRemaining === 0) return "Due Today";
|
||||
if (daysRemaining > 0) return `${daysRemaining} days left`;
|
||||
return `${Math.abs(daysRemaining)} days overdue`;
|
||||
if (daysRemaining === 0) return "Termin dzisiaj";
|
||||
if (daysRemaining > 0) return `${daysRemaining} dni pozostało`;
|
||||
return `${Math.abs(daysRemaining)} dni przeterminowane`;
|
||||
};
|
||||
|
||||
export const formatDate = (date, options = {}) => {
|
||||
@@ -46,7 +48,7 @@ export const formatDate = (date, options = {}) => {
|
||||
const dateObj = typeof date === "string" ? new Date(date) : date;
|
||||
|
||||
if (isNaN(dateObj.getTime())) {
|
||||
return "Invalid date";
|
||||
return "Nieprawidłowa data";
|
||||
}
|
||||
|
||||
// Default to DD.MM.YYYY format
|
||||
@@ -63,7 +65,7 @@ export const formatDate = (date, options = {}) => {
|
||||
return `${day}.${month}.${year}`;
|
||||
} catch (error) {
|
||||
console.error("Error formatting date:", error);
|
||||
return "Invalid date";
|
||||
return "Nieprawidłowa data";
|
||||
}
|
||||
};
|
||||
|
||||
@@ -88,3 +90,42 @@ export const formatDateForInput = (date) => {
|
||||
return "";
|
||||
}
|
||||
};
|
||||
|
||||
export const formatCoordinates = (coordinatesString) => {
|
||||
if (!coordinatesString) return "";
|
||||
|
||||
try {
|
||||
const [latStr, lngStr] = coordinatesString.split(",");
|
||||
const lat = parseFloat(latStr.trim());
|
||||
const lng = parseFloat(lngStr.trim());
|
||||
|
||||
if (isNaN(lat) || isNaN(lng)) {
|
||||
return coordinatesString; // Return original if parsing fails
|
||||
}
|
||||
|
||||
const formatDMS = (decimal, isLatitude) => {
|
||||
const direction = isLatitude
|
||||
? decimal >= 0
|
||||
? "N"
|
||||
: "S"
|
||||
: decimal >= 0
|
||||
? "E"
|
||||
: "W";
|
||||
|
||||
const absolute = Math.abs(decimal);
|
||||
const degrees = Math.floor(absolute);
|
||||
const minutes = Math.floor((absolute - degrees) * 60);
|
||||
const seconds = Math.round(((absolute - degrees) * 60 - minutes) * 60);
|
||||
|
||||
return `${direction}: ${degrees}°${minutes}'${seconds}"`;
|
||||
};
|
||||
|
||||
const latDMS = formatDMS(lat, true);
|
||||
const lngDMS = formatDMS(lng, false);
|
||||
|
||||
return `${latDMS}, ${lngDMS}`;
|
||||
} catch (error) {
|
||||
console.error("Error formatting coordinates:", error);
|
||||
return coordinatesString;
|
||||
}
|
||||
};
|
||||
|
||||
28
update-admin-username.js
Normal file
28
update-admin-username.js
Normal file
@@ -0,0 +1,28 @@
|
||||
import Database from "better-sqlite3";
|
||||
|
||||
const db = new Database("./data/database.sqlite");
|
||||
|
||||
console.log("🔄 Updating admin username...");
|
||||
|
||||
try {
|
||||
// Update admin username from email to simple "admin"
|
||||
const result = db.prepare('UPDATE users SET username = ? WHERE username = ?').run('admin', 'admin@localhost.com');
|
||||
|
||||
if (result.changes > 0) {
|
||||
console.log('✅ Admin username updated to "admin"');
|
||||
} else {
|
||||
console.log('ℹ️ No admin user found with email "admin@localhost.com"');
|
||||
}
|
||||
|
||||
// Show current users
|
||||
const users = db.prepare("SELECT name, username, role FROM users").all();
|
||||
console.log("\nCurrent users:");
|
||||
users.forEach(user => {
|
||||
console.log(` - ${user.name} (${user.role}): username="${user.username}"`);
|
||||
});
|
||||
|
||||
} catch (error) {
|
||||
console.error("❌ Error:", error.message);
|
||||
} finally {
|
||||
db.close();
|
||||
}
|
||||
20
update-queries.ps1
Normal file
20
update-queries.ps1
Normal file
@@ -0,0 +1,20 @@
|
||||
$files = @(
|
||||
"d:\panel\src\lib\queries\tasks.js",
|
||||
"d:\panel\src\lib\userManagement.js"
|
||||
)
|
||||
|
||||
foreach ($file in $files) {
|
||||
if (Test-Path $file) {
|
||||
Write-Host "Updating $file..."
|
||||
$content = Get-Content $file -Raw
|
||||
$content = $content -replace "creator\.email as created_by_email", "creator.username as created_by_username"
|
||||
$content = $content -replace "assignee\.email as assigned_to_email", "assignee.username as assigned_to_username"
|
||||
$content = $content -replace "u\.email as created_by_email", "u.username as created_by_username"
|
||||
$content = $content -replace "SELECT id, name, email, role", "SELECT id, name, username, role"
|
||||
$content = $content -replace "name, email, role", "name, username, role"
|
||||
Set-Content $file $content -NoNewline
|
||||
Write-Host "Updated $file"
|
||||
}
|
||||
}
|
||||
|
||||
Write-Host "All files updated!"
|
||||
Reference in New Issue
Block a user