能源管理、生产计划模块开发

zhangwencui

10 天以前 f9d502b976ebb53281432faa56899015d49a87b6

 src/views/energyManagement/energyType/index2.vue

@@ -11,11 +11,11 @@
                     style="width: 120px;"
                     @change="handleQuery">
            <el-option label="气"
                       value="gas" />
                       value="气" />
            <el-option label="电"
                       value="electricity" />
                       value="电" />
            <el-option label="水"
                       value="water" />
                       value="水" />
          </el-select>
        </el-form-item>
        <el-form-item label="能源名称:">
@@ -495,7 +495,9 @@
  .search_form {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 24px;
    padding: 20px;
    background-color: #ffffff;
@@ -505,6 +507,28 @@

    &:hover {
      box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.08);
    }

    :deep(.el-form) {
      display: flex;
      flex-wrap: wrap;
      gap: 0;

      .el-form-item {
        margin-right: 16px;
        margin-bottom: 0;

        &:last-child {
          margin-right: 0;
        }
      }
    }

    > div {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      flex-shrink: 0;
    }
  }

@@ -637,28 +661,83 @@
    font-size: 12px;
  }

  @media (max-width: 768px) {
    .app-container {
      padding: 16px;
  @media (max-width: 1200px) {
    .search_form {
      :deep(.el-form) {
        .el-form-item {
          margin-right: 12px;
          margin-bottom: 8px;
        }
      }
    }
  }

  @media (max-width: 992px) {
    .search_form {
      flex-direction: column;
      align-items: flex-start;
      align-items: stretch;
      gap: 12px;

      .el-form {
      :deep(.el-form) {
        width: 100%;

        .el-form-item {
          width: 100%;
          margin-right: 12px;
          margin-bottom: 8px;
          flex: 1;
          min-width: 200px;

          &:last-child {
            margin-right: 12px;
          }
        }
      }

      > div {
        width: 100%;
        display: flex;
        gap: 12px;
        justify-content: flex-end;
      }
    }
  }

  @media (max-width: 768px) {
    .app-container {
      padding: 12px;
    }

    .search_form {
      padding: 16px;
      gap: 12px;

      :deep(.el-form) {
        flex-direction: column;
        width: 100%;

        .el-form-item {
          width: 100%;
          margin-right: 0;
          margin-bottom: 12px;

          &:last-child {
            margin-right: 0;
            margin-bottom: 0;
          }

          .el-form-item__content {
            width: 100%;

            .el-input,
            .el-select,
            .el-date-editor {
              width: 100% !important;
            }
          }
        }
      }

      > div {
        width: 100%;
        justify-content: stretch;

        .el-button {
          flex: 1;
@@ -666,17 +745,36 @@
      }
    }

    .table_list {
      height: calc(100vh - 300px);
    }

    :deep(.el-table) {
      th,
      td {
        padding: 10px 0;
        padding: 8px 0;
        font-size: 12px;
      }
    }

    :deep(.el-dialog) {
      width: 90% !important;
      margin: 20px auto !important;
      width: 95% !important;
      margin: 10px auto !important;
    }
  }

  @media (max-width: 480px) {
    .search_form {
      padding: 12px;

      > div {
        flex-direction: column;
        gap: 8px;

        .el-button {
          width: 100%;
        }
      }
    }
  }
  .consumption-value {