bug 修复

This commit is contained in:
BianLzhaoMin 2025-08-29 09:50:42 +08:00
parent 14b02487ee
commit ad4df65ff8
5 changed files with 958 additions and 2 deletions

View File

@ -1,5 +1,5 @@
<template> <template>
<div class="not-dev-container"> <div class="not-dev-container app-container">
<div class="not-dev-content"> <div class="not-dev-content">
<div class="not-dev-image"> <div class="not-dev-image">
<svg <svg
@ -145,7 +145,7 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
min-height: 100vh; // min-height: 100vh;
background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%); background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
.not-dev-content { .not-dev-content {

View File

@ -0,0 +1,239 @@
<template>
<div class="not-dev-container app-container">
<div class="not-dev-content">
<div class="not-dev-image">
<svg
width="400"
height="400"
viewBox="0 0 400 400"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<!-- 背景圆形 -->
<circle
cx="200"
cy="200"
r="180"
fill="#F8FAFC"
stroke="#E2E8F0"
stroke-width="2"
/>
<!-- 主要图标建筑工地或开发中的图标 -->
<rect
x="120"
y="140"
width="160"
height="120"
rx="8"
fill="#3B82F6"
opacity="0.1"
/>
<rect
x="130"
y="150"
width="140"
height="100"
rx="4"
fill="#3B82F6"
opacity="0.2"
/>
<!-- 脚手架结构 -->
<rect
x="110"
y="120"
width="8"
height="160"
fill="#94A3B8"
/>
<rect
x="282"
y="120"
width="8"
height="160"
fill="#94A3B8"
/>
<rect
x="110"
y="120"
width="180"
height="8"
fill="#94A3B8"
/>
<rect
x="110"
y="200"
width="180"
height="8"
fill="#94A3B8"
/>
<rect
x="110"
y="280"
width="180"
height="8"
fill="#94A3B8"
/>
<!-- 工具图标 -->
<circle cx="160" cy="180" r="15" fill="#F59E0B" />
<circle cx="240" cy="180" r="15" fill="#10B981" />
<circle cx="200" cy="220" r="15" fill="#EF4444" />
<!-- 进度条 -->
<rect
x="120"
y="320"
width="160"
height="8"
rx="4"
fill="#E2E8F0"
/>
<rect
x="120"
y="320"
width="80"
height="8"
rx="4"
fill="#3B82F6"
/>
<!-- 装饰性元素 -->
<circle
cx="150"
cy="80"
r="4"
fill="#3B82F6"
opacity="0.6"
/>
<circle
cx="250"
cy="90"
r="3"
fill="#10B981"
opacity="0.6"
/>
<circle
cx="180"
cy="70"
r="2"
fill="#F59E0B"
opacity="0.6"
/>
</svg>
</div>
<div class="not-dev-text">
<h2 class="title">即将上线</h2>
<p class="subtitle">敬请期待...</p>
</div>
</div>
</div>
</template>
<script>
export default {
name: 'NotDev',
data() {
return {}
},
}
</script>
<style lang="scss" scoped>
.not-dev-container {
display: flex;
align-items: center;
justify-content: center;
// min-height: 100vh;
background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
.not-dev-content {
text-align: center;
padding: 40px;
border-radius: 16px;
background: rgba(255, 255, 255, 0.8);
backdrop-filter: blur(10px);
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
.not-dev-image {
margin-bottom: 32px;
svg {
filter: drop-shadow(0 8px 16px rgba(59, 130, 246, 0.15));
transition: transform 0.3s ease;
&:hover {
transform: translateY(-8px);
}
}
}
.not-dev-text {
.title {
font-size: 32px;
font-weight: 600;
color: #1e3a8a;
margin: 0 0 16px 0;
letter-spacing: 2px;
}
.subtitle {
font-size: 18px;
color: #64748b;
margin: 0;
font-weight: 400;
letter-spacing: 1px;
}
}
}
}
//
@media (max-width: 768px) {
.not-dev-container {
padding: 20px;
.not-dev-content {
padding: 30px 20px;
.not-dev-image svg {
width: 300px;
height: 300px;
}
.not-dev-text {
.title {
font-size: 28px;
}
.subtitle {
font-size: 16px;
}
}
}
}
}
@media (max-width: 480px) {
.not-dev-container {
.not-dev-content {
.not-dev-image svg {
width: 250px;
height: 250px;
}
.not-dev-text {
.title {
font-size: 24px;
}
.subtitle {
font-size: 14px;
}
}
}
}
}
</style>

View File

@ -0,0 +1,239 @@
<template>
<div class="not-dev-container app-container">
<div class="not-dev-content">
<div class="not-dev-image">
<svg
width="400"
height="400"
viewBox="0 0 400 400"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<!-- 背景圆形 -->
<circle
cx="200"
cy="200"
r="180"
fill="#F8FAFC"
stroke="#E2E8F0"
stroke-width="2"
/>
<!-- 主要图标建筑工地或开发中的图标 -->
<rect
x="120"
y="140"
width="160"
height="120"
rx="8"
fill="#3B82F6"
opacity="0.1"
/>
<rect
x="130"
y="150"
width="140"
height="100"
rx="4"
fill="#3B82F6"
opacity="0.2"
/>
<!-- 脚手架结构 -->
<rect
x="110"
y="120"
width="8"
height="160"
fill="#94A3B8"
/>
<rect
x="282"
y="120"
width="8"
height="160"
fill="#94A3B8"
/>
<rect
x="110"
y="120"
width="180"
height="8"
fill="#94A3B8"
/>
<rect
x="110"
y="200"
width="180"
height="8"
fill="#94A3B8"
/>
<rect
x="110"
y="280"
width="180"
height="8"
fill="#94A3B8"
/>
<!-- 工具图标 -->
<circle cx="160" cy="180" r="15" fill="#F59E0B" />
<circle cx="240" cy="180" r="15" fill="#10B981" />
<circle cx="200" cy="220" r="15" fill="#EF4444" />
<!-- 进度条 -->
<rect
x="120"
y="320"
width="160"
height="8"
rx="4"
fill="#E2E8F0"
/>
<rect
x="120"
y="320"
width="80"
height="8"
rx="4"
fill="#3B82F6"
/>
<!-- 装饰性元素 -->
<circle
cx="150"
cy="80"
r="4"
fill="#3B82F6"
opacity="0.6"
/>
<circle
cx="250"
cy="90"
r="3"
fill="#10B981"
opacity="0.6"
/>
<circle
cx="180"
cy="70"
r="2"
fill="#F59E0B"
opacity="0.6"
/>
</svg>
</div>
<div class="not-dev-text">
<h2 class="title">即将上线</h2>
<p class="subtitle">敬请期待...</p>
</div>
</div>
</div>
</template>
<script>
export default {
name: 'NotDev',
data() {
return {}
},
}
</script>
<style lang="scss" scoped>
.not-dev-container {
display: flex;
align-items: center;
justify-content: center;
// min-height: 100vh;
background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
.not-dev-content {
text-align: center;
padding: 40px;
border-radius: 16px;
background: rgba(255, 255, 255, 0.8);
backdrop-filter: blur(10px);
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
.not-dev-image {
margin-bottom: 32px;
svg {
filter: drop-shadow(0 8px 16px rgba(59, 130, 246, 0.15));
transition: transform 0.3s ease;
&:hover {
transform: translateY(-8px);
}
}
}
.not-dev-text {
.title {
font-size: 32px;
font-weight: 600;
color: #1e3a8a;
margin: 0 0 16px 0;
letter-spacing: 2px;
}
.subtitle {
font-size: 18px;
color: #64748b;
margin: 0;
font-weight: 400;
letter-spacing: 1px;
}
}
}
}
//
@media (max-width: 768px) {
.not-dev-container {
padding: 20px;
.not-dev-content {
padding: 30px 20px;
.not-dev-image svg {
width: 300px;
height: 300px;
}
.not-dev-text {
.title {
font-size: 28px;
}
.subtitle {
font-size: 16px;
}
}
}
}
}
@media (max-width: 480px) {
.not-dev-container {
.not-dev-content {
.not-dev-image svg {
width: 250px;
height: 250px;
}
.not-dev-text {
.title {
font-size: 24px;
}
.subtitle {
font-size: 14px;
}
}
}
}
}
</style>

View File

@ -0,0 +1,239 @@
<template>
<div class="not-dev-container app-container">
<div class="not-dev-content">
<div class="not-dev-image">
<svg
width="400"
height="400"
viewBox="0 0 400 400"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<!-- 背景圆形 -->
<circle
cx="200"
cy="200"
r="180"
fill="#F8FAFC"
stroke="#E2E8F0"
stroke-width="2"
/>
<!-- 主要图标建筑工地或开发中的图标 -->
<rect
x="120"
y="140"
width="160"
height="120"
rx="8"
fill="#3B82F6"
opacity="0.1"
/>
<rect
x="130"
y="150"
width="140"
height="100"
rx="4"
fill="#3B82F6"
opacity="0.2"
/>
<!-- 脚手架结构 -->
<rect
x="110"
y="120"
width="8"
height="160"
fill="#94A3B8"
/>
<rect
x="282"
y="120"
width="8"
height="160"
fill="#94A3B8"
/>
<rect
x="110"
y="120"
width="180"
height="8"
fill="#94A3B8"
/>
<rect
x="110"
y="200"
width="180"
height="8"
fill="#94A3B8"
/>
<rect
x="110"
y="280"
width="180"
height="8"
fill="#94A3B8"
/>
<!-- 工具图标 -->
<circle cx="160" cy="180" r="15" fill="#F59E0B" />
<circle cx="240" cy="180" r="15" fill="#10B981" />
<circle cx="200" cy="220" r="15" fill="#EF4444" />
<!-- 进度条 -->
<rect
x="120"
y="320"
width="160"
height="8"
rx="4"
fill="#E2E8F0"
/>
<rect
x="120"
y="320"
width="80"
height="8"
rx="4"
fill="#3B82F6"
/>
<!-- 装饰性元素 -->
<circle
cx="150"
cy="80"
r="4"
fill="#3B82F6"
opacity="0.6"
/>
<circle
cx="250"
cy="90"
r="3"
fill="#10B981"
opacity="0.6"
/>
<circle
cx="180"
cy="70"
r="2"
fill="#F59E0B"
opacity="0.6"
/>
</svg>
</div>
<div class="not-dev-text">
<h2 class="title">即将上线</h2>
<p class="subtitle">敬请期待...</p>
</div>
</div>
</div>
</template>
<script>
export default {
name: 'NotDev',
data() {
return {}
},
}
</script>
<style lang="scss" scoped>
.not-dev-container {
display: flex;
align-items: center;
justify-content: center;
// min-height: 100vh;
background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
.not-dev-content {
text-align: center;
padding: 40px;
border-radius: 16px;
background: rgba(255, 255, 255, 0.8);
backdrop-filter: blur(10px);
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
.not-dev-image {
margin-bottom: 32px;
svg {
filter: drop-shadow(0 8px 16px rgba(59, 130, 246, 0.15));
transition: transform 0.3s ease;
&:hover {
transform: translateY(-8px);
}
}
}
.not-dev-text {
.title {
font-size: 32px;
font-weight: 600;
color: #1e3a8a;
margin: 0 0 16px 0;
letter-spacing: 2px;
}
.subtitle {
font-size: 18px;
color: #64748b;
margin: 0;
font-weight: 400;
letter-spacing: 1px;
}
}
}
}
//
@media (max-width: 768px) {
.not-dev-container {
padding: 20px;
.not-dev-content {
padding: 30px 20px;
.not-dev-image svg {
width: 300px;
height: 300px;
}
.not-dev-text {
.title {
font-size: 28px;
}
.subtitle {
font-size: 16px;
}
}
}
}
}
@media (max-width: 480px) {
.not-dev-container {
.not-dev-content {
.not-dev-image svg {
width: 250px;
height: 250px;
}
.not-dev-text {
.title {
font-size: 24px;
}
.subtitle {
font-size: 14px;
}
}
}
}
}
</style>

View File

@ -0,0 +1,239 @@
<template>
<div class="not-dev-container app-container">
<div class="not-dev-content">
<div class="not-dev-image">
<svg
width="400"
height="400"
viewBox="0 0 400 400"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<!-- 背景圆形 -->
<circle
cx="200"
cy="200"
r="180"
fill="#F8FAFC"
stroke="#E2E8F0"
stroke-width="2"
/>
<!-- 主要图标建筑工地或开发中的图标 -->
<rect
x="120"
y="140"
width="160"
height="120"
rx="8"
fill="#3B82F6"
opacity="0.1"
/>
<rect
x="130"
y="150"
width="140"
height="100"
rx="4"
fill="#3B82F6"
opacity="0.2"
/>
<!-- 脚手架结构 -->
<rect
x="110"
y="120"
width="8"
height="160"
fill="#94A3B8"
/>
<rect
x="282"
y="120"
width="8"
height="160"
fill="#94A3B8"
/>
<rect
x="110"
y="120"
width="180"
height="8"
fill="#94A3B8"
/>
<rect
x="110"
y="200"
width="180"
height="8"
fill="#94A3B8"
/>
<rect
x="110"
y="280"
width="180"
height="8"
fill="#94A3B8"
/>
<!-- 工具图标 -->
<circle cx="160" cy="180" r="15" fill="#F59E0B" />
<circle cx="240" cy="180" r="15" fill="#10B981" />
<circle cx="200" cy="220" r="15" fill="#EF4444" />
<!-- 进度条 -->
<rect
x="120"
y="320"
width="160"
height="8"
rx="4"
fill="#E2E8F0"
/>
<rect
x="120"
y="320"
width="80"
height="8"
rx="4"
fill="#3B82F6"
/>
<!-- 装饰性元素 -->
<circle
cx="150"
cy="80"
r="4"
fill="#3B82F6"
opacity="0.6"
/>
<circle
cx="250"
cy="90"
r="3"
fill="#10B981"
opacity="0.6"
/>
<circle
cx="180"
cy="70"
r="2"
fill="#F59E0B"
opacity="0.6"
/>
</svg>
</div>
<div class="not-dev-text">
<h2 class="title">即将上线</h2>
<p class="subtitle">敬请期待...</p>
</div>
</div>
</div>
</template>
<script>
export default {
name: 'NotDev',
data() {
return {}
},
}
</script>
<style lang="scss" scoped>
.not-dev-container {
display: flex;
align-items: center;
justify-content: center;
// min-height: 100vh;
background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
.not-dev-content {
text-align: center;
padding: 40px;
border-radius: 16px;
background: rgba(255, 255, 255, 0.8);
backdrop-filter: blur(10px);
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
.not-dev-image {
margin-bottom: 32px;
svg {
filter: drop-shadow(0 8px 16px rgba(59, 130, 246, 0.15));
transition: transform 0.3s ease;
&:hover {
transform: translateY(-8px);
}
}
}
.not-dev-text {
.title {
font-size: 32px;
font-weight: 600;
color: #1e3a8a;
margin: 0 0 16px 0;
letter-spacing: 2px;
}
.subtitle {
font-size: 18px;
color: #64748b;
margin: 0;
font-weight: 400;
letter-spacing: 1px;
}
}
}
}
//
@media (max-width: 768px) {
.not-dev-container {
padding: 20px;
.not-dev-content {
padding: 30px 20px;
.not-dev-image svg {
width: 300px;
height: 300px;
}
.not-dev-text {
.title {
font-size: 28px;
}
.subtitle {
font-size: 16px;
}
}
}
}
}
@media (max-width: 480px) {
.not-dev-container {
.not-dev-content {
.not-dev-image svg {
width: 250px;
height: 250px;
}
.not-dev-text {
.title {
font-size: 24px;
}
.subtitle {
font-size: 14px;
}
}
}
}
}
</style>