管理信息系统 课程设计

一、系统概要说明

 

过使用Python、Flask、Mysql的web建设技术,开发一个文章发布的网站,从中能够实现文章的发布和列表显示、文章的评论、文章的点赞、文章的分类筛选、文章的特定搜索以及登录、注册、注销等功能

二、网站结构设计顶部导航条:

三、模块详细设计

首页

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>{% block title %}{% endblock %}首页</title>

    <!-- 新 Bootstrap 核心 CSS 文件 -->

    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

    <script src="https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script>

    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->

    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

    <script src="{{ url_for('static',filename='js/switch.js') }}"></script>

    <link rel="stylesheet"  type="text/css" href="{{ url_for('static',filename='css/base.css') }}">



{% block head %}{% endblock %}

</head>

<body id="myBody" style="background-image:url(/static/img/2345_image_file_copy_4.jpg)">

<nav class="navbar">

    <img src="{{ url_for('static',filename='img/1.jpg') }}" alt="" width="50px">

    <a href="{{ url_for('index') }}">首页</a>

    <a href="{{ url_for('questions') }}">提问</a>

    <form action="{{ url_for('search')}}" method="get" class="navbar-form navbar-right">

    <input name="q" type="text" name="title" required lay-verify="required" placeholder="请输入搜索内容" autocomplete="off"

           class="layui-input">

    <button class="seek" style="padding-left: 10px;" type="submit">搜索</button>

    </form>

{% if username %}

    <a href="{{ url_for('usercenter',user_id=user.id,tag=1) }}">{{user.username }}</a>

{#    <a href="#">{{ username }}</a>#}

    <a href="{{ url_for('logout') }}">注销</a>

    {% else %}

    <a class="login" href="{{ url_for('login') }}">登录</a>

    <a class="enroll" href="{{ url_for('enroll') }}">注册</a>

{% endif %}

    <img id="myOnOff" onclick="mySwitch()" src="http://www.runoob.com/images/pic_bulbon.gif" width="25px">

</nav>









{% block main %}

<div>

    <ul>

        {% for foo in fenlei %}

        <li><a href="{{url_for('index',bd= foo.id)}}">{{foo.name}}</a></li>

        {% endfor %}

    </ul>

</div>

    <ul class="list-group">

        {% for foo in questions %}

            <li class="list-group-item"

                style="padding-left: 0px; padding-right: 10px; box-shadow: rgba(0, 0, 0, 0.498039) 0px 0px 0px 0px; width: 600px;margin: auto">

                <span class="glyphicon glyphicon-leaf" aria-hidden="true"></span>

                <a href="{{ url_for('detail',questions_id=foo.id) }}">{{ foo.title }}</a>{#链接到相关详情页#}

                <span class="badge" >{{ foo.create_time }}</span>

                <p style="margin: 20px">{{ foo.detail }}</p>

                <span class="glyphicon glyphicon-user" aria-hidden="true"></span>

                <a href="{{ url_for('usercenter',user_id=foo.author_id,tag=1) }}">{{ foo.author.username }}评论:({{ foo.comments|length }})</a><br>

            </li>

        {% endfor %}

    </ul>

{% endblock %}



</body>



<footer>

    <div class="footer_box">

        版权@LHH

    </div>

</footer>

 注册

{% extends'base.html' %}
{% block title %}注册{% endblock %}
{% block head %}
    <link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='css/enroll.css') }}">
    <script src="{{ url_for('static',filename='js/enroll.js') }}"></script>
{% endblock %}


{% block main %}
<div class="box">
    <h2>注册</h2>
    <form action="{{ url_for('enroll') }}" method="post">
    <div class="input_box">
        username:<input  id="zname" type="text"placeholder="设置您的用户名" name="username"><br>
        <!--yourname:<input  id="znickname" type="text"placeholder="设置您的昵称" name="nickname">-->
    </div>
    <div class="input_box">
        password:<input  id="zpass1" type="password"placeholder="设置您的密码" name="password"><br>
    <!--</div>-->
    <!--<div class="input-box">-->
        twowrite:<input id="zpass2" type="password" placeholder="重新输入一样的密码">
    </div>
        <div class="input_box">
        <a href="{{ url_for('login') }}" style="margin: 10px">已有账号,登录</a>
    </div>

    <div id="error_box"><br></div>
    <div class="input_box">
        <button class="button" onclick="fnEnroll()">立即注册</button>
    </div>
    </form>
</div>
{% endblock %}

  登陆

{% extends'base.html' %}
{% block title %}登录{% endblock %}
{% block head %}
    <link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='css/login.css') }}">
    <script src="{{ url_for('static',filename='/js/login.js')}}"></script>
{% endblock %}

{% block main %}

<div class="box">
    <h2>登录</h2>
    <form action="{{ url_for('login') }}" method="post">
    <div class="input_box">
        username:<input id="uname" type="text"placeholder="请输入用户名" name="username">
    </div>
    <div class="input_box">
        yourname<input id="unickname" type="text"placeholder="请输入昵称" name="nickname">
    </div>
    <div class="input_box">
        password:<input  id="upass" type="password"placeholder="请输入密码" name="password">
    </div>

    <div class="input_box">
        <a href="{{ url_for('enroll') }}">没有账号?立即注册</a>
    </div>

    <div id="error_box"><br></div>
    <div class="input_box">
        <button class="button"  onclick="fnLogin()">登录</button>
    </div>
    </form>
</div>
{% endblock %}

  发布信息

{% extends'user.html' %}

{% block title %}个人中心{% endblock %}
{% block head %}
<link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='css/usercenter.css') }}">
{% endblock %}

{% block main %}

{% endblock %}

{% block user %}

{#<div class="page-header">#}
{#    <h3><span class="glyphicon glyphicon-user" aria-hidden="true"></span>{{ username }}<br>#}
{#        <small>全部问答<span class="badge"></span></small>#}
{#    </h3>#}
{#    <ul class="list-group">#}
{#        {% for foo in questions %}#}
{#        <li class="list-group-item">#}
{#            <span class="glyphicon glyphicon-heart-empty" aria-hidden="true"></span>#}
{#            <a href="{{ url_for('usercenter',user_id=foo.author_id,tag=1 )}}">{{ foo.author.username }}</a>#}
{#            <span class="badge">{{ foo.create_time }}</span>#}
{#            <p>{{ foo.detail }}</p>#}
{##}
{#        </li>#}
{#        {% endfor %}#}
{#    </ul>#}
{#</div>#}
{##}
{#<div class="page-header">#}
{#    <h3><span class="glyphicon glyphicon-user" aria-hidden="true"></span>{{ username }}<br>#}
{#        <small>全部评论<span class="badge"></span></small>#}
{#    </h3>#}
{#    <ul class="list-group">#}
{#        {% for foo in comments %}#}
{#        <li class="list-group-item">#}
{#            <span class="glyphicon glyphicon-heart-empty" aria-hidden="true"></span>#}
{#            <a href="{{ url_for('usercenter',user_id=foo.author_id,tag=2 )}}">{{ foo.author.username }}</a>#}
{#            <span class="badge">{{ foo.create_time }}</span>#}
{#            <p>{{ foo.detail }}</p>#}
{##}
{#        </li>#}
{#        {% endfor %}#}
{#    </ul>#}
{#</div>#}
{##}
{#<div class="page-header">#}
{#    <h3><span class="glyphicon glyphicon-user" aria-hidden="true"></span>{{ username }}<br>#}
{#        <small>个人信息<span class="badge"></span></small>#}
{#    </h3>#}
{#    <ul class="list-group">#}
{#        <li class="list-group-item">用户:{{ username }}</li>#}
{#        <li class="list-group-item">编号:{{ id }}</li>#}
{#        <li class="list-group-item">昵称:{{ nickname }}</li>#}
{#        <li class="list-group-item">评论次数:{{ comments|length }}</li>#}
{##}
{#    </ul>#}
{#</div>#}

{% endblock %}

  (3) 评论信息

{% extends 'user.html' %}


{% block user %}
    <div class="page-header">
    <h3><span class="glyphicon glyphicon-user" aria-hidden="true"></span>{{ username }}<br>
        <small>全部评论<span class="badge"></span></small>
    </h3>
    <ul class="list-group">
        {% for foo in comments %}
        <li class="list-group-item">
            <span class="glyphicon glyphicon-heart-empty" aria-hidden="true"></span>
            <a href="{{ url_for('usercenter',user_id=foo.author_id ,tag=2)}}">{{ foo.author.username }}</a>
            <span class="badge">{{ foo.create_time }}</span>
            <p>{{ foo.detail }}</p>

        </li>
        {% endfor %}
    </ul>
</div>
{% endblock %}

  个人信息

{% extends 'user.html' %}

{% block user %}
    <div class="page-header">
    <h3><span class="glyphicon glyphicon-user" aria-hidden="true"></span>{{ username }}<br>
        <small>个人信息<span class="badge"></span></small>
    </h3>
    <ul class="list-group">
        <li class="list-group-item">
            {% if user.img %}
                <img src="/static/{{ user.img }}" alt="" width="150px" height="200px">
            {% else %}
                 无上传图片
            {% endif %}
            <form action="{{ url_for('img',user_id=user.id )}}" method="post" enctype="multipart/form-data">
            <input type="file" required name="img">
        <button type="submit">上传</button>
                </form>
        </li>
        <li class="list-group-item">用户:{{ user.username }}</li>
        <li class="list-group-item">编号:{{ user.id }}</li>
        <li class="list-group-item">昵称:{{ nickname }}</li>
        <li class="list-group-item">评论次数:{{ comments|length }}</li>
        <li class="list-group-item">问答次数:{{ questions|length }}</li>
        <li class="list-group-item"><a href="{{ url_for('updata_password',user_id=user.id) }}">修改密码</a></li>
    </ul>
</div>
{% endblock %}

 三、网站结构设计

注册、登录

 

 

 评论详情页

发布问答页

 

 详细页,点赞,收藏,评论,

 

 

 

 
   

 

 

 

 

 

 

 

 

 

 

 

posted on 2018-06-16 21:10  137陈楚洪  阅读(131)  评论(0编辑  收藏  举报

导航