covid19
covid19 copied to clipboard
Tokyo-Metro-Gov
カードのサマリ部分の集計日等の日付がtime要素でマークアップされていない
起こっている問題 / The Problem
- カードのサマリ部分の集計日等の日付がtime要素でマークアップされていない
該当箇所一覧（日本語のみ）
- https://stopcovid19.metro.tokyo.lg.jp/cards/number-of-reports-to-tokyo-fever-consultation-center/
- https://stopcovid19.metro.tokyo.lg.jp/cards/monitoring-number-of-reports-to-covid19-consultation-desk/
- https://stopcovid19.metro.tokyo.lg.jp/cards/number-of-reports-to-covid19-telephone-advisory-center/
- https://stopcovid19.metro.tokyo.lg.jp/cards/positive-number-by-diagnosed-date/
- https://stopcovid19.metro.tokyo.lg.jp/cards/positive-number-by-developed-date/
- https://stopcovid19.metro.tokyo.lg.jp/cards/number-of-confirmed-cases-by-municipalities/
※ 各言語においても同様
スクリーンショット / Screenshot
期待する見せ方・挙動 / Expected Behavior
- time要素でマークアップする
起こっている問題の再現手段 / Steps to Reproduce
- デベロッパーツールでマークアップを確認する
動作環境・ブラウザ / Environment
- すべての環境
下部の注釈内の日付がtimeでマークアップされていない。 についても可能な範囲で対応したほうが良いと思われるが、文脈的に可能な範囲で検討ください。
- https://stopcovid19.metro.tokyo.lg.jp/cards/attributes-of-confirmed-cases/
- https://stopcovid19.metro.tokyo.lg.jp/cards/monitoring-number-of-reports-to-covid19-consultation-desk/
<time> でマークアップする際は，datetime 属性に（2021-01-01T00:00:00+0900のような書式で）日時を併記するとさらに良いと思われます。
cf. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/time#usage_notes
実際の表記箇所は以下のようにマークアップされている
<small class="DataView-DataSet-date">{{ sText }}</small>
components/index/CardsReference/PositiveNumberByDevelopedDate/Card.vue
props である sText は以下のように書かれているので
sText: `${formattedLastDay} ${this.$t('日別値')}（${this.$t(
'現在判明している人数であり、後日修正される場合がある'
)}）`,
formattedLastDay を <time> で分けられるように sText を渡したあとに分離するか
props で渡す時に formattedLastDay を別で渡すようにするかなどの対応が必要そう
@Meiryo7743 @yamanoku フォローおよびご提案ありがとうございます！
たしかに、formattedLastDay を components/index/_shared/DataViewDataSetPanel.vue のpropsにするのがよいかもしれません。
propsで渡す方法を考えていたのですが、多言語化のあたりでうまくいかないような気がしてきました。 例えば、この↓場合はうまくいきそうなのですが、
2021年7月19日 日別値
この↓場合は助詞を含むので、単純にtimeタグに渡すだけだと、翻訳時にうまくいきません（特に英語）。
2021年7月19日 の数値
類似してこの↓ようなパターンもあり、
2021年6月28日から2021年7月4日までの期間の数値
ちょっと一筋縄ではいかないようです。
無理矢理に v-html でhtmlをエスケープしない方法はありますが、やはりそれはあまりやりたくない気持ちもあり。
@magi1125 @masuP9 もしtimeマークアップを対応するなら、記述を変える（助詞を使わない表現にする）しかないかなと思うのですが、どう思われますか？
