index.html 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177
  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8"/>
  5. <link href="/logo.png" rel="icon"/>
  6. <meta content="width=device-width, initial-scale=1.0" name="viewport"/>
  7. <meta
  8. content="Vue3 + Vite5 + TypeScript5 + Element-Plus 的后台管理模板,配套接口文档和后端源码,vue-element-admin 的 Vue3 版本"
  9. name="description"
  10. />
  11. <meta
  12. content="vue,element-plus,typescript,vue-element-admin,vue3-element-admin"
  13. name="keywords"
  14. />
  15. <script src="/sortable.js"></script>
  16. <title>生产线综合管控采集平台</title>
  17. <link rel="stylesheet" href="/LuckExcel/pluginsCss.css" />
  18. <link rel="stylesheet" href="/LuckExcel/plugins.css" />
  19. <link rel="stylesheet" href="/LuckExcel/luckysheet.css" />
  20. <link rel="stylesheet" href="/LuckExcel/iconfont.css" />
  21. <script src="/LuckExcel/plugin.js"></script>
  22. <script src="/LuckExcel/luckysheet.umd.js"></script>
  23. </head>
  24. <body>
  25. <div id="app">
  26. <div class="loader"></div>
  27. </div>
  28. </body>
  29. <script src="/src/main.ts" type="module"></script>
  30. <style>
  31. html,
  32. body,
  33. #app {
  34. position: relative;
  35. display: flex;
  36. align-items: center;
  37. justify-content: center;
  38. width: 100%;
  39. height: 100%;
  40. }
  41. .loader {
  42. position: relative;
  43. width: 40px;
  44. aspect-ratio: 0.577;
  45. overflow: hidden;
  46. clip-path: polygon(0 0, 100% 100%, 0 100%, 100% 0);
  47. animation: l19 2s infinite linear;
  48. }
  49. .loader::before {
  50. position: absolute;
  51. inset: -150%;
  52. content: "";
  53. background: repeating-conic-gradient(
  54. from 30deg,
  55. #ffabab 0 60deg,
  56. #abe4ff 0 120deg,
  57. #ff7373 0 180deg
  58. );
  59. animation: inherit;
  60. animation-direction: reverse;
  61. }
  62. /* 甘特图样式控制 */
  63. .gantt_task_line {
  64. border-radius: 20px !important;
  65. border: 0px solid black;
  66. }
  67. .gantt_tooltip {
  68. font-size: 15px;
  69. font-weight: 300;
  70. }
  71. .gantt_tree_content {
  72. font-size: 15px !important;
  73. }
  74. .gantt_grid_data {
  75. background-color: rgba(0, 0, 0, 0.1);
  76. .gantt_row_task {
  77. background-color: rgba(0, 0, 0, 0.1) !important;
  78. }
  79. .odd {
  80. background-color: rgba(0, 0, 0, 0.2) !important;
  81. }
  82. .gantt_row:hover {
  83. background-color: rgba(0, 0, 0, 0.4) !important;
  84. }
  85. .gantt_selected {
  86. background-color: rgb(123, 123, 123) !important;
  87. }
  88. }
  89. .gantt_task {
  90. .gantt_selected {
  91. background-color: rgb(123, 123, 123);
  92. .gantt_task_cell {
  93. border-color: white;
  94. }
  95. }
  96. }
  97. .gantt_data_area {
  98. background-color: rgba(0, 0, 0, 0.1);
  99. .gantt_task_cell {
  100. background-color: rgba(0, 0, 0, 0.1);
  101. border-color: white;
  102. }
  103. }
  104. .year {
  105. background: #ffcc00;
  106. color: #fff !important;
  107. font-size: 16px;
  108. }
  109. .month {
  110. background: #66ccff;
  111. color: #fff !important;
  112. font-size: 16px;
  113. }
  114. .day {
  115. background: #abe4ff;
  116. color: #fff !important;
  117. font-size: 16px;
  118. }
  119. .hour {
  120. background: #0bb051;
  121. color: #fff !important;
  122. font-size: 16px;
  123. }
  124. .gantt_grid_head_cell {
  125. font-size: 16px;
  126. color: white !important;
  127. font-weight: 600;
  128. border: 1px solid rgb(206, 206, 206);
  129. background-color: rgb(48, 65, 86, 0.6);
  130. }
  131. /* 滚动条样式 */
  132. ::-webkit-scrollbar {
  133. width: 6px !important; /* 设置滚动条的宽度 */
  134. }
  135. ::-webkit-scrollbar-track {
  136. background-color: #f0f2f5; /* 滚动条轨道的背景色 */
  137. }
  138. ::-webkit-scrollbar-thumb {
  139. background-color: #90939960; /* 滚动条的颜色 */
  140. border-radius: 8px !important; /* 滚动条的圆角 */
  141. }
  142. ::-webkit-scrollbar-thumb:hover {
  143. background-color: #5a5e66; /* 滚动条hover时的颜色 */
  144. }
  145. @keyframes l19 {
  146. 100% {
  147. transform: rotate(360deg);
  148. }
  149. }
  150. </style>
  151. </html>