添加注册

api/login.js

@@ -46,6 +46,7 @@ export function logout() {
   })
 }
 
+
 // 获取验证码
 export function getCodeImg() {
   return request({
@@ -56,4 +57,64 @@ export function getCodeImg() {
     method: 'get',
     timeout: 20000
   })
+}
+
+export function sendEmailCode(data, type = 'register') {
+  return request({
+    url: `/auth/mail/send/${type}`,
+    headers: {
+      isToken: false
+    },
+    method: 'post',
+    timeout: 20000,
+    data,
+    params: {
+      autoRegister: data.autoRegister
+    },
+  })
+}
+
+export function verifyEmailCode(data, type = 'register') {
+  return request({
+    url: `/auth/mail/verify/${type}`,
+    headers: {
+      isToken: false
+    },
+    method: 'post',
+    timeout: 20000,
+    data,
+    params: {
+      autoRegister: data.autoRegister
+    },
+  })
+}
+
+export function sendPhoneCode(data, type = 'register') {
+  return request({
+    url: `/auth/dySms/send/${type}`,
+    headers: {
+      isToken: false
+    },
+    method: 'post',
+    timeout: 20000,
+    data,
+    params: {
+      autoRegister: data.autoRegister
+    },
+  })
+}
+
+export function verifyPhoneCode(data, type = 'register') {
+  return request({
+    url: `/auth/dySms/verify/${type}`,
+    headers: {
+      isToken: false
+    },
+    method: 'post',
+    timeout: 20000,
+    data,
+    params: {
+      autoRegister: data.autoRegister
+    },
+  })
 }

api/system/user.js

@@ -1,6 +1,50 @@
 import upload from '@/utils/upload'
 import request from '@/utils/request'
 
+// 查询用户列表
+export function listUser(query) {
+  return request({
+    url: '/system/user/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询用户详细
+export function getUser(userId) {
+  return request({
+    url: '/system/user/' + parseStrEmpty(userId),
+    method: 'get'
+  })
+}
+
+// 新增用户
+export function addUser(data) {
+  return request({
+    url: '/system/user',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改用户
+export function updateUser(data) {
+  return request({
+    url: '/system/user',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除用户
+export function delUser(userId) {
+  return request({
+    url: '/system/user/' + userId,
+    method: 'delete'
+  })
+}
+
+
 // 用户密码重置
 export function updateUserPwd(oldPassword, newPassword) {
   const data = {
@@ -39,3 +83,29 @@ export function uploadAvatar(data) {
     filePath: data.filePath
   })
 }
+
+// 用户密码重置
+export function resetUserPwd(userId, password) {
+  const data = {
+    userId,
+    password
+  }
+  return request({
+    url: '/system/user/resetPwd',
+    method: 'put',
+    data: data
+  })
+}
+
+// 用户状态修改
+export function changeUserStatus(userId, status) {
+  const data = {
+    userId,
+    status
+  }
+  return request({
+    url: '/system/user/changeStatus',
+    method: 'put',
+    data: data
+  })
+}

pages.json

@@ -60,11 +60,17 @@
       "root": "pages_mine/pages",
       "pages": [
         {
-          "path": "avatar/index",
+          "path": "register/index",
           "style": {
-            "navigationBarTitleText": "修改头像"
+            "navigationBarTitleText": "注册账号"
           }
         },
+		{
+		  "path": "avatar/index",
+		  "style": {
+		    "navigationBarTitleText": "修改头像"
+		  }
+		},
         {
           "path": "info/index",
           "style": {

pages/login.vue

@@ -23,7 +23,7 @@ const loginForm = ref({
 });
 
 function handleLoginByWx() {
-  getWxCode().then(res => {
+  getWxCode("__UNI__A6541FF").then(res => {
     console.log(res);
     wxLogin('miniapp', res).then(res => {
       if (res.token != null) {
@@ -102,7 +102,7 @@ getCode();
     <view class="logo-content align-center justify-center flex">
       <image style="width: 100rpx;height: 100rpx;" :src="globalConfig.appInfo.logo" mode="widthFix">
       </image>
-      <text class="title">若依移动端登录</text>
+      <text class="title">登录</text>
     </view>
     <view class="login-form-content">
       <view class="input-item flex align-center">
@@ -126,6 +126,11 @@ getCode();
           class="login-btn cu-btn block bg-green lg round">微信一键登录</button>
       </view>
     </view>
+	
+	<view class="register-link"  >
+	  <text class="question-text">没有账号？</text>
+	  <navigator class="link-type" url="/pages_mine/pages/register/index">立即注册</navigator>
+	</view>
 
     <view class="xieyi text-center">
       <text class="text-grey1">登录即代表同意</text>
@@ -216,4 +221,46 @@ page {
     }
   }
 }
+.register-link {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin-top: 5px;
+   margin-bottom: 15px;
+
+  .question-text {
+    color: #606266;
+    margin-right: 8px;
+    font-size: 14px;
+  }
+
+  .link-type {
+    color: #409EFF;
+    text-decoration: none;
+    font-weight: 500;
+    font-size: 14px;
+    position: relative;
+    transition: all 0.3s ease;
+
+    &::after {
+      content: '';
+      position: absolute;
+      bottom: -2px;
+      left: 0;
+      width: 0;
+      height: 2px;
+      background-color: #409EFF;
+      transition: width 0.3s ease;
+    }
+
+    &:hover {
+      color: #66b1ff;
+
+      &::after {
+        width: 100%;
+      }
+    }
+  }
+}
+
 </style>

pages_mine/pages/register/index.vue

@@ -0,0 +1,277 @@
+<script setup lang="ts">
+import { onMounted, ref } from "vue";
+import { getCodeImg, sendEmailCode, sendPhoneCode } from "@/api/login";
+import useUserStore from "@/store/modules/user";
+
+// 定义 props
+const props = defineProps<{
+  register: boolean;
+  captchaEnabled: boolean;
+  method: 'password' | 'phone' | 'email';
+}>();
+
+// 响应式数据
+const registerForm = ref({
+  username: "",
+  password: "",
+  confirmPassword: "",
+  email: '',
+  phonenumber: '',
+  code: "",
+  uuid: "",
+});
+
+const codeUrl = ref("");
+
+// 分开控制发送验证码和注册的 loading 状态
+const sendCodeLoading = ref(false);
+const registerLoading = ref(false);
+
+const registerRef = ref<any>(null);
+
+// 表单校验规则
+const registerRules = {
+  username: [
+    { required: true, message: "请输入您的账号", trigger: "blur" },
+    { min: 2, max: 20, message: "用户账号长度必须介于 2 和 20 之间", trigger: "blur" }
+  ],
+  password: [
+    { required: true, message: "请输入您的密码", trigger: "blur" },
+    { min: 5, max: 20, message: "用户密码长度必须介于 5 和 20 之间", trigger: "blur" },
+    { pattern: /^[^<>"'|\\]+$/, message: "不能包含非法字符：< > \" ' \\\ |", trigger: "blur" }
+  ],
+  confirmPassword: [
+    { required: true, message: "请再次输入您的密码", trigger: "blur" },
+    { 
+      validator: (rule: any, value: any, callback: any) => {
+        if (registerForm.value.password !== value) {
+          callback(new Error("两次输入的密码不一致"));
+        } else {
+          callback();
+        }
+      }, 
+      trigger: "blur" 
+    }
+  ],
+  code: [{ required: true, message: "请输入验证码", trigger: "change" }]
+};
+
+// 用户仓库
+const userStore = useUserStore();
+
+// 获取图形验证码
+function getCode() {
+  if (!props.captchaEnabled) return;
+  getCodeImg().then((res: any) => {
+    codeUrl.value = "data:image/gif;base64," + res.img;
+    registerForm.value.uuid = res.uuid;
+  });
+}
+
+// 发送验证码
+function sendCode() {
+  if (props.method === 'email') {
+    sendEmailCode(registerForm.value, 'register');
+  } else if (props.method === 'phone') {
+    sendPhoneCode(registerForm.value, 'register');
+  }
+}
+
+// 注册提交
+function handleRegister() {
+  registerRef.value.validate((valid: boolean) => {
+    if (valid) {
+      loading.value = true;
+      userStore.register(registerForm.value, props.method).then(() => {
+        uni.showModal({
+          title: "系统提示",
+          content: `<font color='red'>恭喜你，您的账号 ${registerForm.value.username} 注册成功！</font>`,
+          showCancel: false,
+          success: () => {
+            uni.redirectTo({
+              url: "/pages/login/login" // 跳转到登录页
+            });
+          }
+        });
+      }).catch(() => {
+        getCode();
+      }).finally(() => {
+        loading.value = false;
+      });
+    }
+  });
+}
+
+// 页面加载时获取验证码
+onMounted(() => {
+  getCode();
+});
+</script>
+
+<template>
+  <view class="register-container">
+    <uni-forms 
+      ref="registerRef" 
+      :model="registerForm" 
+      :rules="registerRules"
+      class="register-form"
+    >
+      <!-- 邮箱输入 -->
+      <uni-forms-item prop="email" v-if="method === 'email'">
+        <uni-easyinput 
+          v-model="registerForm.email" 
+          type="text" 
+          placeholder="邮箱"
+          prefixIcon="email"
+        />
+      </uni-forms-item>
+
+      <!-- 手机号输入 -->
+      <uni-forms-item prop="phonenumber" v-else-if="method === 'phone'">
+        <uni-easyinput 
+          v-model="registerForm.phonenumber" 
+          type="text" 
+          placeholder="手机号"
+          prefixIcon="phone"
+        />
+      </uni-forms-item>
+
+      <!-- 用户名输入 -->
+      <uni-forms-item prop="username" v-else>
+        <uni-easyinput 
+          v-model="registerForm.username" 
+          type="text" 
+          placeholder="账号"
+          prefixIcon="user"
+        />
+      </uni-forms-item>
+
+      <!-- 密码输入 -->
+      <uni-forms-item prop="password">
+        <uni-easyinput 
+          v-model="registerForm.password" 
+          type="password" 
+          placeholder="密码"
+          prefixIcon="lock"
+          @keyup.enter="handleRegister"
+        />
+      </uni-forms-item>
+
+      <!-- 确认密码输入 -->
+      <uni-forms-item prop="confirmPassword">
+        <uni-easyinput 
+          v-model="registerForm.confirmPassword" 
+          type="password" 
+          placeholder="确认密码"
+          prefixIcon="lock"
+          @keyup.enter="handleRegister"
+        />
+      </uni-forms-item>
+
+      <!-- 验证码输入 -->
+      <uni-forms-item prop="code">
+        <view class="code-input">
+          <uni-easyinput 
+            v-model="registerForm.code" 
+            type="text" 
+            placeholder="验证码"
+            prefixIcon="code"
+            @keyup.enter="handleRegister"
+          />
+          
+          <!-- 图形验证码或发送按钮 -->
+          <view class="code-action">
+            <uni-image 
+              v-if="captchaEnabled && method === 'password'"
+              :src="codeUrl" 
+              class="code-img" 
+              @click="getCode"
+              mode="aspectFill"
+            />
+            <uni-button 
+              v-else
+              type="primary" 
+              size="mini" 
+              @click="sendCode"
+              :loading="loading"
+            >
+              发送验证码
+            </uni-button>
+          </view>
+        </view>
+      </uni-forms-item>
+
+      <!-- 注册按钮 -->
+      <uni-forms-item>
+        <button 
+          type="primary" 
+          size="default" 
+          class="register-btn"
+          :loading="loading"
+          @click="handleRegister"
+        >
+          注册
+        </button>
+      </uni-forms-item>
+
+      <!-- 已有账号跳转 -->
+      <view class="login-link">
+        <text class="question-text">已有账号？</text>
+        <navigator url="/pages/login" class="link-type">立即登录</navigator>
+      </view>
+    </uni-forms>
+  </view>
+</template>
+
+<style scoped lang="scss">
+.register-container {
+  padding: 40rpx;
+}
+
+.register-form {
+  background-color: #fff;
+  padding: 60rpx;
+  border-radius: 16rpx;
+  box-shadow: 0 10rpx 30rpx rgba(0, 0, 0, 0.05);
+}
+
+.code-input {
+  display: flex;
+  align-items: center;
+  gap: 20rpx;
+}
+
+.code-action {
+  flex-shrink: 0;
+}
+
+.code-img {
+  width: 180rpx;
+  height: 70rpx;
+  border-radius: 8rpx;
+}
+
+.register-btn {
+  width: 100%;
+  height: 80rpx;
+  line-height: 80rpx;
+  font-size: 30rpx;
+  border-radius: 40rpx;
+  margin-top: 20rpx;
+}
+
+.login-link {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin-top: 40rpx;
+  font-size: 26rpx;
+  color: #666;
+}
+
+.link-type {
+  color: #007aff;
+  margin-left: 10rpx;
+  text-decoration: underline;
+}
+</style>