From 5f74ece29ef74cecc8fa91d578ee6c11ff545c23 Mon Sep 17 00:00:00 2001
From: kk <875203880@qq.com>
Date: Fri, 26 Jun 2026 18:12:26 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E7=94=A8=E6=88=B7=E6=B3=A8?=
 =?UTF-8?q?=E5=86=8C=E9=A1=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages.json                  |   6 +
 src/pages/register/register.vue | 324 ++++++++++++++++++++++++++++++++
 2 files changed, 330 insertions(+)
 create mode 100644 src/pages/register/register.vue

diff --git a/src/pages.json b/src/pages.json
index 3b246c0..0027213 100644
--- a/src/pages.json
+++ b/src/pages.json
@@ -1,5 +1,11 @@
 {
   "pages": [
+    {
+      "path": "pages/register/register",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
     {
       "path": "pages/index/scan",
       "style": {
diff --git a/src/pages/register/register.vue b/src/pages/register/register.vue
new file mode 100644
index 0000000..f74e765
--- /dev/null
+++ b/src/pages/register/register.vue
@@ -0,0 +1,324 @@
+<template>
+  <view class="register-page">
+    <!-- 顶部标题 -->
+    <view class="header">
+      <view class="title">用户注册</view>
+      <view class="subtitle">请输入手机号获取验证码完成注册</view>
+    </view>
+
+    <!-- 表单区域 -->
+    <view class="form-area">
+      <!-- 手机号 -->
+      <view class="input-group">
+        <view class="input-label">手机号</view>
+        <view class="input-wrapper">
+          <input
+            class="input-field"
+            type="number"
+            maxlength="11"
+            placeholder="请输入手机号"
+            placeholder-class="placeholder"
+            v-model="phone"
+          />
+        </view>
+      </view>
+
+      <!-- 验证码 -->
+      <view class="input-group">
+        <view class="input-label">验证码</view>
+        <view class="input-wrapper code-wrapper">
+          <input
+            class="input-field"
+            type="number"
+            maxlength="6"
+            placeholder="请输入验证码"
+            placeholder-class="placeholder"
+            v-model="code"
+          />
+          <view
+            class="code-btn"
+            :class="{ disabled: countdown > 0 }"
+            @click="handleGetCode"
+          >
+            {{ countdown > 0 ? countdown + 's' : '获取验证码' }}
+          </view>
+        </view>
+      </view>
+
+      <!-- 注册按钮 -->
+      <view class="submit-btn" :class="{ active: canSubmit }" @click="handleRegister">
+        注册
+      </view>
+    </view>
+
+    <!-- 底部协议 -->
+    <view class="agreement">
+      <text class="agreement-text">注册表示同意</text>
+      <text class="agreement-link" @click="showAgreement('user')">《用户协议》</text>
+      <text class="agreement-text">和</text>
+      <text class="agreement-link" @click="showAgreement('privacy')">《隐私政策》</text>
+    </view>
+  </view>
+</template>
+
+<script>
+import config from '@/config/env.js';
+import { post } from '@/utils/request.js';
+
+export default {
+  data() {
+    return {
+      phone: '',
+      code: '',
+      countdown: 0,
+      timer: null
+    };
+  },
+  computed: {
+    canSubmit() {
+      return this.phone.length === 11 && this.code.length >= 4;
+    }
+  },
+  beforeDestroy() {
+    // 清除定时器
+    if (this.timer) {
+      clearInterval(this.timer);
+      this.timer = null;
+    }
+  },
+  methods: {
+    // 获取验证码
+    async handleGetCode() {
+      if (this.countdown > 0) return;
+
+      // 验证手机号
+      if (!/^1[3-9]\d{9}$/.test(this.phone)) {
+        uni.showToast({ title: '请输入正确的手机号', icon: 'none' });
+        return;
+      }
+
+      try {
+        const res = await post('/auth/send-sms-code', {
+          phone: this.phone
+        });
+
+        const ret = res.data || {};
+        if (ret.code === 0) {
+          uni.showToast({ title: '验证码已发送', icon: 'success' });
+          this.startCountdown();
+        } else {
+          uni.showToast({ title: ret.message || '发送失败', icon: 'none' });
+        }
+      } catch (e) {
+        uni.showToast({ title: '网络请求失败', icon: 'none' });
+      }
+    },
+
+    // 开始倒计时
+    startCountdown() {
+      this.countdown = 60;
+      this.timer = setInterval(() => {
+        this.countdown--;
+        if (this.countdown <= 0) {
+          clearInterval(this.timer);
+          this.timer = null;
+        }
+      }, 1000);
+    },
+
+    // 注册
+    async handleRegister() {
+      if (!this.canSubmit) return;
+
+      // 验证手机号
+      if (!/^1[3-9]\d{9}$/.test(this.phone)) {
+        uni.showToast({ title: '请输入正确的手机号', icon: 'none' });
+        return;
+      }
+
+      // 验证验证码
+      if (this.code.length < 4) {
+        uni.showToast({ title: '请输入验证码', icon: 'none' });
+        return;
+      }
+
+      uni.showLoading({ title: '注册中...' });
+
+      try {
+        const res = await post('/auth/register', {
+          phone: this.phone,
+          code: this.code
+        });
+
+        const ret = res.data || {};
+        if (ret.code === 0) {
+          // 保存 token
+          const token = ret.data && ret.data.token;
+          if (token) {
+            uni.setStorageSync('token', token);
+          }
+
+          // 保存用户信息
+          const userInfo = ret.data && ret.data.userInfo;
+          if (userInfo) {
+            uni.setStorageSync('userInfo', userInfo);
+          }
+
+          uni.hideLoading();
+          uni.showToast({ title: '注册成功', icon: 'success' });
+
+          // 返回上一页或跳转首页
+          setTimeout(() => {
+            const pages = getCurrentPages();
+            if (pages.length > 1) {
+              uni.navigateBack();
+            } else {
+              uni.redirectTo({ url: '/pages/index/index' });
+            }
+          }, 1500);
+        } else {
+          uni.hideLoading();
+          uni.showToast({ title: ret.message || '注册失败', icon: 'none' });
+        }
+      } catch (e) {
+        uni.hideLoading();
+        uni.showToast({ title: '网络请求失败', icon: 'none' });
+      }
+    },
+
+    // 显示协议
+    showAgreement(type) {
+      const title = type === 'user' ? '用户协议' : '隐私政策';
+      uni.showToast({ title: title + '开发中', icon: 'none' });
+    }
+  }
+};
+</script>
+
+<style scoped>
+page {
+  height: 100%;
+  background-color: #fff;
+}
+
+.register-page {
+  min-height: 100vh;
+  background-color: #fff;
+  padding: 0 60rpx;
+}
+
+/* 顶部标题 */
+.header {
+  padding-top: 180rpx;
+  margin-bottom: 80rpx;
+}
+
+.title {
+  font-size: 48rpx;
+  font-weight: bold;
+  color: #333;
+  margin-bottom: 16rpx;
+}
+
+.subtitle {
+  font-size: 28rpx;
+  color: #999;
+}
+
+/* 表单区域 */
+.form-area {
+  width: 100%;
+}
+
+.input-group {
+  margin-bottom: 40rpx;
+}
+
+.input-label {
+  font-size: 28rpx;
+  color: #333;
+  margin-bottom: 16rpx;
+  font-weight: 500;
+}
+
+.input-wrapper {
+  display: flex;
+  align-items: center;
+  border-bottom: 2rpx solid #e5e5e5;
+  padding-bottom: 16rpx;
+}
+
+.input-field {
+  flex: 1;
+  height: 80rpx;
+  font-size: 32rpx;
+  color: #333;
+}
+
+.placeholder {
+  color: #ccc;
+  font-size: 32rpx;
+}
+
+/* 验证码输入框 */
+.code-wrapper {
+  position: relative;
+}
+
+.code-btn {
+  flex-shrink: 0;
+  font-size: 28rpx;
+  color: #2979ff;
+  padding: 12rpx 24rpx;
+  border: 2rpx solid #2979ff;
+  border-radius: 8rpx;
+  white-space: nowrap;
+}
+
+.code-btn.disabled {
+  color: #999;
+  border-color: #e5e5e5;
+}
+
+/* 注册按钮 */
+.submit-btn {
+  width: 100%;
+  height: 96rpx;
+  background: #e5e5e5;
+  border-radius: 48rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 32rpx;
+  color: #fff;
+  margin-top: 60rpx;
+  transition: all 0.3s;
+}
+
+.submit-btn.active {
+  background: linear-gradient(135deg, #2979ff, #1e60e0);
+  box-shadow: 0 8rpx 24rpx rgba(41, 121, 255, 0.4);
+}
+
+/* 底部协议 */
+.agreement {
+  position: absolute;
+  bottom: 80rpx;
+  left: 0;
+  right: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-wrap: wrap;
+}
+
+.agreement-text {
+  font-size: 24rpx;
+  color: #999;
+}
+
+.agreement-link {
+  font-size: 24rpx;
+  color: #2979ff;
+}
+</style>