继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

【九月打卡】第12天+管理员后台账号模块开发

残梦ming
关注TA
已关注
手记 26
粉丝 2
获赞 0

https://coding.imooc.com/learn/list/265.html



课程名称:Python Flask构建微信小程序订餐系统



课程章节:第七章 管理员后台账号模块开发——7-5 编辑和修改登录人信息



主讲老师:编程浪子






7-5 编辑和修改登录人信息

    1.获取当前登录用户

    from flask import g

    当前用户对象存储在——g.current_user

    http://img2.mukewang.com/632418e60001709908810454.jpg

     

    1.HTML页面通过current_user显示当前用户信息

    http://img1.mukewang.com/632418f50001944814130908.jpg

     

    运行展示:

    http://img1.mukewang.com/632418fc0001d74a19200925.jpg

     

     

     

    2.edit.html页面展示用户信息

    http://img1.mukewang.com/6324190c0001672814160910.jpg

     

     

    3.edit.js渲染修改个人信息

    http://img1.mukewang.com/6324191c00011fb711710837.jpg

    http://img1.mukewang.com/632419280001fbb811710741.jpg

    http://img1.mukewang.com/632419340001df3111700273.jpg

    

    

     

    edit.html结尾引用edit.js文件:

    http://img3.mukewang.com/6324193e0001615011730734.jpg

     

    运行展示:

    用户名不符合要求:

    http://img4.mukewang.com/6324194900010ede15580778.jpg

     

    邮箱不符合要求:

    http://img2.mukewang.com/6324195200018ace13760785.jpg

     

     

     

     

    4.后台修改账户信息代码

                        

(, =[, ])
edit():
    request.method == :
        ops_render(, {: })

    resp = {
        : ,
        : ,
        : {}
    }

    req = request.values
    nickname = req[] req email = req[] req nickname (nickname) <= :
        resp[] = -resp[] = jsonify(resp)

    email (email) <= :
        resp[] = -resp[] = jsonify(resp)

    user_info = g.current_user
    user_info.nickname = nickname
    user_info.email = email

    db.session.add(user_info)
    db.session.commit()

    jsonify(resp)

    http://img.mukewang.com/6324195e000180dd11800748.jpg

    http://img1.mukewang.com/632419710001d49719201030.jpg

    

     

     

     

    正确修改(页面重新加载显示修改后的数据):

    http://img2.mukewang.com/6324197c0001e35e19201030.jpg

     

    

     

     

     

     

     

     

    2.修改密码

    1.reset_pwd.js修改密码样式文件

    http://img2.mukewang.com/6324198500014cec11710837.jpg

    http://img3.mukewang.com/6324199b0001fb2011710715.jpg

    http://img3.mukewang.com/632419a60001bcf211730558.jpg

    

    

     

    reset_pwd.js样式运行结果:

    http://img1.mukewang.com/632419b400011fd519201030.jpg

    http://img.mukewang.com/632419be00013d4919201030.jpg

     

    

     

     

     

    2.reset_pwd.html中引入reset_pwd.js样式

    http://img4.mukewang.com/632419c90001012211760722.jpg

     

     

     

    3.后台修改密码代码

    http://img1.mukewang.com/632419d30001310611800752.jpg

    http://img4.mukewang.com/632419de0001ec8511810737.jpg

    

     

     

     

    4.顶部样式封装

    

    封装样式

    

    
        
            
                {% == %}{% %}
                    {{ () }}信息编辑
                
                {% == %}{% %}
                    {{ () }}修改密码

     

    edit.html和reset_pwd.html中引入封装的tab_user.html样式

 

{% %}
{% %}
{% %}

    
        账号信息编辑
        
            
                手机:
                
                    {{ .}}
                
            
            

            
                姓名:
                
                    {{ .}}
                
            
            

            
                邮箱:
                
                    {{ .}}
                
            
            
            
                
                    保存
                
            
        
    


{% %}
{% %}
    {{ () }}
{% %}

 


打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP