You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
120 lines
3.2 KiB
120 lines
3.2 KiB
3 years ago
|
<app-tasks>
|
||
|
<div class="tasks">
|
||
|
<table class="table table--stripped">
|
||
|
<thead>
|
||
|
<tr>
|
||
|
<th class="table__th">
|
||
|
name
|
||
|
</th>
|
||
|
<th class="table__th">
|
||
|
url
|
||
|
</th>
|
||
|
<th class="table__th">
|
||
|
requestHandler
|
||
|
</th>
|
||
|
<th class="table__th">
|
||
|
actions
|
||
|
</th>
|
||
|
<th class="table__th">
|
||
|
cron
|
||
|
</th>
|
||
|
<th class="table__th"></th>
|
||
|
<tr>
|
||
|
</thead>
|
||
|
<tbody>
|
||
|
<tr if={ state.tasks.length > 0 } each={ task in state.tasks }>
|
||
|
<td class="table__td">
|
||
|
{ task.name }
|
||
|
</td>
|
||
|
<td class="table__td">
|
||
|
{ task.url }
|
||
|
</td>
|
||
|
<td class="table__td">
|
||
|
{ task.requestHandler }
|
||
|
</td>
|
||
|
<td class="table__td">
|
||
|
<virtual each={ action in task.actions }>
|
||
|
<span>
|
||
|
{ action.className }
|
||
|
</span>
|
||
|
<span if={ actions.options }>
|
||
|
{ JSON.stringify(action.options) }
|
||
|
</span>
|
||
|
</virtual>
|
||
|
</td>
|
||
|
<td class="table__td">
|
||
|
{ task.cron }
|
||
|
</td>
|
||
|
<td class="table__td">
|
||
|
<button class="button" onclick={ (event) => { handleEdit(event, task) } }>
|
||
|
Edit
|
||
|
</button>
|
||
|
<button class="button" onclick={ (event) => { handleDelete(event, task) } }>
|
||
|
Delete
|
||
|
</button>
|
||
|
</td>
|
||
|
</tr>
|
||
|
<tr if={ state.tasks.length === 0 }>
|
||
|
<td class="table__td center" colspan="6">
|
||
|
Nothing found
|
||
|
</td>
|
||
|
</tr>
|
||
|
</tbody>
|
||
|
</table>
|
||
|
</div>
|
||
|
|
||
|
<script>
|
||
|
|
||
|
/**
|
||
|
*
|
||
|
*
|
||
|
*
|
||
|
*/
|
||
|
|
||
|
export default
|
||
|
{
|
||
|
state: {
|
||
|
tasks: []
|
||
|
},
|
||
|
|
||
|
/**
|
||
|
*
|
||
|
*
|
||
|
*/
|
||
|
onMounted()
|
||
|
{
|
||
|
this.getTasks()
|
||
|
},
|
||
|
|
||
|
/**
|
||
|
*
|
||
|
*
|
||
|
*/
|
||
|
getTasks()
|
||
|
{
|
||
|
fetch('/api/task', (response) => {
|
||
|
this.state.tasks = response.data
|
||
|
})
|
||
|
},
|
||
|
|
||
|
/**
|
||
|
*
|
||
|
*
|
||
|
*/
|
||
|
handleDelete(event, action)
|
||
|
{
|
||
|
|
||
|
},
|
||
|
|
||
|
/**
|
||
|
*
|
||
|
*
|
||
|
*/
|
||
|
handleEdit(event, action)
|
||
|
{
|
||
|
|
||
|
}
|
||
|
}
|
||
|
|
||
|
</script>
|
||
|
</app-tasks>
|