improve schedule layout
This commit is contained in:
parent
7e94cfb43f
commit
caf2c88ae1
4 changed files with 110 additions and 70 deletions
|
@ -15,7 +15,6 @@ See the License for the specific language governing permissions and
|
|||
limitations under the License.
|
||||
"""
|
||||
|
||||
|
||||
import os
|
||||
import re
|
||||
import io
|
||||
|
@ -44,6 +43,7 @@ from tornado.options import define, options
|
|||
import tornado.web
|
||||
from tornado import gen, escape
|
||||
|
||||
|
||||
JOBS_STORE = 'sqlite:///conf/jobs.db'
|
||||
API_VERSION = '1.0'
|
||||
SCHEDULES_FILE = 'conf/schedules.json'
|
||||
|
|
3
dist/base.html
vendored
3
dist/base.html
vendored
|
@ -6,12 +6,11 @@
|
|||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,400italic|Material+Icons">
|
||||
<link rel="stylesheet" href="/static/css/vue-material.min.css">
|
||||
<link rel="stylesheet" href="/static/css/themes/default.css">
|
||||
<link rel="stylesheet" href="/static/css/diff2html.css">
|
||||
<script src="/static/js/lodash.min.js"></script>
|
||||
<script src="/static/js/vue.js"></script>
|
||||
<script src="/static/js/vue-material.min.js"></script>
|
||||
<script src="/static/js/axios.min.js"></script>
|
||||
<script src="/static/js/diff2html.js"></script>
|
||||
{% block head %}{% end %}
|
||||
</head>
|
||||
<body>
|
||||
{% block body %}{% end %}
|
||||
|
|
5
dist/diff.html
vendored
5
dist/diff.html
vendored
|
@ -1,5 +1,10 @@
|
|||
{% extends "base.html" %}
|
||||
|
||||
{% block head %}
|
||||
<link rel="stylesheet" href="/static/css/diff2html.css">
|
||||
<script src="/static/js/diff2html.js"></script>
|
||||
{% end %}
|
||||
|
||||
{% block body %}
|
||||
<div id="app">
|
||||
<div class="md-layout">
|
||||
|
|
162
dist/schedule.html
vendored
162
dist/schedule.html
vendored
|
@ -2,27 +2,35 @@
|
|||
|
||||
{% 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-layout md-gutter">
|
||||
<div class="md-layout-item md-size-100">
|
||||
<div class="md-title">
|
||||
<md-button href="/" class="md-icon-button md-primary">
|
||||
<span>
|
||||
<md-button href="/" class="md-icon-button md-primary home-icon">
|
||||
<md-icon>home</md-icon>
|
||||
</md-button>
|
||||
Diffido: ${(schedule && schedule.title) || 'new'} schedule
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="md-layout-item md-size-60">
|
||||
<md-card id="main-card">
|
||||
<md-card-header>
|
||||
<div class="md-title">
|
||||
Settings
|
||||
</div>
|
||||
</md-card-header>
|
||||
|
||||
<md-card-content>
|
||||
<div class="md-layout md-gutter">
|
||||
<div class="md-layout-item">
|
||||
<div class="md-layout-item md-size-50">
|
||||
<md-field>
|
||||
<label>title</label>
|
||||
<md-input v-model="schedule.title" required></md-input>
|
||||
</md-field>
|
||||
</div>
|
||||
<div class="md-layout-item">
|
||||
<div class="md-layout-item md-size-50">
|
||||
<md-field>
|
||||
<label>url</label>
|
||||
<md-input v-model="schedule.url" required></md-input>
|
||||
|
@ -30,59 +38,6 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="md-layout md-gutter">
|
||||
<div class="md-layout-item md-size-25">
|
||||
<md-field>
|
||||
<label>trigger</label>
|
||||
<md-select v-model="schedule.trigger">
|
||||
<md-option value="interval">interval</md-option>
|
||||
<md-option value="cron">cron</md-option>
|
||||
</md-select>
|
||||
</md-field>
|
||||
</div>
|
||||
<div class="md-layout-item md-size-25">
|
||||
<div v-if="schedule.trigger == 'cron'">
|
||||
<md-field>
|
||||
<label>crontab</label>
|
||||
<md-input v-model="schedule.cron_crontab"></md-input>
|
||||
</md-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="schedule.trigger == 'interval'" class="md-layout md-gutter">
|
||||
<div class="md-layout-item md-size-20">
|
||||
<md-field>
|
||||
<label>weeks</label>
|
||||
<md-input v-model="schedule.interval_weeks" type="number"></md-input>
|
||||
</md-field>
|
||||
</div>
|
||||
<div class="md-layout-item md-size-20">
|
||||
<md-field>
|
||||
<label>days</label>
|
||||
<md-input v-model="schedule.interval_days" type="number"></md-input>
|
||||
</md-field>
|
||||
</div>
|
||||
<div class="md-layout-item md-size-20">
|
||||
<md-field>
|
||||
<label>hours</label>
|
||||
<md-input v-model="schedule.interval_hours" type="number"></md-input>
|
||||
</md-field>
|
||||
</div>
|
||||
<div class="md-layout-item md-size-20">
|
||||
<md-field>
|
||||
<label>minutes</label>
|
||||
<md-input v-model="schedule.interval_minutes" type="number"></md-input>
|
||||
</md-field>
|
||||
</div>
|
||||
<div class="md-layout-item md-size-20">
|
||||
<md-field>
|
||||
<label>seconds</label>
|
||||
<md-input v-model="schedule.interval_seconds" type="number"></md-input>
|
||||
</md-field>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="md-layout md-gutter">
|
||||
<div class="md-layout-item md-size-33">
|
||||
<md-field>
|
||||
|
@ -104,13 +59,83 @@
|
|||
</div>
|
||||
</div>
|
||||
<md-switch v-model="schedule.enabled">enabled</md-switch>
|
||||
</md-card-content>
|
||||
</md-card>
|
||||
</div>
|
||||
|
||||
<div class="md-layout-item">
|
||||
<md-card id="trigger-card">
|
||||
<md-card-header>
|
||||
<div class="md-title">
|
||||
Trigger
|
||||
</div>
|
||||
</md-card-header>
|
||||
<md-card-content>
|
||||
<div class="md-layout md-gutter">
|
||||
<div class="md-layout-item md-size-25">
|
||||
<md-field>
|
||||
<label>trigger</label>
|
||||
<md-select v-model="schedule.trigger">
|
||||
<md-option value="interval">interval</md-option>
|
||||
<md-option value="cron">cron</md-option>
|
||||
</md-select>
|
||||
</md-field>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="schedule.trigger == 'cron'" class="md-layout md-gutter">
|
||||
<div class="md-layout-item md-size-50">
|
||||
<md-field>
|
||||
<label>crontab</label>
|
||||
<md-input v-model="schedule.cron_crontab"></md-input>
|
||||
</md-field>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="schedule.trigger == 'interval'" class="md-layout md-gutter">
|
||||
<div class="md-layout-item md-size-20">
|
||||
<md-field>
|
||||
<label>weeks</label>
|
||||
<md-input v-model="schedule.interval_weeks" type="number"></md-input>
|
||||
</md-field>
|
||||
</div>
|
||||
<div class="md-layout-item md-size-20">
|
||||
<md-field>
|
||||
<label>days</label>
|
||||
<md-input v-model="schedule.interval_days" type="number"></md-input>
|
||||
</md-field>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="schedule.trigger == 'interval'" class="md-layout md-gutter">
|
||||
<div class="md-layout-item md-size-20">
|
||||
<md-field>
|
||||
<label>hours</label>
|
||||
<md-input v-model="schedule.interval_hours" type="number"></md-input>
|
||||
</md-field>
|
||||
</div>
|
||||
<div class="md-layout-item md-size-20">
|
||||
<md-field>
|
||||
<label>minutes</label>
|
||||
<md-input v-model="schedule.interval_minutes" type="number"></md-input>
|
||||
</md-field>
|
||||
</div>
|
||||
<div class="md-layout-item md-size-20">
|
||||
<md-field>
|
||||
<label>seconds</label>
|
||||
<md-input v-model="schedule.interval_seconds" type="number"></md-input>
|
||||
</md-field>
|
||||
</div>
|
||||
</div>
|
||||
</md-card-content>
|
||||
</md-card>
|
||||
</div>
|
||||
|
||||
<div class="md-layout-item md-size-100">
|
||||
<div class="md-title">
|
||||
<br />
|
||||
<md-button class="md-raised md-primary" @click="saveSchedule()">save</md-button>
|
||||
<md-button class="md-raised md-accent" :disabled="!hasID()" @click="deleteSchedule()">delete</md-button>
|
||||
<md-button href="/">back</md-button>
|
||||
</md-card-content>
|
||||
</md-card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -179,13 +204,24 @@ var app = new Vue({
|
|||
|
||||
body {
|
||||
background-color: white;
|
||||
padding: 6px;
|
||||
padding: 12px 20px 12px 20px;
|
||||
}
|
||||
|
||||
.md-table {
|
||||
height: 80%;
|
||||
}
|
||||
|
||||
.home-icon {
|
||||
margin-top: -6px;
|
||||
}
|
||||
|
||||
.md-card-content {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
#trigger-card, #main-card {
|
||||
min-height: 350px;
|
||||
}
|
||||
|
||||
</style>
|
||||
{% end %}
|
||||
|
|
Loading…
Reference in a new issue