style：能源报表-时间范围控件添加小时列

src/views/mes/energydevicecheck/index.vue

@@ -2,7 +2,8 @@
   <ContentWrap>
     <el-form class="-mb-15px" :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
       <el-form-item label="表名称" prop="name">
-        <el-input v-model="queryParams.name" placeholder="请输入表名称" clearable @keyup.enter="handleQuery" class="!w-240px" />
+        <el-input v-model="queryParams.name" placeholder="请输入表名称" clearable @keyup.enter="handleQuery"
+          class="!w-240px" />
       </el-form-item>
 
       <el-form-item label="所属区域" prop="orgId">
@@ -12,49 +13,34 @@
       </el-form-item>
 
       <el-form-item label="时间范围" prop="timeRange">
-        <el-date-picker
+        <el-date-picker v-model="queryParams.timeRange" type="datetimerange" value-format="YYYY-MM-DD HH"
-          v-model="queryParams.timeRange"
+          format="YYYY-MM-DD HH" start-placeholder="请选择开始时间" end-placeholder="请选择结束时间"
-          value-format="YYYY-MM-DD HH:mm:ss"
+          :default-time="[new Date('2000-01-01 00:00:00'), new Date('2000-01-01 23:00:00')]"
-          type="daterange"
+          :disabled-time="getDisabledTime" class="!w-360px " popper-class="energydevicecheckPicker"
-          start-placeholder="请选择开始日期与时间"
+          :teleported="false" />
-          end-placeholder="请选择结束日期与时间"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-360px"
-        />
       </el-form-item>
 
       <el-form-item>
-        <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 查询</el-button>
+        <el-button @click="handleQuery">
-        <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
+          <Icon icon="ep:search" class="mr-5px" /> 查询
+        </el-button>
+        <el-button @click="resetQuery">
+          <Icon icon="ep:refresh" class="mr-5px" /> 重置
+        </el-button>
         <el-button type="success" plain @click="handleExport" :loading="exportLoading">
           <Icon icon="ep:download" class="mr-5px" /> 导出
         </el-button>
       </el-form-item>
     </el-form>
 
-    <el-table
+    <el-table ref="tableRef" v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true" row-key="id"
-      ref="tableRef"
+      :expand-row-keys="expandRowKeys" :row-class-name="getRowClassName" style="margin-top: 20px; min-height: 50vh"
-      v-loading="loading"
+      @row-click="handleRowClick" @selection-change="handleSelectionChange">
-      :data="list"
-      :stripe="true"
-      :show-overflow-tooltip="true"
-      row-key="id"
-      :expand-row-keys="expandRowKeys"
-      :row-class-name="getRowClassName"
-      style="margin-top: 20px"
-      @row-click="handleRowClick"
-      @selection-change="handleSelectionChange"
-    >
       <el-table-column type="selection" width="50" align="center" />
       <el-table-column type="expand" width="52">
         <template #default="scope">
-          <el-table
+          <el-table v-if="getOperationRuleRows(scope.row).length" :data="getOperationRuleRows(scope.row)"
-            v-if="getOperationRuleRows(scope.row).length"
+            :show-overflow-tooltip="true" size="small" border>
-            :data="getOperationRuleRows(scope.row)"
-            :show-overflow-tooltip="true"
-            size="small"
-            border
-          >
             <el-table-column label="指标" prop="name" min-width="140" />
             <el-table-column label="值" prop="value" min-width="120" />
           </el-table>
@@ -86,7 +72,8 @@
       </el-table-column>
     </el-table>
 
-    <Pagination :total="total" v-model:page="queryParams.pageNo" v-model:limit="queryParams.pageSize" @pagination="getList" />
+    <Pagination :total="total" v-model:page="queryParams.pageNo" v-model:limit="queryParams.pageSize"
+      @pagination="getList" />
   </ContentWrap>
 </template>
 
@@ -109,6 +96,14 @@ const selectedIds = ref<Array<number | string>>([])
 
 const orgOptions = ref<{ label: string; value: string | number; raw?: OrganizationVO }[]>([])
 
+const getDisabledTime = () => {
+  const all = Array.from({ length: 60 }, (_, i) => i)
+  return {
+    disabledMinutes: () => all,
+    disabledSeconds: () => all
+  }
+}
+
 const queryParams = reactive({
   pageNo: 1,
   pageSize: 10,
@@ -236,8 +231,12 @@ onMounted(async () => {
 })
 </script>
 
-<style scoped>
+<style scoped lang="scss">
-:deep(.row-no-expand .el-table__expand-icon) {
+:deep(.el-time-spinner__wrapper:nth-child(1)) {
+  width: 100%;
+}
+
+:deep(.el-time-spinner__wrapper:nth-child(2)) {
   display: none;
 }
 </style>