<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>高级日期计算器（含节假日）</title>
<style>
body {
  font-family: Arial, sans-serif;
  background-color: #f0f2f5;
  display: flex;
  justify-content: center;
  padding-top: 40px;
}
.container {
  background-color: #fff;
  padding: 25px 35px;
  border-radius: 8px;
  box-shadow: 0 5px 15px rgba(0,0,0,0.1);
  width: 380px;
}
h1 {
  text-align: center;
  color: #333;
}
label {
  display: block;
  margin: 12px 0 5px;
  font-weight: bold;
}
input[type="date"], input[type="number"], textarea {
  width: 100%;
  padding: 8px 10px;
  border-radius: 4px;
  border: 1px solid #ccc;
  font-size: 15px;
}
textarea {
  height: 60px;
}
button {
  margin-top: 15px;
  width: 100%;
  padding: 10px;
  font-size: 16px;
  background-color: #4CAF50;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}
button:hover { background-color: #45a049; }
.result {
  margin-top: 15px;
  font-size: 16px;
  color: #333;
}
.checkbox-container {
  margin-top: 10px;
}
hr {
  margin:20px 0;
}
</style>
</head>
<body>

<div class="container">
  <h1>高级日期计算器</h1>

  <!-- 目标日期计算 -->
  <label for="startDate">起始日期:</label>
  <input type="date" id="startDate">

  <label for="days">增加/减少天数:</label>
  <input type="number" id="days" placeholder="可输入正数或负数">

  <div class="checkbox-container">
    <input type="checkbox" id="excludeWeekends">
    <label for="excludeWeekends">排除周末</label>
  </div>

  <label for="holidays">节假日（YYYY-MM-DD，每行一个）:</label>
  <textarea id="holidays" placeholder="例如：2026-01-01"></textarea>

  <button onclick="calculateTargetDate()">计算目标日期</button>
  <div class="result" id="targetResult"></div>

  <hr>

  <!-- 日期差计算 -->
  <label for="date1">开始日期:</label>
  <input type="date" id="date1">

  <label for="date2">结束日期:</label>
  <input type="date" id="date2">

  <div class="checkbox-container">
    <input type="checkbox" id="excludeWeekendsDiff">
    <label for="excludeWeekendsDiff">排除周末</label>
  </div>

  <label for="holidaysDiff">节假日（YYYY-MM-DD，每行一个）:</label>
  <textarea id="holidaysDiff" placeholder="例如：2026-01-01"></textarea>

  <button onclick="calculateDateDiff()">计算日期差</button>
  <div class="result" id="diffResult"></div>
</div>

<script>
function parseHolidays(text) {
  return text.split('\n').map(s => s.trim()).filter(s => s).map(s => new Date(s).toDateString());
}

// 目标日期计算
function calculateTargetDate() {
  const startDateInput = document.getElementById('startDate').value;
  const daysInput = parseInt(document.getElementById('days').value);
  const excludeWeekends = document.getElementById('excludeWeekends').checked;
  const holidays = parseHolidays(document.getElementById('holidays').value);

  if (!startDateInput) { alert('请选择起始日期'); return; }
  if (isNaN(daysInput)) { alert('请输入有效天数'); return; }

  let currentDate = new Date(startDateInput);
  let daysRemaining = Math.abs(daysInput);
  const step = daysInput >= 0 ? 1 : -1;

  while (daysRemaining > 0) {
    currentDate.setDate(currentDate.getDate() + step);
    const dayStr = currentDate.toDateString();

    if (excludeWeekends) {
      const day = currentDate.getDay();
      if (day === 0 || day === 6) continue; // 跳过周末
    }
    if (holidays.includes(dayStr)) continue; // 跳过节假日

    daysRemaining--;
  }

  const yyyy = currentDate.getFullYear();
  const mm = String(currentDate.getMonth() + 1).padStart(2, '0');
  const dd = String(currentDate.getDate()).padStart(2, '0');

  document.getElementById('targetResult').innerText = `计算结果日期: ${yyyy}-${mm}-${dd}`;
}

// 日期差计算
function calculateDateDiff() {
  const date1Input = document.getElementById('date1').value;
  const date2Input = document.getElementById('date2').value;
  const excludeWeekends = document.getElementById('excludeWeekendsDiff').checked;
  const holidays = parseHolidays(document.getElementById('holidaysDiff').value);

  if (!date1Input || !date2Input) { alert('请选择两个日期'); return; }

  let d1 = new Date(date1Input);
  let d2 = new Date(date2Input);
  if (d1 > d2) [d1, d2] = [d2, d1];

  let diffDays = 0;
  let tempDate = new Date(d1);

  while (tempDate <= d2) {
    const day = tempDate.getDay();
    const dayStr = tempDate.toDateString();
    if ((!excludeWeekends || (day !== 0 && day !== 6)) && !holidays.includes(dayStr)) {
      diffDays++;
    }
    tempDate.setDate(tempDate.getDate() + 1);
  }

  document.getElementById('diffResult').innerText = `相差天数: ${diffDays} 天`;
}
</script>

</body>
</html>