fix: 界面功能优化。
This commit is contained in:
@@ -6,7 +6,7 @@
|
|||||||
<meta name="renderer" content="webkit" />
|
<meta name="renderer" content="webkit" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
|
||||||
<link rel="icon" href="/favicon.ico" />
|
<link rel="icon" href="/favicon.ico" />
|
||||||
<title>RuoYi-Vue-Plus多租户管理系统</title>
|
<title>智聪科技单体项目管理系统</title>
|
||||||
<!--[if lt IE 11
|
<!--[if lt IE 11
|
||||||
]><script>
|
]><script>
|
||||||
window.location.href = '/html/ie.html';
|
window.location.href = '/html/ie.html';
|
||||||
|
|||||||
Binary file not shown.
|
Before Width: | Height: | Size: 7.9 KiB After Width: | Height: | Size: 4.2 KiB |
BIN
src/assets/logo/logo.jpg
Normal file
BIN
src/assets/logo/logo.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 48 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 7.9 KiB |
@@ -42,21 +42,21 @@
|
|||||||
</el-popover>
|
</el-popover>
|
||||||
</div>
|
</div>
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
<el-tooltip content="Github" effect="dark" placement="bottom">
|
<!-- <el-tooltip content="Github" effect="dark" placement="bottom">
|
||||||
<ruo-yi-git id="ruoyi-git" class="right-menu-item hover-effect" />
|
<ruo-yi-git id="ruoyi-git" class="right-menu-item hover-effect" />
|
||||||
</el-tooltip>
|
</el-tooltip> -->
|
||||||
|
<!--
|
||||||
<el-tooltip :content="proxy.$t('navbar.document')" effect="dark" placement="bottom">
|
<el-tooltip :content="proxy.$t('navbar.document')" effect="dark" placement="bottom">
|
||||||
<ruo-yi-doc id="ruoyi-doc" class="right-menu-item hover-effect" />
|
<ruo-yi-doc id="ruoyi-doc" class="right-menu-item hover-effect" />
|
||||||
</el-tooltip>
|
</el-tooltip> -->
|
||||||
|
|
||||||
<el-tooltip :content="proxy.$t('navbar.full')" effect="dark" placement="bottom">
|
<el-tooltip :content="proxy.$t('navbar.full')" effect="dark" placement="bottom">
|
||||||
<screenfull id="screenfull" class="right-menu-item hover-effect" />
|
<screenfull id="screenfull" class="right-menu-item hover-effect" />
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
|
<!--
|
||||||
<el-tooltip :content="proxy.$t('navbar.language')" effect="dark" placement="bottom">
|
<el-tooltip :content="proxy.$t('navbar.language')" effect="dark" placement="bottom">
|
||||||
<lang-select id="lang-select" class="right-menu-item hover-effect" />
|
<lang-select id="lang-select" class="right-menu-item hover-effect" />
|
||||||
</el-tooltip>
|
</el-tooltip> -->
|
||||||
|
|
||||||
<el-tooltip :content="proxy.$t('navbar.layoutSize')" effect="dark" placement="bottom">
|
<el-tooltip :content="proxy.$t('navbar.layoutSize')" effect="dark" placement="bottom">
|
||||||
<size-select id="size-select" class="right-menu-item hover-effect" />
|
<size-select id="size-select" class="right-menu-item hover-effect" />
|
||||||
|
|||||||
@@ -23,7 +23,7 @@
|
|||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import variables from '@/assets/styles/variables.module.scss';
|
import variables from '@/assets/styles/variables.module.scss';
|
||||||
import logo from '@/assets/logo/logo.png';
|
import logo from '@/assets/logo/logo.jpg';
|
||||||
import { useSettingsStore } from '@/store/modules/settings';
|
import { useSettingsStore } from '@/store/modules/settings';
|
||||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||||
|
|
||||||
@@ -34,7 +34,7 @@ defineProps({
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
const title = ref('RuoYi-Vue-Plus');
|
const title = ref('智聪科技');
|
||||||
const settingsStore = useSettingsStore();
|
const settingsStore = useSettingsStore();
|
||||||
const sideTheme = computed(() => settingsStore.sideTheme);
|
const sideTheme = computed(() => settingsStore.sideTheme);
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@@ -1,29 +1,319 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="app-container home">
|
<div class="app-container home">
|
||||||
|
<div class="background-decoration">
|
||||||
|
<div class="circle circle-1"></div>
|
||||||
|
<div class="circle circle-2"></div>
|
||||||
|
<div class="circle circle-3"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="welcome-container">
|
<div class="welcome-container">
|
||||||
<h1 class="welcome-title">欢迎使用智聪科技单体项目管理系统</h1>
|
<div class="logo-section">
|
||||||
|
<div class="logo-ring">
|
||||||
|
<svg class="logo-icon" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M12 2L2 7L12 12L22 7L12 2Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M2 17L12 22L22 17" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M2 12L12 17L22 12" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h1 class="welcome-title">
|
||||||
|
<span class="title-line">欢迎使用</span>
|
||||||
|
<span class="title-line main-title">智聪科技单体项目管理系统</span>
|
||||||
|
</h1>
|
||||||
|
|
||||||
|
<p class="welcome-subtitle">专业 · 高效 · 智能</p>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup name="Index" lang="ts">
|
<script setup name="Index" lang="ts">
|
||||||
|
import { reactive } from 'vue';
|
||||||
|
import { Document, DataAnalysis, Setting, Monitor } from '@element-plus/icons-vue';
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.home {
|
.home {
|
||||||
|
position: relative;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
min-height: 60vh;
|
min-height: calc(100vh - 84px);
|
||||||
|
overflow: hidden;
|
||||||
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||||
|
|
||||||
|
// 背景装饰
|
||||||
|
.background-decoration {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
pointer-events: none;
|
||||||
|
|
||||||
|
.circle {
|
||||||
|
position: absolute;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: rgba(255, 255, 255, 0.1);
|
||||||
|
animation: float 20s infinite ease-in-out;
|
||||||
|
|
||||||
|
&.circle-1 {
|
||||||
|
width: 300px;
|
||||||
|
height: 300px;
|
||||||
|
top: -150px;
|
||||||
|
left: -150px;
|
||||||
|
animation-delay: 0s;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.circle-2 {
|
||||||
|
width: 400px;
|
||||||
|
height: 400px;
|
||||||
|
bottom: -200px;
|
||||||
|
right: -200px;
|
||||||
|
animation-delay: 7s;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.circle-3 {
|
||||||
|
width: 250px;
|
||||||
|
height: 250px;
|
||||||
|
top: 50%;
|
||||||
|
right: 10%;
|
||||||
|
animation-delay: 14s;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes float {
|
||||||
|
0%, 100% {
|
||||||
|
transform: translate(0, 0) scale(1);
|
||||||
|
}
|
||||||
|
33% {
|
||||||
|
transform: translate(30px, -30px) scale(1.1);
|
||||||
|
}
|
||||||
|
66% {
|
||||||
|
transform: translate(-20px, 20px) scale(0.9);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.welcome-container {
|
.welcome-container {
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
max-width: 1200px;
|
||||||
|
padding: 40px 20px;
|
||||||
|
animation: fadeInUp 1s ease-out;
|
||||||
|
|
||||||
|
// Logo部分
|
||||||
|
.logo-section {
|
||||||
|
margin-bottom: 40px;
|
||||||
|
|
||||||
|
.logo-ring {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 120px;
|
||||||
|
height: 120px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: rgba(255, 255, 255, 0.15);
|
||||||
|
backdrop-filter: blur(10px);
|
||||||
|
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
|
||||||
|
animation: pulse 3s infinite ease-in-out;
|
||||||
|
|
||||||
|
.logo-icon {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes pulse {
|
||||||
|
0%, 100% {
|
||||||
|
transform: scale(1);
|
||||||
|
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
transform: scale(1.05);
|
||||||
|
box-shadow: 0 12px 48px rgba(0, 0, 0, 0.2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 标题部分
|
||||||
.welcome-title {
|
.welcome-title {
|
||||||
font-size: 32px;
|
font-size: 48px;
|
||||||
font-weight: 400;
|
font-weight: 700;
|
||||||
color: #333;
|
color: #fff;
|
||||||
margin: 0;
|
margin: 0 0 20px 0;
|
||||||
|
line-height: 1.4;
|
||||||
|
text-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
|
||||||
|
|
||||||
|
.title-line {
|
||||||
|
display: block;
|
||||||
|
opacity: 0;
|
||||||
|
animation: slideInLeft 0.8s ease-out forwards;
|
||||||
|
|
||||||
|
&:first-child {
|
||||||
|
font-size: 24px;
|
||||||
|
font-weight: 400;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
animation-delay: 0.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.main-title {
|
||||||
|
animation-delay: 0.4s;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes slideInLeft {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateX(-30px);
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translateX(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.welcome-subtitle {
|
||||||
|
font-size: 18px;
|
||||||
|
color: rgba(255, 255, 255, 0.9);
|
||||||
|
margin: 0 0 60px 0;
|
||||||
|
letter-spacing: 4px;
|
||||||
|
animation: fadeIn 1s ease-out 0.6s backwards;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes fadeIn {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 特性卡片
|
||||||
|
.feature-cards {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
|
||||||
|
gap: 24px;
|
||||||
|
margin-bottom: 60px;
|
||||||
|
|
||||||
|
.feature-card {
|
||||||
|
background: rgba(255, 255, 255, 0.1);
|
||||||
|
backdrop-filter: blur(10px);
|
||||||
|
border: 1px solid rgba(255, 255, 255, 0.2);
|
||||||
|
border-radius: 16px;
|
||||||
|
padding: 32px 24px;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
animation: fadeInUp 0.8s ease-out backwards;
|
||||||
|
|
||||||
|
@for $i from 1 through 4 {
|
||||||
|
&:nth-child(#{$i}) {
|
||||||
|
animation-delay: #{0.8 + $i * 0.1}s;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
transform: translateY(-8px);
|
||||||
|
background: rgba(255, 255, 255, 0.2);
|
||||||
|
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-icon {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
border-radius: 12px;
|
||||||
|
background: rgba(255, 255, 255, 0.2);
|
||||||
|
margin-bottom: 20px;
|
||||||
|
font-size: 28px;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-title {
|
||||||
|
font-size: 20px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #fff;
|
||||||
|
margin: 0 0 12px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-desc {
|
||||||
|
font-size: 14px;
|
||||||
|
color: rgba(255, 255, 255, 0.8);
|
||||||
|
margin: 0;
|
||||||
|
line-height: 1.6;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes fadeInUp {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateY(30px);
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 统计数据
|
||||||
|
.stats-section {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
||||||
|
gap: 32px;
|
||||||
|
padding: 40px 0;
|
||||||
|
border-top: 1px solid rgba(255, 255, 255, 0.2);
|
||||||
|
animation: fadeIn 1s ease-out 1.4s backwards;
|
||||||
|
|
||||||
|
.stat-item {
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
.stat-value {
|
||||||
|
font-size: 36px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #fff;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
text-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-label {
|
||||||
|
font-size: 14px;
|
||||||
|
color: rgba(255, 255, 255, 0.8);
|
||||||
|
letter-spacing: 1px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 响应式设计
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.home {
|
||||||
|
.welcome-container {
|
||||||
|
.welcome-title {
|
||||||
|
font-size: 32px;
|
||||||
|
|
||||||
|
.title-line:first-child {
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.feature-cards {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stats-section {
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -3,7 +3,7 @@
|
|||||||
<el-form ref="loginRef" :model="loginForm" :rules="loginRules" class="login-form">
|
<el-form ref="loginRef" :model="loginForm" :rules="loginRules" class="login-form">
|
||||||
<div class="title-box">
|
<div class="title-box">
|
||||||
<h3 class="title">{{ title }}</h3>
|
<h3 class="title">{{ title }}</h3>
|
||||||
<lang-select />
|
<!-- <lang-select /> -->
|
||||||
</div>
|
</div>
|
||||||
<el-form-item v-if="tenantEnabled" prop="tenantId">
|
<el-form-item v-if="tenantEnabled" prop="tenantId">
|
||||||
<el-select v-model="loginForm.tenantId" filterable :placeholder="proxy.$t('login.selectPlaceholder')" style="width: 100%">
|
<el-select v-model="loginForm.tenantId" filterable :placeholder="proxy.$t('login.selectPlaceholder')" style="width: 100%">
|
||||||
@@ -44,7 +44,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-checkbox v-model="loginForm.rememberMe" style="margin: 0 0 25px 0">{{ proxy.$t('login.rememberPassword') }}</el-checkbox>
|
<el-checkbox v-model="loginForm.rememberMe" style="margin: 0 0 25px 0">{{ proxy.$t('login.rememberPassword') }}</el-checkbox>
|
||||||
<el-form-item style="float: right">
|
<!-- <el-form-item style="float: right">
|
||||||
<el-button circle :title="proxy.$t('login.social.wechat')" @click="doSocialLogin('wechat')">
|
<el-button circle :title="proxy.$t('login.social.wechat')" @click="doSocialLogin('wechat')">
|
||||||
<svg-icon icon-class="wechat" />
|
<svg-icon icon-class="wechat" />
|
||||||
</el-button>
|
</el-button>
|
||||||
@@ -60,7 +60,7 @@
|
|||||||
<el-button circle :title="proxy.$t('login.social.github')" @click="doSocialLogin('github')">
|
<el-button circle :title="proxy.$t('login.social.github')" @click="doSocialLogin('github')">
|
||||||
<svg-icon icon-class="github" />
|
<svg-icon icon-class="github" />
|
||||||
</el-button>
|
</el-button>
|
||||||
</el-form-item>
|
</el-form-item> -->
|
||||||
<el-form-item style="width: 100%">
|
<el-form-item style="width: 100%">
|
||||||
<el-button :loading="loading" size="large" type="primary" style="width: 100%" @click.prevent="handleLogin">
|
<el-button :loading="loading" size="large" type="primary" style="width: 100%" @click.prevent="handleLogin">
|
||||||
<span v-if="!loading">{{ proxy.$t('login.login') }}</span>
|
<span v-if="!loading">{{ proxy.$t('login.login') }}</span>
|
||||||
@@ -73,7 +73,7 @@
|
|||||||
</el-form>
|
</el-form>
|
||||||
<!-- 底部 -->
|
<!-- 底部 -->
|
||||||
<div class="el-login-footer">
|
<div class="el-login-footer">
|
||||||
<span>Copyright © 2018-2025 疯狂的狮子Li All Rights Reserved.</span>
|
<span>Copyright © 2025-2026 QdIntc All Rights Reserved.</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -24,7 +24,7 @@ export default defineConfig(({ mode, command }) => {
|
|||||||
open: true,
|
open: true,
|
||||||
proxy: {
|
proxy: {
|
||||||
[env.VITE_APP_BASE_API]: {
|
[env.VITE_APP_BASE_API]: {
|
||||||
target: 'http://localhost:8080',
|
target: 'http://117.72.197.29:8092',
|
||||||
changeOrigin: true,
|
changeOrigin: true,
|
||||||
ws: true,
|
ws: true,
|
||||||
rewrite: (path) => path.replace(new RegExp('^' + env.VITE_APP_BASE_API), '')
|
rewrite: (path) => path.replace(new RegExp('^' + env.VITE_APP_BASE_API), '')
|
||||||
|
|||||||
Reference in New Issue
Block a user