127 lines
4.0 KiB
PHP
127 lines
4.0 KiB
PHP
<div class="basic-info">
|
|
<h2 class="section-title">个人资料</h2>
|
|
<form class="layui-form" lay-filter="basicForm">
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">用户名</label>
|
|
<div class="layui-input-block">
|
|
<input type="text" name="name" value="{$user.name}" placeholder="请输入用户名" class="layui-input">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">账号</label>
|
|
<div class="layui-input-block">
|
|
<input type="text" value="{$user.account}" class="layui-input" disabled>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">QQ</label>
|
|
<div class="layui-input-block">
|
|
<input type="qq" name="qq" value="{$user.qq}" placeholder="请输入QQ号" class="layui-input">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">手机号</label>
|
|
<div class="layui-input-block">
|
|
<input type="tel" name="phone" value="{$user.phone}" placeholder="请输入手机号" class="layui-input">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">性别</label>
|
|
<div class="layui-input-block">
|
|
<input type="radio" name="sex" value="1" title="男" {if $user.sex==1}checked{/if}>
|
|
<input type="radio" name="sex" value="2" title="女" {if $user.sex==2}checked{/if}>
|
|
<input type="radio" name="sex" value="0" title="保密" {if $user.sex==0}checked{/if}>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
<div class="layui-input-block">
|
|
<button class="layui-btn" lay-submit lay-filter="saveBasic">保存修改</button>
|
|
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<style>
|
|
.basic-info {
|
|
max-width: 800px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.section-title {
|
|
font-size: 20px;
|
|
font-weight: 600;
|
|
color: #333;
|
|
margin-bottom: 24px;
|
|
padding-bottom: 16px;
|
|
border-bottom: 1px solid #f0f0f0;
|
|
}
|
|
|
|
.layui-form-label {
|
|
width: 100px;
|
|
}
|
|
|
|
.layui-input-block {
|
|
margin-left: 130px;
|
|
}
|
|
|
|
.layui-form-item {
|
|
margin-bottom: 24px;
|
|
}
|
|
|
|
.layui-textarea {
|
|
min-height: 120px;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.layui-form-label {
|
|
width: 80px;
|
|
}
|
|
|
|
.layui-input-block {
|
|
margin-left: 110px;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
layui.use(['form', 'layer'], function () {
|
|
var form = layui.form;
|
|
var layer = layui.layer;
|
|
|
|
// 监听表单提交
|
|
form.on('submit(saveBasic)', function (data) {
|
|
// 发送AJAX请求保存数据
|
|
fetch('/index/user/saveBasic', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
'X-Requested-With': 'XMLHttpRequest'
|
|
},
|
|
body: JSON.stringify(data.field)
|
|
})
|
|
.then(response => response.json())
|
|
.then(result => {
|
|
if (result.code === 0) {
|
|
layer.msg(result.msg, { icon: 1 }, function () {
|
|
// 保存成功后刷新页面
|
|
window.location.reload();
|
|
});
|
|
} else {
|
|
layer.msg(result.msg, { icon: 2 });
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error('保存失败:', error);
|
|
layer.msg('保存失败，请稍后重试', { icon: 2 });
|
|
});
|
|
|
|
return false; // 阻止表单默认提交
|
|
});
|
|
});
|
|
</script> |