订单后台管理系统-day05用户模块查看与删除

查看详情

account/info.html

{% extends "common/layout_main.html" %}
{% block content %}
    {% include 'common/tab_account.html' %}
​
    <div class="row m-t">
        <div class="col-lg-12">
            <div class="row">
                <div class="col-lg-12">
                    <div class="m-b-md">
                        <a class="btn btn-outline btn-primary pull-right"
                           href="{{ url_for('manage.account_edit') }}?id={{ info.id }}">
                            <i class="fa fa-pencil"></i>编辑
                        </a>
                        <h2>账户信息</h2>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-2 text-center">
                    <img class="img-circle circle-border"
                         src="{{ url_for('static', filename='images/common/avatar.png') }}" width="100px"
                         height="100px">
                </div>
                <div class="col-lg-10">
                    <p class="m-t">姓名：{{ info.nickname }}</p>
                    <p>手机：{{ info.mobile }}</p>
                    <p>邮箱：{{ info.email }}</p>
                </div>
            </div>
            <div class="row m-t">
                <div class="col-lg-12">
                    <div class="panel blank-panel">
                        <div class="panel-heading">
                            <div class="panel-options">
                                <ul class="nav nav-tabs">
                                    <li class="active">
                                        <a href="javascript:void(0);" data-toggle="tab" aria-expanded="false">访问记录</a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="panel-body">
                            <div class="tab-content">
                                <div class="tab-pane active">
                                    <table class="table table-bordered">
                                        <thead>
                                        <tr>
                                            <th>访问时间</th>
                                            <th>访问Url</th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        {% if access == None %}
                                            <tr>
                                                <td colspan="2">暂无数据</td>
                                            </tr>
                                        {% else %}
                                            {% for item in access %}
                                                <tr>
                                                    <td>{{ item.created_at }}</td>
                                                    <td>{{ item.target_url }}</td>
                                                </tr>
                                            {% endfor %}
                                        {% endif %}
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}
​

admin.py

# 用户详情
@manage_bp.route('/account/info')
def account_info():
    resp_data = {}
    # 由于数据库里面的id是从1开始的，如果id小于1就返回到用户列表页面
    u_id = int(request.args.get('id', 0))
    if u_id < 1:
        return redirect(url_for('manage.account_list'))
    # 如果有id就进行查询用户，没有就回跳到用户列表页面
    user_obj = User.query.get(u_id)
    if not user_obj:
        return redirect(url_for('manage.account_list'))
    resp_data['info'] = user_obj
    
    # 获取当前用户的访问记录
    access_obj = AccessLog.query.filter_by(uid=u_id).order_by(AccessLog.created_at.desc()).limit(5)
​
    if not access_obj:
        resp_data['access'] = None
    resp_data['access'] = access_obj
​
    return ops_render('account/info.html', resp_data)

删除用户(修改状态)

• 这里的删除，指的是修改用户的可用状态，其实通常我们不推荐真正的删除数据，所有的删除都可以用隐藏的状态，来进行操作。不让用户看到，就是没有

@manage_bp.route('/account/ops', methods=['PUT'])
def account_ops():
    resp = {'code': 200, 'msg': '操作成功！', 'data': {}}
    req = request.values
	
    # 在前端页面显示的同一个元素，但是传递的值会根据后台的状态而改变
    # 这里我们需要前端的配合，传递remove则执行删除操作，recover为恢复操作
    u_id = req['id'] if 'id' in req else 0
    act = req['act'] if 'act' in req else ''
    if not u_id:
        resp['code'] = -1
        resp['msg'] = '操作失败！'
        return jsonify(resp)
    if act not in ['remove', 'recover']:
        resp['code'] = -1
        resp['msg'] = '操作失败！'
        return jsonify(resp)
    user_obj = User.query.get(u_id)
    if not user_obj:
        resp['code'] = -1
        resp['msg'] = '指定账户不存在！'
        return jsonify(resp)
    if act == 'remove':
        user_obj.status = 0
    elif act == 'recover':
        user_obj.status = 1
    db.session.commit()
    return jsonify(resp)

• 这里展示部分templates/account/index.html文件核心代码

• 根据后台传递过来的值，判断显示什么图标

 {% if foo.status == 1 %}
     <a class="m-l remove" href="javascript:void(0);" data-id="{{ foo.id }}">
         <i class="fa fa-trash fa-lg"></i>
     </a>
 {% else %}
 <a class="m-l recover" href="javascript:void(0);" data-id="{{ foo.id }}">
    <i class="fa fa-rotate-left fa-lg"></i>
 </a>
 {% endif %}

• 在js代码中，使用jquery获取用户点击的元素，根据元素的不同，调用ajax请求，传递不同的参数

$('.remove').click(function () {
    that.ops('remove', $(this).attr('data-id'))
});
​
$('.recover').click(function () {
    that.ops('recover', $(this).attr('data-id'))
});