样式修复

src/views/index.vue

@@ -3,7 +3,7 @@
  * @Author: wangcc
  * @Date: 2022-07-06 15:56:45
  * @LastEditors: wangcc
- * @LastEditTime: 2022-11-11 14:31:09
+ * @LastEditTime: 2022-12-08 16:31:08
  * @FilePath: \castgroup_bigscreen\src\views\index.vue
  * @Copyright: Copyright (c) 2016~2022 by wangcc, All Rights Reserved. 
 -->
@@ -131,11 +131,13 @@
 
     <section class="right-wrap">
       <PickerAddr />
-      <div v-if="showbase" class="xiaoban u-flex">
-        <div class="title">基地查询：</div>
-        <el-input v-model="baseinput" placeholder="请输入基地名称">
-          <i class="el-icon-search el-input__icon" slot="suffix" @click="basesearch"></i>
-        </el-input>
+      <div v-if="showbase" class="xiaoban u-flex" style="width:100%;justify-content: right;">
+        <div class="selectBox">
+          <div class="title">基地查询：</div>
+          <el-input v-model="baseinput" placeholder="请输入基地名称">
+            <i class="el-icon-search el-input__icon" slot="suffix" @click="basesearch"></i>
+          </el-input>
+        </div>
       </div>
       <div class="right_xiaoban">
         <div class="tab-box" v-if="showxiaoban">
@@ -419,7 +421,7 @@ export default {
     '$store.state.addr.selectProject'(val) {
       // console.log('addr.selectProject',val);
       this.getPageData();
-    },
+    }
   },
   methods: {
     ...mapMutations([
@@ -508,7 +510,7 @@ export default {
         cityId: this.$store.state.addr.selectCity.areaId,
         countyId: this.$store.state.addr.selectDistrict.areaId,
         townId: this.$store.state.addr.selectStreet.areaId,
-        courseId:this.$store.state.addr.selectProject.ProjectID,
+        courseId: this.$store.state.addr.selectProject.ProjectID
       };
       page1numerical(param)
         .then((res) => {
@@ -524,7 +526,7 @@ export default {
         cityId: this.$store.state.addr.selectCity.areaId,
         countyId: this.$store.state.addr.selectDistrict.areaId,
         townId: this.$store.state.addr.selectStreet.areaId,
-        courseId:this.$store.state.addr.selectProject.ProjectID,
+        courseId: this.$store.state.addr.selectProject.ProjectID
       };
       // console.log('cityId',param.cityId);
       page1echarts01(param)
@@ -553,7 +555,7 @@ export default {
         cityId: this.$store.state.addr.selectCity.areaId,
         countyId: this.$store.state.addr.selectDistrict.areaId,
         townId: this.$store.state.addr.selectStreet.areaId,
-        courseId:this.$store.state.addr.selectProject.ProjectID,
+        courseId: this.$store.state.addr.selectProject.ProjectID
       };
       // console.log('cityId',param.cityId);
       page1echarts02(param)
@@ -583,9 +585,9 @@ export default {
         cityId: this.$store.state.addr.selectCity.areaId,
         countyId: this.$store.state.addr.selectDistrict.areaId,
         townId: this.$store.state.addr.selectStreet.areaId,
-        courseId:this.$store.state.addr.selectProject.ProjectID,
-        pageNum:1,
-        pageSize:50,
+        courseId: this.$store.state.addr.selectProject.ProjectID,
+        pageNum: 1,
+        pageSize: 50
       };
       rightScrollData(param)
         .then((res) => {
@@ -609,7 +611,8 @@ export default {
             ]);
           });
           this.scrollBoardKey = Date.now();
-          this.$refs.scrollBoard&&this.$refs.scrollBoard.updateRows(this.scrollBoardConfig.data);
+          this.$refs.scrollBoard &&
+            this.$refs.scrollBoard.updateRows(this.scrollBoardConfig.data);
 
           // console.log('this.scrollBoardConfig.data', this.scrollBoardConfig.data);
           // this.scrollBoardConfig = res.data;
@@ -624,8 +627,8 @@ export default {
         cityId: this.$store.state.addr.selectCity.areaId,
         countyId: this.$store.state.addr.selectDistrict.areaId,
         townId: this.$store.state.addr.selectStreet.areaId,
-        pageNum:1,
-        pageSize:50,
+        pageNum: 1,
+        pageSize: 50
       };
       projectList(param)
         .then((res) => {
@@ -639,7 +642,7 @@ export default {
           // }
 
           let that = this;
-          
+
           this.scrollPeojectConfig.data = [];
           res.rows.forEach((element) => {
             this.scrollPeojectConfig.data.push([
@@ -656,25 +659,26 @@ export default {
           );
 
           //监听是否有选中项目,有的话高亮
-          let timer1 = setInterval(function(){ // 每 10 毫秒检查一下 html 是否已存在
+          let timer1 = setInterval(function () {
+            // 每 10 毫秒检查一下 html 是否已存在
             let domId = that.$store.state.addr.selectProject.ProjectID;
-            let dom = document.getElementById(that.$store.state.addr.selectProject.ProjectID);
+            let dom = document.getElementById(
+              that.$store.state.addr.selectProject.ProjectID
+            );
             // console.log('dom',domId);
-            if(domId&&dom){
+            if (domId && dom) {
               // console.log('dom',dom.classList);
-              if(dom.classList.contains('active')==true){
+              if (dom.classList.contains('active') == true) {
                 // clearInterval(timer1);
-              }else{
+              } else {
                 dom.classList.add('active');
               }
-              
-            }  
-          },500);
+            }
+          }, 500);
 
           // setTimeout(() => {
           //   this.$store.state.addr.selectProject.ProjectID&&document.getElementById(this.$store.state.addr.selectProject.ProjectID).classList.add('active');
           // }, 2000);
-         
 
           // console.log('this.scrollBoardConfig.data', this.scrollBoardConfig.data);
           // this.scrollBoardConfig = res.data;
@@ -775,7 +779,7 @@ export default {
         countyId: this.$store.state.addr.selectDistrict.areaId,
         townId: this.$store.state.addr.selectStreet.areaId,
         smallNumber: this.xiaobaninput,
-        courseId:this.$store.state.addr.selectProject.ProjectID,
+        courseId: this.$store.state.addr.selectProject.ProjectID
       };
       page2numerical(param)
         .then((res) => {
@@ -792,7 +796,7 @@ export default {
         cityId: this.$store.state.addr.selectCity.areaId,
         countyId: this.$store.state.addr.selectDistrict.areaId,
         townId: this.$store.state.addr.selectStreet.areaId,
-        courseId:this.$store.state.addr.selectProject.ProjectID,
+        courseId: this.$store.state.addr.selectProject.ProjectID
       };
       page2echarts01(param)
         .then((res) => {
@@ -812,7 +816,7 @@ export default {
         cityId: this.$store.state.addr.selectCity.areaId,
         countyId: this.$store.state.addr.selectDistrict.areaId,
         townId: this.$store.state.addr.selectStreet.areaId,
-        courseId:this.$store.state.addr.selectProject.ProjectID,
+        courseId: this.$store.state.addr.selectProject.ProjectID
       };
       page2echarts02(param)
         .then((res) => {
@@ -912,7 +916,7 @@ export default {
         cityId: this.$store.state.addr.selectCity.areaId,
         countyId: this.$store.state.addr.selectDistrict.areaId,
         townId: this.$store.state.addr.selectStreet.areaId,
-        courseId:this.$store.state.addr.selectProject.ProjectID,
+        courseId: this.$store.state.addr.selectProject.ProjectID
       };
       page2echarts03(param)
         .then((res) => {
@@ -1251,7 +1255,7 @@ export default {
       // let nodeList = document.getElementsByClassName('row-item');
       //删除这些标签对应的class
       Array.prototype.forEach.call(nodeList, (el) => {
-        el&&el.classList.remove(className);
+        el && el.classList.remove(className);
       });
     },
     scrollProjectClick(e) {
@@ -1273,7 +1277,7 @@ export default {
       // proClass[e.rowIndex]&&proClass[e.rowIndex].classList.add('active');
 
       let rowId = e.row[4];
-      this.changeSelectProject({ProjectID:rowId,ProjectName:e.row[0]});
+      this.changeSelectProject({ ProjectID: rowId, ProjectName: e.row[0] });
       document.getElementById(rowId).classList.add('active');
       let param = {
         courseId: rowId
@@ -1435,4 +1439,9 @@ export default {
   border: 1px solid rgba(0, 250, 253, 1);
   background: #04916e;
 }
+.selectBox{
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
 </style>