1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-08-02 07:47:32 +00:00

modified registration pages, contact-add/edit, user-add

* modifed ui of all pages above
* add input field check before submit for forms
This commit is contained in:
llj 2012-05-22 16:21:16 +08:00
parent 80a17711d2
commit 207f236437
19 changed files with 251 additions and 164 deletions

View File

@ -3,20 +3,33 @@
{% block nav_contacts_class %}class="cur"{% endblock %}
{% block main_panel %}
<div class="w350 center">
<h3>添加联系人</h3>
<form action="{{ SITE_ROOT }}contacts/add/" method="post" class="contact-op-form">
<div class="narrow-panel">
<h3>添加联系人<a href="{{ SITE_ROOT }}contacts/list/" class="contact-list-link">(联系人列表)</a></h3>
<form action="{{ SITE_ROOT }}contacts/add/" method="post">
{{ form.user_email.as_hidden }}
<label>邮箱:</label>
{{ form.contact_email }}
<label>名字(可选)</label>
{{ form.contact_name }}
<label>备注(可选)</label>
{{ form.note }}
{% if error_msg %}
<p class="error">{{ error_msg }}</p>
{% endif %}
{{ form.user_email.as_hidden }}
<label>邮箱:</label>
{{ form.contact_email }}<br />
<label>名字(可选)</label>
{{ form.contact_name }}<br />
<label>备注(可选)</label>
{{ form.note }}<br />
<input type="submit" value="提交" class="submit" /> <a href="{{ SITE_ROOT }}contacts/list/">联系人列表</a>
<p class="error hide" id="error">请输入邮箱地址。</p>
<input type="submit" value="提交" />
</form>
</div>
{% endblock %}
{% block extra_script %}
<script type="text/javascript">
$('input[type="submit"]').click(function() {
if(!$.trim($('input[name="contact_email"]').attr('value'))) {
$('#error').removeClass('hide')
return false;
}
});
</script>
{% endblock %}

View File

@ -3,22 +3,22 @@
{% block nav_contacts_class %}class="cur"{% endblock %}
{% block main_panel %}
<div class="w350 center">
<h3>编辑联系人</h3>
<form action="" method="post" class="contact-op-form">
<div class="narrow-panel">
<h3>编辑联系人<a href="{{ SITE_ROOT }}contacts/list/" class="contact-list-link">(联系人列表)</a></h3>
<form action="" method="post">
{{ form.user_email.as_hidden }}
<label>邮箱:</label>
{{ form.contact_email }}
<label>名字(可选)</label>
{{ form.contact_name }}
<label>备注(可选)</label>
{{ form.note }}
<input type="hidden" name="contact_id" value="{{ contact_id }}" />
<input type="hidden" name="old_contact_email" value="{{ old_contact_email }}" />
{% if error_msg %}
<p class="error">{{ error_msg }}</p>
{% endif %}
{{ form.user_email.as_hidden }}
<label>邮箱:</label>
{{ form.contact_email }}<br />
<label>名字(可选)</label>
{{ form.contact_name }}<br />
<label>备注(可选)</label>
{{ form.note }}<br />
<input type="hidden" name="contact_id" value="{{ contact_id }}" />
<input type="hidden" name="old_contact_email" value="{{ old_contact_email }}" />
<input type="submit" value="提交" class="submit" /> <a href="{{ SITE_ROOT }}contacts/list/">联系人列表</a>
<input type="submit" value="提交" class="submit" />
</form>
</div>
{% endblock %}

View File

@ -32,6 +32,37 @@ img { border:none; }
h2 { font-size:18px; color:#808; margin:10px 0 8px; }
h3 { font-size:15px; color:#808; font-weight:normal; margin:10px 0 6px; }
ol { padding-left:2em; }
/* input button */
textarea { border: 1px solid #80B0B0; }
input {
height:20px;
line-height:20px;
margin:3px 0;
border: 1px solid #80B0B0;
}
input[type=checkbox] {
height:auto;
}
input[type=submit],
button {
color: #080;
height:23px;
padding:2px 3px;
background: #EEE;
border: 1px solid #80B0B0;
border-radius: 3px;
-moz-border-radius:3px;
margin-top:8px;
}
button {
margin:0;
}
input[type=submit]:hover,
button:hover {
cursor:pointer;
background: #FFF;
}
label { display: inline-block; margin:2px 0px; }
/* table */
table {
border-spacing: 0;
@ -49,12 +80,6 @@ tr.hl { background-color: #ddddff; }/*highlight*/
.odd th { background:#ddd; }
tr.first { background-color: #00FF00; }
.w350 {
width:350px;
}
.center {
margin:0 auto;
}
/* container */
#wrapper { font: 13px/1.5 Arial, Helvetica, sans-serif; }
#header, #main, #footer { width:950px; }
@ -105,58 +130,26 @@ tr.first { background-color: #00FF00; }
#main .avatar_op ul ul li { float:left; margin-right:5px; }
.avatar { float:left; width:120px; }
.ele_info { float:right; width:450px; }
/* input button */
textarea { border: 1px solid #80B0B0; }
input {
height:20px;
line-height:20px;
margin:2px 0;
border: 1px solid #80B0B0;
/*narrow-panel*/
.narrow-panel {
width:25em;
min-height:15em;
padding:2.5em;
background:#E9F1F4;
border-radius:4px;
-moz-border-radius:4px;
margin:5em auto 0;
}
input[type=checkbox] {
height:auto;
.narrow-panel h2,
.narrow-panel h3 {
margin-top:0;
}
input[type=submit],
button {
color: #080;
height:23px;
padding:2px 3px;
background: #EEE;
border: 1px solid #80B0B0;
border-radius: 3px;
-moz-border-radius:3px;
margin-top:5px;
}
button {
margin:0;
}
input[type=submit]:hover,
button:hover {
cursor:pointer;
background: #FFF;
}
label { display: inline-block; margin:2px 0px; }
#user-add-form label,
.reg label,
.pwd_change label {
width:5em;
text-align:right;
}
#user-add-form .submit,
.reg .submit {
margin-left:5em;
}
.login .submit {
margin-left:3em;
}
.login .error {
margin:3px 0 0 3em;
}
.pwd_change label {
width:6em;
}
.pwd_change .submit {
margin-left:6em;
.narrow-panel input[type="text"],
.narrow-panel input[type="password"] {
width:96%;
height:1.8em;
margin:0 0 0.6em;
}
/* popup dialog */
#basic-modal-content {display:none;}
@ -235,12 +228,11 @@ label { display: inline-block; margin:2px 0px; }
height:80px;
}
/*contact*/
.contact-op-form label {
width:6em;
text-align:right;
.contact-list-link {
font-size:13px;
}
.contact-op-form .submit {
margin-left:6em;
.contact-list-link:hover {
text-decoration:none;
}
/* group */
.group-member-icon {

View File

@ -2,21 +2,45 @@
{% block title %}添加用户{% endblock %}
{% block nav_useradmin_class %}class="cur"{% endblock %}
{% block main_panel %}
<div class="narrow-panel">
<h3>添加用户</h3>
<form action="" method="post" id="user-add-form">
<form action="" method="post">
<label for="id_email">邮箱:</label>
{{ form.email }}
{% if form.email.errors %}
{{ form.email.errors }}
{% endif %}<br />
<label for="id_password1">密码:</label>
{{ form.password1 }}
{% if form.password1.errors %}
{{ form.password1.errors }}
{% endif %}<br />
<label for="id_password2">确认密码:</label>
{{ form.password2 }}<br />
<input type="submit" value="提交" class="submit" />
{{ form.password2 }}
{{ form.email.errors }}
{{ form.password1.errors }}
{{ form.password2.errors }}
<p class="error hide" id="error"></p>
<input type="submit" value="提交" />
</form>
</div>
{% endblock %}
{% block extra_script %}
<script type="text/javascript">
$('input[type="submit"]').click(function() {
if (!$.trim($('input[name="email"]').attr('value'))) {
$('#error').html('请输入邮箱。').removeClass('hide');
return false;
}
if (!$.trim($('input[name="password1"]').attr('value'))) {
$('#error').html('请输入密码。').removeClass('hide');
return false;
}
if (!$.trim($('input[name="password2"]').attr('value'))) {
$('#error').html('请确认密码。').removeClass('hide');
return false;
}
if ($.trim($('input[name="password1"]').attr('value')) != $.trim($('input[name="password2"]').attr('value'))) {
$('#error').html('两次输入的密码不一致。').removeClass('hide');
return false;
}
});
</script>
{% endblock %}

View File

@ -1,7 +1,9 @@
{% extends "myhome_base.html" %}
{% block title %}Create an account{% endblock %}
{% block title %}激活码错误{% endblock %}
{% block main_panel %}
<p class="error w350 center">激活码错误。</p>
<div class="narrow-panel">
<p class="error">激活码错误。</p>
</div>
{% endblock %}

View File

@ -3,6 +3,8 @@
{% block title %}帐号已激活{% endblock %}
{% block main_panel %}
<p class="w350 center">你的帐号已经激活。 <a href="{{ SITE_ROOT }}accounts/login/">登录</a></p>
<div class="narrow-panel">
<p>你的帐号已经激活。 <a href="{{ SITE_ROOT }}accounts/login/">登录</a></p>
</div >
{% endblock %}

View File

@ -1 +1 @@
请激活你的帐号,完成注册
请激活您的帐号,完成注册。

View File

@ -1,15 +1,15 @@
{% extends "myhome_base.html" %}
{% block title %}用户登录{% endblock %}
{% block title %}登录{% endblock %}
{% block main_panel %}
<div class="w350 center">
<h2>用户登录</h2>
<form action="" method="post" class="login">
<div class="narrow-panel">
<h2>登录</h2>
<form action="" method="post">
<label for="username">邮箱:</label>
<input type="text" name="username" value="" style="color:#666;" autocomplete="off" /><br />
<input type="text" name="username" value="" autocomplete="off" />
<label for="password">密码:</label>
<input type="password" name="password" value="" autocomplete="off" /><br />
<input type="password" name="password" value="" autocomplete="off" />
<p class="error hide"></p>
<input type="submit" value="提交" class="submit" />
<input type="submit" value="提交" />
<a href="{{ SITE_ROOT }}accounts/password/reset/">忘记密码?</a>
{% if next %}
<input type="hidden" name="next" value="{{ next|escape }}" />
@ -19,16 +19,12 @@
</form>
</div>
{% endblock %}
{% block extra_script %}
<script type="text/javascript">
var Username_default = $.trim($('input[name="username"]').attr('value'));
$('input[name="username"]').click(function(){
$(this).attr('value','');
$(this).removeAttr('style');
});
$('input[type="submit"]').click(function(){
if ($.trim($('input[name="username"]').attr('value')) == Username_default || !$.trim($('input[name="username"]').attr('value'))) {
$('.error').removeClass('hide').html('请输入帐号。');
if (!$.trim($('input[name="username"]').attr('value'))) {
$('.error').removeClass('hide').html('请输入邮箱。');
return false;
}
if (!$.trim($('input[name="password"]').attr('value'))) {
@ -37,8 +33,7 @@ $('input[type="submit"]').click(function(){
}
});
{% if form.errors %}
$('.error').removeClass('hide').html('您输入的帐号或密码不正确');
$('.error').removeClass('hide').html('您输入的邮箱或密码不正确');
{% endif %}
</script>
{% endblock %}

View File

@ -3,7 +3,7 @@
{% block title %}退出{% endblock %}
{% block main_panel %}
<div class="w350 center">
<div class="narrow-panel">
<p>感谢参与。</p>
<a href="{{ SITE_ROOT }}accounts/login/">重新登录</a>
</div>

View File

@ -1,9 +1,11 @@
{% extends "accounts.html" %}
{% block title %}{% trans 'Password change successful' %}{% endblock %}
{% block title %}密码修改成功{% endblock %}
{% block main_panel %}
<p class="w350 center">您的密码已成功修改。</p>
<div class="narrow-panel">
<p>您的密码已成功修改。</p>
</div>
{% endblock %}

View File

@ -2,16 +2,45 @@
{% block title %}密码修改{% endblock %}
{% block main_panel %}
<div class="w350 center">
<div class="narrow-panel">
<h2>密码修改</h2>
<form action="" method="post" class="pwd_change">
<label for="id_old_password">当前密码:</label>{{ form.old_password }}<br />
<form action="" method="post">
<label for="id_old_password">当前密码:</label>
{{ form.old_password }}
<label for="id_new_password1">新密码:</label>
{{ form.new_password1 }}
<label for="id_new_password2">新密码确认:</label>
{{ form.new_password2 }}
{{ form.old_password.errors }}
<label for="id_new_password1">新密码:</label>{{ form.new_password1 }}<br />
{{ form.new_password1.errors }}
<label for="id_new_password2">新密码确认:</label>{{ form.new_password2 }}<br />
{{ form.new_password2.errors }}
<input type="submit" value="提交" class="submit" />
<p class="error hide"></p>
<input type="submit" value="提交" />
</form>
</div>
{% endblock %}
{% block extra_script %}
<script type="text/javascript">
$('input[type="submit"]').click(function(){
if (!$.trim($('input[name="old_password"]').attr('value'))) {
$('.error').removeClass('hide').html('请输入当前密码。');
return false;
}
if (!$.trim($('input[name="new_password1"]').attr('value'))) {
$('.error').removeClass('hide').html('请输入新密码。');
return false;
}
if (!$.trim($('input[name="new_password2"]').attr('value'))) {
$('.error').removeClass('hide').html('请确认新密码。');
return false;
}
if ($.trim($('input[name="new_password1"]').attr('value')) != $.trim($('input[name="new_password2"]').attr('value'))) {
$('.error').removeClass('hide').html('两次输入的新密码不一致。');
return false;
}
});
</script>
{% endblock %}

View File

@ -3,5 +3,7 @@
{% block title %}密码重置成功{% endblock %}
{% block main_panel %}
<p class="w350 center">密码重置成功。 <a href="{{ login_url }}">登录</a></p>
<div class="narrow-panel">
<p>密码重置成功。 <a href="{{ login_url }}">登录</a></p>
</div>
{% endblock %}

View File

@ -3,17 +3,18 @@
{% block title %}密码重置{% endblock %}
{% block main_panel %}
<div class="w350 center">
<div class="narrow-panel">
{% if validlink %}
<h2>请输入新密码</h2>
<form action="" method="post">
<label for="id_new_password1">新密码:</label>
{{ form.new_password1 }}
{{ form.new_password1.errors }}
<p class="aligned wide"><label for="id_new_password1">新密码:</label>{{ form.new_password1 }}</p>
<label for="id_new_password2">新密码确认:</label>
{{ form.new_password2 }}
{{ form.new_password2.errors }}
<p class="aligned wide"><label for="id_new_password2">密码确认:</label>{{ form.new_password2 }}</p>
<p><input type="submit" value="提交" /></p>
<input type="submit" value="提交" />
</form>
{% else %}

View File

@ -4,6 +4,6 @@
{% block main_panel %}
<p class="w350 center">我们已经把密码重置说明发往您提交的邮箱里,请查收。</p>
<p class="narrow-panel">我们已经把密码重置说明发往您提交的邮箱里,请查收。</p>
{% endblock %}

View File

@ -2,12 +2,14 @@
{% block title %}密码重置{% endblock %}
{% block main_panel %}
<div class="w350 center">
<h2>密码重置</h2>
<form action="" method="post">
<label for="id_email">邮箱:</label> {{ form.email }} <input type="submit" value="提交" />
<p>[我们会把新密码设置说明通过邮件发送给您]</p>
{{ form.email.errors }}
</form>
<div class="narrow-panel">
<h2>密码重置</h2>
<form action="" method="post">
<label for="id_email">邮箱:</label>
<span>(我们会把新密码设置说明通过邮件发送给您)</span>
{{ form.email }}
{{ form.email.errors }}
<input type="submit" value="提交" />
</form>
</div>
{% endblock %}

View File

@ -3,6 +3,8 @@
{% block title %}Create an account{% endblock %}
{% block main_panel %}
<p class="w350 center">注册关闭。</p>
<div class="narrow-panel">
<p>注册关闭。</p>
</div>
{% endblock %}

View File

@ -1,7 +1,7 @@
{% extends "myhome_base.html" %}
{% block title %}感谢注册{% endblock %}
{% block main_panel %}
<div class="w350 center">
<div class="narrow-panel">
{% if send_mail %}
<p>感谢注册,激活邮件已发往您的邮箱,请查收。</P>
<p>如果您在收件箱里没找到,请检查下是否被当成垃圾邮件了。</p>

View File

@ -1,23 +1,43 @@
{% extends "myhome_base.html" %}
{% block title %}用户注册{% endblock %}
{% block title %}注册{% endblock %}
{% block main_panel %}
<div class="w350 center">
<h2>用户注册</h2>
<form action="" method="post" class="reg">
<div class="narrow-panel">
<h2>注册</h2>
<form action="" method="post">
<label for="id_email">邮箱:</label>
{{ form.email }}
{% if form.email.errors %}
{{ form.email.errors }}
{% endif %}<br />
<label for="id_password1">密码:</label>
{{ form.password1 }}
{% if form.password1.errors %}
{{ form.password1.errors }}
{% endif %}<br />
<label for="id_password2">确认密码:</label>
{{ form.password2 }}<br />
<input type="submit" value="提交" class="submit" />
{{ form.password2 }}
<p class="error hide"></p>
{{ form.email.errors }}
{{ form.password1.errors }}
{{ form.password2.errors }}
<input type="submit" value="提交" />
</form>
</div>
{% endblock %}
{% block extra_script %}
<script type="text/javascript">
$('input[type="submit"]').click(function(){
if (!$.trim($('input[name="email"]').attr('value'))) {
$('.error').removeClass('hide').html('请输入邮箱。');
return false;
}
if (!$.trim($('input[name="password1"]').attr('value'))) {
$('.error').removeClass('hide').html('请输入密码。');
return false;
}
if (!$.trim($('input[name="password2"]').attr('value'))) {
$('.error').removeClass('hide').html('请确认密码。');
return false;
}
if ($.trim($('input[name="password1"]').attr('value')) != $.trim($('input[name="password2"]').attr('value'))) {
$('.error').removeClass('hide').html('两次输入的密码不一致。');
return false;
}
});
</script>
{% endblock %}

View File

@ -48,19 +48,20 @@
{% block extra_script %}
<script type="text/javascript">
$('.activate').each(function(){
$(this).click(function(){
location.href = $(this).attr('data');
});
$('.activate').each(function(){
$(this).click(function(){
location.href = $(this).attr('data');
});
});
$(".add-role-btn").each(function() {
$(this).click(function() {
var url = "{{ SITE_ROOT }}useradmin/" + $(this).attr("userid") + "/role/add/";
$("#add-role-form").attr('action', url);
$("#user_email").html($(this).attr("email"));
$("#add-role-form").modal({appendTo: "#main"});
});
});
$(this).click(function() {
var url = "{{ SITE_ROOT }}useradmin/" + $(this).attr("userid") + "/role/add/";
$("#add-role-form").attr('action', url);
$("#user_email").html($(this).attr("email"));
$("#add-role-form").modal({appendTo: "#main"});
});
});
//delete confirm
addConfirmTo($('.remove-user-btn'));
addConfirmTo($('.role-delete-btn'));