Skip to content

Commit

Permalink
WIP
Browse files Browse the repository at this point in the history
  • Loading branch information
@moogoo78
moogoo78 committed Jul 7, 2024
1 parent b520d92 commit dc98030
Show file tree
Hide file tree
Showing 6 changed files with 257 additions and 17 deletions.
3 changes: 1 addition & 2 deletions app/blueprints/admin.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -917,15 +917,14 @@ def export_data():
export_specimen_dwc_csv()
return ''

@admin.route('/collections/<int:collection_id>/options')
@admin.route('/api/collections/<int:collection_id>/options')
@jwt_required()
def api_get_collection_options(collection_id):
if collection := session.get(Collection, collection_id):

uid = request.args.get('uid')
data = get_all_options(collection)
uid = get_jwt_identity()
print(uid, flush=True)
if user := session.get(User, uid):
data['current_user'] = {
'uid': uid,
Expand Down
7 changes: 7 additions & 0 deletions app/blueprints/admin_static/common.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,4 +32,11 @@
});
});

let logoutLink = document.getElementById('logout-link');
logoutLink.onclick = (e) => {
e.preventDefault();
localStorage.removeItem('jwt');
window.location.replace('/admin/logout');
};

})();
43 changes: 43 additions & 0 deletions app/static/js/login.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
(function() {
'use strict';

let form = document.getElementById('login-form');
let loginSubmitButton = document.getElementById('login-submit-button');
let loginErrorMsg = document.getElementById('login-error-msg');
let loginErrorMsgContent = document.getElementById('login-error-msg-content');

async function login() {
let formData = new FormData(form);
let myHeaders = new Headers();
myHeaders.append('Content-Type', 'application/json');
const response = await fetch('/admin/login', {
method: 'post',
body: JSON.stringify({
username: formData.get('username'),
passwd: formData.get('passwd')
}),
headers: myHeaders,
});
const result = await response.json();
if (response.status === 401 && result.msg) {
loginErrorMsg?.removeAttribute('hidden');
loginErrorMsgContent.textContent = result.msg;
} else {
localStorage.setItem('jwt', result.access_token);
window.location.replace("/admin");
}
};

form.addEventListener('keyup', function (e) {
if (e.key === 'Enter' || e.keyCode === 13) {
login();
}
});

loginSubmitButton.onclick = (e) => {
e.preventDefault();
login();
};


})();
6 changes: 3 additions & 3 deletions app/templates/admin/base.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
<nav class="uk-navbar uk-light" data-uk-navbar="mode:click; duration: 250">
<div class="uk-navbar-left">
<div class="uk-navbar-item uk-visible@m">
<a href="{{ url_for('admin.index' ) }}">{{ current_user.site.name|upper }}</a>{#<a class="uk-logo" href="#"><img class="custom-logo" src="img/dashboard-logo-white.svg" alt=""></a>#}
<a href="{{ url_for('admin.index' ) }}">{{ current_user.site.title }}</a>{#<a class="uk-logo" href="#"><img class="custom-logo" src="img/dashboard-logo-white.svg" alt=""></a>#}
</div>
<ul class="uk-navbar-nav uk-visible@m">
<li>
Expand All @@ -41,15 +41,15 @@
<div class="uk-navbar-right">
<ul class="uk-navbar-nav">
<li><a href="#" data-uk-icon="icon:user" title="Your profile" data-uk-tooltip>{{ current_user.username }}</a></li>
<li><a href="{{ url_for('admin.logout') }}" data-uk-icon="icon: sign-out" title="Sign Out" data-uk-tooltip></a></li>
<li><a href="#" data-uk-icon="icon: sign-out" title="Sign Out" id="logout-link" data-uk-tooltip></a></li>
</ul>
</div>
</nav>
</div>
</header>
<aside id="left-col" class="uk-light uk-visible@m">
<div class="left-logo uk-flex uk-flex-middle">
{#<img class="custom-logo" src="img/dashboard-logo.svg" alt="">#}{{ current_user.site.title }}
{#<img class="custom-logo" src="img/dashboard-logo.svg" alt="">#}{{ current_user.site.name|upper }} Dashboard
</div>
{#
<div class="left-content-box content-box-dark">
Expand Down
85 changes: 85 additions & 0 deletions app/templates/admin/login.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,85 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{{ site.title }}::login</title>
{#<link rel="icon" href="img/favicon.ico">#}
<!-- CSS FILES -->
<link rel="stylesheet" href="{{ url_for('static', filename='css/uikit.min.css')}} " />
</head>
<body class="uk-flex uk-flex-center uk-flex-middle uk-background-muted uk-height-viewport" data-uk-height-viewport>
<div class="uk-position-bottom-center uk-position-small uk-visible@m uk-position-z-index">
<span class="uk-text-small uk-text-muted">© 2023 naturedb</span>
</div>
<div class="uk-width-medium uk-padding-small">
<!-- login -->
<h3>{{ site.name.upper() }} Login</h3>
{% with messages = get_flashed_messages() %}
{% if messages %}
{% for message in messages %}
<div class="uk-alert-danger" uk-alert>
<a class="uk-alert-close" uk-close></a>
<p>{{ message }}</p>
</div>
{% endfor %}
{% endif %}
{% endwith %}
<div class="uk-alert-danger" id="login-error-msg" uk-alert hidden>
<a class="uk-alert-close" uk-close></a>
<p id="login-error-msg-content"></p>
</div>
<form class="toggle-class" {#action="{{ url_for('admin.login') }}" method="POST"#} id="login-form">
<fieldset class="uk-fieldset">
<div class="uk-margin-small">
<div class="uk-inline uk-width-1-1">
<span class="uk-form-icon uk-form-icon-flip" data-uk-icon="icon: user"></span>
<input class="uk-input uk-border-pill" required placeholder="Username" type="text" name="username">
</div>
</div>
<div class="uk-margin-small">
<div class="uk-inline uk-width-1-1">
<span class="uk-form-icon uk-form-icon-flip" data-uk-icon="icon: lock"></span>
<input class="uk-input uk-border-pill" required placeholder="Password" type="password" name="passwd">
</div>
</div>
{#<div class="uk-margin-small">
<label><input class="uk-checkbox" type="checkbox"> Keep me logged in</label>
</div>#}
<div class="uk-margin-bottom">
<button type="button" class="uk-button uk-button-primary uk-border-pill uk-width-1-1" id="login-submit-button">LOG IN</button>
</div>
</fieldset>
</form>
<!-- /login -->

<!-- recover password -->
<form class="toggle-class" action="login-dark.html" hidden>
<div class="uk-margin-small">
<div class="uk-inline uk-width-1-1">
<span class="uk-form-icon uk-form-icon-flip" data-uk-icon="icon: mail"></span>
<input class="uk-input uk-border-pill" placeholder="E-mail" required type="text">
</div>
</div>
<div class="uk-margin-bottom">
<button type="submit" class="uk-button uk-button-primary uk-border-pill uk-width-1-1">SEND PASSWORD</button>
</div>
</form>
<!-- /recover password -->

<!-- action buttons -->
<div>
<div class="uk-text-center">
<a class="uk-link-reset uk-text-small toggle-class" data-uk-toggle="target: .toggle-class ;animation: uk-animation-fade">Forgot your password?</a>
<a class="uk-link-reset uk-text-small toggle-class" data-uk-toggle="target: .toggle-class ;animation: uk-animation-fade" hidden><span data-uk-icon="arrow-left"></span> Back to Login</a>
</div>
</div>
<!-- action buttons -->
</div>

<!-- JS FILES -->
<script src="{{ url_for('static', filename='js/uikit.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/uikit-icons.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/login.js') }}"></script>
</body>
</html>
130 changes: 118 additions & 12 deletions app/templates/sites/ppi/admin/record-form-view.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,93 @@

{% block script %}
<script>
// const myHeaders = new Headers();
// myHeaders.append('Authorization', `Bearer ${localStorage.getItem('jwt')}`);
// fetch('/admin/collections/1/options', myHeaders)
console.log('eouao');
(function() {
'use strict';

let formElem = document.getElementById('record-form');
let submitButton = document.getElementById('submit-button');
let comboboxInputs = document.getElementsByClassName('combobox-input');

for (let i=0;i<comboboxInputs.length;i++) {
comboboxInputs[i].addEventListener("input", (e) => {
console.log(e.target.dataset.name, e.target.value);
});
}

submitButton.onclick = (e) => {
e.preventDefault();

let formData = new FormData(formElem);
for (const pair of formData.entries()) {
console.log(pair[0], pair[1]);
}
}
function init() {
const options = {
method: 'get',
headers: {
Authorization: `Bearer ${localStorage.getItem('jwt')}`,
}
};
fetch('/admin/api/collections/1/options', options)
.then( resp => resp.json())
.then(result => {

});
}
init();
})();
</script>
{% endblock %}

{% block style %}
<style>
.combobox-container {
width: 100%;
}
.combobox-input-container {
margin-top: 0px;
display: block/*none*/;
}
.combobox-input-container input {
background-color: #eee;
/*border-radius:10px 10px 0px 0px;*/
}
.combobox-items-list {
position: relative;
margin: 0;
padding: 0;
top: 0;
width: 100%;
border: 1px solid #ddd;
background-color: #ddd;
max-height: 340px;
overflow-y: scroll;
}
li.combobox-items {
list-style: none;
/*border-bottom: 1px solid #d4d4d4;*/
z-index: 99;
/*position the autocomplete items to be the same width as the container:*/
top: 100%;
left: 0;
right: 0;
padding: 6px;
cursor: pointer;
background-color: #fff;
}
li.combobox-items:hover {
/*when hovering an item:*/
background-color: #eee;
}

li.combobox-items.active {
color: blue;
background-color: #eee;
}
</style>
{% endblock %}

{% macro widget(name, label, value='', width='1-4@s', type='input') -%}
<div class="uk-width-{{ width }}">
<div class="uk-margin">
Expand All @@ -20,25 +100,51 @@
<input class="uk-input" id="{{ name }}-id" type="date" name={{ name }}>
{% elif type == "textarea" %}
<textarea name={{ name }} class="uk-textarea">{{ value }}</textarea>
{% elif type == "combobox" %}
<div class="combox-container">
<div class="uk-inline uk-width">
<a class="uk-form-icon uk-form-icon-flip" uk-icon="icon: chevron-up"></a>
<input class="uk-input uk-form-small" type="text" placeholder="-- 選擇 --" readonly />
</div>
<div class="uk-inline combobox-input-container">
<span class="uk-form-icon" uk-icon="icon: search"></span>
<input class="uk-input uk-form-small combobox-input" id="{{ name }}-input" data-name="{{ name}}" />
</div>
<ul class="combobox-items-list" id="{{ name }}-list-container">
<li class="combobox-items"></li>
</ul>
</div>
{% endif %}
</div>
</div>
</div>
{%- endmacro %}

{% block main %}
aoeuao
<form class="uk-grid-small" uk-grid>
{{ widget('collector', '採集者', '', '1-4@s') }}
{{ widget('field_number', '採集號', '', '1-4@s') }}
{{ widget('collect_date', '採集日期', '', '1-4@s', 'input-date') }}
{{ widget('verbatim_collect_date', '[逐字]採集日期', '', '1-4@s') }}

<form class="uk-grid-small" id="record-form" uk-grid>
<div class="uk-width-1-1">
<h3 class="uk-heading-bullet">採集資訊</h3>
</div>
{{ widget('collector', '採集者', '', '1-4@s', 'combobox') }}
{{ widget('verbatim_collector', '[逐字]採集者', '', '1-4@s') }}
{{ widget('collect_date', '採集日期', '', '1-4@s', 'input-date') }}
{{ widget('verbatim_collect_date', '[逐字]採集日期', '', '1-4@s') }}
{{ widget('field_number', '採集號', '', '1-4@s') }}
{{ widget('verbatim_locality', '採集地點(文字)', '', '1-1@s', 'textarea') }}
{{ widget('verbatim_taxon', '[逐字]學名/中文名', '', '1-1@s') }}
<div class="uk-width-1-1">
<h3 class="uk-heading-bullet">鑑定</h3>
</div>
{{ widget('taxon', '學名/中文名', '', '1-2@s', 'combobox') }}
{{ widget('verbatim_taxon', '[逐字]學名/中文名', '', '1-2@s') }}
{{ widget('identificator', '鑑定者', '', '1-4@s') }}
<div class="uk-width-1-1">
<h3 class="uk-heading-bullet">標本</h3>
</div>
{{ widget('accession_number', '館號', '') }}
{{ widget('identificator', '鑑定者', '') }}
{{ widget('annotation_exchange', '是否交換', '') }}
<div class="uk-width-1-1">
<button class="uk-button uk-button-primary" id="submit-button">送出</button>
</div>
</form>
{% endblock %}

0 comments on commit dc98030

Please sign in to comment.