|
|
|
@ -6,7 +6,7 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
{% block head %}
|
|
|
|
|
{{ super() }}
|
|
|
|
|
{{ super() }}
|
|
|
|
|
<!-- Custom styles for this template -->
|
|
|
|
|
<link href="{{ url_for('static',filename='profile.css') }}" rel="stylesheet">
|
|
|
|
|
|
|
|
|
@ -17,101 +17,124 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="container">
|
|
|
|
|
<div class="bg-profile" style="height: 280px">
|
|
|
|
|
</div>
|
|
|
|
|
<div class="container col-sm-12 info" style="height: 400px">
|
|
|
|
|
|
|
|
|
|
<div class="col-sm-4 photo-box">
|
|
|
|
|
|
|
|
|
|
{# 头像显示#}
|
|
|
|
|
<div class="photo" style="margin: 65px 80px 5px 80px">
|
|
|
|
|
{% if current_user.avatar_img %}
|
|
|
|
|
<img class="img-rounded profile-thumbnail" src="{{ current_user.avatar_img }}" alt="avatar" style="width: 150px; height: 150px">
|
|
|
|
|
{% else %}
|
|
|
|
|
<img class="img-rounded profile-thumbnail" src="{{ current_user.gravatar(size=150) }}" alt="avatar">
|
|
|
|
|
{% endif %}
|
|
|
|
|
<div class="container">
|
|
|
|
|
<div class="bg-profile" style="height: 280px">
|
|
|
|
|
</div>
|
|
|
|
|
<div class="container col-sm-12 info" style="height: 400px">
|
|
|
|
|
|
|
|
|
|
<div class="col-sm-4 photo-box">
|
|
|
|
|
|
|
|
|
|
{# 头像显示#}
|
|
|
|
|
<div class="photo" style="margin: 65px 80px 5px 80px">
|
|
|
|
|
{% if current_user.avatar_img %}
|
|
|
|
|
<img id="upload_image_perivew" class="img-rounded profile-thumbnail"
|
|
|
|
|
src="{{ current_user.avatar_img }}" alt="avatar" style="width: 150px; height: 150px">
|
|
|
|
|
{% else %}
|
|
|
|
|
<img class="img-rounded profile-thumbnail" src="{{ current_user.gravatar(size=150) }}"
|
|
|
|
|
alt="avatar">
|
|
|
|
|
{% endif %}
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
{# 更改头像的按钮#}
|
|
|
|
|
<div class="col-sm-8" style="margin: 0px 45px ">
|
|
|
|
|
<form action="{{ url_for('.uploadPhoto') }}" method="post" enctype="multipart/form-data">
|
|
|
|
|
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
|
|
|
|
|
<a href="javascript:;" class="file btn btn-warning" style="margin: 3px 10px">Change Avatar
|
|
|
|
|
{{ form.photo }}
|
|
|
|
|
</a>
|
|
|
|
|
<button type="submit" class="form-control btn btn-warning" style="margin-top: 3px">Save Avatar Change</button>
|
|
|
|
|
</form>
|
|
|
|
|
</div>
|
|
|
|
|
{# 更改头像的按钮#}
|
|
|
|
|
<div class="col-sm-8" style="margin: 0px 45px ">
|
|
|
|
|
<form action="{{ url_for('.uploadPhoto') }}" method="post" enctype="multipart/form-data">
|
|
|
|
|
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
|
|
|
|
|
<a href="javascript:;" class="file btn btn-warning" style="margin: 3px 10px">Change Avatar
|
|
|
|
|
{{ form.photo(id="chooseImage") }}
|
|
|
|
|
</a>
|
|
|
|
|
<button type="submit" class="form-control btn btn-warning"
|
|
|
|
|
style="margin-top: 3px">Save Avatar Change
|
|
|
|
|
</button>
|
|
|
|
|
</form>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="col-sm-6" style="margin-top: 25px">
|
|
|
|
|
<form class="form-horizontal" method="post">
|
|
|
|
|
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
|
|
|
|
|
<div class="form-group" style="margin-top: 15px; ">
|
|
|
|
|
<label for="username" class="col-sm-3 control-label text-left">User name</label>
|
|
|
|
|
<div class="col-sm-9">
|
|
|
|
|
<input value="{{ current_user.username }}" name="username" type="text" class="form-control" id="username">
|
|
|
|
|
<div class="col-sm-6" style="margin-top: 25px">
|
|
|
|
|
<form class="form-horizontal" method="post">
|
|
|
|
|
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
|
|
|
|
|
<div class="form-group" style="margin-top: 15px; ">
|
|
|
|
|
<label for="username" class="col-sm-3 control-label text-left">User name</label>
|
|
|
|
|
<div class="col-sm-9">
|
|
|
|
|
<input value="{{ current_user.username }}" name="username" type="text" class="form-control"
|
|
|
|
|
id="username">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
<label class="col-sm-3 control-label text-left">E-mail</label>
|
|
|
|
|
<div class="col-sm-9" style="margin-top: 5px;">
|
|
|
|
|
<p>{{ current_user.email }}</p>
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
<label class="col-sm-3 control-label text-left">E-mail</label>
|
|
|
|
|
<div class="col-sm-9" style="margin-top: 5px;">
|
|
|
|
|
<p>{{ current_user.email }}</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
<label for="grade" class="col-sm-3 control-label text-left">Grade</label>
|
|
|
|
|
<div class="col-sm-9">
|
|
|
|
|
<select name="grade" class="form-control" id="grade">
|
|
|
|
|
<option selected="selected" value="{{ current_user.grade }}"></option>
|
|
|
|
|
<option>Freshman</option>
|
|
|
|
|
<option>Sophomore</option>
|
|
|
|
|
<option>Junior</option>
|
|
|
|
|
<option>Senior</option>
|
|
|
|
|
<option>Postgraduate</option>
|
|
|
|
|
<option>PHD.</option>
|
|
|
|
|
</select>
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
<label for="grade" class="col-sm-3 control-label text-left">Grade</label>
|
|
|
|
|
<div class="col-sm-9">
|
|
|
|
|
<select name="grade" class="form-control" id="grade">
|
|
|
|
|
<option selected="selected" value="{{ current_user.grade }}"></option>
|
|
|
|
|
<option>Freshman</option>
|
|
|
|
|
<option>Sophomore</option>
|
|
|
|
|
<option>Junior</option>
|
|
|
|
|
<option>Senior</option>
|
|
|
|
|
<option>Postgraduate</option>
|
|
|
|
|
<option>PHD.</option>
|
|
|
|
|
</select>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
<label for="collage" class="col-sm-3 control-label text-left">Collage</label>
|
|
|
|
|
<div class="col-sm-9">
|
|
|
|
|
<select name="collage" class="form-control" id="collage">
|
|
|
|
|
<option selected="selected" value="{{ current_user.college }}"></option>
|
|
|
|
|
<option>Beijing-Dublin International Collage</option>
|
|
|
|
|
<option>Fan Gongxiu Honor Collage</option>
|
|
|
|
|
<option>Environmental and Energy Engineering Collage</option>
|
|
|
|
|
<option>Economics and Management Collage</option>
|
|
|
|
|
<option>Humanities Department</option>
|
|
|
|
|
<option>Art Design Collage</option>
|
|
|
|
|
<option>Architecture and Urban Planning Collage</option>
|
|
|
|
|
<option>Architecture and Engineering Collage</option>
|
|
|
|
|
<option>Applied Mathematics Collage</option>
|
|
|
|
|
<option>Informatics Department</option>
|
|
|
|
|
<option>Mechanical Engineering and Applied Electronics Technology Collage</option>
|
|
|
|
|
<option>Life Science and Bioengineering Collage</option>
|
|
|
|
|
</select>
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
<label for="collage" class="col-sm-3 control-label text-left">Collage</label>
|
|
|
|
|
<div class="col-sm-9">
|
|
|
|
|
<select name="collage" class="form-control" id="collage">
|
|
|
|
|
<option selected="selected" value="{{ current_user.college }}"></option>
|
|
|
|
|
<option>Beijing-Dublin International Collage</option>
|
|
|
|
|
<option>Fan Gongxiu Honor Collage</option>
|
|
|
|
|
<option>Environmental and Energy Engineering Collage</option>
|
|
|
|
|
<option>Economics and Management Collage</option>
|
|
|
|
|
<option>Humanities Department</option>
|
|
|
|
|
<option>Art Design Collage</option>
|
|
|
|
|
<option>Architecture and Urban Planning Collage</option>
|
|
|
|
|
<option>Architecture and Engineering Collage</option>
|
|
|
|
|
<option>Applied Mathematics Collage</option>
|
|
|
|
|
<option>Informatics Department</option>
|
|
|
|
|
<option>Mechanical Engineering and Applied Electronics Technology Collage</option>
|
|
|
|
|
<option>Life Science and Bioengineering Collage</option>
|
|
|
|
|
</select>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
<label for="introduction" class="col-sm-3 control-label text-left">What's Up</label>
|
|
|
|
|
<div class="col-sm-9">
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
<label for="introduction" class="col-sm-3 control-label text-left">What's Up</label>
|
|
|
|
|
<div class="col-sm-9">
|
|
|
|
|
<textarea name="aboutme" class="form-control" rows="3" id="about_me"
|
|
|
|
|
placeholder="You can only enter 50 characters"
|
|
|
|
|
style="resize: none;" maxlength="50"></textarea>
|
|
|
|
|
</div>
|
|
|
|
|
<script>
|
|
|
|
|
document.getElementById("about_me").value = "{{ current_user.about_me }}";
|
|
|
|
|
</script>
|
|
|
|
|
</div>
|
|
|
|
|
<script>
|
|
|
|
|
document.getElementById("about_me").value = "{{ current_user.about_me }}";
|
|
|
|
|
</script>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-sm-offset-1 col-sm-5 submit">
|
|
|
|
|
<button type="submit" class="form-control btn btn-warning">Submit</button>
|
|
|
|
|
</div>
|
|
|
|
|
</form>
|
|
|
|
|
<div class="col-sm-offset-1 col-sm-5 submit">
|
|
|
|
|
<button type="submit" class="form-control btn btn-warning">Submit</button>
|
|
|
|
|
</div>
|
|
|
|
|
</form>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<script>
|
|
|
|
|
$('#chooseImage').on('change', function () {
|
|
|
|
|
var path_image, fileFormat, src;
|
|
|
|
|
path_image = $(this).val();
|
|
|
|
|
fileFormat = path_image.substring(path_image.lastIndexOf(".")).toLowerCase();
|
|
|
|
|
src = window.URL.createObjectURL(this.files[0]);
|
|
|
|
|
if (fileFormat.match(/.png|.jpg|.jpeg/)) {
|
|
|
|
|
$('#upload_image_perivew').attr('src', src);
|
|
|
|
|
$('#upload_image_perivew')[0].style.animation = "blurFadeIn 0.75s ease-in 0s backwards";
|
|
|
|
|
setTimeout(function () {
|
|
|
|
|
$('#upload_image_perivew')[0].style.animation = "none";
|
|
|
|
|
}, 800);
|
|
|
|
|
} else {
|
|
|
|
|
alert('File type must be:png/jpg/jpeg');
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
</script>
|
|
|
|
|
{% endblock %}
|
|
|
|
|