更新2000px以上页面样式变动

.env.development

@@ -7,9 +7,9 @@ ENV = 'development'
 # 开发环境
 # VUE_APP_BASE_API = '/dev-api'
 # 后台
-VUE_APP_BASE_API = 'http://192.168.1.222:8080'
+# VUE_APP_BASE_API = 'http://192.168.1.222:8080'
 # 梅州云端
-# VUE_APP_BASE_API = 'http://106.55.173.225:8091'
+VUE_APP_BASE_API = 'http://106.55.173.225:8091'
 
 # 路由懒加载
 VUE_CLI_BABEL_TRANSPILE_MODULES = true

src/assets/styles/bigScreen.scss

@@ -1,6 +1,5 @@
-// 媒体查询，适配大于2000px分辨率的大屏样式
+// 媒体查询，适配大于2000px分辨率的大屏样式-element样式
 @media (min-width: 2000px) {
-  // element样式
   .el-tabs--top .el-tabs__item.is-top:nth-child(2),
   .el-tabs--top .el-tabs__item.is-bottom:nth-child(2),
   .el-tabs--bottom .el-tabs__item.is-top:nth-child(2),
@@ -144,6 +143,15 @@
   .el-range-editor--medium .el-range__close-icon {
     line-height: 0.28rem !important;
   }
+  .el-range-editor--small.el-input__inner {
+    height: 0.32rem !important;
+  }
+  .el-range-editor--small .el-range-input {
+    font-size: 0.13rem !important;
+  }
+  .el-tag--mini .el-icon-close {
+    margin-left: -0.03rem !important;
+  }
   .el-date-editor .el-range__icon {
     font-size: 0.14rem !important;
     margin-left: -0.05rem !important;
@@ -151,7 +159,7 @@
   }
   .el-input__icon {
     width: 0.25rem !important;
-    line-height: 0.4rem !important;
+    line-height: 0.32rem !important;
   }
   .el-range-editor--medium .el-range-input {
     font-size: 0.14rem !important;
@@ -183,7 +191,10 @@
   }
   .el-picker-panel,
   .el-date-range-picker .el-picker-panel__body {
-    min-width: 5.13rem !important;
+    // min-width: 5.13rem !important;
+  }
+  .el-date-picker {
+    width: 3.22rem !important;
   }
   .el-date-range-picker__time-header {
     font-size: 0.12rem !important;
@@ -192,6 +203,29 @@
   .el-date-range-picker__time-picker-wrap {
     padding: 0 0.05rem !important;
   }
+  .el-date-range-picker .el-picker-panel__body {
+    min-width: 5.13rem !important;
+  }
+  .el-date-range-picker {
+    width: 6.46rem !important;
+  }
+  .el-date-editor--daterange.el-input,
+  .el-date-editor--daterange.el-input__inner,
+  .el-date-editor--timerange.el-input,
+  .el-date-editor--timerange.el-input__inner {
+    width: 3.5rem !important;
+  }
+  .el-date-editor--monthrange.el-input,
+  .el-date-editor--monthrange.el-input__inner {
+    width: 3rem !important;
+  }
+  .el-date-editor.el-input,
+  .el-date-editor.el-input__inner {
+    width: 2.2rem !important;
+  }
+  .el-year-table td {
+    padding: 0.2rem 0.03rem !important;
+  }
   .el-input--small {
     font-size: 0.13rem !important;
   }
@@ -224,6 +258,31 @@
     height: 0.24rem !important;
     line-height: 0.24rem !important;
   }
+  .el-year-table td .cell {
+    width: 0.48rem !important;
+    height: 0.32rem !important;
+    line-height: 0.32rem !important;
+  }
+  .el-year-table {
+    font-size: 0.12rem !important;
+    margin: -0.01rem !important;
+  }
+  .el-select-dropdown {
+    margin: 0.05rem 0 !important;
+    border-radius: 0.04rem !important;
+  }
+  .el-select-dropdown__wrap,
+  .el-scrollbar__wrap {
+    margin-bottom: -0.1rem !important;
+    margin-right: -0.1rem !important;
+  }
+  .el-select-dropdown.is-multiple .el-select-dropdown__item.selected::after {
+    right: 0.2rem !important;
+    font-size: 0.12rem !important;
+  }
+  .el-select-dropdown__wrap {
+    max-height: 2.74rem !important;
+  }
   .el-date-table td.start-date div {
     margin-left: 0.05rem !important;
     border-top-left-radius: 0.15rem !important;
@@ -242,6 +301,13 @@
     padding: 0.04rem 0 !important;
     position: relative;
   }
+  .el-pager li {
+    padding: 0 0.04rem !important;
+    font-size: 0.13rem !important;
+    min-width: 0.355rem !important;
+    height: 0.28rem !important;
+    line-height: 0.28rem !important;
+  }
   .el-picker-panel__footer {
     padding: 0.04rem !important;
   }
@@ -273,7 +339,7 @@
     line-height: 0.36rem !important;
   }
   .el-input--suffix .el-input__inner {
-    padding-right: 0.3rem !important;
+    padding: 0 0.3rem !important;
   }
   .el-input--medium {
     font-size: 0.14rem !important;
@@ -293,6 +359,7 @@
     width: 0.16rem !important;
     line-height: 0.16rem !important;
     right: 0rem !important;
+    top: -0.01rem !important;
   }
   .el-tag--small {
     height: 0.24rem !important;
@@ -320,7 +387,7 @@
     font-size: 0.14rem !important;
   }
   .el-table--medium .el-table__cell {
-    padding: 10px 0;
+    padding: 0.01rem 0 !important;
   }
   .el-table .cell {
     line-height: 0.23rem !important;
@@ -358,6 +425,9 @@
     height: 0.28rem !important;
     line-height: 0.28rem !important;
   }
+  .el-tree-node__label {
+    font-size: 0.14rem !important;
+  }
   .el-pagination.is-background .btn-prev,
   .el-pagination.is-background .btn-next,
   .el-pagination.is-background .el-pager li {
@@ -365,6 +435,12 @@
     min-width: 0.3rem !important;
     border-radius: 0.02rem !important;
   }
+  .pagination-container {
+    padding: 0.32rem 0.16rem !important;
+    height: 0.32rem !important;
+    margin-bottom: 0.1rem !important;
+    margin-top: 0.15rem !important;
+  }
   .el-pagination .btn-prev .el-icon,
   .el-pagination .btn-next .el-icon {
     font-size: 0.12rem !important;
@@ -400,7 +476,168 @@
     font-size: 0.14rem !important;
     padding-right: 0.08rem !important;
   }
-
+  .el-form-item--small .el-form-item__label {
+    line-height: 0.4rem !important;
+  }
+  .el-form-item__label {
+    font-size: 0.14rem !important;
+  }
+  .el-date-picker__header-label {
+    font-size: 0.16rem !important;
+    padding: 0 0.05rem !important;
+    line-height: 0.22rem !important;
+  }
+  .el-month-table td .cell {
+    width: 0.6rem !important;
+    height: 0.36rem !important;
+    line-height: 0.36rem !important;
+    border-radius: 0.18rem !important;
+  }
+  .el-month-table {
+    font-size: 0.12rem !important;
+  }
+  .el-month-table td {
+    padding: 0.08rem 0px !important;
+  }
+  .mb8 {
+    margin-bottom: 0.08rem !important;
+  }
+  .el-month-table td div {
+    height: 0.48rem !important;
+    padding: 0.06rem 0 !important;
+  }
+  .el-date-picker .el-picker-panel__content {
+    width: 2.92rem !important;
+  }
+  .el-cascader-panel {
+    border-radius: 0.04rem !important;
+    font-size: 0.14rem !important;
+  }
+  .el-cascader-menu {
+    min-width: 1.8rem !important;
+  }
+  .el-cascader-menu__wrap {
+    height: 2.04rem !important;
+  }
+  .el-cascader-menu__list {
+    padding: 0.06rem 0 !important;
+  }
+  .el-cascader-node {
+    padding: 0 0.3rem 0 0.2rem !important;
+    height: 0.34rem !important;
+    line-height: 0.34rem !important;
+  }
+  .el-checkbox {
+    font-size: 0.14rem !important;
+    margin-right: 0.03rem !important;
+  }
+  .el-cascader-node__label {
+    padding: 0 0.1rem !important;
+  }
+  .el-checkbox__inner {
+    border-radius: 0.02rem !important;
+    width: 0.14rem !important;
+    height: 0.14rem !important;
+  }
+  .el-checkbox__inner::after {
+    height: 0.07rem !important;
+    left: 0.04rem !important;
+    top: 0.01rem !important;
+  }
+  .el-checkbox__inner::after {
+    height: 0.07rem !important;
+    left: 0.04rem !important;
+    top: 0.01rem !important;
+    width: 0.03rem !important;
+  }
+  .el-checkbox__input.is-indeterminate .el-checkbox__inner::before {
+    height: 0.02rem !important;
+    top: 0.05rem !important;
+  }
+  .el-dialog {
+    border-radius: 0.1rem !important;
+    border: 0.02rem solid #005fbf !important;
+  }
+  .el-dialog__body {
+    padding: 0.3rem 0.2rem !important;
+    font-size: 0.14rem !important;
+  }
+  .el-form-item {
+    margin-bottom: 0.22rem !important;
+  }
+  .el-dialog__title {
+    width: 2.84rem !important;
+    height: 0.45rem !important;
+    font-size: 0.2rem !important;
+    line-height: 0.25rem !important;
+  }
+  .el-dialog__footer {
+    padding: 0.2rem !important;
+    padding-top: 0.1rem !important;
+  }
+  .el-form-item__content {
+    line-height: 0.4rem !important;
+    font-size: 0.14rem !important;
+  }
+  .el-message-box__message p {
+    line-height: 0.24rem !important;
+  }
+  .el-dialog .el-row {
+    margin-bottom: 0.1rem !important;
+  }
+  .el-dialog__headerbtn {
+    top: 0.32rem !important;
+    right: 0.2rem !important;
+    font-size: 0.16rem !important;
+  }
+  .el-dialog__header {
+    padding: 0.2rem !important;
+    padding-bottom: 0.1rem !important;
+  }
+  .el-dialog__headerbtn .el-dialog__close {
+    font-size: 0.25rem !important;
+  }
+  .el-dropdown-menu--medium .el-dropdown-menu__item {
+    line-height: 0.3rem !important;
+    padding: 0 0.17rem !important;
+    font-size: 0.14rem !important;
+  }
+  .vue-treeselect--searchable .vue-treeselect__input-container {
+    padding-left: 0.05rem !important;
+    padding-right: 0.05rem !important;
+  }
+  .vue-treeselect__x-container,
+  .vue-treeselect__control-arrow-container {
+    width: 0.2rem !important;
+  }
+  .vue-treeselect__x {
+    width: 0.08rem !important;
+    height: 0.08rem !important;
+  }
+  .vue-treeselect__control-arrow,
+  .vue-treeselect__option-arrow {
+    width: 0.09rem !important;
+    height: 0.09rem !important;
+  }
+  .vue-treeselect__option-arrow-container,
+  .vue-treeselect__option-arrow-placeholder {
+    width: 0.2rem !important;
+  }
+  .vue-treeselect div,
+  .vue-treeselect span {
+    line-height: 0.36rem !important;
+  }
+  .el-dropdown-menu--mini .el-dropdown-menu__item {
+    line-height: 0.24rem !important;
+    padding: 0 0.1rem !important;
+    font-size: 0.12rem !important;
+  }
+  // 弹框input宽度对齐
+  .el-form-item--medium .el-form-item__content {
+    width: 100%;
+  }
+}
+@media (min-width: 2000px) {
   // 页面公共样式
   .analysis-table th {
     height: 0.5rem !important;
@@ -428,4 +665,50 @@
       font-size: 0.24rem !important;
     }
   }
+  .choice {
+    margin-left: 0.42rem !important;
+    .mr20 {
+      font-size: 0.16rem !important;
+      width: 0.48rem !important;
+      border-radius: 0.14rem !important;
+      margin-right: 0.1rem !important;
+    }
+  }
+  .timeStyle {
+    border-radius: 0.14rem !important;
+  }
+  .special-div {
+    .special-top {
+      padding: 0.04rem 0.26rem 0.04rem 0 !important;
+      min-height: 0.37rem !important;
+    }
+    .special-top::after {
+      height: 0.01rem !important;
+      top: -0.03rem !important;
+    }
+    .special-top::before {
+      height: 0.01rem !important;
+      bottom: -0.03rem !important;
+    }
+    .special-title {
+      padding-left: 0.36rem !important;
+      font-size: 0.2rem !important;
+      line-height: 0.23rem !important;
+      background-size: 1.4rem 0.35rem !important;
+      background-position: 0px -0.03rem !important;
+    }
+    .special-title::before {
+      width: 0.34rem !important;
+      height: 0.13rem !important;
+    }
+  }
+  // 首页
+  .project-data {
+    margin: 0.16rem 0 !important;
+  }
+  .form-header {
+    font-size: 0.15rem !important;
+    margin: 0.08rem 0.1rem 0.25rem 0.1rem !important;
+    padding-bottom: 0.05rem !important;
+  }
 }

src/assets/styles/index.scss

@@ -380,7 +380,7 @@ table {
   border-spacing: 0;
 }
 table tr {
-  height: 45px !important;
+  height: 45px;
   color: #ffffff;
 }
 table th {

src/views/alarm/alarmCode/index.vue

@@ -7,7 +7,6 @@
           ref="queryForm"
           size="small"
           :inline="true"
-          label-width="68px"
         >
           <el-form-item label="消息编码" prop="msgCode">
             <el-input
@@ -213,8 +212,8 @@
     />
 
     <!-- 添加或报警编码对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="700px" append-to-body>
+    <el-dialog :title="title" :visible.sync="open" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+      <el-form ref="form" :model="form" :rules="rules" >
         <el-row type="flex" justify="center">
           <el-col :span="12">
             <el-form-item label="消息编码" prop="msgCode">
@@ -494,3 +493,35 @@ export default {
   },
 };
 </script>
+<style scoped lang="scss">
+/* 媒体查询，适配大于2000px分辨率的大屏样式 - element样式 */
+@media (max-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 700px !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 110px !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+@media (min-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 7.5rem !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 1.1rem !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+</style>
+

src/views/alarm/alarmRecord/index.vue

@@ -7,7 +7,6 @@
           ref="queryForm"
           size="small"
           :inline="true"
-          label-width="68px"
         >
           <el-form-item label="设备名称" prop="deviceName">
             <el-input
@@ -203,8 +202,8 @@
     />
 
     <!-- 修改报警记录对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="700px" append-to-body>
+    <el-dialog :title="title" :visible.sync="open" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+      <el-form ref="form" :model="form" :rules="rules">
         <el-row type="flex" justify="center">
           <el-col :span="12">
             <el-form-item label="设备名称" prop="deviceName">
@@ -481,3 +480,34 @@ export default {
   color: rgb(7, 214, 110);
 }
 </style>
+<style scoped lang="scss">
+/* 媒体查询，适配大于2000px分辨率的大屏样式 - element样式 */
+@media (max-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 700px !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 140px !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+@media (min-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 7.5rem !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 1.4rem !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+</style>

src/views/alarm/alarmRule/index.vue

@@ -7,7 +7,6 @@
           ref="queryForm"
           size="small"
           :inline="true"
-          label-width="68px"
         >
           <el-form-item label="报警类型" prop="alarmType">
             <el-select
@@ -243,8 +242,8 @@
     />
 
     <!-- 添加或报警规则对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="700px" append-to-body>
+    <el-dialog :title="title" :visible.sync="open" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="110px">
+      <el-form ref="form" :model="form" :rules="rules">
         <el-row type="flex" justify="center">
           <el-col :span="12">
             <el-form-item label="设备名称" prop="ledgerId">
@@ -670,7 +669,7 @@ export default {
         this.getCpmIdList(this.form.ledgerId);
       }
       //清除采集位点
-      this.form.cpmId = ""
+      this.form.cpmId = "";
     },
     //采集参数列表
     getCpmIdList(id) {
@@ -819,3 +818,34 @@ export default {
   color: red;
 }
 </style>
+<style scoped lang="scss">
+/* 媒体查询，适配大于2000px分辨率的大屏样式 - element样式 */
+@media (max-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 700px !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 150px !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+@media (min-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 7.5rem !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 1.5rem !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+</style>

src/views/bigScreen/bigScreen.vue

@@ -581,4 +581,58 @@ export default {
     }
   }
 }
+// 媒体查询，适配大于2000px分辨率的大屏样式-element样式
+@media (min-width: 2000px) {
+  .loginD {
+    padding-bottom: 0.2rem !important;
+    .title-left {
+      width: calc(100% - 0.3rem) !important;
+    }
+    .special-div {
+      margin-bottom: 0.17rem !important;
+    }
+    .screen-page {
+      display: flex;
+      flex-direction: row;
+      justify-content: space-between;
+      align-items: stretch;
+      width: calc(100% - 1.22rem) !important;
+      margin-top: 0.86rem !important;
+      .screen-left {
+        width: 30% !important;
+        .left-Indicator {
+          position: absolute;
+          right: -0.9rem !important;
+          width: 0.6rem !important;
+          height: 0.4rem !important;
+        }
+      }
+      .screen-right {
+        width: 30% !important;
+        .message {
+          margin-top: 0.29rem !important;
+          font-size: 0.16rem !important;
+          .message-li {
+            width: calc(33.33% - 0.32rem) !important;
+            margin: 0 0.16rem !important;
+            .message-data {
+              font-size: 0.2rem !important;
+              margin-bottom: 0.3rem !important;
+            }
+            .message-img {
+              width: 1rem !important;
+              height: 0.99rem !important;
+            }
+          }
+        }
+        .right-Indicator {
+          position: absolute;
+          left: -0.9rem !important;
+          width: 0.6rem !important;
+          height: 0.4rem !important;
+        }
+      }
+    }
+  }
+}
 </style>

src/views/bigScreen/components/allEnergy.vue

@@ -17,7 +17,7 @@ export default {
     return {
       chartInstance: null,
       option: {},
-      energyMes:{}
+      energyMes: {},
     };
   },
   watch: {
@@ -29,7 +29,7 @@ export default {
           this.energyMes = newVal;
           this.$nextTick(() => {
             this.echartsData();
-          })
+          });
         }
       },
     },
@@ -426,4 +426,12 @@ export default {
   height: 200px;
   margin-top: 20px;
 }
+// 媒体查询，适配大于2000px分辨率的大屏样式
+@media (min-width: 2000px) {
+  .charts {
+    margin-top: 0.3rem !important;
+    height: 2.4rem !important;
+    margin-top: 0.2rem !important;
+  }
+}
 </style>

src/views/bigScreen/components/coldSysEnergy.vue

@@ -478,6 +478,7 @@ export default {
             this.useForm.useData,
             this.useForm.maxData
           );
+          const titleFontSize = this.$refs.sys_charts.offsetWidth / 25;
           const adapterOption = {
             series: [
               {
@@ -508,7 +509,7 @@ export default {
                 label: {
                   show: true,
                   position: "center", // 文字显示在中心位置
-                  offset: [0, -5], // 向上偏移 10 个单位
+                  offset: [0, -titleFontSize * 0.6], // 向上偏移 10 个单位
                   formatter: function () {
                     // 返回 HTML 标签，使用 rich 里定义的样式
                     return `{line|${that.useForm.useData}}`;
@@ -516,7 +517,7 @@ export default {
                   rich: {
                     line: {
                       color: "#fff", // 第二行文字颜色
-                      fontSize: 20, // 第二行文字大小
+                      fontSize: titleFontSize, // 第二行文字大小
                       lineHeight: 0, // 行高，实现间距
                     },
                   },
@@ -589,10 +590,11 @@ export default {
   justify-content: center;
   width: 100% !important;
   height: 100%;
+  padding: 10px 0;
 
   .sys_charts {
     width: 100%;
-    height: 1.6rem;
+    height: 160px;
   }
   .eer {
     width: 80%;
@@ -605,4 +607,17 @@ export default {
     margin: 10px 0;
   }
 }
+// 媒体查询，适配大于2000px分辨率的大屏样式
+@media (min-width: 2000px) {
+  .energy_content {
+    padding: 0.1rem 0 !important;
+    .sys_charts {
+      height: 1.6rem !important;
+    }
+    .eer {
+      font-size: 0.18rem !important;
+      margin: 0.2rem 0 !important;
+    }
+  }
+}
 </style>

src/views/bigScreen/components/useElect.vue

@@ -255,11 +255,23 @@ export default {
 
   .sys_charts {
     width: 100%;
-    height: 2rem;
+    height: 230px;
   }
   .eer {
     font-size: 18px;
     margin-top: 25px;
   }
 }
+// 媒体查询，适配大于2000px分辨率的大屏样式
+@media (min-width: 2000px) {
+  .energy_content {
+    .sys_charts {
+      height: 2.4rem !important;
+    }
+    .eer {
+      font-size: 0.18rem !important;
+      margin-top: 0.25rem !important;
+    }
+  }
+}
 </style>

src/views/bigScreen/components/waterSysEnergy.vue

@@ -479,6 +479,7 @@ export default {
             this.useForm.useData,
             this.useForm.maxData
           );
+          const titleFontSize = this.$refs.sys_charts.offsetWidth / 25;
           const adapterOption = {
             series: [
               {
@@ -509,7 +510,7 @@ export default {
                 label: {
                   show: true,
                   position: "center", // 文字显示在中心位置
-                  offset: [0, -5], // 向上偏移 10 个单位
+                  offset: [0, -titleFontSize * 0.6], // 向上偏移 10 个单位
                   formatter: function () {
                     // 返回 HTML 标签，使用 rich 里定义的样式
                     return `{line|${that.useForm.useData}}`;
@@ -517,7 +518,7 @@ export default {
                   rich: {
                     line: {
                       color: "#fff", // 第二行文字颜色
-                      fontSize: 20, // 第二行文字大小
+                      fontSize: titleFontSize, // 第二行文字大小
                       lineHeight: 0, // 行高，实现间距
                     },
                   },
@@ -590,10 +591,10 @@ export default {
   justify-content: center;
   width: 100% !important;
   height: 100%;
-
+  padding: 10px 0;
   .sys_charts {
     width: 100%;
-    height: 1.6rem;
+    height: 160px;
   }
   .eer {
     width: 80%;
@@ -606,4 +607,17 @@ export default {
     margin: 10px 0;
   }
 }
+// 媒体查询，适配大于2000px分辨率的大屏样式
+@media (min-width: 2000px) {
+  .energy_content {
+    padding: 0.1rem 0 !important;
+    .sys_charts {
+      height: 1.6rem !important;
+    }
+    .eer {
+      font-size: 0.18rem !important;
+      margin: 0.2rem 0 !important;
+    }
+  }
+}
 </style>

src/views/centerairC/enSourceAnalysis/components/deviceEnergy.vue

@@ -60,7 +60,6 @@
                 v-model="startYear"
                 type="year"
                 placeholder="选择开始年份"
-                style="width: 180px"
                 value-format="yyyy"
               >
               </el-date-picker>
@@ -69,7 +68,6 @@
                 v-model="endYear"
                 type="year"
                 placeholder="选择结束年份"
-                style="width: 180px"
                 value-format="yyyy"
               >
               </el-date-picker>

src/views/centerairC/enSourceAnalysis/components/equipment.vue

@@ -59,7 +59,6 @@
                 v-model="startYear"
                 type="year"
                 placeholder="选择开始年份"
-                style="width: 180px"
                 value-format="yyyy"
               >
               </el-date-picker>
@@ -68,7 +67,6 @@
                 v-model="endYear"
                 type="year"
                 placeholder="选择结束年份"
-                style="width: 180px"
                 value-format="yyyy"
               >
               </el-date-picker>

src/views/centerairC/enSourceAnalysis/components/machineRoom.vue

@@ -53,7 +53,6 @@
             v-model="startYear"
             type="year"
             placeholder="选择开始年份"
-            style="width: 180px"
             value-format="yyyy"
           >
           </el-date-picker>
@@ -62,7 +61,6 @@
             v-model="endYear"
             type="year"
             placeholder="选择结束年份"
-            style="width: 180px"
             value-format="yyyy"
           >
           </el-date-picker>

src/views/centerairC/temHistoryQuery/index.vue

@@ -7,10 +7,10 @@
           ref="queryForm"
           size="small"
           :inline="true"
-          label-width="68px"
         >
           <el-form-item label="日期" prop="msgCode">
             <el-date-picker
+              style="width: auto"
               v-model="monthValue"
               type="month"
               placeholder="选择月"
@@ -365,4 +365,10 @@ export default {
   height: 300px;
   margin-bottom: 0.1rem;
 }
+// 媒体查询，适配大于2000px分辨率的大屏样式
+@media (min-width: 2000px) {
+  .charts {
+    height: 3rem !important;
+  }
+}
 </style>

src/views/components/aircAndWindcMeter.vue

@@ -82,6 +82,12 @@ export default {
         const titleFontSize = (this.$refs.chart_ref.offsetWidth / 100) * 2;
         const colorList = ["#0882ff", "#ffe21e"]; // 提取颜色列表
         const adapterOption = {
+          //环形图中间文字
+          title: {
+            subtextStyle: {
+              fontSize: titleFontSize * 2,
+            },
+          },
           tooltip: {
             trigger: "item",
             formatter: "{a} <br/>{b} : {c} ({d}%)",
@@ -181,6 +187,12 @@ export default {
       } else {
         const titleFontSize = (this.$refs.chart_ref.offsetWidth / 100) * 2;
         const adapterOption = {
+          //环形图中间文字
+          title: {
+            subtextStyle: {
+              fontSize: titleFontSize * 2,
+            },
+          },
           tooltip: {
             trigger: "item",
             formatter: "{a} <br/>{b} : {c} ({d}%)",
@@ -353,7 +365,7 @@ export default {
             //颜色
             itemStyle: {
               color: function (colors) {
-                var colorList = ["#02427f","#385f5c", ];
+                var colorList = ["#02427f", "#385f5c"];
                 return colorList[colors.dataIndex];
               },
             },

src/views/components/temMeter.vue

@@ -82,6 +82,12 @@ export default {
         const titleFontSize = (this.$refs.chart_ref.offsetWidth / 100) * 2;
         const colorList = ["#ffe21e", "#08c8ff"]; // 提取颜色列表
         const adapterOption = {
+          //环形图中间文字
+          title: {
+            subtextStyle: {
+              fontSize: titleFontSize * 2,
+            },
+          },
           tooltip: {
             trigger: "item",
             formatter: "{a} <br/>{b} : {c} ({d}%)",
@@ -181,6 +187,12 @@ export default {
       } else {
         const titleFontSize = (this.$refs.chart_ref.offsetWidth / 100) * 2;
         const adapterOption = {
+          //环形图中间文字
+          title: {
+            subtextStyle: {
+              fontSize: titleFontSize * 2,
+            },
+          },
           tooltip: {
             trigger: "item",
             formatter: "{a} <br/>{b} : {c} ({d}%)",

src/views/components/viewColdSys.vue

@@ -470,6 +470,7 @@ export default {
           this.useForm.useData,
           this.useForm.maxData
         );
+        const titleFontSize = this.$refs.sys_charts.offsetWidth / 20;
         const adapterOption = {
           series: [
             {
@@ -500,7 +501,7 @@ export default {
               label: {
                 show: true,
                 position: "center", // 文字显示在中心位置
-                offset: [0, -5], // 向上偏移 10 个单位
+                offset: [0, -titleFontSize * 0.6], // 向上偏移 10 个单位
                 formatter: function () {
                   // 返回 HTML 标签，使用 rich 里定义的样式
                   return `{line|${that.useForm.useData}}`;
@@ -508,8 +509,8 @@ export default {
                 rich: {
                   line: {
                     color: "#fff", // 第二行文字颜色
-                    fontSize: 20, // 第二行文字大小
+                    fontSize: titleFontSize, // 第二行文字大小
-                    lineHeight: 0, // 行高，实现间距
+                    lineHeight: 5, // 行高，实现间距
                   },
                 },
               },
@@ -590,4 +591,14 @@ export default {
     margin-top: 25px;
   }
 }
+// 媒体查询，适配大于2000px分辨率的大屏样式
+@media (min-width: 2000px) {
+  .sys_charts {
+    height: 1.5rem !important;
+  }
+  .eer {
+    font-size: 0.18rem !important;
+    margin-top: 0.25rem !important;
+  }
+}
 </style>

src/views/components/waterTank.vue

@@ -109,4 +109,10 @@ export default {
     width: 76px !important;
   }
 }
+// 媒体查询，适配大于2000px分辨率的大屏样式-element样式
+@media (min-width: 2000px) {
+  .water {
+    bottom: 0rem !important;
+  }
+}
 </style>

src/views/device/comm/index.vue

@@ -7,7 +7,6 @@
           ref="queryForm"
           size="small"
           :inline="true"
-          label-width="68px"
         >
           <el-form-item label="仪表类型" prop="mtType">
             <el-select
@@ -168,8 +167,8 @@
     />
 
     <!-- 添加或修改设备参数对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="700px" append-to-body>
+    <el-dialog :title="title" :visible.sync="open" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+      <el-form ref="form" :model="form" :rules="rules">
         <el-row type="flex" justify="center">
           <el-col :span="12">
             <el-form-item label="仪表类型" prop="mtType">
@@ -446,3 +445,35 @@ export default {
   },
 };
 </script>
+<style scoped lang="scss">
+/* 媒体查询，适配大于2000px分辨率的大屏样式 - element样式 */
+@media (max-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 700px !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 110px !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+@media (min-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 7.5rem !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 1.1rem !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+</style>
+

src/views/device/gateway/index.vue

@@ -7,7 +7,6 @@
           ref="queryForm"
           size="small"
           :inline="true"
-          label-width="68px"
         >
           <el-form-item label="网关名称" prop="gwName">
             <el-input
@@ -194,8 +193,8 @@
     />
 
     <!-- 添加或修改网关对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="700px" append-to-body>
+    <el-dialog :title="title" :visible.sync="open" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+      <el-form ref="form" :model="form" :rules="rules">
         <el-row type="flex" justify="center">
           <el-col :span="12">
             <el-form-item label="网关名称" prop="gwName">
@@ -500,3 +499,35 @@ export default {
   },
 };
 </script>
+<style scoped lang="scss">
+/* 媒体查询，适配大于2000px分辨率的大屏样式 - element样式 */
+@media (max-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 700px !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 110px !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+@media (min-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 7.5rem !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 1.1rem !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+</style>
+

src/views/device/gather/index.vue

@@ -7,7 +7,6 @@
           ref="queryForm"
           size="small"
           :inline="true"
-          label-width="90px"
         >
           <el-form-item label="仪表类型" prop="mtType">
             <el-select
@@ -305,8 +304,8 @@
     />
 
     <!-- 添加或修改设备采集参数对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="700px" append-to-body>
+    <el-dialog :title="title" :visible.sync="open" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
+      <el-form ref="form" :model="form" :rules="rules">
         <el-row type="flex" justify="center">
           <el-col :span="12">
             <el-form-item label="仪表类型" prop="mtType">
@@ -916,3 +915,35 @@ export default {
   },
 };
 </script>
+<style scoped lang="scss">
+/* 媒体查询，适配大于2000px分辨率的大屏样式 - element样式 */
+@media (max-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 700px !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 140px !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+@media (min-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 7.5rem !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 1.4rem !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+</style>
+

src/views/device/ledger/index.vue

@@ -7,7 +7,6 @@
           ref="queryForm"
           size="small"
           :inline="true"
-          label-width="68px"
         >
           <el-form-item label="设备名称" prop="deviceName">
             <el-input
@@ -216,8 +215,8 @@
     />
 
     <!-- 添加或修改设备台账对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="700px" append-to-body>
+    <el-dialog :title="title" :visible.sync="open" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="120px">
+      <el-form ref="form" :model="form" :rules="rules">
         <el-row type="flex" justify="center">
           <el-col :span="12">
             <el-form-item label="设备名称" prop="deviceName">
@@ -596,3 +595,34 @@ export default {
   },
 };
 </script>
+<style scoped lang="scss">
+/* 媒体查询，适配大于2000px分辨率的大屏样式 - element样式 */
+@media (max-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 700px !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 150px !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+@media (min-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 7.5rem !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 1.5rem !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+</style>

src/views/device/maintenance/index.vue

@@ -81,7 +81,6 @@
           ref="queryForm"
           size="small"
           :inline="true"
-          label-width="68px"
         >
           <el-form-item label="设备类型" prop="deviceType">
             <el-select
@@ -287,8 +286,8 @@
     />
 
     <!-- 添加或修改维保对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="700px" append-to-body>
+    <el-dialog :title="title" :visible.sync="open" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+      <el-form ref="form" :model="form" :rules="rules">
         <el-row type="flex" justify="center">
           <el-col :span="12">
             <el-form-item label="维保类型" prop="maintainType">
@@ -833,3 +832,34 @@ export default {
   }
 }
 </style>
+<style scoped lang="scss">
+/* 媒体查询，适配大于2000px分辨率的大屏样式 - element样式 */
+@media (max-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 700px !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 110px !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+@media (min-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 7.5rem !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 1.1rem !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+</style>

src/views/device/qrCode/index.vue

@@ -7,7 +7,6 @@
           ref="queryForm"
           size="small"
           :inline="true"
-          label-width="90px"
         >
           <el-form-item label="二维码状态" prop="status">
             <el-select
@@ -195,8 +194,8 @@
     />
 
     <!-- 修改二维码对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="700px" append-to-body>
+    <el-dialog :title="title" :visible.sync="open" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="120px">
+      <el-form ref="form" :model="form" :rules="rules">
         <el-row type="flex" justify="center">
           <el-col :span="24">
             <el-form-item label="二维码序列号" prop="serialNum">
@@ -259,7 +258,6 @@
     <el-dialog
       title="二维码预览"
       :visible.sync="isCodePreview"
-      width="500px"
       append-to-body
     >
       <div class="dialog-img">
@@ -270,14 +268,12 @@
     <el-dialog
       title="批量生成二维码"
       :visible.sync="isMoreqrCode"
-      width="500px"
       append-to-body
     >
       <el-form
         ref="qrCodeForm"
         :model="qrCodeForm"
         :rules="qrCodeForms"
-        label-width="120px"
       >
         <el-row type="flex" justify="center">
           <el-col :span="24">
@@ -554,3 +550,34 @@ export default {
   color: red;
 }
 </style>
+<style scoped lang="scss">
+/* 媒体查询，适配大于2000px分辨率的大屏样式 - element样式 */
+@media (max-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 500px !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 150px !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+@media (min-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 5rem !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 1.5rem !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+</style>

src/views/device/spare/index.vue

@@ -7,7 +7,6 @@
           ref="queryForm"
           size="small"
           :inline="true"
-          label-width="90px"
         >
           <el-form-item label="备件序列号" prop="serialNum">
             <el-input
@@ -178,8 +177,8 @@
     />
 
     <!-- 添加或修改备件库存对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="700px" append-to-body>
+    <el-dialog :title="title" :visible.sync="open" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="95px">
+      <el-form ref="form" :model="form" :rules="rules">
         <el-row type="flex" justify="center">
           <el-col :span="12">
             <el-form-item label="设备序列号" prop="serialNum">
@@ -460,3 +459,34 @@ export default {
   },
 };
 </script>
+<style scoped lang="scss">
+/* 媒体查询，适配大于2000px分辨率的大屏样式 - element样式 */
+@media (max-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 700px !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 140px !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+@media (min-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 7.5rem !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 1.4rem !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+</style>

src/views/device/spareInOut/index.vue

@@ -7,7 +7,6 @@
           ref="queryForm"
           size="small"
           :inline="true"
-          label-width="90px"
         >
           <el-form-item label="备件序列号" prop="serialNum">
             <el-input
@@ -147,10 +146,10 @@
     />
 
     <!-- 出入库对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="700px" append-to-body>
+    <el-dialog :title="title" :visible.sync="open" append-to-body>
-      <el-form ref="form" label-width="95px">
+      <el-form ref="form">
         <el-table :data="dialogList">
-          <el-table-column label="备件名称" prop="spareName" width="200">
+          <el-table-column label="备件名称" prop="spareName" min-width="200">
             <template slot-scope="scope">
               <el-select
                 v-model="scope.row.sparePartsId"
@@ -166,7 +165,7 @@
               </el-select>
             </template>
           </el-table-column>
-          <el-table-column label="数量" width="150">
+          <el-table-column label="数量" min-width="150">
             <template slot-scope="scope">
               <el-input
                 placeholder="请填写"
@@ -176,9 +175,9 @@
               ></el-input>
             </template>
           </el-table-column>
-          <el-table-column label="当前库存" width="150" prop="inventoryLevels">
+          <el-table-column label="当前库存" min-width="150" prop="inventoryLevels">
           </el-table-column>
-          <el-table-column prop="data1" label="操作" width="130">
+          <el-table-column prop="data1" label="操作" min-width="130">
             <template slot-scope="scope">
               <div class="table-btn">
                 <div class="delete-btn">
@@ -434,3 +433,34 @@ export default {
   },
 };
 </script>
+<style scoped lang="scss">
+/* 媒体查询，适配大于2000px分辨率的大屏样式 - element样式 */
+@media (max-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 700px !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 140px !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+@media (min-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 7.5rem !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 1.4rem !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+</style>

src/views/hotWater/waterControl/index.vue

@@ -1437,6 +1437,105 @@ export default {
     }
   }
 }
+// 媒体查询，适配大于2000px分辨率的大屏样式
+@media (min-width: 2000px) {
+  .app-container {
+    .left-tree {
+      width: 2.56rem !important;
+      padding: 0.15rem 0.1rem !important;
+      min-height: 8rem !important;
+      .status {
+        margin-top: 0.2rem !important;
+        .status-li {
+          margin-bottom: 0.15rem !important;
+        }
+        .status1,
+        .status2,
+        .status3,
+        .status4 {
+          margin-bottom: 0.05rem !important;
+        }
+        .status1::before,
+        .status2::before,
+        .status3::before,
+        .status4::before {
+          width: 0.1rem !important;
+          height: 0.1rem !important;
+          margin-right: 0.05rem !important;
+        }
+      }
+    }
+    .right-monitor {
+      width: calc(100% - 2.8rem) !important;
+      .buildingDiv {
+        padding-left: 0.54rem !important;
+        margin-bottom: 0.2rem !important;
+        .title-bg {
+          width: 2.08rem !important;
+          height: 0.38rem !important;
+        }
+        .title-word {
+          font-size: 0.24rem !important;
+        }
+      }
+      .monitor-context {
+        height: 6.4rem !important;
+      }
+    }
+    .monitor-context {
+      height: 6.5rem !important;
+      .monitor-li {
+        min-height: 1.6rem !important;
+        width: calc(33.33% - 0.2rem) !important;
+        margin: 0 0.1rem !important;
+        padding-bottom: 0.25rem !important;
+        margin-bottom: 0.16rem !important;
+        border-radius: 0.1rem !important;
+        .monitor-title {
+          height: 0.5rem !important;
+          font-size: 0.18rem !important;
+          line-height: 0.4rem !important;
+        }
+        .monitor-flex {
+          margin-top: 0.2rem !important;
+          .monitor-flex-left {
+            .control-bottom {
+              margin-top: 0.2rem !important;
+            }
+            .ash {
+              margin-right: 0.08rem !important;
+            }
+            .words-li {
+              font-size: 0.16rem !important;
+              line-height: 0.28rem !important;
+              margin-bottom: 0.1rem !important;
+            }
+            .control-bottom {
+              .words-li4 {
+                .ash {
+                  width: 1.3rem !important;
+                }
+              }
+              .words-li5 {
+                .ash2 {
+                  width: 1rem !important;
+                }
+              }
+              .words-li6 {
+                .ash2 {
+                  width: 1rem !important;
+                }
+              }
+            }
+          }
+        }
+      }
+      .monitor-li::before {
+        border-radius: 0.1rem !important;
+      }
+    }
+  }
+}
 </style>
 <style scoped>
 /* 自定义高亮颜色 */

src/views/login.vue

@@ -256,7 +256,7 @@ export default {
     line-height: 25px;
     letter-spacing: 0px;
     text-shadow: 0px 2px 1px rgba(120, 200, 247, 0.3);
-    background-image: linear-gradient(to bottom,  #FFFFFF,#B0DBFF);
+    background-image: linear-gradient(to bottom, #ffffff, #b0dbff);
     background-clip: text;
     -webkit-background-clip: text;
     color: transparent;
@@ -325,4 +325,48 @@ export default {
     right: auto !important;
   }
 }
+// 媒体查询，适配大于2000px分辨率的大屏样式
+@media (min-width: 2000px) {
+  .login-form {
+    width: 5.08rem !important;
+    height: 5.42rem !important;
+    padding: 1.33rem 0.84rem 0.84rem 0.84rem !important;
+    .title {
+      margin: 0px auto 0.48rem auto !important;
+      font-size: 0.34rem !important;
+      line-height: 0.25rem !important;
+    }
+
+    .el-input {
+      height: 0.56rem !important;
+      input {
+        height: 0.56rem !important;
+      }
+    }
+    .el-input__inner {
+      border: solid 0.02rem #0662a4 !important;
+      font-size: 0.16rem !important;
+    }
+    .el-form-item {
+      margin-bottom: 0.28rem !important;
+    }
+    .el-input--prefix .el-input__inner {
+      padding-left: 0.57rem !important;
+      padding-top: 0.19rem !important;
+      padding-bottom: 0.19rem !important;
+    }
+    .input-icon {
+      height: 0.24rem !important;
+      width: 0.24rem !important;
+      margin-left: 0.13rem !important;
+    }
+    .show-pwd {
+      margin-right: 0.05rem !important;
+      font-size: 0.16rem !important;
+    }
+    .el-button--medium{
+      height: 0.53rem !important;
+    }
+  }
+}
 </style>

src/views/region/index.vue

@@ -1343,6 +1343,18 @@ export default {
     }
   }
 }
+// 媒体查询，适配大于2000px分辨率的大屏样式
+@media (min-width: 2000px) {
+  .left-tree {
+    width: 3.5rem !important;
+    padding: 0.15rem 0.1em !important;
+    height: 8rem !important;
+  }
+  .treeTable {
+    margin-left: 0.2rem !important;
+    width: calc(100% - 3, 7rem) !important;
+  }
+}
 </style>
 <style scoped>
 /* 自定义高亮颜色 */

src/views/system/user/authRole.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
     <h4 class="form-header h4">基本信息</h4>
-    <el-form ref="form" :model="form" label-width="80px">
+    <el-form ref="form" :model="form">
       <el-row>
         <el-col :span="8" :offset="2">
           <el-form-item label="用户昵称" prop="nickName">

src/views/system/user/index.vue

@@ -16,20 +16,20 @@
         <!--用户数据-->
         <pane size="84">
           <el-col>
-            <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+            <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" >
               <el-form-item label="用户名称" prop="userName">
-                <el-input v-model="queryParams.userName" placeholder="请输入用户名称" clearable style="width: 240px" @keyup.enter.native="handleQuery" />
+                <el-input v-model="queryParams.userName" placeholder="请输入用户名称" clearable  @keyup.enter.native="handleQuery" />
               </el-form-item>
               <el-form-item label="手机号码" prop="phonenumber">
-                <el-input v-model="queryParams.phonenumber" placeholder="请输入手机号码" clearable style="width: 240px" @keyup.enter.native="handleQuery" />
+                <el-input v-model="queryParams.phonenumber" placeholder="请输入手机号码" clearable  @keyup.enter.native="handleQuery" />
               </el-form-item>
               <el-form-item label="状态" prop="status">
-                <el-select v-model="queryParams.status" placeholder="用户状态" clearable style="width: 240px">
+                <el-select v-model="queryParams.status" placeholder="用户状态" clearable >
                   <el-option v-for="dict in dict.type.sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
                 </el-select>
               </el-form-item>
               <el-form-item label="创建时间">
-                <el-date-picker v-model="dateRange" style="width: 240px" value-format="yyyy-MM-dd" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
+                <el-date-picker v-model="dateRange"  value-format="yyyy-MM-dd" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
               </el-form-item>
               <div style="margin-bottom: 15px;">
                 <div class="primary-btn"><el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button></div>
@@ -95,8 +95,8 @@
     </el-row>
 
     <!-- 添加或修改用户配置对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
+    <el-dialog :title="title" :visible.sync="open" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+      <el-form ref="form" :model="form" :rules="rules">
         <el-row>
           <el-col :span="12">
             <el-form-item label="用户昵称" prop="nickName">
@@ -551,3 +551,37 @@ export default {
   }
 };
 </script>
+<style scoped lang="scss">
+/* 媒体查询，适配大于2000px分辨率的大屏样式 - element样式 */
+@media (max-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 700px !important;
+  }
+    ::v-deep .el-form-item--medium .el-form-item__content {
+    width: 100%;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 110px !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+@media (min-width: 2000px) {
+  ::v-deep .el-dialog {
+    width: 7rem !important;
+  }
+
+  ::v-deep .el-dialog .el-form-item__label {
+    width: 1.1rem !important;
+  }
+  ::v-deep .el-dialog .el-form-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+}
+</style>

src/views/temSys/temHistory/index.vue

@@ -321,9 +321,51 @@ export default {
     height: 750px !important;
   }
 }
+// 媒体查询，适配大于2000px分辨率的大屏样式
+@media (min-width: 2000px) {
+  .elCascader {
+    width: 3.5rem !important;
+  }
+  .history {
+    .history-li {
+      width: calc(49% - 0.2rem) !important;
+      height: 3.4rem !important;
+      margin: 0 0.1rem !important;
+      padding: 0.2rem !important;
+      border-radius: 0.2rem !important;
+      margin-bottom: 0.2rem !important;
+      .history-top {
+        .room {
+          font-size: 0.2rem !important;
+        }
+        .change {
+          width: 0.3rem !important;
+          height: 0.3rem !important;
+        }
+      }
+      .title {
+        font-size: 0.15rem !important;
+        margin: 0.1rem 0 !important;
+      }
+    }
+    .oneClass {
+      width: 100% !important;
+      height: 7.5rem !important;
+    }
+    .twoClass {
+      height: 7.5rem !important;
+    }
+  }
+}
 </style>
 <style scoped>
 .elCascader >>> .el-input__inner::placeholder {
   color: transparent !important;
 }
+/* // 媒体查询，适配大于2000px分辨率的大屏样式 */
+@media (min-width: 2000px) {
+  .condition-left >>> .el-form-item__label {
+    width: 0.68rem !important;
+  }
+}
 </style>

src/views/temSys/temMonitor/index.vue

@@ -212,7 +212,7 @@ export default {
               return item.label && item.label.includes("温度监测");
             });
           }
-          console.log("newRes.data[0]",newRes.data[0])
+          console.log("newRes.data[0]", newRes.data[0]);
           // 指定要保留的最大层级（从 1 开始计数），这里假设指定为第 4 级
           const targetLevel = 4;
           // 从 data[0] 开始处理，当前层级为 1
@@ -878,6 +878,110 @@ export default {
     width: calc(100% - 40px) !important;
   }
 }
+// 媒体查询，适配大于2000px分辨率的大屏样式
+@media (min-width: 2000px) {
+  .app-container {
+    .left-tree {
+      width: 2.56rem !important;
+      padding: 0.15rem 0.1rem 0.1rem 0.1rem !important;
+    }
+    .right-monitor {
+      width: calc(100% - 2.8rem) !important;
+      .buildingDiv {
+        padding-left: 0.54rem !important;
+        margin-bottom: 0.2rem !important;
+        .title-bg {
+          width: 2.08rem !important;
+          height: 0.38rem !important;
+        }
+        .title-word {
+          font-size: 0.24rem !important;
+        }
+        .buildingDiv-right {
+          margin-right: 0.2rem !important;
+          font-size: 0.18rem !important;
+          .wanrn-li {
+            margin-right: 0.5rem !important;
+            .el-icon-message-solid {
+              margin-right: 0.03rem !important;
+            }
+            .red-text {
+              font-size: 0.2rem !important;
+              margin-left: 0.05rem !important;
+            }
+            .gray-text {
+              font-size: 0.2rem !important;
+              margin-left: 0.05rem !important;
+            }
+          }
+        }
+      }
+      .tem-data {
+        height: 8rem !important;
+        .tem-li {
+          width: calc(33.33% - 0.2rem) !important;
+          height: 2.55rem !important;
+          padding: 0.2rem !important;
+          margin: 0 0.1rem 0.2rem 0.1rem !important;
+          .temli-top {
+            font-size: 0.18rem !important;
+            margin-bottom: 0.15rem !important;
+            .top-right {
+              .online {
+                margin: 0 0.15rem 0 0 !important;
+                width: 0.25rem !important;
+                height: 0.18rem !important;
+              }
+            }
+          }
+          .temli-title {
+            height: 0.4rem !important;
+            font-size: 0.2rem !important;
+            margin-left: 0.07rem !important;
+          }
+          .warning-img {
+            width: 0.35rem !important;
+            height: 0.35rem !important;
+            margin-right: 0.1rem !important;
+          }
+          .tem {
+            font-size: 0.18rem !important;
+            .tem-word {
+              .tem-img {
+                width: 0.8rem !important;
+                height: 0.8rem !important;
+                margin-right: 0.15rem !important;
+              }
+              .tem-middle {
+                .en-text {
+                  font-size: 0.13rem !important;
+                  margin-top: 0.1rem !important;
+                }
+              }
+            }
+            .tem-right {
+              font-size: 0.16rem !important;
+              margin-top: 0.15rem !important;
+              .tem-num {
+                font-size: 0.3rem !important;
+                margin-right: 0.1rem !important;
+              }
+            }
+          }
+          .details {
+            width: 0.4rem !important;
+            height: 0.4rem !important;
+            line-height: 0.4rem !important;
+          }
+        }
+      }
+    }
+  }
+  .charts {
+    width: 870px;
+    height: 300px;
+  }
+}
 </style>
 <style scoped>
 /* 自定义高亮颜色 */