yoxem/gazhdict
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

add formset

Browse source
This commit is contained in:
Tan, Kian-ting 2021-01-31 21:47:20 +08:00
parent f5b976d7fa
commit f24e2abefd
12 changed files with 316 additions and 91 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

33
gazhdict/addentry/views.py
View file

@ -1,15 +1,18 @@
from django.shortcuts import render
from django.contrib.auth.decorators import login_required
from django.http import HttpResponse
from datetime import datetime
from .add_entry_form import EntryForm, MeaningForm
from .models import Entry, Meaning
from django.forms import formset_factory
# Create your views here.
def hello_world(request):
return render(request, 'hello_world.html',
{'current_time' : str(datetime.now()),})
@login_required #登入必要
def add_entry(request):
# it becomes true when stored successfully
@ -22,30 +25,42 @@ def add_entry(request):
latest_entry_id = Entry.objects.latest('id').id
meaning_form = MeaningForm(request.POST)
MeaningFormSet = formset_factory(MeaningForm, extra=5)
meaning_form_set = MeaningFormSet(data=request.POST or None)
if meaning_form.is_valid:
meaning_form.save()
meaning_form_valid_length = len(list(filter(lambda x : x == {} , meaning_form_set.errors)))
i = 0
for form in meaning_form_set:
if i < meaning_form_valid_length:
form.save()
raise Exception("Form Saved!")
i += 1
else:
break
latest_meaning_id = Meaning.objects.latest('id').id
# update the entry id of meaning
Meaning.objects.filter(id=latest_meaning_id).update(Entry=latest_entry_id)
valid_meaning_list = Meaning.objects.all().order_by('-id')[:meaning_form_valid_length]
for meaning in valid_meaning_list:
Meaning.objects.filter(id=meaning.id).update(Entry=latest_entry_id)
is_saved = True
entry_list = Entry.objects.all()
meaning_list = Meaning.objects.all()
entry_list = list(Entry.objects.all())[-10:]
meaning_list = list(Meaning.objects.all())[-20:]
entry_form = EntryForm()
meaning_form = MeaningForm()
meaning_form_set = formset_factory(MeaningForm, extra=5)
context = {
'is_saved' : is_saved,
'entry_form' : entry_form,
'meaning_form' : meaning_form,
'meaning_form_set' : meaning_form_set,
'entry_list' : entry_list,
'meaning_list' : meaning_list,

6
gazhdict/static/addentry/add_entry.css
View file

@ -1,9 +1,13 @@
.entry-modify-input{
display : none;
}
#id_Entry {
display: none;
}
label[for=id_Entry]{
display: none;
}

26
gazhdict/static/addentry/add_entry.js
View file

@ -1,6 +1,13 @@
// setting the option value of the entry selection list to 1
var options = document.getElementById("id_Entry");
options.value = "1";
var formBox = document.getElementById("form-box");
var options = document.getElementsByTagName("select");
for (var i = 0; i < options.length; i++) {
options[i].value = "1";
options[i].style.display = "none";
var label = document.querySelector("label[for=id_form-" + i + "-Entry]");
label.style.display = "none";
}
//options.value="1";
// setting saved_successed position
var width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
var height = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
@ -16,3 +23,18 @@ var SuccSaved = document.getElementById("successful-saved");
closeSuccSaved.addEventListener("click", function (e) {
SuccSaved.style["display"] = "none";
});
var editBottonList = document.getElementsByClassName('entry-edit-button');
for (var i = 0; i < editBottonList.length; i++) {
editBottonList[i].addEventListener("click", function (e) {
console.log(123);
var tgt = e.target;
var bottonId = tgt.id;
var entryEditRegexp = /entry-edit-(\d+)/;
var IdNum = entryEditRegexp.exec(bottonId)[1];
var inputBoxClassName = ".ent-mod-inp-" + IdNum; // ent-mod-inp = entry-modify-input
var inputBoxList = document.querySelectorAll(inputBoxClassName);
for (var j = 0; j < inputBoxList.length; j++) {
inputBoxList[j].style['display'] = 'block';
}
}, false);
}

30
gazhdict/static/addentry/add_entry.ts
View file

@ -1,8 +1,15 @@
// setting the option value of the entry selection list to 1
var options = <HTMLSelectElement> document.getElementById("id_Entry");
var formBox = document.getElementById("form-box");
var options = document.getElementsByTagName("select");
for(var i=0; i<options.length;i++){
options[i].value="1";
options[i].style.display = "none";
var label = <HTMLLabelElement> document.querySelector("label[for=id_form-" + i + "-Entry]");
label.style.display = "none";
}
options.value="1";
//options.value="1";
// setting saved_successed position
@ -27,4 +34,23 @@ closeSuccSaved.addEventListener("click",(e)=>{
SuccSaved.style["display"] = "none";
})
var editBottonList = document.getElementsByClassName('entry-edit-button')
for (var i=0; i< editBottonList.length; i++){
editBottonList[i].addEventListener("click",(e)=>{
console.log(123);
let tgt = <HTMLElement> e.target;
let bottonId = tgt.id;
let entryEditRegexp = /entry-edit-(\d+)/;
let IdNum = entryEditRegexp.exec(bottonId)[1];
let inputBoxClassName = ".ent-mod-inp-" + IdNum; // ent-mod-inp = entry-modify-input
let inputBoxList = document.querySelectorAll<HTMLElement>(inputBoxClassName);
for (var j=0; j<inputBoxList.length; j++){
inputBoxList[j].style['display'] = 'block';
}
}, false)
}

98
gazhdict/static/basic_generic.css Normal file
View file

@ -0,0 +1,98 @@
#head-bar{
background: url("./image/headbarright.png"),
#7fa962;
padding: 1.2em 2em 2em 1.2em;
background-position:right;
background-repeat:no-repeat;
}
#head-bar h1{
color: #ffffff;
font-size:209%;
}
#head-bar h2{
color: #ffff7f;
font-size:135%;
}
#head-bar #login{
float: right;
}
#head-bar #login a {
color:#ffffff;
}
#head-bar #login a:hover {
color:#ffffff;
}
#head-bar #login a:active {
color:#ffffff;
}
#head-bar #login a:visited{
color:#ffffff;
}
#middie{
display: table;
}
.css_tr{
display: table-row;
}
.css_td{
display: table-cell;
}
#left-bar{
width: 200px;
padding: 2em 1.5em 2em 1.5em;
background-color:#f2f38d;
}
#left-bar ul{
list-style: none;
padding-left: 1em;
}
#left-bar ul li{
padding-top: 0.5em;
padding-right: auto;
padding-bottom: 0.5em;
border-bottom: 1px solid #9c9d5b;
font-size:115%;
}
#left-bar ul ul{
padding-left: 0em;
}
#left-bar ul ul li{
padding-top: 0.5em;
padding-right: auto;
padding-bottom: 0.5em;
padding-left: 2em;
font-size:100%;
}
#id_search_content{
width: 500px;
}
#main {
box-sizing: border-box;
padding: 2em 1.5em 2em 1.5em;
}
#footer {
background: #7fa962;
color: #ffffff;
padding: 2em 2em 2em 2em;
}

18
gazhdict/static/ga_search.css Normal file
View file

@ -0,0 +1,18 @@
label[for=id_search_content]{
font-weight: bold;
}
#search-content{
width: 100%;
}
#search-content h1{
color: #7fa861;
}
#options{
padding: 1em 0em 1em 0em;
}

BIN
gazhdict/static/image/headbarright.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 405 KiB

90
gazhdict/templates/addentry/add_entry.html
View file

@ -1,25 +1,18 @@
{% extends "base_generic.html" %}
{% load static %}
{% block title %}<title>愛爾蘭語—華語線上辭典 - 增加條目</title>{% endblock %}
{% block content %}
<html>
<head>
<meta charset="utf-8">
<title>增加條目</title>
<link rel="stylesheet" href="{% static 'addentry/add_entry.css' %}">
</head>
<body>
{% if is_saved == True %}
<div id="successful-saved">
<div id="successful-saved" {% if is_saved != True %}style="display:none;"{% endif %}>
<div id="close-saved-screen-bar"><span id="close-successful-saved">[X]</span></div>
<div id="successful-saved-message">儲存成功！</div>
</div>
{% endif %}
<h1>線上愛爾蘭語—華語辭典</h1>
<h2>增加項目與解釋</h2>
<div id="sidebar"><a href="../accounts/logout">登出</a></div>
{% block content %}
<form action="" method="POST">
{% csrf_token %}
<div class="form-group">
@ -29,22 +22,26 @@
{{field.label_tag}} {{field}} <br/>
{% endfor %}
<p/>
<h3>解釋</h3>
<div id="form-box">
{% for field in meaning_form %}
{{meaning_form_set.management_form}}
{% for meaning in meaning_form_set %}
<h3>解釋{{forloop.counter}}</h3>
{% for field in meaning %}
{{field.label_tag}} {{field}}<br/>
{% endfor %}
</div>
{% endfor %}
<p/>
<input class="btn btn-success" type="submit" value="儲存" />
</div>
</div>
</form>
{% endblock %}
<h3>詞條一覽</h3>
{% for entry in entry_list reversed%}
<form id="entry-{{entry.id}}" action="add_entry_modified" method="POST"></form>
{% endfor %}
<h3>詞條一覽（最後10筆倒著顯示）</h3>
<table class="table table-bordered table-striped">
<thead>
<tr>
@ -57,19 +54,52 @@
<th>編輯</th>
<tr/>
</thead>
{% for entry in entry_list%}
{% for entry in entry_list reversed%}
<tr>
<td>{{entry.id}}</td>
<td>{{entry.Gaeilge}}</td>
<td>{% if entry.Pronoun != None %}{{entry.Pronoun}}{% endif %}</td>
<td>{% if entry.PoS != None %}{{entry.PoS}}{% endif %}</td>
<td>{% if entry.PreScript != None %}{{entry.PreScript}}{% endif %}</td>
<td>{% if entry.PostScript != None %}{{entry.PostScript}}{% endif %}</td>
<td><a class="edit">編輯</a> <a class="edit">刪除</a></td>
<td>{{entry.id}}<input type="hidden" name="id" class="entry-modify-input ent-mod-inp-{{ forloop.counter0 }}" id="id" value="{{entry.id}}" form="entry-{{entry.id}}"></td>
<td>{{entry.Gaeilge}}<input type="text" name="Gaeilge" class="entry-modify-input ent-mod-inp-{{ forloop.counter0 }}" maxlength="100" id="Gaeilge" value="{{entry.Gaeilge}}" form="entry-{{entry.id}}" required=""></td>
<td>{% if entry.Pronoun != None %}{{entry.Pronoun}}{% endif %}<input type="text" name="Pronoun" class="entry-modify-input ent-mod-inp-{{ forloop.counter0 }}" maxlength="250" id="Pronoun" value="{{entry.Pronoun}}" form="entry-{{entry.id}}"></td>
<td>{% if entry.PoS != None %}{{entry.PoS}}{% endif %}<input type="text" name="PoS" class="entry-modify-input ent-mod-inp-{{ forloop.counter0 }}" maxlength="20" id="PoS" value="{{entry.PoS}}" form="entry-{{entry.id}}"></td>
<td>{% if entry.PreScript != None %}{{entry.PreScript}}{% endif %}<input type="text" name="PreScript" class="entry-modify-input ent-mod-inp-{{ forloop.counter0 }}" maxlength="20" id="PreScript" value="{{entry.PreScript}}" form="entry-{{entry.id}}"></td>
<td>{% if entry.PostScript != None %}{{entry.PostScript}}{% endif %}<input type="text" name="PostScript" class="entry-modify-input ent-mod-inp-{{ forloop.counter0 }}" maxlength="20" id="PostScript" value="{{entry.PostScript}}" form="entry-{{entry.id}}"></td>
<td><button class="entry-edit-button" id="entry-edit-{{ forloop.counter0 }}">編輯</button> <input type="submit" value="更新" form="entry-{{entry.id}}"> <a class="edit">刪除</a></td>
</tr>
{% endfor %}
</table>
<h3>釋義一覽</h3>
<table class="table table-bordered table-striped">
<thead>
<tr>
<th>id</th>
<th>條目id<br>Entry Id</th>
<th>意思<br>Meaning_content</th>
<th>例句1<br>Exam_Sentence1</th>
<th>例句中譯1<br>Exam_Sentence1_zh</th>
<th>例句2<br>Exam_Sentence2</th>
<th>例句中譯2<br>Exam_Sentence2_zh</th>
<th>例句3<br>Exam_Sentence3</th>
<th>例句中譯3<br>Exam_Sentence3_zh</th>
<th>編輯</th>
<tr/>
</thead>
{% for m in meaning_list reversed%}
<tr>
<td>{{m.id}}</td>
<td>{{m.Entry.id}}</td>
<td>{{m.Meaning_content}}</td>
<td>{% if m.Exam_Sentence1 != None %}{{m.Exam_Sentence1}}{% endif %}</td>
<td>{% if m.Exam_Sentence1_zh != None %}{{m.Exam_Sentence1_zh}}{% endif %}</td>
<td>{% if m.Exam_Sentence2 != None %}{{m.Exam_Sentence2}}{% endif %}</td>
<td>{% if m.Exam_Sentence2_zh != None %}{{m.Exam_Sentence2_zh}}{% endif %}</td>
<td>{% if m.Exam_Sentence3 != None %}{{m.Exam_Sentence3}}{% endif %}</td>
<td>{% if m.Exam_Sentence3_zh != None %}{{m.Exam_Sentence3_zh}}{% endif %}</td>
<td><a class="edit">編輯</a> <a class="update">更新</a> <a class="delete">刪除</a></td>
</tr>
{% endfor %}
</table>
<script src="{% static 'addentry/add_entry.js' %}"></script>
</html>
<link rel="stylesheet" href="{% static 'addentry/add_entry.css' %}">
{% endblock %}

36
gazhdict/templates/base_generic.html
View file

@ -1,3 +1,4 @@
{% load static %}
<html lang="zh">
<head>
<meta charset="utf-8">
@ -5,7 +6,40 @@
</head>
<body>
<div id="head-bar">
<div id="login"><a href="http://127.0.0.1:8000/accounts/login/">登入</a></div>
<h1>愛爾蘭語—華語線上辭典</h1>
<h2>An Fócloir Gaeilge-Mandairinis ar Líne</h2>
</div>
<div id="middle">
<div id="middle-css-tr" class="css_tr">
<div id="left-bar" class="css_td">
<ul>
<li>不規則動詞、繫詞表</li>
<ul><li>abair</li>
<li>beir</li>
<li>bí</li>
<li>clois</li>
<li>dein</li>
<li>is</li>
<li>faigh</li>
<li>gabh</li>
<li>inis</li>
<li>ith</li>
<li>righ</li>
<li>tabhair</li>
<li>tar</li>
<li>téigh</li>
</ul>
<li>關於本站</li>
</ul>
</div>
<div id="main" class="css_td">
{% block content %}<!-- default content text (typically empty) -->{% endblock %}
</div></div></div>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<link rel="stylesheet" href="{% static 'basic_generic.css' %}">
<div id="footer">(c) 2021 Chen, Chien-ting</div>
</body>
</html>

27
gazhdict/templates/ga_search.html
View file

@ -1,28 +1,24 @@
<!DOCTYPE html>
<html>
<head>
<title>線上愛爾蘭語—漢語辭典 - 愛爾蘭語搜尋 {{entry}} 的結果</title>
</head>
<body>
<div id="header">
<h1>線上愛爾蘭語—華語辭典</h1>
<h2>An Foclóir Gaeilge-Mandairínis ar Líne</h2>
</div>
{% extends "base_generic.html" %}
{% load static %}
{% block title %}
<title>愛爾蘭語—華語線上辭典 - 首頁</title>{% endblock %}
{% block content %}
<link rel="stylesheet" href="{% static 'ga_search.css' %}">
<div id="search-bar">
<form method="POST">
{% csrf_token %}
<div id="search_content">
<div id="search-content">
<h1 id="search-content-head">搜尋內容</h1>
<label for="{{form.search_content.id_for_label}}">搜尋內容：</label>{{form.search_content}}
</div>
<div id="options">
{% for option in form.choice_field %}
<li id="{{option.id_for_label}}">{{option.label_tag}} {{option}}</li>
<span id="{{option.id_for_label}}">{{option.label_tag}} {{option}}</span>
{% endfor %}
</div>
<input type="submit" value="搜尋">
</form>
</div>
<hr/>
<div id="search-result">
{% if entry == "" %}
<!-- Let it blank -->
@ -52,6 +48,5 @@
</div>
{% endfor %}
{% endif %}
</div>
</body>
</html>
{% endblock %}

19
gazhdict/templates/index.html
View file

@ -1,15 +1,6 @@
<html>
<head>
<meta charset="utf-8">
<title>線上愛爾蘭語—漢語辭典</title>
</head>
<body>
<div id="header">
<h1>線上愛爾蘭語—華語辭典</h1>
<h2>An Foclóir Gaeilge-Mandairínis ar Líne</h2>
</div>
{% load static %}
{% block title %}<title>愛爾蘭語—華語線上辭典 - 首頁</title>{% endblock %}
{% extends "base_generic.html" %}
<div id="search-bar">
<form method="POST">
{% csrf_token %}
@ -23,6 +14,4 @@
</div>
<input type="submit" value="搜尋">
</form>
</div>
</body>
</html>
{% endblock %}

16
gazhdict/templates/registration/login.html
View file

@ -1,13 +1,9 @@
<body>
<head>
<meta charset="utf-8">
<title>線上愛爾蘭語—華語辭典 - 登入</title>
<head>
<body>
<h1>線上愛爾蘭語—華語辭典</h1>
<h2>管理後台登入畫面</h2>
{% extends "base_generic.html" %}
{% load static %}
{% block title %}
<title>愛爾蘭語—華語線上辭典 - 登入</title>{% endblock %}
{% block content %}
<h2>後台登入</h2>
{% if form.errors %}
<p>帳號或密碼不符合，請重新輸入。</p>
{% endif %}
@ -42,5 +38,3 @@
<p><a href="{% url 'password_reset' %}">忘記密碼？</a></p>
{% endblock %}
</body>
</html>