chore: update

This commit is contained in:
xiaoxian521 2024-04-11 10:43:28 +08:00
parent 02b2568427
commit cb9692b207
2 changed files with 41 additions and 33 deletions

View File

@ -1,42 +1,50 @@
<script setup lang="ts">
//
import { ref } from "vue";
import { message } from "@/utils/message";
const list = ref([
{
title: "账户密码",
illustrate: "当前密码强度:强",
button: "修改"
},
{
title: "密保手机",
illustrate: "已经绑定手机158****6789",
button: "修改"
},
{
title: "密保问题",
illustrate: "未设置密保问题,密保问题可有效保护账户安全",
button: "修改"
},
{
title: "备用邮箱",
illustrate: "已绑定邮箱pure***@163.com",
button: "修改"
}
]);
function onClick(item) {
console.log(item.title);
message("仅提供示例,请根据具体业务自行实现", { type: "success" });
}
</script>
<template>
<div class="ml-[120px] min-w-[180px] max-w-[70%]">
<h3 class="my-8">账户管理</h3>
<div class="flex items-center">
<div class="flex-1">
<p>账户密码</p>
<el-text class="mx-1" type="info">当前密码强度</el-text>
<div v-for="(item, index) in list" :key="index">
<div class="flex items-center">
<div class="flex-1">
<p>{{ item.title }}</p>
<el-text class="mx-1" type="info">{{ item.illustrate }}</el-text>
</div>
<el-button type="primary" text @click="onClick(item)">
{{ item.button }}
</el-button>
</div>
<el-button type="primary" text>修改</el-button>
</div>
<el-divider />
<div class="flex items-center">
<div class="flex-1">
<p>密保手机</p>
<el-text class="mx-1" type="info">已经绑定手机158****6789</el-text>
</div>
<el-button type="primary" text>修改</el-button>
</div>
<el-divider />
<div class="flex items-center">
<div class="flex-1">
<p>密保问题</p>
<el-text class="mx-1" type="info">
未设置密保问题密保问题可有效保护账户安全
</el-text>
</div>
<el-button type="primary" text>修改</el-button>
</div>
<el-divider />
<div class="flex items-center">
<div class="flex-1">
<p>备用邮箱</p>
<el-text class="mx-1" type="info">已绑定邮箱pure***@163.com</el-text>
</div>
<el-button type="primary" text>修改</el-button>
<el-divider />
</div>
</div>
</template>

View File

@ -16,7 +16,7 @@ const list = ref([
{
title: "待办任务",
illustrate: "待办任务将以站内信的形式通知",
checked: false
checked: true
}
]);