alberanid/diffido
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

improve schedule layout

Browse source
This commit is contained in:
Davide Alberani 2018-01-25 23:53:09 +01:00
parent 7e94cfb43f
commit caf2c88ae1
4 changed files with 110 additions and 70 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
diffido.py
View file

@ -15,7 +15,6 @@ See the License for the specific language governing permissions and
limitations under the License. limitations under the License.
""" """
import os import os
import re import re
import io import io
@ -44,6 +43,7 @@ from tornado.options import define, options
import tornado.web import tornado.web
from tornado import gen, escape from tornado import gen, escape
JOBS_STORE = 'sqlite:///conf/jobs.db' JOBS_STORE = 'sqlite:///conf/jobs.db'
API_VERSION = '1.0' API_VERSION = '1.0'
SCHEDULES_FILE = 'conf/schedules.json' SCHEDULES_FILE = 'conf/schedules.json'

3
dist/base.html vendored
View file

@ -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="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/vue-material.min.css">
<link rel="stylesheet" href="/static/css/themes/default.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/lodash.min.js"></script>
<script src="/static/js/vue.js"></script> <script src="/static/js/vue.js"></script>
<script src="/static/js/vue-material.min.js"></script> <script src="/static/js/vue-material.min.js"></script>
<script src="/static/js/axios.min.js"></script> <script src="/static/js/axios.min.js"></script>
<script src="/static/js/diff2html.js"></script> {% block head %}{% end %}
</head> </head>
<body> <body>
{% block body %}{% end %} {% block body %}{% end %}

5
dist/diff.html vendored
View file

@ -1,5 +1,10 @@
{% extends "base.html" %} {% extends "base.html" %}
{% block head %}
<link rel="stylesheet" href="/static/css/diff2html.css">
<script src="/static/js/diff2html.js"></script>
{% end %}
{% block body %} {% block body %}
<div id="app"> <div id="app">
<div class="md-layout"> <div class="md-layout">

162
dist/schedule.html vendored
View file

@ -2,27 +2,35 @@
{% block body %} {% block body %}
<div id="app"> <div id="app">
<div class="md-layout"> <div class="md-layout md-gutter">
<div class="md-layout-item"> <div class="md-layout-item md-size-100">
<md-card id="main-card">
<md-card-header>
<div class="md-title"> <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-icon>home</md-icon>
</md-button> </md-button>
Diffido: ${(schedule && schedule.title) || 'new'} schedule 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> </div>
</md-card-header> </md-card-header>
<md-card-content> <md-card-content>
<div class="md-layout md-gutter"> <div class="md-layout md-gutter">
<div class="md-layout-item"> <div class="md-layout-item md-size-50">
<md-field> <md-field>
<label>title</label> <label>title</label>
<md-input v-model="schedule.title" required></md-input> <md-input v-model="schedule.title" required></md-input>
</md-field> </md-field>
</div> </div>
<div class="md-layout-item"> <div class="md-layout-item md-size-50">
<md-field> <md-field>
<label>url</label> <label>url</label>
<md-input v-model="schedule.url" required></md-input> <md-input v-model="schedule.url" required></md-input>
@ -30,59 +38,6 @@
</div> </div>
</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 md-gutter">
<div class="md-layout-item md-size-33"> <div class="md-layout-item md-size-33">
<md-field> <md-field>
@ -104,13 +59,83 @@
</div> </div>
</div> </div>
<md-switch v-model="schedule.enabled">enabled</md-switch> <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 /> <br />
<md-button class="md-raised md-primary" @click="saveSchedule()">save</md-button> <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 class="md-raised md-accent" :disabled="!hasID()" @click="deleteSchedule()">delete</md-button>
<md-button href="/">back</md-button> <md-button href="/">back</md-button>
</md-card-content> </div>
</md-card>
</div> </div>
</div> </div>
</div> </div>
@ -179,13 +204,24 @@ var app = new Vue({
body { body {
background-color: white; background-color: white;
padding: 6px; padding: 12px 20px 12px 20px;
} }
.md-table { .md-table {
height: 80%; height: 80%;
} }
.home-icon {
margin-top: -6px;
}
.md-card-content {
padding: 20px;
}
#trigger-card, #main-card {
min-height: 350px;
}
</style> </style>
{% end %} {% end %}