123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119 |
- {% extends "base.html" %}
- {% block body %}
- <div id="app">
- <div class="md-layout">
- <div class="md-layout-item">
- <md-card id="main-card">
- <md-card-header>
- <div class="md-title">
- <md-button href="/" class="md-icon-button md-primary">
- <md-icon>home</md-icon>
- </md-button>
- Diffido
- <md-button href="/schedule.html" class="md-icon-button md-primary">
- <md-icon>add_circle_outline</md-icon>
- </md-button>
- </div>
- </md-card-header>
-
- <md-card-content>
- <md-table id="schedules-table" v-model="schedules">
- <md-table-row slot="md-table-row" slot-scope="{item}">
- <md-table-cell md-label="#" md-sort-by="id" md-numeric><a :href="'/schedule.html?id=' + item.id">${ item.id }</a></md-table-cell>
- <md-table-cell md-label="enabled" md-sort-by="enabled">
- <md-icon v-if="item.enabled">check_box</md-icon>
- <md-icon v-if="!item.enabled">check_box_outline_blank</md-icon>
- </md-table-cell>
- <md-table-cell md-label="title" md-sort-by="title"><a :href="'/schedule.html?id=' + item.id">${ item.title }</a></md-table-cell>
- <md-table-cell md-label="url" md-sort-by="url"><a :href="item.url" target="_new">${ item.url }</a></md-table-cell>
- <md-table-cell md-label="trigger" md-sort-by="trigger">${ triggerString(item) }</md-table-cell>
- <md-table-cell md-label="last check" md-sort-by="last_history">${ item.last_history && item.last_history.message }</md-table-cell>
- <md-table-cell md-label="history">
- <md-button :href="'/history.html?id=' + item.id" class="md-icon-button md-primary">
- <md-icon>history</md-icon>
- </md-button>
- </md-table-cell>
- <md-table-cell md-label="run now">
- <md-button class="md-icon-button md-primary" @click="runSchedule(item.id)">
- <md-icon>play_circle_outline</md-icon>
- </md-button>
- </md-table-cell>
- </md-table-row>
- </md-table>
- </md-card-content>
- </md-card>
- </div>
- </div>
- </div>
- <script>
- Vue.use(VueMaterial.default);
- var app = new Vue({
- el: '#app',
- delimiters: ['${', '}'],
- data: {
- schedules: []
- },
- mounted: function() {
- this.getSchedules();
- },
- methods: {
- getSchedules: function() {
- var self = this;
- var data = axios.get('/api/schedules').then(function(response) {
- var schedules = [];
- _.forEach(response.data.schedules || {}, function(value, key) {
- value.id = key;
- schedules.push(value);
- });
- self.schedules = schedules;
- });
- },
- triggerString: function(item) {
- if (item.trigger == 'cron') {
- return 'cron: ' + item.cron_crontab;
- }
- if (item.trigger == 'interval') {
- var text = 'interval: ';
- var pieces = [];
- _.each(['weeks', 'days', 'hours', 'minutes', 'seconds'], function(value, key) {
- var int_val = item['interval_' + value];
- if (int_val && parseInt(int_val)) {
- var unit = value;
- if (int_val == 1) {
- unit = unit.slice(0, -1);
- }
- pieces.push('' + int_val + ' ' + unit);
- }
- });
- text = text + _.join(pieces, ', ');
- return text;
- }
- return '';
- },
- runSchedule: function(id) {
- var self = this;
- var data = axios.post('/api/schedules/' + id + '/run').then(function(response) {
- setTimeout(self.getSchedules, 2500);
- });
- }
- }
- });
- </script>
- <style>
- body {
- background-color: white;
- padding: 6px;
- }
- .md-table {
- height: 80%;
- }
- </style>
- {% end %}
|