年度参数列表页面完成

src/views/SchedulingPage/AnnualParamPage.vue

+<script setup>
+import {ref} from "vue";
+import {zhCn} from "element-plus/es/locale/index";
+
+const data = [
+  {
+    paramId: "4229478e-9923-4fce-985d-0109efc1e95f",   // 编号
+    supplyId: "33104782-c1ad-432c-953e-e31c2e031be4",  // 所属供热站编号
+    energyType: '三步节能', // 类型(能源)
+    year: "2024", // 年度
+    standard: 44.2, // 热指标
+    degreeStandard: null, // 度日数标定值
+    indoorTemperature: 23.0,  // 室内温度
+    outdoorTemperature: -9.0, // 室外温度
+    backWaterTemperature: 46.0,  // 回水温度
+    updateNullFields: null  // 无用
+  },
+  {
+    paramId: "4229478e-9923-4fce-985d-0109efc1e95f",   // 编号
+    supplyId: "33104782-c1ad-432c-953e-e31c2e031be4",  // 所属供热站编号
+    energyType: "二步节能", // 类型(能源)
+    year: "2024", // 年度
+    standard: 44.2, // 热指标
+    degreeStandard: null, // 度日数标定值
+    indoorTemperature: 23.0,  // 室内温度
+    outdoorTemperature: -9.0, // 室外温度
+    backWaterTemperature: 46.0,  // 回水温度
+    updateNullFields: null  // 无用
+  },
+  {
+    paramId: "4229478e-9923-4fce-985d-0109efc1e95f",   // 编号
+    supplyId: "33104782-c1ad-432c-953e-e31c2e031be4",  // 所属供热站编号
+    energyType: null, // 类型(能源)
+    year: "2024", // 年度
+    standard: 44.2, // 热指标
+    degreeStandard: null, // 度日数标定值
+    indoorTemperature: 23.0,  // 室内温度
+    outdoorTemperature: -9.0, // 室外温度
+    backWaterTemperature: 46.0,  // 回水温度
+    updateNullFields: null  // 无用
+  },
+  {
+    paramId: "4229478e-9923-4fce-985d-0109efc1e95f",   // 编号
+    supplyId: "33104782-c1ad-432c-953e-e31c2e031be4",  // 所属供热站编号
+    energyType: "二步节能", // 类型(能源)
+    year: "2024", // 年度
+    standard: 44.2, // 热指标
+    degreeStandard: null, // 度日数标定值
+    indoorTemperature: 23.0,  // 室内温度
+    outdoorTemperature: -9.0, // 室外温度
+    backWaterTemperature: 46.0,  // 回水温度
+    updateNullFields: null  // 无用
+  },
+  {
+    paramId: "4229478e-9923-4fce-985d-0109efc1e95f",   // 编号
+    supplyId: "33104782-c1ad-432c-953e-e31c2e031be4",  // 所属供热站编号
+    energyType: "二步节能", // 类型(能源)
+    year: "2024", // 年度
+    standard: 44.2, // 热指标
+    degreeStandard: null, // 度日数标定值
+    indoorTemperature: 23.0,  // 室内温度
+    outdoorTemperature: -9.0, // 室外温度
+    backWaterTemperature: 46.0,  // 回水温度
+    updateNullFields: null  // 无用
+  }
+]
+const tableHeaderClass = data => {  // 表头样式
+  return 'table-header-class'
+}
+const tableBodyClass = data => {   // 表体样式
+  return 'table-body-class'
+}
+const searchKey = ref('') // 查询参数
+const currentPage = ref(1)    // 当前页码
+const pageSize = ref(30)    // 每页显示条数
+function handleEdit(val) {
+} // 处理修改
+
+function handleDelete(val) {
+} // 处理删除
+
+function handleAdd() {
+} // 处理新增
+function handleSearch() {
+} // 处理查询
+</script>
+
+<template>
+  <div class="annual-param-container">
+    <div class="search-add-wrapper">
+      <el-row>
+        <el-col :span="8" label>年度：</el-col>
+        <el-col :span="16">
+          <el-input v-model="searchKey"/>
+        </el-col>
+      </el-row>
+      <el-button type="primary" class="add-search-btn" @click="handleAdd">新增</el-button>
+      <el-button type="primary" class="add-search-btn" @click="handleSearch">查询</el-button>
+    </div>
+    <div class="table-wrapper">
+      <el-table
+          :data="data"
+          border
+          stripe
+          :header-cell-class-name="tableHeaderClass"
+          :row-class-name="tableBodyClass"
+          style="width: 100%">
+        <el-table-column label="序号" type="index" align="center" width="60"/>
+        <el-table-column label="节能类型" prop="energyType"/>
+        <el-table-column label="年度" prop="year"/>
+        <el-table-column label="热指标(W/m²)" prop="standard"/>
+        <el-table-column label="度日数标定值" prop="degreeStandard"/>
+        <el-table-column label="室内温度(℃)" prop="indoorTemperature"/>
+        <el-table-column label="室外温度(℃)" prop="outdoorTemperature"/>
+        <el-table-column label="回水温度(℃)" prop="backWaterTemperature"/>
+        <el-table-column label="操作">
+          <template #default="scope">
+            <div class="table-operate-column">
+              <el-button link type="primary" @click="handleEdit(scope.row)">修改</el-button>
+              <el-button link type="primary" @click="handleDelete(scope.row)">删除</el-button>
+            </div>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <div class="pagination-wrapper">
+      <el-config-provider :locale="zhCn">
+        <el-pagination
+            v-model:current-page="currentPage"
+            v-model:page-size="pageSize"
+            :page-sizes="[30, 40, 50, 100, 200, 300]"
+            :small="true"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="data.length"
+            @change="data"
+            class="pagination"/>
+      </el-config-provider>
+    </div>
+  </div>
+</template>
+
+<style scoped lang="less">
+.annual-param-container {
+  width: 100%;
+  margin: 4px;
+}
+
+.search-add-wrapper {
+  width: 100%;
+  display: flex;
+  justify-content: start;
+}
+
+.search-add-wrapper .el-row {
+  width: 50%;
+  margin: 5px 10px 5px 5px;
+}
+
+.el-col[label] {
+  display: flex;
+  justify-content: end;
+  align-items: center;
+}
+.add-search-btn{
+  margin: 5px 10px 5px 0;
+}
+
+:deep(.table-header-class) {
+  text-align: center;
+  font-size: 12px;
+  background-color: #c4d8f1 !important;
+  color: #124c6a;
+}
+
+:deep(.table-body-class) {
+  font-size: 12px;
+  color: black;
+}
+
+.table-operate-column {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.table-operate-column .el-button {
+  font-size: 12px;
+}
+
+::v-deep .el-table__body tr:hover > td {
+  background: linear-gradient(to top, rgb(0, 198, 255), rgb(255, 255, 255)) !important;
+}
+.pagination-wrapper{
+  padding: 5px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+</style>
\ No newline at end of file

src/views/Scheduling/WeatherManagePage.vue → src/views/SchedulingPage/WeatherManagePage.vue

@@ -82,10 +82,10 @@ const tableBodyClass = data => {   // 表体样式
 }
 const setCellStyle = (row, column, rowIndex, columnIndex) => {
   let css_color = {}
-  css_color['padding-left'] = '0px'
-  css_color['padding-right'] = '0px'
-  css_color['padding-top'] = '3px'
-  css_color['padding-bottom'] = '3px'
+  // css_color['padding-left'] = '0px'
+  // css_color['padding-right'] = '0px'
+  // css_color['padding-top'] = '3px'
+  // css_color['padding-bottom'] = '3px'
   return css_color
 }
 
@@ -117,14 +117,24 @@ const confirmRevise = val => { // 修改弹窗确认按钮事件
   }
   reviseWindowOpen.value = false
 }
-const confirmBind = val =>{
+const confirmBind = val => {
   console.log("处理换热站绑定")
   bindWindowOpen.value = false
 }
 </script>
 
 <template>
-  <div class="container">
+  <div class="weather-manage-container">
+    <el-row>
+      <el-col :span="15" left-col>
+
+      </el-col>
+      <el-col :span="9" right-col>
+        <!--        <el-button type="primary" @click="reviseWindowOpen = true" class="add-btn">新增</el-button>-->
+        <el-button type="primary" class="add-btn">新增</el-button>
+        <el-button type="primary">查询</el-button>
+      </el-col>
+    </el-row>
     <div class="table-wrapper">
       <el-table
           :data="data"
@@ -143,13 +153,16 @@ const confirmBind = val =>{
         <el-table-column prop="windSpeed" label="风速" width="60"/>
         <el-table-column prop="illumination" label="光照" width="60"/>
         <el-table-column prop="switching" label="手自动切换" width="120"/>
-        <el-table-column prop="deviationPercentage" label="自动偏差百分比"/>
-        <el-table-column prop="verifyTime" label="验证时间"/>
-        <el-table-column prop="adjustTemperature" label="调节温度"/>
+        <el-table-column prop="deviationPercentage" label="自动偏差百分比" width="170"/>
+        <el-table-column prop="verifyTime" label="验证时间" width="100"/>
+        <el-table-column prop="adjustTemperature" label="调节温度" width="100"/>
         <el-table-column prop="sort" label="排序" width="60"/>
         <el-table-column label="操作" width="200">
           <template #default="scope">
             <div class="table-operate-column">
+              <!--              <el-link :underline="false" @click="revise(scope.row)" type="primary">修改</el-link>-->
+              <!--              <el-link :underline="false" @click="bind(scope.row)" type="primary">绑定换热站</el-link>-->
+              <!--              <el-link :underline="false" type="primary">详情</el-link>-->
               <el-button link @click="revise(scope.row)" type="primary">修改</el-button>
               <el-button link @click="bind(scope.row)" type="primary">绑定换热站</el-button>
               <el-button link type="primary">详情</el-button>
@@ -160,18 +173,29 @@ const confirmBind = val =>{
     </div>
 
     <div class="pagination-wrapper">
-      <div class="pagination-text-area">
-        <div class="pagination-text">
-          共{{ data.length }}条记录，当前为第{{ currentPage }}页，共{{ totalPageCount }}页
-        </div>
-      </div>
+      <!--      <div class="pagination-text-area">-->
+      <!--        <div class="pagination-text">-->
+      <!--          共{{ data.length }}条记录，当前为第{{ currentPage }}页，共{{ totalPageCount }}页-->
+      <!--        </div>-->
+      <!--      </div>-->
+      <!--      <el-config-provider :locale="zhCn">-->
+      <!--        <el-pagination-->
+      <!--            v-model:current-page="currentPage"-->
+      <!--            v-model:page-size="pageSize"-->
+      <!--            :page-sizes="[30, 40, 50, 100, 200, 300]"-->
+      <!--            :small="true"-->
+      <!--            layout="sizes, prev, pager, next, jumper"-->
+      <!--            :total="data.length"-->
+      <!--            @change="data"-->
+      <!--            class="pagination"/>-->
+      <!--      </el-config-provider>-->
       <el-config-provider :locale="zhCn">
         <el-pagination
             v-model:current-page="currentPage"
             v-model:page-size="pageSize"
             :page-sizes="[30, 40, 50, 100, 200, 300]"
             :small="true"
-            layout="sizes, prev, pager, next, jumper"
+            layout="total, sizes, prev, pager, next, jumper"
             :total="data.length"
             @change="data"
             class="pagination"/>
@@ -197,18 +221,45 @@ const confirmBind = val =>{
 </template>
 
 <style scoped>
+.weather-manage-container {
+  width: 100%;
+  margin: 4px;
+}
+
+.el-col[left-col] {
+  border-right: 1px solid #a6c3e9;
+}
+
+.el-row {
+  width: 100%;
+  border: 1px solid #a6c3e9;
+  margin: 5px 0 10px 0;
+}
+
+.el-col[right-col] {
+  padding-left: 10px;
+}
+
+.add-btn {
+  margin: 5px 0;
+}
+
 :deep(.table-header-class) {
   text-align: center;
+  font-size: 12px;
   background-color: #c4d8f1 !important;
   color: #124c6a;
-  font-weight: normal;
-
 }
 
 :deep(.table-body-class) {
+  font-size: 12px;
   color: black;
 }
 
+.table-wrapper {
+
+}
+
 .table-operate-column {
   display: flex;
   justify-content: center;
@@ -216,12 +267,11 @@ const confirmBind = val =>{
 }
 
 .table-operate-column .el-button {
-  color: #124c6a;
   font-size: 12px;
 }
 
 .pagination-wrapper {
-  padding: 10px;
+  padding: 5px;
   display: flex;
   justify-content: space-between;
   align-items: center;
@@ -235,7 +285,7 @@ const confirmBind = val =>{
 
 }
 
-::v-deep .el-table__body tr:hover>td {
+::v-deep .el-table__body tr:hover > td {
   background: linear-gradient(to top, rgb(0, 198, 255), rgb(255, 255, 255)) !important;
 }
 </style>
\ No newline at end of file