人员筛选列表宽度动态变化

src/views/components/xiaoqu/bottomList.vue

@@ -128,6 +128,9 @@ export default {
     "queryParamsXiaoqu.type"(newValue, oldValue) {
       this.handleChange();
     },
+    "queryParamsXiaoqu.buildingId"(newValue, oldValue) {
+      this.handleChange();
+    },
   },
   created() {
     this.handleChange();
@@ -135,10 +138,23 @@ export default {
   methods: {
     handleChange(newValue) {
       this.reset();
-
       this.queryParams = { ...this.queryParams, ...this.queryParamsXiaoqu };
-      this.queryParams.buildingid = undefined;
-      this.queryParams.deptId = undefined;
+      setTimeout(() => {
+        const list = document.getElementsByClassName("foldPane-bottom")[0];
+        const build = document.getElementsByClassName("building-container")[0];
+        if (this.queryParams.buildingId) {
+          list.style.left = `390px`;
+          list.style.width = `calc(100% - (390px + ${build.offsetWidth}px) )`;
+          list.style.transform = `translateX(0)`;
+        } else {
+          list.style.left = ``;
+          list.style.width = ``;
+          list.style.transform = ``;
+        }
+      }, 500);
+
+      // this.queryParams.buildingid = undefined;
+      // this.queryParams.deptId = undefined;
       this.disabled = false;
       this.load();
     },