Merge pull request #10107 from dataease/pr@dev-v2@refactor_mobile

refactor(仪表板): 增加手机布局提示等

core/core-frontend/src/custom-component/de-stream-media/Component.vue

@@ -21,7 +21,7 @@
 <script lang="ts" setup>
 import flvjs from 'flv.js'
 import '@/style/custom-theme.css'
-import { onMounted, reactive, toRefs, getCurrentInstance, watch, nextTick } from 'vue'
+import { onMounted, reactive, toRefs, getCurrentInstance, nextTick, onBeforeUnmount } from 'vue'
 import { useEmitt } from '@/hooks/web/useEmitt'
 import { useI18n } from '@/hooks/web/useI18n'
 const { t } = useI18n()
@@ -109,6 +109,10 @@ const destroyPlayer = () => {
     state.flvPlayer = null
   }
 }
+
+onBeforeUnmount(() => {
+  destroyPlayer()
+})
 </script>
 
 <style lang="less" scoped>

core/core-frontend/src/views/dashboard/MobileConfigPanel.vue

@@ -279,7 +279,11 @@ const save = () => {
                 :scale="80"
               />
             </div>
-            <div class="mobile-com-mask" @click="addToMobile(item)"></div>
+            <div class="mobile-com-mask" @click="addToMobile(item)">
+              <span v-show="item.component === 'DeStreamMedia'" style="color: #909399"
+                >IOS可能无法显示</span
+              >
+            </div>
             <div class="pc-select-to-mobile" @click="addToMobile(item)" v-if="!mobileLoading"></div>
           </div>
         </template>
@@ -511,6 +515,9 @@ const save = () => {
       left: 0;
       z-index: 10;
       cursor: pointer;
+      display: flex;
+      align-items: center;
+      justify-content: center;
     }
 
     .pc-select-to-mobile {