修正

frontend/payroll-salary-settings.html

@@ -326,10 +326,9 @@
                         : "✗ 非対象"
                     }</td>
                     <td>${s.valid_from} ～ ${s.valid_to || "現在"}</td>
-                    <td>
-                      <button class="btn btn-primary" onclick="editSetting(${
-                        s.setting_id
-                      })" style="padding: 5px 10px; font-size: 12px;">編集</button>
+                    <td style="white-space:nowrap;">
+                      <button class="btn btn-primary" onclick="editSetting(${s.setting_id})" style="padding: 5px 10px; font-size: 12px;">編集</button>
+                      <button class="btn" onclick="deleteSetting(${s.setting_id}, '${s.employee_name}', '${s.valid_from}')" style="padding: 5px 10px; font-size: 12px; background:#dc3545; color:white; margin-left:4px;">削除</button>
                     </td>
                   </tr>
               `,
@@ -390,6 +389,37 @@
         }
       }
 
+      async function deleteSetting(settingId, employeeName, validFrom) {
+        if (
+          !confirm(
+            `「${employeeName}」の適用開始日 ${validFrom} の給与設定を削除しますか？\nこの操作は元に戻せません。`,
+          )
+        )
+          return;
+        try {
+          const response = await fetch(
+            `${API_BASE}/payroll/settings/salary/${settingId}`,
+            {
+              method: "DELETE",
+            },
+          );
+          if (response.ok || response.status === 204) {
+            alert("給与設定を削除しました");
+            loadAllSalarySettings();
+          } else {
+            let errMsg = `HTTP ${response.status}`;
+            try {
+              const errBody = await response.json();
+              if (errBody.detail) errMsg = String(errBody.detail);
+            } catch (_) {}
+            alert("削除に失敗しました: " + errMsg);
+          }
+        } catch (error) {
+          alert("削除に失敗しました: " + (error.message || error));
+          console.error(error);
+        }
+      }
+
       function showAddForm() {
         document.getElementById("formTitle").textContent = "給与設定の追加";
         document.getElementById("addForm").style.display = "block";
@@ -416,8 +446,18 @@
         const formData = new FormData(form);
         const settingId = document.getElementById("setting_id").value;
 
+        // disabled な employee_id は FormData に含まれないため DOM から直接取得
+        const employeeIdRaw =
+          formData.get("employee_id") ||
+          document.getElementById("employee_id").value;
+        const employeeId = parseInt(employeeIdRaw);
+
+        if (!settingId && (!employeeId || isNaN(employeeId))) {
+          alert("従業員を選択してください");
+          return;
+        }
+
         const data = {
-          employee_id: parseInt(formData.get("employee_id")),
           base_salary: parseFloat(formData.get("base_salary")) || 0,
           employment_type: formData.get("employment_type"),
           payment_type: formData.get("payment_type"),
@@ -429,6 +469,11 @@
           valid_from: formData.get("valid_from"),
         };
 
+        // 新規登録のみ employee_id を含める
+        if (!settingId) {
+          data.employee_id = employeeId;
+        }
+
         if (formData.get("hourly_rate")) {
           data.hourly_rate = parseFloat(formData.get("hourly_rate"));
         }
@@ -465,11 +510,24 @@
             hideAddForm();
             loadAllSalarySettings();
           } else {
-            const error = await response.json();
-            alert("保存に失敗しました: " + error.detail);
+            let errMsg = `HTTP ${response.status}`;
+            try {
+              const errBody = await response.json();
+              const detail = errBody.detail;
+              if (Array.isArray(detail)) {
+                errMsg = detail
+                  .map((e) => e.msg || JSON.stringify(e))
+                  .join(", ");
+              } else if (detail) {
+                errMsg = String(detail);
+              }
+            } catch (_) {
+              errMsg += ` ${await response.text().catch(() => "")}`;
+            }
+            alert("保存に失敗しました: " + errMsg);
           }
         } catch (error) {
-          alert("保存に失敗しました");
+          alert("保存に失敗しました: " + (error.message || error));
           console.error(error);
         }
       }