如何将原版 JavaScript onchange select 输入事件代码重写为 OOP JavaScript？[关闭]

// init variables
const formSelect = document.querySelector('.form-select')
const fromInput = document.querySelector('.from-input')
const toInput = document.querySelector('.to-input')
const textFieldFrom = document.querySelector('.text-field-from')
const textFieldTo = document.querySelector('.text-field-to')

// init state
let fromInputValue = ''
let toInputValue = ''
let range = []

function setAllFieldsHidden() {
  toInput.style.display = 'none';
  textFieldFrom.style.display = 'none';
  textFieldTo.style.display = 'none';
  fromInput.style.display = 'none';
}

function setSingleDateFieldBlock() {
  toInput.style.display = 'none';
  textFieldFrom.style.display = 'none';
  textFieldTo.style.display = 'none';
  fromInput.style.display = 'block';
}

function setAllDateFieldsBlock() {
  textFieldFrom.style.display = 'none';
  textFieldTo.style.display = 'none';
  fromInput.style.display = 'block';
  toInput.style.display = 'block';
}

function setSingeTextFieldBlock() {
  fromInput.style.display = 'none';
  toInput.style.display = 'none';
  textFieldTo.style.display = 'none';
  textFieldFrom.style.display = 'block';
}

function setAllTextFieldsBlock() {
  fromInput.style.display = 'none';
  toInput.style.display = 'none';
  textFieldFrom.style.display = 'block';
  textFieldTo.style.display = 'block';
}

formSelect.addEventListener("change", function() {

  let selectedOption = formSelect.options[formSelect.selectedIndex].value;


  switch (formSelect.value) {
    case 'yesterday':
      setAllFieldsHidden();
      let currentDateY = new Date()
      let yesterdayD = new getDate(currentDateY)
      yesterdayD.setDate(yesterdayD.getDate() - 1)
      formSelect.value = yesterdayD

      break

    case 'today':
      setAllFieldsHidden();
      formSelect.value = new Date().getDate()
      break

    case 'tomorrow':
      setAllFieldsHidden();

      let currentDateT = new Date()
      let yesterday = new getDate(currentDateT)
      yesterday.setDate(yesterday.getDate() + 1)
      formSelect.value = yesterday
      break

    case 'recentWeek':
      setAllFieldsHidden();

      let todayR = new Date();
      let currentDayOfWeek = today.getDay();
      let diff = today.getDate() - currentDayOfWeek;
      let recentWeekDates = [];
      for (let i = 1; i < 8; i++) {
        let tempDate = new Date(todayR);
        tempDate.setDate(diff + i);
        recentWeekDates.push(tempDate);
      }
      formSelect.value = recentWeekDates
      break

    case 'previousWeek':
      setAllFieldsHidden();

      let todayP = new Date();
      let startOfPreviousWeek = new Date(todayP);
      startOfPreviousWeek.setDate(startOfPreviousWeek.getDate() - 7);
      let previousWeekDates = [];
      for (let i = 0; i < 7; i++) {
        let tempDate = new Date(startOfPreviousWeek);
        tempDate.setDate(startOfPreviousWeek.getDate() + i);
        previousWeekDates.push(tempDate);
      }
      formSelect.value = previousWeekDates
      break

    case 'recentMonth':
      setAllFieldsHidden();

      let todayM = new Date();
      todayM.setDate(1);
      let recentMonthDates = [];
      while (todayM.getMonth() === new Date().getMonth()) {
        recentMonthDates.push(new Date(todayM));
        todayM.setDate(todayM.getDate() + 1);
      }
      formSelect.value = recentWeekDates
      break

    case 'previousMonth':
      setAllFieldsHidden();

      let todayPm = new Date();
      let firstDayOfCurrentMonth = new Date(today.getFullYear(), todayPm.getMonth(), 1);
      let lastDayOfPreviousMonth = new Date(firstDayOfCurrentMonth);
      lastDayOfPreviousMonth.setDate(0);
      let previousMonthDates = [];
      for (let i = 1; i <= lastDayOfPreviousMonth.getDate(); i++) {
        let tempDate = new Date(lastDayOfPreviousMonth);
        tempDate.setDate(i);
        previousMonthDates.push(tempDate);
      }
      formSelect.value = previousMonthDates
      break

    case 'recentQuarter':
      setAllFieldsHidden();

      let todayRq = new Date();
      let currentYear = todayRq.getFullYear();
      let currentMonth = todayRq.getMonth();
      let currentQuarter = Math.floor(currentMonth / 3) + 1;
      let startDate = new Date(currentYear, (currentQuarter - 1) * 3, 1);
      let endDate = new Date(currentYear, currentQuarter * 3, 0);
      let actualQuarterDates = [];
      for (let date = new Date(startDate); date <= endDate; date.setDate(date.getDate() + 1)) {
        actualQuarterDates.push(new Date(date));
      }
      formSelect.value = recentWeekDates
      break

    case 'last7Days':
      setAllFieldsHidden();

      let todayLse = new Date();
      let lastSevenDaysDates = [];
      for (let i = 6; i >= 0; i--) {
        let tempDate = new Date(todayLse);
        tempDate.setDate(today.getDate() - i);
        lastSevenDaysDates.push(tempDate);
      }
      formSelect.value = lastSevenDaysDates
      break

    case 'last30Days':
      setAllFieldsHidden();

      let todayLt = new Date();
      let lastThirtyDaysDates = [];
      for (let i = 29; i >= 0; i--) {
        let tempDate = new Date(todayLt);
        tempDate.setDate(today.getDate() - i);
        lastThirtyDaysDates.push(tempDate);
      }
      formSelect.value = lastThirtyDaysDates
      break

    case 'last60Days':
      setAllFieldsHidden();

      let todayLs = new Date();
      let lastSixtyDaysDates = [];
      for (let i = 59; i >= 0; i--) {
        let tempDate = new Date(todayLs);
        tempDate.setDate(todayLs.getDate() - i);
        lastSixtyDaysDates.push(tempDate);
      }
      formSelect.value = lastDaysDates
      break

    case 'last90Days':
      setAllFieldsHidden();

      let todayLn = new Date();
      let lastNinetyDaysDates = [];
      for (let i = 89; i >= 0; i--) {
        let tempDate = new Date(todayLn);
        tempDate.setDate(today.getDate() - i);
        lastNinetyDaysDates.push(tempDate);
      }
      formSelect.value = lastNinetyDaysDates
      break

    case 'lastNumberOfDays':
      setSingeTextFieldBlock();

      textFieldFrom.addEventListener("change", event => {
        fromInputValue = event.target.value

        for (let i = 0; i < fromInputValue; i++) {
          let previousDate = new Date(currentDate);
          previousDate.setDate(currentDate.getDate() - i);
          range.push(previousDate);
        }
        range.reverse();
      })
      break

    case 'nextNumberOfDays':
      setSingeTextFieldBlock();

      textFieldFrom.addEventListener("change", event => {
        fromInputValue = event.target.value

        for (let i = 0; i < fromInputValue; i++) {
          let previousDate = new Date(currentDate);
          previousDate.setDate(currentDate.getDate() + i);
          range.push(previousDate);
        }
        range.reverse();
      })
      break

    case 'exactDate':
      setSingleDateFieldBlock()

      fromInput.addEventListener("change", event => {
        fromInputValue = event.target.value
      })
      break

    case 'range':
      setAllTextFieldsBlock()

      fromInput.addEventListener("change", event => {
        fromInputValue = event.target.value
      })
      toInput.addEventListener("change", event => {
        toInputValue = event.target.value
      })
      let currentDate = new Date(fromInputValue);
      while (currentDate <= toInputValue) {
        range.push(new Date(currentDate));
        currentDate.setDate(currentDate.getDate() + 1);
      }
      break

    default:
      console.log('else')
  }
});

<body>
  <div>
    <select class="form-select" id="example-select" name="example-select">
      <option selected="">Any date</option>
      <option value="yesterday">yesterday</option>
      <option value="today">today</option>
      <option value="tomorrow">tomorrow</option>
      <option value="recentWeek">recentWeek</option>
      <option value="recentMonth">recentMonth</option>
      <option value="recentQuarter">recentQuarter</option>
      <option value="last7Days">last7Days</option>
      <option value="last30Days">last30Days</option>
      <option value="last60Days">last60Days</option>
      <option value="last90Days">last90Days</option>
      <option value="lastNumberOfDays">lastNumberOfDays</option>
      <option value="nextNumberOfDays">nextNumberOfDays</option>
      <option value="exactDate">exactDate</option>
      <option value="range">range</option>
      <option value="previousWeek">previousWeek</option>
      <option value="previousMonth">previousMonth</option>
    </select>
    <input type="date" class="from-input" placeholder="Choose date" value="from">
    <input style="display: none;" type="text" class="text-field-from form-control" placeholder="Enter number">
    <input type="date" class="to-input form-control " placeholder="Till" value="to" />
    <input style="display: none;" type="text" class="text-field-to form-control" placeholder="Choose date">
  </div>