| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889 |
- <!DOCTYPE html>
- <html lang="zh-CN">
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>个人信息</title>
- <link rel="stylesheet" href="../../lib/layui/css/layui.css">
- <style>
- body { padding: 20px; }
- .user-info-card { background: #fff; padding: 30px; border-radius: 8px; max-width: 600px; margin: 0 auto; }
- .avatar-upload { text-align: center; margin-bottom: 20px; }
- .avatar-img { width: 120px; height: 120px; border-radius: 50%; border: 3px solid #667eea; }
- </style>
- </head>
- <body>
- <div class="user-info-card">
- <form class="layui-form" lay-filter="userInfoForm" id="userInfoForm">
- <div class="avatar-upload">
- <img src="../../images/user.png" class="avatar-img" id="avatarImg">
- </div>
-
- <div class="layui-form-item">
- <label class="layui-form-label">账号</label>
- <div class="layui-input-block">
- <input type="text" name="account" class="layui-input" readonly style="width: 300px; background: #f5f5f5;">
- </div>
- </div>
-
- <div class="layui-form-item">
- <label class="layui-form-label">姓名</label>
- <div class="layui-input-block">
- <input type="text" name="name" class="layui-input" style="width: 300px;">
- </div>
- </div>
-
- <div class="layui-form-item">
- <label class="layui-form-label">手机号</label>
- <div class="layui-input-block">
- <input type="text" name="phone" class="layui-input" style="width: 300px;">
- </div>
- </div>
-
- <div class="layui-form-item">
- <label class="layui-form-label">邮箱</label>
- <div class="layui-input-block">
- <input type="text" name="email" class="layui-input" style="width: 300px;">
- </div>
- </div>
-
- <div class="layui-form-item">
- <div class="layui-input-block">
- <button type="submit" class="layui-btn" lay-submit lay-filter="submitForm">保存</button>
- </div>
- </div>
- </form>
- </div>
-
- <script src="../../lib/layui/layui.js"></script>
- <script src="../../js/config.js"></script>
- <script src="../../js/common.js"></script>
- <script>
- layui.use(['form'], function() {
- var form = layui.form;
-
- // 获取当前用户信息
- Common.get(Config.api.currentUser, function(res) {
- if (res.code === 200) {
- var user = res.data || res;
- form.val('userInfoForm', {
- account: user.account,
- name: user.name,
- phone: user.phone,
- email: user.email
- });
- if (user.avatar) {
- $('#avatarImg').attr('src', user.avatar);
- }
- }
- });
-
- // 提交表单
- form.on('submit(submitForm)', function(data) {
- Common.success('个人信息已更新');
- return false;
- });
- });
- </script>
- </body>
- </html>
|