vue项目引用海康视频插件(web1.5)，el-date-picker下拉选择时间面板会被遮盖问题解决。

yb305小白

于 2023-01-17 12:17:26 发布

阅读量2.7k

点赞数 1

分类专栏： Element-UI vue 文章标签：前端

本文链接：https://blog.youkuaiyun.com/yb305/article/details/128714221

版权

vue 同时被 2 个专栏收录

24 篇文章

订阅专栏

Element-UI

8 篇文章

订阅专栏

文章描述了一个在使用海康插件时遇到的问题，即插件浮窗层级过高，遮挡了项目中的时间选择面板。为了解决这个问题，作者提出了一个方法，通过调用API中的JS_CuttingPartWindow方法在时间控件获取焦点时裁剪插件窗口，然后在失去焦点时使用JS_RepairPartWindow方法恢复，避免了重新初始化插件的需要。这种方法提供了一种有效且不影响插件功能的解决方案。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、海康插件浮窗的层级，会把项目中时间控件中的时间选择面板挡住，导致时间面板显示不全，无法选择时间。如图所示：

二、解决办法：调用API中的JS_JS_CuttingPartWindow(iLeft, iTop, iWidth, iHeight )方法，

<el-date-picker
v-model="startTimeStamp"
type="datetime"
placeholder="选择日期时间"
size="small"
style="width:182px"
format="yyyy-MM-dd HH:mm:ss"
value-format="yyyy-MM-dd HH:mm:ss"
@focus="startTimeFocus"
@blur="startTimeBlur"
>
</el-date-picker>

 startTimeFocus() {
      if (this.oWebControl) {
        this.oWebControl.JS_CuttingPartWindow(0, 98, 134, 435);
      }
    },
startTimeBlur() {
   if (this.oWebControl) {
    this.oWebControl.JS_RepairPartWindow(0, 98, 134, 435);
  }
}

三、效果图