update: 框架样式调整

shangbin · shangbin · commit 9d5c44b694e6 · 2021-12-06T14:57:28.000+08:00
diff --git a/index.html b/index.html
@@ -6,8 +6,17 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Vite App</title>
   </head>
+
+  <style type="text/css">
+    html, body {
+      height: 100%;
+      margin: 0;
+    }
+
+  </style>
+
   <body>
-    <div id="app"></div>
+    <div id="app" style="height:100%;"></div>
     <script type="module" src="/src/main.js"></script>
   </body>
 </html>
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -23,6 +23,7 @@
   },
   "dependencies": {
     "@babel/parser": "^7.11.5",
+    "@element-plus/icons": "0.0.11",
     "@originjs/vite-plugin-require-context": "^1.0.9",
     "@vitejs/plugin-vue": "^1.10.0",
     "@vue/compat": "^3.2.22",
diff --git a/public/index.html b/public/index.html
@@ -11,7 +11,7 @@
     <noscript>
       <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
     </noscript>
-    <div id="app"></div>
+    <div id="app" style="height:100%;"></div>
     <!-- built files will be auto injected -->
   </body>
 </html>
diff --git a/src/components/RawComponents.vue b/src/components/RawComponents.vue
@@ -19,15 +19,17 @@
         <div>
           <el-dropdown @command="handleCommand">
             <span class="el-dropdown-link">
-              <i ref="help" class="el-icon-question" style="font-size:22px;color:#4dba87;"></i>
+              <el-icon style="font-size:22px;color:#4dba87;"><question-filled /></el-icon>
             </span>
-            <el-dropdown-menu slot="dropdown">
-              <el-dropdown-item icon="el-icon-circle-check">基础组件数: {{ componentUnitNum }}
-              </el-dropdown-item>
-              <el-dropdown-item icon="el-icon-document" command="lcg">LCG平台</el-dropdown-item>
-              <el-dropdown-item icon="el-icon-document" command="help">说明文档</el-dropdown-item>
-              <el-dropdown-item icon="el-icon-chat-line-round" command="chat">在线沟通</el-dropdown-item>
-            </el-dropdown-menu>
+            <template #dropdown>
+              <el-dropdown-menu>
+                <el-dropdown-item icon="el-icon-circle-check">基础组件数: {{ componentUnitNum }}
+                </el-dropdown-item>
+                <el-dropdown-item icon="el-icon-document" command="lcg">LCG平台</el-dropdown-item>
+                <el-dropdown-item icon="el-icon-document" command="help">说明文档</el-dropdown-item>
+                <el-dropdown-item icon="el-icon-chat-line-round" command="chat">在线沟通</el-dropdown-item>
+              </el-dropdown-menu>
+            </template>
           </el-dropdown>
         </div>
       </div>
diff --git a/src/main.js b/src/main.js
@@ -1,11 +1,14 @@
 import { createApp, compile } from "vue";
 import ElementPlus from "element-plus";
+import { QuestionFilled } from "@element-plus/icons";
+
 import "element-plus/dist/index.css";
 import APP from "./App.vue";
 
 function createBaseApp(renderComponent = {}) {
   const app = createApp(renderComponent);
   app.use(ElementPlus);
+  app.component("question-filled", QuestionFilled)
   return app;
 }
 
