トーナメント画面作成

[ryhara]

トーナメント画面作成

[ryhara]

今日より着手

[ryhara]

2024/05/04

jestの実行方法，ローカルのみ(ymlに書いてしまうとその他に影響ありそうなのでDockerfile単体で機能)

front-build:
    docker build -t frontend-test -f ./src/frontend/Dockerfile ./src/frontend

front-run:
    docker run -it --rm -p 3000:3000 -v ./src/frontend/:/app  --name frontend-test frontend-test bash

front-build→front-run→(dockerのbashが起動)→npm test

---

完了

• トーナメントの作成
• 試合の作成
• 参加者の作成・第1回戦への割当まで完了
• modal表示

次回以降　トーナメントの描画

• modalへのデータの渡し方考える
• トーナメントの描画方法考える

[yuidvg]

2024/05/05週

• [x] 一旦適当なボタンからテストデータが飛ぶ様に

[ryhara]

以下の画面でフォームに情報を入力して，下のボタンを押してください。

ボタン押す→storeTournamentResult.py内のsave_testに対してPOST→save_testからレスポンス→レスポンスをtestData.js内でconsole.logで出力

CSRFは余り分かっていないのでとりあえず無視の実装してます。urls.pyも追加してます。

testData.js

// testデータをpushする用の関数
function testDataPush() {
  const data = getFormData();
  appState.setState(data);
    const info = makeTournament();
    appState.setState({
        tournament: info.tournament,
        matches: info.matches,
        participants: info.participants,
    });
  const state = appState.getState();
  console.log(state);
  // テストデータをdjangoに送信し，djangoからの返り値をコンソールに表示する
  // djangoのurlをここで指定する
  fetch("/game/save_test/", {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
    },
    body: JSON.stringify(state),
  })
    .then((response) => response.json())
    .then((responseData) => {
      console.log("Success! From Django:", responseData);
    })
    .catch((error) => {
      console.error("Error:", error);
    });
}

storeTournamentResult.py

@csrf_exempt # TODO: 本番環境では無効化しないほうがいいかも
@require_http_methods(["POST"])
def save_test(request):
    data = json.loads(request.body)

    # TODO : データの処理を行う
    print("Received data:", data)

    # TODO : 必要があればレスポンスを作成する，現在はデータが受け取れたことを確認するためにそのままデータを返している
    response_data = {
        'status': 'success',
        'message': 'Data received successfully',
        'data': data,
    }

    # JSONレスポンスを返す
    return JsonResponse(response_data)

[ryhara]

対応してないこと

• scoreの構造を保持していない
• 次のゲーム画面への受け渡し，繋ぎ込みを考慮していない（グローバル的に持っているので渡すことは可能）
• 全試合が終了時の動作を定義していない
• 次の画面へは進まない
• トーナメントのフロントの描画をしていない