web-class-frontend/app/pages/login/components/ResetPart.vue

48 lines
2.0 KiB
Vue

<script setup lang="ts">
const store = useLoginStore();
const { currentType } = storeToRefs(store);
</script>
<template>
<div class="w-full">
<div
class="flex md:flex-row items-center md:justify-center w-full flex-col gap-4"
>
<div class="flex flex-col items-center gap-4">
<!-- <TInput class="w-56" placeholder="请输入邮箱" />-->
<!-- <TButton class="w-56">发送验证码</TButton>-->
<!-- <TInput class="w-56" placeholder="请输入验证码" />-->
<!-- <TInput class="w-56" type="password" placeholder="请输入新密码" />-->
<!-- <TButton class="w-56">确认</TButton>-->
<TInput class="w-56" placeholder="用户名" />
<TInput class="w-56" placeholder="旧密码" />
</div>
<div
class="hidden md:flex flex-col items-center gap-4 w-2/5 max-w-24 select-none"
>
<div class="w-1 h-44 bg-gray-200"></div>
<!-- <div-->
<!-- class="hidden absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 rounded-full border-4 border-gray-200 w-10 h-10 bg-loginBG"-->
<!-- >-->
<!--&lt;!&ndash; <span&ndash;&gt;-->
<!--&lt;!&ndash; class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 z-1"&ndash;&gt;-->
<!--&lt;!&ndash; >or&ndash;&gt;-->
<!--&lt;!&ndash; </span>&ndash;&gt;-->
<!-- </div>-->
</div>
<div class="flex flex-col items-center gap-4">
<TInput class="w-56" placeholder="新密码" />
<TInput class="w-56" placeholder="确认新密码" />
</div>
</div>
<div
class="flex flex-row items-center bg-gray-600 w-full h-10 justify-around rounded-b-md mt-4"
>
<button class="text-white" @click="store.register()">修改密码</button>
<button class="text-white" @click="currentType = PageType.login"
>返回登录
</button>
</div>
</div>
</template>