category

複数スペースのタスクを1つのガントチャートにまとめてみる #craftcms

2020-02-17

先日、 Backlog の複数スペースのタスクを Craft CMS に一旦取り込んで、串刺ししてカンバンぽく見れるようなのを作ってみた。

2020-01-14

タスクが多すぎるとあまり意味なかったりするので、プロジェクト管理ツール（タスク管理ツール）はちゃんと綺麗にしないといけないなぁ、、、と思いつつ。。。。

ついでだからということでガントチャートも作ってみた。

キャプチャ撮ってみたら色的にみづらいな、という気がしたのでその辺はいじってみるとして。

ライブラリは他にもあるだろうけど、とりあえず見つかった Frappe っていうので試してみた。

Frappe: Frameworks + Apps
https://frappe.io/gantt

必要そうなライブラリとかを読み込ませてタスクのところはシンプルに

<script>
  var tasks = [
  {% for entry in ganttEntries %}
    {
      start: '{% if entry.issueDue %}{{entry.issueStart|date('Y-m-d')}}{% else %}{{ "now"|date('Y-m-d') }}{% endif %}',
      end: '{% if entry.issueDue %}{{entry.issueDue|date('Y-m-d')}}{% else %}{{ "now"|date('Y-m-d') }}{% endif %}',
      name: '{{entry.issueKey}}:{{entry.title}}',
      id: "{{entry.id}}",
      url: "{{entry.issueSiteURL}}{{entry.issueKey}}"
    }{% if not loop.last %},{%endif%}
  {% endfor %}
  ]
</script>

こんな感じでカンバン用に backlog から Craft CMS に Feed Me で取り込んだエントリをリストにする。

ガントチャートなので日付まわりの情報が入っていないことには意味ないので、 ganttEntries はこんな感じで、期日が空じゃないものを取り出す。

{% set ganttEntries = craft.entries.issueAssignee('mersy').issueDue(':notempty:').orderBy('issueDue asc').all() %}

一応、期日がセットされていないものもリストしてあったほうがいいかもな？とおもったので、ガントチャートの下には期日がないものリストを作っておいた。

見た目がダサいとか色々あるけど、とりあえず使ってみて調整していくかなー、という感じ。

一応現時点では3つのスペースくらいは串刺しで見れるようにはなった。

タスクがスムーズに処理できるか？はまた別の問題もある。

これをやってくと、カンバンの方で「今日やるタスク」とか「明日やるタスク」とかやりたくなるけど、とりあえずは今やるタスクというか、せめて working に board をうつす。
ガントチャートみてやばそうなのを処理していくとかしていくのがいいんだろうなぁと。

そういう意味ではガントチャートでのタスクの並び順とかも調整したほうが良さそう。

GraphQL使ってみたかっただけだったのからはじまったが。

とりあえず色々jsやらなにやらいじってみながらあーでもないこーでもないとやってみようかとは思う。