From 387952c9c50b578e8779eb10be36359f5d7fce8f Mon Sep 17 00:00:00 2001
From: Wangxin <wangxin@icanag.com>
Date: Sat, 8 Nov 2025 21:03:00 +0800
Subject: [PATCH] =?UTF-8?q?=E3=80=90web=E3=80=91=20=E4=BF=A1=E6=81=AF?=
 =?UTF-8?q?=E9=87=87=E9=9B=86=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../views/device/deviceInformation/index.vue  | 175 +++++++++++-------
 .../inMonitoring/devicesState/detail.vue      |   4 +-
 2 files changed, 110 insertions(+), 69 deletions(-)

diff --git a/ALOps_sys_fe/alops-ui/src/views/device/deviceInformation/index.vue b/ALOps_sys_fe/alops-ui/src/views/device/deviceInformation/index.vue
index 122987d8..cf700599 100644
--- a/ALOps_sys_fe/alops-ui/src/views/device/deviceInformation/index.vue
+++ b/ALOps_sys_fe/alops-ui/src/views/device/deviceInformation/index.vue
@@ -19,22 +19,31 @@
 
               <el-row v-if="queryParams.ruleType == 0">
                 <el-col :span="24">
-                  <el-form-item label="采集频率" prop="frequency">
+                  <el-form-item label="采集间隔" prop="frequency">
                     <el-input-number v-model="queryParams.frequency" controls-position="right" :min="1"></el-input-number>
                   </el-form-item>
                 </el-col>
                 <el-col :span="24">
-                  <el-form-item label="采集时间限制" prop="dateRange">
+                  <el-form-item label="采集时间限制">
                     <el-date-picker
-                      v-model="queryParams.dateRange"
-                      @change="handleDateRangeChange"
+                      v-model="queryParams.startTime"
+                      @change="handleStartTimeChange"
                       value-format="yyyy-MM-dd HH:mm:ss"
-                      type="datetimerange"
-                      range-separator="至"
-                      start-placeholder="开始日期"
-                      end-placeholder="结束日期"
+                      type="datetime"
+                      placeholder="开始日期"
+                      :required="true"
                       :picker-options="{ disabledDate: disablePastDate }"
-                      >
+                    >
+                    </el-date-picker>
+                    <span style="margin: 0 10px;">至</span>
+                    <el-date-picker
+                      v-model="queryParams.endTime"
+                      @change="handleEndTimeChange"
+                      value-format="yyyy-MM-dd HH:mm:ss"
+                      type="datetime"
+                      placeholder="结束日期"
+                      :picker-options="endDatePickerOptions"
+                    >
                     </el-date-picker>
                   </el-form-item>
                 </el-col>
@@ -78,44 +87,49 @@ export default {
   name: "User",
   components: { Treeselect, Splitpanes, Pane },
   data() {
-    return {
-      // 开启定时方式
-      radio: 1,
-      // 遮罩层
-      loading: true,
-      // 选中数组
-      ids: [],
-      // 非单个禁用
-      single: true,
-      // 非多个禁用
-      multiple: true,
-      // 显示搜索条件
-      showSearch: true,
-      // 总条数
-      total: 0,
-      // 用户表格数据
-      userList: null,
-      // 弹出层标题
-      title: "",
-      // 是否显示弹出层
-      open: false,
-      // 参数
-      queryParams: {
-        ruleType: 0,
-        frequency: 1,
-        gatherTime: null,
-        startTime: null,
-        endTime: null,
-        // 日期范围
-        dateRange: [],
-      },
+        return {
+          // 开启定时方式
+          radio: 1,
+          // 遮罩层
+          loading: true,
+          // 选中数组
+          ids: [],
+          // 非单个禁用
+          single: true,
+          // 非多个禁用
+          multiple: true,
+          // 显示搜索条件
+          showSearch: true,
+          // 总条数
+          total: 0,
+          // 用户表格数据
+          userList: null,
+          // 弹出层标题
+          title: "",
+          // 是否显示弹出层
+          open: false,
+          // 参数
+          queryParams: {
+            ruleType: 0,
+            frequency: 1,
+            gatherTime: null,
+            startTime: null,
+            endTime: null
+          },
+          // 结束日期选择器选项，确保结束时间不早于开始时间
+          endDatePickerOptions: {
+            disabledDate: (time) => {
+              // 如果有开始日期，则结束日期不能早于开始日期
+              if (this.queryParams.startTime) {
+                const startDate = new Date(this.queryParams.startTime).getTime();
+                return time.getTime() < startDate;
+              }
+              return false;
+            }
+          },
 
-      // 表单校验
-      rules: {
-        dateRange: [
-          { required: true, message: "采集时间不能为空", trigger: "blur" }
-        ],
-      }
+          // 表单校验
+          rules: {}
     }
   },
   watch: {
@@ -139,20 +153,33 @@ export default {
     },
     /** 提交按钮 */
     submitForm: function() {
-      this.$refs["form"].validate(valid => {
-        if (valid) {
-          addRule(this.queryParams).then(response => {
-            this.$modal.msgSuccess("新增成功")
-            this.open = false
-            this.getList()
-          })
+      // 验证开始时间是否已填写
+      if (!this.queryParams.startTime) {
+        this.$message.warning("请选择开始日期");
+        return;
+      }
+      
+      // 验证结束时间是否早于开始时间（如果有结束时间）
+      if (this.queryParams.endTime && this.queryParams.startTime) {
+        const endTime = new Date(this.queryParams.endTime).getTime();
+        const startTime = new Date(this.queryParams.startTime).getTime();
+        
+        if (endTime < startTime) {
+          this.$message.warning("结束时间不能早于开始时间");
+          return;
         }
+      }
+      
+      addRule(this.queryParams).then(response => {
+        this.$modal.msgSuccess("新增成功")
+        this.open = false
+        this.getList()
       })
     },
-    handleDateRangeChange(value) {
-      // 验证开始时间是否为今天且早于当前时间
-      if (value && value[0]) {
-        const selectedDate = new Date(value[0]);
+    // 处理开始时间变化
+    handleStartTimeChange(value) {
+      if (value) {
+        const selectedDate = new Date(value);
         const now = new Date();
         const today = new Date(now.getFullYear(), now.getMonth(), now.getDate());
         const selectedDay = new Date(selectedDate.getFullYear(), selectedDate.getMonth(), selectedDate.getDate());
@@ -171,18 +198,32 @@ export default {
                               nextMinute.getMinutes().toString().padStart(2, '0') + ':' +
                               nextMinute.getSeconds().toString().padStart(2, '0');
           
-          // 更新日期范围和对应的时间
-          const newRange = [formattedDate, value[1] || formattedDate];
-          this.queryParams.dateRange = newRange;
-          this.queryParams.startTime = newRange[0];
-          this.queryParams.endTime = newRange[1];
-          return;
+          this.queryParams.startTime = formattedDate;
+        }
+        
+        // 如果结束时间早于新的开始时间，则重置结束时间
+        if (this.queryParams.endTime) {
+          const endTime = new Date(this.queryParams.endTime).getTime();
+          const startTime = new Date(this.queryParams.startTime).getTime();
+          
+          if (endTime < startTime) {
+            this.queryParams.endTime = null;
+          }
+        }
+      }
+    },
+    
+    // 处理结束时间变化
+    handleEndTimeChange(value) {
+      // 如果结束时间早于开始时间，则重置结束时间
+      if (value && this.queryParams.startTime) {
+        const endTime = new Date(value).getTime();
+        const startTime = new Date(this.queryParams.startTime).getTime();
+        
+        if (endTime < startTime) {
+          this.queryParams.endTime = this.queryParams.startTime;
         }
       }
-      
-      // 正常情况更新时间范围
-      this.queryParams.startTime = value ? value[0] : null;
-      this.queryParams.endTime = value ? value[1] : null;
     },
     
     // 处理单个日期时间选择变化
diff --git a/ALOps_sys_fe/alops-ui/src/views/inMonitoring/devicesState/detail.vue b/ALOps_sys_fe/alops-ui/src/views/inMonitoring/devicesState/detail.vue
index fe58dd0d..fd0c9baf 100644
--- a/ALOps_sys_fe/alops-ui/src/views/inMonitoring/devicesState/detail.vue
+++ b/ALOps_sys_fe/alops-ui/src/views/inMonitoring/devicesState/detail.vue
@@ -112,7 +112,7 @@
                               <span class="info-label">
                                   <i class="fas fa-layer-group"></i> 安装日期
                               </span>
-                              <span class="info-value">{{parseTime(details.installDate) || '暂无'}}</span>
+                              <span class="info-value">{{details.installDate || '暂无'}}</span>
                           </div>
                           <div class="info-item">
                               <span class="info-label">
@@ -141,7 +141,7 @@
                               <span class="info-label">
                                   <i class="fas fa-layer-group"></i> 预警总数
                               </span>
-                              <span class="info-value">{{details.handledAlertCount || '暂无'}}</span>
+                              <span class="info-value">{{details.alertCount || '暂无'}}</span>
                           </div>
                       </div>
                     </div>