fix: 界面功能优化。

This commit is contained in:
tianyongbao
2025-12-23 18:30:41 +08:00
parent dd44481dda
commit 4ccfcc2105
8 changed files with 8844 additions and 27 deletions

45
.idea/workspace.xml generated
View File

@@ -1,7 +1,7 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ChangeListManager">
<list default="true" id="3667dc6b-255c-45ba-970d-78a1cbdb9682" name="更改" comment="fix: 增加配置文件。" />
<list default="true" id="3667dc6b-255c-45ba-970d-78a1cbdb9682" name="更改" comment="fix: 界面修改。" />
<option name="SHOW_DIALOG" value="false" />
<option name="HIGHLIGHT_CONFLICTS" value="true" />
<option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" />
@@ -18,21 +18,22 @@
<option name="hideEmptyMiddlePackages" value="true" />
<option name="showLibraryContents" value="true" />
</component>
<component name="PropertiesComponent">{
&quot;keyToString&quot;: {
&quot;ModuleVcsDetector.initialDetectionPerformed&quot;: &quot;true&quot;,
&quot;RunOnceActivity.ShowReadmeOnStart&quot;: &quot;true&quot;,
&quot;RunOnceActivity.git.unshallow&quot;: &quot;true&quot;,
&quot;RunOnceActivity.typescript.service.memoryLimit.init&quot;: &quot;true&quot;,
&quot;git-widget-placeholder&quot;: &quot;master&quot;,
&quot;javascript.preferred.runtime.type.id&quot;: &quot;node&quot;,
&quot;last_opened_file_path&quot;: &quot;E:/code/intc/front-end/intc-single-ultra-web&quot;,
&quot;node.js.detected.package.eslint&quot;: &quot;true&quot;,
&quot;node.js.selected.package.eslint&quot;: &quot;(autodetect)&quot;,
&quot;nodejs_package_manager_path&quot;: &quot;npm&quot;,
&quot;vue.rearranger.settings.migration&quot;: &quot;true&quot;
<component name="PropertiesComponent"><![CDATA[{
"keyToString": {
"ModuleVcsDetector.initialDetectionPerformed": "true",
"RunOnceActivity.ShowReadmeOnStart": "true",
"RunOnceActivity.git.unshallow": "true",
"RunOnceActivity.typescript.service.memoryLimit.init": "true",
"git-widget-placeholder": "master",
"javascript.preferred.runtime.type.id": "node",
"last_opened_file_path": "E:/code/intc/front-end/intc-single-ultra-web",
"node.js.detected.package.eslint": "true",
"node.js.selected.package.eslint": "(autodetect)",
"nodejs_package_manager_path": "npm",
"prettierjs.PrettierConfiguration.Package": "E:\\code\\intc\\front-end\\intc-single-ultra-web\\node_modules\\prettier",
"vue.rearranger.settings.migration": "true"
}
}</component>
}]]></component>
<component name="SharedIndexes">
<attachedChunks>
<set>
@@ -51,6 +52,7 @@
<workItem from="1766377867806" duration="5000" />
<workItem from="1766385532161" duration="33000" />
<workItem from="1766404501022" duration="428000" />
<workItem from="1766418512146" duration="54000" />
</task>
<task id="LOCAL-00001" summary="feat: 项目初始化。">
<option name="closed" value="true" />
@@ -68,7 +70,15 @@
<option name="project" value="LOCAL" />
<updated>1766404670627</updated>
</task>
<option name="localTasksCounter" value="3" />
<task id="LOCAL-00003" summary="fix: 界面修改。">
<option name="closed" value="true" />
<created>1766418560033</created>
<option name="number" value="00003" />
<option name="presentableId" value="LOCAL-00003" />
<option name="project" value="LOCAL" />
<updated>1766418560033</updated>
</task>
<option name="localTasksCounter" value="4" />
<servers />
</component>
<component name="TypeScriptGeneratedFilesManager">
@@ -77,6 +87,7 @@
<component name="VcsManagerConfiguration">
<MESSAGE value="feat: 项目初始化。" />
<MESSAGE value="fix: 增加配置文件。" />
<option name="LAST_COMMIT_MESSAGE" value="fix: 增加配置文件。" />
<MESSAGE value="fix: 界面修改。" />
<option name="LAST_COMMIT_MESSAGE" value="fix: 界面修改。" />
</component>
</project>

3
.vscode/settings.json vendored Normal file
View File

@@ -0,0 +1,3 @@
{
"git.ignoreLimitWarning": true
}

8513
package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

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

Binary file not shown.

After

Width:  |  Height:  |  Size: 48 KiB

View File

@@ -23,7 +23,7 @@
<script setup lang="ts">
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';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;

View File

@@ -1,29 +1,319 @@
<template>
<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">
<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>
</template>
<script setup name="Index" lang="ts">
import { reactive } from 'vue';
import { Document, DataAnalysis, Setting, Monitor } from '@element-plus/icons-vue';
</script>
<style lang="scss" scoped>
.home {
position: relative;
display: flex;
justify-content: 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 {
position: relative;
z-index: 1;
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 {
font-size: 32px;
font-weight: 400;
color: #333;
margin: 0;
font-size: 48px;
font-weight: 700;
color: #fff;
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);
}
}
}
}

View File

@@ -3,7 +3,7 @@
<el-form ref="loginRef" :model="loginForm" :rules="loginRules" class="login-form">
<div class="title-box">
<h3 class="title">{{ title }}</h3>
<lang-select />
<!-- <lang-select /> -->
</div>
<el-form-item v-if="tenantEnabled" prop="tenantId">
<el-select v-model="loginForm.tenantId" filterable :placeholder="proxy.$t('login.selectPlaceholder')" style="width: 100%">
@@ -44,7 +44,7 @@
</div>
</el-form-item>
<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')">
<svg-icon icon-class="wechat" />
</el-button>
@@ -60,7 +60,7 @@
<el-button circle :title="proxy.$t('login.social.github')" @click="doSocialLogin('github')">
<svg-icon icon-class="github" />
</el-button>
</el-form-item>
</el-form-item> -->
<el-form-item style="width: 100%">
<el-button :loading="loading" size="large" type="primary" style="width: 100%" @click.prevent="handleLogin">
<span v-if="!loading">{{ proxy.$t('login.login') }}</span>