From f7deeb414dccc6aab9e93eb59b809f5bc0d4c8d5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sedat=20=C3=96ZT=C3=9CRK?=
 <76204082+iamsedatozturk@users.noreply.github.com>
Date: Fri, 31 Oct 2025 15:49:20 +0300
Subject: [PATCH] =?UTF-8?q?Hr=20menus=C3=BCde=20kullan=C4=B1lan=20komponen?=
 =?UTF-8?q?tler=20silindi?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Seeds/ListFormSeeder.cs                   |    2 +-
 .../Seeds/MenusData.json                      |   84 -
 .../Tenants/TenantDataSeeder.cs               |    5 +
 .../components/common/MultiSelectEmployee.tsx |    2 +-
 .../hr/components/BadgeAssignmentModal.tsx    |  336 ---
 ui/src/views/hr/components/BadgeEditModal.tsx |  426 ---
 .../views/hr/components/BadgeManagement.tsx   |  446 ---
 .../hr/components/CostCenterFormModal.tsx     |  291 --
 .../hr/components/CostCenterManagement.tsx    |  467 ---
 .../hr/components/CostCenterViewModal.tsx     |  273 --
 .../hr/components/Degree360Evaluation.tsx     | 2666 -----------------
 .../hr/components/Degree360Templates.tsx      |  781 -----
 .../hr/components/DepartmentFormModal.tsx     |  296 --
 .../hr/components/DepartmentManagement.tsx    |  461 ---
 .../hr/components/DepartmentViewModal.tsx     |  272 --
 ui/src/views/hr/components/EmployeeCards.tsx  |  182 --
 ui/src/views/hr/components/EmployeeForm.tsx   |  830 -----
 ui/src/views/hr/components/EmployeeList.tsx   |  564 ----
 ui/src/views/hr/components/EmployeeView.tsx   |  497 ---
 .../views/hr/components/EmploymentTypes.tsx   |  454 ---
 .../hr/components/JobPositionFormModal.tsx    |  484 ---
 .../hr/components/JobPositionViewModal.tsx    |  226 --
 ui/src/views/hr/components/JobPositions.tsx   |  508 ----
 .../views/project/components/ProjectForm.tsx  |    2 +-
 24 files changed, 8 insertions(+), 10547 deletions(-)
 delete mode 100644 ui/src/views/hr/components/BadgeAssignmentModal.tsx
 delete mode 100644 ui/src/views/hr/components/BadgeEditModal.tsx
 delete mode 100644 ui/src/views/hr/components/BadgeManagement.tsx
 delete mode 100644 ui/src/views/hr/components/CostCenterFormModal.tsx
 delete mode 100644 ui/src/views/hr/components/CostCenterManagement.tsx
 delete mode 100644 ui/src/views/hr/components/CostCenterViewModal.tsx
 delete mode 100644 ui/src/views/hr/components/Degree360Evaluation.tsx
 delete mode 100644 ui/src/views/hr/components/Degree360Templates.tsx
 delete mode 100644 ui/src/views/hr/components/DepartmentFormModal.tsx
 delete mode 100644 ui/src/views/hr/components/DepartmentManagement.tsx
 delete mode 100644 ui/src/views/hr/components/DepartmentViewModal.tsx
 delete mode 100644 ui/src/views/hr/components/EmployeeCards.tsx
 delete mode 100644 ui/src/views/hr/components/EmployeeForm.tsx
 delete mode 100644 ui/src/views/hr/components/EmployeeList.tsx
 delete mode 100644 ui/src/views/hr/components/EmployeeView.tsx
 delete mode 100644 ui/src/views/hr/components/EmploymentTypes.tsx
 delete mode 100644 ui/src/views/hr/components/JobPositionFormModal.tsx
 delete mode 100644 ui/src/views/hr/components/JobPositionViewModal.tsx
 delete mode 100644 ui/src/views/hr/components/JobPositions.tsx

diff --git a/api/src/Kurs.Platform.DbMigrator/Seeds/ListFormSeeder.cs b/api/src/Kurs.Platform.DbMigrator/Seeds/ListFormSeeder.cs
index cd80a4dd..63fceb47 100644
--- a/api/src/Kurs.Platform.DbMigrator/Seeds/ListFormSeeder.cs
+++ b/api/src/Kurs.Platform.DbMigrator/Seeds/ListFormSeeder.cs
@@ -34291,7 +34291,7 @@ public class ListFormSeeder : IDataSeedContributor, ITransientDependency
                     CultureName = LanguageCodes.En,
                     SourceDbType = DbType.Guid,
                     FieldName = "EmploymentTypeId",
-                    Width = 100,
+                    Width = 200,
                     ListOrderNo = 24,
                     Visible = true,
                     IsActive = true,
diff --git a/api/src/Kurs.Platform.DbMigrator/Seeds/MenusData.json b/api/src/Kurs.Platform.DbMigrator/Seeds/MenusData.json
index de12eddb..e8ddeddf 100644
--- a/api/src/Kurs.Platform.DbMigrator/Seeds/MenusData.json
+++ b/api/src/Kurs.Platform.DbMigrator/Seeds/MenusData.json
@@ -888,55 +888,6 @@
             "routeType": "protected",
             "authority": null
         },
-        {
-            "key": "admin.hr.employees",
-            "path": "/admin/hr/employees",
-            "componentPath": "@/views/hr/components/EmployeeList",
-            "routeType": "protected",
-            "authority": null
-        },
-        {
-            "key": "admin.hr.employeesNew",
-            "path": "/admin/hr/employees/new",
-            "componentPath": "@/views/hr/components/EmployeeForm",
-            "routeType": "protected",
-            "authority": null
-        },
-        {
-            "key": "admin.hr.employeesEdit",
-            "path": "/admin/hr/employees/edit/:id",
-            "componentPath": "@/views/hr/components/EmployeeForm",
-            "routeType": "protected",
-            "authority": null
-        },
-        {
-            "key": "admin.hr.employeesDetail",
-            "path": "/admin/hr/employees/:id",
-            "componentPath": "@/views/hr/components/EmployeeView",
-            "routeType": "protected",
-            "authority": null
-        },
-        {
-            "key": "admin.hr.departments",
-            "path": "/admin/hr/departments",
-            "componentPath": "@/views/hr/components/DepartmentManagement",
-            "routeType": "protected",
-            "authority": null
-        },
-        {
-            "key": "admin.hr.jobPositions",
-            "path": "/admin/hr/job-positions",
-            "componentPath": "@/views/hr/components/JobPositions",
-            "routeType": "protected",
-            "authority": null
-        },
-        {
-            "key": "admin.hr.employmentTypes",
-            "path": "/admin/hr/employment-types",
-            "componentPath": "@/views/hr/components/EmploymentTypes",
-            "routeType": "protected",
-            "authority": null
-        },
         {
             "key": "admin.hr.organization",
             "path": "/admin/hr/organization",
@@ -944,41 +895,6 @@
             "routeType": "protected",
             "authority": null
         },
-        {
-            "key": "admin.hr.badges",
-            "path": "/admin/hr/badges",
-            "componentPath": "@/views/hr/components/BadgeManagement",
-            "routeType": "protected",
-            "authority": null
-        },
-        {
-            "key": "admin.hr.payroll",
-            "path": "/admin/hr/payroll",
-            "componentPath": "@/views/hr/components/PayrollManagement",
-            "routeType": "protected",
-            "authority": null
-        },
-        {
-            "key": "admin.hr.costCenters",
-            "path": "/admin/hr/cost-centers",
-            "componentPath": "@/views/hr/components/CostCenterManagement",
-            "routeType": "protected",
-            "authority": null
-        },
-        {
-            "key": "admin.hr.Template360s",
-            "path": "/admin/hr/360-templates",
-            "componentPath": "@/views/hr/components/Degree360Templates",
-            "routeType": "protected",
-            "authority": null
-        },
-        {
-            "key": "admin.hr.evaluation",
-            "path": "/admin/hr/360-evaluation",
-            "componentPath": "@/views/hr/components/Degree360Evaluation",
-            "routeType": "protected",
-            "authority": null
-        },
         {
             "key": "admin.crm.customers",
             "path": "/admin/crm/customers",
diff --git a/api/src/Kurs.Platform.EntityFrameworkCore/Tenants/TenantDataSeeder.cs b/api/src/Kurs.Platform.EntityFrameworkCore/Tenants/TenantDataSeeder.cs
index 36061d2f..1a9fe556 100644
--- a/api/src/Kurs.Platform.EntityFrameworkCore/Tenants/TenantDataSeeder.cs
+++ b/api/src/Kurs.Platform.EntityFrameworkCore/Tenants/TenantDataSeeder.cs
@@ -13,11 +13,13 @@ using Microsoft.EntityFrameworkCore;
 using System.Linq;
 using System.Collections.Generic;
 using Volo.Abp.Identity;
+using Volo.Abp.Timing;
 
 namespace Kurs.Platform.Data.Seeds;
 
 public class TenantDataSeeder : IDataSeedContributor, ITransientDependency
 {
+    private readonly IClock _clock;
     private readonly IRepository<IdentityUser, Guid> _repositoryUser;
     private readonly IRepository<GlobalSearch, int> _globalSearch;
     private readonly IRepository<CustomEndpoint, Guid> _customEndpointRepository;
@@ -94,6 +96,7 @@ public class TenantDataSeeder : IDataSeedContributor, ITransientDependency
     private readonly IRepository<MaterialGroup, Guid> _materialGroupRepository;
 
     public TenantDataSeeder(
+        IClock clock,
         IRepository<IdentityUser, Guid> repositoryUser,
         IRepository<GlobalSearch, int> globalSearch,
         IRepository<Sector, Guid> sectorRepository,
@@ -170,6 +173,7 @@ public class TenantDataSeeder : IDataSeedContributor, ITransientDependency
         IRepository<MaterialGroup, Guid> materialGroupRepository
         )
     {
+        _clock = clock;
         _repositoryUser = repositoryUser;
         _globalSearch = globalSearch;
         _sectorRepository = sectorRepository;
@@ -1095,6 +1099,7 @@ public class TenantDataSeeder : IDataSeedContributor, ITransientDependency
                     IsHalfDay = item.IsHalfDay,
                     Reason = item.Reason,
                     Status = item.Status,
+                    AppliedDate = _clock.Now, 
                 }, autoSave: true);
             }
         }
diff --git a/ui/src/components/common/MultiSelectEmployee.tsx b/ui/src/components/common/MultiSelectEmployee.tsx
index da20d6f1..4ffacd30 100644
--- a/ui/src/components/common/MultiSelectEmployee.tsx
+++ b/ui/src/components/common/MultiSelectEmployee.tsx
@@ -1,7 +1,7 @@
 import React, { useState, useRef, useEffect } from "react";
 import { FaChevronDown, FaTimes } from "react-icons/fa";
 import { mockEmployees } from "../../mocks/mockEmployees";
-import { EmployeeDto } from "../../types/hr";
+import { EmployeeDto } from "@/proxy/intranet/models";
 
 interface MultiSelectEmployeeProps {
   selectedEmployees: string[];
diff --git a/ui/src/views/hr/components/BadgeAssignmentModal.tsx b/ui/src/views/hr/components/BadgeAssignmentModal.tsx
deleted file mode 100644
index 4306a241..00000000
--- a/ui/src/views/hr/components/BadgeAssignmentModal.tsx
+++ /dev/null
@@ -1,336 +0,0 @@
-import React, { useState, useEffect } from "react";
-import {
-  FaUsers,
-  FaAward,
-  FaSave,
-  FaTimesCircle,
-  FaCalendarAlt,
-} from "react-icons/fa";
-import { mockEmployees } from "../../../mocks/mockEmployees";
-import { mockBadges } from "../../../mocks/mockBadges";
-
-export interface BadgeAssignmentFormData {
-  employeeId: string;
-  badgeId: string;
-  reason?: string;
-  earnedDate: string;
-  expiryDate?: string;
-  notes?: string;
-}
-
-interface BadgeAssignmentModalProps {
-  isOpen: boolean;
-  onClose: () => void;
-  onSubmit: (assignmentData: BadgeAssignmentFormData) => void;
-  preSelectedEmployeeId?: string;
-  preSelectedBadgeId?: string;
-}
-
-const BadgeAssignmentModal: React.FC<BadgeAssignmentModalProps> = ({
-  isOpen,
-  onClose,
-  onSubmit,
-  preSelectedEmployeeId,
-  preSelectedBadgeId,
-}) => {
-  const [formData, setFormData] = useState<BadgeAssignmentFormData>({
-    employeeId: "",
-    badgeId: "",
-    reason: "",
-    earnedDate: new Date().toISOString().split("T")[0],
-    expiryDate: "",
-    notes: "",
-  });
-
-  const [searchEmployee, setSearchEmployee] = useState("");
-  const [searchBadge, setSearchBadge] = useState("");
-
-  useEffect(() => {
-    if (isOpen) {
-      setFormData({
-        employeeId: preSelectedEmployeeId || "",
-        badgeId: preSelectedBadgeId || "",
-        reason: "",
-        earnedDate: new Date().toISOString().split("T")[0],
-        expiryDate: "",
-        notes: "",
-      });
-      setSearchEmployee("");
-      setSearchBadge("");
-    }
-  }, [isOpen, preSelectedEmployeeId, preSelectedBadgeId]);
-
-  const handleInputChange = (
-    e: React.ChangeEvent<
-      HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement
-    >
-  ) => {
-    const { name, value } = e.target;
-    setFormData((prev) => ({
-      ...prev,
-      [name]: value,
-    }));
-  };
-
-  const handleSubmit = (e: React.FormEvent) => {
-    e.preventDefault();
-    onSubmit(formData);
-    onClose();
-  };
-
-  const filteredEmployees = mockEmployees.filter(
-    (employee) =>
-      employee.fullName.toLowerCase().includes(searchEmployee.toLowerCase()) ||
-      employee.code.toLowerCase().includes(searchEmployee.toLowerCase())
-  );
-
-  const filteredBadges = mockBadges.filter(
-    (badge) =>
-      badge.isActive &&
-      (badge.name.toLowerCase().includes(searchBadge.toLowerCase()) ||
-        badge.description.toLowerCase().includes(searchBadge.toLowerCase()))
-  );
-
-  const selectedEmployee = mockEmployees.find(
-    (emp) => emp.id === formData.employeeId
-  );
-  const selectedBadge = mockBadges.find(
-    (badge) => badge.id === formData.badgeId
-  );
-
-  return (
-    isOpen && (
-      <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
-        <div className="bg-white rounded-xl shadow-2xl w-full max-w-2xl mx-4 max-h-[90vh] overflow-y-auto">
-          {/* Header */}
-          <div className="flex items-center justify-between p-3 border-b border-gray-200 bg-gradient-to-r from-green-50 to-emerald-50 rounded-t-xl">
-            <div className="flex items-center gap-3">
-              <div className="w-10 h-10 bg-green-600 rounded-lg flex items-center justify-center">
-                <FaAward className="w-5 h-5 text-white" />
-              </div>
-              <div>
-                <h3 className="text-xl font-bold text-gray-900">Rozet Ata</h3>
-                <p className="text-gray-600">
-                  Personele başarı rozeti atayın
-                </p>
-              </div>
-            </div>
-            <button
-              onClick={onClose}
-              className="text-gray-400 hover:text-gray-600 p-1 hover:bg-gray-100 rounded-lg transition-colors"
-            >
-              <FaTimesCircle className="w-6 h-6" />
-            </button>
-          </div>
-
-          {/* Form */}
-          <form onSubmit={handleSubmit} className="p-3">
-            <div className="grid grid-cols-1 lg:grid-cols-2 gap-4">
-              {/* Sol Kolon - Personel Seçimi */}
-              <div className="space-y-4">
-                <div className="bg-gray-50 p-2 rounded-lg">
-                  <h4 className="text-sm font-semibold text-gray-800 mb-2 flex items-center gap-2">
-                    <FaUsers className="w-5 h-5 text-blue-600" />
-                    Personel Seçimi
-                  </h4>
-
-                  <div className="space-y-4">
-                    <div>
-                      <select
-                        name="employeeId"
-                        value={formData.employeeId}
-                        onChange={handleInputChange}
-                        className="w-full px-2 py-1 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-colors"
-                        required
-                      >
-                        <option value="">Personel seçin...</option>
-                        {filteredEmployees.map((employee) => (
-                          <option key={employee.id} value={employee.id}>
-                            {employee.fullName} - {employee.code}
-                          </option>
-                        ))}
-                      </select>
-                    </div>
-
-                    {selectedEmployee && (
-                      <div className="bg-blue-50 p-2 rounded-lg border border-blue-200 text-xs">
-                        <div className="flex items-start justify-between">
-                          <div className="flex-1">
-                            <h4 className="font-medium text-blue-900 mb-1">
-                              {selectedEmployee.fullName}
-                            </h4>
-                            <p className="text-xs text-blue-700 mb-1">
-                              {selectedEmployee.code} •{" "}
-                              {selectedEmployee.department?.name}
-                            </p>
-                            <div className="text-xs text-blue-600">
-                              <span className="font-medium">Email:</span>{" "}
-                              {selectedEmployee.email}
-                            </div>
-                          </div>
-                        </div>
-                      </div>
-                    )}
-                  </div>
-                </div>
-              </div>
-
-              {/* Sağ Kolon - Rozet Seçimi */}
-              <div className="space-y-4">
-                <div className="bg-gray-50 p-2 rounded-lg">
-                  <h4 className="text-sm font-semibold text-gray-800 mb-2 flex items-center gap-2">
-                    <FaAward className="w-5 h-5 text-purple-600" />
-                    Rozet Seçimi
-                  </h4>
-
-                  <div className="space-y-4">
-                    <div>
-                      <select
-                        name="badgeId"
-                        value={formData.badgeId}
-                        onChange={handleInputChange}
-                        className="w-full px-2 py-1 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-colors"
-                        required
-                      >
-                        <option value="">Rozet seçin...</option>
-                        {filteredBadges.map((badge) => (
-                          <option key={badge.id} value={badge.id}>
-                            {badge.icon} {badge.name} ({badge.points} puan)
-                          </option>
-                        ))}
-                      </select>
-                    </div>
-
-                    {selectedBadge && (
-                      <div className="bg-purple-50 p-2 rounded-lg border border-purple-200 text-xs">
-                        <div className="flex items-start gap-3">
-                          <div
-                            className="w-10 h-10 rounded-full flex items-center justify-center text-lg flex-shrink-0"
-                            style={{
-                              backgroundColor: selectedBadge.backgroundColor,
-                              border: `2px solid ${selectedBadge.color}`,
-                            }}
-                          >
-                            {selectedBadge.icon}
-                          </div>
-                          <div className="flex-1">
-                            <h4 className="font-medium text-purple-900 mb-1">
-                              {selectedBadge.name}
-                            </h4>
-                            <p className="text-xs text-purple-700 mb-1">
-                              {selectedBadge.description}
-                            </p>
-                            <div className="grid grid-cols-2 gap-2 text-xs text-purple-600">
-                              <div>
-                                <span className="font-medium">Puan:</span>{" "}
-                                {selectedBadge.points}
-                              </div>
-                              <div>
-                                <span className="font-medium">Kategori:</span>{" "}
-                                {selectedBadge.category}
-                              </div>
-                            </div>
-                            <div className="mt-2 text-xs text-purple-600">
-                              <span className="font-medium">Kriter:</span>{" "}
-                              {selectedBadge.criteria}
-                            </div>
-                          </div>
-                        </div>
-                      </div>
-                    )}
-                  </div>
-                </div>
-              </div>
-            </div>
-
-            {/* Atama Detayları */}
-            <div className="mt-3 bg-gray-50 p-2 rounded-lg">
-              <h4 className="text-sm font-semibold text-gray-800 mb-2 flex items-center gap-2">
-                <FaCalendarAlt className="w-5 h-5 text-green-600" />
-                Atama Detayları
-              </h4>
-
-              <div className="grid grid-cols-1 lg:grid-cols-2 gap-3">
-                <div>
-                  <label className="block text-xs font-medium text-gray-700 mb-1">
-                    Kazanılma Tarihi <span className="text-red-500">*</span>
-                  </label>
-                  <input
-                    type="date"
-                    name="earnedDate"
-                    value={formData.earnedDate}
-                    onChange={handleInputChange}
-                    className="w-full px-2 py-1 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-colors"
-                    required
-                  />
-                </div>
-
-                <div>
-                  <label className="block text-xs font-medium text-gray-700 mb-1">
-                    Geçerlilik Süresi (Opsiyonel)
-                  </label>
-                  <input
-                    type="date"
-                    name="expiryDate"
-                    value={formData.expiryDate}
-                    onChange={handleInputChange}
-                    className="w-full px-2 py-1 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-colors"
-                  />
-                </div>
-
-                <div>
-                  <label className="block text-xs font-medium text-gray-700 mb-1">
-                    Kazanma Nedeni
-                  </label>
-                  <input
-                    type="text"
-                    name="reason"
-                    value={formData.reason}
-                    onChange={handleInputChange}
-                    className="w-full px-2 py-1 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-colors"
-                    placeholder="Örn: Q3 hedeflerini %120 başarıyla tamamladı"
-                  />
-                </div>
-
-                <div>
-                  <label className="block text-xs font-medium text-gray-700 mb-1">
-                    Notlar
-                  </label>
-                  <textarea
-                    name="notes"
-                    value={formData.notes}
-                    onChange={handleInputChange}
-                    rows={2}
-                    className="w-full px-2 py-1 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-colors"
-                    placeholder="Ek notlar..."
-                  />
-                </div>
-              </div>
-            </div>
-
-            {/* Footer */}
-            <div className="flex items-center justify-end gap-2 mt-3 pt-3 border-t border-gray-200">
-              <button
-                type="button"
-                onClick={onClose}
-                className="px-3 py-1 text-sm text-gray-700 bg-gray-100 rounded-lg hover:bg-gray-200 transition-colors flex items-center gap-2"
-              >
-                <FaTimesCircle className="w-4 h-4" />
-                İptal
-              </button>
-              <button
-                type="submit"
-                className="px-3 py-1 text-sm bg-green-600 text-white rounded-lg hover:bg-green-700 transition-colors flex items-center gap-2 shadow-md hover:shadow-lg"
-              >
-                <FaSave className="w-4 h-4" />
-                Rozet Ata
-              </button>
-            </div>
-          </form>
-        </div>
-      </div>
-    )
-  );
-};
-
-export default BadgeAssignmentModal;
diff --git a/ui/src/views/hr/components/BadgeEditModal.tsx b/ui/src/views/hr/components/BadgeEditModal.tsx
deleted file mode 100644
index 96a80a55..00000000
--- a/ui/src/views/hr/components/BadgeEditModal.tsx
+++ /dev/null
@@ -1,426 +0,0 @@
-import React, { useState, useEffect } from "react";
-import {
-  FaPlus,
-  FaEdit,
-  FaSave,
-  FaTimesCircle,
-  FaAward,
-  FaPalette,
-  FaInfoCircle,
-} from "react-icons/fa";
-import { HrBadge, BadgeCategoryEnum, BadgeRarityEnum } from "../../../types/hr";
-import { iconOptions } from "../../../utils/erp";
-
-interface BadgeEditModalProps {
-  isOpen: boolean;
-  onClose: () => void;
-  badge?: HrBadge | null;
-  onSubmit: (badgeData: HrBadge) => void;
-  mode: "create" | "edit";
-}
-
-const BadgeEditModal: React.FC<BadgeEditModalProps> = ({
-  isOpen,
-  onClose,
-  badge,
-  onSubmit,
-  mode,
-}) => {
-  const [formData, setFormData] = useState<HrBadge>({
-    id: "",
-    code: "",
-    name: "",
-    description: "",
-    icon: "⭐",
-    color: "#FFD700",
-    backgroundColor: "#FFF8DC",
-    category: BadgeCategoryEnum.Performance,
-    criteria: "",
-    points: 10,
-    rarity: BadgeRarityEnum.Common,
-    isActive: true,
-    creationTime: new Date(),
-    lastModificationTime: new Date(),
-  });
-
-  const generateBadgeCode = () => {
-    const timestamp = Date.now().toString().slice(-6);
-    return `BADGE-${timestamp}`;
-  };
-
-  useEffect(() => {
-    if (mode === "edit" && badge) {
-      setFormData({
-        id: badge.id,
-        code: badge.code,
-        name: badge.name,
-        description: badge.description,
-        icon: badge.icon,
-        color: badge.color,
-        backgroundColor: badge.backgroundColor,
-        category: badge.category,
-        criteria: badge.criteria,
-        points: badge.points,
-        rarity: badge.rarity,
-        isActive: badge.isActive,
-        creationTime: badge.creationTime,
-        lastModificationTime: badge.lastModificationTime,
-      });
-    } else {
-      // Reset form for create mode
-      setFormData({
-        id: "",
-        code: generateBadgeCode(),
-        name: "",
-        description: "",
-        icon: "⭐",
-        color: "#FFD700",
-        backgroundColor: "#FFF8DC",
-        category: BadgeCategoryEnum.Performance,
-        criteria: "",
-        points: 10,
-        rarity: BadgeRarityEnum.Common,
-        isActive: true,
-        creationTime: new Date(),
-        lastModificationTime: new Date(),
-      });
-    }
-  }, [mode, badge, isOpen]);
-
-  const handleInputChange = (
-    e: React.ChangeEvent<
-      HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement
-    >
-  ) => {
-    const { name, value, type } = e.target;
-
-    if (type === "checkbox") {
-      const checked = (e.target as HTMLInputElement).checked;
-      setFormData((prev) => ({
-        ...prev,
-        [name]: checked,
-      }));
-    } else if (name === "points") {
-      setFormData((prev) => ({
-        ...prev,
-        [name]: parseInt(value) || 0,
-      }));
-    } else {
-      setFormData((prev) => ({
-        ...prev,
-        [name]: value,
-      }));
-    }
-  };
-
-  const handleSubmit = (e: React.FormEvent) => {
-    e.preventDefault();
-    onSubmit(formData);
-    onClose();
-  };
-
-  return (
-    isOpen && (
-      <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
-        <div className="bg-white rounded-xl shadow-2xl w-full max-w-2xl mx-4 max-h-[90vh] overflow-y-auto">
-          {/* Header */}
-          <div className="flex items-center justify-between p-4 border-b border-gray-200 bg-gradient-to-r from-blue-50 to-indigo-50 rounded-t-xl">
-            <div className="flex items-center gap-3">
-              <div className="w-10 h-10 bg-blue-600 rounded-lg flex items-center justify-center">
-                {mode === "edit" ? (
-                  <FaEdit className="w-5 h-5 text-white" />
-                ) : (
-                  <FaPlus className="w-5 h-5 text-white" />
-                )}
-              </div>
-              <div className="text-sm">
-                <h3 className="text-xl font-bold text-gray-900">
-                  {mode === "edit" ? "Rozet Düzenle" : "Yeni Rozet Oluştur"}
-                </h3>
-                <p className="text-gray-600">
-                  {mode === "edit"
-                    ? "Mevcut rozet bilgilerini güncelleyin"
-                    : "Yeni bir başarı rozeti tanımlayın"}
-                </p>
-              </div>
-            </div>
-            <button
-              onClick={onClose}
-              className="text-gray-400 hover:text-gray-600 p-1 hover:bg-gray-100 rounded-lg transition-colors"
-            >
-              <FaTimesCircle className="w-6 h-6" />
-            </button>
-          </div>
-
-          {/* Form */}
-          <form onSubmit={handleSubmit} className="p-4">
-            <div className="grid grid-cols-1 lg:grid-cols-2 gap-4">
-              {/* Sol Kolon */}
-              <div className="space-y-4">
-                <div className="bg-gray-50 p-3 rounded-lg">
-                  <h4 className="text-base font-semibold text-gray-800 mb-3 flex items-center gap-2">
-                    <FaAward className="w-5 h-5 text-blue-600" />
-                    Temel Bilgiler
-                  </h4>
-
-                  <div className="space-y-4">
-                    <div>
-                      <label className="block text-sm font-medium text-gray-700 mb-2">
-                        Rozet Kodu <span className="text-red-500">*</span>
-                      </label>
-                      <input
-                        type="text"
-                        name="code"
-                        value={formData.code}
-                        onChange={handleInputChange}
-                        className="w-full px-2 py-1.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-colors"
-                        placeholder="Rozet kodunu girin..."
-                        required
-                      />
-                    </div>
-
-                    <div>
-                      <label className="block text-sm font-medium text-gray-700 mb-2">
-                        Rozet Adı <span className="text-red-500">*</span>
-                      </label>
-                      <input
-                        type="text"
-                        name="name"
-                        value={formData.name}
-                        onChange={handleInputChange}
-                        className="w-full px-2 py-1.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-colors"
-                        placeholder="Rozet adını girin..."
-                        required
-                      />
-                    </div>
-
-                    <div>
-                      <label className="block text-sm font-medium text-gray-700 mb-2">
-                        Açıklama
-                      </label>
-                      <textarea
-                        name="description"
-                        value={formData.description}
-                        onChange={handleInputChange}
-                        rows={1}
-                        className="w-full px-2 py-1.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-colors"
-                        placeholder="Rozet açıklaması..."
-                      />
-                    </div>
-
-                    <div>
-                      <label className="block text-sm font-medium text-gray-700 mb-2">
-                        Kazanma Kriteri <span className="text-red-500">*</span>
-                      </label>
-                      <textarea
-                        name="criteria"
-                        value={formData.criteria}
-                        onChange={handleInputChange}
-                        rows={2}
-                        className="w-full px-2 py-1.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-colors"
-                        placeholder="Bu rozeti kazanmak için gerekli şartlar..."
-                        required
-                      />
-                    </div>
-                  </div>
-                </div>
-              </div>
-
-              {/* Sağ Kolon */}
-              <div className="space-y-4">
-                <div className="bg-gray-50 p-3 rounded-lg">
-                  <h4 className="text-base font-semibold text-gray-800 mb-3 flex items-center gap-2">
-                    <FaPalette className="w-5 h-5 text-purple-600" />
-                    Görsel ve Özellikler
-                  </h4>
-
-                  <div className="space-y-4">
-                    <div>
-                      <label className="block text-sm font-medium text-gray-700 mb-2">
-                        İkon
-                      </label>
-                      <select
-                        name="icon"
-                        value={formData.icon}
-                        onChange={handleInputChange}
-                        className="w-full px-2 py-1.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-colors"
-                      >
-                        {iconOptions.map((option) => (
-                          <option key={option.value} value={option.value}>
-                            {option.value} {option.label}
-                          </option>
-                        ))}
-                      </select>
-                    </div>
-
-                    <div className="grid grid-cols-2 gap-4">
-                      <div>
-                        <label className="block text-sm font-medium text-gray-700 mb-2">
-                          Renk
-                        </label>
-                        <input
-                          type="color"
-                          name="color"
-                          value={formData.color}
-                          onChange={handleInputChange}
-                          className="w-full h-9 border border-gray-300 rounded-lg cursor-pointer"
-                        />
-                      </div>
-                      <div>
-                        <label className="block text-sm font-medium text-gray-700 mb-2">
-                          Arka Plan Rengi
-                        </label>
-                        <input
-                          type="color"
-                          name="backgroundColor"
-                          value={formData.backgroundColor}
-                          onChange={handleInputChange}
-                          className="w-full h-9 border border-gray-300 rounded-lg cursor-pointer"
-                        />
-                      </div>
-                    </div>
-
-                    <div>
-                      <label className="block text-sm font-medium text-gray-700 mb-2">
-                        Kategori
-                      </label>
-                      <select
-                        name="category"
-                        value={formData.category}
-                        onChange={handleInputChange}
-                        className="w-full px-2 py-1.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-colors"
-                      >
-                        {Object.values(BadgeCategoryEnum).map((category) => (
-                          <option key={category} value={category}>
-                            {category === BadgeCategoryEnum.Performance &&
-                              "Performans"}
-                            {category === BadgeCategoryEnum.Leadership &&
-                              "Liderlik"}
-                            {category === BadgeCategoryEnum.Innovation &&
-                              "İnovasyon"}
-                            {category === BadgeCategoryEnum.Teamwork &&
-                              "Takım Çalışması"}
-                            {category === BadgeCategoryEnum.Customer &&
-                              "Müşteri"}
-                            {category === BadgeCategoryEnum.Safety &&
-                              "Güvenlik"}
-                            {category === BadgeCategoryEnum.Attendance &&
-                              "Devam"}
-                            {category === BadgeCategoryEnum.Training &&
-                              "Eğitim"}
-                            {category === BadgeCategoryEnum.Project && "Proje"}
-                            {category === BadgeCategoryEnum.Special && "Özel"}
-                          </option>
-                        ))}
-                      </select>
-                    </div>
-
-                    <div className="grid grid-cols-2 gap-4">
-                      <div>
-                        <label className="block text-sm font-medium text-gray-700 mb-2">
-                          Puan
-                        </label>
-                        <input
-                          type="number"
-                          name="points"
-                          value={formData.points}
-                          onChange={handleInputChange}
-                          min="1"
-                          max="1000"
-                          className="w-full px-2 py-1.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-colors"
-                          placeholder="10"
-                        />
-                      </div>
-                      <div>
-                        <label className="block text-sm font-medium text-gray-700 mb-2">
-                          Nadirlık
-                        </label>
-                        <select
-                          name="rarity"
-                          value={formData.rarity}
-                          onChange={handleInputChange}
-                          className="w-full px-2 py-1.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-colors"
-                        >
-                          {Object.values(BadgeRarityEnum).map((rarity) => (
-                            <option key={rarity} value={rarity}>
-                              {rarity === BadgeRarityEnum.Common && "Yaygın"}
-                              {rarity === BadgeRarityEnum.Uncommon && "Nadir"}
-                              {rarity === BadgeRarityEnum.Rare && "Çok Nadir"}
-                              {rarity === BadgeRarityEnum.Epic && "Efsanevi"}
-                              {rarity === BadgeRarityEnum.Legendary && "Efsane"}
-                            </option>
-                          ))}
-                        </select>
-                      </div>
-                    </div>
-
-                    <div className="flex items-center">
-                      <input
-                        type="checkbox"
-                        name="isActive"
-                        checked={formData.isActive}
-                        onChange={handleInputChange}
-                        className="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded"
-                      />
-                      <label className="ml-2 block text-sm text-gray-900">
-                        Aktif
-                      </label>
-                    </div>
-                  </div>
-                </div>
-
-                {/* Preview */}
-                <div className="bg-gray-50 p-3 rounded-lg">
-                  <h4 className="text-base font-semibold text-gray-800 mb-3 flex items-center gap-2">
-                    <FaInfoCircle className="w-5 h-5 text-green-600" />
-                    Önizleme
-                  </h4>
-                  <div className="flex items-center gap-3 p-3 bg-white rounded-lg border">
-                    <div
-                      className="w-12 h-12 rounded-full flex items-center justify-center text-xl"
-                      style={{
-                        backgroundColor: formData.backgroundColor,
-                        border: `2px solid ${formData.color}`,
-                      }}
-                    >
-                      {formData.icon}
-                    </div>
-                    <div>
-                      <div className="font-medium text-gray-900">
-                        {formData.name || "Rozet Adı"}
-                      </div>
-                      <div className="text-sm text-gray-500">
-                        {formData.points} puan • {formData.category}
-                      </div>
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-
-            {/* Footer */}
-            <div className="flex items-center justify-end gap-3 mt-4 pt-4 border-t border-gray-200">
-              <button
-                type="button"
-                onClick={onClose}
-                className="px-3 py-1.5 text-sm text-gray-700 bg-gray-100 rounded-lg hover:bg-gray-200 transition-colors flex items-center gap-2"
-              >
-                <FaTimesCircle className="w-4 h-4" />
-                İptal
-              </button>
-              <button
-                type="submit"
-                className="px-3 py-1.5 text-sm bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors flex items-center gap-2 shadow-md hover:shadow-lg"
-              >
-                <FaSave className="w-4 h-4" />
-                {mode === "edit" ? "Güncelle" : "Oluştur"}
-              </button>
-            </div>
-          </form>
-        </div>
-      </div>
-    )
-  );
-};
-
-export default BadgeEditModal;
diff --git a/ui/src/views/hr/components/BadgeManagement.tsx b/ui/src/views/hr/components/BadgeManagement.tsx
deleted file mode 100644
index 064a998a..00000000
--- a/ui/src/views/hr/components/BadgeManagement.tsx
+++ /dev/null
@@ -1,446 +0,0 @@
-import React, { useState } from 'react'
-import { FaAward, FaPlus, FaEdit, FaTrash, FaUsers } from 'react-icons/fa'
-import { HrBadge, HrEmployeeBadge } from '../../../types/hr'
-import DataTable, { Column } from '../../../components/common/DataTable'
-import { mockEmployees } from '../../../mocks/mockEmployees'
-import { mockBadges } from '../../../mocks/mockBadges'
-import BadgeEditModal from './BadgeEditModal'
-import BadgeAssignmentModal, { BadgeAssignmentFormData } from './BadgeAssignmentModal'
-import Widget from '../../../components/common/Widget'
-import { getIconComponent } from '../../../utils/erp'
-import { Container } from '@/components/shared'
-
-const BadgeManagement: React.FC = () => {
-  const [activeTab, setActiveTab] = useState<'badges' | 'assignments'>('badges')
-  const [searchTerm, setSearchTerm] = useState('')
-  const [searchAssignTerm, setSearchAssignTerm] = useState('')
-
-  // Modal states
-  const [isBadgeModalOpen, setIsBadgeModalOpen] = useState(false)
-  const [isAssignmentModalOpen, setIsAssignmentModalOpen] = useState(false)
-  const [editingBadge, setEditingBadge] = useState<HrBadge | null>(null)
-
-  // Mock data - In real app, this would come from API
-  const [badges, setBadges] = useState(mockBadges)
-  const [employeeBadges, setEmployeeBadges] = useState<HrEmployeeBadge[]>([])
-
-  // Handlers
-  const handleAddBadge = () => {
-    setEditingBadge(null)
-    setIsBadgeModalOpen(true)
-  }
-
-  const handleEditBadge = (badge: HrBadge) => {
-    setEditingBadge(badge)
-    setIsBadgeModalOpen(true)
-  }
-
-  const handleDeleteBadge = (id: string) => {
-    if (window.confirm('Bu rozeti silmek istediğinizden emin misiniz?')) {
-      setBadges(badges.filter((badge) => badge.id !== id))
-      alert('Rozet başarıyla silindi!')
-    }
-  }
-
-  const handleRevokeBadge = (employeeBadgeId: string) => {
-    if (window.confirm('Bu rozet atamasını iptal etmek istediğinizden emin misiniz?')) {
-      setEmployeeBadges((prev) =>
-        prev.map((eb) => (eb.id === employeeBadgeId ? { ...eb, isActive: false } : eb)),
-      )
-      alert('Rozet ataması iptal edildi!')
-    }
-  }
-
-  const handleBadgeSubmit = (badgeData: HrBadge) => {
-    if (editingBadge) {
-      // Update existing badge
-      setBadges((prev) =>
-        prev.map((badge) =>
-          badge.id === editingBadge.id
-            ? {
-                ...badge,
-                ...badgeData,
-                lastModificationTime: new Date(),
-              }
-            : badge,
-        ),
-      )
-      alert('Rozet başarıyla güncellendi!')
-    } else {
-      // Create new badge
-      const newBadge: HrBadge = {
-        ...badgeData,
-        creationTime: new Date(),
-        lastModificationTime: new Date(),
-      }
-      setBadges((prev) => [...prev, newBadge])
-      alert('Yeni rozet başarıyla oluşturuldu!')
-    }
-    setIsBadgeModalOpen(false)
-    setEditingBadge(null)
-  }
-
-  const handleAssignmentSubmit = (assignmentData: BadgeAssignmentFormData) => {
-    const employee = mockEmployees.find((emp) => emp.id === assignmentData.employeeId)
-    const badge = badges.find((b) => b.id === assignmentData.badgeId)
-
-    if (employee && badge) {
-      const newAssignment: HrEmployeeBadge = {
-        id: `assignment-${Date.now()}`,
-        employeeId: assignmentData.employeeId,
-        employee: employee,
-        badgeId: assignmentData.badgeId,
-        badge: badge,
-        earnedDate: new Date(assignmentData.earnedDate),
-        expiryDate: assignmentData.expiryDate ? new Date(assignmentData.expiryDate) : undefined,
-        reason: assignmentData.reason,
-        notes: assignmentData.notes,
-        isActive: true,
-        creationTime: new Date(),
-        lastModificationTime: new Date(),
-      }
-
-      setEmployeeBadges((prev) => [...prev, newAssignment])
-      alert('Rozet başarıyla atandı!')
-    }
-    setIsAssignmentModalOpen(false)
-  }
-
-  const openAssignmentModal = () => {
-    setIsAssignmentModalOpen(true)
-  }
-
-  const filteredBadges = badges.filter(
-    (badge) =>
-      badge.name.toLowerCase().includes(searchTerm.toLowerCase()) ||
-      badge.description.toLowerCase().includes(searchTerm.toLowerCase()),
-  )
-
-  const filteredEmployeeBadges = employeeBadges.filter((eb) =>
-    eb.employee?.fullName.toLowerCase().includes(searchAssignTerm.toLowerCase()),
-  )
-
-  const badgeColumns: Column<HrBadge>[] = [
-    {
-      key: 'icon',
-      header: 'Simge',
-      render: (badge: HrBadge) => {
-        const IconComponent = getIconComponent(badge.icon)
-        return (
-          <div
-            className={`w-7 h-7 rounded-full flex items-center justify-center`}
-            style={{ backgroundColor: badge.color }}
-          >
-            <IconComponent className="w-3.5 h-3.5 text-white" />
-          </div>
-        )
-      },
-    },
-    {
-      key: 'name',
-      header: 'Rozet Adı',
-      sortable: true,
-      render: (badge: HrBadge) => (
-        <div>
-          <div className="font-medium text-gray-900">{badge.name}</div>
-          <div className="text-sm text-gray-500 truncate max-w-xs">{badge.description}</div>
-        </div>
-      ),
-    },
-    {
-      key: 'criteria',
-      header: 'Kazanma Kriteri',
-      render: (badge: HrBadge) => (
-        <div className="text-sm text-gray-600 max-w-xs truncate">{badge.criteria}</div>
-      ),
-    },
-    {
-      key: 'assignedCount',
-      header: 'Atanan Sayısı',
-      render: (badge: HrBadge) => {
-        const count = employeeBadges.filter((eb) => eb.badgeId === badge.id && eb.isActive).length
-        return (
-          <div className="flex items-center gap-1">
-            <FaUsers className="w-4 h-4 text-gray-500" />
-            <span>{count}</span>
-          </div>
-        )
-      },
-    },
-    {
-      key: 'status',
-      header: 'Durum',
-      render: (badge: HrBadge) => (
-        <span
-          className={`px-2 py-0.5 text-xs font-medium rounded-full ${
-            badge.isActive ? 'bg-green-100 text-green-800' : 'bg-red-100 text-red-800'
-          }`}
-        >
-          {badge.isActive ? 'Aktif' : 'Pasif'}
-        </span>
-      ),
-    },
-    {
-      key: 'actions',
-      header: 'İşlemler',
-      render: (badge: HrBadge) => (
-        <div className="flex gap-2">
-          <button
-            onClick={() => handleEditBadge(badge)}
-            className="p-0.5 text-blue-600 hover:bg-blue-50 rounded"
-            title="Düzenle"
-          >
-            <FaEdit className="w-4 h-4" />
-          </button>
-          <button
-            onClick={() => handleDeleteBadge(badge.id)}
-            className="p-0.5 text-red-600 hover:bg-red-50 rounded"
-            title="Sil"
-          >
-            <FaTrash className="w-4 h-4" />
-          </button>
-        </div>
-      ),
-    },
-  ]
-
-  const assignmentColumns: Column<HrEmployeeBadge>[] = [
-    {
-      key: 'employee',
-      header: 'Personel',
-      render: (assignment: HrEmployeeBadge) => (
-        <div>
-          <div className="font-medium text-gray-900">{assignment.employee?.fullName}</div>
-          <div className="text-sm text-gray-500">{assignment.employee?.code}</div>
-        </div>
-      ),
-    },
-    {
-      key: 'badge',
-      header: 'Rozet',
-      render: (assignment: HrEmployeeBadge) => {
-        const IconComponent = getIconComponent(assignment.badge?.icon || 'award')
-        return (
-          <div className="flex items-center gap-2">
-            <div
-              className="w-6 h-6 rounded-full flex items-center justify-center"
-              style={{ backgroundColor: assignment.badge?.color }}
-            >
-              <IconComponent className="w-3 h-3 text-white" />
-            </div>
-            <span>{assignment.badge?.name}</span>
-          </div>
-        )
-      },
-    },
-    {
-      key: 'earnedDate',
-      header: 'Kazanıldığı Tarih',
-      render: (assignment: HrEmployeeBadge) =>
-        new Date(assignment.earnedDate).toLocaleDateString('tr-TR'),
-    },
-    {
-      key: 'expiryDate',
-      header: 'Geçerlilik Süresi',
-      render: (assignment: HrEmployeeBadge) =>
-        assignment.expiryDate
-          ? new Date(assignment.expiryDate).toLocaleDateString('tr-TR')
-          : 'Süresiz',
-    },
-    {
-      key: 'status',
-      header: 'Durum',
-      render: (assignment: HrEmployeeBadge) => {
-        const isExpired = assignment.expiryDate && new Date(assignment.expiryDate) < new Date()
-        return (
-          <span
-            className={`px-2 py-0.5 text-xs font-medium rounded-full ${
-              !assignment.isActive
-                ? 'bg-red-100 text-red-800'
-                : isExpired
-                  ? 'bg-yellow-100 text-yellow-800'
-                  : 'bg-green-100 text-green-800'
-            }`}
-          >
-            {!assignment.isActive ? 'İptal Edildi' : isExpired ? 'Süresi Dolmuş' : 'Aktif'}
-          </span>
-        )
-      },
-    },
-    {
-      key: 'actions',
-      header: 'İşlemler',
-      render: (assignment: HrEmployeeBadge) => (
-        <div className="flex gap-2">
-          {assignment.isActive && (
-            <button
-              onClick={() => handleRevokeBadge(assignment.id)}
-              className="p-0.5 text-red-600 hover:bg-red-50 rounded"
-              title="İptal Et"
-            >
-              <FaTrash className="w-4 h-4" />
-            </button>
-          )}
-        </div>
-      ),
-    },
-  ]
-
-  return (
-    <Container>
-      <div className="space-y-2">
-        {/* Header */}
-        <div className="flex items-center justify-between mb-2">
-          <div>
-            <h2 className="text-2xl font-bold text-gray-900">Rozet Yönetimi</h2>
-            <p className="text-gray-600">
-              Personel başarı rozetleri ve ödüllendirme sistemi
-            </p>
-          </div>
-        </div>
-
-        {/* Stats Cards */}
-        <div className="grid grid-cols-1 md:grid-cols-4 gap-3">
-          <Widget title="Toplam Rozet" value={badges.length} color="blue" icon="FaAward" />
-
-          <Widget
-            title="Aktif Rozet"
-            value={badges.filter((b) => b.isActive).length}
-            color="yellow"
-            icon="FaTrophy"
-          />
-
-          <Widget
-            title="Toplam Atama"
-            value={filteredEmployeeBadges.length}
-            color="green"
-            icon="FaUsers"
-          />
-
-          <Widget
-            title="Rozetli Personel"
-            value={new Set(filteredEmployeeBadges.map((ab) => ab.employeeId)).size}
-            color="purple"
-            icon="FaStar"
-          />
-        </div>
-
-        {/* Tabs */}
-        <div className="border-b border-gray-200">
-          <nav className="-mb-px flex space-x-8">
-            <button
-              onClick={() => setActiveTab('badges')}
-              className={`py-2 px-1 border-b-2 font-medium text-sm ${
-                activeTab === 'badges'
-                  ? 'border-blue-500 text-blue-600'
-                  : 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300'
-              }`}
-            >
-              Rozetler
-            </button>
-            <button
-              onClick={() => setActiveTab('assignments')}
-              className={`py-2 px-1 border-b-2 font-medium text-sm ${
-                activeTab === 'assignments'
-                  ? 'border-blue-500 text-blue-600'
-                  : 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300'
-              }`}
-            >
-              Rozet Atamaları
-            </button>
-          </nav>
-        </div>
-
-        {/* Tab Content */}
-        {activeTab === 'badges' && (
-          <div className="space-y-3 pt-2">
-            {/* Search */}
-
-            <div className="flex flex-col sm:flex-row sm:items-center justify-between gap-3">
-              <input
-                type="text"
-                placeholder="Rozet adı veya açıklama ara..."
-                value={searchTerm}
-                onChange={(e) => setSearchTerm(e.target.value)}
-                className="w-full px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-              />
-
-              <button
-                onClick={handleAddBadge}
-                className="flex items-center gap-2 px-3 py-1.5 text-sm bg-blue-600 text-white rounded-md hover:bg-blue-700 transition-colors"
-              >
-                <FaPlus className="w-4 h-4" />
-                <span className="whitespace-nowrap">Yeni Rozet</span>
-              </button>
-            </div>
-
-            {/* Badges Table */}
-            <div className="bg-white rounded-lg shadow-sm border">
-              <DataTable data={filteredBadges} columns={badgeColumns} />
-            </div>
-          </div>
-        )}
-
-        {activeTab === 'assignments' && (
-          <div className="space-y-3 pt-2">
-            <div className="bg-white p-3 rounded-lg shadow-sm border">
-              <div className="flex flex-col sm:flex-row sm:items-center justify-between gap-3">
-                <input
-                  type="text"
-                  placeholder="Rozet adı veya açıklama ara..."
-                  value={searchAssignTerm}
-                  onChange={(e) => setSearchAssignTerm(e.target.value)}
-                  className="w-full px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                />
-
-                <button
-                  className="px-3 py-1 text-sm bg-green-600 text-white rounded-md hover:bg-green-700 transition-colors"
-                  onClick={openAssignmentModal}
-                >
-                  <span className="whitespace-nowrap">Rozet Ata</span>
-                </button>
-              </div>
-            </div>
-
-            {/* Assignments Table */}
-            <div className="bg-white rounded-lg shadow-sm border">
-              <DataTable data={filteredEmployeeBadges} columns={assignmentColumns} />
-            </div>
-          </div>
-        )}
-
-        {(activeTab === 'badges' ? filteredBadges : filteredEmployeeBadges).length === 0 && (
-          <div className="text-center py-12">
-            <FaAward className="w-10 h-10 text-gray-400 mx-auto mb-3" />
-            <h3 className="text-base font-medium text-gray-900 mb-2">
-              {activeTab === 'badges' ? 'Rozet bulunamadı' : 'Rozet ataması bulunamadı'}
-            </h3>
-            <p className="text-gray-500">
-              {activeTab === 'badges'
-                ? 'Henüz rozet tanımlanmamış.'
-                : 'Henüz rozet ataması yapılmamış.'}
-            </p>
-          </div>
-        )}
-      </div>
-
-      {/* Badge Edit Modal */}
-      <BadgeEditModal
-        isOpen={isBadgeModalOpen}
-        onClose={() => setIsBadgeModalOpen(false)}
-        badge={editingBadge}
-        onSubmit={handleBadgeSubmit}
-        mode={editingBadge ? 'edit' : 'create'}
-      />
-
-      {/* Badge Assignment Modal */}
-      <BadgeAssignmentModal
-        isOpen={isAssignmentModalOpen}
-        onClose={() => setIsAssignmentModalOpen(false)}
-        onSubmit={handleAssignmentSubmit}
-      />
-    </Container>
-  )
-}
-
-export default BadgeManagement
diff --git a/ui/src/views/hr/components/CostCenterFormModal.tsx b/ui/src/views/hr/components/CostCenterFormModal.tsx
deleted file mode 100644
index 2962af86..00000000
--- a/ui/src/views/hr/components/CostCenterFormModal.tsx
+++ /dev/null
@@ -1,291 +0,0 @@
-import React, { useState, useEffect } from 'react'
-import { FaSave, FaTimes } from 'react-icons/fa'
-import { HrCostCenter, CostCenterType } from '../../../types/hr'
-import { mockEmployees } from '../../../mocks/mockEmployees'
-import { mockCostCenters } from '../../../mocks/mockCostCenters'
-import { getCostCenterTypeText } from '../../../utils/erp'
-import { mockCurrencies } from '@/mocks/mockCurrencies'
-
-interface CostCenterFormModalProps {
-  isOpen: boolean
-  onClose: () => void
-  onSave: (costCenter: Partial<HrCostCenter>) => void
-  costCenter?: HrCostCenter
-  title: string
-}
-
-const CostCenterFormModal: React.FC<CostCenterFormModalProps> = ({
-  isOpen,
-  onClose,
-  onSave,
-  costCenter,
-  title,
-}) => {
-  const [formData, setFormData] = useState({
-    costCenterCode: '',
-    name: '',
-    description: '',
-    costCenterType: CostCenterType.Standard,
-    responsibleEmployeeId: '',
-    parentCostCenterId: '',
-    budgetedAmount: 0,
-    actualAmount: 0,
-    currency: 'TRY',
-    fiscalYear: '2025',
-    isActive: true,
-  })
-
-  useEffect(() => {
-    if (costCenter) {
-      setFormData({
-        costCenterCode: costCenter.code,
-        name: costCenter.name,
-        description: costCenter.description || '',
-        costCenterType: costCenter.costCenterType,
-        responsibleEmployeeId: costCenter.responsibleEmployeeId || '',
-        parentCostCenterId: costCenter.parentCostCenterId || '',
-        budgetedAmount: costCenter.budgetedAmount,
-        actualAmount: costCenter.actualAmount,
-        currency: costCenter.currency,
-        fiscalYear: costCenter.fiscalYear,
-        isActive: costCenter.isActive,
-      })
-    } else {
-      setFormData({
-        costCenterCode: '',
-        name: '',
-        description: '',
-        costCenterType: CostCenterType.Standard,
-        responsibleEmployeeId: '',
-        parentCostCenterId: '',
-        budgetedAmount: 0,
-        actualAmount: 0,
-        currency: 'TRY',
-        fiscalYear: '2025',
-        isActive: true,
-      })
-    }
-  }, [costCenter])
-
-  const handleSubmit = (e: React.FormEvent) => {
-    e.preventDefault()
-    onSave(formData)
-  }
-
-  return (
-    isOpen && (
-      <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
-        <div className="bg-white rounded-lg p-3 w-full max-w-lg max-h-[90vh] overflow-y-auto">
-          <div className="flex items-center justify-between mb-3">
-            <h2 className="text-base font-bold text-gray-900">{title}</h2>
-            <button onClick={onClose} className="text-gray-400 hover:text-gray-600">
-              <FaTimes className="w-5 h-5" />
-            </button>
-          </div>
-
-          <form onSubmit={handleSubmit} className="space-y-3">
-            <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
-              <div>
-                <label className="block text-xs font-medium text-gray-700 mb-1">
-                  Maliyet Merkezi Kodu *
-                </label>
-                <input
-                  type="text"
-                  value={formData.costCenterCode}
-                  onChange={(e) => setFormData({ ...formData, costCenterCode: e.target.value })}
-                  className="w-full px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                  required
-                />
-              </div>
-
-              <div>
-                <label className="block text-xs font-medium text-gray-700 mb-1">
-                  Maliyet Merkezi Adı *
-                </label>
-                <input
-                  type="text"
-                  value={formData.name}
-                  onChange={(e) => setFormData({ ...formData, name: e.target.value })}
-                  className="w-full px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                  required
-                />
-              </div>
-            </div>
-
-            <div>
-              <label className="block text-xs font-medium text-gray-700 mb-1">Açıklama</label>
-              <textarea
-                value={formData.description}
-                onChange={(e) => setFormData({ ...formData, description: e.target.value })}
-                rows={2}
-                className="w-full px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-              />
-            </div>
-
-            <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
-              <div>
-                <label className="block text-xs font-medium text-gray-700 mb-1">
-                  Maliyet Merkezi Tipi
-                </label>
-                <select
-                  value={formData.costCenterType}
-                  onChange={(e) =>
-                    setFormData({
-                      ...formData,
-                      costCenterType: e.target.value as CostCenterType,
-                    })
-                  }
-                  className="w-full px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                >
-                  {Object.values(CostCenterType).map((type) => (
-                    <option key={type} value={type}>
-                      {getCostCenterTypeText(type)}
-                    </option>
-                  ))}
-                </select>
-              </div>
-
-              <div>
-                <label className="block text-xs font-medium text-gray-700 mb-1">
-                  Sorumlu Personel
-                </label>
-                <select
-                  value={formData.responsibleEmployeeId}
-                  onChange={(e) =>
-                    setFormData({
-                      ...formData,
-                      responsibleEmployeeId: e.target.value,
-                    })
-                  }
-                  className="w-full px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                >
-                  <option value="">Seçiniz</option>
-                  {mockEmployees.map((employee) => (
-                    <option key={employee.id} value={employee.id}>
-                      {employee.fullName}
-                    </option>
-                  ))}
-                </select>
-              </div>
-            </div>
-
-            <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
-              <div>
-                <label className="block text-xs font-medium text-gray-700 mb-1">
-                  Üst Maliyet Merkezi
-                </label>
-                <select
-                  value={formData.parentCostCenterId}
-                  onChange={(e) =>
-                    setFormData({
-                      ...formData,
-                      parentCostCenterId: e.target.value,
-                    })
-                  }
-                  className="w-full px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                >
-                  <option value="">Ana Maliyet Merkezi</option>
-                  {mockCostCenters
-                    .filter((cc) => cc.id !== costCenter?.id)
-                    .map((costCenter) => (
-                      <option key={costCenter.id} value={costCenter.id}>
-                        {costCenter.name}
-                      </option>
-                    ))}
-                </select>
-              </div>
-
-              <div>
-                <label className="block text-xs font-medium text-gray-700 mb-1">Mali Yıl</label>
-                <input
-                  type="text"
-                  value={formData.fiscalYear}
-                  onChange={(e) => setFormData({ ...formData, fiscalYear: e.target.value })}
-                  className="w-full px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                />
-              </div>
-            </div>
-
-            <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
-              <div>
-                <label className="block text-xs font-medium text-gray-700 mb-1">Bütçe Tutarı</label>
-                <input
-                  type="number"
-                  value={formData.budgetedAmount}
-                  onChange={(e) =>
-                    setFormData({
-                      ...formData,
-                      budgetedAmount: parseFloat(e.target.value) || 0,
-                    })
-                  }
-                  className="w-full px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                />
-              </div>
-
-              <div>
-                <label className="block text-xs font-medium text-gray-700 mb-1">
-                  Gerçekleşen Tutar
-                </label>
-                <input
-                  type="number"
-                  value={formData.actualAmount}
-                  onChange={(e) =>
-                    setFormData({
-                      ...formData,
-                      actualAmount: parseFloat(e.target.value) || 0,
-                    })
-                  }
-                  className="w-full px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                />
-              </div>
-
-              <div>
-                <label className="block text-xs font-medium text-gray-700 mb-1">Para Birimi</label>
-                <select
-                  value={formData.currency}
-                  onChange={(e) => setFormData({ ...formData, currency: e.target.value })}
-                  className="w-full px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                >
-                  {mockCurrencies.map((currency) => (
-                    <option key={currency.value} value={currency.value}>
-                      {currency.value} - {currency.label}
-                    </option>
-                  ))}
-                </select>
-              </div>
-            </div>
-
-            <div className="flex items-center">
-              <input
-                type="checkbox"
-                checked={formData.isActive}
-                onChange={(e) => setFormData({ ...formData, isActive: e.target.checked })}
-                className="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded"
-              />
-              <label className="ml-2 block text-sm text-gray-900">Aktif</label>
-            </div>
-
-            <div className="flex justify-end gap-2 pt-3">
-              <button
-                type="button"
-                onClick={onClose}
-                className="px-3 py-1 border border-gray-300 rounded-md text-sm text-gray-700 hover:bg-gray-50"
-              >
-                İptal
-              </button>
-              <button
-                type="submit"
-                className="flex items-center gap-2 px-3 py-1.5 text-sm bg-blue-600 text-white rounded-md hover:bg-blue-700"
-              >
-                <FaSave className="w-4 h-4" />
-                Kaydet
-              </button>
-            </div>
-          </form>
-        </div>
-      </div>
-    )
-  )
-}
-
-export default CostCenterFormModal
diff --git a/ui/src/views/hr/components/CostCenterManagement.tsx b/ui/src/views/hr/components/CostCenterManagement.tsx
deleted file mode 100644
index 3a024a45..00000000
--- a/ui/src/views/hr/components/CostCenterManagement.tsx
+++ /dev/null
@@ -1,467 +0,0 @@
-import React, { useState } from 'react'
-import {
-  FaPlus,
-  FaEdit,
-  FaTrash,
-  FaChartPie,
-  FaDollarSign,
-  FaPercentage,
-  FaEye,
-  FaList,
-  FaTh,
-} from 'react-icons/fa'
-import { HrCostCenter, CostCenterType } from '../../../types/hr'
-import DataTable, { Column } from '../../../components/common/DataTable'
-import { mockCostCenters } from '../../../mocks/mockCostCenters'
-import { mockEmployees } from '../../../mocks/mockEmployees'
-import CostCenterFormModal from './CostCenterFormModal'
-import CostCenterViewModal from './CostCenterViewModal'
-import Widget from '../../../components/common/Widget'
-import { getCostCenterTypeColor, getCostCenterTypeText } from '../../../utils/erp'
-import { Container } from '@/components/shared'
-
-const CostCenterManagement: React.FC = () => {
-  const [costCenters, setCostCenters] = useState<HrCostCenter[]>(mockCostCenters)
-  const [searchTerm, setSearchTerm] = useState('')
-  const [selectedType, setSelectedType] = useState<string>('all')
-  const [viewMode, setViewMode] = useState<'list' | 'cards'>('list')
-  const [isFormModalOpen, setIsFormModalOpen] = useState(false)
-  const [isViewModalOpen, setIsViewModalOpen] = useState(false)
-  const [selectedCostCenter, setSelectedCostCenter] = useState<HrCostCenter | null>(null)
-  const [editingCostCenter, setEditingCostCenter] = useState<HrCostCenter | undefined>(undefined)
-
-  // Cost center bağlantılarını kur
-  mockCostCenters.forEach((cc) => {
-    if (cc.responsibleEmployeeId) {
-      cc.responsibleEmployee = mockEmployees.find((emp) => emp.id === cc.responsibleEmployeeId)
-    }
-  })
-
-  const handleAdd = () => {
-    setEditingCostCenter(undefined)
-    setIsFormModalOpen(true)
-  }
-
-  const handleEdit = (costCenter: HrCostCenter) => {
-    setEditingCostCenter(costCenter)
-    setIsFormModalOpen(true)
-  }
-
-  const handleView = (costCenter: HrCostCenter) => {
-    setSelectedCostCenter(costCenter)
-    setIsViewModalOpen(true)
-  }
-
-  const handleDelete = (id: string) => {
-    if (window.confirm('Bu maliyet merkezini silmek istediğinizden emin misiniz?')) {
-      setCostCenters(costCenters.filter((cc) => cc.id !== id))
-    }
-  }
-
-  const handleSave = (costCenterData: Partial<HrCostCenter>) => {
-    if (editingCostCenter) {
-      // Edit existing
-      setCostCenters(
-        costCenters.map((cc) =>
-          cc.id === editingCostCenter.id
-            ? {
-                ...cc,
-                ...costCenterData,
-                lastModificationTime: new Date(),
-              }
-            : cc,
-        ),
-      )
-    } else {
-      // Add new
-      const newCostCenter: HrCostCenter = {
-        id: `cc-${Date.now()}`,
-        ...costCenterData,
-        subCostCenters: [],
-        creationTime: new Date(),
-        lastModificationTime: new Date(),
-      } as HrCostCenter
-      setCostCenters([...costCenters, newCostCenter])
-    }
-    setIsFormModalOpen(false)
-    setEditingCostCenter(undefined)
-  }
-
-  const filteredCostCenters = costCenters.filter((costCenter) => {
-    if (
-      searchTerm &&
-      !costCenter.name.toLowerCase().includes(searchTerm.toLowerCase()) &&
-      !costCenter.code.toLowerCase().includes(searchTerm.toLowerCase())
-    ) {
-      return false
-    }
-    if (selectedType !== 'all' && costCenter.costCenterType !== selectedType) {
-      return false
-    }
-    return true
-  })
-
-  const getVariancePercentage = (budgeted: number, actual: number): number => {
-    if (budgeted === 0) return 0
-    return ((actual - budgeted) / budgeted) * 100
-  }
-
-  const columns: Column<HrCostCenter>[] = [
-    {
-      key: 'code',
-      header: 'Maliyet Merkezi Kodu',
-      sortable: true,
-    },
-    {
-      key: 'name',
-      header: 'Maliyet Merkezi Adı',
-      sortable: true,
-    },
-    {
-      key: 'costCenterType',
-      header: 'Tip',
-      render: (costCenter: HrCostCenter) => (
-        <span
-          className={`px-2 py-0.5 text-xs font-medium rounded-full ${getCostCenterTypeColor(
-            costCenter.costCenterType,
-          )}`}
-        >
-          {getCostCenterTypeText(costCenter.costCenterType)}
-        </span>
-      ),
-    },
-    {
-      key: 'responsibleEmployee',
-      header: 'Sorumlu',
-      render: (costCenter: HrCostCenter) => costCenter.responsibleEmployee?.fullName || '-',
-    },
-    {
-      key: 'budgetedAmount',
-      header: 'Bütçe',
-      render: (costCenter: HrCostCenter) => (
-        <div className="flex items-center gap-1">
-          <FaDollarSign className="w-4 h-4 text-gray-500" />
-          <span>₺{costCenter.budgetedAmount.toLocaleString()}</span>
-        </div>
-      ),
-    },
-    {
-      key: 'actualAmount',
-      header: 'Gerçekleşen',
-      render: (costCenter: HrCostCenter) => (
-        <div className="flex items-center gap-1">
-          <FaDollarSign className="w-4 h-4 text-gray-500" />
-          <span>₺{costCenter.actualAmount.toLocaleString()}</span>
-        </div>
-      ),
-    },
-    {
-      key: 'variance',
-      header: 'Fark (%)',
-      render: (costCenter: HrCostCenter) => {
-        const variance = getVariancePercentage(costCenter.budgetedAmount, costCenter.actualAmount)
-        const isPositive = variance > 0
-        return (
-          <div className="flex items-center gap-1">
-            <FaPercentage className="w-4 h-4 text-gray-500" />
-            <span className={`font-medium ${isPositive ? 'text-red-600' : 'text-green-600'}`}>
-              {isPositive ? '+' : ''}
-              {variance.toFixed(1)}%
-            </span>
-          </div>
-        )
-      },
-    },
-    {
-      key: 'status',
-      header: 'Durum',
-      render: (costCenter: HrCostCenter) => (
-        <span
-          className={`px-2 py-0.5 text-xs font-medium rounded-full ${
-            costCenter.isActive ? 'bg-green-100 text-green-800' : 'bg-red-100 text-red-800'
-          }`}
-        >
-          {costCenter.isActive ? 'Aktif' : 'Pasif'}
-        </span>
-      ),
-    },
-    {
-      key: 'actions',
-      header: 'İşlemler',
-      render: (costCenter: HrCostCenter) => (
-        <div className="flex gap-1">
-          <button
-            onClick={() => handleView(costCenter)}
-            className="p-0.5 text-green-600 hover:bg-green-50 rounded"
-            title="Görüntüle"
-          >
-            <FaEye className="w-4 h-4" />
-          </button>
-          <button
-            onClick={() => handleEdit(costCenter)}
-            className="p-0.5 text-blue-600 hover:bg-blue-50 rounded"
-            title="Düzenle"
-          >
-            <FaEdit className="w-4 h-4" />
-          </button>
-          <button
-            onClick={() => handleDelete(costCenter.id)}
-            className="p-0.5 text-red-600 hover:bg-red-50 rounded"
-            title="Sil"
-          >
-            <FaTrash className="w-4 h-4" />
-          </button>
-        </div>
-      ),
-    },
-  ]
-
-  const totalBudget = costCenters.reduce((sum, cc) => sum + cc.budgetedAmount, 0)
-  const totalActual = costCenters.reduce((sum, cc) => sum + cc.actualAmount, 0)
-  const totalVariance = getVariancePercentage(totalBudget, totalActual)
-
-  const renderCards = () => (
-    <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6">
-      {filteredCostCenters.map((costCenter) => {
-        const variance = getVariancePercentage(costCenter.budgetedAmount, costCenter.actualAmount)
-        const isPositive = variance > 0
-
-        return (
-          <div
-            key={costCenter.id}
-            className="bg-white rounded-lg shadow-sm border hover:shadow-md transition-shadow"
-          >
-            <div className="p-4">
-              <div className="flex items-start justify-between mb-4">
-                <div>
-                  <h3 className="text-lg font-semibold text-gray-900 mb-1">{costCenter.name}</h3>
-                  <p className="text-gray-600">{costCenter.code}</p>
-                </div>
-                <span
-                  className={`px-2 py-0.5 text-xs font-medium rounded-full ${getCostCenterTypeColor(
-                    costCenter.costCenterType,
-                  )}`}
-                >
-                  {getCostCenterTypeText(costCenter.costCenterType)}
-                </span>
-              </div>
-
-              {costCenter.description && (
-                <p className="text-sm text-gray-600 mb-4 line-clamp-2">{costCenter.description}</p>
-              )}
-
-              <div className="space-y-3 mb-4">
-                <div className="flex justify-between">
-                  <span className="text-sm text-gray-600">Bütçe:</span>
-                  <span className="font-medium">₺{costCenter.budgetedAmount.toLocaleString()}</span>
-                </div>
-                <div className="flex justify-between">
-                  <span className="text-sm text-gray-600">Gerçekleşen:</span>
-                  <span className="font-medium">₺{costCenter.actualAmount.toLocaleString()}</span>
-                </div>
-                <div className="flex justify-between">
-                  <span className="text-sm text-gray-600">Fark:</span>
-                  <span className={`font-medium ${isPositive ? 'text-red-600' : 'text-green-600'}`}>
-                    {isPositive ? '+' : ''}
-                    {variance.toFixed(1)}%
-                  </span>
-                </div>
-              </div>
-
-              {costCenter.responsibleEmployee && (
-                <div className="flex items-center gap-2 mb-4">
-                  <span className="text-sm text-gray-600">Sorumlu:</span>
-                  <span className="text-sm font-medium">
-                    {costCenter.responsibleEmployee.fullName}
-                  </span>
-                </div>
-              )}
-
-              <div className="flex items-center justify-between pt-4 border-t">
-                <span
-                  className={`px-2 py-0.5 text-xs font-medium rounded-full ${
-                    costCenter.isActive ? 'bg-green-100 text-green-800' : 'bg-red-100 text-red-800'
-                  }`}
-                >
-                  {costCenter.isActive ? 'Aktif' : 'Pasif'}
-                </span>
-
-                <div className="flex gap-1">
-                  <button
-                    onClick={() => handleView(costCenter)}
-                    className="p-1 text-green-600 hover:bg-green-50 rounded"
-                    title="Görüntüle"
-                  >
-                    <FaEye className="w-4 h-4" />
-                  </button>
-                  <button
-                    onClick={() => handleEdit(costCenter)}
-                    className="p-1 text-blue-600 hover:bg-blue-50 rounded"
-                    title="Düzenle"
-                  >
-                    <FaEdit className="w-4 h-4" />
-                  </button>
-                  <button
-                    onClick={() => handleDelete(costCenter.id)}
-                    className="p-1 text-red-600 hover:bg-red-50 rounded"
-                    title="Sil"
-                  >
-                    <FaTrash className="w-4 h-4" />
-                  </button>
-                </div>
-              </div>
-            </div>
-          </div>
-        )
-      })}
-    </div>
-  )
-
-  return (
-    <Container>
-      <div className="space-y-2">
-        {/* Header */}
-        <div className="flex flex-col sm:flex-row sm:items-center justify-between gap-4">
-          <div>
-            <h2 className="text-2xl font-bold text-gray-900">Maliyet Merkezi Yönetimi</h2>
-            <p className="text-gray-600">
-              Maliyet merkezlerini ve bütçe takibini yönetin
-            </p>
-          </div>
-          <button
-            onClick={handleAdd}
-            className="flex items-center gap-2 px-3 py-1.5 text-sm bg-blue-600 text-white rounded-md hover:bg-blue-700 transition-colors"
-          >
-            <FaPlus className="w-4 h-4" />
-            Yeni Maliyet Merkezi
-          </button>
-        </div>
-
-        {/* Stats Cards */}
-        <div className="grid grid-cols-1 md:grid-cols-4 gap-4">
-          <Widget
-            title="Toplam Maliyet Merkezi"
-            value={costCenters.length}
-            color="blue"
-            icon="FaChartPie"
-          />
-
-          <Widget
-            title="Toplam Bütçe"
-            value={`₺${totalBudget.toLocaleString()}`}
-            color="green"
-            icon="FaDollarSign"
-          />
-
-          <Widget
-            title="Toplam Gerçekleşen"
-            value={`₺${totalActual.toLocaleString()}`}
-            color="orange"
-            icon="FaDollarSign"
-          />
-
-          <Widget
-            title="Toplam Fark"
-            value={`${totalVariance > 0 ? '+' : ''}${totalVariance.toFixed(1)}%`}
-            color={totalVariance > 0 ? 'red' : 'green'}
-            icon="FaPercentage"
-          />
-        </div>
-
-        {/* Filters and View Mode */}
-        <div className="flex flex-col sm:flex-row gap-4 items-stretch sm:items-center justify-between">
-          <div className="flex flex-col sm:flex-row gap-4 items-stretch sm:items-center flex-1">
-            <div className="flex-1">
-              <input
-                type="text"
-                placeholder="Maliyet merkezi adı veya kodu ara..."
-                value={searchTerm}
-                onChange={(e) => setSearchTerm(e.target.value)}
-                className="w-full px-3 py-1.5 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-              />
-            </div>
-
-            <select
-              value={selectedType}
-              onChange={(e) => setSelectedType(e.target.value)}
-              className="px-3 py-1.5 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 min-w-0 sm:min-w-[200px]"
-            >
-              <option value="all">Tüm Tipler</option>
-              {Object.values(CostCenterType).map((type) => (
-                <option key={type} value={type}>
-                  {getCostCenterTypeText(type)}
-                </option>
-              ))}
-            </select>
-          </div>
-
-          {/* View Mode Toggle */}
-          <div className="flex items-center gap-2 bg-gray-100 rounded-lg p-1">
-            <button
-              onClick={() => setViewMode('list')}
-              className={`p-1.5 rounded-md text-sm transition-colors ${
-                viewMode === 'list'
-                  ? 'bg-white text-blue-600 shadow-sm'
-                  : 'text-gray-600 hover:text-gray-900'
-              }`}
-              title="Liste Görünümü"
-            >
-              <FaList className="w-4 h-4" />
-            </button>
-            <button
-              onClick={() => setViewMode('cards')}
-              className={`p-1.5 rounded-md text-sm transition-colors ${
-                viewMode === 'cards'
-                  ? 'bg-white text-blue-600 shadow-sm'
-                  : 'text-gray-600 hover:text-gray-900'
-              }`}
-              title="Kart Görünümü"
-            >
-              <FaTh className="w-4 h-4" />
-            </button>
-          </div>
-        </div>
-
-        {/* Content */}
-        {viewMode === 'list' ? (
-          <div className="bg-white rounded-lg shadow-sm border">
-            <DataTable data={filteredCostCenters} columns={columns} />
-          </div>
-        ) : (
-          renderCards()
-        )}
-
-        {filteredCostCenters.length === 0 && (
-          <div className="text-center py-12">
-            <FaChartPie className="w-10 h-10 text-gray-400 mx-auto mb-3" />
-            <h3 className="text-base font-medium text-gray-900 mb-2">Maliyet merkezi bulunamadı</h3>
-            <p className="text-gray-500">Arama kriterlerinizi değiştirmeyi deneyin.</p>
-          </div>
-        )}
-      </div>
-
-      {/* Modals */}
-      <CostCenterFormModal
-        isOpen={isFormModalOpen}
-        onClose={() => {
-          setIsFormModalOpen(false)
-          setEditingCostCenter(undefined)
-        }}
-        onSave={handleSave}
-        costCenter={editingCostCenter}
-        title={editingCostCenter ? 'Maliyet Merkezi Düzenle' : 'Yeni Maliyet Merkezi'}
-      />
-
-      <CostCenterViewModal
-        isOpen={isViewModalOpen}
-        onClose={() => {
-          setIsViewModalOpen(false)
-          setSelectedCostCenter(null)
-        }}
-        costCenter={selectedCostCenter}
-      />
-    </Container>
-  )
-}
-
-export default CostCenterManagement
diff --git a/ui/src/views/hr/components/CostCenterViewModal.tsx b/ui/src/views/hr/components/CostCenterViewModal.tsx
deleted file mode 100644
index 344d7e0d..00000000
--- a/ui/src/views/hr/components/CostCenterViewModal.tsx
+++ /dev/null
@@ -1,273 +0,0 @@
-import React from "react";
-import {
-  FaTimes,
-  FaDollarSign,
-  FaPercentage,
-  FaUser,
-  FaBuilding,
-} from "react-icons/fa";
-import { HrCostCenter } from "../../../types/hr";
-import {
-  getCostCenterTypeColor,
-  getCostCenterTypeText,
-} from "../../../utils/erp";
-
-interface CostCenterViewModalProps {
-  isOpen: boolean;
-  onClose: () => void;
-  costCenter: HrCostCenter | null;
-}
-
-const CostCenterViewModal: React.FC<CostCenterViewModalProps> = ({
-  isOpen,
-  onClose,
-  costCenter,
-}) => {
-  const getVariancePercentage = (budgeted: number, actual: number): number => {
-    if (budgeted === 0) return 0;
-    return ((actual - budgeted) / budgeted) * 100;
-  };
-
-  const variance = costCenter
-    ? getVariancePercentage(costCenter.budgetedAmount, costCenter.actualAmount)
-    : 0;
-
-  return (
-    isOpen &&
-    costCenter && (
-      <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
-        <div className="bg-white rounded-lg p-4 w-full max-w-xl max-h-[90vh] overflow-y-auto">
-          <div className="flex items-center justify-between mb-4">
-            <h2 className="text-xl font-bold text-gray-900">
-              Maliyet Merkezi Detayları
-            </h2>
-            <button
-              onClick={onClose}
-              className="text-gray-400 hover:text-gray-600"
-            >
-              <FaTimes className="w-5 h-5" />
-            </button>
-          </div>
-
-          <div className="space-y-4">
-            {/* Temel Bilgiler */}
-            <div className="bg-gray-50 rounded-lg p-3">
-              <h3 className="text-lg font-semibold text-gray-900 mb-4 flex items-center gap-2">
-                <FaBuilding className="w-5 h-5" />
-                Temel Bilgiler
-              </h3>
-              <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
-                <div>
-                  <label className="block text-sm font-medium text-gray-600">
-                    Maliyet Merkezi Kodu
-                  </label>
-                  <p className="text-base font-semibold text-gray-900">
-                    {costCenter.code}
-                  </p>
-                </div>
-                <div>
-                  <label className="block text-sm font-medium text-gray-600">
-                    Maliyet Merkezi Adı
-                  </label>
-                  <p className="text-base font-semibold text-gray-900">
-                    {costCenter.name}
-                  </p>
-                </div>
-                <div>
-                  <label className="block text-sm font-medium text-gray-600">
-                    Tip
-                  </label>
-                  <span
-                    className={`inline-block px-2 py-0.5 text-xs font-medium rounded-full ${getCostCenterTypeColor(
-                      costCenter.costCenterType
-                    )}`}
-                  >
-                    {getCostCenterTypeText(costCenter.costCenterType)}
-                  </span>
-                </div>
-                <div>
-                  <label className="block text-sm font-medium text-gray-600">
-                    Mali Yıl
-                  </label>
-                  <p className="text-base font-semibold text-gray-900">
-                    {costCenter.fiscalYear}
-                  </p>
-                </div>
-              </div>
-              {costCenter.description && (
-                <div className="mt-4">
-                  <label className="block text-sm font-medium text-gray-600">
-                    Açıklama
-                  </label>
-                  <p className="text-gray-900">{costCenter.description}</p>
-                </div>
-              )}
-            </div>
-
-            {/* Sorumlu Bilgileri */}
-            {costCenter.responsibleEmployee && (
-              <div className="bg-blue-50 rounded-lg p-3">
-                <h3 className="text-lg font-semibold text-gray-900 mb-4 flex items-center gap-2">
-                  <FaUser className="w-5 h-5" />
-                  Sorumlu Personel
-                </h3>
-                <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
-                  <div>
-                    <label className="block text-sm font-medium text-gray-600">
-                      Ad Soyad
-                    </label>
-                    <p className="text-base font-semibold text-gray-900">
-                      {costCenter.responsibleEmployee.fullName}
-                    </p>
-                  </div>
-                  <div>
-                    <label className="block text-sm font-medium text-gray-600">
-                      E-posta
-                    </label>
-                    <p className="text-gray-900">
-                      {costCenter.responsibleEmployee.email}
-                    </p>
-                  </div>
-                </div>
-              </div>
-            )}
-
-            {/* Bütçe Bilgileri */}
-            <div className="bg-green-50 rounded-lg p-3">
-              <h3 className="text-lg font-semibold text-gray-900 mb-4 flex items-center gap-2">
-                <FaDollarSign className="w-5 h-5" />
-                Bütçe Bilgileri
-              </h3>
-              <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
-                <div>
-                  <label className="block text-sm font-medium text-gray-600">
-                    Bütçe Tutarı
-                  </label>
-                  <p className="text-lg font-bold text-green-600">
-                    {costCenter.currency}{" "}
-                    {costCenter.budgetedAmount.toLocaleString()}
-                  </p>
-                </div>
-                <div>
-                  <label className="block text-sm font-medium text-gray-600">
-                    Gerçekleşen Tutar
-                  </label>
-                  <p className="text-lg font-bold text-blue-600">
-                    {costCenter.currency}{" "}
-                    {costCenter.actualAmount.toLocaleString()}
-                  </p>
-                </div>
-                <div>
-                  <label className="block text-sm font-medium text-gray-600">
-                    Fark
-                  </label>
-                  <div className="flex items-center gap-2">
-                    <FaPercentage className="w-4 h-4 text-gray-500" />
-                    <span
-                      className={`text-lg font-bold ${
-                        variance > 0 ? "text-red-600" : "text-green-600"
-                      }`}
-                    >
-                      {variance > 0 ? "+" : ""}
-                      {variance.toFixed(1)}%
-                    </span>
-                  </div>
-                </div>
-              </div>
-
-              {/* Bütçe Görselleştirme */}
-              <div className="mt-4">
-                <label className="block text-sm font-medium text-gray-600 mb-2">
-                  Bütçe Kullanım Oranı
-                </label>
-                <div className="w-full bg-gray-200 rounded-full h-2.5">
-                  <div
-                    className={`h-2.5 rounded-full ${
-                      variance > 0 ? "bg-red-500" : "bg-green-500"
-                    }`}
-                    style={{
-                      width: `${Math.min(
-                        (costCenter.actualAmount / costCenter.budgetedAmount) *
-                          100,
-                        100
-                      )}%`,
-                    }}
-                  ></div>
-                </div>
-                <p className="text-sm text-gray-600 mt-1">
-                  {(
-                    (costCenter.actualAmount / costCenter.budgetedAmount) *
-                    100
-                  ).toFixed(1)}
-                  % kullanıldı
-                </p>
-              </div>
-            </div>
-
-            {/* Hiyerarşi Bilgileri */}
-            {costCenter.parentCostCenter && (
-              <div className="bg-purple-50 rounded-lg p-3">
-                <h3 className="text-lg font-semibold text-gray-900 mb-4">
-                  Hiyerarşi
-                </h3>
-                <div>
-                  <label className="block text-sm font-medium text-gray-600">
-                    Üst Maliyet Merkezi
-                  </label>
-                  <p className="text-base font-semibold text-gray-900">
-                    {costCenter.parentCostCenter.name} (
-                    {costCenter.parentCostCenter.code})
-                  </p>
-                </div>
-              </div>
-            )}
-
-            {/* Durum Bilgisi */}
-            <div className="bg-gray-50 rounded-lg p-3">
-              <h3 className="text-lg font-semibold text-gray-900 mb-4">
-                Durum
-              </h3>
-              <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
-                <div>
-                  <label className="block text-sm font-medium text-gray-600">
-                    Mevcut Durum
-                  </label>
-                  <span
-                    className={`inline-block px-2 py-0.5 text-xs font-medium rounded-full ${
-                      costCenter.isActive
-                        ? "bg-green-100 text-green-800"
-                        : "bg-red-100 text-red-800"
-                    }`}
-                  >
-                    {costCenter.isActive ? "Aktif" : "Pasif"}
-                  </span>
-                </div>
-                <div>
-                  <label className="block text-sm font-medium text-gray-600">
-                    Son Güncelleme
-                  </label>
-                  <p className="text-gray-900">
-                    {new Date(
-                      costCenter.lastModificationTime
-                    ).toLocaleDateString("tr-TR")}
-                  </p>
-                </div>
-              </div>
-            </div>
-          </div>
-
-          <div className="flex justify-end pt-4 mt-4 border-t">
-            <button
-              onClick={onClose}
-              className="px-3 py-1.5 bg-gray-600 text-white rounded-md hover:bg-gray-700"
-            >
-              Kapat
-            </button>
-          </div>
-        </div>
-      </div>
-    )
-  );
-};
-
-export default CostCenterViewModal;
diff --git a/ui/src/views/hr/components/Degree360Evaluation.tsx b/ui/src/views/hr/components/Degree360Evaluation.tsx
deleted file mode 100644
index 4992aa89..00000000
--- a/ui/src/views/hr/components/Degree360Evaluation.tsx
+++ /dev/null
@@ -1,2666 +0,0 @@
-import React, { useState } from 'react'
-import {
-  FaUsers,
-  FaEye,
-  FaEdit,
-  FaPlus,
-  FaChartBar,
-  FaTimes,
-  FaSave,
-  FaPlay,
-  FaPoll,
-} from 'react-icons/fa'
-import {
-  HrEvaluation360,
-  CampaignStatusEnum,
-  AssessorTypeEnum,
-  ParticipantStatusEnum,
-  QuestionTypeEnum,
-  ResultStatusEnum,
-  HrEvaluation360Result,
-  HrGroupScore,
-  HrAssessorTypeScore,
-} from '../../../types/hr'
-import DataTable, { Column } from '../../../components/common/DataTable'
-import { mockEvaluation360 } from '../../../mocks/mockEvaluation360'
-import { mockEvaluation360Results } from '../../../mocks/mockEvaluation360Results'
-import { mockEmployees } from '../../../mocks/mockEmployees'
-import { mockDepartments } from '../../../mocks/mockDepartments'
-import { mockEvaluation360Templates } from '../../../mocks/mockEvaluation360Templates'
-import { mockBusinessParties } from '../../../mocks/mockBusinessParties'
-import Widget from '../../../components/common/Widget'
-import {
-  getAssessorTypeDescription,
-  getAssessorTypeText,
-  getParticipantStatusColor,
-  getParticipantStatusText,
-  getCampaignStatusColor,
-  getCampaignStatusText,
-} from '../../../utils/erp'
-import { Container } from '@/components/shared'
-
-const Degree360Evaluation: React.FC = () => {
-  const [activeTab, setActiveTab] = useState<'campaigns' | 'results'>('campaigns')
-  const [selectedStatus, setSelectedStatus] = useState<string>('all')
-  const [selectedEmployee, setSelectedEmployee] = useState<string>('all')
-  const [selectedDepartment, setSelectedDepartment] = useState<string>('all')
-
-  // Results tab filters
-  const [selectedResultsStatus, setSelectedResultsStatus] = useState<string>('all')
-  const [selectedResultsEmployee, setSelectedResultsEmployee] = useState<string>('all')
-  const [selectedResultsDepartment, setSelectedResultsDepartment] = useState<string>('all')
-  const [selectedResultsCampaign, setSelectedResultsCampaign] = useState<string>('all')
-
-  // Modal states
-  const [showCampaignModal, setShowCampaignModal] = useState(false)
-  const [showViewModal, setShowViewModal] = useState(false)
-  const [showEvaluationModal, setShowEvaluationModal] = useState(false)
-  const [showResultDetailModal, setShowResultDetailModal] = useState(false)
-  const [showResultEditModal, setShowResultEditModal] = useState(false)
-  const [selectedCampaign, setSelectedCampaign] = useState<HrEvaluation360 | null>(null)
-  const [selectedResult, setSelectedResult] = useState<{
-    resultId: string
-    evaluatedEmployeeName: string
-    evaluatorName: string
-    campaignName: string
-    overallScore: number
-    scorePercentage: number
-    evaluatedEmployeeId: string
-    evaluatorId: string
-    campaignId: string
-    evaluatorType: AssessorTypeEnum
-    status: ParticipantStatusEnum
-    completedDate?: Date
-  } | null>(null)
-
-  // Evaluation states
-  const [evaluationTarget, setEvaluationTarget] = useState<string>('')
-  const [evaluationEvaluator, setEvaluationEvaluator] = useState<string>('')
-  const [selectedAssessorType, setSelectedAssessorType] = useState<AssessorTypeEnum | null>(null)
-  const [externalEvaluatorName, setExternalEvaluatorName] = useState<string>('')
-  const [externalEvaluatorEmail, setExternalEvaluatorEmail] = useState<string>('')
-  const [selectedCustomerId, setSelectedCustomerId] = useState<string>('')
-  const [evaluatorSearchTerm, setEvaluatorSearchTerm] = useState<string>('')
-  const [currentCampaignForEvaluation, setCurrentCampaignForEvaluation] =
-    useState<HrEvaluation360 | null>(null)
-
-  // Evaluation responses state
-  const [evaluationResponses, setEvaluationResponses] = useState<Record<string, string | number>>(
-    {},
-  )
-
-  // Edit modal states
-  const [editResponses, setEditResponses] = useState<Record<string, string | number>>({})
-  const [editManagerComments, setEditManagerComments] = useState<string>('')
-  const [editHrComments, setEditHrComments] = useState<string>('')
-  const [editResultStatus, setEditResultStatus] = useState<string>('PENDING')
-
-  // Form states
-  const [campaignFormData, setCampaignFormData] = useState({
-    name: '',
-    description: '',
-    templateId: '',
-    departmentId: '',
-    targetEmployees: [] as string[],
-    startDate: '',
-    endDate: '',
-  })
-
-  // Event handlers
-  const handleCloseModal = () => {
-    setShowCampaignModal(false)
-    setShowViewModal(false)
-    setShowEvaluationModal(false)
-    setShowResultDetailModal(false)
-    setShowResultEditModal(false)
-    setSelectedCampaign(null)
-    setSelectedResult(null)
-    setEvaluationTarget('')
-    setEvaluationEvaluator('')
-    setSelectedAssessorType(null)
-    setExternalEvaluatorName('')
-    setExternalEvaluatorEmail('')
-    setSelectedCustomerId('')
-    setEvaluatorSearchTerm('')
-    setCurrentCampaignForEvaluation(null)
-    setEvaluationResponses({})
-    setEditResponses({})
-    setEditManagerComments('')
-    setEditHrComments('')
-    setEditResultStatus('PENDING')
-    setCampaignFormData({
-      name: '',
-      description: '',
-      templateId: '',
-      departmentId: '',
-      targetEmployees: [],
-      startDate: '',
-      endDate: '',
-    })
-  }
-
-  // Response handling functions
-  const handleResponseChange = (questionId: string, value: string | number) => {
-    setEvaluationResponses((prev) => ({
-      ...prev,
-      [questionId]: value,
-    }))
-  }
-
-  // Edit response handling function
-  const handleEditResponseChange = (questionId: string, value: string | number) => {
-    setEditResponses((prev) => ({
-      ...prev,
-      [questionId]: value,
-    }))
-  }
-
-  // Evaluation kaydetme fonksiyonu
-  const handleSaveEvaluation = () => {
-    if (!currentCampaignForEvaluation || !evaluationTarget || !evaluationEvaluator) {
-      alert('Tüm alanları doldurun!')
-      return
-    }
-
-    const template = mockEvaluation360Templates.find(
-      (t) => t.id === currentCampaignForEvaluation.templateId,
-    )
-
-    if (!template) {
-      alert('Template bulunamadı!')
-      return
-    }
-
-    // Responses oluştur
-    const responses = Object.entries(evaluationResponses).map(([questionId, responseValue]) => {
-      const question = template.questionGroups
-        .flatMap((g) => g.questions)
-        .find((q) => q.id === questionId)
-
-      let score = 0
-      if (question) {
-        if (question.questionType === QuestionTypeEnum.Rating) {
-          score = Number(responseValue)
-        } else if (question.questionType === QuestionTypeEnum.YesNo) {
-          score = responseValue === 'yes' ? question.maxRating || 5 : question.minRating || 1
-        } else if (question.questionType === QuestionTypeEnum.MultipleChoice) {
-          const option = question.options?.find((o) => o.value === Number(responseValue))
-          score = option?.value || 0
-        }
-      }
-
-      return {
-        id: `response-${Date.now()}-${Math.random()}`,
-        participantId: `participant-${Date.now()}`,
-        questionId,
-        question,
-        responseValue,
-        responseText: typeof responseValue === 'string' ? responseValue : undefined,
-        score,
-        submittedDate: new Date(),
-      }
-    })
-
-    // Puanları hesapla
-    const totalScore = responses.reduce((sum, response) => sum + response.score, 0)
-    const maxScore = template.questionGroups
-      .flatMap((g) => g.questions)
-      .reduce((sum, q) => sum + (q.maxRating || 5), 0)
-
-    const scorePercentage = maxScore > 0 ? (totalScore / maxScore) * 100 : 0
-
-    // Grup skorlarını hesapla
-    const groupScores: HrGroupScore[] = template.questionGroups.map((group) => {
-      const groupResponses = responses.filter((r) =>
-        group.questions.some((q) => q.id === r.questionId),
-      )
-      const groupScore = groupResponses.reduce((sum, r) => sum + r.score, 0)
-      const groupMaxScore = group.questions.reduce((sum, q) => sum + (q.maxRating || 5), 0)
-
-      return {
-        groupId: group.id,
-        groupName: group.groupName,
-        score: groupScore,
-        maxScore: groupMaxScore,
-        percentage: groupMaxScore > 0 ? (groupScore / groupMaxScore) * 100 : 0,
-        responseCount: groupResponses.length,
-      }
-    })
-
-    // Assessor type skorlarını hesapla
-    const assessorTypeScores: HrAssessorTypeScore[] = [
-      {
-        assessorType: selectedAssessorType!,
-        assessorCount: 1,
-        averageScore: totalScore,
-        maxScore: maxScore,
-        percentage: scorePercentage,
-      },
-    ]
-
-    // Evaluation360Result oluştur
-    const evaluationResult: HrEvaluation360Result = {
-      id: `result-${Date.now()}`,
-      campaignId: currentCampaignForEvaluation.id,
-      employeeId: evaluationTarget,
-      employee: mockEmployees.find((e) => e.id === evaluationTarget),
-      participants: [
-        {
-          id: `participant-${Date.now()}`,
-          campaignId: currentCampaignForEvaluation.id,
-          evaluatedEmployeeId: evaluationTarget,
-          evaluatedEmployee: mockEmployees.find((e) => e.id === evaluationTarget),
-          evaluatorId: evaluationEvaluator,
-          evaluator:
-            selectedAssessorType === AssessorTypeEnum.External ||
-            selectedAssessorType === AssessorTypeEnum.Customer
-              ? undefined // External ve Customer için Employee bilgisi yok
-              : mockEmployees.find((e) => e.id === evaluationEvaluator),
-          evaluatorType: selectedAssessorType!,
-          status: ParticipantStatusEnum.Completed,
-          invitedDate: new Date(),
-          startedDate: new Date(),
-          completedDate: new Date(),
-          responses,
-          overallScore: totalScore,
-          notes: '',
-        },
-      ],
-      overallScore: totalScore,
-      maxPossibleScore: maxScore,
-      scorePercentage,
-      groupScores,
-      assessorTypeScores,
-      strengths: ['Güçlü iletişim', 'Takım çalışması'], // Örnek veriler
-      developmentAreas: ['Zaman yönetimi', 'Teknik beceriler'], // Örnek veriler
-      actionPlan: ['Zaman yönetimi kursu alma', 'Teknik eğitimlere katılma'], // Örnek veriler
-      managerComments: '',
-      hrComments: '',
-      status: ResultStatusEnum.Pending,
-      generatedDate: new Date(),
-      approvedBy: undefined,
-      approvedDate: undefined,
-    }
-
-    // Console'a yazdır
-    console.log('Evaluation360Result:', evaluationResult)
-
-    alert('Değerlendirme başarıyla kaydedildi! Sonuç konsola yazdırıldı.')
-    handleCloseModal()
-  }
-
-  const handleNewCampaign = () => {
-    setSelectedCampaign(null)
-    setShowCampaignModal(true)
-  }
-
-  const handleEditCampaign = (campaign: HrEvaluation360 | null) => {
-    if (campaign) {
-      setSelectedCampaign(campaign)
-      setCampaignFormData({
-        name: campaign.name,
-        description: campaign.description,
-        templateId: campaign.templateId,
-        departmentId: campaign.departmentId || '',
-        targetEmployees: campaign.targetEmployees,
-        startDate: campaign.startDate.toISOString().split('T')[0],
-        endDate: campaign.endDate.toISOString().split('T')[0],
-      })
-      setShowCampaignModal(true)
-    }
-  }
-
-  const handleViewCampaign = (campaign: HrEvaluation360) => {
-    setSelectedCampaign(campaign)
-    setShowViewModal(true)
-  }
-
-  const handleSaveCampaign = () => {
-    console.log('Değerlendirme kaydediliyor:', campaignFormData)
-    handleCloseModal()
-  }
-
-  const handleDepartmentChange = (departmentId: string) => {
-    setSelectedDepartment(departmentId)
-    setCampaignFormData({
-      ...campaignFormData,
-      departmentId,
-      targetEmployees: [],
-    })
-  }
-
-  // Değerlendirme yapma handler'ı
-  const handleStartEvaluation = () => {
-    setCurrentCampaignForEvaluation(null)
-    setEvaluationTarget('')
-    setEvaluationEvaluator('')
-    setShowEvaluationModal(true)
-  }
-
-  // Otomatik değerlendirici belirleme fonksiyonu (360° metodolojisi)
-  const getEvaluatorsByType = (targetEmployeeId: string, assessorType: AssessorTypeEnum) => {
-    const targetEmployee = mockEmployees.find((emp) => emp.id === targetEmployeeId)
-    if (!targetEmployee) return []
-
-    switch (assessorType) {
-      case AssessorTypeEnum.Self: {
-        return [
-          {
-            id: targetEmployee.id,
-            name: targetEmployee.fullName,
-            title: targetEmployee.jobPosition?.name,
-            department:
-              mockDepartments.find((d) => d.id === targetEmployee.departmentId)?.name || '',
-            type: 'employee',
-          },
-        ]
-      }
-
-      case AssessorTypeEnum.Manager: {
-        const managers = mockEmployees.filter(
-          (emp) =>
-            emp.departmentId === targetEmployee.departmentId &&
-            (typeof emp.jobPosition?.level === 'number' &&
-            typeof targetEmployee.jobPosition?.level === 'number'
-              ? emp.jobPosition?.level > targetEmployee.jobPosition?.level
-              : emp.jobPosition?.name.includes('Müdür') ||
-                emp.jobPosition?.name.includes('Manager')),
-        )
-        return managers.map((emp) => ({
-          id: emp.id,
-          name: emp.fullName,
-          title: emp.jobPosition?.name,
-          department: mockDepartments.find((d) => d.id === emp.departmentId)?.name || '',
-          type: 'employee',
-        }))
-      }
-
-      case AssessorTypeEnum.Peer: {
-        const peers = mockEmployees.filter(
-          (emp) =>
-            emp.id !== targetEmployeeId &&
-            emp.departmentId === targetEmployee.departmentId &&
-            emp.jobPosition?.level === targetEmployee.jobPosition?.level,
-        )
-        return peers.map((emp) => ({
-          id: emp.id,
-          name: emp.fullName,
-          title: emp.jobPosition?.name,
-          department: mockDepartments.find((d) => d.id === emp.departmentId)?.name || '',
-          type: 'employee',
-        }))
-      }
-
-      case AssessorTypeEnum.Subordinate: {
-        const subordinates = mockEmployees.filter(
-          (emp) =>
-            emp.departmentId === targetEmployee.departmentId &&
-            (typeof emp.jobPosition?.level === 'number' &&
-            typeof targetEmployee.jobPosition?.level === 'number'
-              ? emp.jobPosition?.level < targetEmployee.jobPosition?.level
-              : !emp.jobPosition?.name.includes('Müdür') &&
-                !emp.jobPosition?.name.includes('Manager')),
-        )
-        return subordinates.map((emp) => ({
-          id: emp.id,
-          name: emp.fullName,
-          title: emp.jobPosition?.name,
-          department: mockDepartments.find((d) => d.id === emp.departmentId)?.name || '',
-          type: 'employee',
-        }))
-      }
-
-      case AssessorTypeEnum.Customer: {
-        return mockBusinessParties.map((customer) => ({
-          id: customer.id,
-          name: customer.name,
-          title: 'Müşteri Temsilcisi',
-          department: 'Müşteri',
-          type: 'customer',
-        }))
-      }
-
-      case AssessorTypeEnum.External: {
-        return [
-          {
-            id: 'external',
-            name: 'Dış Değerlendirici',
-            title: 'Harici',
-            department: 'Dış Paydaş',
-            type: 'external',
-          },
-        ]
-      }
-
-      case AssessorTypeEnum.HRUpperManagement: {
-        const hrEmployees = mockEmployees.filter(
-          (emp) =>
-            emp.id !== targetEmployeeId && (emp.departmentId === 'hr' || emp.departmentId === '3'), // HR departmanı
-        )
-        return hrEmployees.map((emp) => ({
-          id: emp.id,
-          name: emp.fullName,
-          title: emp.jobPosition?.name,
-          department: mockDepartments.find((d) => d.id === emp.departmentId)?.name || '',
-          type: 'employee',
-        }))
-      }
-
-      case AssessorTypeEnum.OtherDepartment: {
-        const otherDepartmentEmployees = mockEmployees.filter(
-          (emp) => emp.id !== targetEmployeeId && emp.departmentId !== targetEmployee.departmentId,
-        )
-        return otherDepartmentEmployees.map((emp) => ({
-          id: emp.id,
-          name: emp.fullName,
-          title: emp.jobPosition?.name,
-          department: mockDepartments.find((d) => d.id === emp.departmentId)?.name || '',
-          type: 'employee',
-        }))
-      }
-
-      default:
-        return []
-    }
-  }
-
-  // Değerlendiren bilgisini getiren fonksiyon
-  const getEvaluatorInfo = () => {
-    if (evaluationEvaluator === 'external') {
-      return externalEvaluatorName
-    }
-
-    if (selectedAssessorType === AssessorTypeEnum.Customer) {
-      const customer = mockBusinessParties.find((c) => c.id === selectedCustomerId)
-      return customer ? customer.name : 'Müşteri Bulunamadı'
-    }
-
-    const employee = mockEmployees.find((e) => e.id === evaluationEvaluator)
-    return employee ? employee.fullName : 'Çalışan Bulunamadı'
-  }
-
-  // Template'deki izin verilen assessor tiplerini getir
-  const getAllowedAssessorTypes = () => {
-    if (!currentCampaignForEvaluation) return []
-
-    const template = mockEvaluation360Templates.find(
-      (t) => t.id === currentCampaignForEvaluation.templateId,
-    )
-
-    return template?.assessorTypes || []
-  }
-
-  // Helper function to get participants for a campaign from results
-  const getCampaignParticipants = (campaignId: string) => {
-    return mockEvaluation360Results
-      .filter((result) => result.campaignId === campaignId)
-      .flatMap((result) => result.participants)
-  }
-
-  // Filtered data
-  const filteredCampaigns = mockEvaluation360.filter((campaign) => {
-    if (selectedStatus !== 'all' && campaign.status !== selectedStatus) return false
-    if (selectedDepartment !== 'all' && campaign.departmentId !== selectedDepartment) return false
-    if (selectedEmployee !== 'all') {
-      const participants = getCampaignParticipants(campaign.id)
-      const hasEmployee = participants.some(
-        (p) => p.evaluatedEmployeeId === selectedEmployee || p.evaluatorId === selectedEmployee,
-      )
-      if (!hasEmployee) return false
-    }
-    return true
-  })
-
-  const filteredEmployeesByDepartment = mockEmployees.filter(
-    (emp) => selectedDepartment === 'all' || emp.departmentId === selectedDepartment,
-  )
-
-  // Statistics
-  const totalActiveCampaigns = mockEvaluation360.filter(
-    (c) => c.status === CampaignStatusEnum.Active,
-  ).length
-
-  const allParticipants = mockEvaluation360Results.flatMap((result) => result.participants)
-
-  const totalCompletedEvaluations = allParticipants.filter(
-    (p) => p.status === ParticipantStatusEnum.Completed,
-  ).length
-
-  const totalPendingEvaluations = allParticipants.filter(
-    (p) => p.status === ParticipantStatusEnum.Invited || p.status === ParticipantStatusEnum.Started,
-  ).length
-
-  const totalParticipants = allParticipants.length
-
-  // Results helper functions
-  // Participant evaluation helper functions
-  const handleViewEvaluationDetail = (result: {
-    resultId: string
-    evaluatedEmployeeName: string
-    evaluatorName: string
-    campaignName: string
-    overallScore: number
-    scorePercentage: number
-    evaluatedEmployeeId: string
-    evaluatorId: string
-    campaignId: string
-    evaluatorType: AssessorTypeEnum
-    status: ParticipantStatusEnum
-    completedDate?: Date
-  }) => {
-    // Değerlendirme detaylarını görüntüle
-    console.log('Viewing evaluation detail:', result)
-    setSelectedResult(result)
-    setShowResultDetailModal(true)
-  }
-
-  const handleEditEvaluationDetail = (result: {
-    resultId: string
-    evaluatedEmployeeName: string
-    evaluatorName: string
-    campaignName: string
-    overallScore: number
-    scorePercentage: number
-    evaluatedEmployeeId: string
-    evaluatorId: string
-    campaignId: string
-    evaluatorType: AssessorTypeEnum
-    status: ParticipantStatusEnum
-    completedDate?: Date
-  }) => {
-    // Değerlendirme detaylarını düzenle
-    console.log('Editing evaluation detail:', result)
-
-    // Mevcut evaluation result'ını bul
-    const evaluationResult = mockEvaluation360Results.find((r) => r.id === result.resultId)
-    if (evaluationResult) {
-      // Mevcut cevapları yükle
-      const currentResponses: Record<string, string | number> = {}
-      evaluationResult.participants.forEach((participant) => {
-        participant.responses.forEach((response) => {
-          currentResponses[response.questionId] = response.responseValue
-        })
-      })
-
-      setEditResponses(currentResponses)
-      setEditManagerComments(evaluationResult.managerComments || '')
-      setEditHrComments(evaluationResult.hrComments || '')
-      setEditResultStatus(evaluationResult.status)
-    }
-
-    setSelectedResult(result)
-    setShowResultEditModal(true)
-  }
-
-  const getAssessorTypeLabel = (assessorType: AssessorTypeEnum): string => {
-    return getAssessorTypeText(assessorType)
-  }
-
-  const getAllEvaluationParticipants = () => {
-    // Tüm sonuçlardan participant verilerini al
-    const allParticipants = mockEvaluation360Results.flatMap((result) =>
-      result.participants.map((participant) => ({
-        ...participant,
-        resultId: result.id,
-        evaluatedEmployeeName:
-          mockEmployees.find((e) => e.id === participant.evaluatedEmployeeId)?.fullName ||
-          'Bilinmiyor',
-        evaluatorName:
-          mockEmployees.find((e) => e.id === participant.evaluatorId)?.fullName || 'Bilinmiyor',
-        campaignName:
-          mockEvaluation360.find((c) => c.id === participant.campaignId)?.name || 'Bilinmiyor',
-        overallScore: result.overallScore,
-        scorePercentage: result.scorePercentage,
-        result: result,
-      })),
-    )
-
-    // Filtreleme işlemi
-    return allParticipants.filter((participant) => {
-      // Durum filtresi
-      if (selectedResultsStatus !== 'all' && participant.status !== selectedResultsStatus) {
-        return false
-      }
-
-      // Kampanya filtresi
-      if (selectedResultsCampaign !== 'all' && participant.campaignId !== selectedResultsCampaign) {
-        return false
-      }
-
-      // Değerlendirilecek kişi filtresi
-      if (
-        selectedResultsEmployee !== 'all' &&
-        participant.evaluatedEmployeeId !== selectedResultsEmployee
-      ) {
-        return false
-      }
-
-      // Departman filtresi
-      if (selectedResultsDepartment !== 'all') {
-        const evaluatedEmployee = mockEmployees.find(
-          (e) => e.id === participant.evaluatedEmployeeId,
-        )
-        if (!evaluatedEmployee || evaluatedEmployee.departmentId !== selectedResultsDepartment) {
-          return false
-        }
-      }
-
-      return true
-    })
-  }
-
-  // Columns for campaigns table
-  const campaignColumns: Column<HrEvaluation360>[] = [
-    {
-      key: 'name',
-      header: 'Değerlendirme Adı',
-      sortable: true,
-    },
-    {
-      key: 'departmentId',
-      header: 'Departman',
-      render: (item: HrEvaluation360) => {
-        const department = mockDepartments.find((d) => d.id === item.departmentId)
-        return department?.name || 'Tüm Departmanlar'
-      },
-    },
-    {
-      key: 'templateId',
-      header: 'Şablon',
-      render: (item: HrEvaluation360) => {
-        const template = mockEvaluation360Templates.find((t) => t.id === item.templateId)
-        return template?.name || 'Bilinmiyor'
-      },
-    },
-    {
-      key: 'status',
-      header: 'Durum',
-      render: (item: HrEvaluation360) => (
-        <span
-          className={`px-2 py-1 text-xs font-medium rounded-full ${getCampaignStatusColor(
-            item.status,
-          )}`}
-        >
-          {getCampaignStatusText(item.status)}
-        </span>
-      ),
-    },
-    {
-      key: 'startDate',
-      header: 'Başlangıç',
-      render: (item: HrEvaluation360) => item.startDate.toLocaleDateString('tr-TR'),
-    },
-    {
-      key: 'endDate',
-      header: 'Bitiş',
-      render: (item: HrEvaluation360) => item.endDate.toLocaleDateString('tr-TR'),
-    },
-    {
-      key: 'participants',
-      header: 'Katılımcı',
-      render: (item: HrEvaluation360) => {
-        const participants = getCampaignParticipants(item.id)
-        return `${participants.length} kişi`
-      },
-    },
-    {
-      key: 'id',
-      header: 'İşlemler',
-      render: (item: HrEvaluation360) => (
-        <div className="flex gap-2">
-          <button
-            onClick={() => handleViewCampaign(item)}
-            className="p-1 text-blue-600 hover:text-blue-800"
-            title="Görüntüle"
-          >
-            <FaEye className="w-4 h-4" />
-          </button>
-          <button
-            onClick={() => handleEditCampaign(item)}
-            className="p-1 text-green-600 hover:text-green-800"
-            title="Düzenle"
-          >
-            <FaEdit className="w-4 h-4" />
-          </button>
-        </div>
-      ),
-    },
-  ]
-
-  return (
-    <Container>
-      <div className="space-y-2">
-        {/* Header */}
-        <div className="flex justify-between items-center">
-          <div>
-            <h2 className="text-2xl font-bold text-gray-900">360° Değerlendirme Sistemi</h2>
-            <p className="text-gray-600">Çok yönlü performans değerlendirme sistemi</p>
-          </div>
-        </div>
-
-        {/* Statistics Cards */}
-        <div className="grid grid-cols-1 md:grid-cols-4 gap-2">
-          <Widget
-            title="Aktif Değerlendirmeler"
-            value={totalActiveCampaigns}
-            color="blue"
-            icon="FaPlay"
-          />
-
-          <Widget
-            title="Tamamlanan Değerlendirmeler"
-            value={totalCompletedEvaluations}
-            color="green"
-            icon="FaCheckCircle"
-          />
-
-          <Widget
-            title="Bekleyen Değerlendirmeler"
-            value={totalPendingEvaluations}
-            color="yellow"
-            icon="FaPoll"
-          />
-
-          <Widget title="Katılımcılar" value={totalParticipants} color="purple" icon="FaUsers" />
-        </div>
-
-        {/* Tabs */}
-        <div className="bg-white rounded-lg shadow-sm border">
-          <div className="border-b border-gray-200">
-            <nav className="-mb-px flex space-x-2 px-2">
-              {[
-                {
-                  key: 'campaigns',
-                  label: 'Değerlendirme Kampanyaları',
-                  icon: FaUsers,
-                },
-                {
-                  key: 'results',
-                  label: 'Değerlendirme Sonuçları',
-                  icon: FaChartBar,
-                },
-              ].map(({ key, label, icon: Icon }) => (
-                <button
-                  key={key}
-                  onClick={() => setActiveTab(key as 'campaigns' | 'results')}
-                  className={`flex items-center gap-2 py-1.5 px-2.5 border-b-2 font-medium text-sm ${
-                    activeTab === key
-                      ? 'border-blue-500 text-blue-600'
-                      : 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300'
-                  }`}
-                >
-                  <Icon className="w-4 h-4" />
-                  {label}
-                </button>
-              ))}
-            </nav>
-          </div>
-
-          <div className="p-3">
-            {activeTab === 'campaigns' && (
-              <div className="space-y-3">
-                {/* Filters and Actions */}
-                <div className="flex flex-col sm:flex-row gap-3 justify-between">
-                  <div className="flex flex-col sm:flex-row gap-3">
-                    <select
-                      value={selectedStatus}
-                      onChange={(e) => setSelectedStatus(e.target.value)}
-                      className="border border-gray-300 rounded-md px-2.5 py-1 text-sm"
-                    >
-                      <option value="all">Tüm Durumlar</option>
-                      {Object.values(CampaignStatusEnum).map((status) => (
-                        <option key={status} value={status}>
-                          {getCampaignStatusText(status)}
-                        </option>
-                      ))}
-                    </select>
-
-                    <select
-                      value={selectedDepartment}
-                      onChange={(e) => setSelectedDepartment(e.target.value)}
-                      className="border border-gray-300 rounded-md px-2.5 py-1 text-sm"
-                    >
-                      <option value="all">Tüm Departmanlar</option>
-                      {mockDepartments.map((department) => (
-                        <option key={department.id} value={department.id}>
-                          {department.name}
-                        </option>
-                      ))}
-                    </select>
-
-                    <select
-                      value={selectedEmployee}
-                      onChange={(e) => setSelectedEmployee(e.target.value)}
-                      className="border border-gray-300 rounded-md px-2.5 py-1 text-sm"
-                    >
-                      <option value="all">Tüm Personel</option>
-                      {mockEmployees.map((employee) => (
-                        <option key={employee.id} value={employee.id}>
-                          {employee.fullName}
-                        </option>
-                      ))}
-                    </select>
-                  </div>
-
-                  <div className="flex gap-2">
-                    <button
-                      onClick={handleNewCampaign}
-                      className="flex items-center gap-2 px-3 py-1.5 bg-blue-600 text-white rounded-md hover:bg-blue-700 text-sm"
-                    >
-                      <FaPlus className="w-4 h-4" />
-                      Yeni Değerlendirme
-                    </button>
-                    <button
-                      onClick={handleStartEvaluation}
-                      className="flex items-center gap-2 px-3 py-1.5 bg-green-600 text-white rounded-md hover:bg-green-700 text-sm"
-                    >
-                      <FaPoll className="w-4 h-4" />
-                      Değerlendirme Yap
-                    </button>
-                  </div>
-                </div>
-
-                {/* Campaigns Table */}
-                <DataTable data={filteredCampaigns} columns={campaignColumns} />
-              </div>
-            )}
-
-            {activeTab === 'results' && (
-              <div className="space-y-3">
-                {/* Results Filters */}
-                <div className="flex flex-col sm:flex-row gap-3 justify-between">
-                  <div className="flex flex-col sm:flex-row gap-3">
-                    <select
-                      value={selectedResultsCampaign}
-                      onChange={(e) => setSelectedResultsCampaign(e.target.value)}
-                      className="border border-gray-300 rounded-md px-2.5 py-1 text-sm"
-                    >
-                      <option value="all">Tüm Değerlendirmeler</option>
-                      {mockEvaluation360.map((campaign) => (
-                        <option key={campaign.id} value={campaign.id}>
-                          {campaign.name}
-                        </option>
-                      ))}
-                    </select>
-
-                    <select
-                      value={selectedResultsStatus}
-                      onChange={(e) => setSelectedResultsStatus(e.target.value)}
-                      className="border border-gray-300 rounded-md px-2.5 py-1 text-sm"
-                    >
-                      <option value="all">Tüm Durumlar</option>
-                      {Object.values(ParticipantStatusEnum).map((status) => (
-                        <option key={status} value={status}>
-                          {getParticipantStatusText(status)}
-                        </option>
-                      ))}
-                    </select>
-
-                    <select
-                      value={selectedResultsDepartment}
-                      onChange={(e) => setSelectedResultsDepartment(e.target.value)}
-                      className="border border-gray-300 rounded-md px-2.5 py-1 text-sm"
-                    >
-                      <option value="all">Tüm Departmanlar</option>
-                      {mockDepartments.map((department) => (
-                        <option key={department.id} value={department.id}>
-                          {department.name}
-                        </option>
-                      ))}
-                    </select>
-
-                    <select
-                      value={selectedResultsEmployee}
-                      onChange={(e) => setSelectedResultsEmployee(e.target.value)}
-                      className="border border-gray-300 rounded-md px-2.5 py-1 text-sm"
-                    >
-                      <option value="all">Tüm Personel</option>
-                      {mockEmployees.map((employee) => (
-                        <option key={employee.id} value={employee.id}>
-                          {employee.firstName} {employee.lastName}
-                        </option>
-                      ))}
-                    </select>
-                  </div>
-                </div>
-
-                {/* Results Summary */}
-
-                <div className="bg-white rounded-lg border overflow-hidden">
-                  <div className="overflow-x-auto">
-                    <table className="min-w-full divide-y divide-gray-200">
-                      <thead className="bg-gray-50">
-                        <tr>
-                          <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                            Değerlendirme Adı
-                          </th>
-                          <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                            Değerlendirilecek Kişi
-                          </th>
-                          <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                            Değerlendiren
-                          </th>
-                          <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                            Toplam İlerleme
-                          </th>
-                          <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                            Değerlendirme Durumu
-                          </th>
-                          <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                            Toplam Puan
-                          </th>
-                          <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                            Puan Yüzdesi
-                          </th>
-                          <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                            İşlemler
-                          </th>
-                        </tr>
-                      </thead>
-                      <tbody className="bg-white divide-y divide-gray-200">
-                        {getAllEvaluationParticipants().map((result) => (
-                          <tr
-                            key={`${result.resultId}-${result.evaluatedEmployeeId}-${result.evaluatorId}`}
-                            className="hover:bg-gray-50 text-xs"
-                          >
-                            <td className="px-3 py-2 whitespace-nowrap text-gray-500">
-                              <div className="flex flex-col">
-                                <span className="font-medium text-gray-900">
-                                  {result.campaignName}
-                                </span>
-                                <span className="text-xs text-gray-500">
-                                  {result.completedDate
-                                    ? new Date(result.completedDate).toLocaleDateString('tr-TR')
-                                    : '-'}
-                                </span>
-                              </div>
-                            </td>
-                            <td className="px-3 py-2 whitespace-nowrap text-gray-500">
-                              {result.evaluatedEmployeeName}
-                            </td>
-                            <td className="px-3 py-2 whitespace-nowrap text-gray-500">
-                              <div className="flex flex-col">
-                                <span className="font-medium text-gray-900">
-                                  {result.evaluatorName}
-                                </span>
-                                <span className="text-xs text-gray-500">
-                                  {getAssessorTypeLabel(result.evaluatorType)}
-                                </span>
-                              </div>
-                            </td>
-                            <td className="px-3 py-2 whitespace-nowrap text-sm">
-                              <div className="flex items-center">
-                                <div className="w-16 bg-gray-200 rounded-full h-2 mr-2">
-                                  <div
-                                    className="bg-blue-600 h-2 rounded-full"
-                                    style={{
-                                      width: `${
-                                        result.status === ParticipantStatusEnum.Completed ? 100 : 50
-                                      }%`,
-                                    }}
-                                  ></div>
-                                </div>
-                                <span className="text-sm text-gray-600">
-                                  {result.status === ParticipantStatusEnum.Completed ? 100 : 50}%
-                                </span>
-                              </div>
-                            </td>
-                            <td className="px-3 py-2 whitespace-nowrap text-sm text-gray-900">
-                              <span
-                                className={`inline-block px-2 py-1 text-xs rounded-full ${getParticipantStatusColor(
-                                  result.status,
-                                )}`}
-                              >
-                                {getParticipantStatusText(result.status)}
-                              </span>
-                            </td>
-                            <td className="px-3 py-2 whitespace-nowrap text-sm text-gray-900">
-                              {result.overallScore}/100
-                            </td>
-                            <td className="px-3 py-2 whitespace-nowrap text-sm text-gray-900">
-                              %{result.scorePercentage}
-                            </td>
-                            <td className="px-3 py-2 whitespace-nowrap text-sm font-medium">
-                              <div className="flex gap-2">
-                                <button
-                                  onClick={() => handleViewEvaluationDetail(result)}
-                                  className="text-blue-600 hover:text-blue-900"
-                                  title="Değerlendirme Detayını Görüntüle"
-                                >
-                                  <FaEye className="w-4 h-4" />
-                                </button>
-                                <button
-                                  onClick={() => handleEditEvaluationDetail(result)}
-                                  className="text-green-600 hover:text-green-900"
-                                  title="Değerlendirme Detayını Düzenle"
-                                >
-                                  <FaEdit className="w-4 h-4" />
-                                </button>
-                              </div>
-                            </td>
-                          </tr>
-                        ))}
-                      </tbody>
-                    </table>
-                  </div>
-                </div>
-              </div>
-            )}
-          </div>
-        </div>
-      </div>
-
-      {/* Campaign Modal */}
-      {showCampaignModal && (
-        <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-2">
-          <div className="bg-white rounded-lg w-full max-w-lg max-h-[90vh] overflow-y-auto">
-            <div className="flex justify-between items-center p-2.5 border-b">
-              <h2 className="text-base font-semibold">
-                {selectedCampaign ? 'Değerlendirme Düzenle' : 'Yeni Değerlendirme'}
-              </h2>
-              <button
-                onClick={handleCloseModal}
-                className="p-1.5 text-gray-400 hover:text-gray-600"
-              >
-                <FaTimes className="w-4 h-4" />
-              </button>
-            </div>
-            <div className="p-3 space-y-2.5">
-              <div>
-                <label className="block text-sm font-medium text-gray-700 mb-1">
-                  Değerlendirme Adı
-                </label>
-                <input
-                  type="text"
-                  value={campaignFormData.name}
-                  onChange={(e) =>
-                    setCampaignFormData({
-                      ...campaignFormData,
-                      name: e.target.value,
-                    })
-                  }
-                  className="w-full border border-gray-300 rounded-md px-2 py-1 text-sm"
-                />
-              </div>
-
-              <div>
-                <label className="block text-sm font-medium text-gray-700 mb-1">Açıklama</label>
-                <textarea
-                  value={campaignFormData.description}
-                  onChange={(e) =>
-                    setCampaignFormData({
-                      ...campaignFormData,
-                      description: e.target.value,
-                    })
-                  }
-                  rows={1}
-                  className="w-full border border-gray-300 rounded-md px-2 py-1 text-sm"
-                />
-              </div>
-
-              <div>
-                <label className="block text-sm font-medium text-gray-700 mb-1">
-                  Değerlendirme Şablonu
-                </label>
-                <select
-                  value={campaignFormData.templateId}
-                  onChange={(e) =>
-                    setCampaignFormData({
-                      ...campaignFormData,
-                      templateId: e.target.value,
-                    })
-                  }
-                  className="w-full border border-gray-300 rounded-md px-2 py-1 text-sm"
-                >
-                  <option value="">Şablon Seçin</option>
-                  {mockEvaluation360Templates.map((template) => (
-                    <option key={template.id} value={template.id}>
-                      {template.name}
-                    </option>
-                  ))}
-                </select>
-              </div>
-
-              <div>
-                <label className="block text-sm font-medium text-gray-700 mb-1">Departman</label>
-                <select
-                  value={campaignFormData.departmentId}
-                  onChange={(e) => handleDepartmentChange(e.target.value)}
-                  className="w-full border border-gray-300 rounded-md px-2 py-1 text-sm"
-                >
-                  <option value="">Departman Seçin</option>
-                  {mockDepartments.map((department) => (
-                    <option key={department.id} value={department.id}>
-                      {department.name}
-                    </option>
-                  ))}
-                </select>
-              </div>
-
-              {campaignFormData.departmentId && (
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    Hedef Personel
-                  </label>
-                  <div className="border border-gray-300 rounded-md p-1.5 max-h-28 overflow-y-auto">
-                    {filteredEmployeesByDepartment.map((employee) => (
-                      <label key={employee.id} className="flex items-center mb-2">
-                        <input
-                          type="checkbox"
-                          checked={campaignFormData.targetEmployees.includes(employee.id)}
-                          onChange={(e) => {
-                            if (e.target.checked) {
-                              setCampaignFormData({
-                                ...campaignFormData,
-                                targetEmployees: [...campaignFormData.targetEmployees, employee.id],
-                              })
-                            } else {
-                              setCampaignFormData({
-                                ...campaignFormData,
-                                targetEmployees: campaignFormData.targetEmployees.filter(
-                                  (id) => id !== employee.id,
-                                ),
-                              })
-                            }
-                          }}
-                          className="mr-2"
-                        />
-                        {employee.firstName} {employee.lastName} -{' '}
-                        {employee.jobPosition?.name || 'Pozisyon Belirtilmemiş'}
-                      </label>
-                    ))}
-                  </div>
-                </div>
-              )}
-
-              <div className="grid grid-cols-2 gap-2.5">
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    Başlangıç Tarihi
-                  </label>
-                  <input
-                    type="date"
-                    value={campaignFormData.startDate}
-                    onChange={(e) =>
-                      setCampaignFormData({
-                        ...campaignFormData,
-                        startDate: e.target.value,
-                      })
-                    }
-                    className="w-full border border-gray-300 rounded-md px-2 py-1 text-sm"
-                  />
-                </div>
-
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    Bitiş Tarihi
-                  </label>
-                  <input
-                    type="date"
-                    value={campaignFormData.endDate}
-                    onChange={(e) =>
-                      setCampaignFormData({
-                        ...campaignFormData,
-                        endDate: e.target.value,
-                      })
-                    }
-                    className="w-full border border-gray-300 rounded-md px-2 py-1 text-sm"
-                  />
-                </div>
-              </div>
-            </div>
-            <div className="flex justify-end gap-2 p-2.5 border-t">
-              <button
-                onClick={handleCloseModal}
-                className="px-2.5 py-1 text-sm text-gray-700 bg-gray-100 rounded-md hover:bg-gray-200"
-              >
-                İptal
-              </button>
-              <button
-                onClick={handleSaveCampaign}
-                className="flex items-center gap-2 px-2.5 py-1 text-sm bg-blue-600 text-white rounded-md hover:bg-blue-700"
-              >
-                <FaSave className="w-4 h-4" />
-                {selectedCampaign ? 'Güncelle' : 'Kaydet'}
-              </button>
-            </div>
-          </div>
-        </div>
-      )}
-
-      {/* View Modal */}
-      {showViewModal && selectedCampaign && (
-        <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-2">
-          <div className="bg-white rounded-lg w-full max-w-2xl max-h-[90vh] overflow-y-auto">
-            <div className="flex justify-between items-center p-2.5 border-b">
-              <h2 className="text-base font-semibold">{selectedCampaign.name}</h2>
-              <button
-                onClick={handleCloseModal}
-                className="p-1.5 text-gray-400 hover:text-gray-600"
-              >
-                <FaTimes className="w-4 h-4" />
-              </button>
-            </div>
-            <div className="p-3 space-y-3">
-              <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
-                <div>
-                  <h3 className="text-sm font-medium text-gray-900 mb-2">
-                    Değerlendirme Bilgileri
-                  </h3>
-                  <div className="space-y-2">
-                    <div>
-                      <span className="text-sm font-medium text-gray-600">Adı:</span>
-                      <p className="text-sm text-gray-900">{selectedCampaign.name}</p>
-                    </div>
-                    <div>
-                      <span className="text-sm font-medium text-gray-600">Açıklama:</span>
-                      <p className="text-sm text-gray-900">{selectedCampaign.description}</p>
-                    </div>
-                    <div>
-                      <span className="text-sm font-medium text-gray-600">Durum:</span>
-                      <span
-                        className={`ml-2 px-3 py-1 text-xs font-medium rounded-full ${getCampaignStatusColor(
-                          selectedCampaign.status,
-                        )}`}
-                      >
-                        {getCampaignStatusText(selectedCampaign.status)}
-                      </span>
-                    </div>
-                    <div>
-                      <span className="text-sm font-medium text-gray-600">Tarih Aralığı:</span>
-                      <p className="text-sm text-gray-900">
-                        {selectedCampaign.startDate.toLocaleDateString('tr-TR')} -{' '}
-                        {selectedCampaign.endDate.toLocaleDateString('tr-TR')}
-                      </p>
-                    </div>
-                  </div>
-                </div>
-
-                <div>
-                  <h3 className="text-sm font-medium text-gray-900 mb-2">
-                    Katılımcı İstatistikleri
-                  </h3>
-                  <div className="space-y-2">
-                    {(() => {
-                      const participants = getCampaignParticipants(selectedCampaign.id)
-                      const completed = participants.filter(
-                        (p) => p.status === ParticipantStatusEnum.Completed,
-                      )
-                      const started = participants.filter(
-                        (p) => p.status === ParticipantStatusEnum.Started,
-                      )
-                      const invited = participants.filter(
-                        (p) => p.status === ParticipantStatusEnum.Invited,
-                      )
-
-                      return (
-                        <>
-                          <div className="flex justify-between">
-                            <span className="text-sm text-gray-600">Toplam:</span>
-                            <span className="text-sm font-medium text-gray-900">
-                              {participants.length}
-                            </span>
-                          </div>
-                          <div className="flex justify-between">
-                            <span className="text-sm text-gray-600">Tamamlanan:</span>
-                            <span className="text-sm font-medium text-green-600">
-                              {completed.length}
-                            </span>
-                          </div>
-                          <div className="flex justify-between">
-                            <span className="text-sm text-gray-600">Devam Eden:</span>
-                            <span className="text-sm font-medium text-blue-600">
-                              {started.length}
-                            </span>
-                          </div>
-                          <div className="flex justify-between">
-                            <span className="text-sm text-gray-600">Bekleyen:</span>
-                            <span className="text-sm font-medium text-yellow-600">
-                              {invited.length}
-                            </span>
-                          </div>
-                        </>
-                      )
-                    })()}
-                  </div>
-                </div>
-              </div>
-
-              <div>
-                <h3 className="text-sm font-medium text-gray-900 mb-2">Katılımcı Detayları</h3>
-                <div className="overflow-x-auto">
-                  <table className="min-w-full divide-y divide-gray-200">
-                    <thead className="bg-gray-50">
-                      <tr>
-                        <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                          Hedef Çalışan
-                        </th>
-                        <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                          Değerlendiren
-                        </th>
-                        <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                          Tip
-                        </th>
-                        <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                          Durum
-                        </th>
-                        <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                          Tarih
-                        </th>
-                      </tr>
-                    </thead>
-                    <tbody className="bg-white divide-y divide-gray-200">
-                      {getCampaignParticipants(selectedCampaign.id).map((participant) => {
-                        const targetEmployee = mockEmployees.find(
-                          (emp) => emp.id === participant.evaluatedEmployeeId,
-                        )
-                        const assessorEmployee = mockEmployees.find(
-                          (emp) => emp.id === participant.evaluatorId,
-                        )
-
-                        return (
-                          <tr key={participant.id}>
-                            <td className="px-3 py-2 whitespace-nowrap text-sm text-gray-900">
-                              {targetEmployee
-                                ? `${targetEmployee.firstName} ${targetEmployee.lastName}`
-                                : 'Bilinmiyor'}
-                            </td>
-                            <td className="px-3 py-2 whitespace-nowrap text-sm text-gray-900">
-                              {assessorEmployee
-                                ? `${assessorEmployee.firstName} ${assessorEmployee.lastName}`
-                                : 'Bilinmiyor'}
-                            </td>
-                            <td className="px-3 py-2 whitespace-nowrap text-sm text-gray-500">
-                              {getAssessorTypeText(participant.evaluatorType)}
-                            </td>
-                            <td className="px-3 py-2 whitespace-nowrap">
-                              <span
-                                className={`px-2 py-1 text-xs font-medium rounded-full ${getParticipantStatusColor(
-                                  participant.status,
-                                )}`}
-                              >
-                                {getParticipantStatusText(participant.status)}
-                              </span>
-                            </td>
-                            <td className="px-3 py-2 whitespace-nowrap text-sm text-gray-500">
-                              {participant.completedDate
-                                ? participant.completedDate.toLocaleDateString('tr-TR')
-                                : participant.startedDate
-                                  ? `Başladı: ${participant.startedDate.toLocaleDateString(
-                                      'tr-TR',
-                                    )}`
-                                  : `Davet: ${participant.invitedDate.toLocaleDateString('tr-TR')}`}
-                            </td>
-                          </tr>
-                        )
-                      })}
-                    </tbody>
-                  </table>
-                </div>
-              </div>
-            </div>
-            <div className="flex justify-end gap-2 p-2.5 border-t">
-              <button
-                onClick={handleCloseModal}
-                className="px-2.5 py-1 text-sm text-gray-700 bg-gray-100 rounded-md hover:bg-gray-200"
-              >
-                Kapat
-              </button>
-              <button
-                onClick={() => {
-                  handleCloseModal()
-                  handleEditCampaign(selectedCampaign)
-                }}
-                className="flex items-center gap-2 px-2.5 py-1 text-sm bg-blue-600 text-white rounded-md hover:bg-blue-700"
-              >
-                <FaEdit className="w-4 h-4" />
-                Düzenle
-              </button>
-            </div>
-          </div>
-        </div>
-      )}
-
-      {/* Evaluation Modal */}
-      {showEvaluationModal && (
-        <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-2">
-          <div className="bg-white rounded-lg w-full max-w-lg max-h-[90vh] overflow-y-auto">
-            <div className="flex justify-between items-center p-2.5 border-b">
-              <h2 className="text-base font-semibold">
-                {!currentCampaignForEvaluation
-                  ? 'Değerlendirme Yap'
-                  : currentCampaignForEvaluation.name}
-              </h2>
-              <button
-                onClick={handleCloseModal}
-                className="p-1.5 text-gray-400 hover:text-gray-600"
-              >
-                <FaTimes className="w-4 h-4" />
-              </button>
-            </div>
-            <div className="p-3 space-y-2.5">
-              {!currentCampaignForEvaluation ? (
-                /* Adım 0: Değerlendirme seçimi */
-                <div>
-                  <h3 className="text-sm font-medium text-gray-900 mb-2">Değerlendirme Seçin</h3>
-                  <div className="space-y-2">
-                    {mockEvaluation360
-                      .filter((campaign) => campaign.status === CampaignStatusEnum.Active)
-                      .map((campaign) => (
-                        <div
-                          key={campaign.id}
-                          className="border rounded-lg p-2.5 hover:bg-gray-50 cursor-pointer"
-                          onClick={() => setCurrentCampaignForEvaluation(campaign)}
-                        >
-                          <div className="flex justify-between items-center">
-                            <div>
-                              <h4 className="font-medium text-gray-900">{campaign.name}</h4>
-                              <p className="text-gray-600">{campaign.description}</p>
-                              <div className="flex items-center gap-2 mt-2">
-                                <span
-                                  className={`inline-block px-2 py-1 text-xs rounded-full ${getCampaignStatusColor(
-                                    campaign.status,
-                                  )}`}
-                                >
-                                  {getCampaignStatusText(campaign.status)}
-                                </span>
-                                <span className="text-xs text-gray-500">
-                                  {campaign.startDate.toLocaleDateString()} -{' '}
-                                  {campaign.endDate.toLocaleDateString()}
-                                </span>
-                              </div>
-                            </div>
-                            <FaPlay className="w-4 h-4 text-gray-400" />
-                          </div>
-                        </div>
-                      ))}
-                  </div>
-                  {mockEvaluation360.filter(
-                    (campaign) => campaign.status === CampaignStatusEnum.Active,
-                  ).length === 0 && (
-                    <div className="text-center py-8 text-gray-500">
-                      <FaPoll className="w-12 h-12 mx-auto mb-3 text-gray-300" />
-                      <p>Aktif değerlendirme bulunmuyor</p>
-                    </div>
-                  )}
-                </div>
-              ) : !evaluationTarget ? (
-                /* Adım 1: Değerlendirilecek kişi seçimi */
-                <div>
-                  <div className="mb-4">
-                    <button
-                      onClick={() => setCurrentCampaignForEvaluation(null)}
-                      className="text-blue-600 hover:text-blue-800 text-sm"
-                    >
-                      ← Değerlendirme Seçimine Dön
-                    </button>
-                  </div>
-                  <h3 className="text-sm font-medium text-gray-900 mb-2">
-                    1. Adım: Değerlendirilecek Kişiyi Seçin
-                  </h3>
-                  <div className="bg-blue-50 p-2.5 rounded-lg mb-3">
-                    <p className="text-sm text-blue-800">
-                      <strong>Seçili Değerlendirme:</strong> {currentCampaignForEvaluation.name}
-                    </p>
-                  </div>
-                  <div className="space-y-3">
-                    {mockEmployees
-                      .filter((emp) =>
-                        currentCampaignForEvaluation.targetEmployees.includes(emp.id),
-                      )
-                      .map((employee) => (
-                        <div
-                          key={employee.id}
-                          className="border rounded-lg p-2.5 hover:bg-gray-50 cursor-pointer"
-                          onClick={() => setEvaluationTarget(employee.id)}
-                        >
-                          <div className="flex justify-between items-center">
-                            <div>
-                              <h4 className="font-medium text-gray-900">{employee.fullName}</h4>
-                              <p className="text-gray-600">{employee.jobPosition?.name}</p>
-                              <p className="text-gray-600">
-                                {mockDepartments.find((d) => d.id === employee.departmentId)?.name}
-                              </p>
-                            </div>
-                            <FaUsers className="w-4 h-4 text-gray-400" />
-                          </div>
-                        </div>
-                      ))}
-                  </div>
-                  {mockEmployees.filter((emp) =>
-                    currentCampaignForEvaluation.targetEmployees.includes(emp.id),
-                  ).length === 0 && (
-                    <div className="text-center py-8 text-gray-500">
-                      <FaUsers className="w-12 h-12 mx-auto mb-3 text-gray-300" />
-                      <p>Bu değerlendirmede hedef çalışan bulunmuyor</p>
-                    </div>
-                  )}
-                </div>
-              ) : !selectedAssessorType ? (
-                /* Adım 2a: Değerlendirici Tipi Seçimi */
-                <div>
-                  <div className="mb-4">
-                    <button
-                      onClick={() => setEvaluationTarget('')}
-                      className="text-blue-600 hover:text-blue-800 text-sm"
-                    >
-                      ← Geri Dön
-                    </button>
-                  </div>
-                  <h3 className="text-sm font-medium text-gray-900 mb-2">
-                    2. Adım: Değerlendirici Tipi Seçin
-                  </h3>
-                  <div className="bg-blue-50 p-2.5 rounded-lg mb-3">
-                    <p className="text-sm text-blue-800">
-                      <strong>Değerlendirilecek:</strong>{' '}
-                      {mockEmployees.find((e) => e.id === evaluationTarget)?.fullName}
-                    </p>
-                  </div>
-
-                  {/* Değerlendirici tipi seçimi */}
-                  <div className="space-y-2">
-                    {getAllowedAssessorTypes().map((assessorType) => (
-                      <div
-                        key={assessorType}
-                        className="border rounded-lg p-2.5 hover:bg-gray-50 cursor-pointer"
-                        onClick={() => {
-                          setSelectedAssessorType(assessorType)
-                          setEvaluatorSearchTerm('')
-                        }}
-                      >
-                        <div className="flex justify-between items-center">
-                          <div>
-                            <h4 className="font-medium text-gray-900">
-                              {getAssessorTypeText(assessorType)}
-                            </h4>
-                            <p className="text-gray-600">
-                              {getAssessorTypeDescription(assessorType)}
-                            </p>
-                            {getEvaluatorsByType(evaluationTarget, assessorType).length > 0 && (
-                              <span className="inline-block mt-1 px-2 py-1 text-xs rounded-full bg-blue-100 text-blue-800">
-                                {getEvaluatorsByType(evaluationTarget, assessorType).length} seçenek
-                                mevcut
-                              </span>
-                            )}
-                          </div>
-                          <FaUsers className="w-4 h-4 text-gray-400" />
-                        </div>
-                      </div>
-                    ))}
-                  </div>
-                </div>
-              ) : !evaluationEvaluator ? (
-                /* Adım 2b: Belirli tip değerlendirici seçimi */
-                <div>
-                  <div className="mb-4">
-                    <button
-                      onClick={() => {
-                        setSelectedAssessorType(null)
-                        setEvaluationEvaluator('')
-                        setSelectedCustomerId('')
-                        setExternalEvaluatorName('')
-                        setExternalEvaluatorEmail('')
-                        setEvaluatorSearchTerm('')
-                      }}
-                      className="text-blue-600 hover:text-blue-800 text-sm"
-                    >
-                      ← Geri Dön
-                    </button>
-                  </div>
-                  <h3 className="text-sm font-medium text-gray-900 mb-2">
-                    2. Adım: {getAssessorTypeText(selectedAssessorType)} Seçin
-                  </h3>
-                  <div className="bg-blue-50 p-2.5 rounded-lg mb-3">
-                    <p className="text-sm text-blue-800">
-                      <strong>Değerlendirilecek:</strong>{' '}
-                      {mockEmployees.find((e) => e.id === evaluationTarget)?.fullName}
-                      <br />
-                      <strong>Değerlendirici Tipi:</strong>{' '}
-                      {getAssessorTypeText(selectedAssessorType)}
-                    </p>
-                  </div>
-
-                  {selectedAssessorType === AssessorTypeEnum.External ? (
-                    /* Dış değerlendirici için form */
-                    <div className="space-y-3">
-                      <div>
-                        <label className="block text-sm font-medium text-gray-700 mb-1">
-                          Değerlendirici Adı *
-                        </label>
-                        <input
-                          type="text"
-                          value={externalEvaluatorName}
-                          onChange={(e) => setExternalEvaluatorName(e.target.value)}
-                          className="w-full border border-gray-300 rounded-md px-2.5 py-1.5 text-sm"
-                          placeholder="Değerlendirici adını girin"
-                        />
-                      </div>
-                      <div>
-                        <label className="block text-sm font-medium text-gray-700 mb-1">
-                          E-posta Adresi *
-                        </label>
-                        <input
-                          type="email"
-                          value={externalEvaluatorEmail}
-                          onChange={(e) => setExternalEvaluatorEmail(e.target.value)}
-                          className="w-full border border-gray-300 rounded-md px-2.5 py-1.5 text-sm"
-                          placeholder="E-posta adresini girin"
-                        />
-                      </div>
-                      {externalEvaluatorName && externalEvaluatorEmail && (
-                        <button
-                          onClick={() => setEvaluationEvaluator('external')}
-                          className="w-full bg-green-600 text-white py-2 px-4 rounded-md hover:bg-green-700 text-sm"
-                        >
-                          Dış Değerlendiriciyi Seç
-                        </button>
-                      )}
-                    </div>
-                  ) : selectedAssessorType === AssessorTypeEnum.Customer ? (
-                    /* Müşteri seçimi */
-                    <div className="space-y-2">
-                      {/* Arama kutusu */}
-                      <div>
-                        <input
-                          type="text"
-                          value={evaluatorSearchTerm}
-                          onChange={(e) => setEvaluatorSearchTerm(e.target.value)}
-                          className="w-full border border-gray-300 rounded-md px-2.5 py-1.5 text-sm"
-                          placeholder="Müşteri adında ara..."
-                        />
-                      </div>
-                      {getEvaluatorsByType(evaluationTarget, selectedAssessorType)
-                        .filter((evaluator) =>
-                          evaluator.name.toLowerCase().includes(evaluatorSearchTerm.toLowerCase()),
-                        )
-                        .map((evaluator) => (
-                          <div
-                            key={evaluator.id}
-                            className="border rounded-lg p-2.5 hover:bg-gray-50 cursor-pointer"
-                            onClick={() => {
-                              setSelectedCustomerId(evaluator.id)
-                              setEvaluationEvaluator(evaluator.id)
-                            }}
-                          >
-                            <div className="flex justify-between items-center">
-                              <div>
-                                <h4 className="font-medium text-gray-900">{evaluator.name}</h4>
-                                <p className="text-gray-600">{evaluator.title}</p>
-                                <span className="inline-block mt-1 px-2 py-1 text-xs rounded-full bg-purple-100 text-purple-800">
-                                  {evaluator.department}
-                                </span>
-                              </div>
-                              <FaUsers className="w-4 h-4 text-gray-400" />
-                            </div>
-                          </div>
-                        ))}
-                    </div>
-                  ) : (
-                    /* Diğer tipler için çalışan seçimi */
-                    <div className="space-y-2">
-                      {/* Arama kutusu */}
-                      <div>
-                        <input
-                          type="text"
-                          value={evaluatorSearchTerm}
-                          onChange={(e) => setEvaluatorSearchTerm(e.target.value)}
-                          className="w-full border border-gray-300 rounded-md px-2.5 py-1.5 text-sm"
-                          placeholder="Çalışan adında ara..."
-                        />
-                      </div>
-                      {getEvaluatorsByType(evaluationTarget, selectedAssessorType)
-                        .filter((evaluator) =>
-                          evaluator.name.toLowerCase().includes(evaluatorSearchTerm.toLowerCase()),
-                        )
-                        .map((evaluator) => (
-                          <div
-                            key={evaluator.id}
-                            className="border rounded-lg p-2.5 hover:bg-gray-50 cursor-pointer"
-                            onClick={() => setEvaluationEvaluator(evaluator.id)}
-                          >
-                            <div className="flex justify-between items-center">
-                              <div>
-                                <h4 className="font-medium text-gray-900">{evaluator.name}</h4>
-                                <p className="text-gray-600">{evaluator.title}</p>
-                                <span className="inline-block mt-1 px-2 py-1 text-xs rounded-full bg-purple-100 text-purple-800">
-                                  {evaluator.department}
-                                </span>
-                              </div>
-                              <FaUsers className="w-4 h-4 text-gray-400" />
-                            </div>
-                          </div>
-                        ))}
-                      {getEvaluatorsByType(evaluationTarget, selectedAssessorType).length === 0 && (
-                        <div className="text-center py-8 text-gray-500">
-                          <FaUsers className="w-12 h-12 mx-auto mb-3 text-gray-300" />
-                          <p>Bu kategoride değerlendirici bulunmuyor</p>
-                        </div>
-                      )}
-                    </div>
-                  )}
-                </div>
-              ) : (
-                /* Adım 3: Değerlendirme formu */
-                <div>
-                  <div className="mb-4">
-                    <button
-                      onClick={() => {
-                        setSelectedAssessorType(null)
-                        setEvaluationEvaluator('')
-                        setSelectedCustomerId('')
-                        setExternalEvaluatorName('')
-                        setExternalEvaluatorEmail('')
-                        setEvaluatorSearchTerm('')
-                      }}
-                      className="text-blue-600 hover:text-blue-800 text-sm"
-                    >
-                      ← Geri Dön
-                    </button>
-                  </div>
-                  <h3 className="text-sm font-medium text-gray-900 mb-2">
-                    3. Adım: Değerlendirme Formu
-                  </h3>
-                  <div className="bg-green-50 p-2.5 rounded-lg mb-3">
-                    <p className="text-sm text-green-800">
-                      <strong>Değerlendirilen:</strong>{' '}
-                      {mockEmployees.find((e) => e.id === evaluationTarget)?.fullName}
-                      <br />
-                      <strong>Değerlendiren:</strong> {getEvaluatorInfo()}
-                    </p>
-                  </div>
-
-                  {/* Burada şablonun sorularını göstereceğiz */}
-                  <div className="space-y-3">
-                    {currentCampaignForEvaluation &&
-                      mockEvaluation360Templates
-                        .find((t) => t.id === currentCampaignForEvaluation.templateId)
-                        ?.questionGroups.map((group) => (
-                          <div key={group.id} className="border rounded-lg p-2.5">
-                            <h4 className="font-medium text-gray-900 mb-2">{group.groupName}</h4>
-                            <p className="text-sm text-gray-600 mb-3">{group.description}</p>
-                            <div className="space-y-3">
-                              {group.questions.map((question, qIndex) => (
-                                <div key={question.id} className="bg-gray-50 p-2.5 rounded">
-                                  <p className="font-medium text-gray-800 mb-3">
-                                    {qIndex + 1}. {question.questionText}
-                                    {question.isRequired && (
-                                      <span className="text-red-500 ml-1">*</span>
-                                    )}
-                                  </p>
-
-                                  {/* Soru tipine göre input alanları */}
-                                  {question.questionType === QuestionTypeEnum.Rating && (
-                                    <div className="space-y-2">
-                                      <div className="flex justify-around items-center">
-                                        {Array.from(
-                                          {
-                                            length:
-                                              (question.maxRating || 5) -
-                                              (question.minRating || 1) +
-                                              1,
-                                          },
-                                          (_, i) => {
-                                            const value = (question.minRating || 1) + i
-                                            return (
-                                              <label
-                                                key={value}
-                                                className="flex flex-col items-center cursor-pointer"
-                                              >
-                                                <input
-                                                  type="radio"
-                                                  name={`question-${question.id}`}
-                                                  value={value}
-                                                  checked={
-                                                    evaluationResponses[question.id] === value
-                                                  }
-                                                  onChange={(e) =>
-                                                    handleResponseChange(
-                                                      question.id,
-                                                      Number(e.target.value),
-                                                    )
-                                                  }
-                                                  className="mb-1"
-                                                />
-                                                <span className="text-xs text-gray-600">
-                                                  {question.ratingLabels?.[i] || value}
-                                                </span>
-                                              </label>
-                                            )
-                                          },
-                                        )}
-                                      </div>
-                                    </div>
-                                  )}
-
-                                  {question.questionType === QuestionTypeEnum.Text && (
-                                    <textarea
-                                      className="w-full border border-gray-300 rounded-md px-2.5 py-1.5 text-sm"
-                                      rows={3}
-                                      placeholder="Yorumunuzu yazın..."
-                                      value={evaluationResponses[question.id] || ''}
-                                      onChange={(e) =>
-                                        handleResponseChange(question.id, e.target.value)
-                                      }
-                                    />
-                                  )}
-
-                                  {question.questionType === QuestionTypeEnum.YesNo && (
-                                    <div className="flex gap-4">
-                                      <label className="flex items-center cursor-pointer">
-                                        <input
-                                          type="radio"
-                                          name={`question-${question.id}`}
-                                          value="yes"
-                                          checked={evaluationResponses[question.id] === 'yes'}
-                                          onChange={(e) =>
-                                            handleResponseChange(question.id, e.target.value)
-                                          }
-                                          className="mr-2"
-                                        />
-                                        Evet
-                                      </label>
-                                      <label className="flex items-center cursor-pointer">
-                                        <input
-                                          type="radio"
-                                          name={`question-${question.id}`}
-                                          value="no"
-                                          checked={evaluationResponses[question.id] === 'no'}
-                                          onChange={(e) =>
-                                            handleResponseChange(question.id, e.target.value)
-                                          }
-                                          className="mr-2"
-                                        />
-                                        Hayır
-                                      </label>
-                                    </div>
-                                  )}
-
-                                  {question.questionType === QuestionTypeEnum.MultipleChoice && (
-                                    <div className="space-y-2">
-                                      {question.options?.map((option) => (
-                                        <label
-                                          key={option.id}
-                                          className="flex items-center cursor-pointer"
-                                        >
-                                          <input
-                                            type="radio"
-                                            name={`question-${question.id}`}
-                                            value={option.value}
-                                            checked={
-                                              evaluationResponses[question.id] === option.value
-                                            }
-                                            onChange={(e) =>
-                                              handleResponseChange(
-                                                question.id,
-                                                Number(e.target.value),
-                                              )
-                                            }
-                                            className="mr-2"
-                                          />
-                                          {option.optionText}
-                                        </label>
-                                      ))}
-                                    </div>
-                                  )}
-                                </div>
-                              ))}
-                            </div>
-                          </div>
-                        ))}
-                  </div>
-                </div>
-              )}
-            </div>
-            <div className="flex justify-end gap-2 p-2.5 border-t">
-              <button
-                onClick={handleCloseModal}
-                className="px-2.5 py-1 text-sm text-gray-700 bg-gray-100 rounded-md hover:bg-gray-200"
-              >
-                İptal
-              </button>
-              {evaluationTarget && evaluationEvaluator && (
-                <button
-                  onClick={handleSaveEvaluation}
-                  className="flex items-center gap-2 px-2.5 py-1 text-sm bg-green-600 text-white rounded-md hover:bg-green-700"
-                >
-                  <FaSave className="w-4 h-4" />
-                  Değerlendirmeyi Kaydet
-                </button>
-              )}
-            </div>
-          </div>
-        </div>
-      )}
-
-      {/* Result Detail Modal */}
-      {showResultDetailModal && selectedResult && (
-        <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-2">
-          <div className="bg-white rounded-lg w-full max-w-2xl max-h-[90vh] overflow-y-auto">
-            <div className="flex justify-between items-center p-2.5 border-b">
-              <h2 className="text-base font-semibold">Değerlendirme Detayı</h2>
-              <button
-                onClick={handleCloseModal}
-                className="p-1.5 text-gray-400 hover:text-gray-600"
-              >
-                <FaTimes className="w-4 h-4" />
-              </button>
-            </div>
-            <div className="p-3 space-y-2.5">
-              {/* Genel Bilgiler */}
-              <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
-                <div className="bg-blue-50 p-4 rounded-lg">
-                  <h3 className="font-medium text-blue-800 mb-2 text-sm">
-                    Değerlendirme Bilgileri
-                  </h3>
-                  <div className="space-y-1.5">
-                    <div>
-                      <span className="text-sm text-blue-700 font-medium">Kampanya: </span>
-                      <span className="text-sm text-blue-800">{selectedResult.campaignName}</span>
-                    </div>
-                    <div>
-                      <span className="text-sm text-blue-700 font-medium">Değerlendirilen: </span>
-                      <span className="text-sm text-blue-800">
-                        {selectedResult.evaluatedEmployeeName}
-                      </span>
-                    </div>
-                    <div>
-                      <span className="text-sm text-blue-700 font-medium">Değerlendiren: </span>
-                      <span className="text-sm text-blue-800">{selectedResult.evaluatorName}</span>
-                    </div>
-                    <div>
-                      <span className="text-sm text-blue-700 font-medium">
-                        Değerlendiren Tipi:{' '}
-                      </span>
-                      <span className="text-sm text-blue-800">
-                        {getAssessorTypeText(selectedResult.evaluatorType)}
-                      </span>
-                    </div>
-                  </div>
-                </div>
-
-                <div className="bg-green-50 p-4 rounded-lg">
-                  <h3 className="font-medium text-green-800 mb-2 text-sm">Sonuç Bilgileri</h3>
-                  <div className="space-y-1.5">
-                    <div>
-                      <span className="text-sm text-green-700 font-medium">Durum: </span>
-                      <span
-                        className={`text-sm px-2 py-0.5 rounded-full ${getParticipantStatusColor(
-                          selectedResult.status,
-                        )}`}
-                      >
-                        {getParticipantStatusText(selectedResult.status)}
-                      </span>
-                    </div>
-                    <div>
-                      <span className="text-sm text-green-700 font-medium">Toplam Puan: </span>
-                      <span className="text-sm text-green-800 font-bold">
-                        {selectedResult.overallScore}/100
-                      </span>
-                    </div>
-                    <div>
-                      <span className="text-sm text-green-700 font-medium">Yüzde: </span>
-                      <span className="text-sm text-green-800 font-bold">
-                        %{selectedResult.scorePercentage}
-                      </span>
-                    </div>
-                    {selectedResult.completedDate && (
-                      <div>
-                        <span className="text-sm text-green-700 font-medium">
-                          Tamamlanma Tarihi:{' '}
-                        </span>
-                        <span className="text-sm text-green-800">
-                          {new Date(selectedResult.completedDate).toLocaleDateString('tr-TR')}
-                        </span>
-                      </div>
-                    )}
-                  </div>
-                </div>
-              </div>
-
-              {/* Detaylı Sonuçlar */}
-              <div className="border rounded-lg p-3">
-                <h3 className="font-medium text-gray-900 mb-2 text-sm">Detaylı Sonuçlar</h3>
-
-                {(() => {
-                  // Seçili sonucu mockEvaluation360Results'tan bul
-                  const evaluationResult = mockEvaluation360Results.find(
-                    (r) => r.id === selectedResult.resultId,
-                  )
-                  if (!evaluationResult) {
-                    return (
-                      <div className="text-center py-8 text-gray-500">
-                        <FaChartBar className="w-12 h-12 mx-auto mb-3 text-gray-300" />
-                        <p>Sonuç verisi bulunamadı</p>
-                      </div>
-                    )
-                  }
-
-                  return (
-                    <div className="space-y-2.5">
-                      {/* Soru Cevapları */}
-                      {(() => {
-                        const campaign = mockEvaluation360.find(
-                          (c) => c.id === selectedResult.campaignId,
-                        )
-                        const template = campaign
-                          ? mockEvaluation360Templates.find((t) => t.id === campaign.templateId)
-                          : null
-
-                        if (template) {
-                          return (
-                            <div>
-                              <h4 className="font-medium text-gray-800 mb-2 text-sm">
-                                📝 Soru Cevapları
-                              </h4>
-                              <div className="space-y-3">
-                                {template.questionGroups.map((group) => (
-                                  <div key={group.id} className="bg-gray-50 p-2.5 rounded-lg">
-                                    <div className="mb-3">
-                                      <h5 className="font-medium text-gray-800">
-                                        {group.groupName}
-                                      </h5>
-                                      <p className="text-gray-600">{group.description}</p>
-                                    </div>
-
-                                    <div className="space-y-2.5">
-                                      {group.questions.map((question, qIndex) => {
-                                        const response = evaluationResult.participants
-                                          .flatMap((p) => p.responses)
-                                          .find((r) => r.questionId === question.id)
-
-                                        if (!response) return null
-
-                                        return (
-                                          <div
-                                            key={question.id}
-                                            className="bg-white p-1.5 rounded border-l-4 border-blue-200"
-                                          >
-                                            <div className="mb-2">
-                                              <span className="text-sm font-medium text-gray-800">
-                                                S{qIndex + 1}: {question.questionText}
-                                              </span>
-                                            </div>
-
-                                            <div className="flex items-center justify-between">
-                                              <div className="flex items-center gap-3">
-                                                <span className="text-sm text-gray-600">
-                                                  Cevap:
-                                                </span>
-                                                <span className="px-2 py-1 bg-blue-100 text-blue-800 rounded text-sm font-medium">
-                                                  {(() => {
-                                                    if (
-                                                      question.questionType ===
-                                                      QuestionTypeEnum.Rating
-                                                    ) {
-                                                      const ratingIndex =
-                                                        Number(response.responseValue) -
-                                                        (question.minRating || 1)
-                                                      const label =
-                                                        question.ratingLabels?.[ratingIndex]
-                                                      return label
-                                                        ? `${response.responseValue} - ${label}`
-                                                        : response.responseValue
-                                                    } else if (
-                                                      question.questionType ===
-                                                      QuestionTypeEnum.YesNo
-                                                    ) {
-                                                      return response.responseValue === 'yes'
-                                                        ? 'Evet'
-                                                        : 'Hayır'
-                                                    } else if (
-                                                      question.questionType ===
-                                                      QuestionTypeEnum.MultipleChoice
-                                                    ) {
-                                                      const option = question.options?.find(
-                                                        (o) =>
-                                                          o.value ===
-                                                          Number(response.responseValue),
-                                                      )
-                                                      return option
-                                                        ? option.optionText
-                                                        : response.responseValue
-                                                    } else {
-                                                      return response.responseValue
-                                                    }
-                                                  })()}
-                                                </span>
-                                              </div>
-
-                                              <div className="flex items-center gap-2">
-                                                <span className="text-xs text-gray-500">Puan:</span>
-                                                <span className="px-2 py-1 bg-green-100 text-green-800 rounded text-sm font-bold">
-                                                  {response.score}
-                                                </span>
-                                              </div>
-                                            </div>
-
-                                            {response.responseText && (
-                                              <div className="mt-2 p-2 bg-gray-100 rounded">
-                                                <span className="text-xs text-gray-600">
-                                                  Detay:{' '}
-                                                </span>
-                                                <span className="text-sm text-gray-700">
-                                                  {response.responseText}
-                                                </span>
-                                              </div>
-                                            )}
-                                          </div>
-                                        )
-                                      })}
-                                    </div>
-                                  </div>
-                                ))}
-                              </div>
-                            </div>
-                          )
-                        }
-                        return null
-                      })()}
-
-                      {/* Grup Bazlı Puanlar */}
-                      <div>
-                        <h4 className="font-medium text-gray-800 mb-2 text-sm">
-                          📊 Grup Bazlı Puanlar
-                        </h4>
-                        <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
-                          {evaluationResult.groupScores.map((groupScore) => (
-                            <div key={groupScore.groupId} className="bg-gray-50 p-2.5 rounded-lg">
-                              <div className="flex justify-between items-center mb-2">
-                                <h5 className="font-medium text-gray-700">
-                                  {groupScore.groupName}
-                                </h5>
-                                <span className="text-lg font-bold text-blue-600">
-                                  {groupScore.score}/{groupScore.maxScore}
-                                </span>
-                              </div>
-                              <div className="w-full bg-gray-200 rounded-full h-2 mb-2">
-                                <div
-                                  className="bg-blue-600 h-2 rounded-full"
-                                  style={{ width: `${groupScore.percentage}%` }}
-                                ></div>
-                              </div>
-                              <div className="flex justify-between text-sm text-gray-600">
-                                <span>%{Math.round(groupScore.percentage)}</span>
-                                <span>{groupScore.responseCount} cevap</span>
-                              </div>
-                            </div>
-                          ))}
-                        </div>
-                      </div>
-
-                      {/* Değerlendirici Tipi Bazlı Puanlar */}
-                      <div>
-                        <h4 className="font-medium text-gray-800 mb-2 text-sm">
-                          👥 Değerlendirici Tipi Bazlı Puanlar
-                        </h4>
-                        <div className="grid grid-cols-1 md:grid-cols-3 gap-3">
-                          {evaluationResult.assessorTypeScores.map((assessorScore, index) => (
-                            <div key={index} className="bg-blue-50 p-2.5 rounded-lg text-center">
-                              <div className="text-sm text-blue-700 font-medium mb-1">
-                                {getAssessorTypeText(assessorScore.assessorType)}
-                              </div>
-                              <div className="text-2xl font-bold text-blue-800 mb-1">
-                                %{Math.round(assessorScore.percentage)}
-                              </div>
-                              <div className="text-xs text-blue-600">
-                                {assessorScore.averageScore}/{assessorScore.maxScore} puan
-                              </div>
-                              <div className="text-xs text-blue-500">
-                                {assessorScore.assessorCount} değerlendirici
-                              </div>
-                            </div>
-                          ))}
-                        </div>
-                      </div>
-
-                      {/* Güçlü Yönler */}
-                      <div>
-                        <h4 className="font-medium text-gray-800 mb-2 text-sm">💪 Güçlü Yönler</h4>
-                        <div className="bg-green-50 p-2.5 rounded-lg">
-                          {evaluationResult.strengths.length > 0 ? (
-                            <ul className="list-disc list-inside space-y-1">
-                              {evaluationResult.strengths.map((strength, index) => (
-                                <li key={index} className="text-green-800">
-                                  {strength}
-                                </li>
-                              ))}
-                            </ul>
-                          ) : (
-                            <p className="text-green-700 italic">
-                              Güçlü yönler henüz analiz edilmedi
-                            </p>
-                          )}
-                        </div>
-                      </div>
-
-                      {/* Gelişim Alanları */}
-                      <div>
-                        <h4 className="font-medium text-gray-800 mb-2 text-sm">
-                          📈 Gelişim Alanları
-                        </h4>
-                        <div className="bg-amber-50 p-2.5 rounded-lg">
-                          {evaluationResult.developmentAreas.length > 0 ? (
-                            <ul className="list-disc list-inside space-y-1">
-                              {evaluationResult.developmentAreas.map((area, index) => (
-                                <li key={index} className="text-amber-800">
-                                  {area}
-                                </li>
-                              ))}
-                            </ul>
-                          ) : (
-                            <p className="text-amber-700 italic">
-                              Gelişim alanları henüz analiz edilmedi
-                            </p>
-                          )}
-                        </div>
-                      </div>
-
-                      {/* Aksiyon Planı */}
-                      <div>
-                        <h4 className="font-medium text-gray-800 mb-2 text-sm">🎯 Aksiyon Planı</h4>
-                        <div className="bg-purple-50 p-2.5 rounded-lg">
-                          {evaluationResult.actionPlan.length > 0 ? (
-                            <ul className="list-decimal list-inside space-y-1">
-                              {evaluationResult.actionPlan.map((action, index) => (
-                                <li key={index} className="text-purple-800">
-                                  {action}
-                                </li>
-                              ))}
-                            </ul>
-                          ) : (
-                            <p className="text-purple-700 italic">
-                              Aksiyon planı henüz oluşturulmadı
-                            </p>
-                          )}
-                        </div>
-                      </div>
-
-                      {/* Yorumlar */}
-                      {(evaluationResult.managerComments || evaluationResult.hrComments) && (
-                        <div>
-                          <h4 className="font-medium text-gray-800 mb-2 text-sm">💬 Yorumlar</h4>
-                          <div className="space-y-2">
-                            {evaluationResult.managerComments && (
-                              <div className="bg-blue-50 p-2.5 rounded-lg">
-                                <h5 className="font-medium text-blue-800 mb-2">Yönetici Yorumu</h5>
-                                <p className="text-blue-700">{evaluationResult.managerComments}</p>
-                              </div>
-                            )}
-                            {evaluationResult.hrComments && (
-                              <div className="bg-indigo-50 p-2.5 rounded-lg">
-                                <h5 className="font-medium text-indigo-800 mb-2">İK Yorumu</h5>
-                                <p className="text-indigo-700">{evaluationResult.hrComments}</p>
-                              </div>
-                            )}
-                          </div>
-                        </div>
-                      )}
-                    </div>
-                  )
-                })()}
-              </div>
-            </div>
-            <div className="flex justify-end gap-2 p-2.5 border-t">
-              <button
-                onClick={handleCloseModal}
-                className="px-2.5 py-1 text-sm text-gray-700 bg-gray-100 rounded-md hover:bg-gray-200"
-              >
-                Kapat
-              </button>
-              <button
-                onClick={() => {
-                  handleCloseModal()
-                  handleEditEvaluationDetail(selectedResult)
-                }}
-                className="flex items-center gap-2 px-2.5 py-1 text-sm bg-blue-600 text-white rounded-md hover:bg-blue-700"
-              >
-                <FaEdit className="w-4 h-4" />
-                Düzenle
-              </button>
-            </div>
-          </div>
-        </div>
-      )}
-
-      {/* Result Edit Modal */}
-      {showResultEditModal && selectedResult && (
-        <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-2">
-          <div className="bg-white rounded-lg w-full max-w-4xl max-h-[90vh] overflow-y-auto">
-            <div className="flex justify-between items-center p-2.5 border-b">
-              <h2 className="text-base font-semibold">Değerlendirme Düzenle</h2>
-              <button
-                onClick={handleCloseModal}
-                className="p-1.5 text-gray-400 hover:text-gray-600"
-              >
-                <FaTimes className="w-4 h-4" />
-              </button>
-            </div>
-            <div className="p-3 space-y-2.5">
-              <div className="bg-amber-50 p-2.5 rounded-lg">
-                <h3 className="font-medium text-amber-800 mb-2 text-sm">Değerlendirme Bilgileri</h3>
-                <div className="grid grid-cols-2 gap-4">
-                  <div>
-                    <span className="text-sm text-amber-700 font-medium">Kampanya: </span>
-                    <span className="text-sm text-amber-800">{selectedResult.campaignName}</span>
-                  </div>
-                  <div>
-                    <span className="text-sm text-amber-700 font-medium">Değerlendirilen: </span>
-                    <span className="text-sm text-amber-800">
-                      {selectedResult.evaluatedEmployeeName}
-                    </span>
-                  </div>
-                  <div>
-                    <span className="text-sm text-amber-700 font-medium">Değerlendiren: </span>
-                    <span className="text-sm text-amber-800">{selectedResult.evaluatorName}</span>
-                  </div>
-                  <div>
-                    <span className="text-sm text-amber-700 font-medium">Değerlendiren Tipi: </span>
-                    <span className="text-sm text-amber-800">
-                      {getAssessorTypeText(selectedResult.evaluatorType)}
-                    </span>
-                  </div>
-                </div>
-              </div>
-
-              {/* Soru Grupları ve Cevaplar */}
-              {(() => {
-                const evaluationResult = mockEvaluation360Results.find(
-                  (r) => r.id === selectedResult.resultId,
-                )
-                const campaign = mockEvaluation360.find((c) => c.id === selectedResult.campaignId)
-                const template = campaign
-                  ? mockEvaluation360Templates.find((t) => t.id === campaign.templateId)
-                  : null
-
-                if (!evaluationResult || !template) {
-                  return (
-                    <div className="text-center py-8 text-gray-500">
-                      <p>Template verisi bulunamadı</p>
-                    </div>
-                  )
-                }
-
-                return (
-                  <div className="space-y-3">
-                    <h3 className="text-sm font-medium text-gray-900">Soru Grupları ve Cevaplar</h3>
-
-                    {template.questionGroups.map((group) => (
-                      <div key={group.id} className="border rounded-lg p-2">
-                        <div className="mb-3">
-                          <h4 className="font-medium text-gray-900 text-sm">{group.groupName}</h4>
-                          <p className="text-gray-600">{group.description}</p>
-                          <div className="flex items-center gap-2 mt-2">
-                            <span className="text-xs text-gray-500">Ağırlık: %{group.weight}</span>
-                            <span className="text-xs text-gray-500">•</span>
-                            <span className="text-xs text-gray-500">
-                              {group.questions.length} soru
-                            </span>
-                          </div>
-                        </div>
-
-                        <div className="space-y-2.5">
-                          {group.questions.map((question, qIndex) => {
-                            const currentResponse = evaluationResult.participants
-                              .flatMap((p) => p.responses)
-                              .find((r) => r.questionId === question.id)
-
-                            const editValue =
-                              editResponses[question.id] !== undefined
-                                ? editResponses[question.id]
-                                : currentResponse?.responseValue
-
-                            return (
-                              <div key={question.id} className="bg-gray-50 p-2.5 rounded-lg">
-                                <p className="font-medium text-gray-800 mb-3">
-                                  {qIndex + 1}. {question.questionText}
-                                  {question.isRequired && (
-                                    <span className="text-red-500 ml-1">*</span>
-                                  )}
-                                </p>
-
-                                {currentResponse && (
-                                  <div className="mb-2 p-1.5 bg-blue-50 rounded">
-                                    <span className="text-xs text-blue-700 font-medium">
-                                      Mevcut Cevap:{' '}
-                                    </span>
-                                    <span className="text-xs text-blue-800">
-                                      {typeof currentResponse.responseValue === 'string'
-                                        ? currentResponse.responseValue
-                                        : `${currentResponse.responseValue} puan`}
-                                    </span>
-                                    <span className="text-xs text-blue-600 ml-2">
-                                      (Puan: {currentResponse.score})
-                                    </span>
-                                  </div>
-                                )}
-
-                                {/* Soru tipine göre düzenleme alanları */}
-                                {question.questionType === QuestionTypeEnum.Rating && (
-                                  <div className="space-y-2">
-                                    <label className="text-sm text-gray-700 font-medium">
-                                      Yeni Puan:
-                                    </label>
-                                    <div className="flex gap-2.5">
-                                      {Array.from(
-                                        {
-                                          length:
-                                            (question.maxRating || 5) -
-                                            (question.minRating || 1) +
-                                            1,
-                                        },
-                                        (_, i) => {
-                                          const value = (question.minRating || 1) + i
-                                          return (
-                                            <label
-                                              key={value}
-                                              className="flex flex-col items-center cursor-pointer"
-                                            >
-                                              <input
-                                                type="radio"
-                                                name={`edit-question-${question.id}`}
-                                                value={value}
-                                                checked={editValue === value}
-                                                onChange={(e) =>
-                                                  handleEditResponseChange(
-                                                    question.id,
-                                                    Number(e.target.value),
-                                                  )
-                                                }
-                                                className="mb-1"
-                                              />
-                                              <span className="text-xs text-gray-600">
-                                                {question.ratingLabels?.[i] || value}
-                                              </span>
-                                            </label>
-                                          )
-                                        },
-                                      )}
-                                    </div>
-                                  </div>
-                                )}
-
-                                {question.questionType === QuestionTypeEnum.Text && (
-                                  <div>
-                                    <label className="block text-sm text-gray-700 font-medium mb-2">
-                                      Yeni Cevap:
-                                    </label>
-                                    <textarea
-                                      className="w-full border border-gray-300 rounded-md px-2.5 py-1.5 text-sm"
-                                      rows={3}
-                                      placeholder="Yeni cevabı yazın..."
-                                      value={editValue || ''}
-                                      onChange={(e) =>
-                                        handleEditResponseChange(question.id, e.target.value)
-                                      }
-                                    />
-                                  </div>
-                                )}
-
-                                {question.questionType === QuestionTypeEnum.YesNo && (
-                                  <div>
-                                    <label className="block text-sm text-gray-700 font-medium mb-2">
-                                      Yeni Cevap:
-                                    </label>
-                                    <div className="flex gap-4">
-                                      <label className="flex items-center cursor-pointer">
-                                        <input
-                                          type="radio"
-                                          name={`edit-question-${question.id}`}
-                                          value="yes"
-                                          checked={editValue === 'yes'}
-                                          onChange={(e) =>
-                                            handleEditResponseChange(question.id, e.target.value)
-                                          }
-                                          className="mr-2"
-                                        />
-                                        Evet
-                                      </label>
-                                      <label className="flex items-center cursor-pointer">
-                                        <input
-                                          type="radio"
-                                          name={`edit-question-${question.id}`}
-                                          value="no"
-                                          checked={editValue === 'no'}
-                                          onChange={(e) =>
-                                            handleEditResponseChange(question.id, e.target.value)
-                                          }
-                                          className="mr-2"
-                                        />
-                                        Hayır
-                                      </label>
-                                    </div>
-                                  </div>
-                                )}
-
-                                {question.questionType === QuestionTypeEnum.MultipleChoice && (
-                                  <div>
-                                    <label className="block text-sm text-gray-700 font-medium mb-2">
-                                      Yeni Seçim:
-                                    </label>
-                                    <div className="space-y-2">
-                                      {question.options?.map((option) => (
-                                        <label
-                                          key={option.id}
-                                          className="flex items-center cursor-pointer"
-                                        >
-                                          <input
-                                            type="radio"
-                                            name={`edit-question-${question.id}`}
-                                            value={option.value}
-                                            checked={editValue === option.value}
-                                            onChange={(e) =>
-                                              handleEditResponseChange(
-                                                question.id,
-                                                Number(e.target.value),
-                                              )
-                                            }
-                                            className="mr-2"
-                                          />
-                                          {option.optionText}
-                                        </label>
-                                      ))}
-                                    </div>
-                                  </div>
-                                )}
-                              </div>
-                            )
-                          })}
-                        </div>
-                      </div>
-                    ))}
-                  </div>
-                )
-              })()}
-
-              {/* Yorumlar ve Durum */}
-              <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    Yönetici Yorumları
-                  </label>
-                  <textarea
-                    className="w-full border border-gray-300 rounded-md px-2.5 py-1.5 text-sm"
-                    rows={4}
-                    placeholder="Yönetici yorumlarını buraya yazın..."
-                    value={editManagerComments}
-                    onChange={(e) => setEditManagerComments(e.target.value)}
-                  />
-                </div>
-
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    İK Yorumları
-                  </label>
-                  <textarea
-                    className="w-full border border-gray-300 rounded-md px-2.5 py-1.5 text-sm"
-                    rows={4}
-                    placeholder="İK yorumlarını buraya yazın..."
-                    value={editHrComments}
-                    onChange={(e) => setEditHrComments(e.target.value)}
-                  />
-                </div>
-              </div>
-
-              <div>
-                <label className="block text-sm font-medium text-gray-700 mb-1">Sonuç Durumu</label>
-                <select
-                  className="w-full border border-gray-300 rounded-md px-2.5 py-1.5 text-sm"
-                  value={editResultStatus}
-                  onChange={(e) => setEditResultStatus(e.target.value)}
-                >
-                  <option value="PENDING">Beklemede</option>
-                  <option value="IN_REVIEW">İncelemede</option>
-                  <option value="APPROVED">Onaylandı</option>
-                  <option value="PUBLISHED">Yayınlandı</option>
-                </select>
-              </div>
-
-              {/* Mevcut Puan Bilgileri */}
-              <div className="border rounded-lg p-3">
-                <h4 className="font-medium text-gray-900 mb-2 text-sm">Mevcut Puan Bilgileri</h4>
-                <div className="grid grid-cols-2 gap-3">
-                  <div className="text-center p-4 bg-blue-50 rounded-lg">
-                    <div className="text-2xl font-bold text-blue-600">
-                      {selectedResult.overallScore}
-                    </div>
-                    <div className="text-sm text-blue-700">Toplam Puan</div>
-                  </div>
-                  <div className="text-center p-4 bg-green-50 rounded-lg">
-                    <div className="text-2xl font-bold text-green-600">
-                      %{selectedResult.scorePercentage}
-                    </div>
-                    <div className="text-sm text-green-700">Başarı Yüzdesi</div>
-                  </div>
-                </div>
-              </div>
-            </div>
-            <div className="flex justify-end gap-2 p-2.5 border-t">
-              <button
-                onClick={handleCloseModal}
-                className="px-2.5 py-1 text-sm text-gray-700 bg-gray-100 rounded-md hover:bg-gray-200"
-              >
-                İptal
-              </button>
-              <button
-                onClick={() => {
-                  console.log('Güncellenen cevaplar:', editResponses)
-                  console.log('Yönetici yorumları:', editManagerComments)
-                  console.log('İK yorumları:', editHrComments)
-                  console.log('Durum:', editResultStatus)
-                  alert('Değerlendirme güncellendi!')
-                  handleCloseModal()
-                }}
-                className="flex items-center gap-2 px-2.5 py-1 text-sm bg-green-600 text-white rounded-md hover:bg-green-700"
-              >
-                <FaSave className="w-4 h-4" />
-                Kaydet
-              </button>
-            </div>
-          </div>
-        </div>
-      )}
-    </Container>
-  )
-}
-
-export default Degree360Evaluation
diff --git a/ui/src/views/hr/components/Degree360Templates.tsx b/ui/src/views/hr/components/Degree360Templates.tsx
deleted file mode 100644
index a74d5d2d..00000000
--- a/ui/src/views/hr/components/Degree360Templates.tsx
+++ /dev/null
@@ -1,781 +0,0 @@
-import React, { useState } from 'react'
-import { FaEye, FaEdit, FaPlus, FaTimes, FaSave, FaTrash, FaQuestionCircle } from 'react-icons/fa'
-import {
-  HrEvaluation360Template,
-  HrQuestionGroup,
-  HrEvaluationQuestion,
-  QuestionTypeEnum,
-  HrQuestionOption,
-  AssessorTypeEnum,
-  getQuestionTypeText,
-} from '../../../types/hr'
-import DataTable, { Column } from '../../../components/common/DataTable'
-import { mockEvaluation360Templates } from '../../../mocks/mockEvaluation360Templates'
-import Widget from '../../../components/common/Widget'
-import { Container } from '@/components/shared'
-
-const Degree360Templates: React.FC = () => {
-  const [templateSearchTerm, setTemplateSearchTerm] = useState('')
-
-  // Modal states
-  const [showTemplateModal, setShowTemplateModal] = useState(false)
-  const [showQuestionModal, setShowQuestionModal] = useState(false)
-  const [showQuestionItemModal, setShowQuestionItemModal] = useState(false)
-  const [selectedTemplate, setSelectedTemplate] = useState<HrEvaluation360Template | null>(null)
-  const [selectedQuestionGroup, setSelectedQuestionGroup] = useState<HrQuestionGroup | null>(null)
-  const [selectedQuestion, setSelectedQuestion] = useState<HrEvaluationQuestion | null>(null)
-  const [isEditMode, setIsEditMode] = useState(false)
-
-  // Form states
-  const [templateForm, setTemplateForm] = useState({
-    name: '',
-    description: '',
-    isActive: true,
-    assessorTypes: [] as AssessorTypeEnum[],
-  })
-
-  const [questionGroupForm, setQuestionGroupForm] = useState({
-    groupName: '',
-    description: '',
-    weight: 0,
-    order: 0,
-  })
-
-  const [questionForm, setQuestionForm] = useState({
-    questionText: '',
-    questionType: QuestionTypeEnum.Rating,
-    isRequired: true,
-    order: 0,
-    weight: 0,
-    options: [] as HrQuestionOption[],
-  })
-
-  // Filter templates
-  const filteredTemplates = mockEvaluation360Templates.filter((template) => {
-    const searchLower = templateSearchTerm.toLowerCase()
-    return (
-      template.name.toLowerCase().includes(searchLower) ||
-      template.description.toLowerCase().includes(searchLower)
-    )
-  })
-
-  // Statistics
-  const totalTemplates = mockEvaluation360Templates.length
-  const activeTemplates = mockEvaluation360Templates.filter((t) => t.isActive).length
-
-  // Event handlers
-  const handleNewTemplate = () => {
-    setTemplateForm({
-      name: '',
-      description: '',
-      isActive: true,
-      assessorTypes: [],
-    })
-    setSelectedTemplate(null)
-    setIsEditMode(false)
-    setShowTemplateModal(true)
-  }
-
-  const handleEditTemplate = (template: HrEvaluation360Template) => {
-    setTemplateForm({
-      name: template.name,
-      description: template.description,
-      isActive: template.isActive,
-      assessorTypes: template.assessorTypes || [],
-    })
-    setSelectedTemplate(template)
-    setIsEditMode(true)
-    setShowTemplateModal(true)
-  }
-
-  const handleViewTemplate = (template: HrEvaluation360Template) => {
-    setTemplateForm({
-      name: template.name,
-      description: template.description,
-      isActive: template.isActive,
-      assessorTypes: template.assessorTypes || [],
-    })
-    setSelectedTemplate(template)
-    setShowTemplateModal(true)
-    setIsEditMode(false)
-  }
-
-  const handleSaveTemplate = () => {
-    console.log('Saving template:', templateForm)
-    setShowTemplateModal(false)
-  }
-
-  const handleDeleteTemplate = (template: HrEvaluation360Template) => {
-    if (confirm(`"${template.name}" şablonunu silmek istediğinizden emin misiniz?`)) {
-      console.log('Deleting template:', template.id)
-    }
-  }
-
-  const handleAddQuestionGroup = () => {
-    setQuestionGroupForm({
-      groupName: '',
-      description: '',
-      weight: 0,
-      order: 0,
-    })
-    setSelectedQuestionGroup(null)
-    setShowQuestionModal(true)
-  }
-
-  const handleEditQuestionGroup = (group: HrQuestionGroup) => {
-    setQuestionGroupForm({
-      groupName: group.groupName,
-      description: group.description || '',
-      weight: group.weight,
-      order: group.order,
-    })
-    setSelectedQuestionGroup(group)
-    setShowQuestionModal(true)
-  }
-
-  const handleSaveQuestionGroup = () => {
-    console.log('Saving question group:', questionGroupForm)
-    setShowQuestionModal(false)
-  }
-
-  const handleAddQuestion = (group: HrQuestionGroup) => {
-    setQuestionForm({
-      questionText: '',
-      questionType: QuestionTypeEnum.Rating,
-      isRequired: true,
-      order: 0,
-      weight: 0,
-      options: [],
-    })
-    setSelectedQuestion(null)
-    setSelectedQuestionGroup(group)
-    setShowQuestionItemModal(true)
-  }
-
-  const handleEditQuestion = (question: HrEvaluationQuestion, group: HrQuestionGroup) => {
-    setQuestionForm({
-      questionText: question.questionText,
-      questionType: question.questionType,
-      isRequired: question.isRequired,
-      order: question.order,
-      weight: question.weight,
-      options: question.options || [],
-    })
-    setSelectedQuestion(question)
-    setSelectedQuestionGroup(group)
-    setShowQuestionItemModal(true)
-  }
-
-  const handleSaveQuestion = () => {
-    console.log('Saving question:', questionForm)
-    setShowQuestionItemModal(false)
-  }
-
-  // Table columns
-  const templateColumns: Column<HrEvaluation360Template>[] = [
-    {
-      key: 'name',
-      header: 'Şablon Adı',
-      sortable: true,
-      render: (template) => (
-        <div>
-          <div className="font-medium text-gray-900">{template.name}</div>
-          <div className="text-sm text-gray-500">{template.description}</div>
-        </div>
-      ),
-    },
-    {
-      key: 'questionGroups',
-      header: 'Soru Grupları',
-      render: (template) => (
-        <span className="text-sm text-gray-600">{template.questionGroups?.length || 0} grup</span>
-      ),
-    },
-    {
-      key: 'assessorTypes',
-      header: 'Değerlendirecekler',
-      render: (template) => {
-        const assessorLabels = {
-          [AssessorTypeEnum.Self]: 'Kendi',
-          [AssessorTypeEnum.Manager]: 'Yönetici',
-          [AssessorTypeEnum.Peer]: 'Meslektaş',
-          [AssessorTypeEnum.Subordinate]: 'Ast',
-          [AssessorTypeEnum.Customer]: 'Müşteri',
-          [AssessorTypeEnum.OtherDepartment]: 'Diğer Departman',
-          [AssessorTypeEnum.HRUpperManagement]: 'İK/Üst Yönetim',
-          [AssessorTypeEnum.External]: 'Dış Paydaş',
-        }
-
-        const assessorTypes = template.assessorTypes || []
-        return (
-          <div className="flex flex-wrap gap-1">
-            {assessorTypes.map((type) => (
-              <span
-                key={type}
-                className="inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-blue-100 text-blue-800"
-              >
-                {assessorLabels[type] || type}
-              </span>
-            ))}
-            {assessorTypes.length === 0 && (
-              <span className="text-sm text-gray-400">Belirtilmemiş</span>
-            )}
-          </div>
-        )
-      },
-    },
-    {
-      key: 'isActive',
-      header: 'Durum',
-      render: (template) => (
-        <span
-          className={`inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium ${
-            template.isActive ? 'bg-green-100 text-green-800' : 'bg-red-100 text-red-800'
-          }`}
-        >
-          {template.isActive ? 'Aktif' : 'Pasif'}
-        </span>
-      ),
-    },
-    {
-      key: 'actions',
-      header: 'İşlemler',
-      render: (template) => (
-        <div className="flex items-center gap-2">
-          <button
-            onClick={() => handleViewTemplate(template)}
-            className="text-blue-600 hover:text-blue-900"
-            title="Görüntüle"
-          >
-            <FaEye className="w-4 h-4" />
-          </button>
-          <button
-            onClick={() => handleEditTemplate(template)}
-            className="text-green-600 hover:text-green-900"
-            title="Düzenle"
-          >
-            <FaEdit className="w-4 h-4" />
-          </button>
-          <button
-            onClick={() => handleDeleteTemplate(template)}
-            className="text-red-600 hover:text-red-900"
-            title="Sil"
-          >
-            <FaTrash className="w-4 h-4" />
-          </button>
-        </div>
-      ),
-    },
-  ]
-
-  return (
-    <Container>
-      <div className="space-y-2">
-        {/* Header */}
-        <div className="flex flex-col sm:flex-row sm:items-center justify-between gap-4">
-          <div>
-            <h2 className="text-2xl font-bold text-gray-900">360° Şablonlar</h2>
-            <p className="text-gray-600">360 derece değerlendirme şablonlarını yönetin</p>
-          </div>
-
-          <button
-            onClick={handleNewTemplate}
-            className="flex items-center gap-2 px-3 py-1.5 bg-purple-600 text-white rounded-md hover:bg-purple-700 ml-4 text-sm"
-          >
-            <FaPlus className="w-4 h-4" />
-            Yeni Şablon
-          </button>
-        </div>
-
-        {/* Statistics */}
-        <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
-          <Widget
-            title="Toplam Şablon"
-            value={totalTemplates}
-            color="purple"
-            icon="FaClipboardList"
-          />
-
-          <Widget
-            title="Aktif Şablon"
-            value={activeTemplates}
-            color="green"
-            icon="FaClipboardList"
-          />
-
-          <Widget
-            title="Pasif Şablon"
-            value={totalTemplates - activeTemplates}
-            color="red"
-            icon="FaClipboardList"
-          />
-        </div>
-
-        <div className="bg-white p-4 rounded-lg border">
-          <div className="flex-1">
-            <input
-              type="text"
-              placeholder="Şablon adı veya açıklama ile ara..."
-              value={templateSearchTerm}
-              onChange={(e) => setTemplateSearchTerm(e.target.value)}
-              className="w-full border border-gray-300 rounded-md px-3 py-1.5 text-sm focus:ring-2 focus:ring-purple-500 focus:border-purple-500"
-            />
-          </div>
-        </div>
-
-        {/* Templates Table */}
-        <DataTable data={filteredTemplates} columns={templateColumns} />
-      </div>
-
-      {/* Template Modal */}
-      {showTemplateModal && (
-        <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-4xl max-h-[90vh] overflow-y-auto">
-            <div className="flex justify-between items-center mb-4">
-              <h2 className="text-lg font-bold">
-                {isEditMode ? 'Şablon Düzenle' : selectedTemplate ? 'Şablon Detayı' : 'Yeni Şablon'}
-              </h2>
-              <button
-                onClick={() => setShowTemplateModal(false)}
-                className="p-2 text-gray-500 hover:text-gray-700"
-              >
-                <FaTimes className="w-5 h-5" />
-              </button>
-            </div>
-
-            <div className="space-y-4">
-              {/* Basic Information */}
-              <div className="grid grid-cols-2 gap-4">
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-2">Şablon Adı</label>
-                  <input
-                    type="text"
-                    value={templateForm.name}
-                    onChange={(e) => setTemplateForm({ ...templateForm, name: e.target.value })}
-                    className="w-full border border-gray-300 rounded-md px-3 py-1.5 text-sm focus:ring-2 focus:ring-purple-500 focus:border-purple-500"
-                    disabled={!isEditMode && !!selectedTemplate}
-                  />
-                </div>
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-2">Durum</label>
-                  <select
-                    value={templateForm.isActive ? 'active' : 'inactive'}
-                    onChange={(e) =>
-                      setTemplateForm({
-                        ...templateForm,
-                        isActive: e.target.value === 'active',
-                      })
-                    }
-                    className="w-full border border-gray-300 rounded-md px-3 py-1.5 text-sm focus:ring-2 focus:ring-purple-500 focus:border-purple-500"
-                    disabled={!isEditMode && !!selectedTemplate}
-                  >
-                    <option value="active">Aktif</option>
-                    <option value="inactive">Pasif</option>
-                  </select>
-                </div>
-              </div>
-
-              <div>
-                <label className="block text-sm font-medium text-gray-700 mb-2">Açıklama</label>
-                <textarea
-                  value={templateForm.description}
-                  onChange={(e) =>
-                    setTemplateForm({
-                      ...templateForm,
-                      description: e.target.value,
-                    })
-                  }
-                  rows={3}
-                  className="w-full border border-gray-300 rounded-md px-3 py-1.5 text-sm focus:ring-2 focus:ring-purple-500 focus:border-purple-500"
-                  disabled={!isEditMode && !!selectedTemplate}
-                />
-              </div>
-
-              {/* Değerlendiriciler */}
-              <div>
-                <label className="block text-sm font-medium text-gray-700 mb-2">
-                  Değerlendirecekler
-                </label>
-                <div className="grid grid-cols-2 gap-3">
-                  {Object.values(AssessorTypeEnum).map((type) => {
-                    const labels = {
-                      [AssessorTypeEnum.Self]: 'Kendi',
-                      [AssessorTypeEnum.Manager]: 'Yönetici',
-                      [AssessorTypeEnum.Peer]: 'Meslektaş',
-                      [AssessorTypeEnum.Subordinate]: 'Ast',
-                      [AssessorTypeEnum.Customer]: 'Müşteri',
-                      [AssessorTypeEnum.OtherDepartment]: 'Diğer Departman',
-                      [AssessorTypeEnum.HRUpperManagement]: 'İK/Üst Yönetim',
-                      [AssessorTypeEnum.External]: 'Dış Paydaş',
-                    }
-
-                    return (
-                      <label key={type} className="flex items-center space-x-2">
-                        <input
-                          type="checkbox"
-                          checked={templateForm.assessorTypes.includes(type)}
-                          onChange={(e) => {
-                            if (e.target.checked) {
-                              setTemplateForm({
-                                ...templateForm,
-                                assessorTypes: [...templateForm.assessorTypes, type],
-                              })
-                            } else {
-                              setTemplateForm({
-                                ...templateForm,
-                                assessorTypes: templateForm.assessorTypes.filter((t) => t !== type),
-                              })
-                            }
-                          }}
-                          className="rounded border-gray-300 text-purple-600 focus:ring-purple-500"
-                          disabled={!isEditMode && !!selectedTemplate}
-                        />
-                        <span className="text-sm text-gray-700">{labels[type] || type}</span>
-                      </label>
-                    )
-                  })}
-                </div>
-              </div>
-
-              {/* Question Groups */}
-              {selectedTemplate && (
-                <div>
-                  <div className="flex justify-between items-center mb-4">
-                    <h3 className="text-lg font-semibold">Soru Grupları</h3>
-                    {isEditMode && (
-                      <button
-                        onClick={handleAddQuestionGroup}
-                        className="flex items-center gap-2 px-2 py-1 bg-blue-600 text-white rounded-md hover:bg-blue-700 text-xs"
-                      >
-                        <FaPlus className="w-3 h-3" />
-                        Grup Ekle
-                      </button>
-                    )}
-                  </div>
-
-                  <div className="space-y-3">
-                    {selectedTemplate.questionGroups?.map((group, groupIndex) => (
-                      <div key={groupIndex} className="bg-gray-50 p-3 rounded-lg">
-                        <div className="flex justify-between items-start mb-3">
-                          <div>
-                            <h4 className="font-medium">{group.groupName}</h4>
-                            <p className="text-sm text-gray-600">{group.description}</p>
-                            <p className="text-gray-600">Ağırlık: {group.weight}%</p>
-                          </div>
-                          {isEditMode && (
-                            <div className="flex gap-2">
-                              <button
-                                onClick={() => handleEditQuestionGroup(group)}
-                                className="text-blue-600 hover:text-blue-900"
-                              >
-                                <FaEdit className="w-4 h-4" />
-                              </button>
-                              <button
-                                onClick={() => handleAddQuestion(group)}
-                                className="text-green-600 hover:text-green-900"
-                              >
-                                <FaQuestionCircle className="w-4 h-4" />
-                              </button>
-                            </div>
-                          )}
-                        </div>
-
-                        {/* Questions */}
-                        <div className="space-y-2">
-                          {group.questions?.map((question, questionIndex) => (
-                            <div key={questionIndex} className="bg-white p-2 rounded border">
-                              <div className="flex justify-between items-start">
-                                <div className="flex-1">
-                                  <p className="text-sm">{question.questionText}</p>
-                                  <div className="flex gap-4 mt-1">
-                                    <span className="text-xs text-gray-500">
-                                      Tip:{' '}
-                                      {question.questionType === QuestionTypeEnum.Rating
-                                        ? 'Puanlama'
-                                        : question.questionType === QuestionTypeEnum.MultipleChoice
-                                          ? 'Çoktan Seçmeli'
-                                          : question.questionType === QuestionTypeEnum.Text
-                                            ? 'Metin'
-                                            : 'Evet/Hayır'}
-                                    </span>
-                                    <span className="text-xs text-gray-500">
-                                      Ağırlık: {question.weight}%
-                                    </span>
-                                    {question.isRequired && (
-                                      <span className="text-xs text-red-500">Zorunlu</span>
-                                    )}
-                                  </div>
-                                </div>
-                                {isEditMode && (
-                                  <button
-                                    onClick={() => handleEditQuestion(question, group)}
-                                    className="text-blue-600 hover:text-blue-900"
-                                  >
-                                    <FaEdit className="w-4 h-4" />
-                                  </button>
-                                )}
-                              </div>
-                            </div>
-                          ))}
-                        </div>
-                      </div>
-                    ))}
-                  </div>
-                </div>
-              )}
-            </div>
-
-            <div className="flex justify-end gap-4 mt-4">
-              <button
-                onClick={() => setShowTemplateModal(false)}
-                className="px-3 py-1.5 text-sm border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50"
-              >
-                {selectedTemplate && !isEditMode ? 'Kapat' : 'İptal'}
-              </button>
-              {(isEditMode || !selectedTemplate) && (
-                <button
-                  onClick={handleSaveTemplate}
-                  className="flex items-center gap-2 px-3 py-1.5 text-sm bg-purple-600 text-white rounded-md hover:bg-purple-700"
-                >
-                  <FaSave className="w-4 h-4" />
-                  Kaydet
-                </button>
-              )}
-            </div>
-          </div>
-        </div>
-      )}
-
-      {/* Question Group Modal */}
-      {showQuestionModal && (
-        <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">
-            <div className="flex justify-between items-center mb-4">
-              <h2 className="text-lg font-bold">
-                {selectedQuestionGroup ? 'Soru Grubu Düzenle' : 'Yeni Soru Grubu'}
-              </h2>
-              <button
-                onClick={() => setShowQuestionModal(false)}
-                className="p-2 text-gray-500 hover:text-gray-700"
-              >
-                <FaTimes className="w-5 h-5" />
-              </button>
-            </div>
-
-            <div className="space-y-4">
-              <div>
-                <label className="block text-sm font-medium text-gray-700 mb-2">Grup Adı</label>
-                <input
-                  type="text"
-                  value={questionGroupForm.groupName}
-                  onChange={(e) =>
-                    setQuestionGroupForm({
-                      ...questionGroupForm,
-                      groupName: e.target.value,
-                    })
-                  }
-                  className="w-full border border-gray-300 rounded-md px-3 py-1.5 text-sm focus:ring-2 focus:ring-purple-500 focus:border-purple-500"
-                />
-              </div>
-
-              <div>
-                <label className="block text-sm font-medium text-gray-700 mb-2">Açıklama</label>
-                <textarea
-                  value={questionGroupForm.description}
-                  onChange={(e) =>
-                    setQuestionGroupForm({
-                      ...questionGroupForm,
-                      description: e.target.value,
-                    })
-                  }
-                  rows={3}
-                  className="w-full border border-gray-300 rounded-md px-3 py-1.5 text-sm focus:ring-2 focus:ring-purple-500 focus:border-purple-500"
-                />
-              </div>
-
-              <div className="grid grid-cols-2 gap-4">
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-2">
-                    Ağırlık (%)
-                  </label>
-                  <input
-                    type="number"
-                    min="0"
-                    max="100"
-                    value={questionGroupForm.weight}
-                    onChange={(e) =>
-                      setQuestionGroupForm({
-                        ...questionGroupForm,
-                        weight: Number(e.target.value),
-                      })
-                    }
-                    className="w-full border border-gray-300 rounded-md px-3 py-1.5 text-sm focus:ring-2 focus:ring-purple-500 focus:border-purple-500"
-                  />
-                </div>
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-2">Sıra</label>
-                  <input
-                    type="number"
-                    min="0"
-                    value={questionGroupForm.order}
-                    onChange={(e) =>
-                      setQuestionGroupForm({
-                        ...questionGroupForm,
-                        order: Number(e.target.value),
-                      })
-                    }
-                    className="w-full border border-gray-300 rounded-md px-3 py-1.5 text-sm focus:ring-2 focus:ring-purple-500 focus:border-purple-500"
-                  />
-                </div>
-              </div>
-            </div>
-
-            <div className="flex justify-end gap-4 mt-4">
-              <button
-                onClick={() => setShowQuestionModal(false)}
-                className="px-3 py-1.5 text-sm border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50"
-              >
-                İptal
-              </button>
-              <button
-                onClick={handleSaveQuestionGroup}
-                className="flex items-center gap-2 px-3 py-1.5 text-sm bg-purple-600 text-white rounded-md hover:bg-purple-700"
-              >
-                <FaSave className="w-4 h-4" />
-                Kaydet
-              </button>
-            </div>
-          </div>
-        </div>
-      )}
-
-      {/* Question Modal */}
-      {showQuestionItemModal && (
-        <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">
-            <div className="flex justify-between items-center mb-4">
-              <h2 className="text-lg font-bold">
-                {selectedQuestion ? 'Soru Düzenle' : 'Yeni Soru'}
-              </h2>
-              <button
-                onClick={() => setShowQuestionItemModal(false)}
-                className="p-2 text-gray-500 hover:text-gray-700"
-              >
-                <FaTimes className="w-5 h-5" />
-              </button>
-            </div>
-
-            <div className="space-y-4">
-              <div>
-                <label className="block text-sm font-medium text-gray-700 mb-2">Soru Metni</label>
-                <textarea
-                  value={questionForm.questionText}
-                  onChange={(e) =>
-                    setQuestionForm({
-                      ...questionForm,
-                      questionText: e.target.value,
-                    })
-                  }
-                  rows={3}
-                  className="w-full border border-gray-300 rounded-md px-3 py-1.5 text-sm focus:ring-2 focus:ring-purple-500 focus:border-purple-500"
-                />
-              </div>
-
-              <div>
-                <label className="block text-sm font-medium text-gray-700 mb-2">Soru Tipi</label>
-                <select
-                  value={questionForm.questionType}
-                  onChange={(e) =>
-                    setQuestionForm({
-                      ...questionForm,
-                      questionType: e.target.value as QuestionTypeEnum,
-                    })
-                  }
-                  className="w-full border border-gray-300 rounded-md px-3 py-1.5 text-sm focus:ring-2 focus:ring-purple-500 focus:border-purple-500"
-                >
-                  {Object.values(QuestionTypeEnum).map((type) => (
-                    <option key={type} value={type}>
-                      {getQuestionTypeText(type)}
-                    </option>
-                  ))}
-                </select>
-              </div>
-
-              <div className="grid grid-cols-2 gap-4">
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-2">
-                    Ağırlık (%)
-                  </label>
-                  <input
-                    type="number"
-                    min="0"
-                    max="100"
-                    value={questionForm.weight}
-                    onChange={(e) =>
-                      setQuestionForm({
-                        ...questionForm,
-                        weight: Number(e.target.value),
-                      })
-                    }
-                    className="w-full border border-gray-300 rounded-md px-3 py-1.5 text-sm focus:ring-2 focus:ring-purple-500 focus:border-purple-500"
-                  />
-                </div>
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-2">Sıra</label>
-                  <input
-                    type="number"
-                    min="0"
-                    value={questionForm.order}
-                    onChange={(e) =>
-                      setQuestionForm({
-                        ...questionForm,
-                        order: Number(e.target.value),
-                      })
-                    }
-                    className="w-full border border-gray-300 rounded-md px-3 py-1.5 text-sm focus:ring-2 focus:ring-purple-500 focus:border-purple-500"
-                  />
-                </div>
-              </div>
-
-              <div className="flex items-center">
-                <input
-                  type="checkbox"
-                  id="isRequired"
-                  checked={questionForm.isRequired}
-                  onChange={(e) =>
-                    setQuestionForm({
-                      ...questionForm,
-                      isRequired: e.target.checked,
-                    })
-                  }
-                  className="h-4 w-4 text-purple-600 focus:ring-purple-500 border-gray-300 rounded"
-                />
-                <label htmlFor="isRequired" className="ml-2 block text-sm text-gray-700">
-                  Zorunlu soru
-                </label>
-              </div>
-            </div>
-
-            <div className="flex justify-end gap-4 mt-4">
-              <button
-                onClick={() => setShowQuestionItemModal(false)}
-                className="px-3 py-1.5 text-sm border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50"
-              >
-                İptal
-              </button>
-              <button
-                onClick={handleSaveQuestion}
-                className="flex items-center gap-2 px-3 py-1.5 text-sm bg-purple-600 text-white rounded-md hover:bg-purple-700"
-              >
-                <FaSave className="w-4 h-4" />
-                Kaydet
-              </button>
-            </div>
-          </div>
-        </div>
-      )}
-    </Container>
-  )
-}
-
-export default Degree360Templates
diff --git a/ui/src/views/hr/components/DepartmentFormModal.tsx b/ui/src/views/hr/components/DepartmentFormModal.tsx
deleted file mode 100644
index a98fc244..00000000
--- a/ui/src/views/hr/components/DepartmentFormModal.tsx
+++ /dev/null
@@ -1,296 +0,0 @@
-import React, { useState, useEffect } from "react";
-import { FaSave, FaTimes } from "react-icons/fa";
-import { DepartmentDto } from "../../../types/hr";
-import { mockEmployees } from "../../../mocks/mockEmployees";
-import { mockDepartments } from "../../../mocks/mockDepartments";
-import { mockCostCenters } from "../../../mocks/mockCostCenters";
-
-interface DepartmentFormModalProps {
-  isOpen: boolean;
-  onClose: () => void;
-  onSave: (department: Partial<DepartmentDto>) => void;
-  department?: DepartmentDto;
-  title: string;
-}
-
-const DepartmentFormModal: React.FC<DepartmentFormModalProps> = ({
-  isOpen,
-  onClose,
-  onSave,
-  department,
-  title,
-}) => {
-  const [formData, setFormData] = useState({
-    departmentCode: "",
-    name: "",
-    description: "",
-    parentDepartmentId: "",
-    managerId: "",
-    costCenterId: "",
-    budget: 0,
-    isActive: true,
-  });
-
-  const [errors, setErrors] = useState<Record<string, string>>({});
-
-  useEffect(() => {
-    if (isOpen) {
-      setFormData({
-        departmentCode: department?.code || "",
-        name: department?.name || "",
-        description: department?.description || "",
-        parentDepartmentId: department?.parentDepartmentId || "",
-        managerId: department?.managerId || "",
-        costCenterId: department?.costCenterId || "",
-        budget: department?.budget || 0,
-        isActive: department ? department.isActive : true,
-      });
-      setErrors({});
-    }
-  }, [department, isOpen]);
-
-  const validateForm = (): boolean => {
-    const newErrors: Record<string, string> = {};
-
-    if (!formData.departmentCode.trim()) {
-      newErrors.departmentCode = "Departman kodu zorunludur";
-    } else if (
-      mockDepartments.some(
-        (d) => d.code === formData.departmentCode && d.id !== department?.id
-      )
-    ) {
-      newErrors.departmentCode = "Bu departman kodu zaten kullanılıyor";
-    }
-
-    if (!formData.name.trim()) {
-      newErrors.name = "Departman adı zorunludur";
-    }
-
-    if (formData.budget < 0) {
-      newErrors.budget = "Bütçe negatif olamaz";
-    }
-
-    setErrors(newErrors);
-    return Object.keys(newErrors).length === 0;
-  };
-
-  const handleSubmit = (e: React.FormEvent) => {
-    e.preventDefault();
-    if (validateForm()) {
-      onSave(formData);
-      onClose();
-    }
-  };
-
-  const handleInputChange = (
-    field: string,
-    value: string | number | boolean
-  ) => {
-    setFormData((prev) => ({ ...prev, [field]: value }));
-    if (errors[field]) {
-      setErrors((prev) => ({ ...prev, [field]: "" }));
-    }
-  };
-
-  return (
-    isOpen && (
-      <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
-        <div className="bg-white rounded-lg p-3 w-full max-w-lg max-h-[90vh] overflow-y-auto">
-          <div className="flex items-center justify-between mb-3">
-            <h2 className="text-base font-bold text-gray-900">{title}</h2>
-            <button
-              onClick={onClose}
-              className="p-2 text-gray-400 hover:text-gray-600"
-            >
-              <FaTimes className="w-5 h-5" />
-            </button>
-          </div>
-
-          <form onSubmit={handleSubmit} className="space-y-3">
-            {/* Temel Bilgiler */}
-            <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
-              <div>
-                <label className="block text-xs font-medium text-gray-700 mb-1">
-                  Departman Kodu *
-                </label>
-                <input
-                  type="text"
-                  value={formData.departmentCode}
-                  onChange={(e) =>
-                    handleInputChange("departmentCode", e.target.value)
-                  }
-                  className={`w-full px-2 py-1 text-sm border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 ${
-                    errors.departmentCode ? "border-red-500" : "border-gray-300"
-                  }`}
-                  placeholder="Örn: HR001"
-                />
-                {errors.departmentCode && (
-                  <p className="text-red-500 text-xs mt-1">
-                    {errors.departmentCode}
-                  </p>
-                )}
-              </div>
-
-              <div>
-                <label className="block text-xs font-medium text-gray-700 mb-1">
-                  Departman Adı *
-                </label>
-                <input
-                  type="text"
-                  value={formData.name}
-                  onChange={(e) => handleInputChange("name", e.target.value)}
-                  className={`w-full px-2 py-1 text-sm border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 ${
-                    errors.name ? "border-red-500" : "border-gray-300"
-                  }`}
-                  placeholder="Örn: İnsan Kaynakları"
-                />
-                {errors.name && (
-                  <p className="text-red-500 text-xs mt-1">{errors.name}</p>
-                )}
-              </div>
-            </div>
-
-            <div>
-              <label className="block text-xs font-medium text-gray-700 mb-1">
-                Açıklama
-              </label>
-              <textarea
-                value={formData.description}
-                onChange={(e) =>
-                  handleInputChange("description", e.target.value)
-                }
-                rows={2}
-                className="w-full px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                placeholder="Departman açıklaması..."
-              />
-            </div>
-
-            {/* Hiyerarşi ve İlişkiler */}
-            <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
-              <div>
-                <label className="block text-xs font-medium text-gray-700 mb-1">
-                  Üst Departman
-                </label>
-                <select
-                  value={formData.parentDepartmentId}
-                  onChange={(e) =>
-                    handleInputChange("parentDepartmentId", e.target.value)
-                  }
-                  className="w-full px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                >
-                  <option value="">Departman Seçin...</option>
-                  {mockDepartments
-                    .filter((d) => d.id !== department?.id)
-                    .map((dept) => (
-                      <option key={dept.id} value={dept.id}>
-                        {dept.name}
-                      </option>
-                    ))}
-                </select>
-              </div>
-
-              <div>
-                <label className="block text-xs font-medium text-gray-700 mb-1">
-                  Departman Yöneticisi
-                </label>
-                <select
-                  value={formData.managerId}
-                  onChange={(e) =>
-                    handleInputChange("managerId", e.target.value)
-                  }
-                  className="w-full px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                >
-                  <option value="">Yönetici Seçin</option>
-                  {mockEmployees.map((employee) => (
-                    <option key={employee.id} value={employee.id}>
-                      {employee.fullName} ({employee.code})
-                    </option>
-                  ))}
-                </select>
-              </div>
-            </div>
-
-            <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
-              <div>
-                <label className="block text-xs font-medium text-gray-700 mb-1">
-                  Maliyet Merkezi
-                </label>
-                <select
-                  value={formData.costCenterId}
-                  onChange={(e) =>
-                    handleInputChange("costCenterId", e.target.value)
-                  }
-                  className="w-full px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                >
-                  <option value="">Maliyet Merkezi Seçin</option>
-                  {mockCostCenters.map((costCenter) => (
-                    <option key={costCenter.id} value={costCenter.id}>
-                      {costCenter.name} ({costCenter.code})
-                    </option>
-                  ))}
-                </select>
-              </div>
-
-              <div>
-                <label className="block text-xs font-medium text-gray-700 mb-1">
-                  Bütçe (₺)
-                </label>
-                <input
-                  type="number"
-                  value={formData.budget}
-                  onChange={(e) =>
-                    handleInputChange("budget", parseFloat(e.target.value) || 0)
-                  }
-                  min="0"
-                  step="0.01"
-                  className={`w-full px-2 py-1 text-sm border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 ${
-                    errors.budget ? "border-red-500" : "border-gray-300"
-                  }`}
-                  placeholder="0.00"
-                />
-                {errors.budget && (
-                  <p className="text-red-500 text-xs mt-1">{errors.budget}</p>
-                )}
-              </div>
-            </div>
-
-            <div className="flex items-center">
-              <input
-                type="checkbox"
-                id="isActive"
-                checked={formData.isActive}
-                onChange={(e) =>
-                  handleInputChange("isActive", e.target.checked)
-                }
-                className="w-4 h-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500"
-              />
-              <label htmlFor="isActive" className="ml-2 text-sm text-gray-700">
-                Aktif departman
-              </label>
-            </div>
-
-            {/* Form Actions */}
-            <div className="flex justify-end gap-2 pt-3 border-t">
-              <button
-                type="button"
-                onClick={onClose}
-                className="px-3 py-1 text-sm text-gray-700 bg-gray-200 rounded-md hover:bg-gray-300 transition-colors"
-              >
-                İptal
-              </button>
-              <button
-                type="submit"
-                className="flex items-center gap-2 px-3 py-1.5 text-sm bg-blue-600 text-white rounded-md hover:bg-blue-700 transition-colors"
-              >
-                <FaSave className="w-4 h-4" />
-                Kaydet
-              </button>
-            </div>
-          </form>
-        </div>
-      </div>
-    )
-  );
-};
-
-export default DepartmentFormModal;
diff --git a/ui/src/views/hr/components/DepartmentManagement.tsx b/ui/src/views/hr/components/DepartmentManagement.tsx
deleted file mode 100644
index 30f2c7cb..00000000
--- a/ui/src/views/hr/components/DepartmentManagement.tsx
+++ /dev/null
@@ -1,461 +0,0 @@
-import React, { useState } from 'react'
-import {
-  FaPlus,
-  FaEdit,
-  FaTrash,
-  FaBuilding,
-  FaUsers,
-  FaDollarSign,
-  FaEye,
-  FaList,
-  FaTh,
-} from 'react-icons/fa'
-import { DepartmentDto } from '../../../types/hr'
-import DataTable, { Column } from '../../../components/common/DataTable'
-import { mockDepartments } from '../../../mocks/mockDepartments'
-import { mockEmployees } from '../../../mocks/mockEmployees'
-import { mockCostCenters } from '../../../mocks/mockCostCenters'
-import DepartmentFormModal from './DepartmentFormModal'
-import DepartmentViewModal from './DepartmentViewModal'
-import Widget from '../../../components/common/Widget'
-import { Container } from '@/components/shared'
-
-const DepartmentManagement: React.FC = () => {
-  const [departments, setDepartments] = useState<DepartmentDto[]>(mockDepartments)
-  const [searchTerm, setSearchTerm] = useState('')
-  const [selectedParent, setSelectedParent] = useState<string>('all')
-  const [viewMode, setViewMode] = useState<'list' | 'cards'>('list')
-
-  // Modal states
-  const [isFormModalOpen, setIsFormModalOpen] = useState(false)
-  const [isViewModalOpen, setIsViewModalOpen] = useState(false)
-  const [selectedDepartment, setSelectedDepartment] = useState<DepartmentDto | undefined>()
-  const [modalTitle, setModalTitle] = useState('')
-
-  const handleAdd = () => {
-    setSelectedDepartment(undefined)
-    setModalTitle('Yeni Departman')
-    setIsFormModalOpen(true)
-  }
-
-  const handleEdit = (department: DepartmentDto) => {
-    setSelectedDepartment(department)
-    setModalTitle('Departman Düzenle')
-    setIsFormModalOpen(true)
-  }
-
-  const handleView = (department: DepartmentDto) => {
-    setSelectedDepartment(department)
-    setIsViewModalOpen(true)
-  }
-
-  const handleDelete = (id: string) => {
-    if (confirm('Bu departmanı silmek istediğinizden emin misiniz?')) {
-      setDepartments((prev) => prev.filter((dept) => dept.id !== id))
-    }
-  }
-
-  const handleSave = (departmentData: Partial<DepartmentDto>) => {
-    if (selectedDepartment) {
-      // Edit existing department
-      setDepartments((prev) =>
-        prev.map((dept) =>
-          dept.id === selectedDepartment.id
-            ? { ...dept, ...departmentData, lastModificationTime: new Date() }
-            : dept,
-        ),
-      )
-    } else {
-      // Add new department
-      const newDepartment: DepartmentDto = {
-        id: `dept_${Date.now()}`,
-        ...departmentData,
-        subDepartments: [],
-        creationTime: new Date(),
-        lastModificationTime: new Date(),
-      } as DepartmentDto
-      setDepartments((prev) => [...prev, newDepartment])
-    }
-    setIsFormModalOpen(false)
-  }
-
-  const handleCloseFormModal = () => {
-    setIsFormModalOpen(false)
-    setSelectedDepartment(undefined)
-  }
-
-  const handleCloseViewModal = () => {
-    setIsViewModalOpen(false)
-    setSelectedDepartment(undefined)
-  }
-
-  const handleEditFromView = (department: DepartmentDto) => {
-    setIsViewModalOpen(false)
-    handleEdit(department)
-  }
-
-  mockDepartments.forEach((dept) => {
-    if (dept.managerId) {
-      dept.manager = mockEmployees.find((emp) => emp.id === dept.managerId)
-    }
-    if (dept.costCenterId) {
-      dept.costCenter = mockCostCenters.find((cc) => cc.id === dept.costCenterId)
-    }
-  })
-
-  const filteredDepartments = departments.filter((department) => {
-    if (
-      searchTerm &&
-      !department.name.toLowerCase().includes(searchTerm.toLowerCase()) &&
-      !department.code.toLowerCase().includes(searchTerm.toLowerCase())
-    ) {
-      return false
-    }
-    if (selectedParent !== 'all' && department.parentDepartmentId !== selectedParent) {
-      return false
-    }
-    return true
-  })
-
-  const columns: Column<DepartmentDto>[] = [
-    {
-      key: 'code',
-      header: 'Departman Kodu',
-      sortable: true,
-    },
-    {
-      key: 'name',
-      header: 'Departman Adı',
-      sortable: true,
-    },
-    {
-      key: 'parentDepartment',
-      header: 'Üst Departman',
-      render: (department: DepartmentDto) => department.parentDepartment?.name || '-',
-    },
-    {
-      key: 'manager',
-      header: 'Yönetici',
-      render: (department: DepartmentDto) => department.manager?.fullName || '-',
-    },
-    {
-      key: 'employeeCount',
-      header: 'Personel Sayısı',
-      render: (department: DepartmentDto) => (
-        <div className="flex items-center gap-1">
-          <FaUsers className="w-4 h-4 text-gray-500" />
-          <span>{mockEmployees.filter((a) => a.departmentId == department.id).length || 0}</span>
-        </div>
-      ),
-    },
-    {
-      key: 'costCenter',
-      header: 'Maliyet Merkezi',
-      render: (department: DepartmentDto) => (
-        <div className="flex flex-col">
-          <span className="font-medium">{department.costCenter?.code || '-'}</span>
-          <span className="text-xs text-gray-500">{department.costCenter?.name || '-'}</span>
-        </div>
-      ),
-    },
-    {
-      key: 'budget',
-      header: 'Bütçe',
-      render: (department: DepartmentDto) => (
-        <div className="flex items-center gap-1">
-          <FaDollarSign className="w-4 h-4 text-gray-500" />
-          <span>{department.budget ? `₺${department.budget.toLocaleString()}` : '-'}</span>
-        </div>
-      ),
-    },
-    {
-      key: 'status',
-      header: 'Durum',
-      render: (department: DepartmentDto) => (
-        <span
-          className={`px-2 py-1 text-xs font-medium rounded-full ${
-            department.isActive ? 'bg-green-100 text-green-800' : 'bg-red-100 text-red-800'
-          }`}
-        >
-          {department.isActive ? 'Aktif' : 'Pasif'}
-        </span>
-      ),
-    },
-    {
-      key: 'actions',
-      header: 'İşlemler',
-      render: (department: DepartmentDto) => (
-        <div className="flex gap-2">
-          <button
-            onClick={() => handleView(department)}
-            className="p-1 text-green-600 hover:bg-green-50 rounded"
-            title="Görüntüle"
-          >
-            <FaEye className="w-4 h-4" />
-          </button>
-          <button
-            onClick={() => handleEdit(department)}
-            className="p-1 text-blue-600 hover:bg-blue-50 rounded"
-            title="Düzenle"
-          >
-            <FaEdit className="w-4 h-4" />
-          </button>
-          <button
-            onClick={() => handleDelete(department.id)}
-            className="p-1 text-red-600 hover:bg-red-50 rounded"
-            title="Sil"
-          >
-            <FaTrash className="w-4 h-4" />
-          </button>
-        </div>
-      ),
-    },
-  ]
-
-  return (
-    <Container>
-      <div className="space-y-2">
-        {/* Header */}
-        <div className="flex flex-col sm:flex-row sm:items-center justify-between gap-3">
-          <div>
-            <h2 className="text-2xl font-bold text-gray-900">Departman Yönetimi</h2>
-            <p className="text-gray-600">
-              Organizasyon yapısını ve departmanları yönetin
-            </p>
-          </div>
-          <div className="flex items-center gap-3">
-            {/* View Mode Toggle */}
-            <div className="flex bg-gray-100 rounded-lg p-0.5">
-              <button
-                onClick={() => setViewMode('list')}
-                className={`p-1.5 rounded-md transition-colors ${
-                  viewMode === 'list'
-                    ? 'bg-white text-blue-600 shadow-sm'
-                    : 'text-gray-600 hover:text-gray-900'
-                }`}
-                title="Liste Görünümü"
-              >
-                <FaList className="w-4 h-4" />
-              </button>
-              <button
-                onClick={() => setViewMode('cards')}
-                className={`p-1.5 rounded-md transition-colors ${
-                  viewMode === 'cards'
-                    ? 'bg-white text-blue-600 shadow-sm'
-                    : 'text-gray-600 hover:text-gray-900'
-                }`}
-                title="Kart Görünümü"
-              >
-                <FaTh className="w-4 h-4" />
-              </button>
-            </div>
-            <button
-              onClick={handleAdd}
-              className="flex items-center gap-2 px-3 py-1.5 text-sm bg-blue-600 text-white rounded-md hover:bg-blue-700 transition-colors"
-            >
-              <FaPlus className="w-4 h-4" />
-              Yeni Departman
-            </button>
-          </div>
-        </div>
-
-        {/* Stats Cards */}
-        <div className="grid grid-cols-1 md:grid-cols-4 gap-3">
-          <Widget
-            title="Toplam Departman"
-            value={departments.length}
-            color="blue"
-            icon="FaBuilding"
-          />
-
-          <Widget
-            title="Toplam Personel"
-            value={mockEmployees.length}
-            color="green"
-            icon="FaUsers"
-          />
-
-          <Widget
-            title="Ana Departmanlar"
-            value={departments.filter((d) => !d.parentDepartmentId).length}
-            color="purple"
-            icon="FaBuilding"
-          />
-
-          <Widget
-            title="Toplam Bütçe"
-            value={`₺${departments
-              .reduce((total, dept) => total + (dept.budget || 0), 0)
-              .toLocaleString()}`}
-            color="orange"
-            icon="FaDollarSign"
-          />
-        </div>
-
-        {/* Filters */}
-        <div className="flex flex-col sm:flex-row gap-3 items-stretch sm:items-center">
-          <div className="flex-1">
-            <input
-              type="text"
-              placeholder="Departman adı veya kodu ara..."
-              value={searchTerm}
-              onChange={(e) => setSearchTerm(e.target.value)}
-              className="w-full px-3 py-1.5 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-            />
-          </div>
-
-          <select
-            value={selectedParent}
-            onChange={(e) => setSelectedParent(e.target.value)}
-            className="px-3 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 min-w-0 sm:min-w-[200px]"
-          >
-            <option value="all">Tüm Departmanlar</option>
-            {departments
-              .filter((d) => !d.parentDepartmentId)
-              .map((dept) => (
-                <option key={dept.id} value={dept.id}>
-                  {dept.name} Alt Departmanları
-                </option>
-              ))}
-          </select>
-        </div>
-
-        {/* Data Display */}
-        {viewMode === 'list' ? (
-          <div className="bg-white rounded-lg shadow-sm border overflow-x-auto">
-            <DataTable data={filteredDepartments} columns={columns} />
-          </div>
-        ) : (
-          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-3">
-            {filteredDepartments.map((department) => (
-              <div
-                key={department.id}
-                className="bg-white rounded-lg shadow-sm border hover:shadow-md transition-shadow p-3"
-              >
-                {/* Card Header */}
-                <div className="flex items-start justify-between mb-4">
-                  <div className="flex items-center space-x-3">
-                    <div
-                      className={`w-12 h-12 rounded-lg flex items-center justify-center ${
-                        department.isActive
-                          ? 'bg-blue-100 text-blue-600'
-                          : 'bg-gray-100 text-gray-500'
-                      }`}
-                    >
-                      <FaBuilding className="w-6 h-6" />
-                    </div>
-                    <div>
-                      <h3 className="font-semibold text-sm text-gray-900 truncate">
-                        {department.name}
-                      </h3>
-                      <p className="text-gray-600">{department.code}</p>
-                    </div>
-                  </div>
-                  <span
-                    className={`px-2 py-1 text-xs font-medium rounded-full ${
-                      department.isActive
-                        ? 'bg-green-100 text-green-800'
-                        : 'bg-red-100 text-red-800'
-                    }`}
-                  >
-                    {department.isActive ? 'Aktif' : 'Pasif'}
-                  </span>
-                </div>
-
-                {/* Card Content */}
-                <div className="space-y-2">
-                  {department.parentDepartment && (
-                    <div className="flex items-center text-xs text-gray-600">
-                      <FaBuilding className="w-4 h-4 mr-2 text-gray-400" />
-                      <span>Üst: {department.parentDepartment.name}</span>
-                    </div>
-                  )}
-
-                  {department.manager && (
-                    <div className="flex items-center text-xs text-gray-600">
-                      <FaUsers className="w-4 h-4 mr-2 text-gray-400" />
-                      <span>Yönetici: {department.manager.fullName}</span>
-                    </div>
-                  )}
-
-                  <div className="flex items-center text-xs text-gray-600">
-                    <FaUsers className="w-4 h-4 mr-2 text-gray-400" />
-                    <span>
-                      {mockEmployees.filter((emp) => emp.departmentId === department.id).length}{' '}
-                      Personel
-                    </span>
-                  </div>
-
-                  {department.budget && (
-                    <div className="flex items-center text-xs text-gray-600">
-                      <FaDollarSign className="w-4 h-4 mr-2 text-gray-400" />
-                      <span>₺{department.budget.toLocaleString()}</span>
-                    </div>
-                  )}
-
-                  {department.costCenter && (
-                    <div className="text-xs text-gray-600">
-                      <div className="font-medium">{department.costCenter.code}</div>
-                      <div className="text-xs text-gray-500">{department.costCenter.name}</div>
-                    </div>
-                  )}
-                </div>
-
-                {/* Card Actions */}
-                <div className="flex justify-end space-x-1 mt-3 pt-3 border-t border-gray-100">
-                  <button
-                    onClick={() => handleView(department)}
-                    className="p-1.5 text-green-600 hover:bg-green-50 rounded-lg transition-colors"
-                    title="Görüntüle"
-                  >
-                    <FaEye className="w-4 h-4" />
-                  </button>
-                  <button
-                    onClick={() => handleEdit(department)}
-                    className="p-1.5 text-blue-600 hover:bg-blue-50 rounded-lg transition-colors"
-                    title="Düzenle"
-                  >
-                    <FaEdit className="w-4 h-4" />
-                  </button>
-                  <button
-                    onClick={() => handleDelete(department.id)}
-                    className="p-1.5 text-red-600 hover:bg-red-50 rounded-lg transition-colors"
-                    title="Sil"
-                  >
-                    <FaTrash className="w-4 h-4" />
-                  </button>
-                </div>
-              </div>
-            ))}
-          </div>
-        )}
-
-        {filteredDepartments.length === 0 && (
-          <div className="text-center py-12">
-            <FaBuilding className="w-12 h-12 text-gray-400 mx-auto mb-4" />
-            <h3 className="text-lg font-medium text-gray-900 mb-2">Departman bulunamadı</h3>
-            <p className="text-gray-500">Arama kriterlerinizi değiştirmeyi deneyin.</p>
-          </div>
-        )}
-      </div>
-
-      {/* Modals */}
-      <DepartmentFormModal
-        isOpen={isFormModalOpen}
-        onClose={handleCloseFormModal}
-        onSave={handleSave}
-        department={selectedDepartment}
-        title={modalTitle}
-      />
-
-      <DepartmentViewModal
-        isOpen={isViewModalOpen}
-        onClose={handleCloseViewModal}
-        department={selectedDepartment || null}
-        onEdit={handleEditFromView}
-      />
-    </Container>
-  )
-}
-
-export default DepartmentManagement
diff --git a/ui/src/views/hr/components/DepartmentViewModal.tsx b/ui/src/views/hr/components/DepartmentViewModal.tsx
deleted file mode 100644
index a51b825c..00000000
--- a/ui/src/views/hr/components/DepartmentViewModal.tsx
+++ /dev/null
@@ -1,272 +0,0 @@
-import React from "react";
-import {
-  FaTimes,
-  FaBuilding,
-  FaUser,
-  FaDollarSign,
-  FaUsers,
-  FaCalendar,
-  FaEdit,
-} from "react-icons/fa";
-import { DepartmentDto } from "../../../types/hr";
-import { mockEmployees } from "../../../mocks/mockEmployees";
-
-interface DepartmentViewModalProps {
-  isOpen: boolean;
-  onClose: () => void;
-  department: DepartmentDto | null;
-  onEdit?: (department: DepartmentDto) => void;
-}
-
-const DepartmentViewModal: React.FC<DepartmentViewModalProps> = ({
-  isOpen,
-  onClose,
-  department,
-  onEdit,
-}) => {
-  const employeeCount = mockEmployees.filter(
-    (emp) => emp.departmentId === department?.id
-  ).length;
-  const departmentEmployees = mockEmployees.filter(
-    (emp) => emp.departmentId === department?.id
-  );
-
-  return (
-    isOpen &&
-    department && (
-      <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
-        <div className="bg-white rounded-lg p-4 w-full max-w-2xl max-h-[90vh] overflow-y-auto">
-          <div className="flex items-center justify-between mb-3">
-            <h2 className="text-base font-bold text-gray-900">
-              Departman Detayları
-            </h2>
-            <div className="flex items-center gap-2">
-              {onEdit && (
-                <button
-                  onClick={() => onEdit(department)}
-                  className="flex items-center gap-1 px-2 py-1 text-xs text-blue-600 bg-blue-50 rounded-md hover:bg-blue-100 transition-colors"
-                >
-                  <FaEdit className="w-4 h-4" />
-                  Düzenle
-                </button>
-              )}
-              <button
-                onClick={onClose}
-                className="p-2 text-gray-400 hover:text-gray-600"
-              >
-                <FaTimes className="w-5 h-5" />
-              </button>
-            </div>
-          </div>
-
-          <div className="space-y-3">
-            {/* Temel Bilgiler */}
-            <div className="bg-gray-50 rounded-lg p-3">
-              <h3 className="text-base font-semibold text-gray-900 mb-3 flex items-center gap-2">
-                <FaBuilding className="w-5 h-5" />
-                Temel Bilgiler
-              </h3>
-              <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
-                <div>
-                  <label className="block text-xs font-medium text-gray-600">
-                    Departman Kodu
-                  </label>
-                  <p className="text-sm font-semibold text-gray-900">
-                    {department.code}
-                  </p>
-                </div>
-                <div>
-                  <label className="block text-xs font-medium text-gray-600">
-                    Departman Adı
-                  </label>
-                  <p className="text-sm font-semibold text-gray-900">
-                    {department.name}
-                  </p>
-                </div>
-                {department.description && (
-                  <div className="md:col-span-2">
-                    <label className="block text-xs font-medium text-gray-600">
-                      Açıklama
-                    </label>
-                    <p className="text-sm text-gray-900 mt-1">
-                      {department.description}
-                    </p>
-                  </div>
-                )}
-                <div>
-                  <label className="block text-xs font-medium text-gray-600">
-                    Durum
-                  </label>
-                  <span
-                    className={`inline-flex px-2 py-1 text-xs font-medium rounded-full ${
-                      department.isActive
-                        ? "bg-green-100 text-green-800"
-                        : "bg-red-100 text-red-800"
-                    }`}
-                  >
-                    {department.isActive ? "Aktif" : "Pasif"}
-                  </span>
-                </div>
-              </div>
-            </div>
-
-            {/* Hiyerarşi ve İlişkiler */}
-            <div className="bg-blue-50 rounded-lg p-3">
-              <h3 className="text-base font-semibold text-gray-900 mb-3 flex items-center gap-2">
-                <FaUser className="w-5 h-5" />
-                Hiyerarşi ve İlişkiler
-              </h3>
-              <div className="grid grid-cols-1 md:grid-cols-2 gap-3 text-sm">
-                <div>
-                  <label className="block text-xs font-medium text-gray-600">
-                    Üst Departman
-                  </label>
-                  <p className="text-gray-900 mt-1">
-                    {department.parentDepartment?.name || "Ana Departman"}
-                  </p>
-                </div>
-                <div>
-                  <label className="block text-xs font-medium text-gray-600">
-                    Departman Yöneticisi
-                  </label>
-                  <p className="text-gray-900 mt-1">
-                    {department.manager?.fullName || "Atanmamış"}
-                  </p>
-                  {department.manager && (
-                    <p className="text-sm text-gray-500">
-                      {department.manager.code}
-                    </p>
-                  )}
-                </div>
-                <div>
-                  <label className="block text-xs font-medium text-gray-600">
-                    Maliyet Merkezi
-                  </label>
-                  <p className="text-gray-900 mt-1">
-                    {department.costCenter?.name || "Atanmamış"}
-                  </p>
-                  {department.costCenter && (
-                    <p className="text-sm text-gray-500">
-                      {department.costCenter.code}
-                    </p>
-                  )}
-                </div>
-              </div>
-            </div>
-
-            {/* Finansal Bilgiler */}
-            <div className="bg-green-50 rounded-lg p-3">
-              <h3 className="text-base font-semibold text-gray-900 mb-3 flex items-center gap-2">
-                <FaDollarSign className="w-5 h-5" />
-                Finansal Bilgiler
-              </h3>
-              <div className="grid grid-cols-1 md:grid-cols-3 gap-3">
-                <div>
-                  <label className="block text-xs font-medium text-gray-600">
-                    Departman Bütçesi
-                  </label>
-                  <p className="text-sm font-semibold text-gray-900">
-                    {department.budget
-                      ? `₺${department.budget.toLocaleString()}`
-                      : "Belirtilmemiş"}
-                  </p>
-                </div>
-              </div>
-            </div>
-
-            {/* Personel Bilgileri */}
-            <div className="bg-purple-50 rounded-lg p-3">
-              <h3 className="text-base font-semibold text-gray-900 mb-3 flex items-center gap-2">
-                <FaUsers className="w-5 h-5" />
-                Personel Bilgileri
-              </h3>
-              <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
-                <div>
-                  <label className="block text-xs font-medium text-gray-600">
-                    Toplam Personel Sayısı
-                  </label>
-                  <p className="text-lg font-bold text-gray-900">
-                    {employeeCount}
-                  </p>
-                </div>
-              </div>
-
-              {departmentEmployees.length > 0 && (
-                <div className="mt-3">
-                  <label className="block text-sm font-medium text-gray-600 mb-2">
-                    Departman Personeli
-                  </label>
-                  <div className="max-h-32 overflow-y-auto">
-                    <div className="space-y-1">
-                      {departmentEmployees.map((employee) => (
-                        <div
-                          key={employee.id}
-                          className="flex items-center justify-between p-1.5 bg-white rounded border"
-                        >
-                          <div>
-                            <p className="font-medium text-gray-900">
-                              {employee.fullName}
-                            </p>
-                            <p className="text-sm text-gray-500">
-                              {employee.code}
-                            </p>
-                          </div>
-                          <div className="text-sm text-gray-600">
-                            {employee.jobPosition?.name ||
-                              "Pozisyon belirtilmemiş"}
-                          </div>
-                        </div>
-                      ))}
-                    </div>
-                  </div>
-                </div>
-              )}
-            </div>
-
-            {/* Sistem Bilgileri */}
-            <div className="bg-gray-50 rounded-lg p-3">
-              <h3 className="text-base font-semibold text-gray-900 mb-3 flex items-center gap-2">
-                <FaCalendar className="w-5 h-5" />
-                Sistem Bilgileri
-              </h3>
-              <div className="grid grid-cols-1 md:grid-cols-2 gap-3 text-sm">
-                <div>
-                  <label className="block text-xs font-medium text-gray-600">
-                    Oluşturulma Tarihi
-                  </label>
-                  <p className="text-gray-900">
-                    {new Date(department.creationTime).toLocaleDateString(
-                      "tr-TR"
-                    )}
-                  </p>
-                </div>
-                <div>
-                  <label className="block text-xs font-medium text-gray-600">
-                    Son Güncelleme
-                  </label>
-                  <p className="text-gray-900">
-                    {new Date(
-                      department.lastModificationTime
-                    ).toLocaleDateString("tr-TR")}
-                  </p>
-                </div>
-              </div>
-            </div>
-          </div>
-
-          {/* Close Button */}
-          <div className="flex justify-end pt-3 border-t mt-3">
-            <button
-              onClick={onClose}
-              className="px-3 py-1 text-sm text-gray-700 bg-gray-200 rounded-md hover:bg-gray-300 transition-colors"
-            >
-              Kapat
-            </button>
-          </div>
-        </div>
-      </div>
-    )
-  );
-};
-
-export default DepartmentViewModal;
diff --git a/ui/src/views/hr/components/EmployeeCards.tsx b/ui/src/views/hr/components/EmployeeCards.tsx
deleted file mode 100644
index 31ccd253..00000000
--- a/ui/src/views/hr/components/EmployeeCards.tsx
+++ /dev/null
@@ -1,182 +0,0 @@
-import React, { useState } from 'react'
-import {
-  FaUser,
-  FaEnvelope,
-  FaPhone,
-  FaCalendar,
-  FaCertificate,
-  FaEdit,
-  FaEye,
-  FaTrash,
-  FaPlus,
-} from 'react-icons/fa'
-import { EmployeeDto, EmployeeStatusEnum } from '../../../types/hr'
-import { mockEmployees } from '../../../mocks/mockEmployees'
-import { getEmployeeStatusColor, getEmployeeStatusText } from '../../../utils/erp'
-import { Container } from '@/components/shared'
-
-const EmployeeCards: React.FC = () => {
-  const [employees] = useState<EmployeeDto[]>(mockEmployees)
-  const [selectedDepartment, setSelectedDepartment] = useState<string>('all')
-  const [selectedStatus, setSelectedStatus] = useState<string>('all')
-
-  const handleEdit = (employee: EmployeeDto) => {
-    console.log('Edit employee:', employee)
-    // Implement edit functionality
-  }
-
-  const handleView = (employee: EmployeeDto) => {
-    console.log('View employee:', employee)
-    // Implement view functionality
-  }
-
-  const handleDelete = (id: string) => {
-    console.log('Delete employee:', id)
-    // Implement delete functionality
-  }
-
-  const handleAdd = () => {
-    console.log('Add new employee')
-    // Implement add functionality
-  }
-
-  const filteredEmployees = employees.filter((employee) => {
-    if (selectedDepartment !== 'all' && employee.department?.id !== selectedDepartment) {
-      return false
-    }
-    if (selectedStatus !== 'all' && employee.employeeStatus !== selectedStatus) {
-      return false
-    }
-    return true
-  })
-
-  return (
-    <Container>
-      <div className="space-y-2">
-        {/* Header with Add Button */}
-        <div className="flex justify-between items-center">
-          <h2 className="text-xl font-bold text-gray-900">Personel Kartları</h2>
-          <button
-            onClick={handleAdd}
-            className="px-2 py-1.5 text-sm bg-blue-600 text-white rounded-md hover:bg-blue-700 transition-colors flex items-center gap-2"
-          >
-            <FaPlus className="w-4 h-4" />
-            Yeni Personel
-          </button>
-        </div>
-
-        {/* Filters */}
-        <div className="flex gap-3 mb-4">
-          <select
-            value={selectedDepartment}
-            onChange={(e) => setSelectedDepartment(e.target.value)}
-            className="px-2 py-1.5 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-          >
-            <option value="all">Tüm Departmanlar</option>
-            {/* Department options would be populated from departments list */}
-          </select>
-
-          <select
-            value={selectedStatus}
-            onChange={(e) => setSelectedStatus(e.target.value)}
-            className="px-2 py-1.5 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-          >
-            <option value="all">Tüm Durumlar</option>
-            {Object.values(EmployeeStatusEnum).map((status) => (
-              <option key={status} value={status}>
-                {getEmployeeStatusText(status)}
-              </option>
-            ))}
-          </select>
-        </div>
-
-        {/* Employee Cards Grid */}
-        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4">
-          {filteredEmployees.map((employee) => (
-            <div
-              key={employee.id}
-              className="bg-white rounded-lg shadow-sm p-3 hover:shadow-md transition-shadow border"
-            >
-              {/* Header */}
-              <div className="flex items-center justify-between mb-3">
-                <div className="w-10 h-10 bg-blue-100 rounded-full flex items-center justify-center">
-                  <FaUser className="w-6 h-6 text-blue-600" />
-                </div>
-                <span
-                  className={`px-2 py-1 text-xs font-medium rounded-full ${getEmployeeStatusColor(
-                    employee.employeeStatus,
-                  )}`}
-                >
-                  {getEmployeeStatusText(employee.employeeStatus)}
-                </span>
-              </div>
-
-              {/* Employee Info */}
-              <div className="space-y-1 mb-3">
-                <h3 className="font-semibold text-sm text-gray-900">{employee.fullName}</h3>
-                <p className="text-xs text-gray-600">{employee.jobPosition?.name}</p>
-                <p className="text-sm text-gray-500">{employee.department?.name}</p>
-              </div>
-
-              {/* Contact Info */}
-              <div className="space-y-1.5 mb-3">
-                <div className="flex items-center text-xs text-gray-600">
-                  <FaEnvelope className="w-4 h-4 mr-2" />
-                  <span className="truncate">{employee.email}</span>
-                </div>
-                {employee.phone && (
-                  <div className="flex items-center text-xs text-gray-600">
-                    <FaPhone className="w-4 h-4 mr-2" />
-                    <span>{employee.phone}</span>
-                  </div>
-                )}
-                <div className="flex items-center text-xs text-gray-600">
-                  <FaCalendar className="w-4 h-4 mr-2" />
-                  <span>{new Date(employee.hireDate).toLocaleDateString('tr-TR')}</span>
-                </div>
-                <div className="flex items-center text-xs text-gray-600">
-                  <FaCertificate className="w-4 h-4 mr-2" />
-                  <span>{employee.code}</span>
-                </div>
-              </div>
-
-              {/* Actions */}
-              <div className="flex gap-2 pt-3 border-t">
-                <button
-                  onClick={() => handleView(employee)}
-                  className="flex-1 px-2 py-1 text-xs bg-blue-50 text-blue-600 rounded-md hover:bg-blue-100 transition-colors flex items-center justify-center gap-1"
-                >
-                  <FaEye className="w-4 h-4" />
-                  Görüntüle
-                </button>
-                <button
-                  onClick={() => handleEdit(employee)}
-                  className="flex-1 px-2 py-1 text-xs bg-green-50 text-green-600 rounded-md hover:bg-green-100 transition-colors flex items-center justify-center gap-1"
-                >
-                  <FaEdit className="w-4 h-4" />
-                  Düzenle
-                </button>
-                <button
-                  onClick={() => handleDelete(employee.id)}
-                  className="px-2 py-1 text-xs bg-red-50 text-red-600 rounded-md hover:bg-red-100 transition-colors flex items-center justify-center"
-                >
-                  <FaTrash className="w-4 h-4" />
-                </button>
-              </div>
-            </div>
-          ))}
-        </div>
-
-        {filteredEmployees.length === 0 && (
-          <div className="text-center py-12">
-            <FaUser className="w-10 h-10 text-gray-400 mx-auto mb-3" />
-            <h3 className="text-base font-medium text-gray-900 mb-2">Personel bulunamadı</h3>
-            <p className="text-gray-500">Seçilen kriterlere uygun personel bulunmamaktadır.</p>
-          </div>
-        )}
-      </div>
-    </Container>
-  )
-}
-
-export default EmployeeCards
diff --git a/ui/src/views/hr/components/EmployeeForm.tsx b/ui/src/views/hr/components/EmployeeForm.tsx
deleted file mode 100644
index 80f05cd9..00000000
--- a/ui/src/views/hr/components/EmployeeForm.tsx
+++ /dev/null
@@ -1,830 +0,0 @@
-import React, { useState, useEffect, useCallback } from 'react'
-import { useNavigate, useParams } from 'react-router-dom'
-import {
-  FaSave,
-  FaTimes,
-  FaUser,
-  FaBriefcase,
-  FaDollarSign,
-  FaMapMarkerAlt,
-  FaPhone,
-  FaEnvelope,
-} from 'react-icons/fa'
-import LoadingSpinner from '../../../components/common/LoadingSpinner'
-import { mockDepartments } from '../../../mocks/mockDepartments'
-import { mockJobPositions } from '../../../mocks/mockJobPositions'
-import {
-  DepartmentDto,
-  EmployeeDto,
-  EmployeeStatusEnum,
-  EmploymentTypeEnum,
-  GenderEnum,
-  JobLevelEnum,
-  JobPositionDto,
-  MaritalStatusEnum,
-} from '../../../types/hr'
-import { mockEmployees } from '../../../mocks/mockEmployees'
-import { Container } from '@/components/shared'
-import { ROUTES_ENUM } from '@/routes/route.constant'
-import { mockCurrencies } from '@/mocks/mockCurrencies'
-import {
-  getEmployeeStatusText,
-  getEmploymentTypeText,
-  getFrequencyUnitText,
-  getGenderText,
-  getMaritalStatusText,
-} from '@/utils/erp'
-import { FrequencyUnitEnum } from '@/types/pm'
-
-interface ValidationErrors {
-  [key: string]: string
-}
-
-const EmployeeForm: React.FC = () => {
-  const navigate = useNavigate()
-  const { id } = useParams<{ id: string }>()
-  const isEdit = Boolean(id)
-
-  const [loading, setLoading] = useState(false)
-  const [saving, setSaving] = useState(false)
-  const [errors, setErrors] = useState<ValidationErrors>({})
-  const [departments, setDepartments] = useState<DepartmentDto[]>([])
-  const [jobPositions, setJobPositions] = useState<JobPositionDto[]>([])
-  const [managers, setManagers] = useState<EmployeeDto[]>([])
-
-  const [formData, setFormData] = useState<EmployeeDto>({
-    id: '',
-    code: '',
-    firstName: '',
-    lastName: '',
-    fullName: '',
-    email: '',
-    phone: '',
-    personalPhone: '',
-    nationalId: '',
-    birthDate: new Date(),
-    gender: GenderEnum.Male,
-    maritalStatus: MaritalStatusEnum.Single,
-    address: {
-      street: '',
-      city: '',
-      state: '',
-      postalCode: '',
-      country: '',
-    },
-    emergencyContact: {
-      name: '',
-      relationship: '',
-      phone: '',
-      email: '',
-      address: {
-        street: '',
-        city: '',
-        state: '',
-        postalCode: '',
-        country: '',
-      },
-    },
-    hireDate: new Date(),
-    employmentType: EmploymentTypeEnum.FullTime,
-    jobPositionId: '',
-    departmentId: '',
-    baseSalary: 0,
-    currency: 'TRY',
-    payrollGroup: '',
-    bankAccountId: '',
-    workLocation: '',
-    badgeNumber: '',
-    employeeStatus: EmployeeStatusEnum.Active,
-    isActive: true,
-    leaves: [],
-    evaluations: [],
-    trainings: [],
-    disciplinaryActions: [],
-    creationTime: new Date(),
-    lastModificationTime: new Date(),
-  })
-
-  const loadData = useCallback(async () => {
-    try {
-      const mockManagers = mockEmployees.filter(
-        (emp) => emp.jobPosition?.level === JobLevelEnum.Manager,
-      )
-
-      setDepartments(mockDepartments)
-      setJobPositions(mockJobPositions)
-      setManagers(mockManagers)
-    } catch (error) {
-      console.error('Error loading data:', error)
-    }
-  }, [])
-
-  const loadFormData = useCallback(async () => {
-    setLoading(true)
-    try {
-      if (isEdit && id) {
-        // Simulate API call
-        await new Promise((resolve) => setTimeout(resolve, 1000))
-
-        // Mock employee data
-        const mockEmployee = mockEmployees.find((emp) => emp.id === id)!
-        setFormData(mockEmployee)
-      }
-    } catch (error) {
-      console.error('Error loading form data:', error)
-    } finally {
-      setLoading(false)
-    }
-  }, [isEdit, id])
-
-  useEffect(() => {
-    loadData()
-    loadFormData()
-  }, [loadData, loadFormData])
-
-  const validateForm = (): boolean => {
-    const newErrors: ValidationErrors = {}
-
-    if (!formData.code.trim()) {
-      newErrors.code = 'Personel kodu zorunludur'
-    }
-    if (!formData.firstName.trim()) {
-      newErrors.firstName = 'Ad zorunludur'
-    }
-    if (!formData.lastName.trim()) {
-      newErrors.lastName = 'Soyad zorunludur'
-    }
-    if (!formData.email.trim()) {
-      newErrors.email = 'Email zorunludur'
-    } else if (!/\S+@\S+\.\S+/.test(formData.email)) {
-      newErrors.email = 'Geçerli bir email adresi girin'
-    }
-    if (!formData.nationalId.trim()) {
-      newErrors.nationalId = 'TC Kimlik No zorunludur'
-    } else if (formData.nationalId.length !== 11) {
-      newErrors.nationalId = 'TC Kimlik No 11 haneli olmalıdır'
-    }
-    if (!formData.birthDate) {
-      newErrors.birthDate = 'Doğum tarihi zorunludur'
-    }
-    if (!formData.hireDate) {
-      newErrors.hireDate = 'İşe giriş tarihi zorunludur'
-    }
-    if (!formData.departmentId) {
-      newErrors.departmentId = 'Departman seçilmelidir'
-    }
-    if (!formData.jobPosition) {
-      newErrors.jobPositionId = 'Pozisyon seçilmelidir'
-    }
-    if (!formData.employmentType) {
-      newErrors.employmentType = 'Çalışma tipi seçilmelidir'
-    }
-    if (formData.baseSalary <= 0) {
-      newErrors.baseSalary = "Maaş 0'dan büyük olmalıdır"
-    }
-
-    setErrors(newErrors)
-    return Object.keys(newErrors).length === 0
-  }
-
-  const handleInputChange = (field: keyof EmployeeDto, value: string | number | boolean) => {
-    setFormData((prev) => ({
-      ...prev,
-      [field]: value,
-    }))
-
-    // Clear error when user starts typing
-    if (errors[field]) {
-      setErrors((prev) => ({
-        ...prev,
-        [field]: '',
-      }))
-    }
-  }
-
-  const handleSubmit = async (e: React.FormEvent) => {
-    e.preventDefault()
-
-    if (!validateForm()) {
-      return
-    }
-
-    setSaving(true)
-    try {
-      // Simulate API call
-      await new Promise((resolve) => setTimeout(resolve, 2000))
-
-      console.log('Employee data:', {
-        ...formData,
-        id: isEdit ? id : undefined,
-      })
-
-      // Show success message
-      alert(isEdit ? 'Personel başarıyla güncellendi!' : 'Personel başarıyla oluşturuldu!')
-
-      // Navigate back to list
-      navigate(ROUTES_ENUM.protected.hr.employees)
-    } catch (error) {
-      console.error('Error saving employee:', error)
-      alert('Bir hata oluştu. Lütfen tekrar deneyin.')
-    } finally {
-      setSaving(false)
-    }
-  }
-
-  const handleCancel = () => {
-    navigate(ROUTES_ENUM.protected.hr.employees)
-  }
-
-  if (loading) {
-    return <LoadingSpinner />
-  }
-
-  return (
-    <Container>
-      <div className="space-y-2">
-        {/* Header */}
-        <div className="flex items-center justify-between">
-          <div>
-            <h2 className="text-2xl font-bold text-gray-900">
-              {isEdit ? 'Personel Düzenle' : 'Yeni Personel'}
-            </h2>
-            <p className="text-gray-600">
-              {isEdit
-                ? 'Mevcut personel bilgilerini güncelleyin'
-                : 'Yeni personel bilgilerini girin'}
-            </p>
-          </div>
-        </div>
-
-        {/* Form */}
-        <form onSubmit={handleSubmit} className="space-y-3">
-          {/* Personal Information */}
-          <div className="bg-white shadow rounded-lg">
-            <div className="px-3 py-2 border-b border-gray-200">
-              <h3 className="text-base font-medium text-gray-900 flex items-center">
-                <FaUser className="w-5 h-5 mr-2" />
-                Kişisel Bilgiler
-              </h3>
-            </div>
-
-            <div className="p-3 space-y-3">
-              <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    Personel Kodu *
-                  </label>
-                  <input
-                    autoFocus
-                    type="text"
-                    value={formData.code}
-                    onChange={(e) => handleInputChange('code', e.target.value)}
-                    className={`block w-full px-2 py-1 text-sm border rounded-md shadow-sm focus:outline-none focus:ring-1 ${
-                      errors.code
-                        ? 'border-red-300 focus:border-red-500 focus:ring-red-500'
-                        : 'border-gray-300 focus:border-blue-500 focus:ring-blue-500'
-                    }`}
-                    placeholder="Örn: EMP001"
-                  />
-                  {errors.employeeCode && (
-                    <p className="mt-1 text-sm text-red-600">{errors.employeeCode}</p>
-                  )}
-                </div>
-
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    TC Kimlik No *
-                  </label>
-                  <input
-                    type="text"
-                    maxLength={11}
-                    value={formData.nationalId}
-                    onChange={(e) => handleInputChange('nationalId', e.target.value)}
-                    className={`block w-full px-2 py-1 text-sm border rounded-md shadow-sm focus:outline-none focus:ring-1 ${
-                      errors.nationalId
-                        ? 'border-red-300 focus:border-red-500 focus:ring-red-500'
-                        : 'border-gray-300 focus:border-blue-500 focus:ring-blue-500'
-                    }`}
-                    placeholder="12345678901"
-                  />
-                  {errors.nationalId && (
-                    <p className="mt-1 text-sm text-red-600">{errors.nationalId}</p>
-                  )}
-                </div>
-              </div>
-
-              <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">Ad *</label>
-                  <input
-                    type="text"
-                    value={formData.firstName}
-                    onChange={(e) => handleInputChange('firstName', e.target.value)}
-                    className={`block w-full px-2 py-1 text-sm border rounded-md shadow-sm focus:outline-none focus:ring-1 ${
-                      errors.firstName
-                        ? 'border-red-300 focus:border-red-500 focus:ring-red-500'
-                        : 'border-gray-300 focus:border-blue-500 focus:ring-blue-500'
-                    }`}
-                    placeholder="Ad"
-                  />
-                  {errors.firstName && (
-                    <p className="mt-1 text-sm text-red-600">{errors.firstName}</p>
-                  )}
-                </div>
-
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">Soyad *</label>
-                  <input
-                    type="text"
-                    value={formData.lastName}
-                    onChange={(e) => handleInputChange('lastName', e.target.value)}
-                    className={`block w-full px-2 py-1 text-sm border rounded-md shadow-sm focus:outline-none focus:ring-1 ${
-                      errors.lastName
-                        ? 'border-red-300 focus:border-red-500 focus:ring-red-500'
-                        : 'border-gray-300 focus:border-blue-500 focus:ring-blue-500'
-                    }`}
-                    placeholder="Soyad"
-                  />
-                  {errors.lastName && (
-                    <p className="mt-1 text-sm text-red-600">{errors.lastName}</p>
-                  )}
-                </div>
-              </div>
-
-              <div className="grid grid-cols-1 md:grid-cols-3 gap-3">
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    Doğum Tarihi *
-                  </label>
-                  <input
-                    type="date"
-                    value={formData.birthDate && formData.birthDate.toString().split('T')[0]}
-                    onChange={(e) => handleInputChange('birthDate', e.target.value)}
-                    className={`block w-full px-2 py-1 text-sm border rounded-md shadow-sm focus:outline-none focus:ring-1 ${
-                      errors.birthDate
-                        ? 'border-red-300 focus:border-red-500 focus:ring-red-500'
-                        : 'border-gray-300 focus:border-blue-500 focus:ring-blue-500'
-                    }`}
-                  />
-                  {errors.birthDate && (
-                    <p className="mt-1 text-sm text-red-600">{errors.birthDate}</p>
-                  )}
-                </div>
-
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">Cinsiyet</label>
-                  <select
-                    value={formData.gender}
-                    onChange={(e) => handleInputChange('gender', e.target.value)}
-                    className="block w-full px-2 py-1 text-sm border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-1 focus:border-blue-500 focus:ring-blue-500"
-                  >
-                    <option value="">Cinsiyet seçin</option>
-                    {Object.values(GenderEnum).map((gender) => (
-                      <option key={gender} value={gender}>
-                        {getGenderText(gender)}
-                      </option>
-                    ))}
-                  </select>
-                </div>
-
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    Medeni Durum
-                  </label>
-                  <select
-                    value={formData.maritalStatus}
-                    onChange={(e) => handleInputChange('maritalStatus', e.target.value)}
-                    className="block w-full px-2 py-1 text-sm border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-1 focus:border-blue-500 focus:ring-blue-500"
-                  >
-                    <option value="">Medeni durum seçin</option>
-                    {Object.values(MaritalStatusEnum).map((status) => (
-                      <option key={status} value={status}>
-                        {getMaritalStatusText(status)}
-                      </option>
-                    ))}
-                  </select>
-                </div>
-              </div>
-            </div>
-          </div>
-
-          {/* Contact Information */}
-          <div className="bg-white shadow rounded-lg">
-            <div className="px-3 py-2 border-b border-gray-200">
-              <h3 className="text-base font-medium text-gray-900 flex items-center">
-                <FaPhone className="w-5 h-5 mr-2" />
-                İletişim Bilgileri
-              </h3>
-            </div>
-
-            <div className="p-3 space-y-3">
-              <div className="grid grid-cols-1 md:grid-cols-3 gap-3">
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">Email *</label>
-                  <div className="relative">
-                    <FaEnvelope className="absolute left-3 top-2.5 h-4 w-4 text-gray-400" />
-                    <input
-                      type="email"
-                      value={formData.email}
-                      onChange={(e) => handleInputChange('email', e.target.value)}
-                      className={`block w-full pl-10 pr-3 py-1 text-sm border rounded-md shadow-sm focus:outline-none focus:ring-1 ${
-                        errors.email
-                          ? 'border-red-300 focus:border-red-500 focus:ring-red-500'
-                          : 'border-gray-300 focus:border-blue-500 focus:ring-blue-500'
-                      }`}
-                      placeholder="email@company.com"
-                    />
-                  </div>
-                  {errors.email && <p className="mt-1 text-sm text-red-600">{errors.email}</p>}
-                </div>
-
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    İş Telefonu
-                  </label>
-                  <input
-                    type="tel"
-                    value={formData.phone}
-                    onChange={(e) => handleInputChange('phone', e.target.value)}
-                    className="block w-full px-2 py-1 text-sm border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-1 focus:border-blue-500 focus:ring-blue-500"
-                    placeholder="+90 212 555 0123"
-                  />
-                </div>
-
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    Kişisel Telefon
-                  </label>
-                  <input
-                    type="tel"
-                    value={formData.personalPhone}
-                    onChange={(e) => handleInputChange('personalPhone', e.target.value)}
-                    className="block w-full px-2 py-1 text-sm border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-1 focus:border-blue-500 focus:ring-blue-500"
-                    placeholder="+90 532 555 0123"
-                  />
-                </div>
-              </div>
-            </div>
-          </div>
-
-          {/* Address */}
-          <div className="bg-white shadow rounded-lg">
-            <div className="px-3 py-2 border-b border-gray-200">
-              <h3 className="text-base font-medium text-gray-900 flex items-center">
-                <FaMapMarkerAlt className="w-5 h-5 mr-2" />
-                Adres Bilgileri
-              </h3>
-            </div>
-          </div>
-
-          {/* Employment Information */}
-          <div className="bg-white shadow rounded-lg">
-            <div className="px-3 py-2 border-b border-gray-200">
-              <h3 className="text-base font-medium text-gray-900 flex items-center">
-                <FaBriefcase className="w-5 h-5 mr-2" />
-                İş Bilgileri
-              </h3>
-            </div>
-
-            <div className="p-4 space-y-3">
-              <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    İşe Giriş Tarihi *
-                  </label>
-                  <input
-                    type="date"
-                    value={formData.hireDate && formData.hireDate.toString().split('T')[0]}
-                    onChange={(e) => handleInputChange('hireDate', e.target.value)}
-                    className={`block w-full px-2 py-1 text-sm border rounded-md shadow-sm focus:outline-none focus:ring-1 ${
-                      errors.hireDate
-                        ? 'border-red-300 focus:border-red-500 focus:ring-red-500'
-                        : 'border-gray-300 focus:border-blue-500 focus:ring-blue-500'
-                    }`}
-                  />
-                  {errors.hireDate && (
-                    <p className="mt-1 text-sm text-red-600">{errors.hireDate}</p>
-                  )}
-                </div>
-
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    Çalışma Tipi *
-                  </label>
-                  <select
-                    value={formData.employmentType}
-                    onChange={(e) => handleInputChange('employmentType', e.target.value)}
-                    className={`block w-full px-2 py-1 text-sm border rounded-md shadow-sm focus:outline-none focus:ring-1 ${
-                      errors.employmentType
-                        ? 'border-red-300 focus:border-red-500 focus:ring-red-500'
-                        : 'border-gray-300 focus:border-blue-500 focus:ring-blue-500'
-                    }`}
-                  >
-                    <option value="">Tip seçin</option>
-                    {Object.values(EmploymentTypeEnum).map((type) => (
-                      <option key={type} value={type}>
-                        {getEmploymentTypeText(type)}
-                      </option>
-                    ))}
-                  </select>
-                  {errors.employmentType && (
-                    <p className="mt-1 text-sm text-red-600">{errors.employmentType}</p>
-                  )}
-                </div>
-              </div>
-
-              <div className="grid grid-cols-1 md:grid-cols-3 gap-3">
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    Departman *
-                  </label>
-                  <select
-                    value={formData.departmentId}
-                    onChange={(e) => handleInputChange('departmentId', e.target.value)}
-                    className={`block w-full px-2 py-1 text-sm border rounded-md shadow-sm focus:outline-none focus:ring-1 ${
-                      errors.departmentId
-                        ? 'border-red-300 focus:border-red-500 focus:ring-red-500'
-                        : 'border-gray-300 focus:border-blue-500 focus:ring-blue-500'
-                    }`}
-                  >
-                    <option value="">Departman seçin</option>
-                    {departments.map((dept) => (
-                      <option key={dept.id} value={dept.id}>
-                        {dept.name}
-                      </option>
-                    ))}
-                  </select>
-                  {errors.departmentId && (
-                    <p className="mt-1 text-sm text-red-600">{errors.departmentId}</p>
-                  )}
-                </div>
-
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">Pozisyon *</label>
-                  <select
-                    value={formData.jobPositionId}
-                    onChange={(e) => handleInputChange('jobPositionId', e.target.value)}
-                    className={`block w-full px-2 py-1 text-sm border rounded-md shadow-sm focus:outline-none focus:ring-1 ${
-                      errors.jobPositionId
-                        ? 'border-red-300 focus:border-red-500 focus:ring-red-500'
-                        : 'border-gray-300 focus:border-blue-500 focus:ring-blue-500'
-                    }`}
-                  >
-                    <option value="">Pozisyon seçin</option>
-                    {jobPositions.map((position) => (
-                      <option key={position.id} value={position.id}>
-                        {position.name}
-                      </option>
-                    ))}
-                  </select>
-                  {errors.jobPositionId && (
-                    <p className="mt-1 text-sm text-red-600">{errors.jobPositionId}</p>
-                  )}
-                </div>
-
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">Yönetici</label>
-                  <select
-                    value={formData.managerId}
-                    onChange={(e) => handleInputChange('managerId', e.target.value)}
-                    className="block w-full px-2 py-1 text-sm border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-1 focus:border-blue-500 focus:ring-blue-500"
-                  >
-                    <option value="">Yönetici seçin</option>
-                    {managers.map((manager) => (
-                      <option key={manager.id} value={manager.id}>
-                        {manager.fullName}
-                      </option>
-                    ))}
-                  </select>
-                </div>
-              </div>
-
-              <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    Çalışma Lokasyonu
-                  </label>
-                  <input
-                    type="text"
-                    value={formData.workLocation}
-                    onChange={(e) => handleInputChange('workLocation', e.target.value)}
-                    className="block w-full px-2 py-1 text-sm border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-1 focus:border-blue-500 focus:ring-blue-500"
-                    placeholder="Ofis lokasyonu"
-                  />
-                </div>
-
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    Kart Numarası
-                  </label>
-                  <input
-                    type="text"
-                    value={formData.badgeNumber}
-                    onChange={(e) => handleInputChange('badgeNumber', e.target.value)}
-                    className="block w-full px-2 py-1 text-sm border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-1 focus:border-blue-500 focus:ring-blue-500"
-                    placeholder="Personel kartı numarası"
-                  />
-                </div>
-              </div>
-            </div>
-          </div>
-
-          {/* Salary Information */}
-          <div className="bg-white shadow rounded-lg">
-            <div className="px-3 py-2 border-b border-gray-200">
-              <h3 className="text-base font-medium text-gray-900 flex items-center">
-                <FaDollarSign className="w-5 h-5 mr-2" />
-                Maaş Bilgileri
-              </h3>
-            </div>
-
-            <div className="p-4 space-y-3">
-              <div className="grid grid-cols-1 md:grid-cols-3 gap-3">
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    Temel Maaş *
-                  </label>
-                  <input
-                    type="number"
-                    min="0"
-                    step="0.01"
-                    value={formData.baseSalary}
-                    onChange={(e) =>
-                      handleInputChange('baseSalary', parseFloat(e.target.value) || 0)
-                    }
-                    className={`block w-full px-2 py-1 text-sm border rounded-md shadow-sm focus:outline-none focus:ring-1 ${
-                      errors.baseSalary
-                        ? 'border-red-300 focus:border-red-500 focus:ring-red-500'
-                        : 'border-gray-300 focus:border-blue-500 focus:ring-blue-500'
-                    }`}
-                    placeholder="0.00"
-                  />
-                  {errors.baseSalary && (
-                    <p className="mt-1 text-sm text-red-600">{errors.baseSalary}</p>
-                  )}
-                </div>
-
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    Para Birimi
-                  </label>
-                  <select
-                    value={formData.currency}
-                    onChange={(e) => handleInputChange('currency', e.target.value)}
-                    className="block w-full px-2 py-1 text-sm border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-1 focus:border-blue-500 focus:ring-blue-500"
-                  >
-                    {mockCurrencies.map((currency) => (
-                      <option key={currency.value} value={currency.value}>
-                        {currency.value} - {currency.label}
-                      </option>
-                    ))}
-                  </select>
-                </div>
-
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    Bordro Grubu
-                  </label>
-                  <select
-                    value={formData.payrollGroup}
-                    onChange={(e) => handleInputChange('payrollGroup', e.target.value)}
-                    className="block w-full px-2 py-1 text-sm border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-1 focus:border-blue-500 focus:ring-blue-500"
-                  >
-                    <option value="">Grup seçin</option>
-                    <option value={FrequencyUnitEnum.Weeks}>
-                      {getFrequencyUnitText(FrequencyUnitEnum.Weeks)}
-                    </option>
-                    <option value={FrequencyUnitEnum.Months}>
-                      {getFrequencyUnitText(FrequencyUnitEnum.Months)}
-                    </option>
-                    <option value={FrequencyUnitEnum.Hours}>
-                      {getFrequencyUnitText(FrequencyUnitEnum.Hours)}
-                    </option>
-                  </select>
-                </div>
-              </div>
-            </div>
-          </div>
-
-          {/* Emergency Contact & Status */}
-          <div className="bg-white shadow rounded-lg">
-            <div className="px-3 py-2 border-b border-gray-200">
-              <h3 className="text-base font-medium text-gray-900 flex items-center">
-                <FaPhone className="w-5 h-5 mr-2" />
-                Acil Durum İletişim & Durum
-              </h3>
-            </div>
-
-            <div className="p-4 space-y-3">
-              <div className="grid grid-cols-1 md:grid-cols-3 gap-3">
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    Acil Durum Kişisi
-                  </label>
-                  <input
-                    type="text"
-                    value={formData.emergencyContact.name}
-                    onChange={(e) => handleInputChange('emergencyContact.name', e.target.value)}
-                    className="block w-full px-2 py-1 text-sm border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-1 focus:border-blue-500 focus:ring-blue-500"
-                    placeholder="Ad Soyad"
-                  />
-                </div>
-
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    Acil Durum Telefonu
-                  </label>
-                  <input
-                    type="tel"
-                    value={formData.emergencyContact.phone}
-                    onChange={(e) => handleInputChange('emergencyContact.phone', e.target.value)}
-                    className="block w-full px-2 py-1 text-sm border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-1 focus:border-blue-500 focus:ring-blue-500"
-                    placeholder="+90 532 555 0123"
-                  />
-                </div>
-
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    Yakınlık Derecesi
-                  </label>
-                  <input
-                    type="text"
-                    value={formData.emergencyContact.relationship}
-                    onChange={(e) =>
-                      handleInputChange('emergencyContact.relationship', e.target.value)
-                    }
-                    className="block w-full px-2 py-1 text-sm border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-1 focus:border-blue-500 focus:ring-blue-500"
-                    placeholder="Eş, Anne, Baba vs."
-                  />
-                </div>
-              </div>
-
-              <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
-                <div>
-                  <label className="block text-sm font-medium text-gray-700 mb-1">
-                    Personel Durumu
-                  </label>
-                  <select
-                    value={formData.employeeStatus}
-                    onChange={(e) => handleInputChange('employeeStatus', e.target.value)}
-                    className="block w-full px-2 py-1 text-sm border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-1 focus:border-blue-500 focus:ring-blue-500"
-                  >
-                    {Object.values(EmployeeStatusEnum).map((status) => (
-                      <option key={status} value={status}>
-                        {getEmployeeStatusText(status)}
-                      </option>
-                    ))}
-                  </select>
-                </div>
-
-                <div className="flex items-center pt-6">
-                  <input
-                    type="checkbox"
-                    id="isActive"
-                    checked={formData.isActive}
-                    onChange={(e) => handleInputChange('isActive', e.target.checked)}
-                    className="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded"
-                  />
-                  <label htmlFor="isActive" className="ml-2 block text-sm text-gray-900">
-                    Aktif
-                  </label>
-                </div>
-              </div>
-            </div>
-          </div>
-
-          {/* Form Actions */}
-          <div className="flex items-center justify-end space-x-2 bg-gray-50 px-3 py-2 rounded-b-lg border-t">
-            <button
-              type="button"
-              onClick={handleCancel}
-              className="inline-flex items-center px-3 py-1 border border-gray-300 shadow-sm text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
-            >
-              <FaTimes className="w-4 h-4 mr-2" />
-              İptal
-            </button>
-            <button
-              type="submit"
-              disabled={saving}
-              className="inline-flex items-center px-3 py-1 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 disabled:opacity-50 disabled:cursor-not-allowed"
-            >
-              {saving ? (
-                <>
-                  <div className="animate-spin rounded-full h-4 w-4 border-b-2 border-white mr-2"></div>
-                  Kaydediliyor...
-                </>
-              ) : (
-                <>
-                  <FaSave className="w-4 h-4 mr-2" />
-                  {isEdit ? 'Güncelle' : 'Kaydet'}
-                </>
-              )}
-            </button>
-          </div>
-        </form>
-      </div>
-    </Container>
-  )
-}
-
-export default EmployeeForm
diff --git a/ui/src/views/hr/components/EmployeeList.tsx b/ui/src/views/hr/components/EmployeeList.tsx
deleted file mode 100644
index 099f352f..00000000
--- a/ui/src/views/hr/components/EmployeeList.tsx
+++ /dev/null
@@ -1,564 +0,0 @@
-import React, { useState } from 'react'
-import { Link } from 'react-router-dom'
-import { useQuery } from '@tanstack/react-query'
-import {
-  FaUsers,
-  FaPlus,
-  FaSearch,
-  FaFilter,
-  FaDownload,
-  FaEdit,
-  FaEye,
-  FaPhone,
-  FaEnvelope,
-  FaCalendar,
-  FaBuilding,
-  FaAward,
-  FaExclamationTriangle,
-  FaList,
-  FaTh,
-  FaBriefcase,
-} from 'react-icons/fa'
-import classNames from 'classnames'
-import { EmployeeStatusEnum, EmployeeDto } from '../../../types/hr'
-import dayjs from 'dayjs'
-import { mockEmployees } from '../../../mocks/mockEmployees'
-import EmployeeView from './EmployeeView'
-import Widget from '../../../components/common/Widget'
-import {
-  getEmploymentTypeColor,
-  getEmploymentTypeText,
-  getEmployeeStatusColor,
-  getEmployeeStatusIcon,
-  getEmployeeStatusText,
-} from '../../../utils/erp'
-import { Container } from '@/components/shared'
-import { ROUTES_ENUM } from '@/routes/route.constant'
-import { mockDepartments } from '@/mocks/mockDepartments'
-
-const EmployeeList: React.FC = () => {
-  const [searchTerm, setSearchTerm] = useState('')
-  const [filterStatus, setFilterStatus] = useState('all')
-  const [filterDepartment, setFilterDepartment] = useState('all')
-  const [showFilters, setShowFilters] = useState(false)
-  const [viewMode, setViewMode] = useState<'list' | 'cards'>('list')
-
-  // Modal states
-  const [isViewModalOpen, setIsViewModalOpen] = useState(false)
-  const [selectedEmployee, setSelectedEmployee] = useState<EmployeeDto | null>(null)
-
-  const {
-    data: employees,
-    isLoading,
-    error,
-  } = useQuery({
-    queryKey: ['employees', searchTerm, filterStatus, filterDepartment],
-    queryFn: async () => {
-      await new Promise((resolve) => setTimeout(resolve, 500))
-      return mockEmployees.filter((employee) => {
-        const matchesSearch =
-          employee.code.toLowerCase().includes(searchTerm.toLowerCase()) ||
-          employee.fullName.toLowerCase().includes(searchTerm.toLowerCase()) ||
-          employee.email.toLowerCase().includes(searchTerm.toLowerCase())
-        const matchesStatus = filterStatus === 'all' || employee.employeeStatus === filterStatus
-        const matchesDepartment =
-          filterDepartment === 'all' || employee.department?.code === filterDepartment
-        return matchesSearch && matchesStatus && matchesDepartment
-      })
-    },
-  })
-
-  // Modal handlers
-  const handleViewEmployee = (employee: EmployeeDto) => {
-    setSelectedEmployee(employee)
-    setIsViewModalOpen(true)
-  }
-
-  const handleCloseViewModal = () => {
-    setIsViewModalOpen(false)
-    setSelectedEmployee(null)
-  }
-
-  const handleEditFromView = (employee: EmployeeDto) => {
-    setIsViewModalOpen(false)
-    // Navigate to edit page - you can replace this with a modal if preferred
-    window.location.href = ROUTES_ENUM.protected.hr.employeesEdit.replace(':id', employee.id)
-  }
-
-  if (isLoading) {
-    return (
-      <div className="flex items-center justify-center py-12">
-        <div className="animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600"></div>
-        <span className="ml-3 text-gray-600">Personel listesi yükleniyor...</span>
-      </div>
-    )
-  }
-
-  if (error) {
-    return (
-      <div className="bg-red-50 border border-red-200 rounded-lg p-4">
-        <div className="flex items-center">
-          <FaExclamationTriangle className="h-5 w-5 text-red-600 mr-2" />
-          <span className="text-red-800">Personel listesi yüklenirken hata oluştu.</span>
-        </div>
-      </div>
-    )
-  }
-
-  return (
-    <Container>
-      <div className="space-y-2">
-        {/* Header */}
-        <div className="flex flex-col sm:flex-row items-start sm:items-center justify-between gap-4">
-          {/* Title & Description */}
-          <div>
-            <h2 className="text-2xl font-bold text-gray-900">Personel Listesi</h2>
-            <p className="text-gray-600">Şirket çalışanlarının listesi</p>
-          </div>
-
-          {/* Header Actions */}
-          <div className="flex flex-col sm:flex-row items-stretch sm:items-center gap-2">
-            {/* View Mode Toggle */}
-            <div className="flex bg-gray-100 rounded-lg p-0.5">
-              <button
-                onClick={() => setViewMode('list')}
-                className={`p-1.5 rounded-md transition-colors ${
-                  viewMode === 'list'
-                    ? 'bg-white text-blue-600 shadow-sm'
-                    : 'text-gray-600 hover:text-gray-900'
-                }`}
-                title="Liste Görünümü"
-              >
-                <FaList className="w-4 h-4" />
-              </button>
-              <button
-                onClick={() => setViewMode('cards')}
-                className={`p-1.5 rounded-md transition-colors ${
-                  viewMode === 'cards'
-                    ? 'bg-white text-blue-600 shadow-sm'
-                    : 'text-gray-600 hover:text-gray-900'
-                }`}
-                title="Kart Görünümü"
-              >
-                <FaTh className="w-4 h-4" />
-              </button>
-            </div>
-
-            {/* Search Box */}
-            <div className="relative">
-              <FaSearch
-                size={18}
-                className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400"
-              />
-              <input
-                type="text"
-                placeholder="Personel kodu, ad veya e-posta..."
-                value={searchTerm}
-                onChange={(e) => setSearchTerm(e.target.value)}
-                className="pl-10 pr-4 py-1 text-sm w-full sm:w-64 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent"
-              />
-            </div>
-
-            {/* Filter Button */}
-            <button
-              onClick={() => setShowFilters(!showFilters)}
-              className={classNames(
-                'flex items-center px-3 py-1.5 text-sm border rounded-lg transition-colors',
-                showFilters
-                  ? 'border-blue-500 bg-blue-50 text-blue-700'
-                  : 'border-gray-300 bg-white text-gray-700 hover:bg-gray-50',
-              )}
-            >
-              <FaFilter size={16} className="mr-2" />
-              Filtreler
-            </button>
-
-            {/* Export Button */}
-            <button
-              onClick={() => alert('Dışa aktarma özelliği yakında eklenecek')}
-              className="flex items-center px-3 py-1 text-sm border border-gray-300 bg-white text-gray-700 rounded-lg hover:bg-gray-50 transition-colors"
-            >
-              <FaDownload size={16} className="mr-2" />
-              Dışa Aktar
-            </button>
-
-            {/* Add New Employee */}
-            <Link
-              to={ROUTES_ENUM.protected.hr.employeesNew}
-              className="flex items-center px-3 py-1.5 text-sm bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors"
-            >
-              <FaPlus size={16} className="mr-2" />
-              Yeni Personel
-            </Link>
-          </div>
-        </div>
-
-        {/* Filters Panel */}
-        {showFilters && (
-          <div className="bg-white border border-gray-200 rounded-lg p-3">
-            <div className="grid grid-cols-1 md:grid-cols-4 gap-3">
-              <div>
-                <label className="block text-xs font-medium text-gray-700 mb-1">Durum</label>
-                <select
-                  value={filterStatus}
-                  onChange={(e) => setFilterStatus(e.target.value)}
-                  className="w-full border border-gray-300 rounded-lg px-2 py-1 text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent"
-                >
-                  <option value="all">Tümü</option>
-                  {Object.values(EmployeeStatusEnum).map((status) => (
-                    <option key={status} value={status}>
-                      {getEmployeeStatusText(status)}
-                    </option>
-                  ))}
-                </select>
-              </div>
-
-              <div>
-                <label className="block text-xs font-medium text-gray-700 mb-1">Departman</label>
-                <select
-                  value={filterDepartment}
-                  onChange={(e) => setFilterDepartment(e.target.value)}
-                  className="w-full border border-gray-300 rounded-lg px-2 py-1 text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent"
-                >
-                  <option value="all">Tümü</option>
-                  {mockDepartments.map((dept) => (
-                    <option key={dept.id} value={dept.code}>
-                      {dept.name}
-                    </option>
-                  ))}
-                </select>
-              </div>
-
-              <div className="flex items-end">
-                <button
-                  onClick={() => {
-                    setFilterStatus('all')
-                    setFilterDepartment('all')
-                    setSearchTerm('')
-                  }}
-                  className="w-full px-3 py-1 text-sm border border-gray-300 bg-white text-gray-700 rounded-lg hover:bg-gray-50 transition-colors"
-                >
-                  Filtreleri Temizle
-                </button>
-              </div>
-            </div>
-          </div>
-        )}
-
-        {/* Statistics Cards */}
-        <div className="grid grid-cols-1 md:grid-cols-4 gap-3">
-          <Widget
-            title="Toplam Personel"
-            value={employees?.length || 0}
-            color="blue"
-            icon="FaUsers"
-          />
-
-          <Widget
-            title="Aktif Personel"
-            value={
-              employees?.filter((e) => e.employeeStatus === EmployeeStatusEnum.Active).length || 0
-            }
-            color="green"
-            icon="FaCheckCircle"
-          />
-
-          <Widget
-            title="İzinli Personel"
-            value={
-              employees?.filter((e) => e.employeeStatus === EmployeeStatusEnum.OnLeave).length || 0
-            }
-            color="yellow"
-            icon="FaCalendar"
-          />
-
-          <Widget
-            title="Yeni İşe Alınanlar"
-            value={
-              employees?.filter((e) => dayjs(e.hireDate).isAfter(dayjs().subtract(30, 'day')))
-                .length || 0
-            }
-            color="purple"
-            icon="FaArrowUp"
-          />
-        </div>
-
-        {/* Employees Display */}
-        {viewMode === 'list' ? (
-          <div className="bg-white rounded-lg shadow-sm border border-gray-200 text-xs">
-            <div className="overflow-x-auto">
-              <table className="w-full">
-                <thead className="bg-gray-50">
-                  <tr>
-                    <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                      Personel Bilgileri
-                    </th>
-                    <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                      İletişim
-                    </th>
-                    <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                      Pozisyon / Departman
-                    </th>
-                    <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                      İstihdam Bilgileri
-                    </th>
-                    <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                      Maaş
-                    </th>
-                    <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                      Durum
-                    </th>
-                    <th className="px-3 py-2 text-right text-xs font-medium text-gray-500 uppercase tracking-wider">
-                      İşlemler
-                    </th>
-                  </tr>
-                </thead>
-
-                <tbody className="bg-white divide-y divide-gray-200">
-                  {employees?.map((employee) => (
-                    <tr key={employee.id} className="hover:bg-gray-50 transition-colors text-xs">
-                      <td className="px-3 py-2">
-                        <div className="flex items-center">
-                          <div className="flex-shrink-0 h-10 w-10">
-                            <div className="h-10 w-10 rounded-full bg-blue-100 flex items-center justify-center">
-                              <FaUsers className="h-5 w-5 text-blue-600" />
-                              <img
-                                src={employee.avatar}
-                                alt={employee.fullName}
-                                className="w-10 h-10 rounded-full"
-                              />
-                            </div>
-                          </div>
-                          <div className="ml-4">
-                            <div className="text-xs font-medium text-gray-900">{employee.code}</div>
-                            <div className="text-xs text-gray-500">{employee.fullName}</div>
-                            {employee.badgeNumber && (
-                              <div className="text-xs text-gray-400 mt-1">
-                                Rozet: {employee.badgeNumber}
-                              </div>
-                            )}
-                          </div>
-                        </div>
-                      </td>
-
-                      <td className="px-3 py-2">
-                        <div className="space-y-1">
-                          <div className="flex items-center text-xs text-gray-900">
-                            <FaEnvelope size={14} className="mr-1" />
-                            {employee.email}
-                          </div>
-                          {employee.phone && (
-                            <div className="flex items-center text-xs text-gray-500">
-                              <FaPhone size={14} className="mr-1" />
-                              {employee.phone}
-                            </div>
-                          )}
-                        </div>
-                      </td>
-
-                      <td className="px-3 py-2">
-                        <div>
-                          <div className="text-xs font-medium text-gray-900">
-                            {employee.jobPosition?.name}
-                          </div>
-                          <div className="flex items-center text-xs text-gray-500">
-                            <FaBuilding size={14} className="mr-1" />
-                            {employee.department?.name}
-                          </div>
-                          <div className="text-xs text-gray-400 mt-1">{employee.workLocation}</div>
-                        </div>
-                      </td>
-
-                      <td className="px-3 py-2">
-                        <div className="space-y-1">
-                          <div
-                            className={classNames(
-                              'text-xs font-medium',
-                              getEmploymentTypeColor(employee.employmentType),
-                            )}
-                          >
-                            {getEmploymentTypeText(employee.employmentType)}
-                          </div>
-                          <div className="flex items-center text-xs text-gray-500">
-                            <FaCalendar size={14} className="mr-1" />
-                            {dayjs(employee.hireDate).format('DD.MM.YYYY')}
-                          </div>
-                          <div className="text-xs text-gray-400">
-                            {dayjs().diff(employee.hireDate, 'year')} yıl deneyim
-                          </div>
-                        </div>
-                      </td>
-
-                      <td className="px-3 py-2">
-                        <div className="text-xs font-medium text-gray-900">
-                          ₺{employee.baseSalary.toLocaleString()}
-                        </div>
-                        <div className="text-xs text-gray-500">{employee.payrollGroup}</div>
-                      </td>
-
-                      <td className="px-3 py-2">
-                        <span
-                          className={classNames(
-                            'inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium',
-                            getEmployeeStatusColor(employee.employeeStatus),
-                          )}
-                        >
-                          {getEmployeeStatusIcon(employee.employeeStatus)}
-                          <span className="ml-1">
-                            {getEmployeeStatusText(employee.employeeStatus)}
-                          </span>
-                        </span>
-                      </td>
-
-                      <td className="px-3 py-2 text-right">
-                        <div className="flex items-center justify-end space-x-2">
-                          <button
-                            onClick={() => handleViewEmployee(employee)}
-                            className="p-1 text-gray-600 hover:text-blue-600 hover:bg-blue-50 rounded-lg transition-colors"
-                            title="Detayları Görüntüle"
-                          >
-                            <FaEye size={16} />
-                          </button>
-
-                          <Link
-                            to={ROUTES_ENUM.protected.hr.employeesEdit.replace(':id', employee.id)}
-                            className="p-1 text-gray-600 hover:text-yellow-600 hover:bg-yellow-50 rounded-lg transition-colors"
-                            title="Düzenle"
-                          >
-                            <FaEdit size={16} />
-                          </Link>
-                        </div>
-                      </td>
-                    </tr>
-                  ))}
-                </tbody>
-              </table>
-            </div>
-
-            {(!employees || employees.length === 0) && (
-              <div className="text-center py-12">
-                <FaUsers className="mx-auto h-10 w-10 text-gray-400" />
-                <h3 className="mt-2 text-xs font-medium text-gray-900">Personel bulunamadı</h3>
-                <p className="mt-1 text-xs text-gray-500">Yeni personel ekleyerek başlayın.</p>
-                <div className="mt-6">
-                  <Link
-                    to={ROUTES_ENUM.protected.hr.employeesNew}
-                    className="inline-flex items-center px-3 py-1 text-sm bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors"
-                  >
-                    <FaPlus size={16} className="mr-2" />
-                    Yeni Personel Ekle
-                  </Link>
-                </div>
-              </div>
-            )}
-          </div>
-        ) : (
-          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-3">
-            {employees?.map((employee) => (
-              <div
-                key={employee.id}
-                className="bg-white rounded-lg shadow-sm border hover:shadow-md transition-shadow p-3"
-              >
-                {/* Card Header */}
-                <div className="flex items-start space-x-4 mb-4">
-                  <div className="flex-shrink-0">
-                    <div className="h-12 w-12 rounded-full bg-blue-500 flex items-center justify-center">
-                      <span className="text-lg font-medium text-white">
-                        {employee.firstName.charAt(0)}
-                        {employee.lastName.charAt(0)}
-                      </span>
-                    </div>
-                  </div>
-                  <div className="flex-1 min-w-0">
-                    <h3 className="text-base font-semibold text-gray-900 truncate">
-                      {employee.fullName}
-                    </h3>
-                    <p className="text-sm text-gray-500">{employee.code}</p>
-                    <span
-                      className={classNames(
-                        'inline-flex items-center px-2 py-1 rounded-full text-xs font-medium mt-1',
-                        getEmployeeStatusColor(employee.employeeStatus),
-                      )}
-                    >
-                      {getEmployeeStatusIcon(employee.employeeStatus)}
-                      <span className="ml-1">{getEmployeeStatusText(employee.employeeStatus)}</span>
-                    </span>
-                  </div>
-                </div>
-
-                {/* Card Content */}
-                <div className="space-y-1.5">
-                  <div className="flex items-center text-sm text-gray-600">
-                    <FaBriefcase className="w-4 h-4 mr-2 text-gray-400" />
-                    <span>{employee.jobPosition?.name || 'Pozisyon belirtilmemiş'}</span>
-                  </div>
-
-                  <div className="flex items-center text-sm text-gray-600">
-                    <FaBuilding className="w-4 h-4 mr-2 text-gray-400" />
-                    <span>{employee.department?.name || 'Departman belirtilmemiş'}</span>
-                  </div>
-
-                  <div className="flex items-center text-sm text-gray-600">
-                    <FaEnvelope className="w-4 h-4 mr-2 text-gray-400" />
-                    <span className="truncate">{employee.email}</span>
-                  </div>
-
-                  {employee.phone && (
-                    <div className="flex items-center text-sm text-gray-600">
-                      <FaPhone className="w-4 h-4 mr-2 text-gray-400" />
-                      <span>{employee.phone}</span>
-                    </div>
-                  )}
-
-                  <div className="flex items-center text-sm text-gray-600">
-                    <FaCalendar className="w-4 h-4 mr-2 text-gray-400" />
-                    <span>İşe Başlama: {dayjs(employee.hireDate).format('DD.MM.YYYY')}</span>
-                  </div>
-
-                  <div className="text-sm text-gray-600">
-                    <span className="font-medium">İstihdam Türü:</span> {employee.employmentType}
-                  </div>
-                </div>
-
-                {/* Card Actions */}
-                <div className="flex justify-end space-x-1 mt-2 pt-2 border-t border-gray-100">
-                  <button
-                    onClick={() => handleViewEmployee(employee)}
-                    className="p-1 text-green-600 hover:bg-green-50 rounded-lg transition-colors"
-                    title="Görüntüle"
-                  >
-                    <FaEye className="w-4 h-4" />
-                  </button>
-                  <Link
-                    to={ROUTES_ENUM.protected.hr.employeesEdit.replace(':id', employee.id)}
-                    className="p-1 text-blue-600 hover:bg-blue-50 rounded-lg transition-colors"
-                    title="Düzenle"
-                  >
-                    <FaEdit className="w-4 h-4" />
-                  </Link>
-                  <button
-                    onClick={() => alert('Performans değerlendirme özelliği yakında eklenecek')}
-                    className="p-1 text-orange-600 hover:bg-orange-50 rounded-lg transition-colors"
-                    title="Performans"
-                  >
-                    <FaAward className="w-4 h-4" />
-                  </button>
-                </div>
-              </div>
-            ))}
-          </div>
-        )}
-      </div>
-
-      {/* Employee View Modal */}
-      <EmployeeView
-        isOpen={isViewModalOpen}
-        onClose={handleCloseViewModal}
-        employee={selectedEmployee}
-        onEdit={handleEditFromView}
-      />
-    </Container>
-  )
-}
-
-export default EmployeeList
diff --git a/ui/src/views/hr/components/EmployeeView.tsx b/ui/src/views/hr/components/EmployeeView.tsx
deleted file mode 100644
index 734cf928..00000000
--- a/ui/src/views/hr/components/EmployeeView.tsx
+++ /dev/null
@@ -1,497 +0,0 @@
-import React from "react";
-import {
-  FaTimes,
-  FaUser,
-  FaIdCard,
-  FaEnvelope,
-  FaPhone,
-  FaCalendar,
-  FaBuilding,
-  FaBriefcase,
-  FaDollarSign,
-  FaMapMarkerAlt,
-  FaUserShield,
-  FaHeartbeat,
-  FaEdit,
-  FaClock,
-  FaBirthdayCake,
-  FaGraduationCap,
-  FaAward,
-  FaHistory,
-} from "react-icons/fa";
-import { EmployeeDto } from "../../../types/hr";
-import {
-  getEmployeeStatusColor,
-  getEmployeeStatusIcon,
-  getEmployeeStatusText,
-} from "../../../utils/erp";
-
-interface EmployeeViewModalProps {
-  isOpen: boolean;
-  onClose: () => void;
-  employee: EmployeeDto | null;
-  onEdit?: (employee: EmployeeDto) => void;
-}
-
-const EmployeeViewModal: React.FC<EmployeeViewModalProps> = ({
-  isOpen,
-  onClose,
-  employee,
-  onEdit,
-}) => {
-  if (!isOpen || !employee) return null;
-
-  const formatDate = (date: Date | string): string => {
-    return new Date(date).toLocaleDateString("tr-TR");
-  };
-
-  const calculateWorkDuration = (hireDate: Date): string => {
-    const now = new Date();
-    const hire = new Date(hireDate);
-    const diffTime = Math.abs(now.getTime() - hire.getTime());
-    const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24));
-    const years = Math.floor(diffDays / 365);
-    const months = Math.floor((diffDays % 365) / 30);
-
-    if (years > 0) {
-      return `${years} yıl ${months} ay`;
-    }
-    return `${months} ay`;
-  };
-
-  return (
-    <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4">
-      <div className="bg-white rounded-lg shadow-2xl w-full max-w-4xl max-h-[95vh] overflow-hidden flex flex-col">
-        {/* Header */}
-        <div className="bg-gradient-to-r from-blue-600 to-indigo-700 text-white p-3 flex-shrink-0">
-          <div className="flex items-center justify-between">
-            <div className="flex items-center space-x-3">
-              <div className="w-10 h-10 bg-white bg-opacity-20 rounded-full flex items-center justify-center">
-                <FaUser className="w-5 h-5 text-white" />
-              </div>
-              <div>
-                <h2 className="text-lg font-bold">{employee.fullName}</h2>
-                <p className="text-blue-100 text-sm">
-                  {employee.jobPosition?.name || "Pozisyon Belirtilmemiş"}
-                </p>
-                <p className="text-blue-200 text-xs">{employee.code}</p>
-              </div>
-            </div>
-            <div className="flex items-center space-x-2">
-              <div
-                className={`px-2 py-0.5 rounded-full border flex items-center space-x-1.5 text-xs ${getEmployeeStatusColor(
-                  employee.employeeStatus
-                )} bg-opacity-90`}
-              >
-                {getEmployeeStatusIcon(employee.employeeStatus)}
-                <span className="font-medium text-xs">
-                  {getEmployeeStatusText(employee.employeeStatus)}
-                </span>
-              </div>
-              {onEdit && (
-                <button
-                  onClick={() => onEdit(employee)}
-                  className="bg-white bg-opacity-20 hover:bg-opacity-30 text-white px-2 py-1 text-xs rounded-md flex items-center space-x-1.5 transition-all"
-                >
-                  <FaEdit className="w-3 h-3" />
-                  <span>Düzenle</span>
-                </button>
-              )}
-              <button
-                onClick={onClose}
-                className="text-white hover:bg-white hover:bg-opacity-20 p-1 rounded-lg transition-all"
-              >
-                <FaTimes className="w-5 h-5" />
-              </button>
-            </div>
-          </div>
-        </div>
-
-        {/* Content */}
-        <div className="p-3 overflow-y-auto flex-grow">
-          <div className="grid grid-cols-1 lg:grid-cols-3 gap-3">
-            {/* Left Column - Personal Info */}
-            <div className="space-y-3">
-              {/* Kişisel Bilgiler */}
-              <div className="bg-gray-50 rounded-lg p-3 border border-gray-100">
-                <h3 className="text-sm font-semibold text-gray-900 mb-2 flex items-center">
-                  <FaIdCard className="w-4 h-4 text-blue-600 mr-2" />
-                  Kişisel Bilgiler
-                </h3>
-                <div className="space-y-2">
-                  <div className="flex items-center space-x-2">
-                    <FaBirthdayCake className="w-3 h-3 text-gray-500" />
-                    <div>
-                      <p className="text-xs text-gray-600">Doğum Tarihi</p>
-                      <p className="font-medium text-sm">
-                        {formatDate(employee.birthDate)}
-                      </p>
-                    </div>
-                  </div>
-                  <div className="flex items-center space-x-2">
-                    <FaUser className="w-3 h-3 text-gray-500" />
-                    <div>
-                      <p className="text-xs text-gray-600">Cinsiyet</p>
-                      <p className="font-medium text-sm">{employee.gender}</p>
-                    </div>
-                  </div>
-                  <div className="flex items-center space-x-2">
-                    <FaHeartbeat className="w-3 h-3 text-gray-500" />
-                    <div>
-                      <p className="text-xs text-gray-600">Medeni Durum</p>
-                      <p className="font-medium text-sm">
-                        {employee.maritalStatus}
-                      </p>
-                    </div>
-                  </div>
-                  <div className="flex items-center space-x-2">
-                    <FaIdCard className="w-3 h-3 text-gray-500" />
-                    <div>
-                      <p className="text-xs text-gray-600">TC Kimlik No</p>
-                      <p className="font-medium text-sm">
-                        {employee.nationalId}
-                      </p>
-                    </div>
-                  </div>
-                </div>
-              </div>
-
-              {/* İletişim Bilgileri */}
-              <div className="bg-gray-50 rounded-lg p-3 border border-gray-100">
-                <h3 className="text-sm font-semibold text-gray-900 mb-2 flex items-center">
-                  <FaPhone className="w-4 h-4 text-green-600 mr-2" />
-                  İletişim Bilgileri
-                </h3>
-                <div className="space-y-2">
-                  <div className="flex items-center space-x-2">
-                    <FaEnvelope className="w-3 h-3 text-gray-500" />
-                    <div>
-                      <p className="text-xs text-gray-600">E-posta</p>
-                      <p className="font-medium text-sm text-blue-600">
-                        {employee.email}
-                      </p>
-                    </div>
-                  </div>
-                  {employee.phone && (
-                    <div className="flex items-center space-x-2">
-                      <FaPhone className="w-3 h-3 text-gray-500" />
-                      <div>
-                        <p className="text-xs text-gray-600">İş Telefonu</p>
-                        <p className="font-medium text-sm">{employee.phone}</p>
-                      </div>
-                    </div>
-                  )}
-                  {employee.personalPhone && (
-                    <div className="flex items-center space-x-2">
-                      <FaPhone className="w-3 h-3 text-gray-500" />
-                      <div>
-                        <p className="text-xs text-gray-600">Kişisel Telefon</p>
-                        <p className="font-medium text-sm">
-                          {employee.personalPhone}
-                        </p>
-                      </div>
-                    </div>
-                  )}
-                  {employee.address && (
-                    <div className="flex items-start space-x-2">
-                      <FaMapMarkerAlt className="w-3 h-3 text-gray-500 mt-0.5" />
-                      <div>
-                        <p className="text-xs text-gray-600">Adres</p>
-                        <p className="font-medium text-sm">
-                          {employee.address.street}
-                          <br />
-                          {employee.address.city}, {employee.address.state}
-                          <br />
-                          {employee.address.postalCode},{" "}
-                          {employee.address.country}
-                        </p>
-                      </div>
-                    </div>
-                  )}
-                </div>
-              </div>
-
-              {/* Acil Durum İletişim */}
-              {employee.emergencyContact && (
-                <div className="bg-gray-50 rounded-lg p-3 border border-gray-100">
-                  <h3 className="text-sm font-semibold text-gray-900 mb-2 flex items-center">
-                    <FaUserShield className="w-4 h-4 text-red-600 mr-2" />
-                    Acil Durum İletişim
-                  </h3>
-                  <div className="space-y-2">
-                    <div>
-                      <p className="text-xs text-gray-600">İsim</p>
-                      <p className="font-medium text-sm">
-                        {employee.emergencyContact.name}
-                      </p>
-                    </div>
-                    <div>
-                      <p className="text-xs text-gray-600">Telefon</p>
-                      <p className="font-medium text-sm">
-                        {employee.emergencyContact.phone}
-                      </p>
-                    </div>
-                    <div>
-                      <p className="text-xs text-gray-600">Yakınlık</p>
-                      <p className="font-medium text-sm">
-                        {employee.emergencyContact.relationship}
-                      </p>
-                    </div>
-                  </div>
-                </div>
-              )}
-            </div>
-
-            {/* Middle Column - Work Info */}
-            <div className="space-y-3">
-              {/* İş Bilgileri */}
-              <div className="bg-gray-50 rounded-lg p-3 border border-gray-100">
-                <h3 className="text-sm font-semibold text-gray-900 mb-2 flex items-center">
-                  <FaBriefcase className="w-4 h-4 text-purple-600 mr-2" />
-                  İş Bilgileri
-                </h3>
-                <div className="space-y-2">
-                  <div className="flex items-center space-x-2">
-                    <FaBuilding className="w-3 h-3 text-gray-500" />
-                    <div>
-                      <p className="text-xs text-gray-600">Departman</p>
-                      <p className="font-medium text-sm">
-                        {employee.department?.name || "Belirtilmemiş"}
-                      </p>
-                    </div>
-                  </div>
-                  <div className="flex items-center space-x-2">
-                    <FaGraduationCap className="w-3 h-3 text-gray-500" />
-                    <div>
-                      <p className="text-xs text-gray-600">Pozisyon</p>
-                      <p className="font-medium text-sm">
-                        {employee.jobPosition?.name || "Belirtilmemiş"}
-                      </p>
-                    </div>
-                  </div>
-                  <div className="flex items-center space-x-2">
-                    <FaCalendar className="w-3 h-3 text-gray-500" />
-                    <div>
-                      <p className="text-xs text-gray-600">
-                        İşe Başlama Tarihi
-                      </p>
-                      <p className="font-medium text-sm">
-                        {formatDate(employee.hireDate)}
-                      </p>
-                    </div>
-                  </div>
-                  <div className="flex items-center space-x-2">
-                    <FaHistory className="w-3 h-3 text-gray-500" />
-                    <div>
-                      <p className="text-xs text-gray-600">Çalışma Süresi</p>
-                      <p className="font-medium text-sm">
-                        {calculateWorkDuration(employee.hireDate)}
-                      </p>
-                    </div>
-                  </div>
-                  <div className="flex items-center space-x-2">
-                    <FaBriefcase className="w-3 h-3 text-gray-500" />
-                    <div>
-                      <p className="text-xs text-gray-600">Çalışma Türü</p>
-                      <p className="font-medium text-sm">
-                        {employee.employmentType}
-                      </p>
-                    </div>
-                  </div>
-                  {employee.workLocation && (
-                    <div className="flex items-center space-x-2">
-                      <FaMapMarkerAlt className="w-3 h-3 text-gray-500" />
-                      <div>
-                        <p className="text-xs text-gray-600">
-                          Çalışma Lokasyonu
-                        </p>
-                        <p className="font-medium text-sm">
-                          {employee.workLocation}
-                        </p>
-                      </div>
-                    </div>
-                  )}
-                  {employee.badgeNumber && (
-                    <div className="flex items-center space-x-2">
-                      <FaIdCard className="w-3 h-3 text-gray-500" />
-                      <div>
-                        <p className="text-xs text-gray-600">Rozet Numarası</p>
-                        <p className="font-medium text-sm">
-                          {employee.badgeNumber}
-                        </p>
-                      </div>
-                    </div>
-                  )}
-                </div>
-              </div>
-
-              {/* Yönetici Bilgileri */}
-              {employee.manager && (
-                <div className="bg-gray-50 rounded-lg p-3 border border-gray-100">
-                  <h3 className="text-sm font-semibold text-gray-900 mb-2 flex items-center">
-                    <FaUserShield className="w-4 h-4 text-indigo-600 mr-2" />
-                    Yönetici
-                  </h3>
-                  <div className="flex items-center space-x-2">
-                    <div className="w-10 h-10 bg-indigo-100 rounded-full flex items-center justify-center">
-                      <FaUser className="w-5 h-5 text-indigo-600" />
-                    </div>
-                    <div>
-                      <p className="font-medium text-sm text-gray-900">
-                        {employee.manager.fullName}
-                      </p>
-                      <p className="text-xs text-gray-600">
-                        {employee.manager.jobPosition?.name}
-                      </p>
-                      <p className="text-sm text-gray-600">
-                        {employee.manager.email}
-                      </p>
-                    </div>
-                  </div>
-                </div>
-              )}
-
-              {/* Performans ve Eğitimler */}
-              <div className="bg-gray-50 rounded-lg p-3 border border-gray-100">
-                <h3 className="text-sm font-semibold text-gray-900 mb-2 flex items-center">
-                  <FaAward className="w-4 h-4 text-amber-600 mr-2" />
-                  Performans & Gelişim
-                </h3>
-                <div className="grid grid-cols-2 gap-3">
-                  <div className="text-center p-1.5 bg-white rounded-md">
-                    <p className="text-xl font-bold text-amber-600">
-                      {employee.evaluations?.length || 0}
-                    </p>
-                    <p className="text-xs text-gray-600">Değerlendirme</p>
-                  </div>
-                  <div className="text-center p-1.5 bg-white rounded-md">
-                    <p className="text-xl font-bold text-emerald-600">
-                      {employee.trainings?.length || 0}
-                    </p>
-                    <p className="text-xs text-gray-600">Eğitim</p>
-                  </div>
-                </div>
-              </div>
-            </div>
-
-            {/* Right Column - Financial & Additional Info */}
-            <div className="space-y-3">
-              {/* Maaş Bilgileri */}
-              <div className="bg-gray-50 rounded-lg p-3 border border-gray-100">
-                <h3 className="text-sm font-semibold text-gray-900 mb-2 flex items-center">
-                  <FaDollarSign className="w-4 h-4 text-emerald-600 mr-2" />
-                  Maaş Bilgileri
-                </h3>
-                <div className="space-y-2">
-                  <div>
-                    <p className="text-xs text-gray-600">Temel Maaş</p>
-                    <p className="text-xl font-bold text-emerald-600">
-                      {employee.baseSalary?.toLocaleString()}{" "}
-                      {employee.currency || "TRY"}
-                    </p>
-                  </div>
-                  {employee.payrollGroup && (
-                    <div>
-                      <p className="text-xs text-gray-600">Bordro Grubu</p>
-                      <p className="font-medium text-sm">
-                        {employee.payrollGroup}
-                      </p>
-                    </div>
-                  )}
-                </div>
-              </div>
-
-              {/* Banka Bilgileri */}
-              {employee.bankAccount && (
-                <div className="bg-gray-50 rounded-lg p-3 border border-gray-100">
-                  <h3 className="text-sm font-semibold text-gray-900 mb-2 flex items-center">
-                    <FaDollarSign className="w-4 h-4 text-slate-600 mr-2" />
-                    Banka Bilgileri
-                  </h3>
-                  <div className="space-y-2">
-                    <div>
-                      <p className="text-xs text-gray-600">Banka Adı</p>
-                      <p className="font-medium text-sm">
-                        {employee.bankAccount.bankName}
-                      </p>
-                    </div>
-                    <div>
-                      <p className="text-xs text-gray-600">Hesap Numarası</p>
-                      <p className="font-mono text-xs">
-                        {employee.bankAccount.accountNumber}
-                      </p>
-                    </div>
-                    <div>
-                      <p className="text-xs text-gray-600">IBAN</p>
-                      <p className="font-mono text-xs">
-                        {employee.bankAccount.iban}
-                      </p>
-                    </div>
-                  </div>
-                </div>
-              )}
-
-              {/* İzin Durumu */}
-              <div className="bg-gray-50 rounded-lg p-3 border border-gray-100">
-                <h3 className="text-sm font-semibold text-gray-900 mb-2 flex items-center">
-                  <FaCalendar className="w-4 h-4 text-sky-600 mr-2" />
-                  İzin Durumu
-                </h3>
-                <div className="grid grid-cols-1 gap-2">
-                  <div className="bg-white p-1.5 rounded-md flex justify-between items-center">
-                    <span className="text-xs text-gray-600">Toplam İzin</span>
-                    <span className="font-bold text-sm text-sky-600">
-                      {employee.leaves?.length || 0}
-                    </span>
-                  </div>
-                  <div className="bg-white p-1.5 rounded-md flex justify-between items-center">
-                    <span className="text-xs text-gray-600">Kalan İzin</span>
-                    <span className="font-bold text-sm text-emerald-600">
-                      15 gün
-                    </span>
-                  </div>
-                </div>
-              </div>
-
-              {/* Sistem Bilgileri */}
-              <div className="bg-gray-50 rounded-lg p-3 border border-gray-100">
-                <h3 className="text-sm font-semibold text-gray-900 mb-2 flex items-center">
-                  <FaClock className="w-4 h-4 text-gray-600 mr-2" />
-                  Sistem Bilgileri
-                </h3>
-                <div className="space-y-2 text-xs">
-                  <div>
-                    <p className="text-gray-600">Oluşturulma Tarihi</p>
-                    <p className="font-medium text-gray-800">
-                      {formatDate(employee.creationTime)}
-                    </p>
-                  </div>
-                  <div>
-                    <p className="text-gray-600">Son Güncelleme</p>
-                    <p className="font-medium text-gray-800">
-                      {formatDate(employee.lastModificationTime)}
-                    </p>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-
-        {/* Footer */}
-        <div className="bg-gray-50 px-3 py-2 border-t flex-shrink-0">
-          <div className="flex justify-end">
-            <button
-              onClick={onClose}
-              className="px-3 py-1 text-sm bg-gray-600 text-white rounded-md hover:bg-gray-700 transition-colors"
-            >
-              Kapat
-            </button>
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-};
-
-export default EmployeeViewModal;
diff --git a/ui/src/views/hr/components/EmploymentTypes.tsx b/ui/src/views/hr/components/EmploymentTypes.tsx
deleted file mode 100644
index e8811eef..00000000
--- a/ui/src/views/hr/components/EmploymentTypes.tsx
+++ /dev/null
@@ -1,454 +0,0 @@
-import React, { useState } from 'react'
-import { FaPlus, FaEdit, FaEye, FaTh, FaList, FaSearch } from 'react-icons/fa'
-import { EmploymentTypeEnum } from '../../../types/hr'
-import { mockEmployees } from '../../../mocks/mockEmployees'
-import { mockEmployeeTypes } from '../../../mocks/mockEmployeeTypes'
-import Widget from '../../../components/common/Widget'
-import { getEmploymentTypeColor, getEmploymentTypeText } from '../../../utils/erp'
-import { Container } from '@/components/shared'
-
-const EmploymentTypes: React.FC = () => {
-  const [viewMode, setViewMode] = useState<'card' | 'list'>('list')
-  const [searchTerm, setSearchTerm] = useState('')
-  const [selectedEmploymentType, setSelectedEmploymentType] = useState<EmploymentTypeEnum | null>(
-    null,
-  )
-  const [showModal, setShowModal] = useState(false)
-  const [modalMode, setModalMode] = useState<'new' | 'edit' | 'view'>('view')
-
-  const handleNewEmploymentType = () => {
-    setModalMode('new')
-    setSelectedEmploymentType(null)
-    setShowModal(true)
-  }
-
-  const handleEditEmploymentType = (type: EmploymentTypeEnum) => {
-    setModalMode('edit')
-    setSelectedEmploymentType(type)
-    setShowModal(true)
-  }
-
-  const handleViewEmploymentType = (type: EmploymentTypeEnum) => {
-    setModalMode('view')
-    setSelectedEmploymentType(type)
-    setShowModal(true)
-  }
-
-  // Filter employee types based on search term
-  const filteredEmployeeTypes = mockEmployeeTypes.filter((employeeType) =>
-    getEmploymentTypeText(employeeType.name as EmploymentTypeEnum)
-      .toLowerCase()
-      .includes(searchTerm.toLowerCase()),
-  )
-
-  return (
-    <Container>
-      <div className="space-y-2">
-        {/* Header */}
-        <div className="flex flex-col gap-4">
-          <div className="flex flex-col sm:flex-row items-start sm:items-center justify-between gap-4">
-            <div>
-              <h2 className="text-2xl font-bold text-gray-900">İstihdam Türleri</h2>
-              <p className="text-gray-600">Personel istihdam türleri ve dağılımı</p>
-            </div>
-
-            {/* New Button - Visible on larger screens */}
-            <div className="hidden sm:flex gap-2">
-              <button
-                onClick={handleNewEmploymentType}
-                className="flex items-center gap-2 bg-blue-600 text-white px-3 py-1.5 text-sm rounded-lg hover:bg-blue-700 transition-colors"
-              >
-                <FaPlus className="w-4 h-4" />
-                <span>Yeni</span>
-              </button>
-            </div>
-          </div>
-
-          {/* Search and Controls */}
-          <div className="flex flex-col sm:flex-row gap-3 sm:gap-4">
-            {/* Search */}
-            <div className="relative flex-1">
-              <FaSearch className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400 w-4 h-4" />
-              <input
-                type="text"
-                placeholder="İstihdam türü ara..."
-                value={searchTerm}
-                onChange={(e) => setSearchTerm(e.target.value)}
-                className="pl-10 pr-4 py-1.5 text-sm border rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent w-full"
-              />
-            </div>
-
-            {/* Controls */}
-            <div className="flex justify-between sm:justify-end items-center gap-3">
-              {/* View Toggle */}
-              <div className="flex bg-gray-100 rounded-lg p-1">
-                <button
-                  onClick={() => setViewMode('card')}
-                  className={`p-2 rounded ${
-                    viewMode === 'card'
-                      ? 'bg-white shadow text-blue-600'
-                      : 'text-gray-600 hover:text-gray-800'
-                  }`}
-                  title="Kart Görünümü"
-                >
-                  <FaTh className="w-4 h-4" />
-                </button>
-                <button
-                  onClick={() => setViewMode('list')}
-                  className={`p-2 rounded ${
-                    viewMode === 'list'
-                      ? 'bg-white shadow text-blue-600'
-                      : 'text-gray-600 hover:text-gray-800'
-                  }`}
-                  title="Liste Görünümü"
-                >
-                  <FaList className="w-4 h-4" />
-                </button>
-              </div>
-
-              {/* New Button - Visible on mobile */}
-              <div className="sm:hidden">
-                <button
-                  onClick={handleNewEmploymentType}
-                  className="flex items-center gap-2 bg-blue-600 text-white px-3 py-1.5 text-sm rounded-lg hover:bg-blue-700 transition-colors"
-                >
-                  <FaPlus className="w-4 h-4" />
-                  <span className="text-sm">Yeni</span>
-                </button>
-              </div>
-            </div>
-          </div>
-        </div>
-
-        {/* Overview Stats */}
-        <div className="grid grid-cols-2 lg:grid-cols-4 gap-4">
-          <Widget
-            title="Toplam Personel"
-            value={mockEmployees.length}
-            color="blue"
-            icon="FaUsers"
-          />
-
-          <Widget
-            title="Tam Zamanlı"
-            value={
-              mockEmployees.filter((a) => a.employmentType === EmploymentTypeEnum.FullTime)
-                .length || 0
-            }
-            color="green"
-            icon="FaClock"
-          />
-
-          <Widget
-            title="Sözleşmeli"
-            value={
-              mockEmployees.filter((a) => a.employmentType === EmploymentTypeEnum.Contract)
-                .length || 0
-            }
-            color="orange"
-            icon="FaFileAlt"
-          />
-
-          <Widget
-            title="İstihdam Türü"
-            value={mockEmployeeTypes.length}
-            color="purple"
-            icon="FaChartBar"
-          />
-        </div>
-
-        {/* Employment Type Distribution */}
-        <div className="bg-white rounded-lg shadow-sm border">
-          {viewMode === 'card' ? (
-            // Card View
-            <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 p-4">
-              {filteredEmployeeTypes.map((a) => {
-                const type = a.name as EmploymentTypeEnum // veya a’dan türet
-                const count = a.count || 0
-                const total = mockEmployees.length
-                const percentage = total > 0 ? (count / total) * 100 : 0
-
-                return (
-                  <div
-                    key={a.id}
-                    className="border rounded-lg p-3 hover:shadow-md transition-shadow"
-                  >
-                    <div className="flex items-center justify-between mb-2">
-                      <div className="flex items-center gap-3">
-                        <div className={`w-4 h-4 rounded-full ${getEmploymentTypeColor(type)}`} />
-                        <h4 className="font-medium text-gray-900 text-sm">
-                          {getEmploymentTypeText(type)}
-                        </h4>
-                      </div>
-                      <span className="text-xs text-gray-500">{percentage.toFixed(1)}%</span>
-                    </div>
-
-                    <div className="space-y-2">
-                      <div className="flex justify-between">
-                        <span className="text-xs text-gray-600">Personel Sayısı</span>
-                        <span className="text-xs font-medium">{count}</span>
-                      </div>
-
-                      <div className="w-full bg-gray-200 rounded-full h-2">
-                        <div
-                          className={`h-2 rounded-full ${getEmploymentTypeColor(type)}`}
-                          style={{ width: `${percentage}%` }}
-                        />
-                      </div>
-
-                      {/* Action Buttons */}
-                      <div className="flex gap-2 mt-2 pt-2 border-t">
-                        <button
-                          onClick={() => handleViewEmploymentType(type)}
-                          className="flex items-center gap-1 px-2 py-1 text-xs bg-blue-50 text-blue-600 rounded-md hover:bg-blue-100 transition-colors"
-                          title="Görüntüle"
-                        >
-                          <FaEye className="w-3 h-3" />
-                          <span className="hidden sm:inline">Görüntüle</span>
-                        </button>
-                        <button
-                          onClick={() => handleEditEmploymentType(type)}
-                          className="flex items-center gap-1 px-2 py-1 text-xs bg-yellow-50 text-yellow-600 rounded-md hover:bg-yellow-100 transition-colors"
-                          title="Düzenle"
-                        >
-                          <FaEdit className="w-3 h-3" />
-                          <span className="hidden sm:inline">Düzenle</span>
-                        </button>
-                      </div>
-                    </div>
-                  </div>
-                )
-              })}
-            </div>
-          ) : (
-            // List View
-            <div className="overflow-x-auto">
-              <table className="min-w-full divide-y divide-gray-200">
-                <thead className="bg-gray-50">
-                  <tr className="text-sm">
-                    <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                      İstihdam Türü
-                    </th>
-                    <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                      Personel Sayısı
-                    </th>
-                    <th className="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                      Yüzde
-                    </th>
-                    <th className="px-3 py-2 text-right text-xs font-medium text-gray-500 uppercase tracking-wider">
-                      İşlemler
-                    </th>
-                  </tr>
-                </thead>
-                <tbody className="bg-white divide-y divide-gray-200">
-                  {filteredEmployeeTypes.map((a) => {
-                    const type = a.name as EmploymentTypeEnum
-                    const count = a.count || 0
-                    const total = mockEmployees.length
-                    const percentage = total > 0 ? (count / total) * 100 : 0
-                    return (
-                      <tr key={type} className="hover:bg-gray-50">
-                        <td className="px-3 py-2 whitespace-nowrap">
-                          <div className="flex items-center">
-                            <div
-                              className={`w-4 h-4 rounded-full mr-3 ${getEmploymentTypeColor(
-                                type,
-                              )}`}
-                            />
-                            <div className="text-sm font-medium text-gray-900">
-                              {getEmploymentTypeText(type)}
-                            </div>
-                          </div>
-                        </td>
-                        <td className="px-3 py-2 whitespace-nowrap text-sm text-gray-900">
-                          {count}
-                        </td>
-                        <td className="px-3 py-2 whitespace-nowrap">
-                          <div className="flex items-center">
-                            <div className="w-16 bg-gray-200 rounded-full h-2 mr-2">
-                              <div
-                                className={`h-2 rounded-full ${getEmploymentTypeColor(type)}`}
-                                style={{ width: `${percentage}%` }}
-                              />
-                            </div>
-                            <span className="text-sm text-gray-900">{percentage.toFixed(1)}%</span>
-                          </div>
-                        </td>
-                        <td className="px-3 py-2 whitespace-nowrap text-right text-sm font-medium">
-                          <div className="flex justify-end gap-2">
-                            <button
-                              onClick={() => handleViewEmploymentType(type)}
-                              className="text-blue-600 hover:text-blue-900 p-1"
-                              title="Görüntüle"
-                            >
-                              <FaEye className="w-4 h-4" />
-                            </button>
-                            <button
-                              onClick={() => handleEditEmploymentType(type)}
-                              className="text-yellow-600 hover:text-yellow-900 p-1"
-                              title="Düzenle"
-                            >
-                              <FaEdit className="w-4 h-4" />
-                            </button>
-                          </div>
-                        </td>
-                      </tr>
-                    )
-                  })}
-                </tbody>
-              </table>
-            </div>
-          )}
-        </div>
-      </div>
-
-      {/* Modal */}
-      {showModal && (
-        <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center p-4 z-50">
-          <div className="bg-white rounded-lg p-4 w-full max-w-md max-h-[90vh] overflow-y-auto">
-            <div className="flex justify-between items-center mb-4">
-              <h3 className="text-base font-semibold">
-                {modalMode === 'new' && 'Yeni İstihdam Türü'}
-                {modalMode === 'edit' && 'İstihdam Türünü Düzenle'}
-                {modalMode === 'view' && 'İstihdam Türü Detayları'}
-              </h3>
-              <button
-                onClick={() => setShowModal(false)}
-                className="text-gray-400 hover:text-gray-600 p-1"
-              >
-                ✕
-              </button>
-            </div>
-
-            <div className="space-y-4">
-              {modalMode === 'new' && (
-                <div className="space-y-4">
-                  <div>
-                    <label className="block text-sm font-medium text-gray-700 mb-2">
-                      İstihdam Türü Adı
-                    </label>
-                    <input
-                      type="text"
-                      className="w-full px-3 py-1.5 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                      placeholder="Örn: Tam Zamanlı"
-                    />
-                  </div>
-                  <div>
-                    <label className="block text-sm font-medium text-gray-700 mb-2">Açıklama</label>
-                    <textarea
-                      rows={3}
-                      className="w-full px-3 py-1.5 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                      placeholder="İstihdam türü açıklaması..."
-                    />
-                  </div>
-                </div>
-              )}
-
-              {modalMode === 'edit' && selectedEmploymentType && (
-                <div className="space-y-4">
-                  <div>
-                    <label className="block text-sm font-medium text-gray-700 mb-2">
-                      İstihdam Türü Adı
-                    </label>
-                    <input
-                      type="text"
-                      defaultValue={getEmploymentTypeText(selectedEmploymentType)}
-                      className="w-full px-3 py-1.5 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                    />
-                  </div>
-                  <div>
-                    <label className="block text-sm font-medium text-gray-700 mb-2">Açıklama</label>
-                    <textarea
-                      rows={3}
-                      defaultValue="Bu istihdam türüne ait açıklama..."
-                      className="w-full px-3 py-1.5 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                    />
-                  </div>
-                </div>
-              )}
-
-              {modalMode === 'view' && selectedEmploymentType && (
-                <div className="space-y-4">
-                  <div>
-                    <p className="text-sm text-gray-600">İstihdam Türü:</p>
-                    <p className="font-medium text-base">
-                      {getEmploymentTypeText(selectedEmploymentType)}
-                    </p>
-                  </div>
-                  <div>
-                    <p className="text-sm text-gray-600">Toplam Personel Sayısı:</p>
-                    <p className="font-medium">
-                      {
-                        mockEmployees.filter((emp) => emp.employmentType === selectedEmploymentType)
-                          .length
-                      }{' '}
-                      kişi
-                    </p>
-                  </div>
-                  <div>
-                    <p className="text-sm text-gray-600">Renk Kodu:</p>
-                    <div className="flex items-center gap-2">
-                      <div
-                        className={`w-4 h-4 rounded-full ${getEmploymentTypeColor(
-                          selectedEmploymentType,
-                        )}`}
-                      />
-                      <span className="text-sm">
-                        {getEmploymentTypeColor(selectedEmploymentType)}
-                      </span>
-                    </div>
-                  </div>
-                  <div>
-                    <p className="text-sm text-gray-600 mb-2">Bu istihdam türündeki personeller:</p>
-                    <div className="max-h-32 overflow-y-auto bg-gray-50 rounded p-2">
-                      {mockEmployees
-                        .filter((emp) => emp.employmentType === selectedEmploymentType)
-                        .slice(0, 10)
-                        .map((emp) => (
-                          <div
-                            key={emp.id}
-                            className="text-sm py-1 border-b border-gray-200 last:border-0"
-                          >
-                            {emp.fullName} - {emp.department?.name}
-                          </div>
-                        ))}
-                      {mockEmployees.filter((emp) => emp.employmentType === selectedEmploymentType)
-                        .length > 10 && (
-                        <div className="text-xs text-gray-500 pt-2">
-                          +
-                          {mockEmployees.filter(
-                            (emp) => emp.employmentType === selectedEmploymentType,
-                          ).length - 10}{' '}
-                          kişi daha...
-                        </div>
-                      )}
-                    </div>
-                  </div>
-                </div>
-              )}
-            </div>
-
-            <div className="flex flex-col sm:flex-row justify-end gap-2 mt-4">
-              <button
-                onClick={() => setShowModal(false)}
-                className="px-3 py-1.5 text-sm text-gray-600 border rounded-md hover:bg-gray-50 order-2 sm:order-1"
-              >
-                {modalMode === 'view' ? 'Kapat' : 'İptal'}
-              </button>
-              {modalMode !== 'view' && (
-                <button
-                  onClick={() => setShowModal(false)}
-                  className="px-3 py-1.5 text-sm bg-blue-600 text-white rounded-md hover:bg-blue-700 order-1 sm:order-2"
-                >
-                  {modalMode === 'new' ? 'Oluştur' : 'Güncelle'}
-                </button>
-              )}
-            </div>
-          </div>
-        </div>
-      )}
-    </Container>
-  )
-}
-
-export default EmploymentTypes
diff --git a/ui/src/views/hr/components/JobPositionFormModal.tsx b/ui/src/views/hr/components/JobPositionFormModal.tsx
deleted file mode 100644
index 5843e41e..00000000
--- a/ui/src/views/hr/components/JobPositionFormModal.tsx
+++ /dev/null
@@ -1,484 +0,0 @@
-import React, { useState, useEffect } from 'react'
-import { FaSave, FaTimes, FaPlus, FaTrash } from 'react-icons/fa'
-import { JobPositionDto, JobLevelEnum } from '../../../types/hr'
-import { mockDepartments } from '../../../mocks/mockDepartments'
-import { getJobLevelText } from '@/utils/erp'
-import { mockCurrencies } from '@/mocks/mockCurrencies'
-
-interface JobPositionFormModalProps {
-  isOpen: boolean
-  onClose: () => void
-  onSave: (position: Partial<JobPositionDto>) => void
-  position?: JobPositionDto
-  title: string
-}
-
-const JobPositionFormModal: React.FC<JobPositionFormModalProps> = ({
-  isOpen,
-  onClose,
-  onSave,
-  position,
-  title,
-}) => {
-  const [formData, setFormData] = useState({
-    positionCode: '',
-    title: '',
-    description: '',
-    departmentId: '',
-    level: JobLevelEnum.Entry,
-    minSalary: 0,
-    maxSalary: 0,
-    currency: 'TRY',
-    requiredSkills: [] as string[],
-    responsibilities: [] as string[],
-    qualifications: [] as string[],
-    isActive: true,
-  })
-
-  const [errors, setErrors] = useState<Record<string, string>>({})
-  const [skillInput, setSkillInput] = useState('')
-  const [responsibilityInput, setResponsibilityInput] = useState('')
-  const [qualificationInput, setQualificationInput] = useState('')
-
-  useEffect(() => {
-    if (position) {
-      setFormData({
-        positionCode: position.code,
-        title: position.name,
-        description: position.description || '',
-        departmentId: position.departmentId,
-        level: position.level,
-        minSalary: position.minSalary,
-        maxSalary: position.maxSalary,
-        currency: position.currency,
-        requiredSkills: [...(position.requiredSkills || [])],
-        responsibilities: [...(position.responsibilities || [])],
-        qualifications: [...(position.qualifications || [])],
-        isActive: position.isActive,
-      })
-    } else {
-      setFormData({
-        positionCode: '',
-        title: '',
-        description: '',
-        departmentId: '',
-        level: JobLevelEnum.Entry,
-        minSalary: 0,
-        maxSalary: 0,
-        currency: 'TRY',
-        requiredSkills: [],
-        responsibilities: [],
-        qualifications: [],
-        isActive: true,
-      })
-    }
-    setErrors({})
-    setSkillInput('')
-    setResponsibilityInput('')
-    setQualificationInput('')
-  }, [position, isOpen])
-
-  const validateForm = (): boolean => {
-    const newErrors: Record<string, string> = {}
-
-    if (!formData.positionCode.trim()) {
-      newErrors.positionCode = 'Pozisyon kodu zorunludur'
-    }
-
-    if (!formData.title.trim()) {
-      newErrors.title = 'Pozisyon adı zorunludur'
-    }
-
-    if (!formData.departmentId) {
-      newErrors.departmentId = 'Departman seçimi zorunludur'
-    }
-
-    if (formData.minSalary < 0) {
-      newErrors.minSalary = 'Minimum maaş negatif olamaz'
-    }
-
-    if (formData.maxSalary < 0) {
-      newErrors.maxSalary = 'Maksimum maaş negatif olamaz'
-    }
-
-    if (formData.maxSalary < formData.minSalary) {
-      newErrors.maxSalary = 'Maksimum maaş minimum maaştan düşük olamaz'
-    }
-
-    setErrors(newErrors)
-    return Object.keys(newErrors).length === 0
-  }
-
-  const handleSubmit = (e: React.FormEvent) => {
-    e.preventDefault()
-    if (validateForm()) {
-      onSave(formData)
-      onClose()
-    }
-  }
-
-  const handleInputChange = (field: string, value: string | number | boolean | JobLevelEnum) => {
-    setFormData((prev) => ({
-      ...prev,
-      [field]: value,
-    }))
-  }
-
-  const addSkill = () => {
-    if (skillInput.trim() && !formData.requiredSkills.includes(skillInput.trim())) {
-      setFormData((prev) => ({
-        ...prev,
-        requiredSkills: [...prev.requiredSkills, skillInput.trim()],
-      }))
-      setSkillInput('')
-    }
-  }
-
-  const removeSkill = (index: number) => {
-    setFormData((prev) => ({
-      ...prev,
-      requiredSkills: prev.requiredSkills.filter((_, i) => i !== index),
-    }))
-  }
-
-  const addResponsibility = () => {
-    if (
-      responsibilityInput.trim() &&
-      !formData.responsibilities.includes(responsibilityInput.trim())
-    ) {
-      setFormData((prev) => ({
-        ...prev,
-        responsibilities: [...prev.responsibilities, responsibilityInput.trim()],
-      }))
-      setResponsibilityInput('')
-    }
-  }
-
-  const removeResponsibility = (index: number) => {
-    setFormData((prev) => ({
-      ...prev,
-      responsibilities: prev.responsibilities.filter((_, i) => i !== index),
-    }))
-  }
-
-  const addQualification = () => {
-    if (qualificationInput.trim() && !formData.qualifications.includes(qualificationInput.trim())) {
-      setFormData((prev) => ({
-        ...prev,
-        qualifications: [...prev.qualifications, qualificationInput.trim()],
-      }))
-      setQualificationInput('')
-    }
-  }
-
-  const removeQualification = (index: number) => {
-    setFormData((prev) => ({
-      ...prev,
-      qualifications: prev.qualifications.filter((_, i) => i !== index),
-    }))
-  }
-
-  if (!isOpen) return null
-
-  return (
-    <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4">
-      <div className="bg-white rounded-lg shadow-xl w-full max-w-2xl max-h-[90vh] overflow-y-auto">
-        <div className="flex items-center justify-between p-3 border-b">
-          <h2 className="text-xl font-bold text-gray-900">{title}</h2>
-          <button onClick={onClose} className="p-1 hover:bg-gray-100 rounded-full">
-            <FaTimes className="w-5 h-5" />
-          </button>
-        </div>
-
-        <form onSubmit={handleSubmit} className="p-3 space-y-3">
-          {/* Basic Information */}
-          <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
-            <div>
-              <label className="block text-xs font-medium text-gray-700 mb-1">
-                Pozisyon Kodu *
-              </label>
-              <input
-                autoFocus
-                type="text"
-                value={formData.positionCode}
-                onChange={(e) => handleInputChange('positionCode', e.target.value)}
-                className={`w-full px-2 py-1 text-sm border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 ${
-                  errors.positionCode ? 'border-red-500' : 'border-gray-300'
-                }`}
-                placeholder="Örn: DEV-001"
-              />
-              {errors.positionCode && (
-                <p className="text-red-500 text-sm mt-1">{errors.positionCode}</p>
-              )}
-            </div>
-
-            <div>
-              <label className="block text-xs font-medium text-gray-700 mb-1">Pozisyon Adı *</label>
-              <input
-                type="text"
-                value={formData.title}
-                onChange={(e) => handleInputChange('title', e.target.value)}
-                className={`w-full px-2 py-1 text-sm border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 ${
-                  errors.title ? 'border-red-500' : 'border-gray-300'
-                }`}
-                placeholder="Örn: Software Developer"
-              />
-              {errors.title && <p className="text-red-500 text-sm mt-1">{errors.title}</p>}
-            </div>
-          </div>
-
-          <div>
-            <label className="block text-xs font-medium text-gray-700 mb-1">Açıklama</label>
-            <textarea
-              value={formData.description}
-              onChange={(e) => handleInputChange('description', e.target.value)}
-              rows={2}
-              className="w-full px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-              placeholder="Pozisyon açıklaması..."
-            />
-          </div>
-
-          <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
-            <div>
-              <label className="block text-xs font-medium text-gray-700 mb-1">Departman *</label>
-              <select
-                value={formData.departmentId}
-                onChange={(e) => handleInputChange('departmentId', e.target.value)}
-                className={`w-full px-2 py-1 text-sm border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 ${
-                  errors.departmentId ? 'border-red-500' : 'border-gray-300'
-                }`}
-              >
-                <option value="">Departman seçin</option>
-                {mockDepartments.map((dept) => (
-                  <option key={dept.id} value={dept.id}>
-                    {dept.name}
-                  </option>
-                ))}
-              </select>
-              {errors.departmentId && (
-                <p className="text-red-500 text-sm mt-1">{errors.departmentId}</p>
-              )}
-            </div>
-
-            <div>
-              <label className="block text-xs font-medium text-gray-700 mb-1">Seviye</label>
-              <select
-                value={formData.level}
-                onChange={(e) => handleInputChange('level', e.target.value as JobLevelEnum)}
-                className="w-full px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-              >
-                {Object.values(JobLevelEnum).map((level) => (
-                  <option key={level} value={level}>
-                    {getJobLevelText(level)}
-                  </option>
-                ))}
-              </select>
-            </div>
-          </div>
-
-          {/* Salary Information */}
-          <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
-            <div>
-              <label className="block text-xs font-medium text-gray-700 mb-1">Minimum Maaş *</label>
-              <input
-                type="number"
-                value={formData.minSalary}
-                onChange={(e) => handleInputChange('minSalary', Number(e.target.value))}
-                className={`w-full px-2 py-1 text-sm border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 ${
-                  errors.minSalary ? 'border-red-500' : 'border-gray-300'
-                }`}
-                min="0"
-              />
-              {errors.minSalary && <p className="text-red-500 text-sm mt-1">{errors.minSalary}</p>}
-            </div>
-
-            <div>
-              <label className="block text-xs font-medium text-gray-700 mb-1">
-                Maksimum Maaş *
-              </label>
-              <input
-                type="number"
-                value={formData.maxSalary}
-                onChange={(e) => handleInputChange('maxSalary', Number(e.target.value))}
-                className={`w-full px-2 py-1 text-sm border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 ${
-                  errors.maxSalary ? 'border-red-500' : 'border-gray-300'
-                }`}
-                min="0"
-              />
-              {errors.maxSalary && <p className="text-red-500 text-sm mt-1">{errors.maxSalary}</p>}
-            </div>
-
-            <div>
-              <label className="block text-xs font-medium text-gray-700 mb-1">Para Birimi</label>
-              <select
-                value={formData.currency}
-                onChange={(e) => handleInputChange('currency', e.target.value)}
-                className="w-full px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-              >
-                {mockCurrencies.map((currency) => (
-                  <option key={currency.value} value={currency.value}>
-                    {currency.value} - {currency.label}
-                  </option>
-                ))}
-              </select>
-            </div>
-          </div>
-
-          {/* Required Skills */}
-          <div>
-            <label className="block text-xs font-medium text-gray-700 mb-1">
-              Gerekli Yetenekler
-            </label>
-            <div className="flex gap-2 mb-2">
-              <input
-                type="text"
-                value={skillInput}
-                onChange={(e) => setSkillInput(e.target.value)}
-                onKeyPress={(e) => e.key === 'Enter' && (e.preventDefault(), addSkill())}
-                className="flex-1 px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                placeholder="Yetenek ekleyin..."
-              />
-              <button
-                type="button"
-                onClick={addSkill}
-                className="px-2 py-1.5 text-sm bg-blue-600 text-white rounded-md hover:bg-blue-700"
-              >
-                <FaPlus className="w-4 h-4" />
-              </button>
-            </div>
-            <div className="flex flex-wrap gap-2">
-              {formData.requiredSkills.map((skill, index) => (
-                <span
-                  key={index}
-                  className="inline-flex items-center gap-1 px-2 py-1 bg-blue-50 text-blue-700 rounded-full text-xs"
-                >
-                  {skill}
-                  <button
-                    type="button"
-                    onClick={() => removeSkill(index)}
-                    className="hover:text-blue-900"
-                  >
-                    <FaTrash className="w-3 h-3" />
-                  </button>
-                </span>
-              ))}
-            </div>
-          </div>
-
-          {/* Responsibilities */}
-          <div>
-            <label className="block text-xs font-medium text-gray-700 mb-1">Sorumluluklar</label>
-            <div className="flex gap-2 mb-2">
-              <input
-                type="text"
-                value={responsibilityInput}
-                onChange={(e) => setResponsibilityInput(e.target.value)}
-                onKeyPress={(e) => e.key === 'Enter' && (e.preventDefault(), addResponsibility())}
-                className="flex-1 px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                placeholder="Sorumluluk ekleyin..."
-              />
-              <button
-                type="button"
-                onClick={addResponsibility}
-                className="px-2 py-1.5 text-sm bg-green-600 text-white rounded-md hover:bg-green-700"
-              >
-                <FaPlus className="w-4 h-4" />
-              </button>
-            </div>
-            <div className="space-y-2">
-              {formData.responsibilities.map((responsibility, index) => (
-                <div
-                  key={index}
-                  className="flex items-center justify-between p-2 bg-green-50 rounded-md text-sm"
-                >
-                  <span className="text-green-800 text-sm">{responsibility}</span>
-                  <button
-                    type="button"
-                    onClick={() => removeResponsibility(index)}
-                    className="text-green-600 hover:text-green-800"
-                  >
-                    <FaTrash className="w-3 h-3" />
-                  </button>
-                </div>
-              ))}
-            </div>
-          </div>
-
-          {/* Qualifications */}
-          <div>
-            <label className="block text-xs font-medium text-gray-700 mb-1">Nitelikler</label>
-            <div className="flex gap-2 mb-2">
-              <input
-                type="text"
-                value={qualificationInput}
-                onChange={(e) => setQualificationInput(e.target.value)}
-                onKeyPress={(e) => e.key === 'Enter' && (e.preventDefault(), addQualification())}
-                className="flex-1 px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                placeholder="Nitelik ekleyin..."
-              />
-              <button
-                type="button"
-                onClick={addQualification}
-                className="px-2 py-1.5 text-sm bg-purple-600 text-white rounded-md hover:bg-purple-700"
-              >
-                <FaPlus className="w-4 h-4" />
-              </button>
-            </div>
-            <div className="space-y-2">
-              {formData.qualifications.map((qualification, index) => (
-                <div
-                  key={index}
-                  className="flex items-center justify-between p-2 bg-purple-50 rounded-md text-sm"
-                >
-                  <span className="text-purple-800 text-sm">{qualification}</span>
-                  <button
-                    type="button"
-                    onClick={() => removeQualification(index)}
-                    className="text-purple-600 hover:text-purple-800"
-                  >
-                    <FaTrash className="w-3 h-3" />
-                  </button>
-                </div>
-              ))}
-            </div>
-          </div>
-
-          {/* Status */}
-          <div className="flex items-center">
-            <input
-              type="checkbox"
-              id="isActive"
-              checked={formData.isActive}
-              onChange={(e) => handleInputChange('isActive', e.target.checked)}
-              className="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded"
-            />
-            <label htmlFor="isActive" className="ml-2 block text-sm text-gray-900">
-              Aktif pozisyon
-            </label>
-          </div>
-
-          {/* Form Actions */}
-          <div className="flex gap-2 pt-3 border-t">
-            <button
-              type="submit"
-              className="flex items-center gap-2 px-3 py-1.5 text-sm bg-blue-600 text-white rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500"
-            >
-              <FaSave className="w-4 h-4" />
-              Kaydet
-            </button>
-            <button
-              type="button"
-              onClick={onClose}
-              className="flex items-center gap-2 px-3 py-1.5 text-sm bg-gray-300 text-gray-700 rounded-md hover:bg-gray-400 focus:outline-none focus:ring-2 focus:ring-gray-500"
-            >
-              <FaTimes className="w-4 h-4" />
-              İptal
-            </button>
-          </div>
-        </form>
-      </div>
-    </div>
-  )
-}
-
-export default JobPositionFormModal
diff --git a/ui/src/views/hr/components/JobPositionViewModal.tsx b/ui/src/views/hr/components/JobPositionViewModal.tsx
deleted file mode 100644
index d94ba8fa..00000000
--- a/ui/src/views/hr/components/JobPositionViewModal.tsx
+++ /dev/null
@@ -1,226 +0,0 @@
-import React from "react";
-import {
-  FaTimes,
-  FaBriefcase,
-  FaBuilding,
-  FaUsers,
-  FaDollarSign,
-  FaClock,
-} from "react-icons/fa";
-import { JobPositionDto } from "../../../types/hr";
-import { getJobLevelColor, getJobLevelText } from "../../../utils/erp";
-
-interface JobPositionViewModalProps {
-  isOpen: boolean;
-  onClose: () => void;
-  position: JobPositionDto | null | undefined;
-}
-
-const JobPositionViewModal: React.FC<JobPositionViewModalProps> = ({
-  isOpen,
-  onClose,
-  position,
-}) => {
-  if (!isOpen || !position) return null;
-
-  return (
-    <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4">
-      <div className="bg-white rounded-lg shadow-xl w-full max-w-2xl max-h-[90vh] overflow-y-auto">
-        <div className="flex items-center justify-between p-3 border-b">
-          <div className="flex items-center gap-3">
-            <FaBriefcase className="w-6 h-6 text-blue-600" />
-            <div>
-              <h2 className="text-2xl font-bold text-gray-900">
-                {position.name}
-              </h2>
-              <p className="text-gray-600">{position.code}</p>
-            </div>
-          </div>
-          <button
-            onClick={onClose}
-            className="p-1 hover:bg-gray-100 rounded-full"
-          >
-            <FaTimes className="w-5 h-5" />
-          </button>
-        </div>
-
-        <div className="p-3 space-y-3">
-          {/* Status and Level */}
-          <div className="flex flex-wrap items-center gap-3">
-            <span
-              className={`px-2 py-1 text-xs font-medium rounded-full ${getJobLevelColor(
-                position.level
-              )}`}
-            >
-              {getJobLevelText(position.level)}
-            </span>
-            <span
-              className={`px-2 py-1 text-xs font-medium rounded-full ${
-                position.isActive
-                  ? "bg-green-100 text-green-800"
-                  : "bg-red-100 text-red-800"
-              }`}
-            >
-              {position.isActive ? "Aktif" : "Pasif"}
-            </span>
-          </div>
-
-          {/* Basic Information */}
-          <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
-            <div className="space-y-4">
-              <div>
-                <h3 className="text-sm font-medium text-gray-900 mb-2">
-                  Temel Bilgiler
-                </h3>
-                <div className="space-y-2 text-sm">
-                  <div className="flex items-center gap-3">
-                    <FaBuilding className="w-4 h-4 text-gray-500" />
-                    <div>
-                      <p className="text-sm font-medium text-gray-500">
-                        Departman
-                      </p>
-                      <p className="text-gray-900">
-                        {position.department?.name || "Belirtilmemiş"}
-                      </p>
-                    </div>
-                  </div>
-
-                  <div className="flex items-center gap-3">
-                    <FaUsers className="w-4 h-4 text-gray-500" />
-                    <div>
-                      <p className="text-sm font-medium text-gray-500">
-                        Mevcut Personel
-                      </p>
-                      <p className="text-gray-900">
-                        {position.employees?.length || 0} kişi
-                      </p>
-                    </div>
-                  </div>
-
-                  <div className="flex items-center gap-3">
-                    <FaDollarSign className="w-4 h-4 text-gray-500" />
-                    <div>
-                      <p className="text-sm font-medium text-gray-500">
-                        Maaş Aralığı
-                      </p>
-                      <p className="text-gray-900">
-                        {position.minSalary.toLocaleString()} -{" "}
-                        {position.maxSalary.toLocaleString()}{" "}
-                        {position.currency}
-                      </p>
-                    </div>
-                  </div>
-
-                  <div className="flex items-center gap-3">
-                    <FaClock className="w-4 h-4 text-gray-500" />
-                    <div>
-                      <p className="text-sm font-medium text-gray-500">
-                        Oluşturulma Tarihi
-                      </p>
-                      <p className="text-gray-900">
-                        {position.creationTime.toLocaleDateString("tr-TR")}
-                      </p>
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-
-            <div>
-              <h3 className="text-sm font-medium text-gray-900 mb-2">
-                Açıklama
-              </h3>
-              <p className="text-gray-700 leading-relaxed">
-                {position.description || "Açıklama bulunmuyor."}
-              </p>
-            </div>
-          </div>
-
-          {/* Skills */}
-          {position.requiredSkills && position.requiredSkills.length > 0 && (
-            <div className="text-sm">
-              <h3 className="text-base font-medium text-gray-900 mb-2">
-                Gerekli Yetenekler
-              </h3>
-              <div className="flex flex-wrap gap-2">
-                {position.requiredSkills.map((skill, index) => (
-                  <span
-                    key={index}
-                    className="px-2 py-1 text-xs bg-blue-50 text-blue-700 rounded-full"
-                  >
-                    {skill}
-                  </span>
-                ))}
-              </div>
-            </div>
-          )}
-
-          {/* Responsibilities */}
-          {position.responsibilities &&
-            position.responsibilities.length > 0 && (
-              <div className="text-sm">
-                <h3 className="text-base font-medium text-gray-900 mb-2">
-                  Sorumluluklar
-                </h3>
-                <div className="space-y-2">
-                  {position.responsibilities.map((responsibility, index) => (
-                    <div key={index} className="flex items-start gap-2">
-                      <div className="w-2 h-2 bg-green-500 rounded-full mt-2 flex-shrink-0" />
-                      <p className="text-gray-700">{responsibility}</p>
-                    </div>
-                  ))}
-                </div>
-              </div>
-            )}
-
-          {/* Qualifications */}
-          {position.qualifications && position.qualifications.length > 0 && (
-            <div className="text-sm">
-              <h3 className="text-base font-medium text-gray-900 mb-2">
-                Nitelikler
-              </h3>
-              <div className="space-y-2">
-                {position.qualifications.map((qualification, index) => (
-                  <div key={index} className="flex items-start gap-2">
-                    <div className="w-2 h-2 bg-purple-500 rounded-full mt-2 flex-shrink-0" />
-                    <p className="text-gray-700">{qualification}</p>
-                  </div>
-                ))}
-              </div>
-            </div>
-          )}
-
-          {/* Employees in this position */}
-          {position.employees && position.employees.length > 0 && (
-            <div className="text-sm">
-              <h3 className="text-base font-medium text-gray-900 mb-2">
-                Bu Pozisyondaki Personeller
-              </h3>
-              <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-2">
-                {position.employees.map((employee, index) => (
-                  <div key={index} className="p-1.5 bg-gray-50 rounded-md">
-                    <p className="font-medium text-gray-900">
-                      {employee.fullName}
-                    </p>
-                    <p className="text-sm text-gray-500">{employee.email}</p>
-                  </div>
-                ))}
-              </div>
-            </div>
-          )}
-        </div>
-
-        <div className="p-3 border-t bg-gray-50">
-          <button
-            onClick={onClose}
-            className="w-full sm:w-auto px-3 py-1.5 text-xs bg-gray-600 text-white rounded-md hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-gray-500"
-          >
-            Kapat
-          </button>
-        </div>
-      </div>
-    </div>
-  );
-};
-
-export default JobPositionViewModal;
diff --git a/ui/src/views/hr/components/JobPositions.tsx b/ui/src/views/hr/components/JobPositions.tsx
deleted file mode 100644
index d2246c8e..00000000
--- a/ui/src/views/hr/components/JobPositions.tsx
+++ /dev/null
@@ -1,508 +0,0 @@
-import React, { useState } from 'react'
-import {
-  FaBriefcase,
-  FaPlus,
-  FaEdit,
-  FaTrash,
-  FaUsers,
-  FaDollarSign,
-  FaBuilding,
-  FaEye,
-  FaTh,
-  FaList,
-} from 'react-icons/fa'
-import { JobPositionDto, JobLevelEnum } from '../../../types/hr'
-import DataTable, { Column } from '../../../components/common/DataTable'
-import { mockJobPositions } from '../../../mocks/mockJobPositions'
-import JobPositionFormModal from './JobPositionFormModal'
-import JobPositionViewModal from './JobPositionViewModal'
-import { getJobLevelColor, getJobLevelText } from '../../../utils/erp'
-import { Container } from '@/components/shared'
-
-const JobPositions: React.FC = () => {
-  const [positions, setPositions] = useState<JobPositionDto[]>(mockJobPositions)
-  const [searchTerm, setSearchTerm] = useState('')
-  const [selectedLevel, setSelectedLevel] = useState<string>('all')
-  const [selectedDepartment, setSelectedDepartment] = useState<string>('all')
-  const [viewMode, setViewMode] = useState<'list' | 'card'>('list')
-
-  // Modal states
-  const [isFormModalOpen, setIsFormModalOpen] = useState(false)
-  const [isViewModalOpen, setIsViewModalOpen] = useState(false)
-  const [selectedPosition, setSelectedPosition] = useState<JobPositionDto | undefined>(undefined)
-  const [modalTitle, setModalTitle] = useState('')
-
-  const handleAdd = () => {
-    setSelectedPosition(undefined)
-    setModalTitle('Yeni İş Pozisyonu')
-    setIsFormModalOpen(true)
-  }
-
-  const handleEdit = (position: JobPositionDto) => {
-    setSelectedPosition(position)
-    setModalTitle('İş Pozisyonu Düzenle')
-    setIsFormModalOpen(true)
-  }
-
-  const handleView = (position: JobPositionDto) => {
-    setSelectedPosition(position)
-    setIsViewModalOpen(true)
-  }
-
-  const handleDelete = (id: string) => {
-    if (window.confirm('Bu pozisyonu silmek istediğinizden emin misiniz?')) {
-      setPositions(positions.filter((p) => p.id !== id))
-    }
-  }
-
-  const handleSavePosition = (positionData: Partial<JobPositionDto>) => {
-    if (selectedPosition) {
-      // Edit existing position
-      const updatedPosition = {
-        ...selectedPosition,
-        ...positionData,
-        lastModificationTime: new Date(),
-      }
-      setPositions(positions.map((p) => (p.id === selectedPosition.id ? updatedPosition : p)))
-    } else {
-      // Add new position
-      const newPosition: JobPositionDto = {
-        id: `jp-${Date.now()}`,
-        ...positionData,
-        employees: [],
-        creationTime: new Date(),
-        lastModificationTime: new Date(),
-      } as JobPositionDto
-      setPositions([...positions, newPosition])
-    }
-  }
-
-  const closeFormModal = () => {
-    setIsFormModalOpen(false)
-    setSelectedPosition(undefined)
-    setModalTitle('')
-  }
-
-  const closeViewModal = () => {
-    setIsViewModalOpen(false)
-    setSelectedPosition(undefined)
-  }
-
-  const filteredPositions = positions.filter((position) => {
-    if (
-      searchTerm &&
-      !position.name.toLowerCase().includes(searchTerm.toLowerCase()) &&
-      !position.code.toLowerCase().includes(searchTerm.toLowerCase())
-    ) {
-      return false
-    }
-    if (selectedLevel !== 'all' && position.level !== selectedLevel) {
-      return false
-    }
-    if (selectedDepartment !== 'all' && position.department?.id !== selectedDepartment) {
-      return false
-    }
-    return true
-  })
-
-  // Card component for individual position
-  const PositionCard: React.FC<{ position: JobPositionDto }> = ({ position }) => (
-    <div className="bg-white rounded-lg shadow-sm border hover:shadow-md transition-shadow p-4">
-      <div className="flex items-start justify-between mb-4">
-        <div className="flex-1">
-          <div className="flex items-center gap-2 mb-2">
-            <h3 className="text-base font-semibold text-gray-900">{position.name}</h3>
-            <span
-              className={`px-2 py-1 text-xs font-medium rounded-full ${getJobLevelColor(
-                position.level,
-              )}`}
-            >
-              {getJobLevelText(position.level)}
-            </span>
-          </div>
-          <p className="text-sm text-gray-600 mb-2">{position.code}</p>
-          <p
-            className="text-sm text-gray-700 overflow-hidden"
-            style={{
-              display: '-webkit-box',
-              WebkitLineClamp: 2,
-              WebkitBoxOrient: 'vertical',
-            }}
-          >
-            {position.description}
-          </p>
-        </div>
-        <span
-          className={`px-2 py-1 text-xs font-medium rounded-full ${
-            position.isActive ? 'bg-green-100 text-green-800' : 'bg-red-100 text-red-800'
-          }`}
-        >
-          {position.isActive ? 'Aktif' : 'Pasif'}
-        </span>
-      </div>
-
-      <div className="space-y-2 mb-3">
-        <div className="flex items-center gap-2 text-sm text-gray-600">
-          <FaBuilding className="w-4 h-4" />
-          <span>{position.department?.name || 'Departman belirtilmemiş'}</span>
-        </div>
-
-        <div className="flex items-center gap-2 text-sm text-gray-600">
-          <FaUsers className="w-4 h-4" />
-          <span>{position.employees?.length || 0} personel</span>
-        </div>
-
-        <div className="flex items-center gap-2 text-sm text-gray-600">
-          <FaDollarSign className="w-4 h-4" />
-          <span>
-            ₺{position.minSalary.toLocaleString()} - ₺{position.maxSalary.toLocaleString()}
-          </span>
-        </div>
-      </div>
-
-      <div className="mb-3">
-        <p className="text-xs font-medium text-gray-500 mb-2">Gerekli Yetenekler</p>
-        <div className="flex flex-wrap gap-1">
-          {position.requiredSkills?.slice(0, 4).map((skill, index) => (
-            <span key={index} className="px-2 py-1 text-xs bg-blue-50 text-blue-700 rounded">
-              {skill}
-            </span>
-          ))}
-          {position.requiredSkills?.length > 4 && (
-            <span className="text-xs text-gray-500 px-2 py-1">
-              +{position.requiredSkills.length - 4} daha
-            </span>
-          )}
-        </div>
-      </div>
-
-      <div className="flex gap-1.5">
-        <button
-          onClick={() => handleView(position)}
-          className="flex-1 flex items-center justify-center gap-1 px-2 py-1.5 text-xs text-green-700 bg-green-50 hover:bg-green-100 rounded-md transition-colors"
-        >
-          <FaEye className="w-4 h-4" />
-          Görüntüle
-        </button>
-        <button
-          onClick={() => handleEdit(position)}
-          className="flex-1 flex items-center justify-center gap-1 px-2 py-1.5 text-xs text-blue-700 bg-blue-50 hover:bg-blue-100 rounded-md transition-colors"
-        >
-          <FaEdit className="w-4 h-4" />
-          Düzenle
-        </button>
-        <button
-          onClick={() => handleDelete(position.id)}
-          className="px-2 py-1.5 text-xs text-red-700 bg-red-50 hover:bg-red-100 rounded-md transition-colors"
-        >
-          <FaTrash className="w-4 h-4" />
-        </button>
-      </div>
-    </div>
-  )
-
-  const columns: Column<JobPositionDto>[] = [
-    {
-      key: 'code',
-      header: 'Pozisyon Kodu',
-      sortable: true,
-    },
-    {
-      key: 'title',
-      header: 'Pozisyon Adı',
-      sortable: true,
-      render: (position: JobPositionDto) => (
-        <div>
-          <div className="font-medium text-gray-900">{position.name}</div>
-          <div className="text-sm text-gray-500 truncate max-w-xs">{position.description}</div>
-        </div>
-      ),
-    },
-    {
-      key: 'department',
-      header: 'Departman',
-      render: (position: JobPositionDto) => (
-        <div className="flex items-center gap-2">
-          <FaBuilding className="w-4 h-4 text-gray-500" />
-          <span>{position.department?.name || '-'}</span>
-        </div>
-      ),
-    },
-    {
-      key: 'level',
-      header: 'Seviye',
-      render: (position: JobPositionDto) => (
-        <span
-          className={`px-2 py-1 text-xs font-medium rounded-full ${getJobLevelColor(
-            position.level,
-          )}`}
-        >
-          {getJobLevelText(position.level)}
-        </span>
-      ),
-    },
-    {
-      key: 'employeeCount',
-      header: 'Personel Sayısı',
-      render: (position: JobPositionDto) => (
-        <div className="flex items-center gap-1">
-          <FaUsers className="w-4 h-4 text-gray-500" />
-          <span>{position.employees?.length || 0}</span>
-        </div>
-      ),
-    },
-    {
-      key: 'salary',
-      header: 'Maaş Aralığı',
-      render: (position: JobPositionDto) => (
-        <div className="flex items-center gap-1">
-          <FaDollarSign className="w-4 h-4 text-gray-500" />
-          <div className="text-sm">
-            <div>₺{position.minSalary.toLocaleString()}</div>
-            <div className="text-gray-500">₺{position.maxSalary.toLocaleString()}</div>
-          </div>
-        </div>
-      ),
-    },
-    {
-      key: 'skills',
-      header: 'Gerekli Yetenekler',
-      render: (position: JobPositionDto) => (
-        <div className="flex flex-wrap gap-1 max-w-xs">
-          {position.requiredSkills?.slice(0, 3).map((skill, index) => (
-            <span key={index} className="px-2 py-1 text-xs bg-blue-50 text-blue-700 rounded">
-              {skill}
-            </span>
-          ))}
-          {position.requiredSkills?.length > 3 && (
-            <span className="text-xs text-gray-500">
-              +{position.requiredSkills.length - 3} daha
-            </span>
-          )}
-        </div>
-      ),
-    },
-    {
-      key: 'status',
-      header: 'Durum',
-      render: (position: JobPositionDto) => (
-        <span
-          className={`px-2 py-1 text-xs font-medium rounded-full ${
-            position.isActive ? 'bg-green-100 text-green-800' : 'bg-red-100 text-red-800'
-          }`}
-        >
-          {position.isActive ? 'Aktif' : 'Pasif'}
-        </span>
-      ),
-    },
-    {
-      key: 'actions',
-      header: 'İşlemler',
-      render: (position: JobPositionDto) => (
-        <div className="flex gap-2">
-          <button
-            onClick={() => handleView(position)}
-            className="p-1 text-green-600 hover:bg-green-50 rounded"
-            title="Görüntüle"
-          >
-            <FaEye className="w-4 h-4" />
-          </button>
-          <button
-            onClick={() => handleEdit(position)}
-            className="p-1 text-blue-600 hover:bg-blue-50 rounded"
-            title="Düzenle"
-          >
-            <FaEdit className="w-4 h-4" />
-          </button>
-          <button
-            onClick={() => handleDelete(position.id)}
-            className="p-1 text-red-600 hover:bg-red-50 rounded"
-            title="Sil"
-          >
-            <FaTrash className="w-4 h-4" />
-          </button>
-        </div>
-      ),
-    },
-  ]
-
-  // Get unique departments for filter
-  const departments = [...new Set(positions.map((p) => p.department).filter(Boolean))]
-
-  return (
-    <Container>
-      <div className="space-y-2">
-        {/* Header */}
-        <div className="flex flex-col sm:flex-row items-start sm:items-center justify-between gap-4">
-          <div>
-            <h2 className="text-2xl font-bold text-gray-900">İş Pozisyonları</h2>
-            <p className="text-gray-600">Şirket pozisyonları ve iş tanımları yönetimi</p>
-          </div>
-          <div className="flex items-center gap-3">
-            {/* View Toggle */}
-            <div className="flex bg-gray-100 rounded-lg p-0.5">
-              <button
-                onClick={() => setViewMode('list')}
-                className={`flex items-center gap-2 px-2 py-1.5 rounded-md text-sm font-medium transition-colors ${
-                  viewMode === 'list'
-                    ? 'bg-white text-gray-900 shadow-sm'
-                    : 'text-gray-500 hover:text-gray-700'
-                }`}
-              >
-                <FaList className="w-4 h-4" />
-              </button>
-              <button
-                onClick={() => setViewMode('card')}
-                className={`flex items-center gap-2 px-2 py-1.5 rounded-md text-sm font-medium transition-colors ${
-                  viewMode === 'card'
-                    ? 'bg-white text-gray-900 shadow-sm'
-                    : 'text-gray-500 hover:text-gray-700'
-                }`}
-              >
-                <FaTh className="w-4 h-4" />
-              </button>
-            </div>
-
-            <button
-              onClick={handleAdd}
-              className="flex items-center gap-2 px-3 py-1.5 text-sm bg-blue-600 text-white rounded-md hover:bg-blue-700 transition-colors"
-            >
-              <FaPlus className="w-4 h-4" />
-              <span className="hidden sm:inline">Yeni Pozisyon</span>
-              <span className="sm:hidden">Yeni</span>
-            </button>
-          </div>
-        </div>
-
-        {/* Stats Cards */}
-        <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
-          <div className="bg-white p-4 rounded-lg shadow-sm border">
-            <div className="flex items-center">
-              <FaBriefcase className="w-6 h-6 text-blue-600" />
-              <div className="ml-3">
-                <p className="text-xs font-medium text-gray-600">Toplam Pozisyon</p>
-                <p className="text-xl font-bold text-gray-900">{positions.length}</p>
-              </div>
-            </div>
-          </div>
-
-          <div className="bg-white p-4 rounded-lg shadow-sm border">
-            <div className="flex items-center">
-              <FaUsers className="w-6 h-6 text-green-600" />
-              <div className="ml-3">
-                <p className="text-xs font-medium text-gray-600">Dolu Pozisyonlar</p>
-                <p className="text-xl font-bold text-gray-900">
-                  {positions.filter((p) => p.employees && p.employees.length > 0).length}
-                </p>
-              </div>
-            </div>
-          </div>
-
-          <div className="bg-white p-4 rounded-lg shadow-sm border">
-            <div className="flex items-center">
-              <FaBriefcase className="w-6 h-6 text-orange-600" />
-              <div className="ml-3">
-                <p className="text-xs font-medium text-gray-600">Boş Pozisyonlar</p>
-                <p className="text-xl font-bold text-gray-900">
-                  {positions.filter((p) => !p.employees || p.employees.length === 0).length}
-                </p>
-              </div>
-            </div>
-          </div>
-
-          <div className="bg-white p-4 rounded-lg shadow-sm border">
-            <div className="flex items-center">
-              <FaBuilding className="w-6 h-6 text-purple-600" />
-              <div className="ml-3">
-                <p className="text-xs font-medium text-gray-600">Departman Sayısı</p>
-                <p className="text-xl font-bold text-gray-900">{departments.length}</p>
-              </div>
-            </div>
-          </div>
-        </div>
-
-        {/* Filters */}
-        <div className="flex flex-col sm:flex-row gap-3 items-stretch sm:items-center">
-          <div className="flex-1">
-            <input
-              type="text"
-              placeholder="Pozisyon adı veya kodu ara..."
-              value={searchTerm}
-              onChange={(e) => setSearchTerm(e.target.value)}
-              className="w-full px-3 py-1.5 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-            />
-          </div>
-
-          <div className="flex flex-col sm:flex-row gap-3">
-            <select
-              value={selectedLevel}
-              onChange={(e) => setSelectedLevel(e.target.value)}
-              className="px-3 py-1.5 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 min-w-0 sm:min-w-[160px]"
-            >
-              <option value="all">Tüm Seviyeler</option>
-              {Object.values(JobLevelEnum).map((level) => (
-                <option key={level} value={level}>
-                  {getJobLevelText(level)}
-                </option>
-              ))}
-            </select>
-
-            <select
-              value={selectedDepartment}
-              onChange={(e) => setSelectedDepartment(e.target.value)}
-              className="px-3 py-1.5 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 min-w-0 sm:min-w-[160px]"
-            >
-              <option value="all">Tüm Departmanlar</option>
-              {departments.map((dept) => (
-                <option key={dept?.id} value={dept?.id}>
-                  {dept?.name}
-                </option>
-              ))}
-            </select>
-          </div>
-        </div>
-
-        {/* Content - List or Card View */}
-        {viewMode === 'list' ? (
-          <div className="bg-white rounded-lg shadow-sm border overflow-hidden">
-            <div className="overflow-x-auto">
-              <DataTable data={filteredPositions} columns={columns} />
-            </div>
-          </div>
-        ) : (
-          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4">
-            {filteredPositions.map((position) => (
-              <PositionCard key={position.id} position={position} />
-            ))}
-          </div>
-        )}
-
-        {/* Empty State */}
-        {filteredPositions.length === 0 && (
-          <div className="text-center py-12">
-            <FaBriefcase className="w-10 h-10 text-gray-400 mx-auto mb-3" />
-            <h3 className="text-base font-medium text-gray-900 mb-2">Pozisyon bulunamadı</h3>
-            <p className="text-sm text-gray-500">Arama kriterlerinizi değiştirmeyi deneyin.</p>
-          </div>
-        )}
-      </div>
-
-      {/* Modals */}
-      <JobPositionFormModal
-        isOpen={isFormModalOpen}
-        onClose={closeFormModal}
-        onSave={handleSavePosition}
-        position={selectedPosition}
-        title={modalTitle}
-      />
-
-      <JobPositionViewModal
-        isOpen={isViewModalOpen}
-        onClose={closeViewModal}
-        position={selectedPosition}
-      />
-    </Container>
-  )
-}
-
-export default JobPositions
diff --git a/ui/src/views/project/components/ProjectForm.tsx b/ui/src/views/project/components/ProjectForm.tsx
index 6876586f..17511f02 100644
--- a/ui/src/views/project/components/ProjectForm.tsx
+++ b/ui/src/views/project/components/ProjectForm.tsx
@@ -24,7 +24,6 @@ import {
   FaDownload,
 } from 'react-icons/fa'
 import LoadingSpinner from '../../../components/common/LoadingSpinner'
-import { EmployeeDto } from '../../../types/hr'
 import { mockEmployees } from '../../../mocks/mockEmployees'
 import { mockBusinessParties } from '../../../mocks/mockBusinessParties'
 import {
@@ -67,6 +66,7 @@ import {
 import { Container } from '@/components/shared'
 import { ROUTES_ENUM } from '@/routes/route.constant'
 import { mockCurrencies } from '@/mocks/mockCurrencies'
+import { EmployeeDto } from '@/proxy/intranet/models'
 
 // Custom styles for the slider
 const sliderStyles = `