hy-dispatch-ui-v3 0.2.66 → 0.2.68

package/es/components/hyTree/js/index.mjs

@@ -21,9 +21,7 @@ const useAppTreeWrapper = (hy) => {
     // 用实例的 provides 链覆盖应用级 provides，才能拿到 ElConfigProvider 注入的 namespace
     provides: instance.provides
   } : null;
-  const permissionIdList = JSON.parse(
-    window.sessionStorage.getItem("permissionIdList") || "[]"
-  );
+  const permissionIdList = JSON.parse(window.sessionStorage.getItem("permissionIdList") || "[]");
   let virtualTree = null;
   const filterValue = ref("");
   const disableSelectionMap = ref(null);
@@ -32,10 +30,46 @@ const useAppTreeWrapper = (hy) => {
   const selectFilterType = ref(null);
   const selectFilterList = ref([]);
   const loading = ref(true);
+  const noTreeSelData = ref([]);
+  function getSelectedDataKey(data) {
+    if (!data) return void 0;
+    if (props.treeType === "device" || props.treeType === "channel") {
+      return data.channelId || data.deviceId;
+    }
+    if (props.treeType) {
+      return data.id;
+    }
+    return data[props.treeProps?.value];
+  }
+  function deleteNoTreeSelData(item) {
+    const index = hy.noTreeSelData.value.findIndex((v) => hy.getSelectedDataKey(v) === hy.getSelectedDataKey(item));
+    if (index !== -1) {
+      hy.noTreeSelData.value.splice(index, 1);
+    }
+  }
+  function updateNoTreeSelData(dataList) {
+    let selList = [];
+    if (props.treeType) {
+      selList = hy.virtualTree?.getCheckedBusinessNodes(true) || [];
+    } else {
+      selList = hy.virtualTree?.getCheckedNodes(true) || [];
+    }
+    const treeMap = /* @__PURE__ */ new Map();
+    selList.forEach((item) => {
+      const key = hy.getSelectedDataKey(item);
+      if (key) {
+        treeMap.set(key, true);
+      }
+    });
+    hy.noTreeSelData.value = dataList.filter((item) => !treeMap.get(hy.getSelectedDataKey(item)));
+  }
+  function mergeNoTreeSelData(dataList) {
+    return [...hy.noTreeSelData.value, ...dataList];
+  }
   watch(
     () => props.showCheckbox,
     (newVal) => {
-      virtualTree?.setRowSelection({
+      hy.virtualTree?.setRowSelection({
         type: props.showCheckbox ? "checkbox" : "radio"
       });
     }
@@ -44,43 +78,43 @@ const useAppTreeWrapper = (hy) => {
     return new Promise((resolve) => {
       hy.loading.value = true;
       if (props.disableSelection?.length) {
-        setDisAbleSelectionMap();
+        hy.setDisAbleSelectionMap();
       }
-      if (!virtualTree) {
-        virtualTree = new VirtualTree({
+      if (!hy.virtualTree) {
+        hy.virtualTree = new VirtualTree({
           // 指定容器
           container: treeRef.value,
           // 数据
           data: dataList,
           // 每一项的高度
-          itemHeight: 30,
+          // itemHeight: 30, // 使用全局配置
           // 可视区域外的缓冲项数量
-          bufferSize: 10,
+          // bufferSize: 10, // 使用全局配置
           // 相邻级节点间的水平缩进，单位为像素
-          indent: 16,
+          // indent: 16, // 使用全局配置
           emptyText: "\u6682\u65E0\u6570\u636E",
           // 树形业务类型
           business: props.treeType,
           // 自定义整体的插槽
-          renderItem: props.treeType === treeTypeConfig.user ? (data, node) => setUserSlot(data, node) : setSlot("treeParentSlot"),
+          renderItem: props.treeType === treeTypeConfig.user ? (data, node) => hy.setUserSlot(data, node) : props.treeType === treeTypeConfig.group ? (data, node) => hy.setGroupRenderItem(data, node) : hy.setSlot("treeParentSlot"),
           // // 自定义状态右侧插槽
           renderRight: (data) => {
-            let renderRight = setSlot("renderRight");
+            let renderRight = hy.setSlot("renderRight");
             if (renderRight) return renderRight(data);
             if (data.dataType === 1) {
-              let departmentRight = setSlot("departmentRight");
+              let departmentRight = hy.setSlot("departmentRight");
               if (departmentRight) {
                 return departmentRight(data);
               }
             }
             if (data.dataType === 3) {
-              let deviceOnlineRight = setSlot("deviceOnlineRight");
+              let deviceOnlineRight = hy.setSlot("deviceOnlineRight");
               if (deviceOnlineRight) {
                 return deviceOnlineRight(data);
               }
             }
             if ([11].includes(data.dataType)) {
-              let planGroupRight = setSlot("planGroupRight");
+              let planGroupRight = hy.setSlot("planGroupRight");
               if (planGroupRight) {
                 return planGroupRight(data);
               }
@@ -88,16 +122,16 @@ const useAppTreeWrapper = (hy) => {
             return true;
           },
           // // 自定义状态模块
-          renderStatus: props.treeType === treeTypeConfig.device || props.treeType === treeTypeConfig.channel ? (data) => setRenderStatus(data) : null,
+          renderStatus: props.treeType === treeTypeConfig.device || props.treeType === treeTypeConfig.channel ? (data) => hy.setRenderStatus(data) : null,
           // 暂无数据插槽
           renderEmpty: () => {
             if (!props.showCustomEmpty || hy.filterValue.value) return true;
-            let renderEmpty = setSlot("renderEmpty");
+            let renderEmpty = hy.setSlot("renderEmpty");
             if (renderEmpty) {
               const target = renderEmpty();
               return target.el;
             }
-            return setEmpty();
+            return hy.setEmpty();
           },
           props: {
             // 是否显示右侧业务状态
@@ -132,7 +166,6 @@ const useAppTreeWrapper = (hy) => {
             showSelectBox: props.showSelectBox,
             // 选中回调
             onCheckChange: (data, info, checked) => {
-              console.log("onCheckChange", info);
               if (data.dataType === 3 && !checked) {
                 emits("on-click-delete", JSON.parse(JSON.stringify(data)));
               } else if (data.dataType === 3) {
@@ -140,9 +173,7 @@ const useAppTreeWrapper = (hy) => {
               }
               emits(
                 "on-check-tree",
-                JSON.parse(
-                  JSON.stringify(info.checkedBusinessNodes || info.checkedNodes)
-                ),
+                JSON.parse(JSON.stringify(hy.mergeNoTreeSelData(info.checkedBusinessNodes || info.checkedNodes))),
                 {
                   data,
                   info,
@@ -219,9 +250,7 @@ const useAppTreeWrapper = (hy) => {
                   }
                 ]);
               } else {
-                const channelList = data.videoChannelList?.filter(
-                  (v) => v.onlineState === 1
-                );
+                const channelList = data.videoChannelList?.filter((v) => v.onlineState === 1);
                 if (channelList && channelList.length) {
                   emits(
                     "on-dblclick",
@@ -246,16 +275,16 @@ const useAppTreeWrapper = (hy) => {
             document.body.click();
           },
           onLoad: () => {
-            if (props.showOnlineOnly && !virtualTree._flattenTree?.length && !hy.filterValue.value) {
+            if (props.showOnlineOnly && !hy.virtualTree._flattenTree?.length && !hy.filterValue.value) {
               ElMessage.warning("\u6682\u65E0\u8BBE\u5907\u5904\u4E8E\u5728\u7EBF\u72B6\u6001");
             }
             if (props.defaultSelectedOrgID && props.showCheckbox && props.treeType === "device") {
-              setSelectedOrg(dataList);
+              hy.setSelectedOrg(dataList);
             } else if (props.selectedByDefault?.length) {
-              setCheckedKeys(props.selectedByDefault);
+              hy.setCheckedKeys(props.selectedByDefault);
             }
             if (hy.filterValue.value) {
-              getFilterValue();
+              hy.getFilterValue();
             }
             setTimeout(() => {
               hy.loading.value = false;
@@ -264,7 +293,7 @@ const useAppTreeWrapper = (hy) => {
           }
         });
       } else {
-        virtualTree.setData(
+        hy.virtualTree.setData(
           {
             data: dataList,
             businessConfig: {
@@ -274,11 +303,11 @@ const useAppTreeWrapper = (hy) => {
             }
           },
           () => {
-            if (props.showOnlineOnly && !virtualTree._flattenTree?.length && !hy.filterValue.value) {
+            if (props.showOnlineOnly && !hy.virtualTree._flattenTree?.length && !hy.filterValue.value) {
               ElMessage.success("\u6682\u65E0\u8BBE\u5907\u5904\u4E8E\u5728\u7EBF\u72B6\u6001");
             }
             if (hy.filterValue.value) {
-              getFilterValue();
+              hy.getFilterValue();
             }
             setTimeout(() => {
               hy.loading.value = false;
@@ -316,7 +345,7 @@ const useAppTreeWrapper = (hy) => {
     return content;
   }
   function getFilterValue() {
-    virtualTree.filter({ filterValue: hy.filterValue.value }, false);
+    hy.virtualTree.filter({ filterValue: hy.filterValue.value }, false);
   }
   function setDisAbleSelectionMap() {
     const map = /* @__PURE__ */ new Map();
@@ -330,7 +359,7 @@ const useAppTreeWrapper = (hy) => {
     emits("on-refreshData");
   }
   function setRenderStatus(data) {
-    const slot = setSlot("renderStatus");
+    const slot = hy.setSlot("renderStatus");
     if (slot) {
       return slot(data);
     }
@@ -360,22 +389,24 @@ const useAppTreeWrapper = (hy) => {
   }
   function setUserSlot(data) {
     if (data.dataType === 1) {
-      const slot2 = setSlot("treeParentSlot");
+      const slot2 = hy.setSlot("treeParentSlot");
       if (slot2) {
         return slot2(data);
       }
       return true;
     }
-    const slot = setSlot("treeSelectedSlot");
+    const slot = hy.setSlot("treeSelectedSlot");
     if (slot) {
       return slot(data);
     }
     return true;
   }
   function setGroupRenderItem(data, node) {
-    const slot = setSlot("treeParentSlot");
-    if (slot) {
-      return slot(data, node);
+    if (data.dataType === 4) {
+      const slot = hy.setSlot("treeGroupSlot");
+      if (slot) {
+        return slot(data, node);
+      }
     }
     return true;
   }
@@ -420,87 +451,86 @@ const useAppTreeWrapper = (hy) => {
     emits("on-addDevice");
   }
   function setDeviceStatus(payload) {
-    virtualTree?.updateData([payload]);
+    hy.virtualTree?.updateData([payload]);
   }
   function singleRemovalFn(row, isForce = false) {
     if (props.treeType === "device" || props.treeType === "channel") {
-      virtualTree.setChecked(row.channelId || row.deviceId, false, true);
+      hy.virtualTree.setChecked(row.channelId || row.deviceId, false, true);
     } else if (props.treeType) {
-      virtualTree.setChecked(row.id, false, true, isForce);
+      hy.virtualTree.setChecked(row.id, false, true, isForce);
     } else if (!props.treeType && props.treeProps) {
-      virtualTree.setChecked(
-        row[`${props.treeProps.value}`],
-        false,
-        true,
-        isForce
-      );
+      hy.virtualTree.setChecked(row[`${props.treeProps.value}`], false, true, isForce);
     }
+    hy.deleteNoTreeSelData(row);
   }
   function setCheckedKeys(dataList, isForce = false) {
     if (props.treeType === "device" || props.treeType === "channel") {
-      virtualTree?.setCheckedKeys(
+      hy.virtualTree?.setCheckedKeys(
         dataList.map((v) => v.channelId || v.deviceId),
         true,
         isForce
       );
     } else if (props.treeType) {
-      virtualTree?.setCheckedKeys(
+      hy.virtualTree?.setCheckedKeys(
         dataList.map((v) => v.id),
         true,
         isForce
       );
     } else if (!props.treeType && props.treeProps) {
-      console.log(
-        "\u9009\u4E2D\u56DE\u8C03",
-        dataList.map((v) => v[`${props.treeProps.value}`])
-      );
-      virtualTree?.setCheckedKeys(
+      hy.virtualTree?.setCheckedKeys(
         dataList.map((v) => v[`${props.treeProps.value}`]),
         false,
         isForce
       );
     }
+    hy.updateNoTreeSelData(dataList);
     if (props.isBackDefaultSelected) {
       setTimeout(() => {
-        const deviceList = virtualTree?.getCheckedBusinessNodes(true) || [];
-        emits("on-selectedDataList", deviceList);
+        let deviceList = [];
+        if (props.treeType) {
+          deviceList = hy.virtualTree?.getCheckedBusinessNodes(true) || [];
+        } else {
+          deviceList = hy.virtualTree?.getCheckedNodes(true) || [];
+        }
+        emits("on-selectedDataList", hy.mergeNoTreeSelData(deviceList));
       });
     }
   }
   function setChecked(data, type = true) {
     if (props.treeType === "device") {
-      virtualTree?.setChecked(data.channelId || data.deviceId, type, true);
+      hy.virtualTree?.setChecked(data.channelId || data.deviceId, type, true);
     } else if (props.treeType) {
-      virtualTree?.setChecked(data.id, type, true);
+      hy.virtualTree?.setChecked(data.id, type, true);
     } else if (!props.treeType && props.treeProps) {
-      virtualTree?.setChecked(data[`${props.treeProps.value}`], type, false);
+      hy.virtualTree?.setChecked(data[`${props.treeProps.value}`], type, false);
+    }
+    if (!type) {
+      hy.deleteNoTreeSelData(data);
     }
   }
   function setSelectedOrg(deviceList) {
     for (let i = 0; i < deviceList.length; i++) {
       if (props.defaultSelectedOrgID === deviceList[i].id) {
         if (deviceList[i].deviceList?.length) {
-          setCheckedKeys(deviceList[i].deviceList);
+          hy.setCheckedKeys(deviceList[i].deviceList);
         }
         return true;
       }
       if (deviceList[i].children?.length) {
-        const org = setSelectedOrg(deviceList[i].children);
+        const org = hy.setSelectedOrg(deviceList[i].children);
         if (org) return true;
       }
     }
   }
   function getSelectedDataList(leafOnly = false) {
     if (props.treeType) {
-      return virtualTree?.getCheckedBusinessNodes(leafOnly) || [];
+      return hy.mergeNoTreeSelData(hy.virtualTree?.getCheckedBusinessNodes(leafOnly) || []);
     }
-    return virtualTree?.getCheckedNodes(leafOnly) || [];
+    return hy.mergeNoTreeSelData(hy.virtualTree?.getCheckedNodes(leafOnly) || []);
   }
   function setFilterListType(type) {
     if (props.selectFilterList?.length) {
-      hy.selectFilterList.value = JSON.parse(
-        JSON.stringify(props.selectFilterList)
-      );
+      hy.selectFilterList.value = JSON.parse(JSON.stringify(props.selectFilterList));
       return;
     }
     if (props.treeType === "device") {
@@ -542,9 +572,7 @@ const useAppTreeWrapper = (hy) => {
     }
   }
   const getInputPlaceholder = computed(() => {
-    const item = hy.selectFilterList.value.find(
-      (v) => v.value === hy.selectFilterType.value
-    );
+    const item = hy.selectFilterList.value.find((v) => v.value === hy.selectFilterType.value);
     if (item && item.placeholder) {
       return item.placeholder;
     }
@@ -556,7 +584,7 @@ const useAppTreeWrapper = (hy) => {
     }
   }
   function getNode(id) {
-    return virtualTree.getNode(id);
+    return hy.virtualTree.getNode(id);
   }
   return {
     filterValue,
@@ -564,6 +592,7 @@ const useAppTreeWrapper = (hy) => {
     permissionIdList,
     disableSelectionMap,
     addDeviceDom,
+    setDisAbleSelectionMap,
     getData,
     getFilterValue,
     refreshData,
@@ -571,6 +600,11 @@ const useAppTreeWrapper = (hy) => {
     setCheckedKeys,
     setChecked,
     setFilterListType,
+    setSelectedOrg,
+    setUserSlot,
+    setSlot,
+    setRenderStatus,
+    setEmpty,
     getInputPlaceholder,
     onChange,
     selectFilterList,
@@ -578,7 +612,14 @@ const useAppTreeWrapper = (hy) => {
     selectedDataList,
     getSelectedDataList,
     loading,
-    getNode
+    getNode,
+    noTreeSelData,
+    updateNoTreeSelData,
+    mergeNoTreeSelData,
+    getSelectedDataKey,
+    deleteNoTreeSelData,
+    setDeviceStatus,
+    setGroupRenderItem
   };
 };
 function filterNodeMethod(data, value, { selectFilterType, treeFilterParam = [], treeType }) {

package/es/components/hyTree/style/index.css

@@ -1 +1 @@
-@import url('hy-virtual-tree/style');
+@import url('hy-virtual-tree/style');

package/es/components/hyTree/tree.vue.mjs

@@ -116,7 +116,7 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
     // 是否高亮选中节点
     highlight: {
       type: Boolean,
-      default: false
+      default: true
     },
     // 是否严格的遵循父子不互相关联
     checkStrictly: {
@@ -202,7 +202,8 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
       onChange,
       getSelectedDataList,
       loading,
-      getNode
+      getNode,
+      setDeviceStatus
     } = useMixins(
       {
         props,
@@ -225,14 +226,15 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
       setChecked,
       getSelectedDataList,
       refreshData,
-      getNode
+      getNode,
+      setDeviceStatus
     });
     return (_ctx, _cache) => {
       const _directive_loading = resolveDirective("loading");
       return openBlock(), createElementBlock(
         "div",
         {
-          class: "w-full flex flex-col",
+          class: "w-full flex flex-col box-border",
           style: normalizeStyle({ height: `${__props.treeHeight}px` })
         },
         [
@@ -245,7 +247,7 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
               "show-after": 500
             }, {
               default: withCtx(() => [
-                createElementVNode("div", { class: "search_lightColor flex min-w-full z-[3]" }, [
+                createElementVNode("div", { class: "search_lightColor flex min-w-full z-[3] box-border" }, [
                   createVNode(unref(ElInput), {
                     size: "small",
                     clearable: "",
@@ -282,7 +284,7 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
               placement: "bottom-start"
             }, {
               default: withCtx(() => [
-                createElementVNode("div", { class: "flex search_lightColor w-full" }, [
+                createElementVNode("div", { class: "flex search_lightColor w-full box-border" }, [
                   createElementVNode("div", { class: "flex flex-grow w-0" }, [
                     createVNode(unref(ElSelect), {
                       class: "!w-[37%] box-border rounded-[6px] flex-shrink-0",
@@ -335,18 +337,19 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
             }, 8, ["content"])
           ])) : createCommentVNode("v-if", true),
           renderSlot(_ctx.$slots, "input-bottom"),
-          withDirectives(createElementVNode(
-            "div",
-            {
-              ref_key: "treeRef",
-              ref: treeRef,
-              style: { "width": "100%" },
-              class: "flex-grow h-0 w-full"
-            },
-            null,
-            512
-            /* NEED_PATCH */
-          ), [
+          withDirectives((openBlock(), createElementBlock("div", { class: "flex-grow h-0 w-full px-[10px] box-border" }, [
+            createElementVNode(
+              "div",
+              {
+                ref_key: "treeRef",
+                ref: treeRef,
+                class: "w-full h-full"
+              },
+              null,
+              512
+              /* NEED_PATCH */
+            )
+          ])), [
             [_directive_loading, unref(loading)]
           ])
         ],

package/es/components/hyUserAvatar/userAvatar.vue.mjs

@@ -2,9 +2,9 @@ import { defineComponent, computed, unref, openBlock, createElementBlock, normal
 import '../../utils/index.mjs';
 import '../../hooks/index.mjs';
 import '../index.mjs';
-import { useLocale } from '../../hooks/useLocale.mjs';
 import { useUserAvatarMap } from '../../hooks/useUserAvatarMap.mjs';
 import { pxTorem } from '../../utils/adaptive.mjs';
+import { $t } from '../../hooks/useLocale.mjs';
 import { HyIcon } from '../hyIcon/index.mjs';
 
 import "./style/userAvatar.scss";
@@ -57,7 +57,6 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
   setup(__props, { emit: __emit }) {
     const props = __props;
     const emits = __emit;
-    const { t } = useLocale();
     const { userAvatarMap } = useUserAvatarMap();
     const isGbDevice = computed(
       () => props.device?.gbDevice === 1 && (props.device?.deviceType || props.device?.type) !== 13
@@ -107,7 +106,7 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
             headImg.value ? (openBlock(), createElementBlock("img", {
               key: 0,
               src: headImg.value,
-              alt: unref(t)("userAvatar.userAvatar")
+              alt: unref($t)("userAvatar.userAvatar")
             }, null, 8, ["src", "alt"])) : __props.device?.onlineState === 1 ? (openBlock(), createBlock(unref(HyIcon), {
               key: 1,
               "svg-name": __props.initSelectSvgName,
@@ -122,9 +121,7 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
             "span",
             {
               key: 2,
-              class: normalizeClass(
-                __props.device?.onlineState === 1 ? "bg-success shadow-[0_0_4px_0] shadow-success" : "bg-info"
-              )
+              class: normalizeClass(__props.device?.onlineState === 1 ? "bg-success shadow-[0_0_4px_0] shadow-success" : "bg-info")
             },
             null,
             2

package/es/components/hyVideoPlayer/js/index.mjs

@@ -4,8 +4,8 @@ import 'dayjs';
 import '../../../hooks/index.mjs';
 import '../../../utils/index.mjs';
 import '../../index.mjs';
-import { useLocale } from '../../../hooks/useLocale.mjs';
 import { useVideoPlayerConfig } from '../../../hooks/useVideoPlayerConfig.mjs';
+import { $t } from '../../../hooks/useLocale.mjs';
 import { formatDuration } from '../../../utils/date.mjs';
 import { isSupportH265 } from '../../../utils/is.mjs';
 import { HyConfirmDialog } from '../../hyConfirmDialog/index.mjs';
@@ -13,7 +13,6 @@ import { copyText } from '../../../utils/handler.mjs';
 
 const useVideoPlayer = (hy) => {
   const { props, emits, videoRef, videoWrapperRef } = hy;
-  const { t } = useLocale();
   const { videoPlayerConfig } = useVideoPlayerConfig();
   const speed = ref(1);
   const playRules = ref(1);
@@ -39,17 +38,17 @@ const useVideoPlayer = (hy) => {
   const playRulesList = [
     {
       value: 1,
-      label: t("videoPlayer.stopAfterPlayback"),
+      label: $t("videoPlayer.stopAfterPlayback"),
       svgName: "ops-audio-media-center-stop-playing"
     },
     {
       value: 2,
-      label: t("videoPlayer.continuousPlayback"),
+      label: $t("videoPlayer.continuousPlayback"),
       svgName: "ops-audio-media-center-autoplay"
     },
     {
       value: 3,
-      label: t("videoPlayer.loopPlayback"),
+      label: $t("videoPlayer.loopPlayback"),
       svgName: "ops-audio-media-center-loop-playback"
     }
   ];
@@ -58,7 +57,7 @@ const useVideoPlayer = (hy) => {
   });
   const speedLabel = computed(() => {
     if (speed.value === 1) {
-      return t("videoPlayer.multiples");
+      return $t("videoPlayer.multiples");
     } else {
       return speedList.find((item) => item.value === speed.value).label;
     }
@@ -188,15 +187,13 @@ const useVideoPlayer = (hy) => {
   }
   function playPrevious() {
     if (props.type === "default") {
-      const index = props.playList.findIndex(
-        (item) => item.id === videoItem.value.id
-      );
+      const index = props.playList.findIndex((item) => item.id === videoItem.value.id);
       if (index > 0 && index !== props.playList.length) {
         const item = props.playList[index - 1];
         playVideo(item.filePath, item);
         emits("play-previous");
       } else {
-        ElMessage.warning(t("videoPlayer.currentIsTheFirstItem"));
+        ElMessage.warning($t("videoPlayer.currentIsTheFirstItem"));
       }
     } else if (isAnalyseType.value) {
       if (!isCanPlay.value) return;
@@ -205,15 +202,13 @@ const useVideoPlayer = (hy) => {
   }
   function playNext() {
     if (props.type === "default") {
-      const index = props.playList.findIndex(
-        (item) => item.id === videoItem.value.id
-      );
+      const index = props.playList.findIndex((item) => item.id === videoItem.value.id);
       if (index !== props.playList.length - 1) {
         const item = props.playList[index + 1];
         playVideo(item.filePath, item);
         emits("play-next");
       } else {
-        ElMessage.warning(t("videoPlayer.currentIsTheLastItem"));
+        ElMessage.warning($t("videoPlayer.currentIsTheLastItem"));
       }
     } else if (isAnalyseType.value) {
       if (!isCanPlay.value) return;
@@ -318,14 +313,12 @@ const useVideoPlayer = (hy) => {
     const url = `${props.vlcProtocol}:${videoUrl.value}`;
     window.protocolCheck(url, () => {
       hasVLC.value = false;
-      ElMessage.error(t("videoPlayer.notInstallVlcTips"));
+      ElMessage.error($t("videoPlayer.notInstallVlcTips"));
     });
   }
   function downloadVLC() {
     if (!props.vlcAddress) {
-      ElMessage.warning(
-        t("videoPlayer.pleaseConfigureTheAddressForDownloadingVLC")
-      );
+      ElMessage.warning($t("videoPlayer.pleaseConfigureTheAddressForDownloadingVLC"));
       return;
     }
     const newOpenWindow = window.open("about:blank");
@@ -333,16 +326,14 @@ const useVideoPlayer = (hy) => {
       newOpenWindow.location = props.vlcAddress;
     }
     if (newOpenWindow) {
-      ElMessage.success(t("videoPlayer.operationSuccessful"));
+      ElMessage.success($t("videoPlayer.operationSuccessful"));
     } else {
       HyConfirmDialog.confirm({
         title: "\u8DF3\u8F6C\u63D0\u793A",
-        content: `<div><p>${t(
-          "videoPlayer.theCurrentBrowserBlocksTheOpeningOfNewWindows"
-        )}</p><p>${t(
+        content: `<div><p>${t("videoPlayer.theCurrentBrowserBlocksTheOpeningOfNewWindows")}</p><p>${t(
           "videoPlayer.pleaseGoToTheBrowserSettingsAndClickOnTheDownloadOrCopyLinkToOpenInTheBrowser"
         )}</p></div>`,
-        submitText: t("videoPlayer.copyLink"),
+        submitText: $t("videoPlayer.copyLink"),
         onSubmit: async () => {
           await copyText(props.vlcAddress);
         }