|
@@ -0,0 +1,182 @@
|
|
|
+<template>
|
|
|
+ <view class="register-container">
|
|
|
+ <!-- 标题和进度 -->
|
|
|
+ <navBar title="创建账号密码2/2" color="#000" />
|
|
|
+ <view class="progress-box">
|
|
|
+ <view class="progress-item"></view>
|
|
|
+ <view class="progress-item"></view>
|
|
|
+ </view>
|
|
|
+ <!-- 表单区域 -->
|
|
|
+ <view class="register-form">
|
|
|
+ <!-- 密码输入 -->
|
|
|
+ <view class="form-item">
|
|
|
+ <view class="item-label"> 密码 </view>
|
|
|
+ <u-input
|
|
|
+ placeholder="请输入密码"
|
|
|
+ v-model="password"
|
|
|
+ clearable
|
|
|
+ type="password"
|
|
|
+ maxlength="20"
|
|
|
+ class="custom-input"
|
|
|
+ >
|
|
|
+ </u-input>
|
|
|
+ </view>
|
|
|
+ <u-button
|
|
|
+ type="primary"
|
|
|
+ :disabled="!canNext"
|
|
|
+ @click="handleNext"
|
|
|
+ :customStyle="{
|
|
|
+ marginTop: '32rpx',
|
|
|
+ height: '90rpx',
|
|
|
+ fontSize: '32rpx',
|
|
|
+ borderRadius: '100rpx',
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ 继续
|
|
|
+ </u-button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import navBar from "@/components/nav-bar/index.vue";
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ };
|
|
|
+ },
|
|
|
+ components: {
|
|
|
+ navBar,
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+
|
|
|
+
|
|
|
+ // 是否可以下一步
|
|
|
+ canNext() {
|
|
|
+ return (
|
|
|
+ this.canGetCode &&
|
|
|
+ this.verificationCode.length === 6 &&
|
|
|
+ /^\d{6}$/.test(this.verificationCode)
|
|
|
+ );
|
|
|
+ },
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+
|
|
|
+
|
|
|
+ // 下一步
|
|
|
+ handleNext() {
|
|
|
+ if (!this.validateForm()) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ uni.showLoading({
|
|
|
+ title: "验证中...",
|
|
|
+ mask: true,
|
|
|
+ });
|
|
|
+
|
|
|
+ // 模拟验证码验证
|
|
|
+ setTimeout(() => {
|
|
|
+ uni.hideLoading();
|
|
|
+
|
|
|
+ // 这里应该是验证码验证逻辑
|
|
|
+ if (this.verificationCode === "123456") {
|
|
|
+ // 模拟固定验证码
|
|
|
+ uni.showToast({
|
|
|
+ title: "验证成功",
|
|
|
+ icon: "success",
|
|
|
+ });
|
|
|
+
|
|
|
+ // 跳转到下一步(注册2/2)
|
|
|
+ setTimeout(() => {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pages/my/jobApplicant/password?phone=${this.phoneNumber}`,
|
|
|
+ });
|
|
|
+ }, 1000);
|
|
|
+ } else {
|
|
|
+ uni.showToast({
|
|
|
+ title: "验证码错误",
|
|
|
+ icon: "none",
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }, 1500);
|
|
|
+ },
|
|
|
+
|
|
|
+ // 表单验证
|
|
|
+ validateForm() {
|
|
|
+ if (!this.password) {
|
|
|
+ uni.showToast({
|
|
|
+ title: "请输入密码",
|
|
|
+ icon: "none",
|
|
|
+ });
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+
|
|
|
+ return true;
|
|
|
+ },
|
|
|
+ },
|
|
|
+
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+.register-container {
|
|
|
+ background: #fff;
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ top: 0;
|
|
|
+ bottom: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.register-form {
|
|
|
+ padding: 32rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.form-item {
|
|
|
+ margin-bottom: 32rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.item-label {
|
|
|
+ color: rgba(18, 26, 44, 1);
|
|
|
+ font-family: Roboto;
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ line-height: 51.2rpx;
|
|
|
+ letter-spacing: 0px;
|
|
|
+ text-align: left;
|
|
|
+ padding-bottom: 6rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.custom-input {
|
|
|
+ box-sizing: border-box;
|
|
|
+ border: 2rpx solid rgba(158, 161, 168, 1);
|
|
|
+ border-radius: 24rpx;
|
|
|
+ background: rgba(255, 255, 255, 1);
|
|
|
+ padding: 8rpx 24rpx !important;
|
|
|
+}
|
|
|
+.input-box {
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.next-btn-active {
|
|
|
+ background: #2979ff;
|
|
|
+}
|
|
|
+::v-deep .u-input {
|
|
|
+ text-align: left !important;
|
|
|
+}
|
|
|
+.progress-box {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ gap: 24rpx;
|
|
|
+ padding-top: 40rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ .progress-item {
|
|
|
+ width: 40rpx;
|
|
|
+ height: 8rpx;
|
|
|
+ background-color: #016bf6;
|
|
|
+ border-radius: 40rpx;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|