From 07347cba09af19d7fd6c977059a08d4addff8da3 Mon Sep 17 00:00:00 2001 From: callmeyan Date: Mon, 21 Aug 2023 23:45:47 +0800 Subject: [PATCH] =?UTF-8?q?=E7=90=86=E9=A1=BA=E6=A1=86=E6=9E=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- front/assets/global.scss | 59 +++++++++++++++++++++--- front/components/LoginComponent.tsx | 7 ++- front/pages/Router.tsx | 1 - front/pages/index/index.module.scss | 15 ++++-- front/pages/index/index.tsx | 71 ++++++++++++++++++++++++++++- front/service/request.ts | 4 +- front/service/user.ts | 4 +- front/store/userinfoStore.ts | 3 +- service/core/server.ts | 3 +- service/routes/index.ts | 5 +- service/service/mysql.ts | 16 +++++-- test/db.test.ts | 4 +- test/server.ts | 7 +-- tsconfig.json | 3 +- vite.config.ts | 9 ++-- 15 files changed, 174 insertions(+), 37 deletions(-) diff --git a/front/assets/global.scss b/front/assets/global.scss index 1493ca5..bfe910e 100644 --- a/front/assets/global.scss +++ b/front/assets/global.scss @@ -1,3 +1,56 @@ +/* http://meyerweb.com/eric/tools/css/reset/ + v5.0.1 | 20191019 + License: none (public domain) +*/ + +html, body, div, span, applet, object, iframe, +h1, h2, h3, h4, h5, h6, p, blockquote, pre, +a, abbr, acronym, address, big, cite, code, +del, dfn, em, img, ins, kbd, q, s, samp, +small, strike, strong, sub, sup, tt, var, +b, u, i, center, +dl, dt, dd, ol, ul, li, +fieldset, form, label, legend, +table, caption, tbody, tfoot, thead, tr, th, td, +article, aside, canvas, details, embed, +figure, figcaption, footer, header, hgroup, +main, menu, nav, output, ruby, section, summary, +time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} +/* HTML5 display-role reset for older browsers */ +article, aside, details, figcaption, figure, +footer, header, hgroup, main, menu, nav, section { + display: block; +} +/* HTML5 hidden-attribute fix for newer browsers */ +*[hidden] { + display: none; +} +body { + line-height: 1; +} +menu, ol, ul { + list-style: none; +} +blockquote, q { + quotes: none; +} +blockquote:before, blockquote:after, +q:before, q:after { + content: ''; + content: none; +} +table { + border-collapse: collapse; + border-spacing: 0; +} + :root { --max-width: 1100px; --border-radius: 12px; @@ -73,12 +126,6 @@ } } -* { - box-sizing: border-box; - padding: 0; - margin: 0; -} - html, body { max-width: 100vw; diff --git a/front/components/LoginComponent.tsx b/front/components/LoginComponent.tsx index 7584bf5..314cd94 100644 --- a/front/components/LoginComponent.tsx +++ b/front/components/LoginComponent.tsx @@ -85,7 +85,10 @@ export const LoginComponent = () => { {/* */} {/**/} - {visible?'xxx':'0000'} - + {visible ? 'xxx' : '0000'} + ) } diff --git a/front/pages/Router.tsx b/front/pages/Router.tsx index fe83583..8088a39 100644 --- a/front/pages/Router.tsx +++ b/front/pages/Router.tsx @@ -25,7 +25,6 @@ export const AppRouter = () => (
}/> - }/>
diff --git a/front/pages/index/index.module.scss b/front/pages/index/index.module.scss index 9e98a85..04262da 100644 --- a/front/pages/index/index.module.scss +++ b/front/pages/index/index.module.scss @@ -1,9 +1,18 @@ -.index{ +.index { display: flex; align-items: center; justify-content: center; height: 100vh; } -.modal{ - +.title{ + font-size: 20px; + font-weight: 700; + color: #333; + margin-bottom: 20px; +} +.loginWrapper { + background-color: #fff; + padding: 15px 20px; + border-radius: 6px; + width: 350px; } diff --git a/front/pages/index/index.tsx b/front/pages/index/index.tsx index f6de4dd..da9952c 100644 --- a/front/pages/index/index.tsx +++ b/front/pages/index/index.tsx @@ -1,10 +1,77 @@ -import React from "react"; +import React, {useRef, useState} from "react"; +import {IconGithubLogo, IconWeibo} from "@douyinfe/semi-icons"; import css from './index.module.scss' import {LoginComponent} from "../../components/LoginComponent.tsx"; +import {useNavigate} from "react-router-dom"; +import {useUserinfoStore} from "../../store/userinfoStore.ts"; +import {Button, Divider, Form, Modal, Notification, Space} from "@douyinfe/semi-ui"; +import {cx} from "@emotion/css"; const DefaultPage: React.FC = () => { + + const [loading, setLoading] = useState(false); + const navigate = useNavigate(); + const {login} = useUserinfoStore() + + const onFinish = async (values: any) => { + setLoading(true); + try { + const user = await login(values) + setVisible(true); + navigate('/dashboard') + } catch (err) { + // 登录失败 + console.log(err) + // 登录失败 + Notification.error({ + content: '登录失败，请检查用户名和密码' + }) + } + setLoading(false); + }; + + const [visible, setVisible] = useState(false); + const hideModal = () => setVisible(false) + return (
- + {/**/} +
+

登录

+
+ + + 下次自动登录 +
+ +
+ +
+ OR +
+ + + + +
+
+
); } export default DefaultPage; diff --git a/front/service/request.ts b/front/service/request.ts index 3933585..9e3eaa5 100644 --- a/front/service/request.ts +++ b/front/service/request.ts @@ -35,7 +35,7 @@ Axios.interceptors.request.use(config => { const token = Storage.get(APP_CONFIG.LOGIN_TOKEN_KEY) // const {token} = useUserinfoStore() if (token) { - config.headers['Authorization'] = `Bearer ${token}`; + config.headers['Authorization'] = `${token}`; // Bearer } if (config.data && config.data instanceof FormData) { config.headers['Content-Type'] = 'multipart/form-data'; @@ -81,7 +81,7 @@ export function request(url: string, method: RequestMethod, data: any = null, if (code == 403) { const state = useUserinfoStore.getState() // 未登录 显示登录modal - state.showLogin(true); + // state.showLogin(true); } reject(new BizError(msg, code)) } diff --git a/front/service/user.ts b/front/service/user.ts index f059eed..6ca1d61 100644 --- a/front/service/user.ts +++ b/front/service/user.ts @@ -2,8 +2,8 @@ import {get, post} from "./request.ts"; import {UserModel} from "../../model"; -export function login(user: string, password: string) { - return post('/api/user/info', {user, password}) +export function login(username: string, password: string) { + return post('/api/user/login', {username, password}) } export function getInfo() { diff --git a/front/store/userinfoStore.ts b/front/store/userinfoStore.ts index a7774a6..8495d64 100644 --- a/front/store/userinfoStore.ts +++ b/front/store/userinfoStore.ts @@ -74,8 +74,7 @@ export const useUserinfoStore = create<{ }, login: (data) => { return new Promise((resolve, reject) => { - const promise = login(data.account, data.password); - promise.then((ret) => { + login(data.account, data.password).then((ret) => { const token = ret.token; Storage.put(LOGIN_TOKEN_KEY, token) getInfo().then(userinfo => { diff --git a/service/core/server.ts b/service/core/server.ts index 802b4a1..908628b 100644 --- a/service/core/server.ts +++ b/service/core/server.ts @@ -1,6 +1,7 @@ import { InitServerOption } from "./types"; // import { createServer as createServerOrigin } from "http"; -import express = require("express"); +// import express = require("express"); +import * as express from "express"; export function createServer(options: Partial, callback?: () => void) { // 创建express服务器 diff --git a/service/routes/index.ts b/service/routes/index.ts index fab246c..34b2561 100644 --- a/service/routes/index.ts +++ b/service/routes/index.ts @@ -2,7 +2,7 @@ import {Application, Request, Response} from "express"; import {RouteHandleFunction, RouteHandleFunctionParam} from "../core/types"; import {home} from "./home"; import {appList, reportToServer, appEvent, eventData} from "./reportor"; -import {loginHandler} from "./user.ts"; +import {getUserInfo, loginHandler} from "./user.ts"; // function createRoute(handler: RouteHandleFunction) { @@ -28,5 +28,6 @@ export function initRoutes(app: Application) { app.all('/api/app/list', createRoute(appList)) app.all('/api/app/event', createRoute(appEvent)) app.all('/api/app/event-data', createRoute(eventData)) - app.all('/api/login', createRoute(loginHandler)) + app.all('/api/user/login', createRoute(loginHandler)) + app.all('/api/user/info', createRoute(getUserInfo)) } diff --git a/service/service/mysql.ts b/service/service/mysql.ts index 3b111ed..32ed3f8 100644 --- a/service/service/mysql.ts +++ b/service/service/mysql.ts @@ -1,5 +1,5 @@ -import { createPool } from 'mysql' -import { DB_CONFIG } from './../config'; +import {createPool} from 'mysql' +import {DB_CONFIG} from './../config'; export const pool = createPool({ ...DB_CONFIG, @@ -30,19 +30,23 @@ export async function selectArray(sql: string, params: any = null) { // }) // }); } + // 查询单个对象 export async function selectOne(sql: string, params: any = null) { // 执行查询sql并返回查询结果 const arr = await selectArray(sql, params); - if (arr.length != 1) throw new Error("查询结果数量不等于1"); - return arr[0]; + // if (arr.length != 1) throw new Error("查询结果数量不等于1"); + return arr.length > 0 ? arr[0] : null; } + // 统计数据 export async function queryCount(sql: string, params: any = null) { const obj = await selectOne<{ [key: string]: number }>(sql, params); + if(!obj) return 0; const keys = Object.keys(obj); return obj[keys[0]]; } + // 根据表名和条件判断数据是否存在 export async function isExistByTable(tableName: string, condition: any = {}) { let sql = `select count(*) as count from ${tableName} where 1=1`; @@ -54,10 +58,12 @@ export async function isExistByTable(tableName: string, condition: any = {}) { const count = await queryCount(sql, params); return count > 0; } + export async function isExist(sql: string, params: any) { const count = await queryCount(sql, params); return count > 0; } + // 查询多条数据 function executeSQL(sql: string, params: any) { @@ -76,10 +82,12 @@ export async function execute(sql: string, params: any = null) { const ret = await executeSQL<{ affectedRows: number }>(sql, params) return ret.affectedRows } + export async function insertAndGetInsertId(tableName: string, data: any = null) { const ret = await executeSQL<{ insertId: number }>(`insert into \`${tableName}\` set ?`, data) return ret.insertId } + export default { selectArray, executeSQL, diff --git a/test/db.test.ts b/test/db.test.ts index b6b58fe..1f74d61 100644 --- a/test/db.test.ts +++ b/test/db.test.ts @@ -1,4 +1,4 @@ -import { execute, selectArray, pool, queryCount } from './../src/service/mysql' +import { execute, selectArray, pool, queryCount } from './../service/service/mysql' // 使用execute执行更新数据 describe('Database', () => { @@ -25,4 +25,4 @@ describe('Database', () => { const count = await queryCount('select count(*) from user'); console.log('total:', count); }) -}) \ No newline at end of file +}) diff --git a/test/server.ts b/test/server.ts index fb64891..010cb60 100644 --- a/test/server.ts +++ b/test/server.ts @@ -1,5 +1,6 @@ -import { Test } from 'supertest'; -import { PORT } from './../config' +import {Test} from 'supertest'; +import {PORT} from './../service/config' + const request = require("supertest"); // import { createServer } from './../src/core/server' @@ -12,4 +13,4 @@ const request = require("supertest"); // initRoutes(app) export const createRequest = () => request(`http://localhost:${PORT}`) -export const get = (path: string): Test => createRequest().get(path) \ No newline at end of file +export const get = (path: string): Test => createRequest().get(path) diff --git a/tsconfig.json b/tsconfig.json index 1d5737f..b636812 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,8 +1,9 @@ { "compilerOptions": { + /* ESNext */ "target": "ESNext", "lib": ["DOM", "DOM.Iterable", "ESNext"], - "module": "CommonJS", + "module": "commonjs", "skipLibCheck": true, /* Bundler mode */ diff --git a/vite.config.ts b/vite.config.ts index 735d488..1d5acce 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -12,11 +12,12 @@ export default defineConfig(({mode}) => { '@/': '/front/' } }, - define: { - buildVersion: JSON.stringify((new Date()).toLocaleString()), - mode:JSON.stringify(mode), - }, + // define: { + // buildVersion: JSON.stringify((new Date()).toLocaleString()), + // mode:JSON.stringify(mode), + // }, build: { + outDir:'static', // 小于10kb直接base64 assetsInlineLimit: 10240, rollupOptions: {