<?php /*
Template Name: ヘルスケア情報　一覧
*/
?>
<?php get_header(); ?>
  <main role="main" itemscope itemprop="mainContentOfPage" itemtype="http://schema.org/Blog">

  <div id="archive" class="healthcare">
  <div class="cover"><h1><?php echo esc_html(get_post_type_object(get_post_type())->label); ?></h1></div>


<div class="swiper_bg">
<div class="swiper">
    <h2>ピックアップ記事</h2>
    <div class="swiper-wrapper">
        <?php
        $pickup_args = array(
            'post_type' => 'healthcare',
            'posts_per_page' => 9,
            'meta_key' => 'show_pickup',
            'meta_value' => 'show',
            'meta_compare' => 'LIKE'
        );
        $pickup_query = new WP_Query($pickup_args);
        ?>
        <?php if ($pickup_query->have_posts()) : ?>
            <?php while ($pickup_query->have_posts()) : $pickup_query->the_post(); ?>

            <?php
        // タームのスラッグをclassにする準備
        $terms = get_the_terms(get_the_ID(), 'custom_cat');
        $class_names = '';

        if (!empty($terms) && !is_wp_error($terms)) {
            $class_array = array();
            foreach ($terms as $term) {
                $class_array[] = esc_html($term->slug); // スラッグだけ取得
            }
            $class_names = implode(' ', $class_array); // 空白区切りでclassにする
        }
        ?>

        <div class="swiper-slide p-news__item <?php echo $class_names; ?>">
            <?php
            $terms = get_the_terms(get_the_ID(), 'custom_cat');
            if (!empty($terms)) {
                $output = array();
                foreach ($terms as $term) {
                    if ($term->parent != 0) {
                        $output[] = $term->name;
                    }
                }
                if (count($output)) {
                    echo '<span class="term cat">' . join(", ", $output) . '</span>';
                } else {
                    echo '<span class="term '. esc_html($term->slug) .'">' . $term->name . '</span>';
                }
            }
            ?>

            <div class="image"><img src="<?php the_field('image_1'); ?>" ></div>
            <div class="date"><?php the_time('Y.m.d'); ?></div>
            <div class="title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></div>
        </div>
        <?php endwhile; ?>
<?php endif; ?>
<?php wp_reset_postdata(); ?>
    </div>
    <div class="swiper-pagination"></div>
</div>
    <div class="swiper-button-next"></div>
    <div class="swiper-button-prev"></div>

</div>

<script>
  var swiper = new Swiper('.swiper', {
    loop: true,
    slidesPerView: 3,
    spaceBetween: 20,
    pagination: {
      el: '.swiper-pagination',
      clickable: true,
    },
    navigation: {
      nextEl: '.swiper-button-next',
      prevEl: '.swiper-button-prev',
    },
  });
</script>



      <div class="wrap">
<div class="flex">
    <article>
<h2>最新記事</h2>
                    <div class="inner">
 <ul class="p-news__items">

    <?php
    // 検索クエリの存在を確認
    $class_filter = isset($_GET['class_filter']) ? $_GET['class_filter'] : array();
    $profession_filter = isset($_GET['profession_filter']) ? $_GET['profession_filter'] : array();

    $args = array(
        'posts_per_page' => 9,
        'post_type' => 'healthcare',
        'orderby' => 'date',
        'order' => 'DESC',
        'paged' => $paged,
    );

    if (!empty($class_filter) || !empty($profession_filter)) {
        $args['tax_query'] = array('relation' => 'OR');

        if (!empty($class_filter)) {
            $args['tax_query'][] = array(
                'taxonomy' => 'custom_cat',
                'field' => 'slug',
                'terms' => $class_filter,
                'operator' => 'IN'
            );
        }

        if (!empty($profession_filter)) {
            $args['tax_query'][] = array(
                'taxonomy' => 'profession',
                'field' => 'slug',
                'terms' => $profession_filter,
                'operator' => 'IN'
            );
        }
    }

    $news_query = new WP_Query($args);

    if ($news_query->have_posts()) :
        while ($news_query->have_posts()) : $news_query->the_post();
    ?>

        <li class="p-news__item">
            <?php
            // ターム名を表示
            $terms = get_the_terms($post->ID, 'custom_cat'); // タームが所属するタクソノミースラッグを指定
            if (!empty($terms)) {
                $output = array();
                foreach ($terms as $term) {
                    if ($term->parent != 0) {
                        $output[] = $term->name;
                    }
                }
                if (count($output)) {
                    echo '<span class="term cat">' . join(", ", $output) . '</span>';
                } else {
                    echo '<span class="term '. esc_html($term->slug) .'">' . $term->name . '</span>';
                }
            }
            ?>

            <div class="image"><img src="<?php the_field('image_1'); ?>" ></div>
            <div class="date"><?php the_time('Y.m.d'); ?></div>
            <div class="title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></div>
        </li>

    <?php
        endwhile;
    else :
        echo '<li>何も投稿がありません。</li>';
    endif;

    wp_reset_postdata();
    ?>

    </ul>
    <div class="p-news__btn">
    <?php echo get_next_posts_link('もっと見る', $news_query->max_num_pages); ?>
    </div>
    <div class="center"><button class="view-more-button" type="button">もっと見る▼</button></div>
    <div class="page-load-status" style="display:none;">
        <div class="infinite-scroll-request">ロード中</div>
        <p class="infinite-scroll-last">これ以上は記事がありません</p>
        <p class="infinite-scroll-error">読み込むページがありません</p>
    </div>
                    </div>







    </article>

</div>

      </div><!-- /.wrap -->
  </div><!-- /#archive -->
<script>
var infScroll = new InfiniteScroll( '.p-news__items', { // 記事を挿入していく要素を指定
    append: '.p-news__item',     // 各記事の要素
    path: '.p-news__btn a',  // 次のページへのリンク要素を指定
    hideNav: '.p-news__btn', // 指定要素を非表示にする（ここは無くてもOK）
    button: '.view-more-button', // 記事を読み込むトリガーとなる要素を指定
    scrollThreshold: false,      // スクロールで読み込む：falseで機能停止（デフォルトはtrue）
    status: '.page-load-status', // ステータス部分の要素を指定
    history: 'false'             // falseで履歴に残さない
});
</script>
  </main>
  
  <?php get_footer(); ?>