mirror of
https://github.com/Sebclem/hassio-nextcloud-backup.git
synced 2024-11-22 17:22:58 +01:00
🔨 Add auto clean settings UI
This commit is contained in:
parent
0b803005d4
commit
3aedd26150
@ -135,7 +135,8 @@
|
|||||||
<span class="card-title white-text" style="font-weight: bold;">Manual </span>
|
<span class="card-title white-text" style="font-weight: bold;">Manual </span>
|
||||||
<div class="divider"></div>
|
<div class="divider"></div>
|
||||||
<div style="width: 100%;" class="center">
|
<div style="width: 100%;" class="center">
|
||||||
<a class="btn green center waves-effect waves-light" id="btn-backup-now" style="margin-top: 7px; display: block;">Backup
|
<a class="btn green center waves-effect waves-light" id="btn-backup-now"
|
||||||
|
style="margin-top: 7px; display: block;">Backup
|
||||||
Now</a>
|
Now</a>
|
||||||
<a class="btn center teal darken-4 waves-effect waves-light" id="btn-clean-now"
|
<a class="btn center teal darken-4 waves-effect waves-light" id="btn-clean-now"
|
||||||
style="margin-top: 7px; display: block;">Clean Now</a>
|
style="margin-top: 7px; display: block;">Clean Now</a>
|
||||||
@ -217,7 +218,9 @@
|
|||||||
<div class="input-field col s6">
|
<div class="input-field col s6">
|
||||||
<input id="password" type="password" class="white-text">
|
<input id="password" type="password" class="white-text">
|
||||||
<label for="password">Password</label>
|
<label for="password">Password</label>
|
||||||
<span class="helper-text">!!! Use App Password !!! See <a target="_blank" href="https://github.com/Sebclem/hassio-nextcloud-backup/blob/master/README.md">doc</a> for more information.</span>
|
<span class="helper-text">!!! Use App Password !!! See <a target="_blank"
|
||||||
|
href="https://github.com/Sebclem/hassio-nextcloud-backup/blob/master/README.md">doc</a> for more
|
||||||
|
information.</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -287,10 +290,77 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col s12">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col s12 center">
|
||||||
|
<h4>Auto Clean Settings</h2>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col s12 divider">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row" style="margin-bottom: 10px;">
|
||||||
|
<div class="col s12" style="margin-bottom: 10px;">
|
||||||
|
<div style="color: #9e9e9e; display: inline;">Auto Clean Local Snapshots</div>
|
||||||
|
<div class="switch" style="display: inline;">
|
||||||
|
<label>
|
||||||
|
<input id="auto_clean_local" type="checkbox">
|
||||||
|
<span class="lever"></span>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row hide">
|
||||||
|
<div class="input-field col s3">
|
||||||
|
<input type="text" class="white-text" disabled readonly="true" id="local-snap-keep-read">
|
||||||
|
<label class="white-text active">Local snapshot to keep</label>
|
||||||
|
</div>
|
||||||
|
<div class="input-field col s9">
|
||||||
|
<p class="range-field">
|
||||||
|
<input type="range" id="local-snap-keep" min="1" max="20" style="border: none;" />
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row" style="margin-bottom: 10px;">
|
||||||
|
<div class="col s12" style="margin-bottom: 10px;">
|
||||||
|
<div style="color: #9e9e9e; display: inline;">Auto Clean Nextcloud Snapshots</div>
|
||||||
|
<div class="switch" style="display: inline;">
|
||||||
|
<label>
|
||||||
|
<input id="auto_clean_backup" type="checkbox">
|
||||||
|
<span class="lever"></span>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row hide">
|
||||||
|
<div class="input-field col s3">
|
||||||
|
<input type="text" class="white-text" disabled readonly="true" id="backup-snap-keep-read">
|
||||||
|
<label class="white-text active">Nextcloud snapshot to keep</label>
|
||||||
|
</div>
|
||||||
|
<div class="input-field col s9">
|
||||||
|
<p class="range-field">
|
||||||
|
<input type="range" id="backup-snap-keep" min="1" max="20" style="border: none;" />
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div class="modal-footer blue-grey darken-4">
|
<div class="modal-footer blue-grey darken-4">
|
||||||
<a href="#" class="modal-close waves-effect btn red"><b>Cancel</b></a>
|
<a href="#" class="modal-close waves-effect btn red"><b>Cancel</b></a>
|
||||||
<a href="#" class="btn green waves-effect" style="margin-left: 5px;" id="save-backup-settings"><b>Save</b></a>
|
<a href="#" class="btn green waves-effect" style="margin-left: 5px;" id="save-backup-settings"><b>Save</b></a>
|
||||||
@ -538,6 +608,28 @@
|
|||||||
$('#cron-drop-day-month-read').val($(this).val());
|
$('#cron-drop-day-month-read').val($(this).val());
|
||||||
});
|
});
|
||||||
|
|
||||||
|
$('#local-snap-keep').on('input', function() {
|
||||||
|
$('#local-snap-keep-read').val($(this).val());
|
||||||
|
});
|
||||||
|
$("#auto_clean_local").change(() => {
|
||||||
|
if ($("#auto_clean_local").is(':checked'))
|
||||||
|
$('#local-snap-keep').parent().parent().parent().removeClass("hide");
|
||||||
|
else
|
||||||
|
$('#local-snap-keep').parent().parent().parent().addClass("hide");
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#backup-snap-keep').on('input', function() {
|
||||||
|
$('#backup-snap-keep-read').val($(this).val());
|
||||||
|
});
|
||||||
|
$("#auto_clean_backup").change(() => {
|
||||||
|
if ($("#auto_clean_backup").is(':checked'))
|
||||||
|
$('#backup-snap-keep').parent().parent().parent().removeClass("hide");
|
||||||
|
else
|
||||||
|
$('#backup-snap-keep').parent().parent().parent().addClass("hide");
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@ -613,12 +705,16 @@
|
|||||||
function getBackupSettings() {
|
function getBackupSettings() {
|
||||||
loadingModal.open();
|
loadingModal.open();
|
||||||
$.get('./api/backup-settings', (data) => {
|
$.get('./api/backup-settings', (data) => {
|
||||||
if (data == {}) {
|
if (JSON.stringify(data) == "{}") {
|
||||||
data = {
|
data = {
|
||||||
cron_base: "0",
|
cron_base: "0",
|
||||||
cron_hour: "00:00",
|
cron_hour: "00:00",
|
||||||
cron_weekday: "0",
|
cron_weekday: "0",
|
||||||
cron_month_day: "1"
|
cron_month_day: "1",
|
||||||
|
auto_clean_local: false,
|
||||||
|
auto_clean_local_keep: 1,
|
||||||
|
auto_clean_backup: false,
|
||||||
|
auto_clean_backup_keep: 1,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -634,9 +730,30 @@
|
|||||||
M.Timepicker.init(timepicker, { defaultTime: data.cron_hour, twelveHour: false, container: 'body' });
|
M.Timepicker.init(timepicker, { defaultTime: data.cron_hour, twelveHour: false, container: 'body' });
|
||||||
$('#cron-drop-day-month-read').val(data.cron_month_day);
|
$('#cron-drop-day-month-read').val(data.cron_month_day);
|
||||||
$('#cron-drop-day-month').val(data.cron_month_day);
|
$('#cron-drop-day-month').val(data.cron_month_day);
|
||||||
|
|
||||||
$('#cron-drop-day-month-read + label').removeClass("active");
|
$('#cron-drop-day-month-read + label').removeClass("active");
|
||||||
$('#cron-drop-day-month-read + label').addClass("active");
|
$('#cron-drop-day-month-read + label').addClass("active");
|
||||||
|
|
||||||
|
$('#auto_clean_local').prop('checked', data.auto_clean_local);
|
||||||
|
$('#local-snap-keep-read, #local-snap-keep').val(data.auto_clean_local_keep);
|
||||||
|
$('#auto_clean_backup').prop('checked', data.auto_clean_backup);
|
||||||
|
$('#backup-snap-keep-read, #backup-snap-keep').val(data.auto_clean_backup_keep);
|
||||||
|
|
||||||
|
if ($("#auto_clean_backup").is(':checked'))
|
||||||
|
$('#backup-snap-keep').parent().parent().parent().removeClass("hide");
|
||||||
|
else
|
||||||
|
$('#backup-snap-keep').parent().parent().parent().addClass("hide");
|
||||||
|
|
||||||
|
if ($("#auto_clean_local").is(':checked'))
|
||||||
|
$('#local-snap-keep').parent().parent().parent().removeClass("hide");
|
||||||
|
else
|
||||||
|
$('#local-snap-keep').parent().parent().parent().addClass("hide");
|
||||||
|
|
||||||
|
$('#backup-snap-keep-read + label').removeClass("active");
|
||||||
|
$('#backup-snap-keep-read + label').addClass("active");
|
||||||
|
$('#local-snap-keep-read + label').removeClass("active");
|
||||||
|
$('#local-snap-keep-read + label').addClass("active");
|
||||||
|
|
||||||
changeSelect('#cron-drop-day', data.cron_weekday);
|
changeSelect('#cron-drop-day', data.cron_weekday);
|
||||||
updateDropVisibility();
|
updateDropVisibility();
|
||||||
loadingModal.close();
|
loadingModal.close();
|
||||||
@ -677,8 +794,22 @@
|
|||||||
let cron_weekday = $('#cron-drop-day').val();
|
let cron_weekday = $('#cron-drop-day').val();
|
||||||
let cron_hour = $('#timepicker').val();
|
let cron_hour = $('#timepicker').val();
|
||||||
let cron_base = $('#cron-drop-settings').val();
|
let cron_base = $('#cron-drop-settings').val();
|
||||||
|
let auto_clean_local = $("#auto_clean_local").is(':checked');
|
||||||
|
let auto_clean_backup = $("#auto_clean_backup").is(':checked');
|
||||||
|
let auto_clean_local_keep = $("#local-snap-keep").val();
|
||||||
|
let auto_clean_backup_keep = $("#backup-snap-keep").val();
|
||||||
loadingModal.open();
|
loadingModal.open();
|
||||||
$.post('./api/backup-settings', { cron_base: cron_base, cron_hour: cron_hour, cron_weekday: cron_weekday, cron_month_day: cron_month_day })
|
$.post('./api/backup-settings',
|
||||||
|
{
|
||||||
|
cron_base: cron_base,
|
||||||
|
cron_hour: cron_hour,
|
||||||
|
cron_weekday: cron_weekday,
|
||||||
|
cron_month_day: cron_month_day,
|
||||||
|
auto_clean_local: auto_clean_local,
|
||||||
|
auto_clean_local_keep: auto_clean_local_keep,
|
||||||
|
auto_clean_backup: auto_clean_backup,
|
||||||
|
auto_clean_backup_keep: auto_clean_backup_keep,
|
||||||
|
})
|
||||||
.done(() => {
|
.done(() => {
|
||||||
M.toast({ html: '<i class="material-icons" style="margin-right:10px">check_box</i> Backup settings saved !', classes: "green" });
|
M.toast({ html: '<i class="material-icons" style="margin-right:10px">check_box</i> Backup settings saved !', classes: "green" });
|
||||||
M.Modal.getInstance(document.querySelector('#modal-settings-backup')).close();
|
M.Modal.getInstance(document.querySelector('#modal-settings-backup')).close();
|
||||||
|
Loading…
Reference in New Issue
Block a user