diff --git a/frontend/src/components/widget/DeWidget/DeShowDate.vue b/frontend/src/components/widget/DeWidget/DeShowDate.vue
index 6b95c13419..5b71e6a3d5 100644
--- a/frontend/src/components/widget/DeWidget/DeShowDate.vue
+++ b/frontend/src/components/widget/DeWidget/DeShowDate.vue
@@ -1,12 +1,12 @@
 <template>
   <div style="height: 100%">
-    <time-default v-if="element.formatInfo.openMode === '0'" :ref="element.id" :element="element" />
+    <time-default v-if="element.formatInfo.openMode === '0'"  :ref="element.id" :element="element" />
 
-    <time-elec v-if="element.formatInfo.openMode === '1'" :ref="element.id" :element="element" />
+    <time-elec v-if="element.formatInfo.openMode === '1'"  :ref="element.id" :element="element" />
 
-    <time-simple v-if="element.formatInfo.openMode === '2'" :ref="element.id" :element="element" />
+    <time-simple v-if="element.formatInfo.openMode === '2'"  :ref="element.id" :element="element" />
 
-    <time-complex v-if="element.formatInfo.openMode === '3'" :ref="element.id" :element="element" />
+    <time-complex v-if="element.formatInfo.openMode === '3'"  :ref="element.id" :element="element" />
   </div>
 </template>
 
diff --git a/frontend/src/components/widget/DeWidget/TimeComplex.vue b/frontend/src/components/widget/DeWidget/TimeComplex.vue
index 62179bac4d..e7b95c1346 100644
--- a/frontend/src/components/widget/DeWidget/TimeComplex.vue
+++ b/frontend/src/components/widget/DeWidget/TimeComplex.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <canvas id="canvas" width="500" height="500" />
+    <canvas :id="'complex_canvas'+element.id" width="500" height="500" />
   </div>
 </template>
 
@@ -30,7 +30,7 @@ export default {
     }
   },
   mounted() {
-    this.canvas = document.getElementById('canvas')
+    this.canvas = document.getElementById('complex_canvas' + this.element.id)
     this.initCtx()
     this.initCtxBack()
     this.initNumBack()
diff --git a/frontend/src/components/widget/DeWidget/TimeSimple.vue b/frontend/src/components/widget/DeWidget/TimeSimple.vue
index a611e1b67f..260d6a25bc 100644
--- a/frontend/src/components/widget/DeWidget/TimeSimple.vue
+++ b/frontend/src/components/widget/DeWidget/TimeSimple.vue
@@ -2,7 +2,7 @@
   <div :style="{ 'height': containerHeight}">
     <div ref="canvasContainer" class="time-s-class" style="height: calc(100% - 50px);" :style="{'margin':timeMargin +'px'}">
       <canvas
-        id="canvas"
+        :id="'simple-canvas'+element.id"
         class="de-canvas"
         :width="canvas_width"
         :height="canvas_height"
@@ -47,7 +47,7 @@ export default {
     }
   },
   mounted() {
-    this.canvas = document.getElementById('canvas')
+    this.canvas = document.getElementById('simple-canvas' + this.element.id)
     this.draw = this.canvas.getContext('2d')
     this.canvas_width = this.element.style.width
     this.canvas_height = this.element.style.height
diff --git a/frontend/src/views/panel/SubjectSetting/index.vue b/frontend/src/views/panel/SubjectSetting/index.vue
index 2df60a5c4d..ac7bca73a1 100644
--- a/frontend/src/views/panel/SubjectSetting/index.vue
+++ b/frontend/src/views/panel/SubjectSetting/index.vue
@@ -1,7 +1,7 @@
 <template>
   <el-row class="slider-container">
     <div
-      style="height: 40px; line-height: 40px; padding-left: 15px; text-align: left; white-space: pre; text-overflow: ellipsis; left: 0px; right: 0px; top: 0px; font-weight: 700"
+      style="height: 40px; padding-left: 15px; text-align: left; white-space: pre; text-overflow: ellipsis; left: 0px; right: 0px; top: 0px; font-weight: 700"
     >
       {{ $t('panel.dashboard_theme') }}
     </div>