@yimou6/common-ui 1.10.11 → 1.10.12

package/es/components/tzj-player/src/tzj-player.vue.d.ts

@@ -1500,10 +1500,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 createPlayerDom: () => void;
                 createPlayer: () => Promise<void>;
                 destroy: () => void;
-                topBar: import("vue").Ref<any, any>;
-                topBarTimer: any;
-                handleMouseEnter: () => void;
-                handleMouseLeave: () => void;
             }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("error" | "play" | "pause" | "videoInfo" | "timeout" | "mute")[], "error" | "play" | "pause" | "videoInfo" | "timeout" | "mute", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                 url: {
                     type: StringConstructor;
@@ -1602,6 +1598,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 type: StringConstructor;
                 required: false;
             };
+            areaName: {
+                type: StringConstructor;
+                required: false;
+            };
         }>, {
             props: any;
             PLAYER_TEMPLATE: string;
@@ -1609,6 +1609,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             playerInstance: any;
             errorMsg: string;
             ysRef: import("vue").ShallowRef<any, any>;
+            containerRef: import("vue").ShallowRef<any, any>;
             width: import("vue").Ref<number, number>;
             height: import("vue").Ref<number, number>;
             ratio: number;
@@ -1647,6 +1648,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 type: StringConstructor;
                 required: false;
             };
+            areaName: {
+                type: StringConstructor;
+                required: false;
+            };
         }>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
     };
     playerComponent: import("vue").ComputedRef<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
@@ -1730,10 +1735,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         createPlayerDom: () => void;
         createPlayer: () => Promise<void>;
         destroy: () => void;
-        topBar: import("vue").Ref<any, any>;
-        topBarTimer: any;
-        handleMouseEnter: () => void;
-        handleMouseLeave: () => void;
     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("error" | "play" | "pause" | "videoInfo" | "timeout" | "mute")[], "error" | "play" | "pause" | "videoInfo" | "timeout" | "mute", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
         url: {
             type: StringConstructor;
@@ -3218,10 +3219,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             createPlayerDom: () => void;
             createPlayer: () => Promise<void>;
             destroy: () => void;
-            topBar: import("vue").Ref<any, any>;
-            topBarTimer: any;
-            handleMouseEnter: () => void;
-            handleMouseLeave: () => void;
         }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("error" | "play" | "pause" | "videoInfo" | "timeout" | "mute")[], "error" | "play" | "pause" | "videoInfo" | "timeout" | "mute", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
             url: {
                 type: StringConstructor;
@@ -3319,6 +3316,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             type: StringConstructor;
             required: false;
         };
+        areaName: {
+            type: StringConstructor;
+            required: false;
+        };
     }>, {
         props: any;
         PLAYER_TEMPLATE: string;
@@ -3326,6 +3327,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         playerInstance: any;
         errorMsg: string;
         ysRef: import("vue").ShallowRef<any, any>;
+        containerRef: import("vue").ShallowRef<any, any>;
         width: import("vue").Ref<number, number>;
         height: import("vue").Ref<number, number>;
         ratio: number;
@@ -3364,6 +3366,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             type: StringConstructor;
             required: false;
         };
+        areaName: {
+            type: StringConstructor;
+            required: false;
+        };
     }>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any> | null>;
     errorState: import("vue").ComputedRef<{
         type: string;
@@ -3450,10 +3456,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         createPlayerDom: () => void;
         createPlayer: () => Promise<void>;
         destroy: () => void;
-        topBar: import("vue").Ref<any, any>;
-        topBarTimer: any;
-        handleMouseEnter: () => void;
-        handleMouseLeave: () => void;
     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("error" | "play" | "pause" | "videoInfo" | "timeout" | "mute")[], "error" | "play" | "pause" | "videoInfo" | "timeout" | "mute", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
         url: {
             type: StringConstructor;
@@ -4938,10 +4940,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             createPlayerDom: () => void;
             createPlayer: () => Promise<void>;
             destroy: () => void;
-            topBar: import("vue").Ref<any, any>;
-            topBarTimer: any;
-            handleMouseEnter: () => void;
-            handleMouseLeave: () => void;
         }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("error" | "play" | "pause" | "videoInfo" | "timeout" | "mute")[], "error" | "play" | "pause" | "videoInfo" | "timeout" | "mute", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
             url: {
                 type: StringConstructor;
@@ -5039,6 +5037,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             type: StringConstructor;
             required: false;
         };
+        areaName: {
+            type: StringConstructor;
+            required: false;
+        };
     }>, {
         props: any;
         PLAYER_TEMPLATE: string;
@@ -5046,6 +5048,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         playerInstance: any;
         errorMsg: string;
         ysRef: import("vue").ShallowRef<any, any>;
+        containerRef: import("vue").ShallowRef<any, any>;
         width: import("vue").Ref<number, number>;
         height: import("vue").Ref<number, number>;
         ratio: number;
@@ -5084,6 +5087,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             type: StringConstructor;
             required: false;
         };
+        areaName: {
+            type: StringConstructor;
+            required: false;
+        };
     }>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any> | null>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     url: {

package/es/components/tzj-player/src/ysPlayer.vue.d.ts

@@ -23,6 +23,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: StringConstructor;
         required: false;
     };
+    areaName: {
+        type: StringConstructor;
+        required: false;
+    };
 }>, {
     props: any;
     PLAYER_TEMPLATE: string;
@@ -30,6 +34,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     playerInstance: any;
     errorMsg: string;
     ysRef: import("vue").ShallowRef<any, any>;
+    containerRef: import("vue").ShallowRef<any, any>;
     width: import("vue").Ref<number, number>;
     height: import("vue").Ref<number, number>;
     ratio: number;
@@ -68,5 +73,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: StringConstructor;
         required: false;
     };
+    areaName: {
+        type: StringConstructor;
+        required: false;
+    };
 }>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/components/tzj-player/src/ysPlayer.vue2.mjs

@@ -1,4 +1,4 @@
-import { defineComponent, shallowRef, onMounted, onBeforeUnmount, watch, nextTick, openBlock, createElementBlock, unref, toDisplayString, createCommentVNode } from 'vue';
+import { defineComponent, shallowRef, onMounted, onBeforeUnmount, watch, nextTick, openBlock, createElementBlock, createCommentVNode, createElementVNode, toDisplayString, normalizeStyle, unref } from 'vue';
 import { useElementSize } from '@vueuse/core';
 import { uuid } from './tzj-player.mjs';
 
@@ -6,6 +6,10 @@ var __defProp = Object.defineProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
 const _hoisted_1 = {
   key: 0,
+  class: "i-tzj-easyPlayer__top"
+};
+const _hoisted_2 = {
+  key: 1,
   class: "i-tzj-player__error"
 };
 const PLAYER_TEMPLATE = "5f295a9341a74d439b5d69374c90d501";
@@ -20,7 +24,8 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     channel: {},
     quality: {},
     accessToken: {},
-    playerTemplate: {}
+    playerTemplate: {},
+    areaName: {}
   },
   setup(__props, { expose: __expose }) {
     const props = __props;
@@ -28,6 +33,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     let playerInstance = null;
     let errorMsg = "";
     const ysRef = shallowRef();
+    const containerRef = shallowRef();
     const { width, height } = useElementSize(ysRef);
     let ratio = 16 / 9;
     let isCurrentFullscreen = false;
@@ -162,7 +168,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
           dom.id = id;
           dom.style.width = "100%";
           dom.style.height = "100%";
-          (_a = ysRef.value) == null ? void 0 : _a.appendChild(dom);
+          (_a = containerRef.value) == null ? void 0 : _a.appendChild(dom);
         }
       }
     }
@@ -176,9 +182,41 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
           class: "i-tzj-ysplayer"
         },
         [
+          createCommentVNode(" \u64AD\u653E\u5668\u9876\u90E8\u663E\u793A\u533A\u57DF(\u8BBE\u5907)\u540D\u79F0 "),
+          _ctx.areaName ? (openBlock(), createElementBlock("div", _hoisted_1, [
+            _cache[0] || (_cache[0] = createElementVNode(
+              "i",
+              { class: "iconfont icon-shexiangtou4" },
+              null,
+              -1
+              /* CACHED */
+            )),
+            createElementVNode(
+              "span",
+              null,
+              toDisplayString(_ctx.areaName),
+              1
+              /* TEXT */
+            )
+          ])) : createCommentVNode("v-if", true),
+          createElementVNode(
+            "div",
+            {
+              ref_key: "containerRef",
+              ref: containerRef,
+              class: "i-tzj-ysplayer",
+              style: normalizeStyle([{ "width": "100%" }, {
+                height: _ctx.areaName ? "calc(100% - 32px)" : "100%",
+                position: "relative"
+              }])
+            },
+            null,
+            4
+            /* STYLE */
+          ),
           unref(errorMsg) ? (openBlock(), createElementBlock(
             "div",
-            _hoisted_1,
+            _hoisted_2,
             toDisplayString(unref(errorMsg)),
             1
             /* TEXT */

package/es/components/tzj-player/src/ysPlayer.vue2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ysPlayer.vue2.mjs","sources":["../../../../../../../packages/components/tzj-player/src/ysPlayer.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useElementSize } from \"@vueuse/core\";\nimport { nextTick, onBeforeUnmount, onMounted, shallowRef, watch } from \"vue\";\nimport { uuid } from \"./tzj-player\";\n// 萤石云播放器\ndefineOptions({\n  name: \"YsPlayer\",\n});\n\n// 传值方式\n// 1、传url、accessToken\n// 2、传deviceSerial、channel、accessToken\nconst props = defineProps<{\n  // 播放地址\n  // 高清：ezopen://open.ys7.com/${设备序列号}/${通道号}.hd.live\n  // 流畅：ezopen://open.ys7.com/${设备序列号}/${通道号}.live\n  url?: string;\n  // 设备序列号\n  deviceSerial?: string;\n  // 通道号\n  channel?: number;\n  // 清晰度,默认为空，也表示高清\n  // hd：高清；sd：流畅\n  quality?: \"hd\" | \"sd\" | \"\";\n  accessToken: string;\n  // 播放器模板ID\n  playerTemplate?: string;\n}>();\n\n// 播放器模板ID\n// 可在萤石云控制台查看、修改、获取\n// 位置：云直播-轻应用-特致珈默认模板\nconst PLAYER_TEMPLATE = \"5f295a9341a74d439b5d69374c90d501\";\nconst id = uuid();\nlet playerInstance: any = null;\nlet errorMsg = \"\";\nconst ysRef = shallowRef();\nconst { width, height } = useElementSize(ysRef);\nlet ratio = 16 / 9;\nlet isCurrentFullscreen = false;\n\nonMounted(() => play());\n\nonBeforeUnmount(() => destroy());\n\ndefineExpose({ play, destroy, resize });\n\n// 防抖函数\nfunction debounce(func: Function, wait: number) {\n  let timeout: ReturnType<typeof setTimeout> | null = null;\n  return function (this: any, ...args: any[]) {\n    if (timeout) clearTimeout(timeout);\n    timeout = setTimeout(() => func.apply(this, args), wait);\n  };\n}\n\n// 加上防抖的 resize 函数\nconst debouncedResize = debounce(resize, 300);\n\nwatch(\n  () => [width.value, height.value, ratio],\n  () => {\n    if (!isCurrentFullscreen) {\n      debouncedResize();\n    }\n  },\n);\n\nasync function play(options?: Record<string, any>) {\n  if (!props.accessToken) {\n    errorMsg = `params 'accessToken' is not found`;\n  } else {\n    const url = formatterUrl();\n    if (url) {\n      createPlayerDom();\n      await nextTick();\n      await createPlayer(options);\n    }\n  }\n}\nfunction destroy() {\n  if (playerInstance) {\n    playerInstance.destroy();\n    playerInstance = null;\n    removePlayerDom();\n  }\n}\nfunction resize() {\n  // 根据播放器宽高比，设置播放器高度\n  if (width.value > 0 && height.value > 0) {\n    let calculatedWidth = width.value;\n    let calculatedHeight = calculatedWidth / ratio;\n    if (calculatedHeight > height.value) {\n      calculatedHeight = height.value;\n      calculatedWidth = calculatedHeight * ratio;\n    }\n    if (playerInstance?.resize) {\n      playerInstance.resize(calculatedWidth, calculatedHeight);\n    } else if (typeof document !== \"undefined\") {\n      const dom = document.getElementById(id);\n      if (dom) {\n        dom.style.width = `${calculatedWidth}px`;\n        dom.style.height = `${calculatedHeight}px`;\n      }\n    }\n  }\n}\n\n/**\n * 创建萤石云播放器实例，播放萤石云直播流\n */\nasync function createPlayer(options?: Record<string, any>) {\n  try {\n    // 动态导入 EZUIKit，避免 SSR 环境下的 window 访问错误\n    const EZUIKit = await import(\"ezuikit-js\");\n\n    playerInstance = new EZUIKit.default.EZUIKitPlayer({\n      id,\n      url: formatterUrl(),\n      accessToken: props.accessToken,\n      template: props.playerTemplate || PLAYER_TEMPLATE,\n      width: width.value,\n      height: height.value,\n      audio: 1,\n      // @ts-ignore\n      loggerOptions: {\n        name: \"YSPLAYER\",\n        level: \"ERROR\",\n        showTime: true,\n      },\n      staticPath: \"/plugins/ezuikit/ezuikit_static\",\n      ...options,\n    });\n  } catch (error) {\n    console.error(\"Failed to load EZUIKit:\", error);\n    errorMsg = \"播放器加载失败\";\n    return;\n  }\n\n  playerInstance.eventEmitter.on(\"fullscreen\", () => {\n    isCurrentFullscreen = true;\n  });\n  playerInstance.eventEmitter.on(\"exitFullscreen\", () => {\n    isCurrentFullscreen = false;\n  });\n  playerInstance.eventEmitter.on(\"videoInfo\", (args: any) => {\n    const { width: w, height: h } = args;\n    // 计算播放器宽高比\n    if (w && h) {\n      ratio = w / h;\n    }\n    debouncedResize();\n  });\n}\n\nfunction formatterUrl(): string {\n  if (props.url) {\n    return props.url;\n  } else {\n    if (props.deviceSerial && props.channel) {\n      const quality =\n        props.quality === \"\" || props.quality === \"hd\" ? \"hd.\" : \"\";\n      return `ezopen://open.ys7.com/${props.deviceSerial}/${props.channel}.${quality}live`;\n    } else {\n      errorMsg = `params 'deviceSerial' or 'channel' is not found`;\n      return \"\";\n    }\n  }\n}\n\n// 移除播放器DOM\nfunction removePlayerDom() {\n  if (typeof document !== \"undefined\") {\n    const dom = document.getElementById(id);\n    dom && dom.remove();\n  }\n}\n// 创建播放器DOM\nfunction createPlayerDom() {\n  if (!errorMsg) {\n    removePlayerDom();\n    if (typeof document !== \"undefined\") {\n      const dom = document.createElement(\"div\");\n      dom.id = id;\n      dom.style.width = \"100%\";\n      dom.style.height = \"100%\";\n      ysRef.value?.appendChild(dom);\n    }\n  }\n}\n</script>\n\n<template>\n  <div ref=\"ysRef\" class=\"i-tzj-ysplayer\">\n    <div v-if=\"errorMsg\" class=\"i-tzj-player__error\">\n      {{ errorMsg }}\n    </div>\n  </div>\n</template>\n"],"names":["_createElementBlock","_unref","_toDisplayString"],"mappings":"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"}
+{"version":3,"file":"ysPlayer.vue2.mjs","sources":["../../../../../../../packages/components/tzj-player/src/ysPlayer.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useElementSize } from \"@vueuse/core\";\nimport { nextTick, onBeforeUnmount, onMounted, shallowRef, watch } from \"vue\";\nimport { uuid } from \"./tzj-player\";\n// 萤石云播放器\ndefineOptions({\n  name: \"YsPlayer\",\n});\n\n// 传值方式\n// 1、传url、accessToken\n// 2、传deviceSerial、channel、accessToken\nconst props = defineProps<{\n  // 播放地址\n  // 高清：ezopen://open.ys7.com/${设备序列号}/${通道号}.hd.live\n  // 流畅：ezopen://open.ys7.com/${设备序列号}/${通道号}.live\n  url?: string;\n  // 设备序列号\n  deviceSerial?: string;\n  // 通道号\n  channel?: number;\n  // 清晰度,默认为空，也表示高清\n  // hd：高清；sd：流畅\n  quality?: \"hd\" | \"sd\" | \"\";\n  accessToken: string;\n  // 播放器模板ID\n  playerTemplate?: string;\n  // 设备名称\n  areaName?: string;\n}>();\n\n// 播放器模板ID\n// 可在萤石云控制台查看、修改、获取\n// 位置：云直播-轻应用-特致珈默认模板\nconst PLAYER_TEMPLATE = \"5f295a9341a74d439b5d69374c90d501\";\nconst id = uuid();\nlet playerInstance: any = null;\nlet errorMsg = \"\";\nconst ysRef = shallowRef();\nconst containerRef = shallowRef();\nconst { width, height } = useElementSize(ysRef);\nlet ratio = 16 / 9;\nlet isCurrentFullscreen = false;\n\nonMounted(() => play());\n\nonBeforeUnmount(() => destroy());\n\ndefineExpose({ play, destroy, resize });\n\n// 防抖函数\nfunction debounce(func: Function, wait: number) {\n  let timeout: ReturnType<typeof setTimeout> | null = null;\n  return function (this: any, ...args: any[]) {\n    if (timeout) clearTimeout(timeout);\n    timeout = setTimeout(() => func.apply(this, args), wait);\n  };\n}\n\n// 加上防抖的 resize 函数\nconst debouncedResize = debounce(resize, 300);\n\nwatch(\n  () => [width.value, height.value, ratio],\n  () => {\n    if (!isCurrentFullscreen) {\n      debouncedResize();\n    }\n  },\n);\n\nasync function play(options?: Record<string, any>) {\n  if (!props.accessToken) {\n    errorMsg = `params 'accessToken' is not found`;\n  } else {\n    const url = formatterUrl();\n    if (url) {\n      createPlayerDom();\n      await nextTick();\n      await createPlayer(options);\n    }\n  }\n}\nfunction destroy() {\n  if (playerInstance) {\n    playerInstance.destroy();\n    playerInstance = null;\n    removePlayerDom();\n  }\n}\nfunction resize() {\n  // 根据播放器宽高比，设置播放器高度\n  if (width.value > 0 && height.value > 0) {\n    let calculatedWidth = width.value;\n    let calculatedHeight = calculatedWidth / ratio;\n    if (calculatedHeight > height.value) {\n      calculatedHeight = height.value;\n      calculatedWidth = calculatedHeight * ratio;\n    }\n    if (playerInstance?.resize) {\n      playerInstance.resize(calculatedWidth, calculatedHeight);\n    } else if (typeof document !== \"undefined\") {\n      const dom = document.getElementById(id);\n      if (dom) {\n        dom.style.width = `${calculatedWidth}px`;\n        dom.style.height = `${calculatedHeight}px`;\n      }\n    }\n  }\n}\n\n/**\n * 创建萤石云播放器实例，播放萤石云直播流\n */\nasync function createPlayer(options?: Record<string, any>) {\n  try {\n    // 动态导入 EZUIKit，避免 SSR 环境下的 window 访问错误\n    const EZUIKit = await import(\"ezuikit-js\");\n\n    playerInstance = new EZUIKit.default.EZUIKitPlayer({\n      id,\n      url: formatterUrl(),\n      accessToken: props.accessToken,\n      template: props.playerTemplate || PLAYER_TEMPLATE,\n      width: width.value,\n      height: height.value,\n      audio: 1,\n      // @ts-ignore\n      loggerOptions: {\n        name: \"YSPLAYER\",\n        level: \"ERROR\",\n        showTime: true,\n      },\n      staticPath: \"/plugins/ezuikit/ezuikit_static\",\n      ...options,\n    });\n  } catch (error) {\n    console.error(\"Failed to load EZUIKit:\", error);\n    errorMsg = \"播放器加载失败\";\n    return;\n  }\n\n  playerInstance.eventEmitter.on(\"fullscreen\", () => {\n    isCurrentFullscreen = true;\n  });\n  playerInstance.eventEmitter.on(\"exitFullscreen\", () => {\n    isCurrentFullscreen = false;\n  });\n  playerInstance.eventEmitter.on(\"videoInfo\", (args: any) => {\n    const { width: w, height: h } = args;\n    // 计算播放器宽高比\n    if (w && h) {\n      ratio = w / h;\n    }\n    debouncedResize();\n  });\n}\n\nfunction formatterUrl(): string {\n  if (props.url) {\n    return props.url;\n  } else {\n    if (props.deviceSerial && props.channel) {\n      const quality =\n        props.quality === \"\" || props.quality === \"hd\" ? \"hd.\" : \"\";\n      return `ezopen://open.ys7.com/${props.deviceSerial}/${props.channel}.${quality}live`;\n    } else {\n      errorMsg = `params 'deviceSerial' or 'channel' is not found`;\n      return \"\";\n    }\n  }\n}\n\n// 移除播放器DOM\nfunction removePlayerDom() {\n  if (typeof document !== \"undefined\") {\n    const dom = document.getElementById(id);\n    dom && dom.remove();\n  }\n}\n// 创建播放器DOM\nfunction createPlayerDom() {\n  if (!errorMsg) {\n    removePlayerDom();\n    if (typeof document !== \"undefined\") {\n      const dom = document.createElement(\"div\");\n      dom.id = id;\n      dom.style.width = \"100%\";\n      dom.style.height = \"100%\";\n      containerRef.value?.appendChild(dom);\n    }\n  }\n}\n</script>\n\n<template>\n  <div ref=\"ysRef\" class=\"i-tzj-ysplayer\">\n    <!-- 播放器顶部显示区域(设备)名称 -->\n    <div v-if=\"areaName\" class=\"i-tzj-easyPlayer__top\">\n      <i class=\"iconfont icon-shexiangtou4\" />\n      <span>{{ areaName }}</span>\n    </div>\n    <div\n      ref=\"containerRef\"\n      class=\"i-tzj-ysplayer\"\n      style=\"width: 100%\"\n      :style=\"{\n        height: areaName ? 'calc(100% - 32px)' : '100%',\n        position: 'relative',\n      }\"\n    />\n    <div v-if=\"errorMsg\" class=\"i-tzj-player__error\">\n      {{ errorMsg }}\n    </div>\n  </div>\n</template>\n"],"names":["_createElementBlock","_createCommentVNode","areaName","_openBlock","_createElementVNode","_unref","_toDisplayString"],"mappings":"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"}

package/es/components/tzj-player/src/yunzhiyanPlayer.vue.d.ts

@@ -1443,10 +1443,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         createPlayerDom: () => void;
         createPlayer: () => Promise<void>;
         destroy: () => void;
-        topBar: import("vue").Ref<any, any>;
-        topBarTimer: any;
-        handleMouseEnter: () => void;
-        handleMouseLeave: () => void;
     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("error" | "play" | "pause" | "videoInfo" | "timeout" | "mute")[], "error" | "play" | "pause" | "videoInfo" | "timeout" | "mute", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
         url: {
             type: StringConstructor;

package/lib/components/tzj-player/index.d.ts

@@ -1500,10 +1500,6 @@ export declare const ITzjPlayer: import("../../types").SFCWithInstall<import("vu
                 createPlayerDom: () => void;
                 createPlayer: () => Promise<void>;
                 destroy: () => void;
-                topBar: import("vue").Ref<any, any>;
-                topBarTimer: any;
-                handleMouseEnter: () => void;
-                handleMouseLeave: () => void;
             }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("error" | "play" | "pause" | "videoInfo" | "timeout" | "mute")[], "error" | "play" | "pause" | "videoInfo" | "timeout" | "mute", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                 url: {
                     type: StringConstructor;
@@ -1602,6 +1598,10 @@ export declare const ITzjPlayer: import("../../types").SFCWithInstall<import("vu
                 type: StringConstructor;
                 required: false;
             };
+            areaName: {
+                type: StringConstructor;
+                required: false;
+            };
         }>, {
             props: any;
             PLAYER_TEMPLATE: string;
@@ -1609,6 +1609,7 @@ export declare const ITzjPlayer: import("../../types").SFCWithInstall<import("vu
             playerInstance: any;
             errorMsg: string;
             ysRef: import("vue").ShallowRef<any, any>;
+            containerRef: import("vue").ShallowRef<any, any>;
             width: import("vue").Ref<number, number>;
             height: import("vue").Ref<number, number>;
             ratio: number;
@@ -1647,6 +1648,10 @@ export declare const ITzjPlayer: import("../../types").SFCWithInstall<import("vu
                 type: StringConstructor;
                 required: false;
             };
+            areaName: {
+                type: StringConstructor;
+                required: false;
+            };
         }>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
     };
     playerComponent: import("vue").ComputedRef<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
@@ -1730,10 +1735,6 @@ export declare const ITzjPlayer: import("../../types").SFCWithInstall<import("vu
         createPlayerDom: () => void;
         createPlayer: () => Promise<void>;
         destroy: () => void;
-        topBar: import("vue").Ref<any, any>;
-        topBarTimer: any;
-        handleMouseEnter: () => void;
-        handleMouseLeave: () => void;
     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("error" | "play" | "pause" | "videoInfo" | "timeout" | "mute")[], "error" | "play" | "pause" | "videoInfo" | "timeout" | "mute", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
         url: {
             type: StringConstructor;
@@ -3218,10 +3219,6 @@ export declare const ITzjPlayer: import("../../types").SFCWithInstall<import("vu
             createPlayerDom: () => void;
             createPlayer: () => Promise<void>;
             destroy: () => void;
-            topBar: import("vue").Ref<any, any>;
-            topBarTimer: any;
-            handleMouseEnter: () => void;
-            handleMouseLeave: () => void;
         }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("error" | "play" | "pause" | "videoInfo" | "timeout" | "mute")[], "error" | "play" | "pause" | "videoInfo" | "timeout" | "mute", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
             url: {
                 type: StringConstructor;
@@ -3319,6 +3316,10 @@ export declare const ITzjPlayer: import("../../types").SFCWithInstall<import("vu
             type: StringConstructor;
             required: false;
         };
+        areaName: {
+            type: StringConstructor;
+            required: false;
+        };
     }>, {
         props: any;
         PLAYER_TEMPLATE: string;
@@ -3326,6 +3327,7 @@ export declare const ITzjPlayer: import("../../types").SFCWithInstall<import("vu
         playerInstance: any;
         errorMsg: string;
         ysRef: import("vue").ShallowRef<any, any>;
+        containerRef: import("vue").ShallowRef<any, any>;
         width: import("vue").Ref<number, number>;
         height: import("vue").Ref<number, number>;
         ratio: number;
@@ -3364,6 +3366,10 @@ export declare const ITzjPlayer: import("../../types").SFCWithInstall<import("vu
             type: StringConstructor;
             required: false;
         };
+        areaName: {
+            type: StringConstructor;
+            required: false;
+        };
     }>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any> | null>;
     errorState: import("vue").ComputedRef<{
         type: string;
@@ -3450,10 +3456,6 @@ export declare const ITzjPlayer: import("../../types").SFCWithInstall<import("vu
         createPlayerDom: () => void;
         createPlayer: () => Promise<void>;
         destroy: () => void;
-        topBar: import("vue").Ref<any, any>;
-        topBarTimer: any;
-        handleMouseEnter: () => void;
-        handleMouseLeave: () => void;
     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("error" | "play" | "pause" | "videoInfo" | "timeout" | "mute")[], "error" | "play" | "pause" | "videoInfo" | "timeout" | "mute", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
         url: {
             type: StringConstructor;
@@ -4938,10 +4940,6 @@ export declare const ITzjPlayer: import("../../types").SFCWithInstall<import("vu
             createPlayerDom: () => void;
             createPlayer: () => Promise<void>;
             destroy: () => void;
-            topBar: import("vue").Ref<any, any>;
-            topBarTimer: any;
-            handleMouseEnter: () => void;
-            handleMouseLeave: () => void;
         }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("error" | "play" | "pause" | "videoInfo" | "timeout" | "mute")[], "error" | "play" | "pause" | "videoInfo" | "timeout" | "mute", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
             url: {
                 type: StringConstructor;
@@ -5039,6 +5037,10 @@ export declare const ITzjPlayer: import("../../types").SFCWithInstall<import("vu
             type: StringConstructor;
             required: false;
         };
+        areaName: {
+            type: StringConstructor;
+            required: false;
+        };
     }>, {
         props: any;
         PLAYER_TEMPLATE: string;
@@ -5046,6 +5048,7 @@ export declare const ITzjPlayer: import("../../types").SFCWithInstall<import("vu
         playerInstance: any;
         errorMsg: string;
         ysRef: import("vue").ShallowRef<any, any>;
+        containerRef: import("vue").ShallowRef<any, any>;
         width: import("vue").Ref<number, number>;
         height: import("vue").Ref<number, number>;
         ratio: number;
@@ -5084,6 +5087,10 @@ export declare const ITzjPlayer: import("../../types").SFCWithInstall<import("vu
             type: StringConstructor;
             required: false;
         };
+        areaName: {
+            type: StringConstructor;
+            required: false;
+        };
     }>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any> | null>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     url: {

package/lib/components/tzj-player/src/easyPlayer.vue.d.ts

@@ -79,10 +79,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     createPlayerDom: () => void;
     createPlayer: () => Promise<void>;
     destroy: () => void;
-    topBar: import("vue").Ref<any, any>;
-    topBarTimer: any;
-    handleMouseEnter: () => void;
-    handleMouseLeave: () => void;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("error" | "play" | "pause" | "videoInfo" | "timeout" | "mute")[], "error" | "play" | "pause" | "videoInfo" | "timeout" | "mute", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     url: {
         type: StringConstructor;

package/lib/components/tzj-player/src/easyPlayer.vue2.js

@@ -9,12 +9,16 @@ var __defProp = Object.defineProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
 const _hoisted_1 = {
   key: 0,
-  class: "i-tzj-player__error"
+  class: "i-tzj-easyPlayer__top"
 };
 const _hoisted_2 = {
   key: 1,
   class: "i-tzj-player__error"
 };
+const _hoisted_3 = {
+  key: 2,
+  class: "i-tzj-player__error"
+};
 var _sfc_main = /* @__PURE__ */ vue.defineComponent({
   ...{
     name: "EasyPlayer"
@@ -163,9 +167,10 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
       removePlayerDom();
       if (typeof document !== "undefined") {
         const dom = document.createElement("div");
+        const { width, height } = playerRef.value.getBoundingClientRect();
         dom.id = id;
-        dom.style.width = "100%";
-        dom.style.height = "100%";
+        dom.style.width = `${width}px`;
+        dom.style.height = props.areaName ? `${height - 32}px` : `${height}px`;
         (_a = playerRef.value) == null ? void 0 : _a.appendChild(dom);
       }
     }
@@ -249,65 +254,39 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
       removePlayerDom();
     }
     __name(destroy, "destroy");
-    const topBar = vue.ref();
-    let topBarTimer = null;
-    const handleMouseEnter = /* @__PURE__ */ __name(() => {
-      if (topBarTimer) {
-        clearTimeout(topBarTimer);
-        topBarTimer = null;
-      }
-      topBar.value.style.opacity = 1;
-    }, "handleMouseEnter");
-    const handleMouseLeave = /* @__PURE__ */ __name(() => {
-      topBarTimer = setTimeout(() => {
-        topBar.value.style.opacity = 0;
-      }, 5200);
-    }, "handleMouseLeave");
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock(
         "div",
         {
           ref_key: "playerRef",
           ref: playerRef,
-          class: vue.normalizeClass(["i-tzj-easyPlayer", customBar.value ? "i-tzj-easyPlayer--custom" : ""]),
-          onMouseenter: handleMouseEnter,
-          onMouseleave: handleMouseLeave
+          class: vue.normalizeClass(["i-tzj-easyPlayer", customBar.value ? "i-tzj-easyPlayer--custom" : ""])
         },
         [
-          vue.createCommentVNode(" \u64AD\u653E\u5668\u9876\u90E8\u64CD\u4F5C\u680F "),
-          vue.createElementVNode(
-            "div",
-            {
-              ref_key: "topBar",
-              ref: topBar,
-              class: "i-tzj-easyPlayer__top"
-            },
-            [
-              _cache[0] || (_cache[0] = vue.createElementVNode(
-                "i",
-                { class: "iconfont icon-shexiangtou4" },
-                null,
-                -1
-                /* CACHED */
-              )),
-              vue.createElementVNode(
-                "span",
-                null,
-                vue.toDisplayString(_ctx.areaName),
-                1
-                /* TEXT */
-              )
-            ],
-            512
-            /* NEED_PATCH */
-          ),
-          !playSuccess.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, "\u65E0\u4FE1\u53F7")) : vue.createCommentVNode("v-if", true),
-          !playUrl.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, "\u65E0\u64AD\u653E\u5730\u5740")) : vue.createCommentVNode("v-if", true),
+          vue.createCommentVNode(" \u64AD\u653E\u5668\u9876\u90E8\u663E\u793A\u533A\u57DF(\u8BBE\u5907)\u540D\u79F0 "),
+          _ctx.areaName ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+            _cache[0] || (_cache[0] = vue.createElementVNode(
+              "i",
+              { class: "iconfont icon-shexiangtou4" },
+              null,
+              -1
+              /* CACHED */
+            )),
+            vue.createElementVNode(
+              "span",
+              null,
+              vue.toDisplayString(_ctx.areaName),
+              1
+              /* TEXT */
+            )
+          ])) : vue.createCommentVNode("v-if", true),
+          !playSuccess.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, "\u65E0\u4FE1\u53F7")) : vue.createCommentVNode("v-if", true),
+          !playUrl.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3, "\u65E0\u64AD\u653E\u5730\u5740")) : vue.createCommentVNode("v-if", true),
           vue.createCommentVNode(" \u64AD\u653E\u5668\u5E95\u90E8\u64CD\u4F5C\u680F "),
           vue.renderSlot(_ctx.$slots, "customBar")
         ],
-        34
-        /* CLASS, NEED_HYDRATION */
+        2
+        /* CLASS */
       );
     };
   }