lolosia/lolosia-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: lolosia:6c17f453a8457cbff411541d177a62bddcfd139b
Branches Tags
lolosia:master
..
compare: lolosia:12d3276679b8862aae8ab82d4feee99e43695460
Branches Tags
lolosia:master

10 Commits
6c17f453a8 ... 12d3276679

Author SHA1 Message Date
321zhangjvzhi 12d3276679 login页面 2024-04-02 15:38:17 +08:00
321zhangjvzhi 9d77f08b83 login页面 2024-04-02 15:28:49 +08:00
321zhangjvzhi dca7dc584d 尝试修复闪烁问题 2024-04-02 14:42:54 +08:00
321zhangjvzhi 0d3bcbef48 修正一个导入方式 2024-04-02 14:34:29 +08:00
321zhangjvzhi 8dfbd9b338 修正一个导入方式 2024-04-02 14:29:42 +08:00
321zhangjvzhi 6f6cb1977d 移除use-error-log 2024-04-02 13:55:36 +08:00
321zhangjvzhi 698757df92 修正baseUrl问题 2024-04-02 13:49:56 +08:00
321zhangjvzhi b6f3feac82 deploy.js 2024-03-31 14:15:21 +08:00
321zhangjvzhi bedba54805 vite.config.ts 2024-03-31 13:39:14 +08:00
321zhangjvzhi 69b789b546 deploy.js 2024-03-31 13:37:12 +08:00
16 changed files with 155 additions and 63 deletions
Show Stats Expand all files Collapse all files

1
.gitignore vendored
View File

@ -50,3 +50,4 @@ pnpm*
#components.d.ts #components.d.ts
stats.html stats.html
ts-out-dir ts-out-dir
archive.zip

6
deploy.js
View File

@ -105,16 +105,16 @@ async function main() {
// await exec(`unzip -O gbk ${archivePath} -d ${target}`) // await exec(`unzip -O gbk ${archivePath} -d ${target}`)
//} else { //} else {
await exec(`unzip ${archivePath} -d ${target}`) await exec(`unzip ${archivePath} -d ${target}`)
await exec(`mv ${target}/dist ${target}/iGame`) await exec(`mv ${target}/dist ${target}/home`)
//} //}
const nginxTarget = '/home/lolosia/nginx/home' const nginxTarget = '/usr/share/nginx/html'
console.log('移除旧目录 ...') console.log('移除旧目录 ...')
await sudo(`rm -rf ${nginxTarget}/${nginxContentPath}`) await sudo(`rm -rf ${nginxTarget}/${nginxContentPath}`)
console.log('复制文件 到指定目录 ...') console.log('复制文件 到指定目录 ...')
await sudo(`cp -r -f ${target}/* ${nginxTarget}`) await sudo(`cp -r -f ${target}/* ${nginxTarget}/home`)
await new Promise((r) => { await new Promise((r) => {
dialog.info(`你现在可以关闭终端，去做其他事情了`, `${nginxContentPath}项目部署完成！`, r) dialog.info(`你现在可以关闭终端，去做其他事情了`, `${nginxContentPath}项目部署完成！`, r)
}) })

2
index.html
View File

@ -8,6 +8,6 @@
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>
<script type="module" src="/src/main.ts"></script> <script type="module" src="/src/boot.ts"></script>
</body> </body>
</html> </html>

3
package.json
View File

@ -1,5 +1,5 @@
{ {
"name": "vue3-admin-plus", "name": "lolosia-web",
"version": "2.0.2", "version": "2.0.2",
"license": "MIT", "license": "MIT",
"author": "一七年夏", "author": "一七年夏",
@ -19,6 +19,7 @@
"vitest": "vitest --ui", "vitest": "vitest --ui",
"tsc-check": "tsc", "tsc-check": "tsc",
"coverage": "vitest run --coverage", "coverage": "vitest run --coverage",
"deploy": "node deploy.js",
"preinstall": "only-allow pnpm" "preinstall": "only-allow pnpm"
}, },
"dependencies": { "dependencies": {

5
src/App.vue
View File

@ -12,7 +12,6 @@ import { storeToRefs } from 'pinia/dist/pinia'
import { useRoute } from 'vue-router' import { useRoute } from 'vue-router'
import { useBasicStore } from '@/store/basic' import { useBasicStore } from '@/store/basic'
import { useConfigStore } from '@/store/config' import { useConfigStore } from '@/store/config'
import { useErrorLog } from '@/hooks/use-error-log'
//reshow default setting //reshow default setting
import { toggleHtmlClass } from '@/theme/utils' import { toggleHtmlClass } from '@/theme/utils'
@ -24,10 +23,6 @@ onBeforeMount(() => {
//set tmp token when setting isNeedLogin false //set tmp token when setting isNeedLogin false
if (!settings.value.isNeedLogin) useBasicStore().setToken(settings.value.tmpToken) if (!settings.value.isNeedLogin) useBasicStore().setToken(settings.value.tmpToken)
}) })
onMounted(() => {
//lanch the errorLog collection
useErrorLog()
})
const route = useRoute() const route = useRoute()
onMounted(() => { onMounted(() => {
const { setTheme, theme, setSize, size, setLanguage, language } = useConfigStore() const { setTheme, theme, setSize, size, setLanguage, language } = useConfigStore()

23
src/boot.ts Normal file
View File

@ -0,0 +1,23 @@
//@ts-ignore
import css from '@/styles/init.css?url'
//@ts-ignore
import logo from '@/icons/common/sidebar-logo.svg?url'
import settings from '@/settings'
document.querySelector('#app')!.innerHTML = `
<div class="__init__" style="display: none">
<link id="__init__" rel="stylesheet" href="${css}" />
<div class="__init__image">
<img src="${logo}" alt="" />
</div>
<div class="__init__title">${settings.title}</div>
<div class="__init__process-frame">
<div class="__init__progress">
<div class="__init__masker"></div>
</div>
</div>
</div>
`
;(async () => {
await import('./main')
})()

32
src/hooks/use-error-log.ts
View File

@ -1,32 +0,0 @@
/*js 错误日志收集*/
import { jsErrorCollection } from 'js-error-collection'
import pack from '../../package.json'
import settings from '@/settings'
import bus from '@/utils/bus'
import request from '@/utils/request'
const reqUrl = '/integration-front/errorCollection/insert'
const errorLogReq = (errLog: string) => {
request({
url: reqUrl,
data: {
pageUrl: window.location.href,
errorLog: errLog,
browserType: navigator.userAgent,
version: pack.version
},
method: 'post'
}).then(() => {
//通知错误列表页面更新数据
bus.emit('reloadErrorPage', {})
})
}
export const useErrorLog = () => {
//判断该环境是否需要收集错误日志,由settings配置决定
if (settings.errorLog?.includes(import.meta.env.VITE_APP_ENV)) {
jsErrorCollection({ runtimeError: true, rejectError: true, consoleError: true }, (errLog) => {
//判断是否是reqUrl错误，避免死循环
if (!errLog.includes(reqUrl)) errorLogReq(errLog)
})
}
}

5
src/settings.ts
View File

@ -1,7 +1,6 @@
import packageJson from '../package.json'
import type { SettingsConfig } from '~/basic' import type { SettingsConfig } from '~/basic'
export const settings: SettingsConfig = { export const settings: SettingsConfig = {
title: packageJson.name, title: '洛洛希雅的小网站',
/** /**
* @type {boolean} true | false * @type {boolean} true | false
* @description Whether show the logo in sidebar * @description Whether show the logo in sidebar
@ -87,7 +86,7 @@ export const settings: SettingsConfig = {
/* /*
* vite.config.js base config * vite.config.js base config
* */ * */
viteBasePath: '/vue-admin-plus/', viteBasePath: '/home/',
/* /*
* i18n setting default language * i18n setting default language

68
src/styles/init.css Normal file
View File

@ -0,0 +1,68 @@
.__init__ {
position: absolute;
left: 0;
top: 0;
height: 100vh;
width: 100vw;
overflow: hidden;
display: flex !important;
justify-content: center;
align-items: center;
flex-direction: column;
}
.__init__title {
font-size: 2.5vmin;
padding: 1.5vmin;
font-weight: bold;
font-family: 'system-ui';
}
.__init__image {
height: 20vmin;
width: 20vmin;
/*background-image: url("/public/loading-logo.svg");*/
background-size: 100% 100%;
margin-bottom: 4vmin;
overflow: hidden;
transform: translateY(-1000px);
filter: drop-shadow(0px 1000px orange);
}
.__init__image img {
height: 100%;
width: 100%;
}
.__init__process-frame {
width: 33%;
height: 2.4vmin;
border-radius: 1.2vmin;
overflow: hidden;
}
.__init__progress {
width: 100%;
height: 100%;
background: linear-gradient(-45deg, #0278ee 36%, #7db9e8 28%, #7db9e8 67%, #0278ee 25%);
background-size: 4em 2em;
-webkit-animation: load 1s;
animation: __init__load 1s;
position: relative;
}
.__init__masker {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
opacity: 0.8;
background: linear-gradient(90deg, #1c7bda 20%, #fff 100%)
}
@keyframes __init__load {
0% {
width: 0;
}
}

19
src/utils/request.ts
View File

@ -62,10 +62,21 @@ service.interceptors.response.use(
) )
export const baseUrl: string = (() => { export const baseUrl: string = (() => {
let port = import.meta.env.VITE_APP_BASE_URL if (window.NGINX_BASE_URL) return window.NGINX_BASE_URL
if (/:\d{1,5}/.test(port)) port = port.match(/(?<port>:\d{1,5})/)?.groups?.port ?? ''
else port = `:${location.port}` const mode = import.meta.env.VITE_APP_BASE_MODE
return `${location.protocol}//${location.hostname}${port}` if (mode === 'port') {
const port = import.meta.env.VITE_APP_BASE_PORT || location.port
return `${location.protocol}//${location.hostname}:${port}`
}
if (mode === 'url') {
let url = import.meta.env.VITE_APP_BASE_URL
if (!url) url = `${location.protocol}//${location.host}`
return url
}
//local
return `${location.protocol}//${location.host}`
})() })()
//导出service实例给页面调用 , config->页面的配置 //导出service实例给页面调用 , config->页面的配置

BIN
src/views/login/1712042358737.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 139 KiB

40
src/views/login/index.vue
View File

@ -1,8 +1,8 @@
<template> <template>
<div class="login-container columnCE"> <div class="login-container columnCE">
<div class="login-hero"> <!-- <div class="login-hero">-->
<img src="@/assets/layout/login.svg" :alt="settings.title" /> <!-- <img src="@/assets/layout/login.svg" :alt="settings.title" />-->
</div> <!-- </div>-->
<el-form ref="refLoginForm" class="login-form" :model="subForm" :rules="formRules"> <el-form ref="refLoginForm" class="login-form" :model="subForm" :rules="formRules">
<div class="title-container"> <div class="title-container">
<h3 class="title text-center">{{ settings.title }}</h3> <h3 class="title text-center">{{ settings.title }}</h3>
@ -32,10 +32,15 @@
</span> </span>
</el-form-item> </el-form-item>
<div class="tip-message">{{ tipMessage }}</div> <div class="tip-message">{{ tipMessage }}</div>
<el-button :loading="subLoading" type="primary" class="login-btn" size="default" @click.prevent="handleLogin"> <el-button :loading="subLoading" color="#E3B4D0" class="login-btn" size="default" @click.prevent="handleLogin">
登录 登录
</el-button> </el-button>
</el-form> </el-form>
<div class="icp">
鲁ICP备
<s>1145141919号-810</s>
</div>
<div class="copyright">© 2024 洛洛希雅Lolosia</div>
</div> </div>
</template> </template>
@ -163,14 +168,19 @@ $light_gray: #eee;
overflow-y: hidden; overflow-y: hidden;
width: 100%; width: 100%;
background-color: $bg; background-color: $bg;
background-image: url('./1712042358737.jpg');
background-repeat: no-repeat;
background-size: cover;
background-position-x: 65%;
background-position-y: 75%;
.login-form { .login-form {
width: 360px; width: 360px;
padding: 40px 30px; padding: 40px 30px;
background: #fff; background: #fff6;
box-shadow: 0 4px 16px rgba(4, 61, 175, 0.15); box-shadow: 0 4px 16px rgba(4, 61, 175, 0.15);
border-radius: 8px; border-radius: 8px;
margin-right: 20vw; margin-right: 10vw;
z-index: 10; z-index: 10;
@media screen and (min-width: 769px) and (max-width: 992px) { @media screen and (min-width: 769px) and (max-width: 992px) {
margin-right: 10vw; margin-right: 10vw;
@ -184,12 +194,26 @@ $light_gray: #eee;
.title-container { .title-container {
.title { .title {
font-size: 18px; font-size: 18px;
color: $dark_gray; color: white;
margin: 0 auto 25px auto; margin: 0 auto 25px auto;
text-align: center; text-align: center;
font-weight: bold; font-weight: bold;
} }
} }
.icp {
position: absolute;
bottom: 0.5em;
left: 2em;
color: #fffb;
}
.copyright {
position: absolute;
bottom: 0.5em;
right: 2em;
color: #fffb;
}
} }
.login-hero { .login-hero {
@ -261,7 +285,7 @@ $light_gray: #eee;
.el-form-item { .el-form-item {
border: 1px solid #e0e0e0; border: 1px solid #e0e0e0;
background: #fff; background: #fffb;
border-radius: 4px; border-radius: 4px;
color: #999; color: #999;

3
typings/auto-imports.d.ts vendored
View File

@ -69,7 +69,7 @@ declare global {
const resetState: typeof import('../src/hooks/use-permission')['resetState'] const resetState: typeof import('../src/hooks/use-permission')['resetState']
const resizeHandler: typeof import('../src/hooks/use-layout')['resizeHandler'] const resizeHandler: typeof import('../src/hooks/use-layout')['resizeHandler']
const resolveComponent: typeof import('vue')['resolveComponent'] const resolveComponent: typeof import('vue')['resolveComponent']
const resolveDirective: typeof import('vue')['resolveDirective'] const resolveDirective: (typeof import('vue'))['resolveDirective']
const rolesPermission: typeof import('../src/directives/roles-permission')['default'] const rolesPermission: typeof import('../src/directives/roles-permission')['default']
const routeInfo: typeof import('../src/hooks/use-self-router')['routeInfo'] const routeInfo: typeof import('../src/hooks/use-self-router')['routeInfo']
const routerBack: typeof import('../src/hooks/use-self-router')['routerBack'] const routerBack: typeof import('../src/hooks/use-self-router')['routerBack']
@ -94,7 +94,6 @@ declare global {
const useCssVars: typeof import('vue')['useCssVars'] const useCssVars: typeof import('vue')['useCssVars']
const useDebuggerStore: typeof import('../src/store/debuger')['useDebuggerStore'] const useDebuggerStore: typeof import('../src/store/debuger')['useDebuggerStore']
const useElement: typeof import('../src/hooks/use-element')['useElement'] const useElement: typeof import('../src/hooks/use-element')['useElement']
const useErrorLog: typeof import('../src/hooks/use-error-log')['useErrorLog']
const useLink: typeof import('vue-router')['useLink'] const useLink: typeof import('vue-router')['useLink']
const useRoute: typeof import('vue-router')['useRoute'] const useRoute: typeof import('vue-router')['useRoute']
const useRouter: typeof import('vue-router')['useRouter'] const useRouter: typeof import('vue-router')['useRouter']

1
typings/components.d.ts vendored
View File

@ -8,7 +8,6 @@ export {}
declare module 'vue' { declare module 'vue' {
export interface GlobalComponents { export interface GlobalComponents {
AppPage: typeof import('./../src/components/AppPage.vue')['default'] AppPage: typeof import('./../src/components/AppPage.vue')['default']
Container: typeof import('@/components/AppPage.vue')['default']
ElSvgIcon: typeof import('./../src/components/ElSvgIcon.vue')['default'] ElSvgIcon: typeof import('./../src/components/ElSvgIcon.vue')['default']
IconSelector: typeof import('./../src/components/IconSelector.vue')['default'] IconSelector: typeof import('./../src/components/IconSelector.vue')['default']
MenuIcon: typeof import('./../src/components/MenuIcon.vue')['default'] MenuIcon: typeof import('./../src/components/MenuIcon.vue')['default']

4
typings/env.d.ts vendored
View File

@ -9,5 +9,9 @@ declare global {
interface ImportMeta { interface ImportMeta {
readonly env: ImportMetaEnv readonly env: ImportMetaEnv
} }
interface Window {
readonly NGINX_BASE_URL: string | undefined
}
} }
export {} export {}

6
vite.config.ts
View File

@ -127,9 +127,9 @@ export default defineConfig(({ command, mode }: ConfigEnv): UserConfig => {
assetsDir: 'static/assets', assetsDir: 'static/assets',
rollupOptions: { rollupOptions: {
output: { output: {
chunkFileNames: 'static/js/[name]-[hash].js', chunkFileNames: 'static/js/chunk-[hash].js',
entryFileNames: 'static/js/[name]-[hash].js', entryFileNames: 'static/js/index.js',
assetFileNames: 'static/[ext]/[name]-[hash].[ext]' assetFileNames: 'static/[ext]/[hash].[ext]'
} }
} }
}, },