<script setup>
import {reactive} from "vue";
import XInput from "../../components/XInput.vue";
import XLink from "../../components/XLink.vue";
import {toPage} from "../../utils/uils.js";

const form = reactive({
    phone: null,
    verificationCode: null,
});
</script>

<template>
    <view class="!px-[34rpx] !flex flex-col gap-[40rpx]">
        <x-input v-model:model-value="form.phone" placeholder="请输入手机号"></x-input>
        <x-input v-model:model-value="form.verificationCode" placeholder="密码">
            <template #suffix>
                <x-link @click="toPage('/pages/forgotPassword/index')">忘记密码?</x-link>
            </template>
        </x-input>
        <tui-button class="!mt-[80rpx]">登录</tui-button>
        <tui-button @click="toPage('/pages/register/index')" class="!mt-[40rpx]" plain link>
            <image class="!h-[26rpx]" mode="heightFix" src="../../static/icons/去注册.png"></image>
        </tui-button>
    </view>
</template>

<style scoped>

</style>
