feat: 优化跑马灯组件，更换选择图标资源，添加语音暂停操作，修复删除组件后，语音未关闭的情况，修复组件配置定时器后，离开当前页面，语音仍在播放的问题

data-room-ui/package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@gcpaas/data-room-ui",
-  "version": "1.0.1-2023082902-Alpha",
+  "version": "1.0.1-2023083002-Alpha",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -3397,6 +3397,27 @@
         "whatwg-fetch": "^3.6.2"
       },
       "dependencies": {
+        "@vue/vue-loader-v15": {
+          "version": "npm:vue-loader@15.10.2",
+          "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-15.10.2.tgz",
+          "integrity": "sha512-ndeSe/8KQc/nlA7TJ+OBhv2qalmj1s+uBs7yHDRFaAXscFTApBzY9F1jES3bautmgWjDlDct0fw8rPuySDLwxw==",
+          "dev": true,
+          "requires": {
+            "@vue/component-compiler-utils": "^3.1.0",
+            "hash-sum": "^1.0.2",
+            "loader-utils": "^1.1.0",
+            "vue-hot-reload-api": "^2.3.0",
+            "vue-style-loader": "^4.1.0"
+          },
+          "dependencies": {
+            "hash-sum": {
+              "version": "1.0.2",
+              "resolved": "https://registry.npmjs.org/hash-sum/-/hash-sum-1.0.2.tgz",
+              "integrity": "sha512-fUs4B4L+mlt8/XAtSOGMUO1TXmAelItBPtJG7CyHJfYTdDjwisntGO2JQz7oUsatOY9o68+57eziUVNw/mRHmA==",
+              "dev": true
+            }
+          }
+        },
         "acorn-walk": {
           "version": "8.2.0",
           "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.2.0.tgz",
@@ -3468,6 +3489,26 @@
             "tapable": "^2.0.0"
           }
         },
+        "json5": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.2.tgz",
+          "integrity": "sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==",
+          "dev": true,
+          "requires": {
+            "minimist": "^1.2.0"
+          }
+        },
+        "loader-utils": {
+          "version": "1.4.2",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.4.2.tgz",
+          "integrity": "sha512-I5d00Pd/jwMD2QCduo657+YM/6L3KZu++pmX9VFncxaxvHcru9jx1lBaFft+r4Mt2jK0Yhp41XlRAihzPxHNCg==",
+          "dev": true,
+          "requires": {
+            "big.js": "^5.2.2",
+            "emojis-list": "^3.0.0",
+            "json5": "^1.0.1"
+          }
+        },
         "ms": {
           "version": "2.1.2",
           "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
@@ -3685,47 +3726,6 @@
         "lodash": "^4.17.4"
       }
     },
-    "@vue/vue-loader-v15": {
-      "version": "npm:vue-loader@15.10.2",
-      "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-15.10.2.tgz",
-      "integrity": "sha512-ndeSe/8KQc/nlA7TJ+OBhv2qalmj1s+uBs7yHDRFaAXscFTApBzY9F1jES3bautmgWjDlDct0fw8rPuySDLwxw==",
-      "dev": true,
-      "requires": {
-        "@vue/component-compiler-utils": "^3.1.0",
-        "hash-sum": "^1.0.2",
-        "loader-utils": "^1.1.0",
-        "vue-hot-reload-api": "^2.3.0",
-        "vue-style-loader": "^4.1.0"
-      },
-      "dependencies": {
-        "hash-sum": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/hash-sum/-/hash-sum-1.0.2.tgz",
-          "integrity": "sha512-fUs4B4L+mlt8/XAtSOGMUO1TXmAelItBPtJG7CyHJfYTdDjwisntGO2JQz7oUsatOY9o68+57eziUVNw/mRHmA==",
-          "dev": true
-        },
-        "json5": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.2.tgz",
-          "integrity": "sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==",
-          "dev": true,
-          "requires": {
-            "minimist": "^1.2.0"
-          }
-        },
-        "loader-utils": {
-          "version": "1.4.2",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.4.2.tgz",
-          "integrity": "sha512-I5d00Pd/jwMD2QCduo657+YM/6L3KZu++pmX9VFncxaxvHcru9jx1lBaFft+r4Mt2jK0Yhp41XlRAihzPxHNCg==",
-          "dev": true,
-          "requires": {
-            "big.js": "^5.2.2",
-            "emojis-list": "^3.0.0",
-            "json5": "^1.0.1"
-          }
-        }
-      }
-    },
     "@vue/vue2-jest": {
       "version": "27.0.0",
       "resolved": "https://registry.npmjs.org/@vue/vue2-jest/-/vue2-jest-27.0.0.tgz",
@@ -19988,6 +19988,11 @@
         }
       }
     },
+    "vue-player-audio": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/vue-player-audio/-/vue-player-audio-1.0.2.tgz",
+      "integrity": "sha512-1HH5+C7t5pKBoH5mrSQxLIxm/TLjD+GAuaJHzfGE2NehalMUFB5dLHM3k6l9xlJQQLWpgdFsMQP4sNqHy6Fl4g=="
+    },
     "vue-router": {
       "version": "3.0.6",
       "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.0.6.tgz",

data-room-ui/package.json

@@ -77,6 +77,7 @@
     "vue-draggable-resizable-gorkys": "^2.4.8",
     "vue-json-editor": "^1.4.3",
     "vue-json-viewer": "^2.2.22",
+    "vue-player-audio": "^1.0.2",
     "vue-router": "3.0.6",
     "vue-sketch-ruler": "^1.0.3",
     "vue-video-player": "^5.0.1",

data-room-ui/packages/BasicComponents/Marquee/index.vue

@@ -1,24 +1,34 @@
 <template>
+  <!-- 添加一个类似鼠标hover事件 -->
   <div class="marquee-box">
     <div class="scroll-area">
+      <audio
+        :ref="`audioPlayer${config.code}`"
+        muted
+        autoplay
+        crossorigin="anonymous"
+      />
       <!-- 设置margin，使内容 有从无到有的出现效果 -->
-      <div class="marquee-container">
+      <div
+        class="marquee-container"
+        @mouseenter.stop="mouseenter"
+        @mouseleave.stop="mouseleave"
+      >
         <div class="icon">
-          <i
-            v-if="config.customize.icon.position === 'left'"
-            :class="config.customize.icon.name"
-            :style="{ color: config.customize.icon.color, fontSize: config.customize.fontSize + 'px' }"
+          <icon-svg
+            v-if="config.customize.icon.name && config.customize.icon.position === 'left'"
+            :name="config.customize.icon.name"
+            :style="{ color: config.customize.icon.color, width: config.customize.fontSize + 'px',height: config.customize.fontSize + 'px' }"
           />
         </div>
-
         <svg class="svg-container">
           <defs>
             <linearGradient
-              :id="'backgroundGradient-'+config.code"
+              :id="'backgroundGradient-' + config.code"
               :x1="0"
               :y1="['to top right'].includes(config.customize.bgGradientDirection) ? '100%' : '0'"
-              :x2="['to right','to bottom right','to top right'].includes(config.customize.bgGradientDirection) ? '100%' : '0'"
-              :y2="['to bottom','to bottom right'].includes(config.customize.bgGradientDirection) ? '100%' : '0'"
+              :x2="['to right', 'to bottom right', 'to top right'].includes(config.customize.bgGradientDirection) ? '100%' : '0'"
+              :y2="['to bottom', 'to bottom right'].includes(config.customize.bgGradientDirection) ? '100%' : '0'"
             >
               <stop
                 offset="0%"
@@ -30,11 +40,11 @@
               />
             </linearGradient>
             <linearGradient
-              :id="'textGradient-'+config.code"
+              :id="'textGradient-' + config.code"
               :x1="0"
               :y1="['to top right'].includes(config.customize.textGradientDirection) ? '100%' : '0'"
-              :x2="['to right','to bottom right','to top right'].includes(config.customize.textGradientDirection) ? '100%' : '0'"
-              :y2="['to bottom','to bottom right'].includes(config.customize.textGradientDirection) ? '100%' : '0'"
+              :x2="['to right', 'to bottom right', 'to top right'].includes(config.customize.textGradientDirection) ? '100%' : '0'"
+              :y2="['to bottom', 'to bottom right'].includes(config.customize.textGradientDirection) ? '100%' : '0'"
             >
               <stop
                 offset="0%"
@@ -71,14 +81,25 @@
           </text>
         </svg>
         <div class="icon">
-          <i
-            v-if="config.customize.icon.position === 'right'"
-            :class="config.customize.icon.name"
-            :style="{ color: config.customize.icon.color, fontSize: config.customize.fontSize + 'px' }"
+          <icon-svg
+            v-if="config.customize.icon.name && config.customize.icon.position === 'right'"
+            :name="config.customize.icon.name"
+            :style="{ color: config.customize.icon.color, width: config.customize.fontSize + 'px',height: config.customize.fontSize + 'px' }"
           />
         </div>
       </div>
     </div>
+    <div
+      v-show="config.customize.voiceBroadcast && showVoiceSwitch"
+      class="voice-switch"
+      :style="{fontSize:config.customize.fontSize + 'px',right:config.customize.fontSize + 5 + 'px',}"
+      @mouseenter.stop="mouseenter"
+    >
+      <i
+        :class="voiceSwitchValue ? 'el-icon-microphone' : 'el-icon-turn-off-microphone'"
+        @click="voiceSwitch"
+      />
+    </div>
   </div>
 </template>
 
@@ -87,9 +108,12 @@ import Speech from 'speak-tts'
 import { EventBus } from 'data-room-ui/js/utils/eventBus'
 import commonMixins from 'data-room-ui/js/mixins/commonMixins'
 import paramsMixins from 'data-room-ui/js/mixins/paramsMixins'
+import linkageMixins from 'data-room-ui/js/mixins/linkageMixins'
 import { settingToTheme } from 'data-room-ui/js/utils/themeFormatting'
 import cloneDeep from 'lodash/cloneDeep'
+import IconSvg from 'data-room-ui/SvgIcon'
 export default {
+  name: 'Marquee',
   props: {
     // 卡片的属性
     config: {
@@ -97,8 +121,13 @@ export default {
       default: () => ({})
     }
   },
+  components: {
+    IconSvg
+  },
   data () {
     return {
+      showVoiceSwitch: false,
+      voiceSwitchValue: true,
       customClass: {},
       attributeName: {
         right: 'x',
@@ -125,16 +154,52 @@ export default {
       innerData: null,
       // 音频播放
       audio: null,
+      // 音频地址
+      isPlayAudio: null,
       // 语音播报
       speech: null,
-      // 语音播报定时器
-      speechTimer: null
+      isInit: false,
+      numberBroadcasts: 0
     }
   },
   computed: {
-
+    // speechText
+    speechText () {
+      return this.config.customize.title || ''
+    },
+    isPreview () {
+      return (this.$route.path === window?.BS_CONFIG?.routers?.previewUrl) || (this.$route.path === '/big-screen/preview')
+    },
+    audioSrc () {
+      return this.config?.option?.data?.[this.config?.dataSource?.metricField] || ''
+    }
   },
-  mixins: [paramsMixins, commonMixins],
+  watch: {
+    speechText (val) {
+      if (!this.isPreview && this.config.customize.voiceBroadcast && !this.isInit) {
+        this.speechBroadcast(val)
+      } else {
+        if (this.speech) {
+          this.speech = null
+        }
+      }
+    },
+    deep: true,
+    audioSrc (val) {
+      if (this.config.customize.voiceBroadcast) {
+        if (this.audio) {
+          this.audio.src = val
+          this.audio.play()
+        }
+      } else {
+        if (this.aduio) {
+          this.aduio.pause()
+          this.aduio = null
+        }
+      }
+    }
+  },
+  mixins: [paramsMixins, commonMixins, linkageMixins],
   mounted () {
     this.chartInit()
     // 如果点击了生成图片，则先关闭动画
@@ -145,15 +210,43 @@ export default {
     EventBus.$on('startMarquee', () => {
       this.isAnimate = true
     })
+    //  如果删除了组件
+    EventBus.$on('deleteComponent', (codes) => {
+      if (codes.includes(this.config.code)) {
+        if (this.audio) {
+          this.audio.pause()
+          this.audio = null
+        }
+        if (this.speech) {
+          this.speech = null
+        }
+      }
+    })
+    this.speech = null
+    this.isInit = true
+    // 如果是预览模式的话，则弹出对话框，当前大屏存在语音播报，是否开启语音播报
+    if (this.isPreview && this.config.customize.voiceBroadcast) {
+      this.$confirm('当前大屏存在语音播报，是否开启语音播报？若开启请点击确认或者回车', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+        customClass: 'bs-el-message-box'
+      }).then(() => {
+        if (this.audioSrc) {
+          this.audio.play()
+        } else {
+          this.speech = null
+          this.speechBroadcast(this.config.customize.title)
+          this.isInit = false
+        }
+      }).catch(() => { })
+    }
     document.addEventListener('visibilitychange', this.handleVisibilityChange)
   },
   beforeDestroy () {
     EventBus.$off('stopMarquee')
     EventBus.$off('startMarquee')
-    // 销毁语音播报定时器
-    if (this.speechTimer) {
-      clearInterval(this.speechTimer)
-    }
+    EventBus.$off('deleteComponent')
   },
   methods: {
     dataFormatting (config, data) {
@@ -166,7 +259,7 @@ export default {
             // 此处函数处理data
             eval(config.dataHandler)
           } catch (e) {
-            console.error(e)
+            console.info(e)
           }
         }
         config.option.data = data
@@ -177,55 +270,53 @@ export default {
         // 数据返回失败则赋前端的模拟数据
         config.option.data = []
       }
+      // 清除上一个visibilitychange监听，重新开始监听
+      if (this.voiceSwitchValue) {
+        this.voiceBroadcast(config)
+      }
       return config
     },
     // 语音播报
     voiceBroadcast (config) {
-      if (this.innerData) {
+      const innerData = this.innerData || config
+      if (innerData) {
         if (config.customize.voiceBroadcast) {
-          if (this.innerData.dataSource.businessKey && this.innerData.option.data[this.innerData.dataSource.metricField]) {
-            // 如果audio存在，先销毁这个实例，或者替换它的URL
-            if (this.audio) {
-              this.audio.pause()
-              this.audio = null
+          if (innerData?.dataSource?.businessKey && innerData?.option?.data[this.innerData.dataSource.metricField]) {
+            // 如果aduio存在，先销毁这个实例，或者替换它的URL
+            if (this.aduio) {
+              this.aduio.pause()
+              this.aduio = null
             }
-            this.audio = new Audio()
-            this.audio.src = this.innerData.option.data[this.innerData.dataSource.metricField]
+            // 获取音频元素
+            this.audio = this.$refs[`audioPlayer${config.code}`]
+            this.audio.src = innerData.option.data[this.innerData.dataSource.metricField]
             this.audio.play()
           } else if (config.customize.title) {
-            this.speechBroadcast(config.customize.title)
-            // 根据配置的时间，定时播报，第一次播报后，再定时播报
-            this.speechBroadcast(config.customize.title)
-            if (config.customize.dur) {
-              this.speechTimer = setInterval(() => {
-                this.speechBroadcast(config.customize.title)
-              }, config.customize.dur * 1000)
+            //  页面初始化不执行
+            if (!this.isInit) {
+              this.speechBroadcast(config.customize.title)
             }
           }
         } else {
-          if (this.audio) {
-            this.audio.pause()
-            this.audio = null
-          }
-        }
-      } else {
-        if (config.customize.voiceBroadcast) {
-          this.speech = new Speech()
-          if (config.customize.dur) {
-            this.speechBroadcast(config.customize.title)
-            this.speechTimer = setInterval(() => {
-              this.speechBroadcast(config.customize.title)
-            }, config.customize.dur * 1000)
+          if (this.aduio) {
+            this.aduio.pause()
+            this.aduio = null
           }
         }
       }
     },
     // 语音播报
     speechBroadcast (text) {
+      this.numberBroadcasts = 0
+      this.speech = new Speech()
+      this.speech.setLanguage('zh-CN')
+      this.speech.pitch = 1
+      this.speech.init()
       if (this.speech.hasBrowserSupport()) {
-        this.speech.setLanguage('zh-CN')
-        this.speech.init()
-        this.speech.speak({ text: text })
+        if (this.numberBroadcasts < 1) {
+          this.speech.speak({ text: text })
+          this.numberBroadcasts += 1
+        }
       } else {
         this.$message({
           message: '您的浏览器不支持语音播报',
@@ -235,7 +326,10 @@ export default {
     },
     changeStyle (config) {
       config = { ...this.config, ...config }
-      this.voiceBroadcast(config)
+      if (config.customize.voiceBroadcast && this.isInit && !this.audioSrc) {
+        this.isInit = false
+        this.speechBroadcast(config.customize.title)
+      }
       // 样式改变时更新主题配置
       config.theme = settingToTheme(cloneDeep(config), this.customTheme)
       this.changeChartConfig(config)
@@ -250,7 +344,7 @@ export default {
           this.audio.pause()
         }
         if (this.speech) {
-          this.speech.pause()
+          this.speech = null
         }
       } else {
         if (this.audio) {
@@ -260,6 +354,38 @@ export default {
           this.speech.resume()
         }
       }
+    },
+    voiceSwitch () {
+      this.voiceSwitchValue = !this.voiceSwitchValue
+      if (this.voiceSwitchValue) {
+        if (this.audio) {
+          try {
+            this.audio.play()
+          } catch (e) {
+            console.info(e)
+          }
+        }
+        if (this.speech) {
+          this.speech.resume()
+        }
+      } else {
+        if (this.audio) {
+          try {
+            this.audio.pause()
+          } catch (e) {
+            console.info(e)
+          }
+        }
+        if (this.speech) {
+          this.speech.pause()
+        }
+      }
+    },
+    mouseenter () {
+      this.showVoiceSwitch = true
+    },
+    mouseleave () {
+      this.showVoiceSwitch = false
     }
   }
 }
@@ -269,8 +395,10 @@ export default {
 .marquee-box {
   width: 100%;
   height: 100%;
+  user-select: none;
   white-space: nowrap;
   overflow: hidden;
+  position: relative;
 
   .scroll-area {
     width: 100%;
@@ -287,10 +415,18 @@ export default {
       }
     }
   }
+
   .icon {
     position: relative;
     top: 0;
     // 清除浮动
   }
 }
+.voice-switch{
+  position: absolute;
+  cursor: pointer;
+  bottom: 5px;
+  color: #fff;
+}
+
 </style>

data-room-ui/packages/BasicComponents/Marquee/setting.vue

@@ -66,6 +66,8 @@
             v-model="config.customize.direction"
             class="bs-el-select"
             popper-class="bs-el-select"
+            filterable
+            clearable
           >
             <el-option
               v-for="direction in directionList"
@@ -97,7 +99,24 @@
           label="图标选择"
           label-width="100px"
         >
-          <IconPicker v-model="config.customize.icon.name" />
+          <!-- <IconPicker v-model="config.customize.icon.name" /> -->
+          <el-select
+            v-model="config.customize.icon.name"
+            class="bs-el-select"
+            popper-class="bs-el-select"
+            filterable
+            clearable
+          >
+            <el-option
+              v-for="(icbroadcaston,index) in broadcastList"
+              :key="index"
+              :label="icbroadcaston.label"
+              :value="icbroadcaston.value"
+            >
+              <icon-svg :name="icbroadcaston.value" />
+              <span style="float: right; color: #8492a6; font-size: 13px">{{ icbroadcaston.label }}</span>
+            </el-option>
+          </el-select>
         </el-form-item>
         <!-- 图标位置 -->
         <el-form-item
@@ -109,6 +128,8 @@
             v-model="config.customize.icon.position"
             class="bs-el-select"
             popper-class="bs-el-select"
+            filterable
+            clearable
           >
             <el-option
               v-for="iconPosition in iconPositionOptions"
@@ -135,6 +156,8 @@
             v-model="config.customize.textColorType"
             popper-class="bs-el-select"
             class="bs-el-select"
+            filterable
+            clearable
           >
             <el-option
               label="纯色"
@@ -164,6 +187,8 @@
             v-model="config.customize.textGradientDirection"
             popper-class="bs-el-select"
             class="bs-el-select"
+            filterable
+            clearable
           >
             <el-option
               v-for="direction in gradientDirection"
@@ -198,6 +223,8 @@
             v-model="config.customize.backgroundColorType"
             popper-class="bs-el-select"
             class="bs-el-select"
+            filterable
+            clearable
           >
             <el-option
               label="透明"
@@ -231,6 +258,8 @@
             v-model="config.customize.bgGradientDirection"
             popper-class="bs-el-select"
             class="bs-el-select"
+            filterable
+            clearable
           >
             <el-option
               v-for="direction in gradientDirection"
@@ -282,15 +311,15 @@
 <script>
 import SettingTitle from 'data-room-ui/SettingTitle/index.vue'
 import ColorPicker from 'data-room-ui/ColorPicker/index.vue'
-import IconPicker from 'data-room-ui/IconPicker/index.vue'
 import PosWhSetting from 'data-room-ui/BigScreenDesign/RightSetting/PosWhSetting.vue'
+import IconSvg from 'data-room-ui/SvgIcon'
 export default {
   name: 'TextSetting',
   components: {
     PosWhSetting,
     ColorPicker,
     SettingTitle,
-    IconPicker
+    IconSvg
   },
   data () {
     return {
@@ -352,6 +381,52 @@ export default {
           value: 'right'
         }
       ],
+      broadcastList: [
+        {
+          label: '广播1',
+          value: 'broadcast-1'
+        },
+        {
+          label: '广播2',
+          value: 'broadcast-2'
+        },
+        {
+          label: '广播3',
+          value: 'broadcast-3'
+        },
+        {
+          label: '广播4',
+          value: 'broadcast-4'
+        },
+        {
+          label: '广播5',
+          value: 'broadcast-5'
+        },
+        {
+          label: '广播6',
+          value: 'broadcast-6'
+        },
+        {
+          label: '广播7',
+          value: 'broadcast-7'
+        },
+        {
+          label: '广播8',
+          value: 'broadcast-8'
+        },
+        {
+          label: '广播9',
+          value: 'broadcast-9'
+        },
+        {
+          label: '广播10',
+          value: 'broadcast-10'
+        },
+        {
+          label: '广播11',
+          value: 'broadcast-11'
+        }
+      ],
       rules: {
         title: [
           { required: true, message: '请输入标题', trigger: 'blur' }
@@ -383,7 +458,7 @@ export default {
 @import '../../assets/style/bsTheme.scss';
 
 .bs-setting-wrap {
-  padding:12px 16px;
+  padding: 12px 16px;
 }
 
 .lc-field-body {

data-room-ui/packages/BigScreenDesign/OverallSetting/index.vue

@@ -473,7 +473,7 @@ export default {
       this.$emit('close')
     },
     timerEmptyState () {
-      return this.pageInfo.chartList.every(chart => chart.dataSource?.businessKey === '')
+      return this.pageInfo.chartList.every(chart => chart.dataSource?.businessKey === '' && chart.type !== 'marquee')
     }
   }
 }

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

@@ -238,7 +238,6 @@ export default {
     }),
     changeZoom (val) {
       this.$emit('changeZoom', val)
-      // console.log(val)
     },
     setAlign (command) {
       const pageInfo = cloneDeep(this.pageInfo)

data-room-ui/packages/Layout/BigScreenHomeLayout/index.vue

@@ -16,12 +16,13 @@
         />
       </div>
       <a
+        v-if="giteeSvg && giteeHref"
         class="fork-me-on-gitee"
-        href="https://gitee.com/gcpaas/DataRoom"
+        :href="giteeHref"
         target="_blank"
       >
         <img
-          src="https://gitee.com/gcpaas/DataRoom/widgets/widget_1.svg?color=007bff"
+          :src="giteeSvg"
           alt="Fork me on Gitee"
         >
       </a>
@@ -45,6 +46,8 @@ export default {
   data () {
     return {
       // 和此处路由保持一致，将会激活tab，请按需更改
+      giteeHref: '',
+      giteeSvg: ''
     }
   },
   computed: {
@@ -115,6 +118,10 @@ export default {
     }
   },
   created () {},
+  mounted () {
+    this.giteeHref = 'https://gitee.com/gcpaas/DataRoom'
+    this.giteeSvg = 'https://gitee.com/gcpaas/DataRoom/widgets/widget_1.svg?color=007bff'
+  },
   methods: {
     changeTab (tab) {
       if (this.$route.query.edit) {

data-room-ui/packages/SvgIcon/index.vue

@@ -1,9 +1,12 @@
 <template>
+  <!-- 添加fill -->
   <svg
     :class="getClassName"
     aria-hidden="true"
   >
-    <use :xlink:href="getName" />
+    <use
+      :xlink:href="getName"
+    />
   </svg>
 </template>
 

data-room-ui/packages/assets/images/alignIcon/svg/broadcast-1.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M277.389658 691.52577V314.145793l-2.14485-5.89629 390.424061-142.768611v686.146249l-367.909278-134.549416-26.266224-9.469675z" fill="#F7D11E" /><path d="M271.493367 707.60805l26.266224 9.470699-3.216251 8.755407-17.153682 154.383137h-80.94352L173.574221 674.372088l2.680039-5.360078c6.432503 3.573385 13.222139 6.611581 20.190854 9.29162v1.786693l75.048253 27.517727z" fill="#FF713C" /><path d="M196.446138 338.625324v339.678306c-6.968715-2.680039-13.758352-5.718235-20.190855-9.29162-55.391565-29.482475-93.094258-90.414219-93.094258-160.458505-0.001023-78.441537 47.350424-145.269571 113.285113-169.928181z" fill="#F7D11E" /><path d="M665.660682 869.49816c-2.058892 0-4.152577-0.358157-6.141884-1.090844l-469.237057-171.537842a17.875113 17.875113 0 0 1-11.70867-16.778128V338.629417c0-7.502881 4.693906-15.826454 11.743462-18.401092l469.202265-171.529655c5.531993-2.0241 11.586896-1.204431 16.385179 2.128477a17.880229 17.880229 0 0 1 7.625678 14.648628v231.58238c0 9.867742-7.992021 17.86795-17.86795 17.867949s-17.86795-8.000208-17.867949-17.867949V191.040011l-433.482739 158.477384v318.096779l433.482739 158.450778V620.056018c0-9.867742 7.992021-17.86795 17.867949-17.86795s17.86795 8.000208 17.86795 17.86795V851.629187a17.877159 17.877159 0 0 1-7.625678 14.648629 17.956977 17.956977 0 0 1-10.243295 3.220344z" fill="#885F44" /><path d="M665.660682 637.923968c-3.28072 0-6.561439-0.907673-9.44-2.696412a17.893532 17.893532 0 0 1-8.427949-15.172561V397.059178a17.895579 17.895579 0 0 1 8.427949-15.172561c5.235235-3.254114 11.795651-3.568269 17.327644-0.863671l113.300463 55.742559a17.887392 17.887392 0 0 1 9.981328 16.036231v111.502514c0 6.804986-3.874237 13.025665-9.981328 16.036231l-113.300463 55.751768a17.949814 17.949814 0 0 1-7.887644 1.831719z m17.868973-212.160028V591.351256l77.56354-38.171368v-89.254813l-77.56354-38.161135zM196.441021 696.179766c-2.128477 0-4.310166-0.39295-6.421246-1.204431-8.358365-3.211135-15.70468-6.596232-22.440082-10.347673-62.992683-33.520441-102.289688-101.050464-102.289688-176.075181 0-83.705424 50.184983-158.720931 124.886335-186.658213 9.248641-3.498684 19.543102 1.230014 22.998807 10.478655 3.454682 9.239432-1.239224 19.534915-10.469445 22.989597-60.812017 22.74605-101.678774 84.308151-101.678774 153.189961 0 61.789275 32.03767 117.225865 83.618442 144.683217 5.54939 3.080152 11.411911 5.77554 18.216897 8.393158 9.213849 3.542686 13.802354 13.881149 10.260692 23.085787-2.739391 7.102768-9.509585 11.465123-16.681938 11.465123z" fill="#885F44" /><path d="M277.389658 898.080126h-80.948637c-9.108448 0-16.751522-6.848988-17.763572-15.896039l-22.858614-205.834972c-1.081635-9.806343 5.985318-18.644639 15.791661-19.727297 9.963932-1.168616 18.653849 5.993504 19.735483 15.783475L212.44246 862.343203h48.945759l15.390525-138.479934c1.081635-9.806343 10.172687-16.891715 19.735483-15.783475 9.806343 1.081635 16.873296 9.91993 15.791662 19.726273l-17.152659 154.376997c-1.011027 9.048073-8.654101 15.897062-17.763572 15.897062z" fill="#885F44" /><path d="M277.389658 709.397812c-9.876951 0-17.86795-8.000208-17.86795-17.867949V314.14784c0-9.867742 7.992021-17.86795 17.86795-17.86795s17.86795 8.000208 17.867949 17.86795v377.382023c0.001023 9.867742-7.990998 17.86795-17.867949 17.867949zM827.575352 383.474788c-6.40385 0-12.598946-3.446495-15.809058-9.492188-4.624321-8.724709-1.291412-19.534915 7.4159-24.159236l97.019661-51.458999c8.707312-4.641717 19.543102-1.316995 24.167423 7.407714 4.624321 8.724709 1.291412 19.534915-7.4159 24.159236l-97.019661 51.458998a17.822924 17.822924 0 0 1-8.358365 2.084475zM924.56022 692.245154c-2.826372 0-5.688559-0.671289-8.358365-2.085498l-97.019661-51.467185c-8.707312-4.624321-12.040221-15.442714-7.4159-24.159237 4.624321-8.716522 15.442714-12.022825 24.167423-7.407713l97.019661 51.467185c8.707312 4.624321 12.040221 15.442714 7.4159 24.159236-3.210112 6.046716-9.405207 9.493212-15.809058 9.493212zM940.841022 503.553631H827.557956c-9.876951 0-17.86795-8.000208-17.86795-17.86795 0-9.867742 7.992021-17.86795 17.86795-17.867949h113.283066c9.875928 0 17.86795 8.000208 17.867949 17.867949 0 9.867742-7.992021 17.86795-17.867949 17.86795z" fill="#885F44" /></svg>

data-room-ui/packages/assets/images/alignIcon/svg/broadcast-10.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="" d="M957.70125 411c-6.7-100.7-28-199.3-63.7-294.3a31.81 31.81 0 0 0-23.1-20c-10.6-2.3-21.6 0.9-29.3 8.5-58.8 58-125.6 104.3-198.8 137.7-41.9 19.1-89.6 35-137.8 45.9-8.3 1.9-16.6 3.6-24.9 5.2v-0.1c0-12.1-9.8-21.9-21.9-21.9H209.90125C95.10125 272-0.39875 365.9 0.00125 480.7c0.2 56.9 23.5 108.7 61.1 146.2 22.5 22.5 50.1 39.9 80.8 50.3 16.3 5.5 27.5 20.5 28.3 37.8 0.7 16.6 3.2 33.1 7.4 49.2 14.1 54.2 44.2 92.2 70.7 116.7 14.3 13.2 37.1 10.6 48.1-5.5l18.3-26.8c8.7-12.8 7.2-30.1-3.9-40.9-15-14.6-32.2-37-40.2-67.7 0-0.2-0.1-0.4-0.2-0.6-6.7-26 13.2-51.3 40.1-51.3h147.7c12.1 0 21.9-9.8 21.9-21.9 8.4 1.6 16.7 3.3 25 5.1 47.8 10.7 95.4 26.6 137.7 45.9 73.1 33.4 140 79.7 198.8 137.7 6 6 14.1 9.2 22.5 9.2 2.3 0 4.6-0.2 6.9-0.8 10.6-2.3 19.3-9.8 23.1-20 35.7-94.9 57.1-193.6 63.8-294.2 19.8-8.8 34.3-36.4 34.3-69s-14.7-60.3-34.5-69.1zM849.90125 775.3c-54.9-47.7-115.4-86.7-180.6-116.4C623.00125 637.8 571.00125 620.4 519.00125 608.8c-12.9-2.9-26-5.5-39-7.7V359c13.1-2.3 26.1-4.9 39.1-7.8 52.4-11.8 104.4-29.2 150.2-50.1 65.2-29.7 125.7-68.8 180.6-116.4C880.50125 280.2 896.00125 379.3 896.00125 480s-15.5 199.8-46.1 295.3z" /></svg>

data-room-ui/packages/assets/images/alignIcon/svg/broadcast-11.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="" d="M916.736 760.928L864 716.032V480c0-161.44-108.672-297.504-256.864-339.008a96 96 0 1 0-190.272 0C268.672 182.496 160 318.56 160 480v237.856l-52.224 42.656a31.968 31.968 0 0 0-11.776 24.8v63.584a32 32 0 0 0 32 32h188.096c2.56 4.48 5.088 8.96 7.968 13.248a223.776 223.776 0 0 0 186.464 99.808 223.872 223.872 0 0 0 190.72-106.464c1.312-2.144 2.336-4.416 3.584-6.592H896a32 32 0 0 0 32-32v-63.584a32 32 0 0 0-11.264-24.384zM510.496 929.92a159.424 159.424 0 0 1-114.912-49.056h229.824a159.264 159.264 0 0 1-114.912 49.056zM864 816.864H160v-16.384l64-52.256V480a288.128 288.128 0 0 1 210.144-277.376l53.632-15.008-7.488-55.2a32 32 0 1 1 63.424 0l-7.488 55.2 53.632 15.008A288.128 288.128 0 0 1 800 480v265.6l64 54.496v16.768z" /></svg>

data-room-ui/packages/assets/images/alignIcon/svg/broadcast-3.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M627.2 775.68c1.28 16.64-8.96 30.72-23.04 32l-222.72-32c-15.36 1.28-28.16-10.24-30.72-25.6l23.04-149.76c-1.28-15.36 8.96-30.72 23.04-32L545.28 550.4c15.36-1.28 28.16 10.24 30.72 25.6l51.2 199.68z" fill="#FAC546" /><path d="M604.16 820.48h-1.28l-221.44-32c-21.76 1.28-39.68-15.36-42.24-37.12v-3.84l23.04-148.48c-1.28-10.24 2.56-21.76 8.96-29.44 6.4-7.68 15.36-14.08 25.6-15.36L544 537.6c21.76-2.56 40.96 14.08 44.8 35.84l51.2 198.4v1.28c2.56 23.04-12.8 43.52-34.56 46.08l-1.28 1.28z m-224-57.6h1.28l221.44 32c6.4-1.28 11.52-8.96 11.52-16.64l-51.2-198.4v-1.28c-1.28-8.96-8.96-15.36-16.64-14.08l-148.48 17.92c-3.84 0-6.4 2.56-8.96 5.12-2.56 3.84-3.84 7.68-3.84 12.8v3.84l-23.04 147.2c1.28 7.68 8.96 14.08 16.64 12.8 0-1.28 1.28-1.28 1.28-1.28z" fill="#231C1C" /><path d="M823.04 195.84L769.28 217.6l58.88 518.4 56.32 7.68c15.36-1.28 28.16-10.24 26.88-25.6l-58.88-496.64c0-16.64-14.08-28.16-29.44-25.6z" fill="#6FB0BE" /><path d="M885.76 755.2h-1.28l-56.32-7.68c-6.4-1.28-10.24-5.12-11.52-11.52L757.76 217.6c-1.28-5.12 2.56-11.52 7.68-12.8l53.76-21.76c1.28 0 2.56-1.28 3.84-1.28 10.24-1.28 21.76 1.28 29.44 8.96 8.96 6.4 14.08 16.64 15.36 26.88l58.88 496.64c1.28 8.96-1.28 16.64-6.4 24.32-6.4 8.96-17.92 14.08-32 15.36-1.28 1.28-1.28 1.28-2.56 1.28z m-44.8-32l44.8 5.12c6.4-1.28 10.24-2.56 12.8-6.4 1.28-1.28 1.28-2.56 1.28-5.12l-58.88-496.64c0-3.84-2.56-7.68-5.12-10.24-2.56-2.56-6.4-3.84-8.96-3.84l-42.24 16.64 56.32 500.48z" fill="#231C1C" /><path d="M170.24 455.68c-10.24 3.84-25.6 15.36-24.32 30.72l16.64 138.24c1.28 15.36 11.52 30.72 26.88 29.44l56.32 7.68L224 435.2l-53.76 20.48z" fill="#6FB0BE" /><path d="M245.76 673.28h-1.28l-55.04-6.4c-21.76 1.28-37.12-19.2-39.68-39.68l-16.64-138.24c-2.56-23.04 17.92-39.68 32-44.8L217.6 422.4c3.84-1.28 7.68-1.28 11.52 1.28 3.84 2.56 5.12 5.12 6.4 10.24l23.04 226.56c0 3.84-1.28 7.68-3.84 10.24-2.56 1.28-5.12 2.56-8.96 2.56z m-56.32-32h1.28l40.96 5.12-19.2-193.28-37.12 15.36c-6.4 2.56-16.64 10.24-15.36 17.92l16.64 138.24c1.28 7.68 5.12 19.2 12.8 17.92-1.28-1.28 0-1.28 0-1.28z" fill="#231C1C" /><path d="M224 433.92l21.76 226.56 583.68 74.24-58.88-518.4z" fill="#E1E0A6" /><path d="M829.44 747.52h-1.28l-583.68-74.24c-6.4-1.28-10.24-5.12-11.52-11.52L211.2 435.2c0-5.12 2.56-11.52 7.68-12.8l546.56-217.6c3.84-1.28 7.68-1.28 11.52 1.28 3.84 2.56 5.12 5.12 6.4 8.96l58.88 518.4c0 3.84-1.28 7.68-3.84 10.24-2.56 2.56-5.12 3.84-8.96 3.84z m-570.88-98.56l556.8 70.4-56.32-485.12-522.24 207.36 21.76 207.36z" fill="#231C1C" /></svg>

data-room-ui/packages/assets/images/alignIcon/svg/broadcast-4.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="199.80px" viewBox="0 0 1025 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="" d="M692.4 67.2L189.3 563.7c-5.2 5.1-6.3 13.1-2.6 19.4l115.6 200.3c3.6 6.3 11.1 9.4 18.1 7.4l103.4-28.4c3.6-1 7.4 0.6 9.2 3.9 14.8 27.6 40.2 60.4 82 79 20.3 9 42.4 13.5 65.1 13.5 21.9 0 44.5-4.2 66.5-12.6 39.1-14.9 75.3-42.3 99.2-75.4 10.5-14.5 18.9-30.6 25.2-47.7 14.3-39.1 46.4-69 86.5-80l144.4-39.7c20.2-5.6 29.7-28.7 19.2-46.9L742.6 73.9c-10.4-18.1-35.2-21.4-50.2-6.7z m1.7 666c-25.1 34.6-69.8 61.7-113.6 61.7-13.4 0-26.8-2.5-39.5-8.2-18.1-8-31.4-20.8-41.2-34.1-3.3-4.5-1.1-11 4.3-12.4l164-45.1c22.1-6.1 39.7 19 26.3 37.6-0.1 0.2-0.2 0.4-0.3 0.5z m-356.4-16.6l-75.5-130.7c-0.9-1.6-0.6-3.6 0.7-4.8l441.4-435.6c1.9-1.8 5-1.4 6.3 0.8l232 401.8c1.3 2.3 0.1 5.2-2.4 5.9l-598 164.4c-1.7 0.5-3.6-0.3-4.5-1.8zM129.4 675.8l62 107.4c1.1 1.9 0.4 4.4-1.5 5.5l-34.6 20c-1.9 1.1-4.4 0.4-5.5-1.5l-60-103.9c-1.1-1.9-0.4-4.4 1.5-5.5l38.1-22z m-115.1-7.4c-7.7 4.4-10.3 14.2-5.9 21.9l112 194c4.4 7.7 14.2 10.3 21.9 5.9l124.7-72c7.7-4.4 10.3-14.2 5.9-21.9l-112-194c-4.4-7.7-14.2-10.3-21.9-5.9l-124.7 72z" /></svg>

data-room-ui/packages/assets/images/alignIcon/svg/broadcast-5.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="199.80px" viewBox="0 0 1025 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="" d="M1021.2 556.5L742.6 74c-10.5-18.2-35.3-21.5-50.2-6.8L189.3 563.7c-5.2 5.1-6.3 13.1-2.6 19.4l115.6 200.3c3.6 6.3 11.1 9.4 18.1 7.4l103.4-28.4c3.6-1 7.4 0.6 9.2 3.9 14.8 27.6 40.2 60.4 82 79 20.3 9 42.4 13.5 65.1 13.5 21.9 0 44.5-4.2 66.5-12.6 39.1-14.9 75.3-42.3 99.2-75.4 10.5-14.5 18.9-30.5 25.2-47.7 14.3-39.1 46.4-69 86.5-80l144.4-39.7c20.3-5.6 29.8-28.8 19.3-46.9zM694.5 732.7c-0.1 0.2-0.3 0.3-0.4 0.5-25.1 34.6-69.8 61.7-113.6 61.7-13.4 0-26.8-2.5-39.5-8.2-18.1-8-31.5-20.9-41.2-34.1-3.3-4.5-1.1-11 4.3-12.4l164-45.1c22.1-6 39.7 19 26.4 37.6zM129.4 675.8l62 107.4c1.1 1.9 0.4 4.4-1.5 5.5l-34.6 20c-1.9 1.1-4.4 0.4-5.5-1.5l-60-103.9c-1.1-1.9-0.4-4.4 1.5-5.5l38.1-22z m-115.1-7.4c-7.7 4.4-10.3 14.2-5.9 21.9l112 194c4.4 7.7 14.2 10.3 21.9 5.9l124.7-72c7.7-4.4 10.3-14.2 5.9-21.9l-112-194c-4.4-7.7-14.2-10.3-21.9-5.9l-124.7 72z" /></svg>

data-room-ui/packages/assets/images/alignIcon/svg/broadcast-6.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="" d="M884.736 0c59.392 0 112.64 37.888 132.096 95.232 19.456 57.344 0 119.808-48.128 155.648-46.08-81.92-113.664-149.504-194.56-195.584C799.744 20.48 840.704 0 884.736 0zM109.568 3.072c54.272-11.264 110.592 10.24 142.336 55.296-80.896 47.104-146.432 114.688-192.512 196.608C14.336 222.208-8.192 166.912 3.072 112.64 13.312 57.344 55.296 15.36 109.568 3.072z m377.856 248.832c-12.288-1.024-25.6 2.048-34.816 11.264-9.216 8.192-15.36 20.48-15.36 33.792v268.288c0 15.36 12.288 27.648 27.648 27.648h202.752c13.312 0 25.6-5.12 33.792-15.36 8.192-9.216 12.288-22.528 11.264-34.816-3.072-22.528-22.528-39.936-46.08-39.936H526.336v-204.8c0-23.552-16.384-43.008-38.912-46.08zM516.096 51.2c191.488 0 363.52 120.832 429.056 302.08 65.536 181.248 12.288 384-134.144 508.928l73.728 73.728c20.48 20.48 20.48 52.224 0 72.704-9.216 9.216-22.528 15.36-35.84 15.36-13.312 0-26.624-5.12-35.84-15.36l-88.064-88.064c-132.096 68.608-288.768 67.584-420.864-1.024L215.04 1008.64c-9.216 9.216-22.528 15.36-35.84 15.36s-26.624-5.12-35.84-15.36c-20.48-20.48-20.48-52.224 0-72.704l74.752-74.752C70.656 735.232 18.432 532.48 84.992 351.232 151.552 171.008 323.584 51.2 516.096 51.2z"  /></svg>

data-room-ui/packages/assets/images/alignIcon/svg/broadcast-7.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="" d="M773.51255 624.357997c51.065026-12.69309 88.902796-58.8442 88.902796-113.832582s-37.83777-101.139491-88.902796-113.834628L773.51255 114.634854c0.267083-2.090615 0.419556-4.228301 0.419556-6.395664 0-26.134217-21.189601-47.323818-47.323818-47.323818-10.766205 0-20.712741 3.598968-28.674063 9.658987L349.424786 297.555953 197.753411 297.555953c-21.667485 0-39.078017 17.428951-39.078017 38.924521l0 348.08886c0 21.437242 17.486256 38.923498 39.078017 38.923498l150.448524 0 0 0.171915 347.688747 225.148853c8.265244 7.062859 18.99461 11.319813 30.716582 11.319813 26.134217 0 47.323818-21.189601 47.323818-47.323818 0-2.166339-0.152473-4.305049-0.419556-6.395664L773.511527 624.357997z"  /></svg>

data-room-ui/packages/assets/images/alignIcon/svg/broadcast-8.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="" d="M800 0c-65.696 0-117.312 45.12-154.368 114.752l-0.672-0.384C591.136 219.744 511.008 288 423.232 288H128c-71.776 0-128 70.304-128 160 0 89.76 56.224 160 128 160a64 64 0 0 1 63.84 64v288a64 64 0 0 0 64 64h128a64 64 0 0 0 64-64v-32c0-32-32-46.304-32-64v-224c0-0.736 0.512-1.248 0.576-1.984a31.744 31.744 0 0 1 3.584-12.64 21.6 21.6 0 0 1 1.888-2.816 31.648 31.648 0 0 1 9.728-9.376c0.192-0.128 0.256-0.32 0.448-0.448 0.128 0 0.224-0.128 0.352-0.128 2.56-1.44 5.632-1.76 8.512-2.56 80.768 8.576 153.888 73.76 204.064 171.936l0.8-0.384C682.88 851.008 734.368 896 800 896c147.072 0 224-225.376 224-448S947.072 0 800 0z m-160 448c0-33.184 1.952-65.248 5.248-96H736c35.328 0 64 43.008 64 96 0 53.056-28.672 96-64 96h-90.752A899.36 899.36 0 0 1 640 448zM64 448c0-52.992 28.672-96 64-96H352.448c-19.84 23.328-32.448 57.184-32.448 96 0 38.88 12.608 72.736 32.448 96H128c-35.328 0-64-42.944-64-96z m319.84 512h-128v-288a127.04 127.04 0 0 0-17.184-64h22.336v0.384h96.256a96.736 96.736 0 0 0-5.408 31.616v224c0 30.816 17.216 51.328 27.488 63.552 1.408 1.696 3.072 3.424 4.512 5.312V960z m39.392-415.616H416V544c-35.328 0-64-42.944-64-96 0-52.992 28.672-96 64-96h7.232c60.352 0 116.864-23.744 166.592-64.576A925.376 925.376 0 0 0 576 448c0 54.688 4.672 109.44 13.888 160.992-49.76-40.864-106.304-64.608-166.656-64.608zM800 832c-64.576 0-120-91.872-145.312-224H736c71.744 0 128-70.24 128-160 0-89.696-56.256-160-128-160h-81.312C680 155.936 735.424 64 800 64c88.384 0 160 171.936 160 384s-71.616 384-160 384z"  /></svg>

data-room-ui/packages/assets/images/alignIcon/svg/broadcast-9.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="" d="M128 420.576v200.864h149.12l175.456 140.064V284.288l-169.792 136.288H128z m132.256-64l204.288-163.968a32 32 0 0 1 52.032 24.96v610.432a32 32 0 0 1-51.968 24.992l-209.92-167.552H96a32 32 0 0 1-32-32v-264.864a32 32 0 0 1 32-32h164.256zM670.784 720.128a32 32 0 0 1-44.832-45.664 214.08 214.08 0 0 0 64.32-153.312 213.92 213.92 0 0 0-55.776-144.448 32 32 0 1 1 47.36-43.04 277.92 277.92 0 0 1 72.416 187.488 278.08 278.08 0 0 1-83.488 198.976zM822.912 858.88a32 32 0 1 1-45.888-44.608A419.008 419.008 0 0 0 896 521.152c0-108.704-41.376-210.848-114.432-288.384a32 32 0 0 1 46.592-43.872c84.16 89.28 131.84 207.04 131.84 332.256 0 127.84-49.76 247.904-137.088 337.728z"  /></svg>

data-room-ui/packages/js/mixins/commonMixins.js

@@ -117,12 +117,12 @@ export default {
      * @description: 更新chart
      * @param {Object} config
      */
-    changeData(config, filterList) {
+    changeData (config, filterList) {
       const list = config?.paramsList?.map((item) => {
         if (item.value === '${level}') {
-          return {...item,value:config.customize.level}
+          return { ...item, value: config.customize.level }
         } else if (item.value === '${name}') {
-          return {...item,value:config.customize.scope}
+          return { ...item, value: config.customize.scope }
         } else {
           return item
         }
@@ -130,7 +130,7 @@ export default {
       const params = {
         chart: {
           ...config,
-          paramsList:list?[...list]:[],
+          paramsList: list ? [...list] : [],
           option: undefined
         },
         current: 1,

data-room-ui/packages/js/store/mutations.js

@@ -66,7 +66,7 @@ export default {
     state.pageLoading = booleanValue
   },
   // 改变当前组件配置
-  changeChartConfig(state, itemConfig) {
+  changeChartConfig (state, itemConfig) {
     const index = state.pageInfo.chartList.findIndex(
       item => item.code === itemConfig.code
     )
@@ -92,7 +92,7 @@ export default {
       { type: 'v', site: x || 0 }
     ]
   },
-  changeActiveItemConfig(state, config) {
+  changeActiveItemConfig (state, config) {
     state.activeItemConfig = cloneDeep(config)
   },
   // 新增一个组件
@@ -105,8 +105,16 @@ export default {
   // 删除组件/批量删除组件
   delItem (state, codes) {
     if (Array.isArray(codes)) {
+      const delCharts = state.pageInfo.chartList.filter(chart => codes.includes(chart.code))
+      // 如果删除的组件中有跑马灯，需要删除将跑马灯组件的音频实例销毁
+      delCharts.some(item => { item.type === 'marquee' && EventBus.$emit('deleteComponent', item.code) })
       state.pageInfo.chartList = state.pageInfo.chartList.filter(chart => !codes.includes(chart.code))
     } else {
+      // 如果删除的组件是跑马灯，需要删除将跑马灯组件的音频实例销毁
+      const delChart = state.pageInfo.chartList.find(chart => codes === chart.code)
+      if (delChart && delChart.type === 'marquee') {
+        EventBus.$emit('deleteComponent', codes)
+      }
       state.pageInfo.chartList = state.pageInfo.chartList.filter(chart => codes !== chart.code)
     }
     // 存储删除后的状态