<template>
  <div class="counter-wrapper container">
    <div class="row">
      <div
        class="col-sm-12 col-md mb-5 mb-md-0 text-center"
        v-for="(counter, index) in list"
      >
        <!-- <my-counter-list-item
          :counter="counter"
          :key="index + render"
        ></my-counter-list-item> -->
      </div>
    </div>
  </div>
</template>

<script>
// import HttpService from "~/services/httpService";
import repoApi from "~/apis/repoApi";

export default {
  props: {
    listData: {
      default() {
        return [];
      },
    },
  },
  async beforeMount() {
    try {
      const { $api } = useNuxtApp();
      const data = await $api(repoApi.entity.info, {
        baseURL: import.meta.env.VITE_REPO_BASE_URL,
        method: "GET",
      });
      this.list[0].total = data.count_qa;
      this.list[1].total = data.count_rg;
      this.list[2].total = data.count_op;
      this.render++;
    } catch (err) {
      this.captchaImage = (
        await import(`assets/common/img/captcha.png`)
      ).default;
    }
  },

  data() {
    return {
      render: 1,
      httpService: undefined,
      list: [
        {
          title: "قوانین",
          date: "1285/05/13",
          total: 12161,
          key: "rulesCount",
          routeName: "qasection",
        },
        {
          title: "مقررات",
          date: "1232/01/14",
          total: 108745,
          key: "disciplineCount",
          routeName: "rgsection",
        },
        {
          title: "رأی و نظر",
          date: "1131/10/12",
          total: 1403,
          key: "adminOpinion",
          routeName: "qaopinion",
        },
      ],
    };
  },
};
</script>

<style lang="scss" scoped>
.counter-wrapper {
  max-width: 65em;
  margin: auto;
  //   margin-top: 4em;
}
</style>