diff --git a/src/views/abnormalAlarm/serverMonitor/instances/cpu.vue b/src/views/abnormalAlarm/serverMonitor/instances/cpu.vue
index d427ff0..f3ef1bd 100644
--- a/src/views/abnormalAlarm/serverMonitor/instances/cpu.vue
+++ b/src/views/abnormalAlarm/serverMonitor/instances/cpu.vue
@@ -31,7 +31,7 @@
         <a-col flex="265px">
           <a-range-picker
             :show-time="true"
-            :default-value="[moment(queryParams.startDate), moment(queryParams.endDate)]"
+            :value="[moment(queryParams.startDate), moment(queryParams.endDate)]"
             @change="onRangeDateChange" 
           />
         </a-col>
@@ -152,15 +152,16 @@ export default {
       currLabel:"",
       queryParams: {
         server: undefined,
-        timer: "1h",
+        timer: 1,
         startDate: dateFormat(new Date(), 'yyyy-MM-dd hh:mm:ss'),
         endDate: dateFormat(new Date(), 'yyyy-MM-dd hh:mm:ss')
       },
       serverOptions: [],
       timerOptions: [
-        {label: "1Hours",value: "1h"},
-        {label: "2Hours",value: "2h"},
-        {label: "3Hours",value: "3h"},
+        {label: "1Hours",value: 1},
+        {label: "2Hours",value: 2},
+        {label: "3Hours",value: 3},
+        {label: "user-defined",value: 0},
       ],
       option1:{},
       option2:{},
@@ -179,6 +180,9 @@ export default {
       modalTitle: "",
     }
   },
+  created() {
+    this.getBeforeHours(1)
+  },
   mounted() {
     this.getServerList()
     this.$nextTick(() => {
@@ -191,6 +195,12 @@ export default {
     })
   },
   methods: {
+    getBeforeHours(num) {
+      let currentTime = moment()
+      let oneHourAgo = moment().subtract(num, 'hours');  
+      this.queryParams.startDate = oneHourAgo.format('YYYY-MM-DD HH:mm:ss')
+      this.queryParams.endDate = currentTime.format('YYYY-MM-DD HH:mm:ss')
+    },
     createAlertRules() {
       this.visible_rule = true
     },
@@ -249,9 +259,10 @@ export default {
       this.currLabel = val.label
     },
     onTimeChange(val) {
-      console.log(val);
+      this.getBeforeHours(val)
     },
     onRangeDateChange(date, dateString) {
+      this.queryParams.timer = 0
       this.queryParams.startDate = dateString[0]
       this.queryParams.endDate = dateString[1]
     },
diff --git a/src/views/abnormalAlarm/serverMonitor/instances/monitor.vue b/src/views/abnormalAlarm/serverMonitor/instances/monitor.vue
index 6ba8047..4e6e641 100644
--- a/src/views/abnormalAlarm/serverMonitor/instances/monitor.vue
+++ b/src/views/abnormalAlarm/serverMonitor/instances/monitor.vue
@@ -31,7 +31,7 @@
         <a-col flex="265px">
           <a-range-picker
             :show-time="true"
-            :default-value="[moment(queryParams.startDate), moment(queryParams.endDate)]"
+            :value="[moment(queryParams.startDate), moment(queryParams.endDate)]"
             @change="onRangeDateChange" 
           />
         </a-col>
@@ -183,15 +183,16 @@ export default {
       currLabel:"",
       queryParams: {
         server: undefined,
-        timer: "1h",
-        startDate: dateFormat(new Date(), 'yyyy-MM-dd'),
-        endDate: dateFormat(new Date(), 'yyyy-MM-dd')
+        timer: 1,
+        startDate: dateFormat(new Date(), 'yyyy-MM-dd hh:mm:ss'),
+        endDate: dateFormat(new Date(), 'yyyy-MM-dd hh:mm:ss')
       },
       serverOptions: [],
       timerOptions: [
-        {label: "1Hours",value: "1h"},
-        {label: "2Hours",value: "2h"},
-        {label: "3Hours",value: "3h"},
+        {label: "1Hours",value: 1},
+        {label: "2Hours",value: 2},
+        {label: "3Hours",value: 3},
+        {label: "user-defined",value: 0},
       ],
       data1: [
         {
@@ -280,10 +281,19 @@ export default {
       myLine: null
     }
   },
+  created() {
+    this.getBeforeHours(1)
+  },
   mounted() {
     this.getServerList()
   },
   methods: {
+    getBeforeHours(num) {
+      let currentTime = moment()
+      let oneHourAgo = moment().subtract(num, 'hours');  
+      this.queryParams.startDate = oneHourAgo.format('YYYY-MM-DD HH:mm:ss')
+      this.queryParams.endDate = currentTime.format('YYYY-MM-DD HH:mm:ss')
+    },
     createAlertRules() {
       this.visible_rule = true
     },
@@ -343,8 +353,10 @@ export default {
     },
     onTimeChange(val) {
       console.log(val);
+      this.getBeforeHours(val)
     },
     onRangeDateChange(date, dateString) {
+      this.queryParams.timer = 0
       this.queryParams.startDate = dateString[0]
       this.queryParams.endDate = dateString[1]
     },