init

src/.gitignore

@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

src/0,1歳用日誌/main.js

@@ -0,0 +1,27 @@
+(function () {
+  "use strict";
+  const APP_ENV = env["0,1歳日誌出力用"];
+
+  kintone.events.on("app.record.index.show", (event) => {
+    const headerSpace = getHeaderSpace('single-label-line');
+
+    const elements = createBtnGroupArea('extract-action-area', '日誌作成', handleButtonClick, {
+      btnElId: 'extract-btn',
+      yearElId: 'extract-year',
+      monthElId: 'extract-month',
+      classElId: 'extract-classroom',
+    })
+
+    if (!elements) {
+      return;
+    }
+
+    headerSpace.appendChild(elements['extract-action-area']);
+  });
+
+  function handleButtonClick(e, { year, month, className }) {
+    const fileName = getExcelName(APP_ENV, year + month + '_' + className + '組');
+    console.log(fileName);
+  }
+
+})();

src/2歳以上日誌/main.js

@@ -0,0 +1,27 @@
+(function () {
+  "use strict";
+  const APP_ENV = env["2歳以上日誌出力用"];
+
+  kintone.events.on("app.record.index.show", (event) => {
+    const headerSpace = getHeaderSpace('single-label-line');
+
+    const elements = createBtnGroupArea('extract-action-area', '日誌作成', handleButtonClick, {
+      btnElId: 'extract-btn',
+      yearElId: 'extract-year',
+      monthElId: 'extract-month',
+      dateElId: 'extract-date',
+      defaultThisMonth: true,
+    })
+
+    if (!elements) {
+      return;
+    }
+
+    headerSpace.appendChild(elements['extract-action-area']);
+  });
+
+  function handleButtonClick(e, { year, month, date }) {
+    const fileName = getExcelName(APP_ENV, year + month + date);
+    console.log(fileName);
+  }
+})();

src/env.js

@@ -0,0 +1,27 @@
+"use strict";
+
+const env = {
+  "園児別出欠簿入力": {
+    appId: 19,
+    excelName: "出欠集計表",
+    view: {
+      '0,1歳日誌データ連携用途': 13352636,
+      '2歳以上日誌データ連携用途': 13352638,
+    }
+  },
+  "0,1歳日誌出力用": {
+    appId: 47,
+    excelName: "ゆり・つき1視診表",
+  },
+  "2歳以上日誌出力用": {
+    appId: 48,
+    excelName: "幼児日誌",
+  },
+  "個別配慮": {
+    appId: 23,
+    excelName: "個別配慮",
+  },
+  "園児台帳": {
+    appId: 16,
+  },
+};

src/lib/FileSaver.min.js

@@ -0,0 +1,3 @@
+(function(a,b){if("function"==typeof define&&define.amd)define([],b);else if("undefined"!=typeof exports)b();else{b(),a.FileSaver={exports:{}}.exports}})(this,function(){"use strict";function b(a,b){return"undefined"==typeof b?b={autoBom:!1}:"object"!=typeof b&&(console.warn("Deprecated: Expected third argument to be a object"),b={autoBom:!b}),b.autoBom&&/^\s*(?:text\/\S*|application\/xml|\S*\/\S*\+xml)\s*;.*charset\s*=\s*utf-8/i.test(a.type)?new Blob(["\uFEFF",a],{type:a.type}):a}function c(a,b,c){var d=new XMLHttpRequest;d.open("GET",a),d.responseType="blob",d.onload=function(){g(d.response,b,c)},d.onerror=function(){console.error("could not download file")},d.send()}function d(a){var b=new XMLHttpRequest;b.open("HEAD",a,!1);try{b.send()}catch(a){}return 200<=b.status&&299>=b.status}function e(a){try{a.dispatchEvent(new MouseEvent("click"))}catch(c){var b=document.createEvent("MouseEvents");b.initMouseEvent("click",!0,!0,window,0,0,0,80,20,!1,!1,!1,!1,0,null),a.dispatchEvent(b)}}var f="object"==typeof window&&window.window===window?window:"object"==typeof self&&self.self===self?self:"object"==typeof global&&global.global===global?global:void 0,a=/Macintosh/.test(navigator.userAgent)&&/AppleWebKit/.test(navigator.userAgent)&&!/Safari/.test(navigator.userAgent),g=f.saveAs||("object"!=typeof window||window!==f?function(){}:"download"in HTMLAnchorElement.prototype&&!a?function(b,g,h){var i=f.URL||f.webkitURL,j=document.createElement("a");g=g||b.name||"download",j.download=g,j.rel="noopener","string"==typeof b?(j.href=b,j.origin===location.origin?e(j):d(j.href)?c(b,g,h):e(j,j.target="_blank")):(j.href=i.createObjectURL(b),setTimeout(function(){i.revokeObjectURL(j.href)},4E4),setTimeout(function(){e(j)},0))}:"msSaveOrOpenBlob"in navigator?function(f,g,h){if(g=g||f.name||"download","string"!=typeof f)navigator.msSaveOrOpenBlob(b(f,h),g);else if(d(f))c(f,g,h);else{var i=document.createElement("a");i.href=f,i.target="_blank",setTimeout(function(){e(i)})}}:function(b,d,e,g){if(g=g||open("","_blank"),g&&(g.document.title=g.document.body.innerText="downloading..."),"string"==typeof b)return c(b,d,e);var h="application/octet-stream"===b.type,i=/constructor/i.test(f.HTMLElement)||f.safari,j=/CriOS\/[\d]+/.test(navigator.userAgent);if((j||h&&i||a)&&"undefined"!=typeof FileReader){var k=new FileReader;k.onloadend=function(){var a=k.result;a=j?a:a.replace(/^data:[^;]*;/,"data:attachment/file;"),g?g.location.href=a:location=a,g=null},k.readAsDataURL(b)}else{var l=f.URL||f.webkitURL,m=l.createObjectURL(b);g?g.location=m:location.href=m,g=null,setTimeout(function(){l.revokeObjectURL(m)},4E4)}});f.saveAs=g.saveAs=g,"undefined"!=typeof module&&(module.exports=g)});
+
+//# sourceMappingURL=FileSaver.min.js.map

src/main.css

@@ -0,0 +1,78 @@
+.btn-group-area {
+  display: flex;
+  margin-left: 2.5em;
+  align-items: flex-end;
+}
+.btn-group-area .label {
+  margin: 0 4px;
+}
+
+.btn-group-area .input {
+  padding-left: 8px;
+}
+
+.btn-group-area .year {
+  --kuc-text-input-width: calc(4em + 16px);
+  --kuc-text-input-height: 48px;
+}
+.btn-group-area .year input {
+  text-align: center;
+}
+
+.btn-group-area .month,
+.btn-group-area .date,
+.btn-group-area .classroom {
+  --kuc-combobox-toggle-width: calc(2em + 16px);
+  --kuc-combobox-toggle-height: 48px;
+}
+
+.btn-group-area .classroom {
+  --kuc-combobox-toggle-width: calc(3em + 16px);
+}
+
+.btn-group-area .month input[class^='kuc-combobox'],
+.btn-group-area .date input[class^='kuc-combobox'],
+.btn-group-area .classroom input[class^='kuc-combobox'] {
+  text-align: center;
+  padding-right: 8px;
+}
+.btn-group-area .month input + div[class$="icon"],
+.btn-group-area .date input + div[class$="icon"],
+.btn-group-area .classroom input + div[class$="icon"] {
+  display: none;
+}
+
+.action-btn {
+  margin: 0 8px;
+}
+
+.customized-header-space-wrapper.single-label-line {
+  margin-top: 33px;
+}
+.customized-header-space.single-label-line > .btn-group-area {
+  margin-top: -33px;
+}
+.kintone-app-headermenu-space {
+  height: auto;
+  display: inline-flex;
+}
+
+#user-js-header-clocking-btn-area {
+  margin: 4px 0;
+}
+
+#user-js-header-clocking-btn-area > .action-btn {
+  --kuc-button-width: 6em
+}
+
+#user-js-header-clocking-btn-area > .action-btn:first-child {
+  margin-right: 1em;
+}
+
+#user-js-clock-in-btn-area > .action-btn,
+#user-js-clock-out-btn-area > .action-btn {
+  --kuc-button-width: 4em;
+  --kuc-button-height: 42px;
+  margin-top: 32px;
+  margin-left: -8px;
+}

src/utils.js

@@ -0,0 +1,194 @@
+const Kuc = Kucs['1.19.0'];
+
+const monthItems = Array.from({ length: 12 }, (_, i) => {
+  const month = "" + (i + 1);
+  return { label: month, value: month.padStart(2, '0') };
+});
+
+const dateItems = Array.from({ length: 31 }, (_, i) => {
+  const date = "" + (i + 1);
+  return { label: date, value: date.padStart(2, '0') };
+})
+dateItems.push({ label: '末日', value: 'end' });
+
+const classItems = [
+  { label: "にじ", value: "にじ" },
+  { label: "ほし", value: "ほし" },
+  { label: "つき", value: "つき" },
+  { label: "ゆり", value: "ゆり" },
+]
+
+const errorEl = new Kuc.Notification({
+  type: 'danger',
+});
+
+function getHeaderSpace(className, isDetailPage) {
+  const headerSpace = (isDetailPage ? kintone.app.record : kintone.app).getHeaderMenuSpaceElement();
+  if (!headerSpace) {
+    throw new Error('このページではヘッダー要素が利用できません。');
+  };
+
+  const _className = isDetailPage ? 'customized-record-header-space' : 'customized-header-space';
+
+  headerSpace.className += (' ' + _className + ' ' + className);
+  headerSpace.parentElement.className += (' ' + _className + '-wrapper ' + className);
+
+  return headerSpace;
+}
+
+function createBtnGroupArea(groupId, btnLabel, btnOnClick, { btnElId = false, yearElId = false, monthElId = false, dateElId = false, classElId = false, defaultThisMonth = false, }) {
+  const result = {};
+
+  if (document.getElementById(groupId)) {
+    return;
+  }
+
+  const btnGroupAreaEl = document.createElement('div');
+  btnGroupAreaEl.id = groupId;
+  btnGroupAreaEl.className = 'btn-group-area'
+  result[groupId] = btnGroupAreaEl;
+
+  if (yearElId) {
+    const yearEl = new Kuc.Text({
+      value: "" + new Date().getFullYear(),
+      id: yearElId,
+      label: '年',
+      className: 'year input'
+    });
+    result[yearElId] = yearEl;
+    btnGroupAreaEl.appendChild(yearEl);
+
+    // const label = document.createElement('div');
+    // label.classList = 'label'
+    // label.textContent = '年';
+    // btnGroupAreaEl.appendChild(label);
+  }
+
+  if (monthElId) {
+    const monthEl = new Kuc.Combobox({
+      value: defaultThisMonth ? monthItems[new Date().getMonth()].value : undefined,
+      id: monthElId,
+      className: 'month input',
+      label: '月',
+      items: monthItems,
+    });
+    result[monthElId] = monthEl;
+    btnGroupAreaEl.appendChild(monthEl);
+
+    // const label = document.createElement('div');
+    // label.classList = 'label'
+    // label.textContent = '月';
+    // btnGroupAreaEl.appendChild(label);
+  }
+
+  if (dateElId) {
+    const dateEl = new Kuc.Combobox({
+      value: dateItems[new Date().getDate() - 1].value,
+      id: dateElId,
+      items: dateItems,
+      label: '日',
+      className: "date input",
+    });
+    result[dateElId] = dateEl;
+    btnGroupAreaEl.appendChild(dateEl);
+
+    // const label = document.createElement('div');
+    // label.classList = 'label'
+    // label.textContent = '日';
+    // btnGroupAreaEl.appendChild(label);
+  }
+
+  if (classElId) {
+    // const label = document.createElement('div');
+    // label.classList = 'label'
+    // label.textContent = 'クラス';
+    // btnGroupAreaEl.appendChild(label);
+
+    const classEl = new Kuc.Combobox({
+      id: classElId,
+      items: classItems,
+      className: "classroom input",
+      label: 'クラス',
+    });
+    result[classElId] = classEl;
+    btnGroupAreaEl.appendChild(classEl);
+  }
+
+  const btnEl = new Kuc.Button({
+    text: btnLabel,
+    type: "submit",
+    className: "action-btn",
+    id: btnElId,
+  });
+  result[btnElId] = btnEl;
+  btnEl.addEventListener('click', (e) => {
+    errorEl.close();
+    const checkResult = checkInputData(result, { btnLabel, yearElId, monthElId, dateElId, classElId });
+    if (checkResult) {
+      btnOnClick(e, checkResult);
+    }
+  });
+  btnGroupAreaEl.appendChild(btnEl);
+
+  return result;
+}
+
+function checkInputData(map, { btnLabel, yearElId, monthElId, dateElId, classElId }) {
+  const year = yearElId && map[yearElId].value;
+  const month = monthElId && map[monthElId].value;
+  const date = dateElId && map[dateElId].value;
+  const className = classElId && map[classElId].value;
+
+  const errorMsgs = [];
+
+  if (yearElId) {
+    const yearRegex = /^\d+$/;
+    if (!yearRegex.test(year)) {
+      errorMsgs.push(' · 年は整数で入力してください。');
+    }
+  }
+  if (monthElId && !month) {
+    errorMsgs.push(' · 月を選択してください。');
+  }
+  if (dateElId && !date) {
+    errorMsgs.push(' · 日を選択してください。');
+  }
+  if (classElId && !className) {
+    errorMsgs.push(' · クラスを選択してください。');
+  }
+  if (errorMsgs.length > 0) {
+    errorEl.text = btnLabel + 'エラー\n' + errorMsgs.join('\n');
+    errorEl.open();
+    return;
+  }
+
+  return {
+    year,
+    month,
+    date,
+    className,
+  }
+}
+
+function createBtn(id, label, onClick) {
+  const btnEl = new Kuc.Button({
+    text: label,
+    type: "submit",
+    className: "action-btn",
+    id,
+  });
+  btnEl.addEventListener('click', onClick);
+  return btnEl;
+}
+
+function hideSpaceField(ids) {
+  ids.forEach(id => {
+    const area = kintone.app.record.getSpaceElement(id);
+    area.parentElement.style.minWidth = '0';
+    area.parentElement.style.display = 'none';
+  });
+}
+
+function getExcelName({ excelName }, nameSuffix = '', suffix = '.xlsx') {
+  return excelName + (nameSuffix ? (nameSuffix.startsWith('_') ? nameSuffix : ('_' + nameSuffix)) : '') + suffix;
+}

src/個別配慮/main.js

@@ -0,0 +1,25 @@
+(function () {
+  "use strict";
+  const APP_ENV = env["個別配慮"];
+
+  kintone.events.on("app.record.index.show", (event) => {
+    const headerSpace = getHeaderSpace('single-label-line');
+
+    const elements = createBtnGroupArea('extract-action-area', '帳票出力', handleButtonClick, {
+      btnElId: 'extract-btn',
+      yearElId: 'extract-year',
+      monthElId: 'extract-month',
+    })
+
+    if (!elements) {
+      return;
+    }
+
+    headerSpace.appendChild(elements['extract-action-area']);
+  });
+
+  function handleButtonClick(e, { year, month }) {
+    const fileName = getExcelName(APP_ENV, year + month);
+    console.log(fileName);
+  }
+})();

src/園児別出欠簿入力/main.js

@@ -0,0 +1,118 @@
+(function () {
+  "use strict";
+  const APP_ENV = env["園児別出欠簿入力"];
+
+  kintone.events.on("app.record.index.show", (event) => {
+    const headerSpace = getHeaderSpace('single-label-line');
+
+    if (event.viewId === APP_ENV.view["0,1歳日誌データ連携用途"]) {
+      const elements = createBtnGroupArea('link-1-action-area', '0,1歳日誌データ連携', handleLink1, {
+        btnElId: 'link-1-btn',
+        yearElId: 'link-1-year',
+        monthElId: 'link-1-month',
+      })
+      if (!elements) {
+        return;
+      }
+      headerSpace.appendChild(elements['link-1-action-area']);
+      return event;
+    }
+
+    if (event.viewId === APP_ENV.view["2歳以上日誌データ連携用途"]) {
+      const elements = createBtnGroupArea('link-2-action-area', '2歳以上日誌データ連携', handleLink2, {
+        btnElId: 'link-2-btn',
+        yearElId: 'link-2-year',
+        monthElId: 'link-2-month',
+        dateElId: 'link-2-date',
+        defaultThisMonth: true,
+      })
+      if (!elements) {
+        return;
+      }
+      headerSpace.appendChild(elements['link-2-action-area']);
+      return event;
+    }
+
+    const elements1 = createBtnGroupArea('batch-action-area', '出欠簿一括作成', handleCreateDate, {
+      btnElId: 'batch-btn',
+    })
+    const elements2 = createBtnGroupArea('extract-action-area', '出欠集計表出力', handleExtractData, {
+      btnElId: 'extract-btn',
+      yearElId: 'extract-year',
+      monthElId: 'extract-month',
+      classElId: 'extract-classroom'
+    })
+
+    if (!elements1 || !elements2) {
+      return;
+    }
+    headerSpace.appendChild(elements1['batch-action-area']);
+    headerSpace.appendChild(elements2['extract-action-area']);
+  });
+
+  function handleCreateDate(e) {
+  }
+  function handleExtractData(e, { year, month, className }) {
+    const fileName = getExcelName(APP_ENV, year + month + '_' + className + '組');
+    console.log(fileName);
+  }
+  function handleLink1(e, { year, month }) {
+  }
+  function handleLink2(e, { year, month, date }) {
+  }
+
+  // ------------------- 詳細画面表示時の処理 -------------------
+
+  kintone.events.on('app.record.detail.show', function (event) {
+    const area = kintone.app.record.getSpaceElement('header-clocking-btn-area');
+
+    const clockIn = createBtn('clock-in', '登園', dateToFieldInDetail('登園時刻'));
+    const clockOut = createBtn('clock-out', '帰園', dateToFieldInDetail('帰園時刻'));
+    area.appendChild(clockIn);
+    area.appendChild(clockOut);
+
+    hideSpaceField(['clock-in-btn-area', 'clock-out-btn-area']);
+  });
+
+  kintone.events.on('app.record.print.show', (event) => {
+    hideSpaceField(['clock-in-btn-area', 'clock-out-btn-area']);
+  });
+
+  function dateToFieldInDetail(fieldCode) {
+    return async function (e) {
+      await new KintoneRestAPIClient().record.updateRecord({
+        app: kintone.app.getId(),
+        id: kintone.app.record.getId(),
+        record: {
+          [fieldCode]: {
+            value: getCurrentTime()
+          }
+        }
+      });
+      location.reload();
+    }
+  }
+
+  // ------------------- 編集画面表示時の処理 -------------------
+  kintone.events.on(['app.record.create.show', 'app.record.edit.show'], function (event) {
+    const clockIn = createBtn('clock-in', '登園', dateToFieldInEdit('登園時刻'));
+    kintone.app.record.getSpaceElement('clock-in-btn-area').appendChild(clockIn);
+    const clockOut = createBtn('clock-out', '帰園', dateToFieldInEdit('帰園時刻'));
+    kintone.app.record.getSpaceElement('clock-out-btn-area').appendChild(clockOut);
+  });
+
+  function dateToFieldInEdit(fieldCode) {
+    return function (e) {
+      var record = kintone.app.record.get();
+      record['record'][fieldCode]['value'] = getCurrentTime();
+      kintone.app.record.set(record);
+    }
+  }
+
+  function getCurrentTime() {
+    const now = new Date();
+    const hours = String(now.getHours()).padStart(2, '0');
+    const minutes = String(now.getMinutes()).padStart(2, '0');
+    return `${hours}:${minutes}`;
+  }
+})();