search

sleep0001 / cleaner-schedule

1 stars 0 forks source link

当番を交換するUI #1

Closed sleep0001 closed 2 months ago

sleep0001 commented 4 months ago

内容

個人間での当番の交代を反映できるようにする。

対応

メインの画面にボタンを１つ配置。押下で交換する2つを選ぶことができるようにする。 jsonの内容をカレンダーに反映しているが、git上のjsonを書き換えた時に反映できるどうか未確認。

ボタン名

例（できればもっとかっこよく） 通常時：交換 選択時：決定

sleep0001 commented 4 months ago

実装方針

ブランチ：changeJSON

新規作成 change.js changejson.css

sleep0001 commented 3 months ago

日付セル押下で日付の取得（方法検討中） 当番交代のトグルボタンがオンの時は取得した日付を2つまで保持（取得方法の準備でき次第着手） 確定ボタンでデータベースの書き換え データベースの作成（未着手）

RyoUchiyamaGenius commented 3 months ago

@sleep0001 日付の取得、antdのCalendarにonSelectがあるのでそれでできそう（コードは綺麗にしてほしい） 2024-07-14 19 49の画像 (1) 2024-07-14 19 49の画像

sleep0001 commented 3 months ago

image

onSelectを使用 ２つの日付を保持するロジックを作成 （選択時にconsole出力すると値が格納できていない、次の選択時には格納されてるラグのような問題あり）

sleep0001 commented 3 months ago

（選択時にconsole出力すると値が格納できていない、次の選択時には格納されてるラグのような問題あり） useStateフックの動作によるものだった。 非同期の変数なので、更新前に出力、参照すると古い値が得られるそう。 高速で選択できるUIでなさそうなので一旦問題なしと判断。

sleep0001 commented 3 months ago

https://github.com/sleep0001/cleaner-schedule/commit/d59c34cf81caa903c3e138e16a41e79b4093f30a ヌルポ すみませんでした。

sleep0001 commented 3 months ago

課題

sleep0001 commented 3 months ago

選択して赤くなった日と同じ日が別の月でも赤くなっている

月を移動した時に、onselectが実行されている。（antdの仕様？）

sleep0001 commented 3 months ago

予定の無い月（～6月）に交換モードオンの状態で移動すると、エラー

nullを処理していたが、undefinedが処理できていなかった。

該当箇所

selectDate.date !== null これだと、selectDateがundefinedの時、trueを返してしまうので後続の処理で落ちてしまう。

解決方法

null === undifined // false null == undefined //true らしいので、 selectDate.date != null これで直った。

sleep0001 commented 3 months ago

選択して赤くなった日と同じ日が別の月でも赤くなっている

表示している月を保持する仕様にした。 onPanelChangeを作成し、currentMonthに表示月が保持される。

日付セルを生成する際、その日付とcurrentMonthが一致しない場合にonselectの以降の処理をスキップするようにしている。

sleep0001 commented 3 months ago

副産物として、月の前後に表示されている29,30,31や1,2,3などの日付を選択した際にselectDateに反映されることなく月を移動できるようになった。 らっきー

sleep0001 commented 3 months ago

@RyoUchiyamaGenius さん DBからのデータ取得とオンオフボタンの作成を結合したい。 現在のtestenvから新規ブランチを作成して、DATABASEからマージして動作を確認する。 ボタンとデータ取得が同じファイルなので競合が発生。次回競合を対処します。おやすみ。

sleep0001 commented 3 months ago

image image @RyoUchiyamaGenius さん 交換できました。 現状は、日付選択＞ボタン押下＞リロードで当番変更を確認できている。 ボタン押下、APIリクエスト後に画面を更新するようにする。

sleep0001 commented 3 months ago

土日は選択されないが、祝日等の値がある日は選択可能になっているため、交換できてしまうのが気になる。 安直に全員分の名前を含むか判定するのが無難か。。

追記(08/03/14:35)

土日選択されない

されるかも

安直に全員分の名前を含むか判定

テーブルに休日判定入れたの忘れてました。

現在の実装では、キー（日付）に対して変更後の担当者で更新するようになっている。 その時の休日判定は渡していない（休日以外にしか処理されないため）ので、更新後に休日判定が値無しになっているかもしれない（可能性だけ） 後ほど、昨日のテーブル更新の際に不具合がないか確認する。

sleep0001 commented 3 months ago

@RyoUchiyamaGenius さん testenv更新しました。 [INFO]: Module not found: Error: Can't resolve 'axios' in '/codebuild/output/src2719632889/src/cleaner-schedule/src' ローカルだと表示されるのに、ビルドエラー出てて泣いてます。

sleep0001 commented 3 months ago

@RyoUchiyamaGenius さん testenv更新しました。（ビルドエラーの為のバージョン更新も含め） 変数の変更も含んでいます。 https://testenv.d243jtp3u2p740.amplifyapp.com/

sleep0001 commented 3 months ago

@RyoUchiyamaGenius さん 2024-06-04と2024-06-05にテスト用の予定を作っています。 テストの際はそちらをお使いいただければと思います。

sleep0001 commented 3 months ago

トグルオンの状態で予定の無い日（～2024/6）を選択するとエラーになる。 event等の情報がundefindが原因だと思われる。 対処しておきます。

sleep0001 commented 2 months ago

交換するUIをテスト環境に反映したので当課題はクローズします。