YY_MP_REFACTOR/src/pages/reset-password/index.vue

<template>
  <view class="auth-content">
    <wd-navbar fixed placeholder :title="title" left-arrow safeAreaInsetTop customClass="navbar" />
    <!-- 背景层 -->
    <view class="auth-bg"></view>
    <!-- 内容层 -->
    <view class="auth-body">
      <view class="auth-title"> 欢迎登录 </view>

      <!-- 表单（内部类名不动） -->
      <view class="auth-form">
        <form>
          <view class="form-item">
            <view class="form-label">账号</view>
            <view class="form-input">
              <input
                class="form-input-inner"
                type="number"
                focus
                maxlength="11"
                placeholder="请输入账号"
              />
            </view>
          </view>

          <view class="form-item">
            <view class="form-label">密码</view>
            <view class="form-input">
              <input class="form-input-inner" password placeholder="请输入密码" />
              <view class="forget-password" @click="forgetPassword">忘记密码？</view>
            </view>
          </view>

          <view class="form-item">
            <view class="form-label">验证码</view>
            <view class="form-input">
              <input class="form-input-inner" placeholder="请输入验证码" />
              <button class="get-code">发送验证码</button>
            </view>
          </view>
        </form>

        <view class="submit">
          <button class="submit-btn">确定</button>
        </view>
      </view>
    </view>
  </view>
</template>

<script setup lang="ts">
import projectConfig from '@/config/presets/index'
const { title } = projectConfig

const form = reactive({
  phone: '',
  password: '',
  code: '',
})

const forgetPassword = () => {
  console.log('cc')
}
</script>

<style lang="scss" scoped>
@import '@/styles/modules/auth-page.scss';
</style>