슬라이드 페이징 처리관련 문의 드립니다. 채택완료

코딩 UI 아래와 같습니다.

좌우 하살표를 이용해 슬라이드 형태 페이징입니다.

코딩 구조는 아래와 같습니다.

일반적인 페이징 처리가 어려운 관계로 

페이징 처리를 해야 되는되요

만약 

total_count = 18

total_page = 2

page_row = 6

일 경우 어떻게 하면 좋은지 조언 구합니다.

<!-- 페이지1 -->

<div  class="active">

     <div>

        <ul>

           <!-- 데이터 -->

            <li></li>

            <li></li>

            <li></li>

            <li></li>

            <li></li>

            <li></li>

        </ul>

     <div/>

<!-- 페이징 -->

<div class="list-page-number section">

   <span> <em class="bold">1</em> / 2</span>

</div>

</div>

<!-- 페이지2 -->

<div  >

     <div>

        <ul>

           <!-- 데이터 -->

            <li></li>

            <li></li>

            <li></li>

            <li></li>

            <li></li>

            <li></li>

        </ul>

     <div/>

<!-- 페이징 -->

<div class="list-page-number section">

   <span> <em class="bold">2</em> / 2</span>

</div>

</div>

<!-- 좌우버튼 -->

<div class="tunning-page-control-btn">

<button class="carousel-control-prev" type="button" data-bs-target="#main-mall-03"

data-bs-slide="prev">

<span class="carousel-control-prev-icon" aria-hidden="true"></span>

<span class="visually-hidden">Previous</span>

</button>

<button class="carousel-control-next" type="button" data-bs-target="#main-mall-03"

data-bs-slide="next">

<span class="carousel-control-next-icon" aria-hidden="true"></span>

<span class="visually-hidden">Next</span>

</button>

</div>