Google Spreadsheetでマルチコメント可能な課題管理表を作る話

W.D.

2023年7月27日 00:08

経緯

<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">GAS詳しい人いらっしゃいますかー？（Googleスプレッド）<br>1行＝1案件で整理していくようなスプレッドで<br>1案件中に複数の担当者のコメント履歴を入れていきたいという要望がありました。</p>— デジ猫@IT エンジニャ〜子🐱✨ (@nya_602) <a href="https://twitter.com/nya_602/status/1681108136575516672?ref_src=twsrc%5Etfw">July 18, 2023</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">初めまして。<br>まず、ここまで記載されている要件ですと、新規コメントを履歴セルに転記する、という動作は、ワークシート関数であるTEXTJOIN関数で実現する方がパフォーマンス的にも良いです。…</p>— W.D. (@WD4096) <a href="https://twitter.com/WD4096/status/1681314537696559104?ref_src=twsrc%5Etfw">July 18, 2023</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

結果

反応が無かったので、とりあえずコードを書きました。
このnoteを上げた後、該当ツイートは削除して、権限も搾ろうと思います。
まあ、初めましてーって言ってくるメンツは無視するのが安全ではありますけど、排他的な開発者って死ぬまで何するんだろうなあ、とかは思います。
ちなみに、今日会社で打診された案件で丸ごと使えそうなので結果オーライだとは思っています。

<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">レスも良いねも無かったので不要かと思いましたが、とりあえず作ってみました。<br>対応の選択肢の１つとしてどうぞ。<br>GoogleSpreadsheet上では1案件1行で、コメントが右へ伸びていきます。（年月日、担当者名、コメント）… <a href="https://t.co/k5l6buFTmK">pic.twitter.com/k5l6buFTmK</a></p>— W.D. (@WD4096) <a href="https://twitter.com/WD4096/status/1683085850190684160?ref_src=twsrc%5Etfw">July 23, 2023</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

画面

１つめ。WebAPIで作成したコメント入力フォームです。案件を選択し、それに対するコメントを入力します。
課題管理表として使う場合、ここで選択するべき内容は課題ですね。
なお、後述するコード内を読むと分かりますが、セレクトタグで選択を行うと、非同期処理経由でコメント内容が更新されます。
2つ目の画像は、Google Spreadsheetの画像です。
このシートは原則的にエンドユーザーに見せない前提で使います。
バックデータとしての利用前提ですね。
なので、現状UIとしてコメント入力のみサポートしていますが、最終的には案件登録もWebAPIで実行するよう変更していく予定です。

詳細（コードなど）

コード含めた詳細を以下に記載します。
私個人が職場で参照する目的でコードを掲載しますので、必要な方は参照ください。

レスも良いねも無かったので不要かと思いましたが、とりあえず作ってみました。対応の選択肢の１つとしてどうぞ。 GoogleSpreadsheet上では1案件1行で、コメントが右へ伸びていきます。（年月日、担当者名、コメント）かつ、4行目でTEXTJOINを使って連結していて、コメント追加されると即時連結されます。コメントの入力はWebAPIからに限定しており、担当者名は利用者のメールアドレスを使って「ユーザー一覧」から氏名を取得、非同期処理でGoogleSpreadsheetに書き込んでいます。 WebAPIには案件追加機能を付けていませんが、運用次第では直接GoogleSpreadsheetに書き込んでOKなので、実装は見送りました。なお、見た目も全く整形していません。以下サンプルURLです。リンクを知っているすべてのアカウントが編集できるよう権限を与えていますので、個人利用してもOKなGMailアカウントでお試し頂ければ良いかと思います。 ▼GoogleSpreadsheetのURL https://docs.google.com/spreadsheets/d/1QtCJ9Yam7BE8v7AYP2xXgZ5xlteUoYa_-cmMOLNToKw/edit#gid=0 ▼WebAPIのURL https://script.google.com/macros/s/AKfycby75zyF5wIbb2OJGHEwmH7TRkavmXj-x-RX5KFaIWC3XKpXDDiQP5sQ9uospgk6XShX/exec 以下ソースコードです。 ▼index.html <!DOCTYPE html> <html> <head> <base target="_top"> <script> /** * コメントの追加処理 */ function append_comment() { // 選択している案件No取得 let issueNum = parseInt(document.getElementById("issueNum").value); // 新規コメント取得 let newCommnent = document.getElementById("newComment").value; // コメントを書き込み http://google.script.run.withSuccessHandler(function(){ // 結果を反映 change_selection(); // テキストエリアを削除 document.getElementById("newComment").value = ""; }).setComment(issueNum, newCommnent); } /** * 選択している案件が変更された時の処理 */ function change_selection() { // 案件No取得 let objIssueNum = document.getElementById("issueNum"); let issueNum = parseInt(objIssueNum.value); http://google.script.run.withSuccessHandler(dispResult).getComment(issueNum); } /** * 旧コメントの内容を表示する */ function dispResult(result) { document.getElementById("oldComment").innerHTML = result; } </script> </head> <body> <h1>コメント入力フォーム</h1> <table> <tr> <th>案件</th> <td><?!= issues ?></td> </tr> <tr> <th rowspan>コメント</th> <td><div id="oldComment"><?!= oldComment ?></div><br> <textarea id="newComment" value="" rows="4" cols="20"></textarea><br> <input type="button" value="送信" onclick="append_comment()"></td> </tr> </table> </body> </html> ▼コード.gs /** * doGet * 初期表示 *

ここから先は

4,075字

¥ 1,000

ログイン

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