Compare commits
No commits in common. 'c3b1e99267444ba19bfc0082858f7f3a9bfb4c57' and '89d08986cffb2226eea4c2c5e4459ee63093e8a8' have entirely different histories.
c3b1e99267
...
89d08986cf
@ -1,363 +1,352 @@
|
||||
<!doctype html>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
|
||||
<meta name="renderer" content="webkit" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
<title>互联网产品开发实训系统</title>
|
||||
<!--[if lt IE 11]>
|
||||
<script>
|
||||
window.location.href = "/html/ie.html";
|
||||
</script>
|
||||
<![endif]-->
|
||||
<style>
|
||||
:root {
|
||||
--ink: #06101f;
|
||||
--panel: rgba(8, 30, 52, 0.82);
|
||||
--line: rgba(80, 177, 214, 0.28);
|
||||
--cyan: #53d6ff;
|
||||
--mint: #8ff7d1;
|
||||
--gold: #ffd978;
|
||||
--text: #f3fbff;
|
||||
--muted: #9fc1d8;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#loading-wrapper {
|
||||
position: relative;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
color: var(--text);
|
||||
font-family: "Microsoft YaHei", "PingFang SC", "Source Han Sans CN", sans-serif;
|
||||
background: linear-gradient(rgba(92, 192, 255, 0.08) 1px, transparent 1px), linear-gradient(90deg, rgba(92, 192, 255, 0.08) 1px, transparent 1px), radial-gradient(circle at 18% 18%, rgba(83, 214, 255, 0.14), transparent 28%), radial-gradient(circle at 82% 72%, rgba(143, 247, 209, 0.1), transparent 30%), linear-gradient(135deg, #071426 0%, #06101f 50%, #091827 100%);
|
||||
background-size:
|
||||
52px 52px,
|
||||
52px 52px,
|
||||
auto,
|
||||
auto,
|
||||
auto;
|
||||
}
|
||||
|
||||
#loading-wrapper::before,
|
||||
#loading-wrapper::after {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
content: "";
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
#loading-wrapper::before {
|
||||
background: linear-gradient(120deg, transparent 0 22%, rgba(83, 214, 255, 0.14) 22.3%, transparent 22.8% 62%, rgba(255, 217, 120, 0.12) 62.3%, transparent 62.8%), linear-gradient(0deg, rgba(0, 0, 0, 0.24), transparent 36%, rgba(0, 0, 0, 0.2));
|
||||
opacity: 0.75;
|
||||
}
|
||||
|
||||
#loading-wrapper::after {
|
||||
border: 1px solid rgba(83, 214, 255, 0.16);
|
||||
box-shadow: inset 0 0 90px rgba(0, 0, 0, 0.42);
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="renderer" content="webkit">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
|
||||
<link rel="icon" href="/favicon.ico">
|
||||
<title>电商互联网产品开发实训系统</title>
|
||||
<!--[if lt IE 11]><script>window.location.href='/html/ie.html';</script><![endif]-->
|
||||
<style>
|
||||
:root {
|
||||
--ink: #06101f;
|
||||
--panel: rgba(8, 30, 52, 0.82);
|
||||
--line: rgba(80, 177, 214, 0.28);
|
||||
--cyan: #53d6ff;
|
||||
--mint: #8ff7d1;
|
||||
--gold: #ffd978;
|
||||
--text: #f3fbff;
|
||||
--muted: #9fc1d8;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#loading-wrapper {
|
||||
position: relative;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
color: var(--text);
|
||||
font-family: "Microsoft YaHei", "PingFang SC", "Source Han Sans CN", sans-serif;
|
||||
background:
|
||||
linear-gradient(rgba(92, 192, 255, 0.08) 1px, transparent 1px),
|
||||
linear-gradient(90deg, rgba(92, 192, 255, 0.08) 1px, transparent 1px),
|
||||
radial-gradient(circle at 18% 18%, rgba(83, 214, 255, 0.14), transparent 28%),
|
||||
radial-gradient(circle at 82% 72%, rgba(143, 247, 209, 0.1), transparent 30%),
|
||||
linear-gradient(135deg, #071426 0%, #06101f 50%, #091827 100%);
|
||||
background-size: 52px 52px, 52px 52px, auto, auto, auto;
|
||||
}
|
||||
|
||||
#loading-wrapper::before,
|
||||
#loading-wrapper::after {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
content: "";
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
#loading-wrapper::before {
|
||||
background:
|
||||
linear-gradient(120deg, transparent 0 22%, rgba(83, 214, 255, 0.14) 22.3%, transparent 22.8% 62%, rgba(255, 217, 120, 0.12) 62.3%, transparent 62.8%),
|
||||
linear-gradient(0deg, rgba(0, 0, 0, 0.24), transparent 36%, rgba(0, 0, 0, 0.2));
|
||||
opacity: 0.75;
|
||||
}
|
||||
|
||||
#loading-wrapper::after {
|
||||
border: 1px solid rgba(83, 214, 255, 0.16);
|
||||
box-shadow: inset 0 0 90px rgba(0, 0, 0, 0.42);
|
||||
}
|
||||
|
||||
.loading-shell {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
display: grid;
|
||||
grid-template-columns: 154px minmax(320px, 520px);
|
||||
gap: 30px;
|
||||
align-items: center;
|
||||
max-width: min(820px, calc(100vw - 40px));
|
||||
padding: 34px 38px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 8px;
|
||||
background:
|
||||
linear-gradient(145deg, rgba(14, 42, 68, 0.92), rgba(6, 20, 38, 0.9)),
|
||||
var(--panel);
|
||||
box-shadow: 0 24px 70px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.06);
|
||||
animation: shell-in 0.7s ease both;
|
||||
}
|
||||
|
||||
.loading-mark {
|
||||
position: relative;
|
||||
width: 154px;
|
||||
height: 154px;
|
||||
overflow: hidden;
|
||||
border: 1px solid rgba(83, 214, 255, 0.28);
|
||||
border-radius: 8px;
|
||||
background:
|
||||
linear-gradient(90deg, transparent 23px, rgba(83, 214, 255, 0.11) 24px, transparent 25px),
|
||||
linear-gradient(0deg, transparent 23px, rgba(83, 214, 255, 0.1) 24px, transparent 25px),
|
||||
rgba(5, 22, 39, 0.9);
|
||||
background-size: 25px 25px;
|
||||
}
|
||||
|
||||
.learning-card {
|
||||
position: absolute;
|
||||
left: 27px;
|
||||
top: 34px;
|
||||
width: 100px;
|
||||
height: 72px;
|
||||
border: 1px solid rgba(143, 247, 209, 0.36);
|
||||
border-radius: 6px;
|
||||
background: linear-gradient(180deg, rgba(143, 247, 209, 0.18), rgba(83, 214, 255, 0.08));
|
||||
box-shadow: 0 10px 28px rgba(83, 214, 255, 0.12);
|
||||
animation: card-float 2.8s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.learning-card::before,
|
||||
.learning-card::after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
}
|
||||
|
||||
.learning-card::before {
|
||||
left: 15px;
|
||||
top: 18px;
|
||||
width: 70px;
|
||||
height: 5px;
|
||||
border-radius: 99px;
|
||||
background: var(--mint);
|
||||
box-shadow: 0 15px 0 rgba(211, 239, 255, 0.7), 0 30px 0 rgba(211, 239, 255, 0.42);
|
||||
}
|
||||
|
||||
.learning-card::after {
|
||||
right: -18px;
|
||||
bottom: -18px;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
border: 2px solid var(--gold);
|
||||
border-left-color: transparent;
|
||||
border-radius: 50%;
|
||||
animation: spin 1.4s linear infinite;
|
||||
}
|
||||
|
||||
.pulse-node {
|
||||
position: absolute;
|
||||
left: 22px;
|
||||
bottom: 22px;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 50%;
|
||||
background: var(--cyan);
|
||||
box-shadow: 28px -8px 0 var(--gold), 58px 4px 0 var(--mint), 86px -18px 0 rgba(83, 214, 255, 0.72);
|
||||
}
|
||||
|
||||
.pulse-node::before {
|
||||
position: absolute;
|
||||
left: -2px;
|
||||
top: -2px;
|
||||
width: 112px;
|
||||
height: 36px;
|
||||
content: "";
|
||||
border-top: 1px solid rgba(83, 214, 255, 0.34);
|
||||
border-right: 1px solid rgba(143, 247, 209, 0.26);
|
||||
transform: skewX(-24deg);
|
||||
}
|
||||
|
||||
.loading-copy {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.loading-eyebrow {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 5px 10px;
|
||||
border: 1px solid rgba(83, 214, 255, 0.32);
|
||||
border-radius: 999px;
|
||||
color: var(--mint);
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
background: rgba(83, 214, 255, 0.08);
|
||||
}
|
||||
|
||||
.loading-eyebrow::before {
|
||||
width: 7px;
|
||||
height: 7px;
|
||||
content: "";
|
||||
border-radius: 50%;
|
||||
background: var(--mint);
|
||||
box-shadow: 0 0 14px var(--mint);
|
||||
}
|
||||
|
||||
.loading-title {
|
||||
margin: 16px 0 8px;
|
||||
color: var(--text);
|
||||
font-size: 30px;
|
||||
font-weight: 800;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.loading-subtitle {
|
||||
margin: 0;
|
||||
color: var(--muted);
|
||||
font-size: 14px;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
.progress-track {
|
||||
position: relative;
|
||||
height: 8px;
|
||||
margin: 26px 0 18px;
|
||||
overflow: hidden;
|
||||
border-radius: 999px;
|
||||
background: rgba(143, 190, 214, 0.16);
|
||||
}
|
||||
|
||||
.progress-track::before {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
width: 44%;
|
||||
content: "";
|
||||
border-radius: inherit;
|
||||
background: linear-gradient(90deg, var(--cyan), var(--mint), var(--gold));
|
||||
animation: progress 1.8s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.loading-steps {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.loading-step {
|
||||
padding: 10px 12px;
|
||||
border: 1px solid rgba(83, 214, 255, 0.18);
|
||||
border-radius: 8px;
|
||||
color: #c8e5f5;
|
||||
font-size: 13px;
|
||||
background: rgba(3, 19, 34, 0.52);
|
||||
}
|
||||
|
||||
.loading-step span {
|
||||
display: block;
|
||||
margin-bottom: 4px;
|
||||
color: var(--mint);
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
@keyframes shell-in {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(14px);
|
||||
}
|
||||
|
||||
.loading-shell {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
display: grid;
|
||||
grid-template-columns: 154px minmax(320px, 520px);
|
||||
gap: 30px;
|
||||
align-items: center;
|
||||
max-width: min(820px, calc(100vw - 40px));
|
||||
padding: 34px 38px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 8px;
|
||||
background: linear-gradient(145deg, rgba(14, 42, 68, 0.92), rgba(6, 20, 38, 0.9)), var(--panel);
|
||||
box-shadow:
|
||||
0 24px 70px rgba(0, 0, 0, 0.34),
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.06);
|
||||
animation: shell-in 0.7s ease both;
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.loading-mark {
|
||||
position: relative;
|
||||
width: 154px;
|
||||
height: 154px;
|
||||
overflow: hidden;
|
||||
border: 1px solid rgba(83, 214, 255, 0.28);
|
||||
border-radius: 8px;
|
||||
background: linear-gradient(90deg, transparent 23px, rgba(83, 214, 255, 0.11) 24px, transparent 25px), linear-gradient(0deg, transparent 23px, rgba(83, 214, 255, 0.1) 24px, transparent 25px), rgba(5, 22, 39, 0.9);
|
||||
background-size: 25px 25px;
|
||||
@keyframes card-float {
|
||||
0%,
|
||||
100% {
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.learning-card {
|
||||
position: absolute;
|
||||
left: 27px;
|
||||
top: 34px;
|
||||
width: 100px;
|
||||
height: 72px;
|
||||
border: 1px solid rgba(143, 247, 209, 0.36);
|
||||
border-radius: 6px;
|
||||
background: linear-gradient(180deg, rgba(143, 247, 209, 0.18), rgba(83, 214, 255, 0.08));
|
||||
box-shadow: 0 10px 28px rgba(83, 214, 255, 0.12);
|
||||
animation: card-float 2.8s ease-in-out infinite;
|
||||
50% {
|
||||
transform: translateY(-8px);
|
||||
}
|
||||
}
|
||||
|
||||
.learning-card::before,
|
||||
.learning-card::after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
@keyframes spin {
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.learning-card::before {
|
||||
left: 15px;
|
||||
top: 18px;
|
||||
width: 70px;
|
||||
height: 5px;
|
||||
border-radius: 99px;
|
||||
background: var(--mint);
|
||||
box-shadow:
|
||||
0 15px 0 rgba(211, 239, 255, 0.7),
|
||||
0 30px 0 rgba(211, 239, 255, 0.42);
|
||||
@keyframes progress {
|
||||
0% {
|
||||
transform: translateX(-110%);
|
||||
}
|
||||
|
||||
.learning-card::after {
|
||||
right: -18px;
|
||||
bottom: -18px;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
border: 2px solid var(--gold);
|
||||
border-left-color: transparent;
|
||||
border-radius: 50%;
|
||||
animation: spin 1.4s linear infinite;
|
||||
55% {
|
||||
transform: translateX(82%);
|
||||
}
|
||||
|
||||
.pulse-node {
|
||||
position: absolute;
|
||||
left: 22px;
|
||||
bottom: 22px;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 50%;
|
||||
background: var(--cyan);
|
||||
box-shadow:
|
||||
28px -8px 0 var(--gold),
|
||||
58px 4px 0 var(--mint),
|
||||
86px -18px 0 rgba(83, 214, 255, 0.72);
|
||||
100% {
|
||||
transform: translateX(240%);
|
||||
}
|
||||
}
|
||||
|
||||
.pulse-node::before {
|
||||
position: absolute;
|
||||
left: -2px;
|
||||
top: -2px;
|
||||
width: 112px;
|
||||
height: 36px;
|
||||
content: "";
|
||||
border-top: 1px solid rgba(83, 214, 255, 0.34);
|
||||
border-right: 1px solid rgba(143, 247, 209, 0.26);
|
||||
transform: skewX(-24deg);
|
||||
}
|
||||
|
||||
.loading-copy {
|
||||
min-width: 0;
|
||||
@media (max-width: 720px) {
|
||||
.loading-shell {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 22px;
|
||||
padding: 26px;
|
||||
}
|
||||
|
||||
.loading-eyebrow {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 5px 10px;
|
||||
border: 1px solid rgba(83, 214, 255, 0.32);
|
||||
border-radius: 999px;
|
||||
color: var(--mint);
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
background: rgba(83, 214, 255, 0.08);
|
||||
.loading-mark {
|
||||
width: 132px;
|
||||
height: 132px;
|
||||
}
|
||||
|
||||
.loading-eyebrow::before {
|
||||
width: 7px;
|
||||
height: 7px;
|
||||
content: "";
|
||||
border-radius: 50%;
|
||||
background: var(--mint);
|
||||
box-shadow: 0 0 14px var(--mint);
|
||||
.learning-card {
|
||||
left: 16px;
|
||||
top: 26px;
|
||||
}
|
||||
|
||||
.loading-title {
|
||||
margin: 16px 0 8px;
|
||||
color: var(--text);
|
||||
font-size: 30px;
|
||||
font-weight: 800;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.loading-subtitle {
|
||||
margin: 0;
|
||||
color: var(--muted);
|
||||
font-size: 14px;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
.progress-track {
|
||||
position: relative;
|
||||
height: 8px;
|
||||
margin: 26px 0 18px;
|
||||
overflow: hidden;
|
||||
border-radius: 999px;
|
||||
background: rgba(143, 190, 214, 0.16);
|
||||
}
|
||||
|
||||
.progress-track::before {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
width: 44%;
|
||||
content: "";
|
||||
border-radius: inherit;
|
||||
background: linear-gradient(90deg, var(--cyan), var(--mint), var(--gold));
|
||||
animation: progress 1.8s ease-in-out infinite;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.loading-steps {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
gap: 10px;
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.loading-step {
|
||||
padding: 10px 12px;
|
||||
border: 1px solid rgba(83, 214, 255, 0.18);
|
||||
border-radius: 8px;
|
||||
color: #c8e5f5;
|
||||
font-size: 13px;
|
||||
background: rgba(3, 19, 34, 0.52);
|
||||
}
|
||||
|
||||
.loading-step span {
|
||||
display: block;
|
||||
margin-bottom: 4px;
|
||||
color: var(--mint);
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
@keyframes shell-in {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(14px);
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes card-float {
|
||||
0%,
|
||||
100% {
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: translateY(-8px);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
animation-duration: 0.001ms !important;
|
||||
animation-iteration-count: 1 !important;
|
||||
}
|
||||
|
||||
@keyframes progress {
|
||||
0% {
|
||||
transform: translateX(-110%);
|
||||
}
|
||||
|
||||
55% {
|
||||
transform: translateX(82%);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: translateX(240%);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 720px) {
|
||||
.loading-shell {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 22px;
|
||||
padding: 26px;
|
||||
}
|
||||
|
||||
.loading-mark {
|
||||
width: 132px;
|
||||
height: 132px;
|
||||
}
|
||||
|
||||
.learning-card {
|
||||
left: 16px;
|
||||
top: 26px;
|
||||
}
|
||||
|
||||
.loading-title {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.loading-steps {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
animation-duration: 0.001ms !important;
|
||||
animation-iteration-count: 1 !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="app">
|
||||
<div id="loading-wrapper">
|
||||
<div class="loading-shell" role="status" aria-live="polite">
|
||||
<div class="loading-mark" aria-hidden="true">
|
||||
<div class="learning-card"></div>
|
||||
<div class="pulse-node"></div>
|
||||
</div>
|
||||
<div class="loading-copy">
|
||||
<div class="loading-eyebrow">Teaching Lab System</div>
|
||||
<h1 class="loading-title">正在初始化教学环境</h1>
|
||||
<p class="loading-subtitle">正在同步课程资源、实训数据与学习进度,请稍候。</p>
|
||||
<div class="progress-track" aria-hidden="true"></div>
|
||||
<div class="loading-steps" aria-hidden="true">
|
||||
<div class="loading-step">
|
||||
<span>01</span>
|
||||
课程资源
|
||||
</div>
|
||||
<div class="loading-step">
|
||||
<span>02</span>
|
||||
实训任务
|
||||
</div>
|
||||
<div class="loading-step">
|
||||
<span>03</span>
|
||||
学习数据
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="app">
|
||||
<div id="loading-wrapper">
|
||||
<div class="loading-shell" role="status" aria-live="polite">
|
||||
<div class="loading-mark" aria-hidden="true">
|
||||
<div class="learning-card"></div>
|
||||
<div class="pulse-node"></div>
|
||||
</div>
|
||||
<div class="loading-copy">
|
||||
<div class="loading-eyebrow">Teaching Lab System</div>
|
||||
<h1 class="loading-title">正在初始化教学环境</h1>
|
||||
<p class="loading-subtitle">正在同步课程资源、实训数据与学习进度,请稍候。</p>
|
||||
<div class="progress-track" aria-hidden="true"></div>
|
||||
<div class="loading-steps" aria-hidden="true">
|
||||
<div class="loading-step"><span>01</span>课程资源</div>
|
||||
<div class="loading-step"><span>02</span>实训任务</div>
|
||||
<div class="loading-step"><span>03</span>学习数据</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="module" src="/src/main.js"></script>
|
||||
</body>
|
||||
</div>
|
||||
<script type="module" src="/src/main.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue