|
|
@@ -1,101 +1,106 @@
|
|
|
<!DOCTYPE html>
|
|
|
<html lang="en">
|
|
|
- <head>
|
|
|
- <meta charset="UTF-8" />
|
|
|
- <link rel="icon" href="/logo_1.png" />
|
|
|
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
|
- <title>采销bate3.0公测版结算平台</title>
|
|
|
- <script src="/sortable.min.js"></script>
|
|
|
- <script>
|
|
|
- window.process = {};
|
|
|
- </script>
|
|
|
- </head>
|
|
|
|
|
|
- <body>
|
|
|
- <div id="app">
|
|
|
- <style>
|
|
|
- html,
|
|
|
- body,
|
|
|
- #app {
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- display: flex;
|
|
|
- position: relative;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- overflow: hidden;
|
|
|
- }
|
|
|
+<head>
|
|
|
+ <meta charset="UTF-8" />
|
|
|
+ <link rel="icon" href="/logo_1.png" />
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
|
+ <title>采销365结算</title>
|
|
|
+ <script src="/sortable.min.js"></script>
|
|
|
+ <script>
|
|
|
+ window.process = {};
|
|
|
+ </script>
|
|
|
+</head>
|
|
|
|
|
|
- .loader,
|
|
|
- .loader:before,
|
|
|
- .loader:after {
|
|
|
- border-radius: 50%;
|
|
|
- width: 2.5em;
|
|
|
- height: 2.5em;
|
|
|
- -webkit-animation-fill-mode: both;
|
|
|
- animation-fill-mode: both;
|
|
|
- -webkit-animation: loadAnimation 1.8s infinite ease-in-out;
|
|
|
- animation: loadAnimation 1.8s infinite ease-in-out;
|
|
|
- }
|
|
|
+<body>
|
|
|
+ <div id="app">
|
|
|
+ <style>
|
|
|
+ html,
|
|
|
+ body,
|
|
|
+ #app {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ position: relative;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
|
|
|
- .loader {
|
|
|
- color: #406eeb;
|
|
|
- font-size: 10px;
|
|
|
- margin: 80px auto;
|
|
|
- position: relative;
|
|
|
- text-indent: -9999em;
|
|
|
- -webkit-transform: translateZ(0);
|
|
|
- -ms-transform: translateZ(0);
|
|
|
- transform: translateZ(0);
|
|
|
- -webkit-animation-delay: -0.16s;
|
|
|
- animation-delay: -0.16s;
|
|
|
- top: 0;
|
|
|
- transform: translate(-50%, 0);
|
|
|
- }
|
|
|
+ .loader,
|
|
|
+ .loader:before,
|
|
|
+ .loader:after {
|
|
|
+ border-radius: 50%;
|
|
|
+ width: 2.5em;
|
|
|
+ height: 2.5em;
|
|
|
+ -webkit-animation-fill-mode: both;
|
|
|
+ animation-fill-mode: both;
|
|
|
+ -webkit-animation: loadAnimation 1.8s infinite ease-in-out;
|
|
|
+ animation: loadAnimation 1.8s infinite ease-in-out;
|
|
|
+ }
|
|
|
|
|
|
- .loader:before,
|
|
|
- .loader:after {
|
|
|
- content: "";
|
|
|
- position: absolute;
|
|
|
- top: 0;
|
|
|
- }
|
|
|
+ .loader {
|
|
|
+ color: #406eeb;
|
|
|
+ font-size: 10px;
|
|
|
+ margin: 80px auto;
|
|
|
+ position: relative;
|
|
|
+ text-indent: -9999em;
|
|
|
+ -webkit-transform: translateZ(0);
|
|
|
+ -ms-transform: translateZ(0);
|
|
|
+ transform: translateZ(0);
|
|
|
+ -webkit-animation-delay: -0.16s;
|
|
|
+ animation-delay: -0.16s;
|
|
|
+ top: 0;
|
|
|
+ transform: translate(-50%, 0);
|
|
|
+ }
|
|
|
+
|
|
|
+ .loader:before,
|
|
|
+ .loader:after {
|
|
|
+ content: "";
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .loader:before {
|
|
|
+ left: -3.5em;
|
|
|
+ -webkit-animation-delay: -0.32s;
|
|
|
+ animation-delay: -0.32s;
|
|
|
+ }
|
|
|
|
|
|
- .loader:before {
|
|
|
- left: -3.5em;
|
|
|
- -webkit-animation-delay: -0.32s;
|
|
|
- animation-delay: -0.32s;
|
|
|
+ .loader:after {
|
|
|
+ left: 3.5em;
|
|
|
+ }
|
|
|
+
|
|
|
+ @-webkit-keyframes loadAnimation {
|
|
|
+
|
|
|
+ 0%,
|
|
|
+ 80%,
|
|
|
+ 100% {
|
|
|
+ box-shadow: 0 2.5em 0 -1.3em;
|
|
|
}
|
|
|
|
|
|
- .loader:after {
|
|
|
- left: 3.5em;
|
|
|
+ 40% {
|
|
|
+ box-shadow: 0 2.5em 0 0;
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- @-webkit-keyframes loadAnimation {
|
|
|
- 0%,
|
|
|
- 80%,
|
|
|
- 100% {
|
|
|
- box-shadow: 0 2.5em 0 -1.3em;
|
|
|
- }
|
|
|
+ @keyframes loadAnimation {
|
|
|
|
|
|
- 40% {
|
|
|
- box-shadow: 0 2.5em 0 0;
|
|
|
- }
|
|
|
+ 0%,
|
|
|
+ 80%,
|
|
|
+ 100% {
|
|
|
+ box-shadow: 0 2.5em 0 -1.3em;
|
|
|
}
|
|
|
|
|
|
- @keyframes loadAnimation {
|
|
|
- 0%,
|
|
|
- 80%,
|
|
|
- 100% {
|
|
|
- box-shadow: 0 2.5em 0 -1.3em;
|
|
|
- }
|
|
|
-
|
|
|
- 40% {
|
|
|
- box-shadow: 0 2.5em 0 0;
|
|
|
- }
|
|
|
+ 40% {
|
|
|
+ box-shadow: 0 2.5em 0 0;
|
|
|
}
|
|
|
- </style>
|
|
|
- <div class="loader"></div>
|
|
|
- </div>
|
|
|
- <script type="module" src="/src/main.ts"></script>
|
|
|
- </body>
|
|
|
+ }
|
|
|
+
|
|
|
+ </style>
|
|
|
+ <div class="loader"></div>
|
|
|
+ </div>
|
|
|
+ <script type="module" src="/src/main.ts"></script>
|
|
|
+</body>
|
|
|
+
|
|
|
</html>
|
