界面调整

yaowanxin

2025-08-11 010dbe320ed36fd63778bcba424dbdefdefc74f0

 src/views/energyManagement/energyPeriodTime/index.vue

@@ -2,8 +2,8 @@
  <div class="app-container">
    <div class="search_form">
      <div>
        <span class="search_title">时间范围：</span>
      <el-time-picker
        <span class="search_title">日期：</span>
      <!-- <el-time-picker
         style="width: 240px;margin-right: 10px"
         v-model="searchForm.startTime"
         value-format="HH:mm:ss"
@@ -11,15 +11,12 @@
         type="time"
         placeholder="请选择开始时间"
         clearable
      />
      <el-time-picker
         style="width: 240px;margin-right: 10px"
         v-model="searchForm.endTime"
         value-format="HH:mm:ss"
         format="HH:mm:ss"
         type="time"
         placeholder="请选择结束时间"
         clearable
      /> -->
      <el-date-picker
         v-model="searchForm.date"
         type="date"
         placeholder="请选择日期"
         :size="size"
      />
        <!-- <el-time-picker
            v-model="searchForm.timeRange"
@@ -74,48 +71,75 @@
      >
        <el-row :gutter="30">
          <el-col :span="12">
            <el-form-item label="开始时间：" prop="startTime">
              <el-time-picker
            <el-form-item label="日期：" prop="date">
              <el-date-picker
                  style="width: 100%"
                  v-model="form.startTime"
                  value-format="HH:mm:ss"
                  format="HH:mm:ss"
                  type="time"
                  placeholder="请选择开始时间"
                  v-model="form.date"
                  value-format="YYYY-MM-DD"
                  format="YYYY-MM-DD"
                  type="date"
                  placeholder="请选择日期"
                  clearable
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="结束时间：" prop="endTime">
              <el-time-picker
                  style="width: 100%"
                  v-model="form.endTime"
                  value-format="HH:mm:ss"
                  format="HH:mm:ss"
                  type="time"
                  placeholder="请选择结束时间"
                  clearable
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="30">
<!--          <el-col :span="12">-->
<!--            <el-form-item label="时段名称：" prop="timeName">-->
<!--              <el-input-->
<!--                  v-model="form.timeName"-->
<!--                  placeholder="请输入时段名称"-->
<!--                  clearable-->
<!--                  :disabled="operationType !== 'add'"-->
<!--              />-->
<!--            </el-form-item>-->
<!--          </el-col>-->
          <el-col :span="12">
            <el-form-item label="电价（元/度）：" prop="price">
              <el-input
                  v-model="form.price"
                  placeholder="请输入电价"
                  clearable
                  type="number"
                  step="0.01"
                  min="0"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="30">
         <el-col :span="12">
           <el-form-item label="峰段：" prop="peak">
             <el-input
                 v-model="form.peak"
                 placeholder="请输入峰段"
                 clearable
                 type="number"
                 step="0.01"
                 min="0"
             />
           </el-form-item>
         </el-col>
          <el-col :span="12">
            <el-form-item label="谷段：" prop="valley">
              <el-input
                  v-model="form.valley"
                  placeholder="请输入谷段"
                  clearable
                  type="number"
                  step="0.01"
                  min="0"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="30">
         <el-col :span="12">
           <el-form-item label="平段：" prop="flat">
             <el-input
                 v-model="form.flat"
                 placeholder="请输入平段"
                 clearable
                 type="number"
                 step="0.01"
                 min="0"
             />
           </el-form-item>
         </el-col>
          <el-col :span="12">
            <el-form-item label="尖段：" prop="sharp">
              <el-input
                  v-model="form.sharp"
                  placeholder="请输入尖段"
                  clearable
                  type="number"
                  step="0.01"
@@ -144,15 +168,16 @@

const data = reactive({
   searchForm: {
      startTime: "",
      endTime: "",
      date: "",
      price: ""
   },
   form: {
      // timeName: "",
      startTime: "",
      endTime: "",
       price: ""
      date: "",
       price: "",
      peak: "",
      valley: "",
      flat: "",
      sharp: ""
   }
});
const { searchForm,form } = toRefs(data);
@@ -174,18 +199,31 @@
   //    width: 200,
   // },
   {
      label: "开始时间",
      prop: "startTime",
      label: "日期",
      prop: "date",
      width: 200,
   },
   {
      label: "结束时间",
      prop: "endTime",
      label: "电价（元/度）",
      prop: "price",
      width: 200,
   },
  {
    label: "电价（元/度）",
    prop: "price",
    width: 200,
  },
      {
      label: "峰段",
      prop: "peak",
   },
   {
      label: "谷段",
      prop: "valley",
   },
   {
      label: "平段",
      prop: "flat",
   },
   {
      label: "尖段",
      prop: "sharp",
   },
   {
      dataType: "action",
      label: "操作",
@@ -265,10 +303,9 @@
//重置
const resetFilters = () => {
   searchForm.value = {
    startTime: "",
    endTime: "",
    price: ""
  };
      date: "",
      price: ""
   };
  getList();

};
@@ -279,7 +316,7 @@
};
const getList = () => {
   tableLoading.value = true;
   periodListPage({ ...searchForm.value, ...page.value }).then((res) => {
   periodListPage({ ...searchForm, ...page.value }).then((res) => {
         tableLoading.value = false;
         if (res && res.data) {
            tableData.value = res.data.records || [];