web備忘録_自分用

gas連携

<!DOCTYPE html>
<html>
  <head>
    <base target="_top" />
    <style>
      .body_kakomi {
        display: flex;
        flex-direction: column;
        width: 500px;
      }
    </style>
  </head>
  <body class="body_kakomi">
    <label>差出人:</label>
    <input type="text" id="from" />

    <label>宛先:</label>
    <select id="namesDropdown" onchange="displayEmail()"></select>
    <label id="emailLabel"></label>
    <!-- ... 既存のコード ... -->

    
    <label>件名:</label>
    <input type="text" id="subject" />

    <label>CC:</label>
    <input type="text" id="cc" />

    <label>BCC:</label>
    <input type="text" id="bcc" />

    <label>本文:</label>
    <textarea id="body"></textarea>

    <label>署名:</label>
    <textarea id="signature"></textarea>

    <button onclick="saveAsDraft()">下書きとして保存</button>

    <script>
      // ... 既存のコード ...

      function saveAsDraft() {
        var subject = document.getElementById("subject").value;
        var to = document.getElementById("namesDropdown").value;
        var cc = document.getElementById("cc").value;
        var bcc = document.getElementById("bcc").value;
        var body = document.getElementById("body").value;
        var signature = document.getElementById("signature").value;
        var from = document.getElementById("from").value;

        google.script.run.saveDraftWithFrom(
          subject,
          to,
          cc,
          bcc,
          body,
          signature,
          from
        );
        alert("下書きとして保存しました!");
      }

      function populateDropdown(data) {
        var dropdown = document.getElementById("namesDropdown");
        data.forEach(function (row) {
          var option = document.createElement("option");
          option.value = row[1]; // Email
          option.text = row[0]; // Name
          dropdown.appendChild(option);
        });
      }

      function displayEmail() {
        var dropdown = document.getElementById("namesDropdown");
        var email = dropdown.value;
        document.getElementById("emailLabel").innerText = email;
      }

      window.onload = function () {
        google.script.run
          .withSuccessHandler(populateDropdown)
          .getNamesAndEmails();
      };
    </script>
  </body>
</html>
function doGet() {
  return HtmlService.createHtmlOutputFromFile('email.html');
}

function getNamesAndEmails() {
  var sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  var data = sheet.getRange("A1:B5").getValues();
  return data;
}

function saveDraftWithFrom(subject, to, cc, bcc, body, signature, from) {
  GmailApp.createDraft(to, subject, body + '\n\n' + signature, {cc: cc, bcc: bcc, from: from});
}

checkbox onchange

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>Checkbox onchange Example</title>
</head>
<body>

<!-- チェックボックスのHTML -->
<input type="checkbox" id="myCheckbox" onchange="checkboxChanged()">

<script>
// JavaScript関数
function checkboxChanged() {
  // チェックボックスの要素を取得
  var checkbox = document.getElementById("myCheckbox");

  // チェック状態に応じて異なるアクションを実行
  if (checkbox.checked) {
    console.log("チェックボックスがチェックされました。");
  } else {
    console.log("チェックボックスのチェックが外れました。");
  }
}
</script>

</body>
</html>

checkbox onchange greyout

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>Input Disable Example</title>
</head>
<body>

<!-- チェックボックスのHTML -->
<input type="checkbox" id="toggleInput" onchange="toggleInputState(this)">

<!-- 無効化/有効化するテキスト入力 -->
<input type="text" id="myInput" placeholder="何か入力してください">

<!-- 無効化/有効化するテキストエリア -->
<textarea id="myTextarea" placeholder="ここにテキストを入力"></textarea>

<script>
// JavaScript関数で入力要素の状態をトグル
function toggleInputState(checkbox) {
  // input要素とtextarea要素を取得
  var input = document.getElementById("myInput");
  var textarea = document.getElementById("myTextarea");

  // チェックボックスの状態に基づいてdisabled属性を設定
  input.disabled = checkbox.checked;
  textarea.disabled = checkbox.checked;
}
</script>

</body>
</html>

checkbox onchange 初期値greyout

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>Initial Disabled Input Example</title>
</head>
<body>

<!-- チェックボックスのHTML、初期状態をチェックされた状態にする -->
<input type="checkbox" id="toggleInput" onchange="toggleInputState()" checked>

<!-- 初期状態でdisabledにするテキスト入力 -->
<input type="text" id="myInput" placeholder="何か入力してください" disabled>

<!-- 初期状態でdisabledにするテキストエリア -->
<textarea id="myTextarea" placeholder="ここにテキストを入力" disabled></textarea>

<script>
// JavaScript関数で入力要素の状態をトグル
function toggleInputState() {
  // チェックボックスの要素を取得
  var checkbox = document.getElementById("toggleInput");

  // input要素とtextarea要素を取得
  var input = document.getElementById("myInput");
  var textarea = document.getElementById("myTextarea");

  // チェックボックスの状態に基づいてdisabled属性を設定
  input.disabled = checkbox.checked;
  textarea.disabled = checkbox.checked;
}

// ページ読み込み時に状態を設定
window.onload = toggleInputState;
</script>

</body>
</html>

比較

let dateTime1 = new Date("2023-01-01T09:00:00");
let dateTime2 = new Date("2023-01-01T09:00:00");

if (dateTime1.getTime() === dateTime2.getTime()) {
  console.log("dateTime1 and dateTime2 represent the same moment in time.");
} else {
  console.log("dateTime1 and dateTime2 represent different moments in time.");
}

時間

function fillGapsWithIdle() {
  const sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  const range = sheet.getDataRange();
  const values = range.getValues();

  // 作業時間と休み時間の設定
  const workStart = 9;  // 9:00
  const workEnd = 17;   // 17:00
  const lunchStart = 12; // 12:00
  const lunchEnd = 13;   // 13:00

  // 空いている時間帯を見つける関数
  function findGaps(tasks) {
    let gaps = [];
    let currentStart = workStart;

    // 作業リストを時間順にソート
    tasks.sort((a, b) => a[1] - b[1]);

    tasks.forEach(task => {
      const [taskStart, taskEnd] = task; // 開始時間と終了時間を取得

      // 休憩時間を考慮
      if (taskStart >= lunchStart && taskStart < lunchEnd) return;

      // 空いている時間があれば「待機」タスクを追加
      if (currentStart < taskStart) {
        if (currentStart < lunchStart && taskStart > lunchEnd) {
          gaps.push([currentStart, lunchStart, '待機']);
          gaps.push([lunchEnd, taskStart, '待機']);
        } else {
          gaps.push([currentStart, taskStart, '待機']);
        }
      }
      currentStart = taskEnd > lunchStart && taskEnd < lunchEnd ? lunchEnd : taskEnd;
    });

    // 勤務終了時間後の「待機」タスクを追加
    if (currentStart < workEnd) {
      gaps.push([currentStart, workEnd, '待機']);
    }

    return gaps;
  }

  // シートから取得したデータから作業リストを抽出(ここでは1列目を日付、2列目を開始時間、3列目を終了時間としています)
  const tasks = values.map(row => [row[1], row[2], row[3]]);

  // 空いている時間帯を探す
  const gaps = findGaps(tasks);

  // 作業リストと空いている時間帯のリストを結合してソート
  const fullSchedule = tasks.concat(gaps).sort((a, b) => a[1] - b[1]);

  // TODO: fullScheduleを使ってスプレッドシートを更新する処理を書く
}

この記事が気に入ったらサポートをしてみませんか?