編集中はアンケートの表示上の締め切りを常に表示する

rucQは内部でアンケートをとる機能があり、表示上の締切日を設けることができます。この締切日の表示方法に関するIssueです

再現方法

1. pnpm i, pnpm dev:msw を順に実行
2. ブラウザで http://localhost:5173/ を開いて安定化を待つ
3. 「2125年 夏合宿」のボタンでパネルを開いて下部の「合宿を表示する」ボタンを押す
4. サイドバーから「ユーザー情報」ボタンを押してユーザー情報のページに遷移する
5. 合宿に参加する
6. 下部の回答編集ボタンが有効になったことを確かめて、「スキー」のボタンを押す

6の結果、そのボタンはバツボタンに変化するはずです。これは「すでにあなたの回答が登録されている」想定で「変更を取り消す」ためのボタンです

一方、src/mocks/handlers/questions.ts の表示用仮データを以下のようにごっそり消してみます

http.get('/api/me/question-groups/{questionGroupId}/answers', ({ params }) => {
  // ここから
  if (params.questionGroupId === '1') {
    return HttpResponse.json([ ... ]) // 複数行にわたる長い配列
  }
  // ここまで削除
  ...
})

このうえで2から同じことをすると、今度はカレンダーと時計っぽいマークがついて、回答締切日が表示されます

取り組んでほしいこと

アンケートの表示上の締め切り情報は回答後も回答を変更したくなった時に気になる情報のはずです。一方、1つ1つの質問グループは小規模なので「変更をなかったことにしたい」というニーズが生じるのは稀であると思われます。おそらく下部の「保存」ボタンだけで十分でしょう。

従って「変更中」の質問グループにおけるバツボタンの表示を廃止し、「未回答」の質問グループにおける表示と同じ表示にするとよさそうです。

補足

• 当該コンポーネントは src/components/information/QuestionGroupEditor.vue です
• props がもし不要になったらコンポーネント呼び出し元の記述の変更までお願いしたいです