attiya/ebike-plus-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 用户信息表单

Browse Source
This commit is contained in:
wf 2024-06-21 18:53:05 +08:00
parent ecbecc6521
commit ee2ed691ec
1 changed files with 121 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

123
src/views/personal-center/user-settings/user-settings.vue
View File

@ -19,7 +19,69 @@
</a-row> </a-row>
<a-divider /> <a-divider />
<a-row> <a-row>
<a-col> </a-col> <a-col :span="12">
<div class="row-title">基础信息</div>
<a-form :model="form" :style="{ width: '600px' }">
<a-form-item field="name" label="用户ID">
<a-input v-model="form.name" placeholder="请输入用户昵称" disabled />
</a-form-item>
<a-form-item field="name" label="用户昵称">
<a-input v-model="form.name" placeholder="请输入用户昵称" />
</a-form-item>
<a-form-item field="name" label="角色">
<a-input v-model="form.name" placeholder="请选择角色" />
</a-form-item>
<a-form-item field="name" label="权限">
<a-input v-model="form.name" placeholder="请选择权限" />
</a-form-item>
<a-form-item field="name" label="注册时间">
<a-input v-model="form.name" placeholder="请输入注册时间" />
</a-form-item>
<a-form-item>
<a-button>提交</a-button>
</a-form-item>
</a-form>
</a-col>
<a-col :span="12">
<div class="row-title">安全设置</div>
<a-form :model="form" :style="{ width: '600px' }">
<a-form-item field="name" label="登录密码">
<a-input v-model="form.name" placeholder="请输入登录密码" />
</a-form-item>
<a-form-item field="name" label="密保问题">
<a-input v-model="form.name" placeholder="请输入密保问题" />
</a-form-item>
<a-form-item field="name" label="密保答案">
<a-input v-model="form.name" placeholder="请输入密保答案" />
</a-form-item>
<a-form-item field="name" label="安全手机">
<a-input v-model="form.name" placeholder="请输入安全手机" />
</a-form-item>
<a-form-item field="name" label="安全邮箱">
<a-input v-model="form.name" placeholder="请输入安全邮箱" />
</a-form-item>
<a-form-item>
<a-button>提交</a-button>
</a-form-item>
</a-form>
</a-col>
<a-col :span="24">
<div class="row-title">实名认证</div>
<a-space direction="vertical" size="large">
<a-descriptions :data="data" :column="3" :align="{ label: 'right' }" table-layout="fixed" />
</a-space>
</a-col>
<a-col :span="24">
<div class="row-title">认证记录</div>
<a-table :columns="tableColumns" :data="tableData" size="small">
<template #optional>
<a-space>
<a-button size="mini" type="text">查看</a-button>
<a-button size="mini" type="text">撤回</a-button>
</a-space>
</template>
</a-table>
</a-col>
</a-row> </a-row>
</div> </div>
</template> </template>
@ -67,9 +129,66 @@ const data = ref([
} }
]); ]);
const tableColumns = ref([
{
title: "认证类型",
dataIndex: "authenticationType"
},
{
title: "认证内容",
dataIndex: "authenticationContent"
},
{
title: "当前状态",
dataIndex: "status"
},
{
title: "创建时间",
dataIndex: "createTime"
},
{
title: "操作",
dataIndex: "operation",
slotName: "optional",
fixed: "right",
width: 200
}
]);
const tableData = reactive([
{
key: "1",
authenticationType: "证件认证",
authenticationContent: "实名认证，鉴定信息",
status: "1",
createTime: "2024-06-20"
},
{
key: "2",
authenticationType: "证件认证",
authenticationContent: "实名认证，鉴定信息",
status: "0",
createTime: "2024-06-20"
},
{
key: "3",
authenticationType: "证件认证",
authenticationContent: "实名认证，鉴定信息",
status: "1",
createTime: "2024-06-20"
}
]);
const toast = () => { const toast = () => {
proxy.$message.info("修改头像"); proxy.$message.info("修改头像");
}; };
const form = ref({
name: ""
});
</script> </script>
<style lang="scss" scoped></style> <style lang="scss" scoped>
.row-title {
font-size: $font-size-title-1;
}
</style>