diff --git a/src/designer/viewWidgets/IWidgets.js b/src/designer/viewWidgets/IWidgets.js
deleted file mode 100644
index 31ce61d..0000000
--- a/src/designer/viewWidgets/IWidgets.js
+++ /dev/null
@@ -1,10 +0,0 @@
-import { renderIcon } from '@/utils/webutils.js'
-
-export default {
-  methods: {
-    renderIcon,
-    closeMe() {
-      this.$emit('close')
-    }
-  }
-}
\ No newline at end of file
diff --git a/src/designer/viewWidgets/IWidgets.ts b/src/designer/viewWidgets/IWidgets.ts
new file mode 100644
index 0000000..59486c8
--- /dev/null
+++ b/src/designer/viewWidgets/IWidgets.ts
@@ -0,0 +1,31 @@
+import { defineComponent } from 'vue'
+import { renderIcon } from '@/utils/webutils.js'
+
+export type IWidgetData = {
+  /**
+   * 是否激活
+   */
+  isActivated: boolean
+}
+
+export default defineComponent({
+  activated() {
+    this.isActivated = true
+    console.log('activated', this.$.type.name)
+  },
+  deactivated() {
+    this.isActivated = false
+  },
+  emits: ['close'],
+  data() {
+    return {
+      isActivated: false
+    } as IWidgetData
+  },
+  methods: {
+    renderIcon,
+    closeMe() {
+      this.$emit('close')
+    }
+  }
+})
\ No newline at end of file
diff --git a/src/designer/viewWidgets/alarm/AlarmView.vue b/src/designer/viewWidgets/alarm/AlarmView.vue
index 0163ca9..daa9431 100644
--- a/src/designer/viewWidgets/alarm/AlarmView.vue
+++ b/src/designer/viewWidgets/alarm/AlarmView.vue
@@ -59,6 +59,7 @@ import IWidgets from '../IWidgets.js'
 
 export default {
   name: 'AlarmView',
+  webSocketSubscribe: ['alarm'],
   emits: ['close'],
   mixins: [IWidgets],
   data() {
diff --git a/src/designer/viewWidgets/logger/LoggerView.vue b/src/designer/viewWidgets/logger/LoggerView.vue
index 2505a37..78a4a65 100644
--- a/src/designer/viewWidgets/logger/LoggerView.vue
+++ b/src/designer/viewWidgets/logger/LoggerView.vue
@@ -58,6 +58,7 @@ import IWidgets from '../IWidgets.js'
 
 export default {
   name: 'LoggerView',
+  webSocketSubscribe: ['logs'],
   mixins: [IWidgets],
   data() {
     return {
diff --git a/src/designer/viewWidgets/modeltree/ModeltreeViewJs.js b/src/designer/viewWidgets/modeltree/ModeltreeViewJs.js
index 6f9d022..0104c9c 100644
--- a/src/designer/viewWidgets/modeltree/ModeltreeViewJs.js
+++ b/src/designer/viewWidgets/modeltree/ModeltreeViewJs.js
@@ -1,7 +1,9 @@
+import { defineComponent } from 'vue'
 import { renderIcon } from '@/utils/webutils.js'
 import IWidgets from '../IWidgets.js'
 
-export default {
+
+export default defineComponent({
   name: 'ModeltreeView',
   mixins: [IWidgets],
   data() {
@@ -36,7 +38,7 @@ export default {
       return designer.allLevels
     }
   }
-}
+})
 
 const data = [
   {
diff --git a/src/designer/viewWidgets/monitor/MonitorView.vue b/src/designer/viewWidgets/monitor/MonitorView.vue
index d3b09e9..d5356db 100644
--- a/src/designer/viewWidgets/monitor/MonitorView.vue
+++ b/src/designer/viewWidgets/monitor/MonitorView.vue
@@ -6,7 +6,7 @@
         <component :is="renderIcon('element Search')"></component>
       </template>
     </el-input>
-    <span class="close" @click="closeMe('hideLeft')">
+    <span class="close" @click="closeMe">
       <component :is="renderIcon('element Close')" />
     </span>
   </div>
@@ -58,6 +58,7 @@ import IWidgets from '../IWidgets.js'
 
 export default {
   name: 'MonitorView',
+  webSocketSubscribe: ['deviceStatus'],
   mixins: [IWidgets],
   data() {
     return {
diff --git a/src/designer/viewWidgets/task/TaskView.vue b/src/designer/viewWidgets/task/TaskView.vue
index 20c7041..6d8e331 100644
--- a/src/designer/viewWidgets/task/TaskView.vue
+++ b/src/designer/viewWidgets/task/TaskView.vue
@@ -38,6 +38,7 @@ import IWidgets from '../IWidgets.js'
 
 export default {
   name: 'TaskView',
+  webSocketSubscribe: ['task'],
   mixins: [IWidgets],
   data() {
     return {