浏览代码

✨ feat(plant2-demo): 创建荆楚农事智慧农业数据驾驶舱首页

- 添加index.html文件作为应用入口
- 实现加载动画效果,包含8个动画圆点的loading组件
- 配置页面元数据和视口设置
- 引入必要的JavaScript模块和CSS样式表
- 设置应用容器和初始加载状态UI
yourname 1 月之前
父节点
当前提交
00dde4fca4
共有 1 个文件被更改,包括 139 次插入0 次删除
  1. 139 0
      plant2-demo/index.html

+ 139 - 0
plant2-demo/index.html

@@ -0,0 +1,139 @@
+<!doctype html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8"/>
+        <link rel="icon" type="image/svg+xml" href="/datav/logo.ico"/>
+        <meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1,minimum-scale=1,maximum-scale=1,viewport-fit=cover"/>
+        <title>荆楚农事智慧农业数据驾驶舱</title>
+        <style>
+            #firstLoad {
+                width: 80px;
+                height: 80px;
+                position: absolute;
+                z-index: 999;
+                left: 50%;
+                top: 50%;
+                transform: translate(-50%,-50%)
+            }
+
+            #firstLoad span {
+                display: inline-block;
+                width: 15px;
+                height: 15px;
+                border-radius: 50%;
+                background: #fff;
+                position: absolute;
+                -webkit-animation: load 1.04s ease infinite
+            }
+
+            @-webkit-keyframes load {
+                0% {
+                    -webkit-transform: scale(1.2);
+                    opacity: 1
+                }
+
+                100% {
+                    -webkit-transform: scale(.3);
+                    opacity: .5
+                }
+            }
+
+            #firstLoad span:first-child {
+                left: 0;
+                top: 50%;
+                margin-top: -10px;
+                -webkit-animation-delay: .13s
+            }
+
+            #firstLoad span:nth-child(2) {
+                left: 10px;
+                top: 10px;
+                -webkit-animation-delay: .26s
+            }
+
+            #firstLoad span:nth-child(3) {
+                left: 50%;
+                top: 0;
+                margin-left: -10px;
+                -webkit-animation-delay: .39s
+            }
+
+            #firstLoad span:nth-child(4) {
+                top: 10px;
+                right: 10px;
+                -webkit-animation-delay: .52s
+            }
+
+            #firstLoad span:nth-child(5) {
+                right: 0;
+                top: 50%;
+                margin-top: -10px;
+                -webkit-animation-delay: .65s
+            }
+
+            #firstLoad span:nth-child(6) {
+                right: 10px;
+                bottom: 10px;
+                -webkit-animation-delay: .78s
+            }
+
+            #firstLoad span:nth-child(7) {
+                bottom: 0;
+                left: 50%;
+                margin-left: -10px;
+                -webkit-animation-delay: .91s
+            }
+
+            #firstLoad span:nth-child(8) {
+                bottom: 10px;
+                left: 10px;
+                -webkit-animation-delay: 1.04s
+            }
+        </style>
+        <script type="module" crossorigin src="/datav/assets/js/index-6530d0f6.js"></script>
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/@vue-37836d09.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/vue-router-c7cbbcaa.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/lodash-es-acda58df.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/@vueuse-1ddca6f0.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/@element-plus-bb6eebe0.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/@popperjs-b696b006.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/@ctrl-41c0891e.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/d3-array-d83825ab.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/d3-geo-106fc929.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/@turf-e5dd68ad.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/dayjs-423c4f07.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/async-validator-7d693152.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/memoize-one-63ab667a.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/normalize-wheel-es-cf7d7ba7.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/@floating-ui-f285e0b8.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/element-plus-842069d4.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/vue-next-wxlogin-91e03b70.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/vue-demi-71ba0ef2.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/pinia-0c8641d4.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/destr-9c6e2924.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/deep-pick-omit-418f72d7.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/pinia-plugin-persistedstate-1ec13968.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/zrender-ee9f2f6d.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/echarts-a77f8af6.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/nprogress-85851b89.js">
+        <link rel="modulepreload" crossorigin href="/datav/assets/js/mapbox-gl-b315653c.js">
+        <link rel="stylesheet" href="/datav/assets/css/element-plus-12e19b9b.css">
+        <link rel="stylesheet" href="/datav/assets/css/vue-next-wxlogin-d8a75ef8.css">
+        <link rel="stylesheet" href="/datav/assets/css/nprogress-771398e6.css">
+        <link rel="stylesheet" href="/datav/assets/css/mapbox-gl-bbaabcf2.css">
+        <link rel="stylesheet" href="/datav/assets/css/index-de466de5.css">
+    </head>
+    <body>
+        <div id="firstLoad">
+            <span></span>
+            <span></span>
+            <span></span>
+            <span></span>
+            <span></span>
+            <span></span>
+            <span></span>
+            <span></span>
+        </div>
+        <div id="app"></div>
+    </body>
+</html>