<script>
import RoutesList from "@organisms/RoutersEditor/index.vue"
import PageHeader from "@atoms/PageHeader.vue"
import RouterRow from "@organisms/RoutersEditor/RouterRow.vue"
import SiteList from "@organisms/SitesEditor/SiteList.vue"
import {mapActions, mapGetters} from 'vuex'


export default {
  name: 'App',
  components: {RoutesList, SiteList, RouterRow, PageHeader},
  computed: {
    ...mapGetters('proxy', ["sites", "routes"]),
  },
  mounted() {
    this.uploadSites()
    // const routes = new Users("http://172.25.78.64:8087")
    // routes.test().then((testRes) => {
    //   console.log(testRes)
    // })
  },
  methods: {
    ...mapActions('proxy', ["uploadSites"])
  }
}

</script>

<template>
  <div class="p-6">
    <PageHeader class="me-2 mb-6" />
    <SiteList />
    <RoutesList>
      <RouterRow
        v-for="route in routes"
        :id="route.id"
        :key="`key-${route.id}`"
        :isCbOn="route.is_cb_on"
        :isOnline="route.is_online"
        :path="route.path"
        :role="route.role"
        :description="route.description"
        :errorPercent="route.cb_error_threshold_percentage"
        :intervalDuration="route.cb_interval_duration"
        :minRequests="route.cb_min_requests"
        :openStateTimeout="route.cb_open_state_timeout"
        :requestLimit="route.cb_request_limit"
        :deepness="route.deepness"
        :order="route.order"
      />
    </RoutesList>
  </div>
</template>
