From afaaf6062008d50ae2bb3218ea881a3b9858b328 Mon Sep 17 00:00:00 2001
From: "wu.jian2" <distantmtn@gmail.com>
Date: Wed, 9 Aug 2023 15:08:21 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E7=A7=BB=E5=8A=A8=E9=A1=B9?=
 =?UTF-8?q?=E7=9B=AE=E6=8F=8F=E8=BF=B0=E5=9B=BE=E7=89=87=E4=BD=8D=E7=BD=AE?=
 =?UTF-8?q?=EF=BC=8C=E4=B8=8D=E6=94=BE=E5=85=A5npm=E5=8C=85=E6=96=87?=
 =?UTF-8?q?=E4=BB=B6=E5=A4=B9=E4=B8=AD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../assets}/doc/images/design01.png           | Bin
 .../assets}/doc/images/home.png               | Bin
 .../assets}/doc/images/qq.png                 | Bin
 .../images => example/assets}/doc/logo.png    | Bin
 .../packages/BigScreenDesign/LeftPanel.vue    |  43 ++++++++++++++----
 5 files changed, 33 insertions(+), 10 deletions(-)
 rename data-room-ui/{packages/assets/images => example/assets}/doc/images/design01.png (100%)
 rename data-room-ui/{packages/assets/images => example/assets}/doc/images/home.png (100%)
 rename data-room-ui/{packages/assets/images => example/assets}/doc/images/qq.png (100%)
 rename data-room-ui/{packages/assets/images => example/assets}/doc/logo.png (100%)

diff --git a/data-room-ui/packages/assets/images/doc/images/design01.png b/data-room-ui/example/assets/doc/images/design01.png
similarity index 100%
rename from data-room-ui/packages/assets/images/doc/images/design01.png
rename to data-room-ui/example/assets/doc/images/design01.png
diff --git a/data-room-ui/packages/assets/images/doc/images/home.png b/data-room-ui/example/assets/doc/images/home.png
similarity index 100%
rename from data-room-ui/packages/assets/images/doc/images/home.png
rename to data-room-ui/example/assets/doc/images/home.png
diff --git a/data-room-ui/packages/assets/images/doc/images/qq.png b/data-room-ui/example/assets/doc/images/qq.png
similarity index 100%
rename from data-room-ui/packages/assets/images/doc/images/qq.png
rename to data-room-ui/example/assets/doc/images/qq.png
diff --git a/data-room-ui/packages/assets/images/doc/logo.png b/data-room-ui/example/assets/doc/logo.png
similarity index 100%
rename from data-room-ui/packages/assets/images/doc/logo.png
rename to data-room-ui/example/assets/doc/logo.png
diff --git a/data-room-ui/packages/BigScreenDesign/LeftPanel.vue b/data-room-ui/packages/BigScreenDesign/LeftPanel.vue
index 57c4a17b..16647db0 100644
--- a/data-room-ui/packages/BigScreenDesign/LeftPanel.vue
+++ b/data-room-ui/packages/BigScreenDesign/LeftPanel.vue
@@ -95,10 +95,9 @@
                     <div
                       v-for="element in menu.components"
                       :key="element.type + element.name"
-                      :class="
-                        element.component
-                          ? 'item menu-component drag-node'
-                          : 'item drag-node'
+                      :class="element.component
+                        ? 'item menu-component drag-node'
+                        : 'item drag-node'
                       "
                       draggable="true"
                       :data-type="element.type"
@@ -111,11 +110,18 @@
                         class="img_dispaly chooseDragNode"
                         @click.stop="addComponent(element)"
                       >
-                        <icon-svg
+                        <svg
+                          v-if="element.icon"
+                          class="icon-svg"
+                          aria-hidden="true"
+                        >
+                          <use :xlink:href="`#icon-a-${element.icon}`" />
+                        </svg>
+                        <!-- <icon-svg
                           v-if="element.icon"
                           :name="element.icon"
                           class="page-opt-list-icon"
-                        />
+                        /> -->
                         <img
                           v-else-if="element.img"
                           :src="element.img"
@@ -140,6 +146,8 @@
   </transition>
 </template>
 <script>
+
+import './data-room-ui-icon/iconfont.js'
 import _ from 'lodash'
 import basicComponents from 'data-room-ui/js/config/basicComponentsConfig'
 import g2PlotComponents, { getCustomPlots } from '../G2Plots/plotList'
@@ -284,14 +292,14 @@ export default {
       // this.$emit('onStart', e)
     },
     // 拖拽组件时触发
-    onEnd (e) {},
+    onEnd (e) { },
     // 点击左侧组件时触发
     addComponent (element) {
       this.$store.commit('bigScreen/changeActiveItem', element)
       this.$emit('addComponent', element)
     },
     // 初始化
-    initList () {},
+    initList () { },
     // 点击tab标签
     tabClick (tab) {
       this.nodeDrag()
@@ -327,6 +335,7 @@ export default {
 
 <style lang="scss" scoped>
 @import '../BigScreenDesign/fonts/iconfont.css';
+
 .bs-left-panel {
   display: flex;
   background-color: var(--bs-background-1);
@@ -354,7 +363,7 @@ export default {
   .page-left {
     box-sizing: border-box;
 
-    > * {
+    >* {
       color: #fff;
     }
 
@@ -378,6 +387,7 @@ export default {
         .iconfont-bigscreen {
           color: var(--bs-el-color-primary);
         }
+
         .menu-title-span {
           color: var(--bs-el-color-primary);
         }
@@ -406,6 +416,7 @@ export default {
             /*border-left: 4px solid #007aff;*/
             position: relative;
             padding-left: 12px;
+
             &:after {
               position: absolute;
               left: 0;
@@ -418,9 +429,11 @@ export default {
             }
           }
         }
+
         .el-scrollbar__view {
           height: calc(100vh - 55px);
         }
+
         .page-left-content-components {
           width: 100%;
           text-align: center;
@@ -448,6 +461,7 @@ export default {
                 padding: 4px 8px;
                 text-align: left;
               }
+
               .sampleImg {
                 margin: 0 auto;
                 width: 102px;
@@ -464,6 +478,9 @@ export default {
                 .icon-svg {
                   width: 60px !important;
                   height: 60px !important;
+                  vertical-align: -0.15em;
+                  fill: currentColor;
+                  overflow: hidden;
                 }
 
                 img {
@@ -479,6 +496,7 @@ export default {
                 height: 75px;
                 margin: 0 auto;
               }
+
               .img_dispaly {
                 height: 80px;
               }
@@ -526,9 +544,11 @@ export default {
       border: none;
     }
   }
+
   .left-tabs-box {
     ::v-deep.el-tabs__item {
       height: 70px !important;
+
       .menu-slot {
         height: 100%;
         display: flex;
@@ -536,9 +556,11 @@ export default {
         align-items: center;
         flex-wrap: wrap;
         color: #bcc9d4;
+
         .menu-icon {
           height: 20px;
         }
+
         .menu-title-span {
           display: block;
           width: 100%;
@@ -560,7 +582,8 @@ export default {
 .slide-fade-enter,
 .slide-fade-leave-to
 
-/* .slide-fade-leave-active for below version 2.1.8 */ {
+/* .slide-fade-leave-active for below version 2.1.8 */
+  {
   transform: translateX(10px);
   opacity: 0;
 }