diff --git a/app/javascript/stylesheets/application/blocks/cards/_card-counts.sass b/app/javascript/stylesheets/application/blocks/cards/_card-counts.sass index b5a49f8afbb..2d8c573ffd0 100644 --- a/app/javascript/stylesheets/application/blocks/cards/_card-counts.sass +++ b/app/javascript/stylesheets/application/blocks/cards/_card-counts.sass @@ -43,10 +43,18 @@ border-radius: 3px .card-counts__item-label - +text-block(.625rem 1.4, center) + +text-block(.625rem 1.4) + white-space: nowrap + display: flex + justify-content: center + align-items: center + text-align: center color: var(--semi-muted-text) padding-block: .125rem border-bottom: solid 1px var(--border) + height: 1.25rem + &.is-sm span + transform: scale(.85) .card-counts__item-value +text-block(.875rem 1.4, center) diff --git a/app/javascript/stylesheets/application/blocks/user/_user-group.sass b/app/javascript/stylesheets/application/blocks/user/_user-group.sass index d1da050513d..1a114c51fbe 100644 --- a/app/javascript/stylesheets/application/blocks/user/_user-group.sass +++ b/app/javascript/stylesheets/application/blocks/user/_user-group.sass @@ -3,6 +3,14 @@ &:not(:first-child) border-top: solid 1px var(--border-tint) +.user-group__header + display: flex + gap: .5rem + +media-breakpoint-up(md) + justify-content: space-between + +media-breakpoint-down(sm) + flex-direction: column + .user-group__title +media-breakpoint-up(md) font-size: 1.125rem @@ -12,23 +20,23 @@ .user-group__title-link text-decoration: none color: var(--main-text) + display: flex + gap: .5rem +media-breakpoint-up(md) - display: flex align-items: flex-end + +media-breakpoint-down(sm) + flex-direction: column .user-group__title.is-inline & - display: flex + flex-direction: row align-items: flex-end .user-group__title-label display: block font-weight: 600 - +media-breakpoint-up(md) - margin-right: .25em .user-group__title-link:hover & text-decoration: underline .user-group__title-icon - margin-right: .375em &.is-first color: var(--gold) &.is-second @@ -45,4 +53,10 @@ font-size: .75rem font-weight: 400 color: var(--muted-text) - margin-left: .25rem + +.user-group__counts + +media-breakpoint-up(md) + margin-top: -.5rem + .card-counts__item + width: 3.5rem + color: var(--default-text) diff --git a/app/models/generation.rb b/app/models/generation.rb index ceaac17527c..508c15e845a 100644 --- a/app/models/generation.rb +++ b/app/models/generation.rb @@ -44,4 +44,10 @@ def target_users(target) # 退会者は「退会」フィルター時のみ表示させたいため、絞り込みを行う target == 'retired' ? users : users.unretired end + + def count_classmates_by_target(target) + return classmates.students.count - classmates.hibernated.count if target == :students + + classmates.send(target).count + end end diff --git a/app/views/generations/_generation_count.html.slim b/app/views/generations/_generation_count.html.slim new file mode 100644 index 00000000000..3affe408639 --- /dev/null +++ b/app/views/generations/_generation_count.html.slim @@ -0,0 +1,11 @@ +- target_labels = %w[現役生 研修生 休会 卒業生 アドバイザー 退会者] +- target_to_scope = %i[students trainees hibernated graduated advisers retired] + +.card-counts__items + - target_labels.each_with_index do |label, index| + .card-counts__item + .card-counts__item-inner + .card-counts__item-label + = label + .card-counts__item-value + = generation.count_classmates_by_target(target_to_scope[index]) diff --git a/app/views/generations/index.html.slim b/app/views/generations/index.html.slim index 9069f145bf7..55c3d51e790 100644 --- a/app/views/generations/index.html.slim +++ b/app/views/generations/index.html.slim @@ -44,6 +44,9 @@ main.page-main = "#{generation.number}期生" .user-group__date = "#{l generation.start_date, format: :year_and_date} ~ #{l generation.end_date, format: :year_and_date}" + - if current_user.mentor? && @target == 'all' + .user-group__counts.is-only-mentor + = render partial: 'generations/generation_count', locals: { generation: generation } .a-user-icons .a-user-icons__items - users.each do |user| diff --git a/test/models/generation_test.rb b/test/models/generation_test.rb index ef043030e41..b954aa57ecf 100644 --- a/test/models/generation_test.rb +++ b/test/models/generation_test.rb @@ -29,4 +29,13 @@ class GenerationTest < ActiveSupport::TestCase assert_not_includes Generation.new(5).target_users('retired'), users(:komagata) assert_not_includes Generation.new(5).target_users('all'), users(:yameo) end + + test '#count_classmates_by_target' do + assert_equal 13, Generation.new(5).count_classmates_by_target(:students) + assert_equal 3, Generation.new(5).count_classmates_by_target(:trainees) + assert_equal 1, Generation.new(5).count_classmates_by_target(:hibernated) + assert_equal 2, Generation.new(5).count_classmates_by_target(:graduated) + assert_equal 2, Generation.new(5).count_classmates_by_target(:advisers) + assert_equal 2, Generation.new(5).count_classmates_by_target(:retired) + end end diff --git a/test/system/generations_test.rb b/test/system/generations_test.rb index 9553354bf54..f4a692d39ef 100644 --- a/test/system/generations_test.rb +++ b/test/system/generations_test.rb @@ -42,6 +42,18 @@ class GenerationsTest < ApplicationSystemTestCase assert_text '期生別(全員)' assert_link '33期生' assert_text '2021年01月01日 ~ 2021年03月31日' + assert_text '現役生' + assert_selector '.card-counts__item-value', text: '2' + assert_text '研修生' + assert_selector '.card-counts__item-value', text: '0' + assert_text '休会' + assert_selector '.card-counts__item-value', text: '0' + assert_text '卒業生' + assert_selector '.card-counts__item-value', text: '0' + assert_text 'アドバイザー' + assert_selector '.card-counts__item-value', text: '0' + assert_text '退会者' + assert_selector '.card-counts__item-value', text: '0' within all('.a-user-icons__items').first do within first('.a-user-role.is-admin') do assert_equal first('.a-user-icons__item-icon.a-user-icon')['title'], 'adminonly (アドミン 能美代): 管理者' @@ -49,6 +61,18 @@ class GenerationsTest < ApplicationSystemTestCase end assert_link '5期生' assert_text '2014年01月01日 ~ 2014年03月31日' + assert_text '現役生' + assert_selector '.card-counts__item-value', text: '13' + assert_text '研修生' + assert_selector '.card-counts__item-value', text: '3' + assert_text '休会' + assert_selector '.card-counts__item-value', text: '1' + assert_text '卒業生' + assert_selector '.card-counts__item-value', text: '2' + assert_text '退会者' + assert_selector '.card-counts__item-value', text: '2' + assert_text 'アドバイザー' + assert_selector '.card-counts__item-value', text: '2' within all('.a-user-icons__items').last do within first('.a-user-role.is-student') do assert_equal first('.a-user-icons__item-icon.a-user-icon')['title'], 'marumarushain1 (marumarushain1)'