SDUVJ开发实录（五）：Problem等界面的显示优化

经过更进一步的学习后发现上次没有实现problemlist的显示是因为Django自带的数据库和mysql出了点冲突，所以反向生成了module，用Django自己的数据库完成了题目和problemlist的显示~

首先是problem页面的代码：

{% extends "problem/problem_base.html" %}{% block detail %}    <style type="text/css">    pre{        word-break: normal;        word-wrap: break-word;        white-space: pre-wrap;    }     </style>    {% autoescape off %}    <h3 class="text-info">Description</h3>    <pre>{{ problem.description }}</pre>     <h3 class="text-info">Input</h3>    <pre>{{ problem.input }}</pre>    <h3 class="text-info">Output</h3>    <pre>{{ problem.output }}</pre>    {% endautoescape %}    <h3 class="text-info">Sample Input</h3>    <pre>{{ problem.sampleinput }}</pre>    <h3 class="text-info">Sample Output</h3>    <pre>{{ problem.sampleoutput }}</pre>    {% autoescape off %}    <h3 class="text-info" >Note</h3>    <pre>{{ problem.note }}</pre>    <h3 class="text-info">Source</h3>    <pre>{{ problem.originoj }} {{ problem.problemid }}</pre>    {% endautoescape %}{% endblock %}

大部分和原来SDUOJ的东西很相似，为VJ修改了一部分显示。然后在views.py里面修改了problem：

def problem_detail(req, proid):    problem = Problem.objects.get(proid=proid)    return ren2res("problem/problem_detail.html", req, {'problem': problem})

在上一次测试时，problem的问题并没有太突出，problemlist由于和数据库的交互要更深一些所以显示出现了较大的问题。而反向生成module之后我们直接重用了原oj的代码。完成了problemlist的显示工作。

problemlist的html代码：

{% extends "base_list.html" %}{% block title %}Problem List{% endblock %}{% block navbar %}{% include "include/navbar-problem.html" %}{% endblock %}{% block list %}<script type="text/javascript">$(document).ready(function() {    $("#pro_table").submit(function()    {        $(this).ajaxSubmit({            type:"post",  //提交方式            dataType:"text", //数据类型            url:"/problem/", //请求url            data: $('#pro_table').serialize(),            success:function(data){ //提交成功的回调函数                //loadNewContents()                //$("#originoj").val("");                //$("#problemid").val("");                //$("#title").val("");            }        });        return true; //不刷新页面    });})</script><col width="12%" /><col width="12%" /><col width="40%" /><col width="12%" /><col width="20%" /><form id="pro_table" method="post">{% csrf_token %}<tr>    <th><center>OJ <input class="form-control" type="text" id="originoj" style="width:60px;" name="originoj" value="{{originoj}}"></center></th>    <th><center>Pro_ID <input class="form-control" type="text" id="problemid" style="width:60px;" name="problemid" value="{{problemid}}"></center></th>    <th><center>Title <input class="form-control" type="text" id="title" style="width:350px;" name="title" value="{{title}}"></center> </th>    <input type="submit" style="display:none" ></input>     <th><center>Accepted/Submit</center></th>    <th><center>Upload</center></th></tr>{% for item in list %}<tr>    <th><center>{{ item.originoj }}</center></th>    {%if item.proid in aclst%}    <th><center><font color="#008000">{{item.problemid}}</font></center></th>    {%elif item.proid in trylst%}    <th><center><font color="#FFA500">{{item.problemid}}</font></center></th>    {%else%}    <th><center>{{item.problemid}}</center></th>    {%endif%}    <th><center><a href="/problem/{{ item.proid }}">{{ item.title }}</a></center></th>    <th><center><a href="/status?pid={{ item.proid }}">{{ item.accepted }}/{{ item.submitted }}</a></center></th>    <th><center>{{ item.updatetime | date:"Y-m-d" }}</center></th></tr>{% endfor %}</form>{% endblock %}{% block page %}    <ul class="pagination">        {% for id in page %}        <li><a class="{% if pg == id %}active{% else %}disabled{% endif %}" href="/problem?pg={{ id }}">{{ id }}</a></li>        {% endfor %}    </ul>{% endblock %}

在views.py中：

def problem(req):    pg = int(req.GET.get('pg', 1))    search = req.GET.get('search', "")    originoj= req.POST.get('originoj',"")    problemid=req.POST.get('problemid',"")    title=req.POST.get('title',"")    if search:        qs = Problem.objects.filter(Q(proid__icontains=search) | Q(title__icontains=search))    elif originoj or problemid or title:        qs = Problem.objects.filter(Q(originoj__icontains=originoj) & Q(problemid__icontains=problemid) & Q(title__icontains=title))    else:        qs = Problem.objects.all()    idxstart = (pg - 1) * LIST_NUMBER_EVERY_PAGE    idxend = pg * LIST_NUMBER_EVERY_PAGE    max = qs.count() // 20 + 1    if (pg > max):        raise Http404("no such page")    start = pg - PAGE_NUMBER_EVERY_PAGE    if start < 1:        start = 1    end = pg + PAGE_NUMBER_EVERY_PAGE    if end > max:        end = max    lst = qs[idxstart:idxend]    lst = list(lst)    aclst = []    trylst = []    '''    if req.user.is_authenticated():        user = req.user        for item in lst:            if item.aceduser.filter(id=user.info.id):                aclst.append(item.id)            elif item.trieduser.filter(id=user.info.id):                trylst.append(item.id)    return ren2res("problem.html", req, {'pg': pg, 'page': list(range(start, end + 1)), 'list': lst, 'aclst':aclst, 'trylst':trylst        ,'originoj':originoj ,'problemid':problemid ,'title':title })