Skip to content

aa.gusti / opensipkd-base

Go to a project
Commit a2c6ac1a by aa.gustiana@gmail.com
Options

Enhance form handling and response structure in BaseView and user login flow

1 parent c69c7bef
Inline Side-by-side
Showing 6 changed files with 119 additions and 81 deletions
opensipkd/base/views/base_views.py
......@@ -20,6 +20,7 @@ from opensipkd.tools.buttons import btn_save, btn_cancel, btn_close, btn_delete,
btn_pdf, btn_unpost, btn_post
from opensipkd.tools.captcha import get_captcha
from opensipkd.tools.report import csv_response, file_response
from pyramid.request import Response
from .common import DataTables
from .. import DBSession, get_params, get_urls
from ..scripts.initializedb import append_csv
......@@ -199,6 +200,18 @@ class BaseView(object):
'jenis'] or self.jenis
self.ses['jenis'] = self.jenis
def form2dict(self, field):
children = []
for c in field.children:
children.append(self.form2dict(c))
d = {
"id": field.oid,
"name": field.name,
"error" : {"msg": field.error and field.error.msg or ""},
"children":children
}
return d
def query_register(self, **kwargs):
pass
......@@ -546,6 +559,10 @@ class BaseView(object):
return self.route_list(**kwargs)
def returned_form(self, form, table=None, **kwargs):
if self.req.is_xhr:
d = self.form2dict(form.field)
return Response(json=d)
resources = form.get_widget_resources()
readonly = "readonly" in kwargs and kwargs["readonly"] or False
kwargs["readonly"] = readonly
......@@ -556,7 +573,17 @@ class BaseView(object):
table = table["form"]
# resources["js"] = list(resources["js"])
# resources["css"] = list(resources["css"])
if is_object:
if not is_object:
form = form.render(readonly=readonly)
# return dict(form=form,
# table=table and table.render() or None,
# scripts=self.form_scripts,
# css=resources["css"],
# js=resources["js"],
# **kwargs
# )
return dict(form=form,
table=table and table.render() or None,
scripts=self.form_scripts,
......@@ -565,13 +592,6 @@ class BaseView(object):
**kwargs
)
return dict(form=form.render(readonly=readonly),
table=table and table.render() or None,
scripts=self.form_scripts, css=resources["css"],
js=resources["js"],
**kwargs
)
def view_buttons(self, row):
result = (btn_close,)
return result
......
opensipkd/base/views/register.py
......@@ -312,7 +312,7 @@ class Registrasi(BaseView):
forget(self.req)
self.ses.delete()
@view_config(route_name='register', renderer='templates/form.pt')
# @view_config(route_name='register', renderer='templates/form.pt')
def view_register(self):
self.bindings = dict(user=None)
request = self.req
......
opensipkd/base/views/templates/login.pt
<!DOCTYPE html>
<html lang="en"
tal:define="home request._host;">
<html lang="en" tal:define="home request._host;">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
......@@ -31,20 +31,20 @@
</head>
<body>
<div id="content" class="container">
<div id="content" class="container">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-6 col-md-offset-3 col-lg-4 col-lg-offset-4" style="margin-top:50px">
<div class="well no-padding">
<form id="deform" method="POST" enctype="multipart/form-data" accept-charset="utf-8"
class="smart-form client-form panel form-signin" style="border:0px;">
<header class="bg-color-blue">
<h1 class="txt-color-white login-header-big" align="center"
style="letter-spacing:1px;">${request.app_name}</h1>
<h1 class="txt-color-white login-header-big" align="center" style="letter-spacing:1px;">
${request.app_name}</h1>
</header>
<fieldset class="deformFormFieldset">
<input type="hidden" name="_charset_"/>
<input type="hidden" name="__formid__" value="deform"/>
<input type="hidden" name="_charset_" />
<input type="hidden" name="__formid__" value="deform" />
<div tal:condition="request.session.peek_flash()">
<div class="alert alert-success" tal:repeat="message request.session.pop_flash()"><i
class="fa fa-fw fa-lg fa-check-circle"></i>&nbsp;${message}
......@@ -57,8 +57,8 @@
</div>
<div class="col-md-12" align="center">
<img src="${home}/static/img/logo.png"
class="img-float img-thumbnail" style="height:auto;width:auto;border:none;"/>
<img src="${home}/static/img/logo.png" class="img-float img-thumbnail"
style="height:auto;width:auto;border:none;" />
</div>
<div class="clearfix"></div>
......@@ -84,7 +84,7 @@
<label class=" checkbox checkbox-inline">
<input id="show_password" type="checkbox" style="left: 20px;">Show Password</label>
<div class="note">
<a href="${home}/reset-password" id="lupa" >Lupa Password?</a>
<a href="${home}/reset-password" id="lupa">Lupa Password?</a>
</div>
</div>
......@@ -103,13 +103,11 @@
<footer>
<section>
<div class="row" style="float:right">
<button type="submit" id="login-btn" name="login"
class="btn btn-primary" style="float:left"
<button type="submit" id="login-btn" name="login" class="btn btn-primary" style="float:left"
value="Login">
Login
</button>
<button tal:condition="allow_register(request)"
id="register" name="register" class="btn btn-info"
<button tal:condition="allow_register(request)" id="register" name="register" class="btn btn-info"
value="Register" style="float:left">
Register
</button>
......@@ -120,9 +118,7 @@
<footer>
<section>
<div class="row" tal:condition="request.google_signin_client_id and allow_register(request)">
<div id="g_id_onload"
data-client_id="${request.google_signin_client_id}"
data-callback="onSignIn">
<div id="g_id_onload" data-client_id="${request.google_signin_client_id}" data-callback="onSignIn">
</div>
<div class="g_id_signin" data-type="standard"></div>
</div>
......@@ -138,20 +134,20 @@
</div>
</div>
</div>
</div>
</div>
<!-- Bootstrap core JavaScript
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script type="text/javascript" src="${home}/deform_static/scripts/jquery-2.0.3.min.js"></script>
<script type="text/javascript" src="${home}/deform_static/scripts/bootstrap.min.js"></script>
<script type="text/javascript" src="${home}/deform_static/scripts/deform.js"></script>
<!--? <script tal:condition="request.google_signin_client_id"-->
<!--? src="https://apis.google.com/js/platform.js" async defer></script>-->
<script tal:condition="request.google_signin_client_id"
src="https://accounts.google.com/gsi/client" async defer></script>
<script tal:condition="request.google_signin_client_id">
<!-- Placed at the end of the document so the pages load faster -->
<script type="text/javascript" src="${home}/deform_static/scripts/jquery-2.0.3.min.js"></script>
<script type="text/javascript" src="${home}/deform_static/scripts/bootstrap.min.js"></script>
<script type="text/javascript" src="${home}/deform_static/scripts/deform.js"></script>
<!--? <script tal:condition="request.google_signin_client_id"-->
<!--? src="https://apis.google.com/js/platform.js" async defer></script>-->
<script tal:condition="request.google_signin_client_id" src="https://accounts.google.com/gsi/client" async
defer></script>
<script tal:condition="request.google_signin_client_id">
window.onload = function (e) {
const value = document.cookie;
const parts = value.split(`g_state=`);
......@@ -194,18 +190,19 @@
}
});
});
</script>
<script>
</script>
<script>
$(document).ready(function () {
$("#show_password").on("click", function () {
var x = $("#password");
if (x.attr("type") === "password") {
x.attr("type","text");
x.attr("type", "text");
} else {
x.attr("type","password");
x.attr("type", "password");
}
});
});
</script>
</script>
</body>
</html>
\ No newline at end of file
opensipkd/base/views/templates/xhr_form.pt 0 → 100644
<html metal:use-macro="load: ./base3.1.pt" tal:define="
scripts scripts|scripts;
readonly readonly|readonly;">
<div metal:fill-slot="content">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title"><i class="fa fa-fw fa-plus"></i>&nbsp;${request.title}</h3>
</div>
<div class="panel-body">
<div tal:content="structure form.render(readonly=readonly)"></div>
</div>
</div>
</div>
<div metal:fill-slot="scripts">
<script>
$(document).ready(function () {
// $(".read-only").attr("readonly", true);
$(".readonly").attr("readonly", true);
$(".date").attr("readonly", true);
// $(".date").datepicker({
// format: 'dd-mm-yyyy'
// });
${ structure: scripts }
});
</script>
<div metal:define-slot="scripts"></div>
</div>
</html>
\ No newline at end of file
opensipkd/base/views/user_login.py
......@@ -23,7 +23,7 @@ import os
import re
from datetime import timedelta, datetime
from importlib import import_module
from pyramid.request import Response
import colander
from deform import widget, Form, ValidationFailure, Button
from pyramid.csrf import new_csrf_token
......@@ -196,7 +196,12 @@ class ViewLogin(BaseView):
except ValidationFailure as e:
msg = 'Login gagal'
set_user_log(msg, request, log, identity)
if self.req.is_xhr:
d = self.form2dict(form.field)
return Response(json=d)
request.session.flash(msg, 'error')
return HTTPFound(location=get_urls(request.route_url('login')))
values = dict(c)
......
opensipkd/base/views/widgets/form.pt
<form
tal:define="style style|field.widget.style;
<form tal:define="style style|field.widget.style;
css_class css_class|string:${field.widget.css_class or field.css_class or ''};
item_template item_template|field.widget.item_template;
autocomplete autocomplete|field.autocomplete;
......@@ -11,25 +10,18 @@
ajax_options ajax_options|field.ajax_options;
formid formid|field.formid;
action action|field.action or None;
method method|field.method;"
tal:attributes="autocomplete autocomplete;
method method|field.method;" tal:attributes="autocomplete autocomplete;
style style;
class css_class;
action action;
attributes|field.widget.attributes|{};"
id="${formid}"
method="${method}"
enctype="multipart/form-data"
accept-charset="utf-8"
class="deform ${field.bootstrap_form_style | 'form-horizontal'}"
i18n:domain="deform"
>
attributes|field.widget.attributes|{};" id="${formid}" method="${method}" enctype="multipart/form-data"
accept-charset="utf-8" class="deform ${field.bootstrap_form_style | 'form-horizontal'}" i18n:domain="deform">
<fieldset class="deform-form-fieldset">
<div class="row">
<legend tal:condition="title">${title}</legend>
<input type="hidden" name="_charset_"/>
<input type="hidden" name="__formid__" value="${formid}"/>
<input type="hidden" name="_charset_" />
<input type="hidden" name="__formid__" value="${formid}" />
<div class="alert alert-danger" tal:condition="field.error">
<div class="error-msg-lbl" i18n:translate="">There was a problem with your submission</div>
<div class="error-msg-detail" i18n:translate="">Errors have been highlighted below</div>
......@@ -38,33 +30,23 @@
<p class="section first" tal:condition="description">
${description}
</p>
<div tal:repeat="child field"
tal:replace="structure child.render_template(item_template)"/>
<div tal:repeat="child field" tal:replace="structure child.render_template(item_template)" />
</div>
<div class="row">
<div class="form-group deform-form-buttons">
<tal:loop tal:repeat="button buttons">
<button
tal:define="btn_disposition repeat.button.start and 'btn-primary' or 'btn-default';"
<button tal:define="btn_disposition repeat.button.start and 'btn-primary' or 'btn-default';"
tal:attributes="disabled button.disabled if button.disabled else None;
attributes|button.attributes|{};"
id="${formid+button.name}"
name="${button.name}"
type="${button.type}"
class="btn ${button.css_class or btn_disposition}"
value="${button.value}"
attributes|button.attributes|{};" id="${formid+button.name}" name="${button.name}"
type="${button.type}" class="btn ${button.css_class or btn_disposition}" value="${button.value}"
tal:condition="button.type != 'link'">
<span tal:condition="button.icon" class="glyphicon glyphicon-${button.icon}"></span>
${button.title}
</button>
<a
tal:define="btn_disposition repeat.button.start and 'btn-primary' or 'btn-default';
btn_href button.value|''"
class="btn ${button.css_class or btn_disposition}"
id="${field.formid + button.name}"
href="${btn_href}"
tal:condition="button.type == 'link'">
<a tal:define="btn_disposition repeat.button.start and 'btn-primary' or 'btn-default';
btn_href button.value|''" class="btn ${button.css_class or btn_disposition}"
id="${field.formid + button.name}" href="${btn_href}" tal:condition="button.type == 'link'">
<span tal:condition="button.icon" class="glyphicon glyphicon-${button.icon}"></span>
${button.title}
</a>
......@@ -79,8 +61,9 @@
function (oid) {
var target = '#' + oid;
var options = {
target: target,
replaceTarget: true,
// target: target,
// replaceTarget: true,
replaceTarget: false,
success: function () {
deform.processCallbacks();
deform.focusFirstInput(target);
......@@ -97,11 +80,14 @@
}
}
};
var extra_options = ${ajax_options} ||
{
}
;
var extra_options = ${ ajax_options }|| {};
$('#' + oid).ajaxForm($.extend(options, extra_options));
// $('#' + oid).ajaxForm(
// function () {
// alert("test");
// }
// );
}
);
</script>
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!