feat: 将设计器左侧的图标换成iconfont的symbol引入

data-room-ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gcpaas/data-room-ui",
-  "version": "1.0.1-2023080804-Alpha",
+  "version": "1.0.1-2023080902-Alpha",
   "description": "自定义大屏",
   "author": "gcpaas",
   "license": "MIT",

data-room-ui/packages/BigScreenDesign/LeftPanel.vue

@@ -147,7 +147,7 @@
 </template>
 <script>
 
-import './data-room-ui-icon/iconfont.js'
+import 'data-room-ui/assets/symbols/bigScreenIcon/iconfont.js'
 import _ from 'lodash'
 import basicComponents from 'data-room-ui/js/config/basicComponentsConfig'
 import g2PlotComponents, { getCustomPlots } from '../G2Plots/plotList'

data-room-ui/packages/assets/images/bigScreenIcon/export.js

@@ -1,4 +1,3 @@
-
 const svgFiles = require.context('./svg', true, /\.svg$/)
 const iconList = svgFiles.keys()?.map(item => svgFiles(item))
 export default {

data-room-ui/packages/assets/symbols/bigScreenIcon/iconfont.json

@@ -0,0 +1,121 @@
+{
+  "id": "4203436",
+  "name": "big-screen-icon",
+  "font_family": "iconfont",
+  "css_prefix_text": "icon-",
+  "description": "",
+  "glyphs": [
+    {
+      "icon_id": "36836851",
+      "name": "08z9iframe",
+      "font_class": "a-08z9iframe",
+      "unicode": "e611",
+      "unicode_decimal": 58897
+    },
+    {
+      "icon_id": "36836852",
+      "name": "10hengxian",
+      "font_class": "a-10hengxian",
+      "unicode": "e612",
+      "unicode_decimal": 58898
+    },
+    {
+      "icon_id": "36836853",
+      "name": "04table",
+      "font_class": "a-04table",
+      "unicode": "e613",
+      "unicode_decimal": 58899
+    },
+    {
+      "icon_id": "36836854",
+      "name": "01carousel",
+      "font_class": "a-01carousel",
+      "unicode": "e614",
+      "unicode_decimal": 58900
+    },
+    {
+      "icon_id": "36836855",
+      "name": "11shuxian",
+      "font_class": "a-11shuxian",
+      "unicode": "e615",
+      "unicode_decimal": 58901
+    },
+    {
+      "icon_id": "36836856",
+      "name": "07timeCountDown",
+      "font_class": "a-07timeCountDown",
+      "unicode": "e616",
+      "unicode_decimal": 58902
+    },
+    {
+      "icon_id": "36836857",
+      "name": "03rank",
+      "font_class": "a-03rank",
+      "unicode": "e617",
+      "unicode_decimal": 58903
+    },
+    {
+      "icon_id": "36836858",
+      "name": "02scrollBoard",
+      "font_class": "a-02scrollBoard",
+      "unicode": "e618",
+      "unicode_decimal": 58904
+    },
+    {
+      "icon_id": "36836859",
+      "name": "14button",
+      "font_class": "a-14button",
+      "unicode": "e619",
+      "unicode_decimal": 58905
+    },
+    {
+      "icon_id": "36836860",
+      "name": "13input",
+      "font_class": "a-13input",
+      "unicode": "e61a",
+      "unicode_decimal": 58906
+    },
+    {
+      "icon_id": "36836861",
+      "name": "12video",
+      "font_class": "a-12video",
+      "unicode": "e61b",
+      "unicode_decimal": 58907
+    },
+    {
+      "icon_id": "36836862",
+      "name": "15link",
+      "font_class": "a-15link",
+      "unicode": "e61c",
+      "unicode_decimal": 58908
+    },
+    {
+      "icon_id": "36836863",
+      "name": "09digtal",
+      "font_class": "a-09digtal",
+      "unicode": "e61d",
+      "unicode_decimal": 58909
+    },
+    {
+      "icon_id": "36836864",
+      "name": "06currentTime",
+      "font_class": "a-06currentTime",
+      "unicode": "e61e",
+      "unicode_decimal": 58910
+    },
+    {
+      "icon_id": "36836865",
+      "name": "05map",
+      "font_class": "a-05map",
+      "unicode": "e61f",
+      "unicode_decimal": 58911
+    },
+    {
+      "icon_id": "36836866",
+      "name": "00LcdpText",
+      "font_class": "a-00LcdpText",
+      "unicode": "e620",
+      "unicode_decimal": 58912
+    }
+  ]
+}

data-room-ui/packages/js/utils/getComponentConfig.js

@@ -1,5 +1,5 @@
-import Icon from 'data-room-ui/assets/images/bigScreenIcon/export'
-// import _ from 'lodash'
+import * as iconData from 'data-room-ui/assets/symbols/bigScreenIcon/iconfont.json'
+const iconNames = iconData.glyphs.map(item => item.name).sort((a, b) => a.localeCompare(b))
 export default function getComponentConfig (type) {
   // const _type = _.upperFirst(type)
   // const className = `com.gccloud.starter.lowcode.page.bigscreen.components.${_type}Chart`
@@ -8,7 +8,7 @@ export default function getComponentConfig (type) {
       return {
         name: '文本',
         title: '文本',
-        icon: Icon.getNameList()[0],
+        icon: iconNames[0],
         className:
           'com.gccloud.dataroom.core.module.chart.components.ScreenTextChart',
         w: 150,
@@ -21,7 +21,7 @@ export default function getComponentConfig (type) {
       return {
         name: '超链接',
         title: '超链接',
-        icon: Icon.getNameList()[15],
+        icon: iconNames[15],
         className:
           'com.gccloud.dataroom.core.module.chart.components.ScreenLinkChart',
         w: 150,
@@ -34,7 +34,7 @@ export default function getComponentConfig (type) {
       return {
         name: '水平线',
         title: '水平线',
-        icon: Icon.getNameList()[10],
+        icon: iconNames[10],
         component: null,
         className:
           'com.gccloud.dataroom.core.module.chart.components.ScreenBorderChart',
@@ -48,7 +48,7 @@ export default function getComponentConfig (type) {
       return {
         name: '垂直线',
         title: '垂直线',
-        icon: Icon.getNameList()[11],
+        icon: iconNames[11],
         component: null,
         className:
           'com.gccloud.dataroom.core.module.chart.components.ScreenBorderChart',
@@ -63,7 +63,7 @@ export default function getComponentConfig (type) {
       return {
         name: '图片',
         title: '图片',
-        icon: Icon.getNameList()[1],
+        icon: iconNames[1],
         className:
           'com.gccloud.dataroom.core.module.chart.components.ScreenPictureChart',
         w: 280,
@@ -76,7 +76,7 @@ export default function getComponentConfig (type) {
       return {
         name: '轮播表',
         title: '轮播表',
-        icon: Icon.getNameList()[2],
+        icon: iconNames[2],
         className:
           'com.gccloud.dataroom.core.module.chart.components.ScreenScrollBoardChart',
         w: 600,
@@ -89,7 +89,7 @@ export default function getComponentConfig (type) {
       return {
         name: '排名表',
         title: '排名表',
-        icon: Icon.getNameList()[3],
+        icon: iconNames[3],
         className:
           'com.gccloud.dataroom.core.module.chart.components.ScreenScrollRankingChart',
         w: 600,
@@ -102,7 +102,7 @@ export default function getComponentConfig (type) {
       return {
         name: '表格',
         title: '表格',
-        icon: Icon.getNameList()[4],
+        icon: iconNames[4],
         className:
           'com.gccloud.dataroom.core.module.chart.components.ScreenTablesChart',
         w: 600,
@@ -115,7 +115,7 @@ export default function getComponentConfig (type) {
       return {
         name: '当前时间',
         title: '当前时间',
-        icon: Icon.getNameList()[6],
+        icon: iconNames[6],
         className:
           'com.gccloud.dataroom.core.module.chart.components.ScreenCurrentTimeChart',
         w: 380,
@@ -128,7 +128,7 @@ export default function getComponentConfig (type) {
       return {
         name: '倒计时',
         title: '倒计时',
-        icon: Icon.getNameList()[7],
+        icon: iconNames[7],
         className:
           'com.gccloud.dataroom.core.module.chart.components.ScreenTimeCountDownChart',
         w: 500,
@@ -141,7 +141,7 @@ export default function getComponentConfig (type) {
       return {
         name: '外链',
         title: '外链',
-        icon: Icon.getNameList()[8],
+        icon: iconNames[8],
         className:
           'com.gccloud.dataroom.core.module.chart.components.ScreenIframeChart',
         w: 600,
@@ -168,7 +168,7 @@ export default function getComponentConfig (type) {
       return {
         name: '播放器',
         title: '播放器',
-        icon: Icon.getNameList()[12],
+        icon: iconNames[12],
         className:
           'com.gccloud.dataroom.core.module.chart.components.ScreenVideoChart',
         w: 600,
@@ -182,7 +182,7 @@ export default function getComponentConfig (type) {
       return {
         name: '输入框',
         title: '输入框',
-        icon: Icon.getNameList()[13],
+        icon: iconNames[13],
         className: 'com.gccloud.dataroom.core.module.chart.components.ScreenInputChart',
         w: 180,
         h: 40,
@@ -194,7 +194,7 @@ export default function getComponentConfig (type) {
       return {
         name: '按钮',
         title: '按钮',
-        icon: Icon.getNameList()[14],
+        icon: iconNames[14],
         className: 'com.gccloud.dataroom.core.module.chart.components.ScreenButtonChart',
         w: 80,
         h: 40,

data-room-ui/vue.config.example.js

@@ -174,7 +174,7 @@ module.exports = {
       .rule('svg')
       .exclude.add(resolve('packages/assets/images/dataSourceIcon/svg'))
       .add(resolve('packages/assets/images/pageIcon/svg'))
-      .add(resolve('packages/assets/images/bigScreenIcon/svg'))
+      // .add(resolve('packages/assets/images/bigScreenIcon/svg'))
       .add(resolve('packages/Svgs/svg'))
       .add(resolve('packages/assets/images/alignIcon/svg'))
       .end()
@@ -184,7 +184,7 @@ module.exports = {
       .test(/\.svg$/)
       .include.add(resolve('packages/assets/images/dataSourceIcon/svg'))
       .add(resolve('packages/assets/images/pageIcon/svg'))
-      .add(resolve('packages/assets/images/bigScreenIcon/svg'))
+      // .add(resolve('packages/assets/images/bigScreenIcon/svg'))
       .add(resolve('packages/Svgs/svg'))
       .add(resolve('packages/assets/images/alignIcon/svg'))
       .end()