From a7a7bf7a0f446fe882bed1e879ca36c0a743e5ce Mon Sep 17 00:00:00 2001
From: zyh <zyh320888@vip.qq.com>
Date: Tue, 22 Oct 2024 03:45:21 +0000
Subject: [PATCH] =?UTF-8?q?feat:=20=E7=A7=BB=E9=99=A4=E6=89=8B=E6=9C=BA?=
 =?UTF-8?q?=E5=8F=B7=E9=AA=8C=E8=AF=81=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/auth/Login.tsx                 | 12 +----------
 app/components/auth/Register.tsx              | 12 +----------
 app/routes/api/auth/login.ts                  |  1 +
 app/routes/api/auth/register.ts               |  1 +
 app/utils/db.server.ts                        | 11 +++++-----
 .../20241022114400_modify_users_table.js      | 21 +++++++++++++++++++
 6 files changed, 31 insertions(+), 27 deletions(-)
 create mode 100644 app/routes/api/auth/login.ts
 create mode 100644 app/routes/api/auth/register.ts
 create mode 100644 db/migrations/20241022114400_modify_users_table.js

diff --git a/app/components/auth/Login.tsx b/app/components/auth/Login.tsx
index 72e960c..6103ba1 100644
--- a/app/components/auth/Login.tsx
+++ b/app/components/auth/Login.tsx
@@ -1,19 +1,13 @@
 import React, { useState } from 'react';
 import { useNavigate } from '@remix-run/react';
-import { validatePhoneNumber } from '~/utils/validation';
 
 export function Login() {
   const [phone, setPhone] = useState('');
   const [password, setPassword] = useState('');
-  const [phoneError, setPhoneError] = useState('');
   const navigate = useNavigate();
 
   const handleSubmit = async (e: React.FormEvent) => {
     e.preventDefault();
-    if (!validatePhoneNumber(phone)) {
-      setPhoneError('请输入有效的手机号码');
-      return;
-    }
     try {
       const response = await fetch('/api/auth/login', {
         method: 'POST',
@@ -42,14 +36,10 @@ export function Login() {
           type="tel"
           id="phone"
           value={phone}
-          onChange={(e) => {
-            setPhone(e.target.value);
-            setPhoneError('');
-          }}
+          onChange={(e) => setPhone(e.target.value)}
           required
           className="mt-1 block w-full px-3 py-2 bg-bolt-elements-background-depth-1 border border-bolt-elements-borderColor rounded-md shadow-sm focus:outline-none focus:ring-bolt-elements-button-primary-background focus:border-bolt-elements-button-primary-background"
         />
-        {phoneError && <p className="mt-2 text-sm text-red-600">{phoneError}</p>}
       </div>
       <div>
         <label htmlFor="password" className="block text-sm font-medium text-bolt-elements-textPrimary">
diff --git a/app/components/auth/Register.tsx b/app/components/auth/Register.tsx
index 1ac731c..fffa270 100644
--- a/app/components/auth/Register.tsx
+++ b/app/components/auth/Register.tsx
@@ -1,20 +1,14 @@
 import React, { useState } from 'react';
 import { useNavigate } from '@remix-run/react';
-import { validatePhoneNumber } from '~/utils/validation';
 
 export function Register() {
   const [phone, setPhone] = useState('');
   const [password, setPassword] = useState('');
   const [confirmPassword, setConfirmPassword] = useState('');
-  const [phoneError, setPhoneError] = useState('');
   const navigate = useNavigate();
 
   const handleSubmit = async (e: React.FormEvent) => {
     e.preventDefault();
-    if (!validatePhoneNumber(phone)) {
-      setPhoneError('请输入有效的手机号码');
-      return;
-    }
     if (password !== confirmPassword) {
       alert('两次输入的密码不一致');
       return;
@@ -45,14 +39,10 @@ export function Register() {
           type="tel"
           id="phone"
           value={phone}
-          onChange={(e) => {
-            setPhone(e.target.value);
-            setPhoneError('');
-          }}
+          onChange={(e) => setPhone(e.target.value)}
           required
           className="mt-1 block w-full px-3 py-2 bg-bolt-elements-background-depth-1 border border-bolt-elements-borderColor rounded-md shadow-sm focus:outline-none focus:ring-bolt-elements-button-primary-background focus:border-bolt-elements-button-primary-background"
         />
-        {phoneError && <p className="mt-2 text-sm text-red-600">{phoneError}</p>}
       </div>
       <div>
         <label htmlFor="password" className="block text-sm font-medium text-bolt-elements-textPrimary">
diff --git a/app/routes/api/auth/login.ts b/app/routes/api/auth/login.ts
new file mode 100644
index 0000000..0519ecb
--- /dev/null
+++ b/app/routes/api/auth/login.ts
@@ -0,0 +1 @@
+ 
\ No newline at end of file
diff --git a/app/routes/api/auth/register.ts b/app/routes/api/auth/register.ts
new file mode 100644
index 0000000..0519ecb
--- /dev/null
+++ b/app/routes/api/auth/register.ts
@@ -0,0 +1 @@
+ 
\ No newline at end of file
diff --git a/app/utils/db.server.ts b/app/utils/db.server.ts
index 615669a..a65258e 100644
--- a/app/utils/db.server.ts
+++ b/app/utils/db.server.ts
@@ -1,5 +1,6 @@
 import knex from 'knex';
 import type { Knex } from 'knex';
+import { env } from 'node:process';
 
 let db: Knex;
 
@@ -21,11 +22,11 @@ function getDb() {
   return knex({
     client: 'mysql2',
     connection: {
-      host: process.env.DB_HOST,
-      user: process.env.DB_USER,
-      password: process.env.DB_PASSWORD,
-      database: process.env.DB_NAME,
-      port: Number(process.env.DB_PORT) || 3306,
+      host: env.DB_HOST,
+      user: env.DB_USER,
+      password: env.DB_PASSWORD,
+      database: env.DB_NAME,
+      port: Number(env.DB_PORT) || 3306,
     },
     pool: {
       min: 2,
diff --git a/db/migrations/20241022114400_modify_users_table.js b/db/migrations/20241022114400_modify_users_table.js
new file mode 100644
index 0000000..4ad7543
--- /dev/null
+++ b/db/migrations/20241022114400_modify_users_table.js
@@ -0,0 +1,21 @@
+export function up(knex) {
+  return knex.schema.alterTable('users', function(table) {
+    // 修改手机号为必填
+    table.string('phone', 20).notNullable().alter();
+    
+    // 修改用户名为选填
+    table.string('username', 255).nullable().alter();
+    
+    // 修改电子邮箱为选填
+    table.string('email', 255).nullable().alter();
+  });
+}
+
+export function down(knex) {
+  return knex.schema.alterTable('users', function(table) {
+    // 恢复原来的设置
+    table.string('phone', 20).nullable().alter();
+    table.string('username', 255).notNullable().alter();
+    table.string('email', 255).notNullable().alter();
+  });
+}