<template>
  <div id="main">

    <UButton @click="router.push(`/jobs/create/`)">+ Job</UButton>

    <UTable
        :rows="jobs"
        :columns="columns"
        @select="selectJob"

    />

  </div>
</template>

<script setup>

definePageMeta({
  middleware: "auth"
})

const router = useRouter()
const {jobs } = storeToRefs(useDataStore())
const mode = ref("show")

const columns = [
  {
    key: "title",
    label: "Titel",
    sortable: true
  },{
    key: "state",
    label: "Status",
    sortable: true
  },{
    key: "customer",
    label: "Kunde",
    sortable: true
  }
]


const selectJob = (job) => {
  console.log(job)
  router.push(`/jobs/show/${job.id} `)
}
</script>

<style scoped>

</style>