<template>
  <div class="q-pa-md">
    <q-table :title="name+'一覧'" :selection="type" v-model:selected="selected" :columns="columns" :rows="rows" />
  </div>
</template>
<script>
import { ref,onMounted,reactive } from 'vue'
import { api } from 'boot/axios';

export default {
  name: 'DomainSelect',
  props: {
    name: String,
    type: String
  },
  setup() {
  const columns = [
  { name: 'id'},
  { name: 'tenantid', required: true,label: 'テナント',align: 'left',field: 'tenantid',sortable: true},
  { name: 'name', align: 'center', label: 'ドメイン', field: 'name', sortable: true },
  { name: 'url', label: 'URL', field: 'url', sortable: true },
  { name: 'kintoneuser', label: 'アカウント', field: 'kintoneuser' }
  ]
  const rows = reactive([])
    onMounted( () => {
      api.get(`api/domains/1`).then(res =>{
         res.data.forEach((item) =>
        {
          rows.push({id:item.id,tenantid:item.tenantid,name:item.name,url:item.url,kintoneuser:item.kintoneuser});
        }
        )
      });
      });
    return {
      columns,
      rows,
      selected: ref([]),
    }
  },

}
</script>
